@ukho/admiralty-core 5.2.0-next.4 → 5.2.0-next.6

package/dist/admiralty/p-c582be5d.entry.js

@@ -0,0 +1,2 @@
+import{r as a,h as t,g as r}from"./p-71979ff5.js";const o=".visually-hidden.sc-admiralty-button:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-button{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-button{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-button{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-button{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-button{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-button{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-button{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-button{display:none}}button.primary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.primary:focus.sc-admiralty-button-s>*,button.primary:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.primary.sc-admiralty-button:disabled{cursor:default}button.primary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.primary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.primary.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.primary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:hover{background-color:var(--admiralty-colour-primary-shade);border:2px solid var(--admiralty-colour-primary-shade);color:var(--admiralty-colour-primary-contrast);border-color:var(--admiralty-colour-primary-shade);padding:var(--admiralty-button-primary-hover-padding, 10px var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:hover:focus{padding:var(--admiralty-button-primary-hover-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.primary.sc-admiralty-button:hover:focus:active{padding:var(--admiralty-button-primary-hover-focus-active-padding, 10px var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.secondary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary)}button.secondary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.secondary:focus.sc-admiralty-button-s>*,button.secondary:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.secondary.sc-admiralty-button:disabled{cursor:default}button.secondary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.secondary.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.secondary.sc-admiralty-button:hover{background-color:var(--admiralty-hover-background-colour);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary-shade);padding:var(--admiralty-button-secondary-hover-padding, 10px var(--admiralty-spacing-4))}button.secondary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.secondary.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.warning.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-danger);color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.warning:focus.sc-admiralty-button-s>*,button.warning:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.warning.sc-admiralty-button:disabled{cursor:default}button.warning.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.warning.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.warning.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.warning.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.warning.sc-admiralty-button:hover{background-color:var(--admiralty-colour-danger-shade);color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger-shade);padding:var(--admiralty-button-warning-hover-padding, 10px var(--admiralty-spacing-4))}button.warning.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger-contrast);color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.warning.sc-admiralty-button:disabled>*.sc-admiralty-button{opacity:0.5}button.warning.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-danger-contrast)}button.text.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.text:focus.sc-admiralty-button-s>*,button.text:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.text.sc-admiralty-button:disabled{cursor:default}button.text.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.text.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.text.sc-admiralty-button:enabled:active{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:disabled{color:var(--admiralty-disabled-colour)}button.text.sc-admiralty-button:disabled>*.sc-admiralty-button{opacity:0.5}button.text.sc-admiralty-button:focus{border:none;box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-focus-contrast);text-decoration:none;padding:var(--admiralty-button-text-focus-padding, var(--admiralty-spacing-0))}button.text:focus.sc-admiralty-button-s>*,button.text:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.text.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.icon.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;min-height:44px;min-width:50px;background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary);padding:var(--admiralty-button-icon-padding, var(--admiralty-spacing-2))}button.icon.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.icon:focus.sc-admiralty-button-s>*,button.icon:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.icon.sc-admiralty-button:disabled{cursor:default}button.icon.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.icon.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.icon.sc-admiralty-button:focus{padding:var(--admiralty-button-icon-focus-padding, var(--admiralty-spacing-3) var(--admiralty-spacing-4) var(--admiralty-spacing-2))}button.icon.sc-admiralty-button:hover{background-color:var(--admiralty-colour-primary-shade);border:2px solid var(--admiralty-colour-primary);padding:var(--admiralty-button-icon-hover-padding, var(--admiralty-spacing-2))}button.icon.sc-admiralty-button admiralty-icon.icon-padding.sc-admiralty-button{padding-left:8px}button.icon.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary)}button.icon.sc-admiralty-button:enabled:active admiralty-icon.sc-admiralty-button{color:var(--admiralty-colour-primary) !important}button.icon.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour);opacity:0.3}button.icon.borderless.sc-admiralty-button{border:none;background-color:yellow}button.icon.sc-admiralty-button:active:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour);opacity:0.3}button.icon.sc-admiralty-button i.sc-admiralty-button{margin:auto;font-size:unset;color:unset;padding-left:unset}button.icon-secondary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;min-height:44px;min-width:50px;background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary);padding:9px}button.icon-secondary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.icon-secondary:focus.sc-admiralty-button-s>*,button.icon-secondary:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.icon-secondary.sc-admiralty-button:disabled{cursor:default}button.icon-secondary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.icon-secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.icon-secondary.sc-admiralty-button:focus{padding:11px 11px 8px}button.icon-secondary.sc-admiralty-button:hover{background-color:var(--admiralty-hover-background-colour);border:2px solid var(--admiralty-colour-primary);padding:9px}button.icon-secondary.sc-admiralty-button admiralty-icon.icon-padding.sc-admiralty-button{padding-left:8px}button.icon-secondary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary);border:2px solid transparent}button.icon-secondary.sc-admiralty-button:enabled:active admiralty-icon.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast) !important}button.icon-secondary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-colour-primary);opacity:0.3}button.icon-secondary.borderless.sc-admiralty-button{border:none}button.icon-secondary.sc-admiralty-button:active:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-colour-primary);opacity:0.3}button.icon-secondary.sc-admiralty-button i.sc-admiralty-button{margin:var(--admiralty-button-icon-idiomatic-margin, var(--admiralty-spacing-auto));font-size:unset;color:unset;padding-left:var(--admiralty-button-icon-idiomatic-padding, var(--admiralty-spacing-unset))}";const i=o;const n=class{constructor(t){a(this,t);this.variant="primary";this.icon=undefined;this.disabled=false;this.borderless=false;this.type="submit";this.form=undefined;this.name=undefined;this.value=undefined}render(){const a=this.el.textContent.trim().length>0;const{form:r,name:o,value:i}=this;const n=Object.assign(Object.assign(Object.assign({},r&&{form:r}),o&&{name:o}),i&&{value:i});return t("button",Object.assign({key:"abee3f20f126864a8b0a8d05bba8efc4940a6d72",type:this.type,disabled:this.disabled,class:{[this.variant]:true,borderless:this.borderless}},n),t("slot",{key:"83b5c5260914f49782d70fa951ea93589675fe26"}),this.icon?t("admiralty-icon",{name:this.icon,class:`${a?"icon-padding":""}`}):undefined)}get el(){return r(this)}};n.style=i;export{n as admiralty_button};
+//# sourceMappingURL=p-c582be5d.entry.js.map

package/dist/admiralty/{p-f3b69fbc.entry.js.map → p-c582be5d.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["buttonCss","AdmiraltyButtonStyle0","ButtonComponent","render","hasTextContent","this","el","textContent","trim","length","form","name","value","props","Object","assign","h","key","type","disabled","class","variant","borderless","icon","undefined"],"sources":["src/components/button/button.scss?tag=admiralty-button&encapsulation=scoped","src/components/button/button.tsx"],"sourcesContent":["@import 'button.vars';\n\n@mixin button-defaults {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  font-size: $button-font-size;\n  line-height: $button-line-height;\n  font-weight: $button-font-weight;\n  background-color: unset;\n  cursor: pointer;\n\n  &:focus {\n    outline: none;\n    color: $button-focus-text-colour;\n    background-color: $button-focus-colour;\n    border: none;\n    border-bottom: 4px solid $button-focus-text-colour;\n    padding: $button-focus-padding;\n\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    * {\n      pointer-events: none;\n    }\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-font-size;\n    color: $button-icon-colour;\n    padding: $button-defaults-idiomatic-padding;\n  }\n}\n\n@mixin button {\n  @include button-defaults;\n  height: 44px;\n  padding: $button-defaults-padding;\n  white-space: nowrap;\n  min-width: 50px;\n\n  @include not-desktop {\n    min-width: unset;\n    max-width: 200px;\n    width: 100%;\n    height: 44px;\n    padding: $button-not-desktop-padding;\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-idiomatic-font-size;\n    color: $button-icon-colour;\n    padding-left: $button-idiomatic-padding-left;\n  }\n}\n\n/* Primary Buttons */\nbutton.primary {\n  @include button;\n  background-color: $button-colour-standard;\n  color: $button-text-colour-standard;\n  border: 2px solid $button-border-colour-standard;\n\n  &:hover {\n    background-color: $button-hover-colour-standard;\n    border: 2px solid $button-hover-colour-standard;\n    color: $button-hover-text-colour-standard;\n    border-color: $button-hover-border-colour-standard;\n    padding: $button-primary-hover-padding;\n  }\n\n  &:hover:focus {\n    padding: $button-primary-hover-focus-padding;\n  }\n\n  &:hover:focus:active {\n    padding: $button-primary-hover-focus-active-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-standard;\n    border: 2px solid $button-active-border-colour-standard;\n    color: $button-active-text-colour-standard;\n\n    i {\n      color: $button-active-text-colour-standard;\n    }\n\n    p {\n      color: $button-active-text-colour-standard;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n}\n\n/* Secondary Buttons */\nbutton.secondary {\n  @include button;\n  background-color: $button-colour-secondary;\n  color: $button-text-colour-secondary;\n  border: 2px solid $button-border-colour-secondary;\n\n  &:hover {\n    background-color: $button-hover-colour-secondary;\n    color: $button-hover-text-colour-secondary;\n    border: 2px solid $button-hover-border-colour-secondary;\n    padding: $button-secondary-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-secondary;\n    border: 2px solid $button-active-border-colour-secondary;\n    color: $button-active-text-colour-secondary;\n\n    i {\n      color: $button-active-text-colour-secondary;\n    }\n\n    p {\n      color: $button-active-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Warning Buttons */\nbutton.warning {\n  @include button;\n  background-color: $button-colour-warning;\n  color: $button-text-colour-warning;\n  border: 2px solid $button-border-colour-warning;\n\n  &:hover {\n    background-color: $button-hover-colour-warning;\n    color: $button-text-colour-warning;\n    border: 2px solid $button-hover-border-colour-warning;\n    padding: $button-warning-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-warning;\n    border: 2px solid $button-active-border-colour-warning;\n    color: $button-active-text-colour-warning;\n\n    i {\n      color: $button-active-text-colour-warning;\n    }\n\n    p {\n      color: $button-active-text-colour-warning;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  i {\n    color: $button-text-colour-warning;\n  }\n}\n\n/* Text Buttons */\nbutton.text {\n  @include button-defaults;\n  color: $button-text-colour-secondary;\n\n  &:enabled:active {\n    color: $button-text-colour-secondary;\n\n    i {\n      color: $button-text-colour-secondary;\n    }\n\n    p {\n      color: $button-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    color: $button-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  &:focus {\n    border: none;\n    box-shadow:\n      0 -2px $button-focus-colour,\n      0 4px $button-focus-text-colour;\n    text-decoration: none;\n    padding: $button-text-focus-padding;\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Icon Buttons */\nbutton.icon {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon;\n  color: $button-text-colour-icon;\n  border: 2px solid $button-border-colour-icon;\n  padding: $button-icon-padding;\n\n  &:focus {\n    padding: $button-icon-focus-padding;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon;\n    border: 2px solid $button-hover-border-colour-icon;\n    padding: $button-icon-hover-padding;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon;\n    color: $button-active-text-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n    background-color: yellow;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: auto;\n    font-size: unset;\n    color: unset;\n    padding-left: unset;\n  }\n}\nbutton.icon-secondary {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon-secondary;\n  color: $button-text-colour-icon-secondary;\n  border: 2px solid $button-border-colour-icon-secondary;\n  padding: 9px;\n\n  &:focus {\n    padding: 11px 11px 8px;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon-secondary;\n    border: 2px solid $button-hover-border-colour-icon-secondary;\n    padding: 9px;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon-secondary;\n    color: $button-active-text-colour-icon-secondary;\n    border: 2px solid $button-active-border-colour-icon-secondary;\n    border: 2px solid transparent;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon-secondary !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: $button-icon-idiomatic-margin;\n    font-size: unset;\n    color: unset;\n    padding-left: $button-icon-idiomatic-padding;\n  }\n}\n","import { Component, Prop, h, Element } from '@stencil/core';\nimport { ButtonVariant } from './button.types';\n\n@Component({\n  tag: 'admiralty-button',\n  styleUrl: 'button.scss',\n  scoped: true,\n})\nexport class ButtonComponent {\n  @Element() el: HTMLElement;\n  /**\n   * The type of button to render. Valid values are `primary`, `secondary`, `warning`, `text` and `icon`.\n   * Default value is `primary`.\n   */\n  @Prop() variant: ButtonVariant = 'primary';\n  /**\n   * When passed Material Icon name, then an icon will be rendered.\n   */\n  @Prop() icon: string;\n  /**\n   * Determines whether the button is disabled. A button in disabled state will not fire click output events.\n   */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n   * The default behavior of the button. Valid values are `button`, `submit` and `reset`.\n   * Default value is `submit`.\n   */\n\n  @Prop() borderless = false;\n  /**\n   * Default value is false\n   */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'submit';\n  /**\n   * The `<form>` element to associate the button with (its form owner).\n   */\n  @Prop() form: string;\n  /**\n   * The name of the button, submitted as a pair with the button's value as part of the form data,\n   * when that button is used to submit the form.\n   */\n  @Prop() name: string;\n  /**\n   * Defines the value associated with the button's name when it's submitted with the form data.\n   * This value is passed to the server in params when the form is submitted using this button.\n   */\n  @Prop() value: string;\n\n  render() {\n    const hasTextContent = this.el.textContent.trim().length > 0;\n\n    const { form, name, value } = this;\n    const props = {\n      ...(form && { form }),\n      ...(name && { name }),\n      ...(value && { value }),\n    };\n\n    return (\n      <button type={this.type} disabled={this.disabled} class={{ [this.variant]: true, borderless: this.borderless }} {...props}>\n        <slot></slot>\n        {this.icon ? <admiralty-icon name={this.icon} class={`${hasTextContent ? 'icon-padding' : ''}`}></admiralty-icon> : undefined}\n      </button>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAY,u3iBAClB,MAAAC,EAAeD,E,MCOFE,EAAe,M,sCAMO,U,kCAQG,M,gBAMf,M,UAIyB,S,6DAgB9C,MAAAC,GACE,MAAMC,EAAiBC,KAAKC,GAAGC,YAAYC,OAAOC,OAAS,EAE3D,MAAMC,KAAEA,EAAIC,KAAEA,EAAIC,MAAEA,GAAUP,KAC9B,MAAMQ,EAAKC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACLL,GAAQ,CAAEA,SACVC,GAAQ,CAAEA,SACVC,GAAS,CAAEA,UAGjB,OACEI,EAAA,SAAAF,OAAAC,OAAA,CAAAE,IAAA,2CAAQC,KAAMb,KAAKa,KAAMC,SAAUd,KAAKc,SAAUC,MAAO,CAAE,CAACf,KAAKgB,SAAU,KAAMC,WAAYjB,KAAKiB,aAAkBT,GAClHG,EAAA,QAAAC,IAAA,6CACCZ,KAAKkB,KAAOP,EAAA,kBAAgBL,KAAMN,KAAKkB,KAAMH,MAAO,GAAGhB,EAAiB,eAAiB,OAA0BoB,U","ignoreList":[]}
+{"version":3,"names":["buttonCss","AdmiraltyButtonStyle0","ButtonComponent","render","hasTextContent","this","el","textContent","trim","length","form","name","value","props","Object","assign","h","key","type","disabled","class","variant","borderless","icon","undefined"],"sources":["src/components/button/button.scss?tag=admiralty-button&encapsulation=scoped","src/components/button/button.tsx"],"sourcesContent":["@import 'button.vars';\n\n@mixin button-defaults {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  font-size: $button-font-size;\n  line-height: $button-line-height;\n  font-weight: $button-font-weight;\n  background-color: unset;\n  cursor: pointer;\n\n  &:focus {\n    outline: none;\n    color: $button-focus-text-colour;\n    background-color: $button-focus-colour;\n    border: none;\n    border-bottom: 4px solid $button-focus-text-colour;\n    padding: $button-focus-padding;\n\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    * {\n      pointer-events: none;\n    }\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-font-size;\n    color: $button-icon-colour;\n    padding: $button-defaults-idiomatic-padding;\n  }\n}\n\n@mixin button {\n  @include button-defaults;\n  height: 44px;\n  padding: $button-defaults-padding;\n  white-space: nowrap;\n  min-width: 50px;\n\n  @include not-desktop {\n    min-width: unset;\n    max-width: 200px;\n    width: 100%;\n    height: 44px;\n    padding: $button-not-desktop-padding;\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-idiomatic-font-size;\n    color: $button-icon-colour;\n    padding-left: $button-idiomatic-padding-left;\n  }\n}\n\n/* Primary Buttons */\nbutton.primary {\n  @include button;\n  background-color: $button-colour-standard;\n  color: $button-text-colour-standard;\n  border: 2px solid $button-border-colour-standard;\n\n  &:hover {\n    background-color: $button-hover-colour-standard;\n    border: 2px solid $button-hover-colour-standard;\n    color: $button-hover-text-colour-standard;\n    border-color: $button-hover-border-colour-standard;\n    padding: $button-primary-hover-padding;\n  }\n\n  &:hover:focus {\n    padding: $button-primary-hover-focus-padding;\n  }\n\n  &:hover:focus:active {\n    padding: $button-primary-hover-focus-active-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-standard;\n    border: 2px solid $button-active-border-colour-standard;\n    color: $button-active-text-colour-standard;\n\n    i {\n      color: $button-active-text-colour-standard;\n    }\n\n    p {\n      color: $button-active-text-colour-standard;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n}\n\n/* Secondary Buttons */\nbutton.secondary {\n  @include button;\n  background-color: $button-colour-secondary;\n  color: $button-text-colour-secondary;\n  border: 2px solid $button-border-colour-secondary;\n\n  &:hover {\n    background-color: $button-hover-colour-secondary;\n    color: $button-hover-text-colour-secondary;\n    border: 2px solid $button-hover-border-colour-secondary;\n    padding: $button-secondary-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-secondary;\n    border: 2px solid $button-active-border-colour-secondary;\n    color: $button-active-text-colour-secondary;\n\n    i {\n      color: $button-active-text-colour-secondary;\n    }\n\n    p {\n      color: $button-active-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Warning Buttons */\nbutton.warning {\n  @include button;\n  background-color: $button-colour-warning;\n  color: $button-text-colour-warning;\n  border: 2px solid $button-border-colour-warning;\n\n  &:hover {\n    background-color: $button-hover-colour-warning;\n    color: $button-text-colour-warning;\n    border: 2px solid $button-hover-border-colour-warning;\n    padding: $button-warning-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-warning;\n    border: 2px solid $button-active-border-colour-warning;\n    color: $button-active-text-colour-warning;\n\n    i {\n      color: $button-active-text-colour-warning;\n    }\n\n    p {\n      color: $button-active-text-colour-warning;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  i {\n    color: $button-text-colour-warning;\n  }\n}\n\n/* Text Buttons */\nbutton.text {\n  @include button-defaults;\n  color: $button-text-colour-secondary;\n\n  &:enabled:active {\n    color: $button-text-colour-secondary;\n\n    i {\n      color: $button-text-colour-secondary;\n    }\n\n    p {\n      color: $button-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    color: $button-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  &:focus {\n    border: none;\n    box-shadow:\n      0 -2px $button-focus-colour,\n      0 4px $button-focus-text-colour;\n    text-decoration: none;\n    padding: $button-text-focus-padding;\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Icon Buttons */\nbutton.icon {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon;\n  color: $button-text-colour-icon;\n  border: 2px solid $button-border-colour-icon;\n  padding: $button-icon-padding;\n\n  &:focus {\n    padding: $button-icon-focus-padding;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon;\n    border: 2px solid $button-hover-border-colour-icon;\n    padding: $button-icon-hover-padding;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon;\n    color: $button-active-text-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n    background-color: yellow;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: auto;\n    font-size: unset;\n    color: unset;\n    padding-left: unset;\n  }\n}\nbutton.icon-secondary {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon-secondary;\n  color: $button-text-colour-icon-secondary;\n  border: 2px solid $button-border-colour-icon-secondary;\n  padding: 9px;\n\n  &:focus {\n    padding: 11px 11px 8px;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon-secondary;\n    border: 2px solid $button-hover-border-colour-icon-secondary;\n    padding: 9px;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon-secondary;\n    color: $button-active-text-colour-icon-secondary;\n    border: 2px solid $button-active-border-colour-icon-secondary;\n    border: 2px solid transparent;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon-secondary !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: $button-icon-idiomatic-margin;\n    font-size: unset;\n    color: unset;\n    padding-left: $button-icon-idiomatic-padding;\n  }\n}\n","import { Component, Prop, h, Element } from '@stencil/core';\nimport { ButtonVariant } from './button.types';\n\n@Component({\n  tag: 'admiralty-button',\n  styleUrl: 'button.scss',\n  scoped: true,\n})\nexport class ButtonComponent {\n  @Element() el: HTMLElement;\n  /**\n   * The type of button to render. Valid values are `primary`, `secondary`, `warning`, `text` and `icon`.\n   * Default value is `primary`.\n   */\n  @Prop() variant: ButtonVariant = 'primary';\n  /**\n   * When passed Material Icon name, then an icon will be rendered.\n   */\n  @Prop() icon: string;\n  /**\n   * Determines whether the button is disabled. A button in disabled state will not fire click output events.\n   */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n   * The default behavior of the button. Valid values are `button`, `submit` and `reset`.\n   * Default value is `submit`.\n   */\n\n  @Prop() borderless = false;\n  /**\n   * Default value is false\n   */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'submit';\n  /**\n   * The `<form>` element to associate the button with (its form owner).\n   */\n  @Prop() form: string;\n  /**\n   * The name of the button, submitted as a pair with the button's value as part of the form data,\n   * when that button is used to submit the form.\n   */\n  @Prop() name: string;\n  /**\n   * Defines the value associated with the button's name when it's submitted with the form data.\n   * This value is passed to the server in params when the form is submitted using this button.\n   */\n  @Prop() value: string;\n\n  render() {\n    const hasTextContent = this.el.textContent.trim().length > 0;\n\n    const { form, name, value } = this;\n    const props = {\n      ...(form && { form }),\n      ...(name && { name }),\n      ...(value && { value }),\n    };\n\n    return (\n      <button type={this.type} disabled={this.disabled} class={{ [this.variant]: true, borderless: this.borderless }} {...props}>\n        <slot></slot>\n        {this.icon ? <admiralty-icon name={this.icon} class={`${hasTextContent ? 'icon-padding' : ''}`}></admiralty-icon> : undefined}\n      </button>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAY,m7iBAClB,MAAAC,EAAeD,E,MCOFE,EAAe,M,sCAMO,U,kCAQG,M,gBAMf,M,UAIyB,S,6DAgB9C,MAAAC,GACE,MAAMC,EAAiBC,KAAKC,GAAGC,YAAYC,OAAOC,OAAS,EAE3D,MAAMC,KAAEA,EAAIC,KAAEA,EAAIC,MAAEA,GAAUP,KAC9B,MAAMQ,EAAKC,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACLL,GAAQ,CAAEA,SACVC,GAAQ,CAAEA,SACVC,GAAS,CAAEA,UAGjB,OACEI,EAAA,SAAAF,OAAAC,OAAA,CAAAE,IAAA,2CAAQC,KAAMb,KAAKa,KAAMC,SAAUd,KAAKc,SAAUC,MAAO,CAAE,CAACf,KAAKgB,SAAU,KAAMC,WAAYjB,KAAKiB,aAAkBT,GAClHG,EAAA,QAAAC,IAAA,6CACCZ,KAAKkB,KAAOP,EAAA,kBAAgBL,KAAMN,KAAKkB,KAAMH,MAAO,GAAGhB,EAAiB,eAAiB,OAA0BoB,U","ignoreList":[]}

package/dist/admiralty/p-d731d942.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as a,h as i,H as r,g as t}from"./p-71979ff5.js";const o=".visually-hidden.sc-admiralty-header-profile:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-header-profile{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-header-profile{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-header-profile{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-header-profile{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-header-profile{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-header-profile{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-header-profile{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-header-profile{display:none}}.header-profile.sc-admiralty-header-profile{color:var(--admiralty-colour-primary);cursor:pointer}.header-profile.sc-admiralty-header-profile>div.sc-admiralty-header-profile{display:flex}@media (min-width: 1024px){.header-profile.sc-admiralty-header-profile{display:flex;flex:0;flex-direction:column;font-size:var(--admiralty-header-profile-font-size, var(--admiralty-font-size-0)) !important;height:100%;justify-content:center;line-height:1.33em;margin-bottom:var(--admiralty-header-profile-desktop-only-margin-bottom, var(--admiralty-spacing-0));min-width:4em;max-width:11.1em;padding:var(--admiralty-header-profile-desktop-only-padding, var(--admiralty-spacing-0) 1.65em);position:relative;text-align:center}.header-profile.sc-admiralty-header-profile .not-desktop.sc-admiralty-header-profile{display:none}.header-profile.sc-admiralty-header-profile button.sc-admiralty-header-profile{all:unset;height:100%;width:100%}.header-profile.sc-admiralty-header-profile button.sc-admiralty-header-profile span.sc-admiralty-header-profile{color:var(--admiralty-colour-primary);font-weight:var(--admiralty-header-profile-font-weight, var(--admiralty-font-weight-medium));padding:var(--admiralty-header-profile-desktop-only-button-padding, var(--admiralty-spacing-1) var(--admiralty-spacing-0))}.header-profile.sc-admiralty-header-profile button.sc-admiralty-header-profile:focus span.sc-admiralty-header-profile,.header-profile.sc-admiralty-header-profile button.sc-admiralty-header-profile:focus div.sc-admiralty-header-profile{outline:3px solid transparent;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-focus-contrast);text-decoration:none}.header-profile.sc-admiralty-header-profile:hover{box-shadow:inset 0 -5px var(--admiralty-colour-primary);background-color:var(--admiralty-hover-background-colour)}.header-profile.sc-admiralty-header-profile:hover .desktop.sc-admiralty-header-profile .sub-menu.sc-admiralty-header-profile{display:flex}.header-profile.active.sc-admiralty-header-profile{box-shadow:inset 0 -5px var(--admiralty-colour-primary)}.header-profile.active.sc-admiralty-header-profile .sub-menu.sc-admiralty-header-profile{display:flex}.header-profile.sc-admiralty-header-profile .sub-menu.sc-admiralty-header-profile{display:none;flex-direction:column;font-size:var(--admiralty-header-profile-font-size, var(--admiralty-font-size-0));position:absolute;top:100%;right:0;border:1px solid var(--admiralty-colour-light);width:300px}.header-profile.sc-admiralty-header-profile .sub-menu.desktop-visible.sc-admiralty-header-profile{display:flex}.header-profile.sc-admiralty-header-profile .sub-menu.desktop-hide.sc-admiralty-header-profile{display:none}.header-profile.sc-admiralty-header-profile .sub-menu.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile{box-sizing:content-box;margin:var(--admiralty-header-profile-desktop-only-sub-menu-item-margin, var(--admiralty-spacing-0));width:100%;all:unset;box-sizing:border-box;display:block;font-weight:var(--admiralty-header-profile-sub-item-font-weight, var(--admiralty-font-weight-normal));height:100%;padding:var(--admiralty-header-profile-desktop-only-sub-menu-item-padding, 10px);text-align:left;width:100%}.header-profile.sc-admiralty-header-profile .sub-menu.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile:hover{background-color:var(--admiralty-hover-background-colour)}}@media (max-width: 1023px){.header-profile.sc-admiralty-header-profile{border-top:1px solid var(--admiralty-colour-light)}.header-profile.sc-admiralty-header-profile .desktop.sc-admiralty-header-profile{display:none}.header-profile.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile{display:block;box-sizing:border-box;background-color:unset;text-align:unset;text-decoration:unset;width:100%;padding:var(--admiralty-header-profile-not-desktop-sub-menu-item-padding, var(--admiralty-spacing-3))}.header-profile.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile span.sc-admiralty-header-profile{padding:var(--admiralty-header-profile-not-desktop-sub-menu-item-span-padding, var(--admiralty-spacing-1) var(--admiralty-spacing-0));color:var(--admiralty-colour-primary);font-size:var(--admiralty-header-profile-font-size, var(--admiralty-font-size-0));font-weight:var(--admiralty-header-profile-font-weight, var(--admiralty-font-weight-medium))}.header-profile.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile:hover{background-color:var(--admiralty-hover-background-colour)}.header-profile.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile:focus{outline:none}.header-profile.sc-admiralty-header-profile .sub-menu-item.sc-admiralty-header-profile:focus span.sc-admiralty-header-profile{outline:3px solid transparent;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-focus-contrast);text-decoration:none}}";const d=o;const l=class{constructor(i){e(this,i);this.signInClicked=a(this,"signInClicked",7);this.yourAccountClicked=a(this,"yourAccountClicked",7);this.signOutClicked=a(this,"signOutClicked",7);this.handleSignIn=()=>{this.signInClicked.emit()};this.handleSignOut=()=>{this.signOutClicked.emit()};this.handleYourAccount=()=>{this.yourAccountClicked.emit()};this.closeDropdown=()=>{const e=this.el.querySelector("div.sub-menu");e.classList.add("desktop-hide")};this.toggleDropdown=e=>{const a=this.el.querySelector("div.sub-menu");if(e){a.classList.add("desktop-visible");a.classList.remove("desktop-hide")}else{a.classList.add("desktop-hide");a.classList.remove("desktop-visible")}};this.handleClickSignedIn=e=>{e.stopPropagation();this.toggleDropdown(false)};this.isSignedIn=false;this.signedInText="replace";this.signInOnly=false}render(){let{isSignedIn:e,signedInText:a,signInOnly:t}=this;return i(r,{key:"b4417e12e72bb8b4847947218038715ca019eb76"},i("div",{key:"6ff091b7bc61ea8d017f27824b188bb1304a84f6",class:"header-profile"},e?i("div",null,i("div",{class:"desktop",onMouseEnter:()=>this.toggleDropdown(true),onMouseLeave:()=>this.toggleDropdown(false)},i("button",{onClick:this.handleClickSignedIn},i("span",null,a)),!t?i("div",{class:"sub-menu desktop-hide"},i("button",{class:"sub-menu-item",onClick:this.handleYourAccount},i("div",null,"Your Account")),i("button",{class:"sub-menu-item",onClick:this.handleSignOut},i("div",null,"Sign Out"))):null),!t?i("div",{class:"not-desktop"},i("button",{class:"sub-menu-item",onClick:this.handleYourAccount},i("span",null,"Your Account")),i("button",{class:"sub-menu-item",onClick:this.handleSignOut},i("span",null,"Sign Out"))):null):i("button",{class:"sub-menu-item",onClick:this.handleSignIn},i("span",null,"Sign In"))))}get el(){return t(this)}};l.style=d;export{l as admiralty_header_profile};
+//# sourceMappingURL=p-d731d942.entry.js.map

package/dist/admiralty/{p-d09a057f.entry.js.map → p-d731d942.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["headerProfileCss","AdmiraltyHeaderProfileStyle0","HeaderProfileComponent","this","handleSignIn","signInClicked","emit","handleSignOut","signOutClicked","handleYourAccount","yourAccountClicked","closeDropdown","subMenu","el","querySelector","classList","add","toggleDropdown","showMenu","remove","handleClickSignedIn","ev","stopPropagation","render","isSignedIn","signedInText","signInOnly","h","Host","key","class","onMouseEnter","onMouseLeave","onClick"],"sources":["src/components/header-profile/header-profile.scss?tag=admiralty-header-profile&encapsulation=scoped","src/components/header-profile/header-profile.tsx"],"sourcesContent":["@import 'header-profile.vars';\n\n@mixin active {\n  box-shadow: inset 0 -5px $header-profile-active-colour;\n}\n\n.header-profile {\n  color: $header-profile-text-colour;\n  cursor: pointer;\n\n  & > div {\n    display: flex;\n  }\n\n  @include desktop-only {\n    .not-desktop {\n      display: none;\n    }\n\n    display: flex;\n    flex: 0;\n    flex-direction: column;\n    font-size: $header-profile-text-size !important;\n    height: 100%;\n    justify-content: center;\n    line-height: 1.33em;\n    margin-bottom: $header-profile-desktop-only-margin-bottom;\n    min-width: 4em;\n    max-width: 11.1em;\n    padding: $header-profile-desktop-only-padding;\n    position: relative;\n    text-align: center;\n\n    button {\n      all: unset;\n      height: 100%;\n      width: 100%;\n      span {\n        color: $header-profile-text-colour;\n        font-weight: $header-profile-text-weight;\n        padding: $header-profile-desktop-only-button-padding;\n      }\n\n      &:focus span,\n      &:focus div {\n        @include focus-highlight;\n      }\n    }\n\n    &:hover {\n      @include active;\n      background-color: $header-profile-hover-background-colour;\n\n      .desktop .sub-menu {\n        display: flex;\n      }\n    }\n\n    &.active {\n      @include active;\n\n      .sub-menu {\n        display: flex;\n      }\n    }\n\n    .sub-menu {\n      display: none;\n      flex-direction: column;\n      font-size: $header-profile-text-size;\n      position: absolute;\n      top: 100%;\n      right: 0;\n      border: 1px solid $header-profile-divider-colour;\n      width: 300px;\n\n      &.desktop-visible {\n        display: flex;\n      }\n\n      &.desktop-hide {\n        display: none;\n      }\n\n      .sub-menu-item {\n        box-sizing: content-box;\n        margin: $header-profile-desktop-only-sub-menu-item-margin;\n        width: 100%;\n\n        all: unset;\n        box-sizing: border-box;\n        display: block;\n        font-weight: $header-profile-sub-item-text-weight;\n        height: 100%;\n        padding: $header-profile-desktop-only-sub-menu-item-padding;\n        text-align: left;\n        width: 100%;\n\n        &:hover {\n          background-color: $header-profile-hover-background-colour;\n        }\n      }\n    }\n  }\n\n  @include not-desktop {\n    .desktop {\n      display: none;\n    }\n\n    border-top: 1px solid $header-profile-divider-colour;\n\n    .sub-menu-item {\n      display: block;\n      box-sizing: border-box;\n      background-color: unset;\n      text-align: unset;\n      text-decoration: unset;\n      width: 100%;\n      padding: $header-profile-not-desktop-sub-menu-item-padding;\n\n      span {\n        padding: $header-profile-not-desktop-sub-menu-item-span-padding;\n        color: $header-profile-text-colour;\n        font-size: $header-profile-text-size;\n        font-weight: $header-profile-text-weight;\n      }\n\n      &:hover {\n        background-color: $header-profile-hover-background-colour;\n      }\n\n      &:focus {\n        outline: none;\n        span {\n          @include focus-highlight;\n        }\n      }\n    }\n  }\n}\n","import { Component, Event, Host, h, Prop, EventEmitter, Element } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-header-profile',\n  styleUrl: 'header-profile.scss',\n  scoped: true,\n})\nexport class HeaderProfileComponent {\n  @Element() el: HTMLElement;\n\n  /**\n   * A boolean to indicate if the user is signed in or not\n   */\n  @Prop() isSignedIn: boolean = false;\n\n  /**\n   * The text that is displayed after the user signs in\n   */\n  @Prop() signedInText: string = 'replace';\n\n  /**\n   * A boolean to indicate if the component should hide\n   * the sign-out and account buttons, useful for internal\n   * sites where the user must be always signed in.\n   */\n  @Prop() signInOnly: boolean = false;\n\n  /**\n   * The event that is fired when the user clicks on\n   * the sign in button\n   */\n  @Event() signInClicked: EventEmitter<void>;\n\n  /**\n   * The event that is fired when the user clicks on the\n   * 'Your account' button\n   */\n  @Event() yourAccountClicked: EventEmitter<void>;\n\n  /**\n   * The event that is fired when the user clicks on the\n   * 'sign out' button\n   */\n  @Event() signOutClicked: EventEmitter<void>;\n\n  handleSignIn = () => {\n    this.signInClicked.emit();\n  };\n\n  handleSignOut = () => {\n    this.signOutClicked.emit();\n  };\n\n  handleYourAccount = () => {\n    this.yourAccountClicked.emit();\n  };\n\n  closeDropdown = () => {\n    const subMenu: HTMLDivElement = this.el.querySelector('div.sub-menu');\n    subMenu.classList.add('desktop-hide');\n  };\n\n  toggleDropdown = (showMenu: boolean) => {\n    const subMenu: HTMLDivElement = this.el.querySelector('div.sub-menu');\n\n    if (showMenu) {\n      subMenu.classList.add('desktop-visible');\n      subMenu.classList.remove('desktop-hide');\n    } else {\n      subMenu.classList.add('desktop-hide');\n      subMenu.classList.remove('desktop-visible');\n    }\n  };\n\n  handleClickSignedIn = (ev: MouseEvent) => {\n    ev.stopPropagation();\n    this.toggleDropdown(false);\n  };\n\n  render() {\n    let { isSignedIn, signedInText, signInOnly } = this;\n    return (\n      <Host>\n        <div class=\"header-profile\">\n          {isSignedIn ? (\n            <div>\n              <div class=\"desktop\" onMouseEnter={() => this.toggleDropdown(true)} onMouseLeave={() => this.toggleDropdown(false)}>\n                <button onClick={this.handleClickSignedIn}>\n                  <span>{signedInText}</span>\n                </button>\n                {!signInOnly ? (\n                  <div class=\"sub-menu desktop-hide\">\n                    <button class=\"sub-menu-item\" onClick={this.handleYourAccount}>\n                      <div>Your Account</div>\n                    </button>\n                    <button class=\"sub-menu-item\" onClick={this.handleSignOut}>\n                      <div>Sign Out</div>\n                    </button>\n                  </div>\n                ) : null}\n              </div>\n              {!signInOnly ? (\n                <div class=\"not-desktop\">\n                  <button class=\"sub-menu-item\" onClick={this.handleYourAccount}>\n                    <span>Your Account</span>\n                  </button>\n                  <button class=\"sub-menu-item\" onClick={this.handleSignOut}>\n                    <span>Sign Out</span>\n                  </button>\n                </div>\n              ) : null}\n            </div>\n          ) : (\n            <button class=\"sub-menu-item\" onClick={this.handleSignIn}>\n              <span>Sign In</span>\n            </button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAmB,0gMACzB,MAAAC,EAAeD,E,MCMFE,EAAsB,M,4KAsCjCC,KAAAC,aAAe,KACbD,KAAKE,cAAcC,MAAM,EAG3BH,KAAAI,cAAgB,KACdJ,KAAKK,eAAeF,MAAM,EAG5BH,KAAAM,kBAAoB,KAClBN,KAAKO,mBAAmBJ,MAAM,EAGhCH,KAAAQ,cAAgB,KACd,MAAMC,EAA0BT,KAAKU,GAAGC,cAAc,gBACtDF,EAAQG,UAAUC,IAAI,eAAe,EAGvCb,KAAAc,eAAkBC,IAChB,MAAMN,EAA0BT,KAAKU,GAAGC,cAAc,gBAEtD,GAAII,EAAU,CACZN,EAAQG,UAAUC,IAAI,mBACtBJ,EAAQG,UAAUI,OAAO,e,KACpB,CACLP,EAAQG,UAAUC,IAAI,gBACtBJ,EAAQG,UAAUI,OAAO,kB,GAI7BhB,KAAAiB,oBAAuBC,IACrBA,EAAGC,kBACHnB,KAAKc,eAAe,MAAM,E,gBA/DE,M,kBAKC,U,gBAOD,K,CAsD9B,MAAAM,GACE,IAAIC,WAAEA,EAAUC,aAAEA,EAAYC,WAAEA,GAAevB,KAC/C,OACEwB,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACRN,EACCG,EAAA,WACEA,EAAA,OAAKG,MAAM,UAAUC,aAAc,IAAM5B,KAAKc,eAAe,MAAOe,aAAc,IAAM7B,KAAKc,eAAe,QAC1GU,EAAA,UAAQM,QAAS9B,KAAKiB,qBACpBO,EAAA,YAAOF,KAEPC,EACAC,EAAA,OAAKG,MAAM,yBACTH,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKM,mBAC1CkB,EAAA,4BAEFA,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKI,eAC1CoB,EAAA,yBAGF,OAEJD,EACAC,EAAA,OAAKG,MAAM,eACTH,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKM,mBAC1CkB,EAAA,6BAEFA,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKI,eAC1CoB,EAAA,0BAGF,MAGNA,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKC,cAC1CuB,EAAA,yB","ignoreList":[]}
+{"version":3,"names":["headerProfileCss","AdmiraltyHeaderProfileStyle0","HeaderProfileComponent","this","handleSignIn","signInClicked","emit","handleSignOut","signOutClicked","handleYourAccount","yourAccountClicked","closeDropdown","subMenu","el","querySelector","classList","add","toggleDropdown","showMenu","remove","handleClickSignedIn","ev","stopPropagation","render","isSignedIn","signedInText","signInOnly","h","Host","key","class","onMouseEnter","onMouseLeave","onClick"],"sources":["src/components/header-profile/header-profile.scss?tag=admiralty-header-profile&encapsulation=scoped","src/components/header-profile/header-profile.tsx"],"sourcesContent":["@import 'header-profile.vars';\n\n@mixin active {\n  box-shadow: inset 0 -5px $header-profile-active-colour;\n}\n\n.header-profile {\n  color: $header-profile-text-colour;\n  cursor: pointer;\n\n  & > div {\n    display: flex;\n  }\n\n  @include desktop-only {\n    .not-desktop {\n      display: none;\n    }\n\n    display: flex;\n    flex: 0;\n    flex-direction: column;\n    font-size: $header-profile-text-size !important;\n    height: 100%;\n    justify-content: center;\n    line-height: 1.33em;\n    margin-bottom: $header-profile-desktop-only-margin-bottom;\n    min-width: 4em;\n    max-width: 11.1em;\n    padding: $header-profile-desktop-only-padding;\n    position: relative;\n    text-align: center;\n\n    button {\n      all: unset;\n      height: 100%;\n      width: 100%;\n      span {\n        color: $header-profile-text-colour;\n        font-weight: $header-profile-text-weight;\n        padding: $header-profile-desktop-only-button-padding;\n      }\n\n      &:focus span,\n      &:focus div {\n        @include focus-highlight;\n      }\n    }\n\n    &:hover {\n      @include active;\n      background-color: $header-profile-hover-background-colour;\n\n      .desktop .sub-menu {\n        display: flex;\n      }\n    }\n\n    &.active {\n      @include active;\n\n      .sub-menu {\n        display: flex;\n      }\n    }\n\n    .sub-menu {\n      display: none;\n      flex-direction: column;\n      font-size: $header-profile-text-size;\n      position: absolute;\n      top: 100%;\n      right: 0;\n      border: 1px solid $header-profile-divider-colour;\n      width: 300px;\n\n      &.desktop-visible {\n        display: flex;\n      }\n\n      &.desktop-hide {\n        display: none;\n      }\n\n      .sub-menu-item {\n        box-sizing: content-box;\n        margin: $header-profile-desktop-only-sub-menu-item-margin;\n        width: 100%;\n\n        all: unset;\n        box-sizing: border-box;\n        display: block;\n        font-weight: $header-profile-sub-item-text-weight;\n        height: 100%;\n        padding: $header-profile-desktop-only-sub-menu-item-padding;\n        text-align: left;\n        width: 100%;\n\n        &:hover {\n          background-color: $header-profile-hover-background-colour;\n        }\n      }\n    }\n  }\n\n  @include not-desktop {\n    .desktop {\n      display: none;\n    }\n\n    border-top: 1px solid $header-profile-divider-colour;\n\n    .sub-menu-item {\n      display: block;\n      box-sizing: border-box;\n      background-color: unset;\n      text-align: unset;\n      text-decoration: unset;\n      width: 100%;\n      padding: $header-profile-not-desktop-sub-menu-item-padding;\n\n      span {\n        padding: $header-profile-not-desktop-sub-menu-item-span-padding;\n        color: $header-profile-text-colour;\n        font-size: $header-profile-text-size;\n        font-weight: $header-profile-text-weight;\n      }\n\n      &:hover {\n        background-color: $header-profile-hover-background-colour;\n      }\n\n      &:focus {\n        outline: none;\n        span {\n          @include focus-highlight;\n        }\n      }\n    }\n  }\n}\n","import { Component, Event, Host, h, Prop, EventEmitter, Element } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-header-profile',\n  styleUrl: 'header-profile.scss',\n  scoped: true,\n})\nexport class HeaderProfileComponent {\n  @Element() el: HTMLElement;\n\n  /**\n   * A boolean to indicate if the user is signed in or not\n   */\n  @Prop() isSignedIn: boolean = false;\n\n  /**\n   * The text that is displayed after the user signs in\n   */\n  @Prop() signedInText: string = 'replace';\n\n  /**\n   * A boolean to indicate if the component should hide\n   * the sign-out and account buttons, useful for internal\n   * sites where the user must be always signed in.\n   */\n  @Prop() signInOnly: boolean = false;\n\n  /**\n   * The event that is fired when the user clicks on\n   * the sign in button\n   */\n  @Event() signInClicked: EventEmitter<void>;\n\n  /**\n   * The event that is fired when the user clicks on the\n   * 'Your account' button\n   */\n  @Event() yourAccountClicked: EventEmitter<void>;\n\n  /**\n   * The event that is fired when the user clicks on the\n   * 'sign out' button\n   */\n  @Event() signOutClicked: EventEmitter<void>;\n\n  handleSignIn = () => {\n    this.signInClicked.emit();\n  };\n\n  handleSignOut = () => {\n    this.signOutClicked.emit();\n  };\n\n  handleYourAccount = () => {\n    this.yourAccountClicked.emit();\n  };\n\n  closeDropdown = () => {\n    const subMenu: HTMLDivElement = this.el.querySelector('div.sub-menu');\n    subMenu.classList.add('desktop-hide');\n  };\n\n  toggleDropdown = (showMenu: boolean) => {\n    const subMenu: HTMLDivElement = this.el.querySelector('div.sub-menu');\n\n    if (showMenu) {\n      subMenu.classList.add('desktop-visible');\n      subMenu.classList.remove('desktop-hide');\n    } else {\n      subMenu.classList.add('desktop-hide');\n      subMenu.classList.remove('desktop-visible');\n    }\n  };\n\n  handleClickSignedIn = (ev: MouseEvent) => {\n    ev.stopPropagation();\n    this.toggleDropdown(false);\n  };\n\n  render() {\n    let { isSignedIn, signedInText, signInOnly } = this;\n    return (\n      <Host>\n        <div class=\"header-profile\">\n          {isSignedIn ? (\n            <div>\n              <div class=\"desktop\" onMouseEnter={() => this.toggleDropdown(true)} onMouseLeave={() => this.toggleDropdown(false)}>\n                <button onClick={this.handleClickSignedIn}>\n                  <span>{signedInText}</span>\n                </button>\n                {!signInOnly ? (\n                  <div class=\"sub-menu desktop-hide\">\n                    <button class=\"sub-menu-item\" onClick={this.handleYourAccount}>\n                      <div>Your Account</div>\n                    </button>\n                    <button class=\"sub-menu-item\" onClick={this.handleSignOut}>\n                      <div>Sign Out</div>\n                    </button>\n                  </div>\n                ) : null}\n              </div>\n              {!signInOnly ? (\n                <div class=\"not-desktop\">\n                  <button class=\"sub-menu-item\" onClick={this.handleYourAccount}>\n                    <span>Your Account</span>\n                  </button>\n                  <button class=\"sub-menu-item\" onClick={this.handleSignOut}>\n                    <span>Sign Out</span>\n                  </button>\n                </div>\n              ) : null}\n            </div>\n          ) : (\n            <button class=\"sub-menu-item\" onClick={this.handleSignIn}>\n              <span>Sign In</span>\n            </button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAmB,shMACzB,MAAAC,EAAeD,E,MCMFE,EAAsB,M,4KAsCjCC,KAAAC,aAAe,KACbD,KAAKE,cAAcC,MAAM,EAG3BH,KAAAI,cAAgB,KACdJ,KAAKK,eAAeF,MAAM,EAG5BH,KAAAM,kBAAoB,KAClBN,KAAKO,mBAAmBJ,MAAM,EAGhCH,KAAAQ,cAAgB,KACd,MAAMC,EAA0BT,KAAKU,GAAGC,cAAc,gBACtDF,EAAQG,UAAUC,IAAI,eAAe,EAGvCb,KAAAc,eAAkBC,IAChB,MAAMN,EAA0BT,KAAKU,GAAGC,cAAc,gBAEtD,GAAII,EAAU,CACZN,EAAQG,UAAUC,IAAI,mBACtBJ,EAAQG,UAAUI,OAAO,e,KACpB,CACLP,EAAQG,UAAUC,IAAI,gBACtBJ,EAAQG,UAAUI,OAAO,kB,GAI7BhB,KAAAiB,oBAAuBC,IACrBA,EAAGC,kBACHnB,KAAKc,eAAe,MAAM,E,gBA/DE,M,kBAKC,U,gBAOD,K,CAsD9B,MAAAM,GACE,IAAIC,WAAEA,EAAUC,aAAEA,EAAYC,WAAEA,GAAevB,KAC/C,OACEwB,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,kBACRN,EACCG,EAAA,WACEA,EAAA,OAAKG,MAAM,UAAUC,aAAc,IAAM5B,KAAKc,eAAe,MAAOe,aAAc,IAAM7B,KAAKc,eAAe,QAC1GU,EAAA,UAAQM,QAAS9B,KAAKiB,qBACpBO,EAAA,YAAOF,KAEPC,EACAC,EAAA,OAAKG,MAAM,yBACTH,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKM,mBAC1CkB,EAAA,4BAEFA,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKI,eAC1CoB,EAAA,yBAGF,OAEJD,EACAC,EAAA,OAAKG,MAAM,eACTH,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKM,mBAC1CkB,EAAA,6BAEFA,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKI,eAC1CoB,EAAA,0BAGF,MAGNA,EAAA,UAAQG,MAAM,gBAAgBG,QAAS9B,KAAKC,cAC1CuB,EAAA,yB","ignoreList":[]}

package/dist/admiralty/p-f8c36c93.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as a,h as t,H as i}from"./p-71979ff5.js";const r=".visually-hidden.sc-admiralty-header-sub-menu-item:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-header-sub-menu-item{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-header-sub-menu-item{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-header-sub-menu-item{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-header-sub-menu-item{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-header-sub-menu-item{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-header-sub-menu-item{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-header-sub-menu-item{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-header-sub-menu-item{display:none}}.header-sub-menu-item.sc-admiralty-header-sub-menu-item{background-color:var(--admiralty-background-colour)}.header-sub-menu-item.sc-admiralty-header-sub-menu-item .title.sc-admiralty-header-sub-menu-item{font-size:var(--admiralty-header-sub-menu-item-font-size, var(--admiralty-font-size-0));font-weight:var(--admiralty-header-sub-menu-item-font-weight, var(--admiralty-font-weight-normal))}.header-sub-menu-item.sc-admiralty-header-sub-menu-item a.sc-admiralty-header-sub-menu-item{text-decoration:none}.header-sub-menu-item.sc-admiralty-header-sub-menu-item:focus{outline:none}.header-sub-menu-item.sc-admiralty-header-sub-menu-item:focus span.sc-admiralty-header-sub-menu-item{outline:3px solid transparent;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-focus-contrast);text-decoration:none}@media (min-width: 1024px){.header-sub-menu-item.sc-admiralty-header-sub-menu-item{box-sizing:border-box;color:var(--admiralty-colour-primary);display:block;margin-bottom:var(--admiralty-header-sub-menu-item-desktop-margin-bottom, var(--admiralty-spacing-0));padding:var(--admiralty-header-sub-menu-item-desktop-padding, 10px);text-align:left;width:300px}.header-sub-menu-item.sc-admiralty-header-sub-menu-item .title.sc-admiralty-header-sub-menu-item{display:block}.header-sub-menu-item.sc-admiralty-header-sub-menu-item:hover{background-color:var(--admiralty-hover-background-colour)}}@media (max-width: 1023px){.header-sub-menu-item.sc-admiralty-header-sub-menu-item{display:block;box-sizing:border-box;padding:var(--admiralty-header-sub-menu-item-not-desktop-padding, var(--admiralty-spacing-3) var(--admiralty-spacing-6));cursor:pointer;color:var(--admiralty-colour-primary);font-weight:var(--admiralty-header-sub-menu-item-not-desktop-font-weight, var(--admiralty-font-weight-medium));background-color:unset;text-align:unset;text-decoration:unset}.header-sub-menu-item.sc-admiralty-header-sub-menu-item:hover{background-color:var(--admiralty-hover-background-colour)}.header-sub-menu-item.sc-admiralty-header-sub-menu-item:focus .title.sc-admiralty-header-sub-menu-item{box-shadow:0 -4px var(--admiralty-focus-colour), 0 4px var(--admiralty-colour-primary)}}";const m=r;const d=class{constructor(t){e(this,t);this.subMenuItemClick=a(this,"subMenuItemClick",7);this.menuTitle=undefined;this.href=undefined;this.suppressRedirect=false}handleClick(e){if(this.suppressRedirect){e.preventDefault()}e.stopPropagation();return this.subMenuItemClick.emit(this.menuTitle)}render(){return t(i,{key:"19347006dbf32b0419b177efdb68fa5a48549177"},this.href?t("div",{class:"header-sub-menu-item",onClick:e=>this.handleClick(e)},t("a",{class:"title",href:this.href,onClick:e=>this.handleClick(e)},this.menuTitle,t("slot",null))):t("button",{class:"header-sub-menu-item",onClick:e=>this.handleClick(e)},t("span",{class:"title"},this.menuTitle)))}};d.style=m;export{d as admiralty_header_sub_menu_item};
+//# sourceMappingURL=p-f8c36c93.entry.js.map

package/dist/admiralty/{p-0b4ce33e.entry.js.map → p-f8c36c93.entry.js.map}

@@ -1 +1 @@
-{"version":3,"names":["headerSubMenuItemCss","AdmiraltyHeaderSubMenuItemStyle0","HeaderSubMenuItemComponent","handleClick","ev","this","suppressRedirect","preventDefault","stopPropagation","subMenuItemClick","emit","menuTitle","render","h","Host","key","href","class","onClick"],"sources":["src/components/header-sub-menu-item/header-sub-menu-item.scss?tag=admiralty-header-sub-menu-item&encapsulation=scoped","src/components/header-sub-menu-item/header-sub-menu-item.tsx"],"sourcesContent":["@import 'header-sub-menu-item.vars';\n\n@mixin active {\n  background-color: $header-sub-menu-item-hover-background-colour;\n}\n\n.header-sub-menu-item {\n  background-color: $header-sub-menu-item-background-colour;\n\n  .title {\n    font-size: $header-sub-menu-item-text-size;\n    font-weight: $header-sub-menu-item-text-weight;\n  }\n\n  a {\n    text-decoration: none;\n  }\n\n  &:focus {\n    outline: none;\n\n    span {\n      @include focus-highlight;\n    }\n  }\n\n  @include desktop-only {\n    box-sizing: border-box;\n    color: $header-sub-menu-item-text-colour;\n    display: block;\n    margin-bottom: $header-sub-menu-item-desktop-margin-bottom;\n    padding: $header-sub-menu-item-desktop-padding;\n    text-align: left;\n    width: 300px;\n\n    .title {\n      display: block;\n    }\n\n    &:hover {\n      @include active;\n    }\n  }\n\n  @include not-desktop {\n    display: block;\n    box-sizing: border-box;\n    padding: $header-sub-menu-item-not-desktop-padding;\n    cursor: pointer;\n    color: $header-sub-menu-item-text-colour;\n    font-weight: $header-sub-menu-item-not-desktop-text-weight;\n    background-color: unset;\n    text-align: unset;\n    text-decoration: unset;\n\n    &:hover {\n      @include active;\n    }\n\n    &:focus {\n      .title {\n        box-shadow: 0 -4px $header-sub-menu-item-focus-colour, 0 4px $header-sub-menu-item-text-colour;\n      }\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-header-sub-menu-item',\n  styleUrl: 'header-sub-menu-item.scss',\n  scoped: true,\n})\nexport class HeaderSubMenuItemComponent {\n  /**\n   * The text that will be displayed in the menu\n   */\n  @Prop() menuTitle: string;\n\n  /**\n   * The URL to link to.\n   */\n  @Prop() href: string;\n\n  /**\n   * Causes the default browser redirect to be suppressed. Can be used in conjunction with the\n   * `onMenuItemClick` event to use a navigation router and prevent a full page reload when navigating.\n   */\n  @Prop() suppressRedirect?: boolean = false;\n\n  /**\n   * The event that is fired when a user clicks on the menu item.\n   * Event contains the menu item text.\n   */\n  @Event() subMenuItemClick: EventEmitter<string>;\n\n  handleClick(ev: MouseEvent): CustomEvent<string> {\n    if (this.suppressRedirect) {\n      ev.preventDefault();\n    }\n    ev.stopPropagation();\n\n    return this.subMenuItemClick.emit(this.menuTitle);\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.href ? (\n          <div class=\"header-sub-menu-item\" onClick={ev => this.handleClick(ev)}>\n            <a class=\"title\" href={this.href} onClick={ev => this.handleClick(ev)}>\n              {this.menuTitle}\n              <slot></slot>\n            </a>\n          </div>\n        ) : (\n          <button class=\"header-sub-menu-item\" onClick={ev => this.handleClick(ev)}>\n            <span class=\"title\">{this.menuTitle}</span>\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAuB,i1GAC7B,MAAAC,EAAeD,E,MCMFE,EAA0B,M,+IAeA,K,CAQrC,WAAAC,CAAYC,GACV,GAAIC,KAAKC,iBAAkB,CACzBF,EAAGG,gB,CAELH,EAAGI,kBAEH,OAAOH,KAAKI,iBAAiBC,KAAKL,KAAKM,U,CAGzC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFV,KAAKW,KACJH,EAAA,OAAKI,MAAM,uBAAuBC,QAASd,GAAMC,KAAKF,YAAYC,IAChES,EAAA,KAAGI,MAAM,QAAQD,KAAMX,KAAKW,KAAME,QAASd,GAAMC,KAAKF,YAAYC,IAC/DC,KAAKM,UACNE,EAAA,eAIJA,EAAA,UAAQI,MAAM,uBAAuBC,QAASd,GAAMC,KAAKF,YAAYC,IACnES,EAAA,QAAMI,MAAM,SAASZ,KAAKM,Y","ignoreList":[]}
+{"version":3,"names":["headerSubMenuItemCss","AdmiraltyHeaderSubMenuItemStyle0","HeaderSubMenuItemComponent","handleClick","ev","this","suppressRedirect","preventDefault","stopPropagation","subMenuItemClick","emit","menuTitle","render","h","Host","key","href","class","onClick"],"sources":["src/components/header-sub-menu-item/header-sub-menu-item.scss?tag=admiralty-header-sub-menu-item&encapsulation=scoped","src/components/header-sub-menu-item/header-sub-menu-item.tsx"],"sourcesContent":["@import 'header-sub-menu-item.vars';\n\n@mixin active {\n  background-color: $header-sub-menu-item-hover-background-colour;\n}\n\n.header-sub-menu-item {\n  background-color: $header-sub-menu-item-background-colour;\n\n  .title {\n    font-size: $header-sub-menu-item-text-size;\n    font-weight: $header-sub-menu-item-text-weight;\n  }\n\n  a {\n    text-decoration: none;\n  }\n\n  &:focus {\n    outline: none;\n\n    span {\n      @include focus-highlight;\n    }\n  }\n\n  @include desktop-only {\n    box-sizing: border-box;\n    color: $header-sub-menu-item-text-colour;\n    display: block;\n    margin-bottom: $header-sub-menu-item-desktop-margin-bottom;\n    padding: $header-sub-menu-item-desktop-padding;\n    text-align: left;\n    width: 300px;\n\n    .title {\n      display: block;\n    }\n\n    &:hover {\n      @include active;\n    }\n  }\n\n  @include not-desktop {\n    display: block;\n    box-sizing: border-box;\n    padding: $header-sub-menu-item-not-desktop-padding;\n    cursor: pointer;\n    color: $header-sub-menu-item-text-colour;\n    font-weight: $header-sub-menu-item-not-desktop-text-weight;\n    background-color: unset;\n    text-align: unset;\n    text-decoration: unset;\n\n    &:hover {\n      @include active;\n    }\n\n    &:focus {\n      .title {\n        box-shadow: 0 -4px $header-sub-menu-item-focus-colour, 0 4px $header-sub-menu-item-text-colour;\n      }\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-header-sub-menu-item',\n  styleUrl: 'header-sub-menu-item.scss',\n  scoped: true,\n})\nexport class HeaderSubMenuItemComponent {\n  /**\n   * The text that will be displayed in the menu\n   */\n  @Prop() menuTitle: string;\n\n  /**\n   * The URL to link to.\n   */\n  @Prop() href: string;\n\n  /**\n   * Causes the default browser redirect to be suppressed. Can be used in conjunction with the\n   * `onMenuItemClick` event to use a navigation router and prevent a full page reload when navigating.\n   */\n  @Prop() suppressRedirect?: boolean = false;\n\n  /**\n   * The event that is fired when a user clicks on the menu item.\n   * Event contains the menu item text.\n   */\n  @Event() subMenuItemClick: EventEmitter<string>;\n\n  handleClick(ev: MouseEvent): CustomEvent<string> {\n    if (this.suppressRedirect) {\n      ev.preventDefault();\n    }\n    ev.stopPropagation();\n\n    return this.subMenuItemClick.emit(this.menuTitle);\n  }\n\n  render() {\n    return (\n      <Host>\n        {this.href ? (\n          <div class=\"header-sub-menu-item\" onClick={ev => this.handleClick(ev)}>\n            <a class=\"title\" href={this.href} onClick={ev => this.handleClick(ev)}>\n              {this.menuTitle}\n              <slot></slot>\n            </a>\n          </div>\n        ) : (\n          <button class=\"header-sub-menu-item\" onClick={ev => this.handleClick(ev)}>\n            <span class=\"title\">{this.menuTitle}</span>\n          </button>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAuB,u1GAC7B,MAAAC,EAAeD,E,MCMFE,EAA0B,M,+IAeA,K,CAQrC,WAAAC,CAAYC,GACV,GAAIC,KAAKC,iBAAkB,CACzBF,EAAGG,gB,CAELH,EAAGI,kBAEH,OAAOH,KAAKI,iBAAiBC,KAAKL,KAAKM,U,CAGzC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACFV,KAAKW,KACJH,EAAA,OAAKI,MAAM,uBAAuBC,QAASd,GAAMC,KAAKF,YAAYC,IAChES,EAAA,KAAGI,MAAM,QAAQD,KAAMX,KAAKW,KAAME,QAASd,GAAMC,KAAKF,YAAYC,IAC/DC,KAAKM,UACNE,EAAA,eAIJA,EAAA,UAAQI,MAAM,uBAAuBC,QAASd,GAAMC,KAAKF,YAAYC,IACnES,EAAA,QAAMI,MAAM,SAASZ,KAAKM,Y","ignoreList":[]}

package/dist/cjs/admiralty-breadcrumb.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2aa80b51.js');
 
-const breadcrumbCss = ".sc-admiralty-breadcrumb-h{display:flex;align-items:center}.breadcrumb-icon.sc-admiralty-breadcrumb{margin:var(--admiralty-breadcrumb-icon-margin, var(--admiralty-spacing-0) var(--admiralty-spacing-2));font-size:var(--admiralty-breadcrumb-icon-font-size, var(--admiralty-font-size--2));color:var(--admiralty-colour-primary)}a.sc-admiralty-breadcrumb{display:inline-block;font-size:var(--admiralty-breadcrumb-font-size, var(--admiralty-font-size--1));font-weight:var(--admiralty-breadcrumb-font-weight, var(--admiralty-font-weight-normal));text-decoration:none;color:var(--admiralty-text-colour);margin:var(--admiralty-breadcrumb-href-margin, var(--admiralty-spacing-2) var(--admiralty-spacing-1))}a.sc-admiralty-breadcrumb:hover{color:var(--admiralty-colour-primary);text-decoration:underline;text-underline-offset:0.15em;text-decoration-thickness:0.15em}a.sc-admiralty-breadcrumb:focus{text-decoration:none}a.active.sc-admiralty-breadcrumb{color:var(--admiralty-colour-primary);font-weight:var(--admiralty-breadcrumb-font-weight-active, var(--admiralty-font-weight-medium))}";
+const breadcrumbCss = ".sc-admiralty-breadcrumb-h{display:flex;align-items:center}.breadcrumb-icon.sc-admiralty-breadcrumb{margin:var(--admiralty-breadcrumb-icon-margin, var(--admiralty-spacing-0) var(--admiralty-spacing-2));font-size:var(--admiralty-breadcrumb-icon-font-size, var(--admiralty-font-size--2));color:var(--admiralty-colour-primary)}a.sc-admiralty-breadcrumb{display:inline-block;font-size:var(--admiralty-breadcrumb-font-size, var(--admiralty-font-size--1));font-weight:var(--admiralty-breadcrumb-font-weight, var(--admiralty-font-weight-normal));text-decoration:none;color:var(--admiralty-text-colour);margin:var(--admiralty-breadcrumb-href-margin, var(--admiralty-spacing-2) var(--admiralty-spacing-1))}a.sc-admiralty-breadcrumb:hover{color:var(--admiralty-colour-primary);text-decoration:underline;text-underline-offset:0.15em;text-decoration-thickness:0.15em}a.sc-admiralty-breadcrumb:focus{text-decoration:none;background-color:var(--admiralty-focus-colour);color:var(--admiralty-focus-contrast)}a.active.sc-admiralty-breadcrumb{color:var(--admiralty-colour-primary);font-weight:var(--admiralty-breadcrumb-font-weight-active, var(--admiralty-font-weight-medium))}";
 const AdmiraltyBreadcrumbStyle0 = breadcrumbCss;
 
 const BreadcrumbComponent = class {

package/dist/cjs/admiralty-breadcrumb.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-breadcrumb.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,qjCAAqjC,CAAC;AAC5kC,kCAAe,aAAa;;MCMf,mBAAmB;;;sBAMb,KAAK;;;;IAatB,MAAM;QACJ,QACEA,QAACC,UAAI,uDACF,CAAC,IAAI,CAAC,KAAK,IAAID,6EAAgB,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,2BAA2B,GAAkB,EAC1GA,gEAAG,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,GAAG,IACvDA,oEAAa,CACX,CACC,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/breadcrumb/breadcrumb.scss?tag=admiralty-breadcrumb&encapsulation=scoped","src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["@import \"breadcrumb.vars\";\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\n.breadcrumb-icon {\n  margin: $breadcrumb-icon-margin;\n  font-size: $breadcrumb-icon-font-size;\n  color: $breadcrumb-separator-colour;\n}\n\na {\n  display: inline-block;\n  font-size: $breadcrumb-font-size;\n  font-weight: $breadcrumb-font-weight;\n  text-decoration: none;\n  color: $breadcrumb-font-colour;\n  margin: $breadcrumb-href-margin;\n\n  &:hover {\n    color: $breadcrumb-font-colour-hover;\n    text-decoration: underline;\n    text-underline-offset: 0.15em;\n    text-decoration-thickness: 0.15em;\n  }\n\n  &:focus {\n    text-decoration: none;\n  }\n\n  &.active {\n    color: $breadcrumb-font-colour-active;\n    font-weight: $breadcrumb-font-weight-active;\n  }\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-breadcrumb',\n  styleUrl: 'breadcrumb.scss',\n  scoped: true,\n})\nexport class BreadcrumbComponent {\n  /**\n   * When `true` the breadcrumb will by styled to show that it is the\n   * currently active breadcrumb. Defaults to `true` for the\n   * last breadcrumb if it is not set on any.\n   */\n  @Prop() active = false;\n\n  /**\n   * @internal\n   * When set to `true` the breadcrumb will not be prefixed with a chevron.\n   */\n  @Prop() first!: boolean;\n\n  /**\n   * Contains a URL or a URL fragment that the hyperlink points to.\n   */\n  @Prop() href: string | undefined;\n\n  render() {\n    return (\n      <Host>\n        {!this.first && <admiralty-icon class=\"breadcrumb-icon\" name=\"arrow-forward-ios-rounded\"></admiralty-icon>}\n        <a class={{ active: this.active }} href={this.href || '#'}>\n          <slot></slot>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-breadcrumb.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,0oCAA0oC,CAAC;AACjqC,kCAAe,aAAa;;MCMf,mBAAmB;;;sBAMb,KAAK;;;;IAatB,MAAM;QACJ,QACEA,QAACC,UAAI,uDACF,CAAC,IAAI,CAAC,KAAK,IAAID,6EAAgB,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,2BAA2B,GAAkB,EAC1GA,gEAAG,KAAK,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,GAAG,IACvDA,oEAAa,CACX,CACC,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/breadcrumb/breadcrumb.scss?tag=admiralty-breadcrumb&encapsulation=scoped","src/components/breadcrumb/breadcrumb.tsx"],"sourcesContent":["@import \"breadcrumb.vars\";\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\n.breadcrumb-icon {\n  margin: $breadcrumb-icon-margin;\n  font-size: $breadcrumb-icon-font-size;\n  color: $breadcrumb-separator-colour;\n}\n\na {\n  display: inline-block;\n  font-size: $breadcrumb-font-size;\n  font-weight: $breadcrumb-font-weight;\n  text-decoration: none;\n  color: $breadcrumb-font-colour;\n  margin: $breadcrumb-href-margin;\n\n  &:hover {\n    color: $breadcrumb-font-colour-hover;\n    text-decoration: underline;\n    text-underline-offset: 0.15em;\n    text-decoration-thickness: 0.15em;\n  }\n\n  &:focus {\n    text-decoration: none;\n    background-color: $focus-background-colour;\n    color: $focus-text-colour;\n  }\n\n  &.active {\n    color: $breadcrumb-font-colour-active;\n    font-weight: $breadcrumb-font-weight-active;\n  }\n}\n","import { Component, Prop, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-breadcrumb',\n  styleUrl: 'breadcrumb.scss',\n  scoped: true,\n})\nexport class BreadcrumbComponent {\n  /**\n   * When `true` the breadcrumb will by styled to show that it is the\n   * currently active breadcrumb. Defaults to `true` for the\n   * last breadcrumb if it is not set on any.\n   */\n  @Prop() active = false;\n\n  /**\n   * @internal\n   * When set to `true` the breadcrumb will not be prefixed with a chevron.\n   */\n  @Prop() first!: boolean;\n\n  /**\n   * Contains a URL or a URL fragment that the hyperlink points to.\n   */\n  @Prop() href: string | undefined;\n\n  render() {\n    return (\n      <Host>\n        {!this.first && <admiralty-icon class=\"breadcrumb-icon\" name=\"arrow-forward-ios-rounded\"></admiralty-icon>}\n        <a class={{ active: this.active }} href={this.href || '#'}>\n          <slot></slot>\n        </a>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/admiralty-button.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2aa80b51.js');
 
-const buttonCss = ".visually-hidden.sc-admiralty-button:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-button{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-button{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-button{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-button{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-button{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-button{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-button{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-button{display:none}}button.primary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-text-colour);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.primary:focus.sc-admiralty-button-s>*,button.primary:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.primary.sc-admiralty-button:disabled{cursor:default}button.primary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.primary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.primary.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.primary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:hover{background-color:var(--admiralty-colour-primary-shade);border:2px solid var(--admiralty-colour-primary-shade);color:var(--admiralty-colour-primary-contrast);border-color:var(--admiralty-colour-primary-shade);padding:var(--admiralty-button-primary-hover-padding, 10px var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:hover:focus{padding:var(--admiralty-button-primary-hover-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.primary.sc-admiralty-button:hover:focus:active{padding:var(--admiralty-button-primary-hover-focus-active-padding, 10px var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.secondary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary)}button.secondary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-text-colour);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.secondary:focus.sc-admiralty-button-s>*,button.secondary:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.secondary.sc-admiralty-button:disabled{cursor:default}button.secondary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.secondary.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.secondary.sc-admiralty-button:hover{background-color:var(--admiralty-hover-background-colour);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary-shade);padding:var(--admiralty-button-secondary-hover-padding, 10px var(--admiralty-spacing-4))}button.secondary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.secondary.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.warning.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-danger);color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:focus{outline:none;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-text-colour);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.warning:focus.sc-admiralty-button-s>*,button.warning:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.warning.sc-admiralty-button:disabled{cursor:default}button.warning.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.warning.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.warning.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.warning.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.warning.sc-admiralty-button:hover{background-color:var(--admiralty-colour-danger-shade);color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger-shade);padding:var(--admiralty-button-warning-hover-padding, 10px var(--admiralty-spacing-4))}button.warning.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger-contrast);color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.warning.sc-admiralty-button:disabled>*.sc-admiralty-button{opacity:0.5}button.warning.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-danger-contrast)}button.text.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:focus{outline:none;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-text-colour);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.text:focus.sc-admiralty-button-s>*,button.text:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.text.sc-admiralty-button:disabled{cursor:default}button.text.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.text.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.text.sc-admiralty-button:enabled:active{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:disabled{color:var(--admiralty-disabled-colour)}button.text.sc-admiralty-button:disabled>*.sc-admiralty-button{opacity:0.5}button.text.sc-admiralty-button:focus{border:none;box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-text-colour);text-decoration:none;padding:var(--admiralty-button-text-focus-padding, var(--admiralty-spacing-0))}button.text:focus.sc-admiralty-button-s>*,button.text:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.text.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.icon.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;min-height:44px;min-width:50px;background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary);padding:var(--admiralty-button-icon-padding, var(--admiralty-spacing-2))}button.icon.sc-admiralty-button:focus{outline:none;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-text-colour);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.icon:focus.sc-admiralty-button-s>*,button.icon:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.icon.sc-admiralty-button:disabled{cursor:default}button.icon.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.icon.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.icon.sc-admiralty-button:focus{padding:var(--admiralty-button-icon-focus-padding, var(--admiralty-spacing-3) var(--admiralty-spacing-4) var(--admiralty-spacing-2))}button.icon.sc-admiralty-button:hover{background-color:var(--admiralty-colour-primary-shade);border:2px solid var(--admiralty-colour-primary);padding:var(--admiralty-button-icon-hover-padding, var(--admiralty-spacing-2))}button.icon.sc-admiralty-button admiralty-icon.icon-padding.sc-admiralty-button{padding-left:8px}button.icon.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary)}button.icon.sc-admiralty-button:enabled:active admiralty-icon.sc-admiralty-button{color:var(--admiralty-colour-primary) !important}button.icon.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour);opacity:0.3}button.icon.borderless.sc-admiralty-button{border:none;background-color:yellow}button.icon.sc-admiralty-button:active:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour);opacity:0.3}button.icon.sc-admiralty-button i.sc-admiralty-button{margin:auto;font-size:unset;color:unset;padding-left:unset}button.icon-secondary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;min-height:44px;min-width:50px;background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary);padding:9px}button.icon-secondary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-text-colour);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.icon-secondary:focus.sc-admiralty-button-s>*,button.icon-secondary:focus .sc-admiralty-button-s>*{color:var(--admiralty-text-colour) !important}button.icon-secondary.sc-admiralty-button:disabled{cursor:default}button.icon-secondary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.icon-secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.icon-secondary.sc-admiralty-button:focus{padding:11px 11px 8px}button.icon-secondary.sc-admiralty-button:hover{background-color:var(--admiralty-hover-background-colour);border:2px solid var(--admiralty-colour-primary);padding:9px}button.icon-secondary.sc-admiralty-button admiralty-icon.icon-padding.sc-admiralty-button{padding-left:8px}button.icon-secondary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary);border:2px solid transparent}button.icon-secondary.sc-admiralty-button:enabled:active admiralty-icon.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast) !important}button.icon-secondary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-colour-primary);opacity:0.3}button.icon-secondary.borderless.sc-admiralty-button{border:none}button.icon-secondary.sc-admiralty-button:active:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-colour-primary);opacity:0.3}button.icon-secondary.sc-admiralty-button i.sc-admiralty-button{margin:var(--admiralty-button-icon-idiomatic-margin, var(--admiralty-spacing-auto));font-size:unset;color:unset;padding-left:var(--admiralty-button-icon-idiomatic-padding, var(--admiralty-spacing-unset))}";
+const buttonCss = ".visually-hidden.sc-admiralty-button:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-button{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-button{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-button{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-button{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-button{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-button{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-button{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-button{display:none}}button.primary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.primary:focus.sc-admiralty-button-s>*,button.primary:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.primary.sc-admiralty-button:disabled{cursor:default}button.primary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.primary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.primary.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.primary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:hover{background-color:var(--admiralty-colour-primary-shade);border:2px solid var(--admiralty-colour-primary-shade);color:var(--admiralty-colour-primary-contrast);border-color:var(--admiralty-colour-primary-shade);padding:var(--admiralty-button-primary-hover-padding, 10px var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:hover:focus{padding:var(--admiralty-button-primary-hover-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.primary.sc-admiralty-button:hover:focus:active{padding:var(--admiralty-button-primary-hover-focus-active-padding, 10px var(--admiralty-spacing-4))}button.primary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.primary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.secondary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary)}button.secondary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.secondary:focus.sc-admiralty-button-s>*,button.secondary:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.secondary.sc-admiralty-button:disabled{cursor:default}button.secondary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.secondary.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.secondary.sc-admiralty-button:hover{background-color:var(--admiralty-hover-background-colour);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary-shade);padding:var(--admiralty-button-secondary-hover-padding, 10px var(--admiralty-spacing-4))}button.secondary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast)}button.secondary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.secondary.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.warning.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;height:44px;padding:var(--admiralty-button-defaults-padding, 10px var(--admiralty-spacing-4));white-space:nowrap;min-width:50px;background-color:var(--admiralty-colour-danger);color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.warning:focus.sc-admiralty-button-s>*,button.warning:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.warning.sc-admiralty-button:disabled{cursor:default}button.warning.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.warning.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}@media (max-width: 1023px){button.warning.sc-admiralty-button{min-width:unset;max-width:200px;width:100%;height:44px;padding:var(--admiralty-button-not-desktop-padding, 10px var(--admiralty-spacing-4))}}button.warning.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-idiomatic-font-size, var(--admiralty-font-size-2));color:var(--admiralty-colour-primary);padding-left:var(--admiralty-button-idiomatic-padding-left, var(--admiralty-spacing-4))}button.warning.sc-admiralty-button:hover{background-color:var(--admiralty-colour-danger-shade);color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger-shade);padding:var(--admiralty-button-warning-hover-padding, 10px var(--admiralty-spacing-4))}button.warning.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-danger-contrast);border:2px solid var(--admiralty-colour-danger-contrast);color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-danger)}button.warning.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour)}button.warning.sc-admiralty-button:disabled>*.sc-admiralty-button{opacity:0.5}button.warning.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-danger-contrast)}button.text.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.text:focus.sc-admiralty-button-s>*,button.text:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.text.sc-admiralty-button:disabled{cursor:default}button.text.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.text.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.text.sc-admiralty-button:enabled:active{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:enabled:active i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:enabled:active p.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.text.sc-admiralty-button:disabled{color:var(--admiralty-disabled-colour)}button.text.sc-admiralty-button:disabled>*.sc-admiralty-button{opacity:0.5}button.text.sc-admiralty-button:focus{border:none;box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-focus-contrast);text-decoration:none;padding:var(--admiralty-button-text-focus-padding, var(--admiralty-spacing-0))}button.text:focus.sc-admiralty-button-s>*,button.text:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.text.sc-admiralty-button i.sc-admiralty-button{color:var(--admiralty-colour-primary)}button.icon.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;min-height:44px;min-width:50px;background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary);padding:var(--admiralty-button-icon-padding, var(--admiralty-spacing-2))}button.icon.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.icon:focus.sc-admiralty-button-s>*,button.icon:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.icon.sc-admiralty-button:disabled{cursor:default}button.icon.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.icon.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.icon.sc-admiralty-button:focus{padding:var(--admiralty-button-icon-focus-padding, var(--admiralty-spacing-3) var(--admiralty-spacing-4) var(--admiralty-spacing-2))}button.icon.sc-admiralty-button:hover{background-color:var(--admiralty-colour-primary-shade);border:2px solid var(--admiralty-colour-primary);padding:var(--admiralty-button-icon-hover-padding, var(--admiralty-spacing-2))}button.icon.sc-admiralty-button admiralty-icon.icon-padding.sc-admiralty-button{padding-left:8px}button.icon.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary)}button.icon.sc-admiralty-button:enabled:active admiralty-icon.sc-admiralty-button{color:var(--admiralty-colour-primary) !important}button.icon.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour);opacity:0.3}button.icon.borderless.sc-admiralty-button{border:none;background-color:yellow}button.icon.sc-admiralty-button:active:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-disabled-colour);opacity:0.3}button.icon.sc-admiralty-button i.sc-admiralty-button{margin:auto;font-size:unset;color:unset;padding-left:unset}button.icon-secondary.sc-admiralty-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));line-height:24px;font-weight:var(--admiralty-button-font-weight, var(--admiralty-font-weight-medium));background-color:unset;cursor:pointer;min-height:44px;min-width:50px;background-color:var(--admiralty-colour-primary-contrast);color:var(--admiralty-colour-primary);border:2px solid var(--admiralty-colour-primary);padding:9px}button.icon-secondary.sc-admiralty-button:focus{outline:none;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);border:none;border-bottom:4px solid var(--admiralty-focus-contrast);padding:var(--admiralty-button-focus-padding, var(--admiralty-spacing-3) 18px var(--admiralty-spacing-2))}button.icon-secondary:focus.sc-admiralty-button-s>*,button.icon-secondary:focus .sc-admiralty-button-s>*{color:var(--admiralty-focus-contrast) !important}button.icon-secondary.sc-admiralty-button:disabled{cursor:default}button.icon-secondary.sc-admiralty-button:disabled *.sc-admiralty-button{pointer-events:none}button.icon-secondary.sc-admiralty-button i.sc-admiralty-button{display:inline-block;font-size:var(--admiralty-button-font-size, var(--admiralty-font-size-0));color:var(--admiralty-colour-primary);padding:var(--admiralty-button-defaults-idiomatic-padding, 10px var(--admiralty-spacing-4))}button.icon-secondary.sc-admiralty-button:focus{padding:11px 11px 8px}button.icon-secondary.sc-admiralty-button:hover{background-color:var(--admiralty-hover-background-colour);border:2px solid var(--admiralty-colour-primary);padding:9px}button.icon-secondary.sc-admiralty-button admiralty-icon.icon-padding.sc-admiralty-button{padding-left:8px}button.icon-secondary.sc-admiralty-button:enabled:active{background-color:var(--admiralty-colour-primary);color:var(--admiralty-colour-primary-contrast);border:2px solid var(--admiralty-colour-primary);border:2px solid transparent}button.icon-secondary.sc-admiralty-button:enabled:active admiralty-icon.sc-admiralty-button{color:var(--admiralty-colour-primary-contrast) !important}button.icon-secondary.sc-admiralty-button:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-colour-primary);opacity:0.3}button.icon-secondary.borderless.sc-admiralty-button{border:none}button.icon-secondary.sc-admiralty-button:active:disabled{background-color:var(--admiralty-disabled-colour);border:2px solid var(--admiralty-colour-primary);opacity:0.3}button.icon-secondary.sc-admiralty-button i.sc-admiralty-button{margin:var(--admiralty-button-icon-idiomatic-margin, var(--admiralty-spacing-auto));font-size:unset;color:unset;padding-left:var(--admiralty-button-icon-idiomatic-padding, var(--admiralty-spacing-unset))}";
 const AdmiraltyButtonStyle0 = buttonCss;
 
 const ButtonComponent = class {

package/dist/cjs/admiralty-button.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-button.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,s3iBAAs3iB,CAAC;AACz4iB,8BAAe,SAAS;;MCOX,eAAe;;;uBAMO,SAAS;;wBAQN,KAAK;0BAMpB,KAAK;oBAIoB,QAAQ;;;;;IAgBtD,MAAM;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC;QAE7D,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QACnC,MAAM,KAAK,kDACL,IAAI,IAAI,EAAE,IAAI,EAAE,KAChB,IAAI,IAAI,EAAE,IAAI,EAAE,KAChB,KAAK,IAAI,EAAE,KAAK,EAAE,EACvB,CAAC;QAEF,QACEA,mFAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAM,KAAK,GACvHA,oEAAa,EACZ,IAAI,CAAC,IAAI,GAAGA,4BAAgB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,cAAc,GAAG,cAAc,GAAG,EAAE,EAAE,GAAmB,GAAG,SAAS,CACtH,EACT;KACH;;;;;;;","names":["h"],"sources":["src/components/button/button.scss?tag=admiralty-button&encapsulation=scoped","src/components/button/button.tsx"],"sourcesContent":["@import 'button.vars';\n\n@mixin button-defaults {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  font-size: $button-font-size;\n  line-height: $button-line-height;\n  font-weight: $button-font-weight;\n  background-color: unset;\n  cursor: pointer;\n\n  &:focus {\n    outline: none;\n    color: $button-focus-text-colour;\n    background-color: $button-focus-colour;\n    border: none;\n    border-bottom: 4px solid $button-focus-text-colour;\n    padding: $button-focus-padding;\n\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    * {\n      pointer-events: none;\n    }\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-font-size;\n    color: $button-icon-colour;\n    padding: $button-defaults-idiomatic-padding;\n  }\n}\n\n@mixin button {\n  @include button-defaults;\n  height: 44px;\n  padding: $button-defaults-padding;\n  white-space: nowrap;\n  min-width: 50px;\n\n  @include not-desktop {\n    min-width: unset;\n    max-width: 200px;\n    width: 100%;\n    height: 44px;\n    padding: $button-not-desktop-padding;\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-idiomatic-font-size;\n    color: $button-icon-colour;\n    padding-left: $button-idiomatic-padding-left;\n  }\n}\n\n/* Primary Buttons */\nbutton.primary {\n  @include button;\n  background-color: $button-colour-standard;\n  color: $button-text-colour-standard;\n  border: 2px solid $button-border-colour-standard;\n\n  &:hover {\n    background-color: $button-hover-colour-standard;\n    border: 2px solid $button-hover-colour-standard;\n    color: $button-hover-text-colour-standard;\n    border-color: $button-hover-border-colour-standard;\n    padding: $button-primary-hover-padding;\n  }\n\n  &:hover:focus {\n    padding: $button-primary-hover-focus-padding;\n  }\n\n  &:hover:focus:active {\n    padding: $button-primary-hover-focus-active-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-standard;\n    border: 2px solid $button-active-border-colour-standard;\n    color: $button-active-text-colour-standard;\n\n    i {\n      color: $button-active-text-colour-standard;\n    }\n\n    p {\n      color: $button-active-text-colour-standard;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n}\n\n/* Secondary Buttons */\nbutton.secondary {\n  @include button;\n  background-color: $button-colour-secondary;\n  color: $button-text-colour-secondary;\n  border: 2px solid $button-border-colour-secondary;\n\n  &:hover {\n    background-color: $button-hover-colour-secondary;\n    color: $button-hover-text-colour-secondary;\n    border: 2px solid $button-hover-border-colour-secondary;\n    padding: $button-secondary-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-secondary;\n    border: 2px solid $button-active-border-colour-secondary;\n    color: $button-active-text-colour-secondary;\n\n    i {\n      color: $button-active-text-colour-secondary;\n    }\n\n    p {\n      color: $button-active-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Warning Buttons */\nbutton.warning {\n  @include button;\n  background-color: $button-colour-warning;\n  color: $button-text-colour-warning;\n  border: 2px solid $button-border-colour-warning;\n\n  &:hover {\n    background-color: $button-hover-colour-warning;\n    color: $button-text-colour-warning;\n    border: 2px solid $button-hover-border-colour-warning;\n    padding: $button-warning-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-warning;\n    border: 2px solid $button-active-border-colour-warning;\n    color: $button-active-text-colour-warning;\n\n    i {\n      color: $button-active-text-colour-warning;\n    }\n\n    p {\n      color: $button-active-text-colour-warning;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  i {\n    color: $button-text-colour-warning;\n  }\n}\n\n/* Text Buttons */\nbutton.text {\n  @include button-defaults;\n  color: $button-text-colour-secondary;\n\n  &:enabled:active {\n    color: $button-text-colour-secondary;\n\n    i {\n      color: $button-text-colour-secondary;\n    }\n\n    p {\n      color: $button-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    color: $button-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  &:focus {\n    border: none;\n    box-shadow:\n      0 -2px $button-focus-colour,\n      0 4px $button-focus-text-colour;\n    text-decoration: none;\n    padding: $button-text-focus-padding;\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Icon Buttons */\nbutton.icon {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon;\n  color: $button-text-colour-icon;\n  border: 2px solid $button-border-colour-icon;\n  padding: $button-icon-padding;\n\n  &:focus {\n    padding: $button-icon-focus-padding;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon;\n    border: 2px solid $button-hover-border-colour-icon;\n    padding: $button-icon-hover-padding;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon;\n    color: $button-active-text-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n    background-color: yellow;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: auto;\n    font-size: unset;\n    color: unset;\n    padding-left: unset;\n  }\n}\nbutton.icon-secondary {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon-secondary;\n  color: $button-text-colour-icon-secondary;\n  border: 2px solid $button-border-colour-icon-secondary;\n  padding: 9px;\n\n  &:focus {\n    padding: 11px 11px 8px;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon-secondary;\n    border: 2px solid $button-hover-border-colour-icon-secondary;\n    padding: 9px;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon-secondary;\n    color: $button-active-text-colour-icon-secondary;\n    border: 2px solid $button-active-border-colour-icon-secondary;\n    border: 2px solid transparent;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon-secondary !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: $button-icon-idiomatic-margin;\n    font-size: unset;\n    color: unset;\n    padding-left: $button-icon-idiomatic-padding;\n  }\n}\n","import { Component, Prop, h, Element } from '@stencil/core';\nimport { ButtonVariant } from './button.types';\n\n@Component({\n  tag: 'admiralty-button',\n  styleUrl: 'button.scss',\n  scoped: true,\n})\nexport class ButtonComponent {\n  @Element() el: HTMLElement;\n  /**\n   * The type of button to render. Valid values are `primary`, `secondary`, `warning`, `text` and `icon`.\n   * Default value is `primary`.\n   */\n  @Prop() variant: ButtonVariant = 'primary';\n  /**\n   * When passed Material Icon name, then an icon will be rendered.\n   */\n  @Prop() icon: string;\n  /**\n   * Determines whether the button is disabled. A button in disabled state will not fire click output events.\n   */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n   * The default behavior of the button. Valid values are `button`, `submit` and `reset`.\n   * Default value is `submit`.\n   */\n\n  @Prop() borderless = false;\n  /**\n   * Default value is false\n   */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'submit';\n  /**\n   * The `<form>` element to associate the button with (its form owner).\n   */\n  @Prop() form: string;\n  /**\n   * The name of the button, submitted as a pair with the button's value as part of the form data,\n   * when that button is used to submit the form.\n   */\n  @Prop() name: string;\n  /**\n   * Defines the value associated with the button's name when it's submitted with the form data.\n   * This value is passed to the server in params when the form is submitted using this button.\n   */\n  @Prop() value: string;\n\n  render() {\n    const hasTextContent = this.el.textContent.trim().length > 0;\n\n    const { form, name, value } = this;\n    const props = {\n      ...(form && { form }),\n      ...(name && { name }),\n      ...(value && { value }),\n    };\n\n    return (\n      <button type={this.type} disabled={this.disabled} class={{ [this.variant]: true, borderless: this.borderless }} {...props}>\n        <slot></slot>\n        {this.icon ? <admiralty-icon name={this.icon} class={`${hasTextContent ? 'icon-padding' : ''}`}></admiralty-icon> : undefined}\n      </button>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-button.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,k7iBAAk7iB,CAAC;AACr8iB,8BAAe,SAAS;;MCOX,eAAe;;;uBAMO,SAAS;;wBAQN,KAAK;0BAMpB,KAAK;oBAIoB,QAAQ;;;;;IAgBtD,MAAM;QACJ,MAAM,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC;QAE7D,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;QACnC,MAAM,KAAK,kDACL,IAAI,IAAI,EAAE,IAAI,EAAE,KAChB,IAAI,IAAI,EAAE,IAAI,EAAE,KAChB,KAAK,IAAI,EAAE,KAAK,EAAE,EACvB,CAAC;QAEF,QACEA,mFAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,IAAM,KAAK,GACvHA,oEAAa,EACZ,IAAI,CAAC,IAAI,GAAGA,4BAAgB,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,cAAc,GAAG,cAAc,GAAG,EAAE,EAAE,GAAmB,GAAG,SAAS,CACtH,EACT;KACH;;;;;;;","names":["h"],"sources":["src/components/button/button.scss?tag=admiralty-button&encapsulation=scoped","src/components/button/button.tsx"],"sourcesContent":["@import 'button.vars';\n\n@mixin button-defaults {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  font-size: $button-font-size;\n  line-height: $button-line-height;\n  font-weight: $button-font-weight;\n  background-color: unset;\n  cursor: pointer;\n\n  &:focus {\n    outline: none;\n    color: $button-focus-text-colour;\n    background-color: $button-focus-colour;\n    border: none;\n    border-bottom: 4px solid $button-focus-text-colour;\n    padding: $button-focus-padding;\n\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  &:disabled {\n    cursor: default;\n    * {\n      pointer-events: none;\n    }\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-font-size;\n    color: $button-icon-colour;\n    padding: $button-defaults-idiomatic-padding;\n  }\n}\n\n@mixin button {\n  @include button-defaults;\n  height: 44px;\n  padding: $button-defaults-padding;\n  white-space: nowrap;\n  min-width: 50px;\n\n  @include not-desktop {\n    min-width: unset;\n    max-width: 200px;\n    width: 100%;\n    height: 44px;\n    padding: $button-not-desktop-padding;\n  }\n\n  i {\n    display: inline-block;\n    font-size: $button-idiomatic-font-size;\n    color: $button-icon-colour;\n    padding-left: $button-idiomatic-padding-left;\n  }\n}\n\n/* Primary Buttons */\nbutton.primary {\n  @include button;\n  background-color: $button-colour-standard;\n  color: $button-text-colour-standard;\n  border: 2px solid $button-border-colour-standard;\n\n  &:hover {\n    background-color: $button-hover-colour-standard;\n    border: 2px solid $button-hover-colour-standard;\n    color: $button-hover-text-colour-standard;\n    border-color: $button-hover-border-colour-standard;\n    padding: $button-primary-hover-padding;\n  }\n\n  &:hover:focus {\n    padding: $button-primary-hover-focus-padding;\n  }\n\n  &:hover:focus:active {\n    padding: $button-primary-hover-focus-active-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-standard;\n    border: 2px solid $button-active-border-colour-standard;\n    color: $button-active-text-colour-standard;\n\n    i {\n      color: $button-active-text-colour-standard;\n    }\n\n    p {\n      color: $button-active-text-colour-standard;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n}\n\n/* Secondary Buttons */\nbutton.secondary {\n  @include button;\n  background-color: $button-colour-secondary;\n  color: $button-text-colour-secondary;\n  border: 2px solid $button-border-colour-secondary;\n\n  &:hover {\n    background-color: $button-hover-colour-secondary;\n    color: $button-hover-text-colour-secondary;\n    border: 2px solid $button-hover-border-colour-secondary;\n    padding: $button-secondary-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-secondary;\n    border: 2px solid $button-active-border-colour-secondary;\n    color: $button-active-text-colour-secondary;\n\n    i {\n      color: $button-active-text-colour-secondary;\n    }\n\n    p {\n      color: $button-active-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Warning Buttons */\nbutton.warning {\n  @include button;\n  background-color: $button-colour-warning;\n  color: $button-text-colour-warning;\n  border: 2px solid $button-border-colour-warning;\n\n  &:hover {\n    background-color: $button-hover-colour-warning;\n    color: $button-text-colour-warning;\n    border: 2px solid $button-hover-border-colour-warning;\n    padding: $button-warning-hover-padding;\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-warning;\n    border: 2px solid $button-active-border-colour-warning;\n    color: $button-active-text-colour-warning;\n\n    i {\n      color: $button-active-text-colour-warning;\n    }\n\n    p {\n      color: $button-active-text-colour-warning;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-border-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  i {\n    color: $button-text-colour-warning;\n  }\n}\n\n/* Text Buttons */\nbutton.text {\n  @include button-defaults;\n  color: $button-text-colour-secondary;\n\n  &:enabled:active {\n    color: $button-text-colour-secondary;\n\n    i {\n      color: $button-text-colour-secondary;\n    }\n\n    p {\n      color: $button-text-colour-secondary;\n    }\n  }\n\n  &:disabled {\n    color: $button-colour-deselected;\n    & > * {\n      opacity: 0.5;\n    }\n  }\n\n  &:focus {\n    border: none;\n    box-shadow:\n      0 -2px $button-focus-colour,\n      0 4px $button-focus-text-colour;\n    text-decoration: none;\n    padding: $button-text-focus-padding;\n    ::slotted(*) {\n      color: $button-focus-text-colour !important;\n    }\n  }\n\n  i {\n    color: $button-text-colour-secondary;\n  }\n}\n\n/* Icon Buttons */\nbutton.icon {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon;\n  color: $button-text-colour-icon;\n  border: 2px solid $button-border-colour-icon;\n  padding: $button-icon-padding;\n\n  &:focus {\n    padding: $button-icon-focus-padding;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon;\n    border: 2px solid $button-hover-border-colour-icon;\n    padding: $button-icon-hover-padding;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon;\n    color: $button-active-text-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n    background-color: yellow;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-disabled-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: auto;\n    font-size: unset;\n    color: unset;\n    padding-left: unset;\n  }\n}\nbutton.icon-secondary {\n  @include button-defaults;\n  min-height: 44px;\n  min-width: 50px;\n\n  background-color: $button-colour-icon-secondary;\n  color: $button-text-colour-icon-secondary;\n  border: 2px solid $button-border-colour-icon-secondary;\n  padding: 9px;\n\n  &:focus {\n    padding: 11px 11px 8px;\n  }\n\n  &:hover {\n    background-color: $button-hover-colour-icon-secondary;\n    border: 2px solid $button-hover-border-colour-icon-secondary;\n    padding: 9px;\n  }\n\n  admiralty-icon {\n    &.icon-padding {\n      padding-left: 8px;\n    }\n  }\n\n  &:enabled:active {\n    background-color: $button-active-colour-icon-secondary;\n    color: $button-active-text-colour-icon-secondary;\n    border: 2px solid $button-active-border-colour-icon-secondary;\n    border: 2px solid transparent;\n\n    admiralty-icon {\n      color: $button-active-text-colour-icon-secondary !important;\n    }\n  }\n\n  &:disabled {\n    background-color: $button-disabled-colour-icon;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  &.borderless {\n    border: none;\n  }\n\n  &:active:disabled {\n    background-color: $button-colour-deselected;\n    border: 2px solid $button-active-border-colour-icon;\n    opacity: 0.3;\n  }\n\n  i {\n    margin: $button-icon-idiomatic-margin;\n    font-size: unset;\n    color: unset;\n    padding-left: $button-icon-idiomatic-padding;\n  }\n}\n","import { Component, Prop, h, Element } from '@stencil/core';\nimport { ButtonVariant } from './button.types';\n\n@Component({\n  tag: 'admiralty-button',\n  styleUrl: 'button.scss',\n  scoped: true,\n})\nexport class ButtonComponent {\n  @Element() el: HTMLElement;\n  /**\n   * The type of button to render. Valid values are `primary`, `secondary`, `warning`, `text` and `icon`.\n   * Default value is `primary`.\n   */\n  @Prop() variant: ButtonVariant = 'primary';\n  /**\n   * When passed Material Icon name, then an icon will be rendered.\n   */\n  @Prop() icon: string;\n  /**\n   * Determines whether the button is disabled. A button in disabled state will not fire click output events.\n   */\n  @Prop({ reflect: true }) disabled = false;\n  /**\n   * The default behavior of the button. Valid values are `button`, `submit` and `reset`.\n   * Default value is `submit`.\n   */\n\n  @Prop() borderless = false;\n  /**\n   * Default value is false\n   */\n  @Prop() type: 'button' | 'submit' | 'reset' = 'submit';\n  /**\n   * The `<form>` element to associate the button with (its form owner).\n   */\n  @Prop() form: string;\n  /**\n   * The name of the button, submitted as a pair with the button's value as part of the form data,\n   * when that button is used to submit the form.\n   */\n  @Prop() name: string;\n  /**\n   * Defines the value associated with the button's name when it's submitted with the form data.\n   * This value is passed to the server in params when the form is submitted using this button.\n   */\n  @Prop() value: string;\n\n  render() {\n    const hasTextContent = this.el.textContent.trim().length > 0;\n\n    const { form, name, value } = this;\n    const props = {\n      ...(form && { form }),\n      ...(name && { name }),\n      ...(value && { value }),\n    };\n\n    return (\n      <button type={this.type} disabled={this.disabled} class={{ [this.variant]: true, borderless: this.borderless }} {...props}>\n        <slot></slot>\n        {this.icon ? <admiralty-icon name={this.icon} class={`${hasTextContent ? 'icon-padding' : ''}`}></admiralty-icon> : undefined}\n      </button>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/admiralty-card.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2aa80b51.js');
 
-const cardCss = ".visually-hidden.sc-admiralty-card:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-card{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-card{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-card{display:none}}.visually-hidden.sc-admiralty-card:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-card{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-card{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-card{display:none}}.card.sc-admiralty-card{display:flex;flex-direction:column;border:1px solid var(--admiralty-card-border-colour, var(--admiralty-colour-light));background-color:var(--admiralty-card-background-colour, var(--admiralty-background-colour))}.card.sc-admiralty-card>h6.sc-admiralty-card{font-size:var(--admiralty-card-heading-font-size, var(--admiralty-font-size-0));height:60px;line-height:60px;border:1px solid var(--admiralty-card-heading-border-colour, var(--admiralty-colour-primary));color:var(--admiralty-card-heading-text-colour, var(--admiralty-colour-primary-contrast));background-color:var(--admiralty-card-heading-colour, var(--admiralty-colour-primary));margin:var(--admiralty-card-heading-margin, var(--admiralty-spacing-0));padding:var(--admiralty-card-heading-padding, var(--admiralty-spacing-0) var(--admiralty-spacing-7))}@media (max-width: 1023px){.card.sc-admiralty-card>h6.sc-admiralty-card{padding:var(--admiralty-card-heading-not-desktop-padding, var(--admiralty-spacing-0) var(--admiralty-spacing-4));height:48px;line-height:48px}}.card.sc-admiralty-card>div.sc-admiralty-card{border-top:none;flex-grow:1;padding:var(--admiralty-card-padding, 30px)}@media (max-width: 1023px){.card.sc-admiralty-card>div.sc-admiralty-card{padding:var(--admiralty-card-not-desktop-padding, var(--admiralty-spacing-6) 18px)}}";
+const cardCss = ".visually-hidden.sc-admiralty-card:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-card{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-card{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-card{display:none}}.visually-hidden.sc-admiralty-card:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-card{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-card{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-card{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-card{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-card{display:none}}.card.sc-admiralty-card{display:flex;flex-direction:column;border:1px solid var(--admiralty-card-border-colour, var(--admiralty-colour-light));background-color:var(--admiralty-card-background-colour)}.card.sc-admiralty-card>h6.sc-admiralty-card{font-size:var(--admiralty-card-heading-font-size, var(--admiralty-font-size-0));height:60px;line-height:60px;border:1px solid var(--admiralty-card-heading-border-colour);color:var(--admiralty-card-heading-text-colour, var(--admiralty-colour-primary-contrast));background-color:var(--admiralty-card-heading-colour);margin:var(--admiralty-card-heading-margin, var(--admiralty-spacing-0));padding:var(--admiralty-card-heading-padding, var(--admiralty-spacing-0) var(--admiralty-spacing-7))}@media (max-width: 1023px){.card.sc-admiralty-card>h6.sc-admiralty-card{padding:var(--admiralty-card-heading-not-desktop-padding, var(--admiralty-spacing-0) var(--admiralty-spacing-4));height:48px;line-height:48px}}.card.sc-admiralty-card>div.sc-admiralty-card{border-top:none;flex-grow:1;padding:var(--admiralty-card-padding, 30px)}@media (max-width: 1023px){.card.sc-admiralty-card>div.sc-admiralty-card{padding:var(--admiralty-card-not-desktop-padding, var(--admiralty-spacing-6) 18px)}}";
 const AdmiraltyCardStyle0 = cardCss;
 
 const CardComponent = class {

package/dist/cjs/admiralty-card.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,OAAO,GAAG,8vGAA8vG,CAAC;AAC/wG,4BAAe,OAAO;;MCMT,aAAa;;;;;IAMxB,MAAM;QACJ,QACEA,sEAAS,KAAK,EAAC,MAAM,IAClB,IAAI,CAAC,OAAO,GAAGA,oBAAK,IAAI,CAAC,OAAO,CAAM,GAAG,IAAI,EAC9CA,oEACEA,oEAAa,CACT,CACE,EACV;KACH;;;;;;","names":["h"],"sources":["src/components/card/card.scss?tag=admiralty-card&encapsulation=scoped","src/components/card/card.tsx"],"sourcesContent":["@import 'card.vars';\n@import '../../styles/vars/globals';\n\n.card {\n  display: flex;\n  flex-direction: column;\n  border: 1px solid $card-border-colour;\n  background-color: $card-background-colour;\n\n  & > h6 {\n    font-size: $card-heading-font-size;\n    height: 60px;\n    line-height: 60px;\n    border: 1px solid $card-heading-border-colour;\n    color: $card-heading-text-colour;\n    background-color: $card-heading-colour;\n    margin: $card-heading-margin;\n    padding: $card-heading-padding;\n\n    @include not-desktop {\n      padding: $card-heading-not-desktop-padding;\n      height: 48px;\n      line-height: 48px;\n    }\n  }\n\n  & > div {\n    border-top: none;\n    flex-grow: 1;\n    padding: $card-padding;\n    @include not-desktop {\n      padding: $card-padding-not-desktop;\n    }\n  }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-card',\n  styleUrl: 'card.scss',\n  scoped: true,\n})\nexport class CardComponent {\n  /**\n   * The title of the card.\n   */\n  @Prop() heading: string;\n\n  render() {\n    return (\n      <section class=\"card\">\n        {this.heading ? <h6>{this.heading}</h6> : null}\n        <div>\n          <slot></slot>\n        </div>\n      </section>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-card.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,OAAO,GAAG,wpGAAwpG,CAAC;AACzqG,4BAAe,OAAO;;MCMT,aAAa;;;;;IAMxB,MAAM;QACJ,QACEA,sEAAS,KAAK,EAAC,MAAM,IAClB,IAAI,CAAC,OAAO,GAAGA,oBAAK,IAAI,CAAC,OAAO,CAAM,GAAG,IAAI,EAC9CA,oEACEA,oEAAa,CACT,CACE,EACV;KACH;;;;;;","names":["h"],"sources":["src/components/card/card.scss?tag=admiralty-card&encapsulation=scoped","src/components/card/card.tsx"],"sourcesContent":["@import 'card.vars';\n@import '../../styles/vars/globals';\n\n.card {\n  display: flex;\n  flex-direction: column;\n  border: 1px solid $card-border-colour;\n  background-color: $card-background-colour;\n\n  & > h6 {\n    font-size: $card-heading-font-size;\n    height: 60px;\n    line-height: 60px;\n    border: 1px solid $card-heading-border-colour;\n    color: $card-heading-text-colour;\n    background-color: $card-heading-colour;\n    margin: $card-heading-margin;\n    padding: $card-heading-padding;\n\n    @include not-desktop {\n      padding: $card-heading-not-desktop-padding;\n      height: 48px;\n      line-height: 48px;\n    }\n  }\n\n  & > div {\n    border-top: none;\n    flex-grow: 1;\n    padding: $card-padding;\n    @include not-desktop {\n      padding: $card-padding-not-desktop;\n    }\n  }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-card',\n  styleUrl: 'card.scss',\n  scoped: true,\n})\nexport class CardComponent {\n  /**\n   * The title of the card.\n   */\n  @Prop() heading: string;\n\n  render() {\n    return (\n      <section class=\"card\">\n        {this.heading ? <h6>{this.heading}</h6> : null}\n        <div>\n          <slot></slot>\n        </div>\n      </section>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/admiralty-colour-block.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2aa80b51.js');
 
-const colourBlockCss = ".visually-hidden.sc-admiralty-colour-block:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-colour-block{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-colour-block{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-colour-block{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-colour-block{display:none}}.colourBlock.sc-admiralty-colour-block{height:100%;width:100%;max-width:100%;padding:var(--admiralty-colour-block-padding, 30px 18px);display:flex;flex-direction:column;box-sizing:border-box}.colourBlock.sc-admiralty-colour-block .content.sc-admiralty-colour-block{flex-grow:1}.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block{align-self:flex-end;cursor:pointer}.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block:focus *.sc-admiralty-colour-block{color:var(--admiralty-text-colour) !important}.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block span.sc-admiralty-colour-block{font-weight:var(--admiralty-colour-block-action-font-weight, var(--admiralty-font-weight-medium));font-size:var(--admiralty-colour-block-action-font-size, var(--admiralty-font-size-1));line-height:30px}@media (max-width: 1023px){.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block span.sc-admiralty-colour-block{font-size:var(--admiralty-colour-block-action-not-desktop-font-size, var(--admiralty-font-size-0));line-height:30px}}.colourBlock.admiralty-blue.sc-admiralty-colour-block{background-color:var(--admiralty-colour-primary)}.colourBlock.admiralty-blue.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--admiralty-colour-primary-contrast)}.colourBlock.teal.sc-admiralty-colour-block{background-color:var(--admiralty-colour-secondary)}.colourBlock.teal.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--admiralty-colour-secondary-contrast)}.colourBlock.bright-blue.sc-admiralty-colour-block{background-color:var(--admiralty-colour-tertiary);color:var(--admiralty-colour-primary)}.colourBlock.bright-blue.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--admiralty-colour-primary)}";
+const colourBlockCss = ".visually-hidden.sc-admiralty-colour-block:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-colour-block{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-colour-block{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-colour-block{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-colour-block{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-colour-block{display:none}}.colourBlock.sc-admiralty-colour-block{height:100%;width:100%;max-width:100%;padding:var(--admiralty-colour-block-padding, 30px 18px);display:flex;flex-direction:column;box-sizing:border-box}.colourBlock.sc-admiralty-colour-block .content.sc-admiralty-colour-block{flex-grow:1}.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block{align-self:flex-end;cursor:pointer}.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block:focus *.sc-admiralty-colour-block{color:var(--admiralty-focus-contrast) !important}.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block span.sc-admiralty-colour-block{font-weight:var(--admiralty-colour-block-action-font-weight, var(--admiralty-font-weight-medium));font-size:var(--admiralty-colour-block-action-font-size, var(--admiralty-font-size-1));line-height:30px}@media (max-width: 1023px){.colourBlock.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block span.sc-admiralty-colour-block{font-size:var(--admiralty-colour-block-action-not-desktop-font-size, var(--admiralty-font-size-0));line-height:30px}}.colourBlock.admiralty-blue.sc-admiralty-colour-block{background-color:var(--colour-block-blue-background-colour)}.colourBlock.admiralty-blue.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--colour-block-blue-text-colour)}.colourBlock.teal.sc-admiralty-colour-block{background-color:var(--admiralty-colour-secondary)}.colourBlock.teal.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--admiralty-colour-secondary-contrast)}.colourBlock.bright-blue.sc-admiralty-colour-block{background-color:var(--admiralty-colour-tertiary)}.colourBlock.bright-blue.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--colour-block-bright-blue-text-colour)}.colourBlock.bright-blue.sc-admiralty-colour-block .clickAction.sc-admiralty-colour-block *.sc-admiralty-colour-block{color:var(--colour-block-bright-blue-text-colour)}";
 const AdmiraltyColourBlockStyle0 = colourBlockCss;
 
 const ColourBlockComponent = class {

package/dist/cjs/admiralty-colour-block.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-colour-block.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,i3FAAi3F,CAAC;AACz4F,mCAAe,cAAc;;MCMhB,oBAAoB;;;;;;;sBAgB6B,gBAAgB;;;gCAcxC,KAAK;+BAKN,KAAK;;;IAMxC,iBAAiB,CAAC,EAAc;QAC9B,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACzB,EAAE,CAAC,cAAc,EAAE,CAAC;SACrB;QACD,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,sBAAsB,CAAC,IAAI,EAAE,CAAC;KACpC;IAQD,MAAM;QACJ,QACEA,kEACE,KAAK,EAAE;gBACL,WAAW,EAAE,IAAI;gBACjB,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI;aACpB,EACD,KAAK,kBACH,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,IAAI,GAAG,IAAI,EAC/C,KAAK,EAAE,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,IAAI,GAAG,IAAI,KACxC,IAAI,CAAC,eAAe,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,IAEnD,OAAO,EAAE,EAAE,KAAK,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAEzEA,mEAAK,IAAI,CAAC,OAAO,CAAM,EACvBA,kEACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,gBAAgB,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM;aACzE,IAEDA,oEAAa,CACT,EACL,IAAI,CAAC,UAAU,IACdA,8BAAkB,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,EAAE,IAAI,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAC5FA,sBAAO,IAAI,CAAC,UAAU,CAAQ,CACb,IACjB,IAAI,EACP,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,IACzBA,eAAG,KAAK,EAAC,aAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,IAAI,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAC/EA,sBAAO,IAAI,CAAC,QAAQ,CAAQ,CAC1B,IACF,IAAI,CACJ,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/colour-block/colour-block.scss?tag=admiralty-colour-block&encapsulation=scoped","src/components/colour-block/colour-block.tsx"],"sourcesContent":["@import 'colour-block.vars';\n\n.colourBlock {\n  height: 100%;\n  width: 100%;\n  max-width: 100%;\n  padding: $colour-block-padding;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n\n  .content {\n    flex-grow: 1;\n  }\n\n  .clickAction {\n    align-self: flex-end;\n    cursor: pointer;\n\n    &:focus * {\n      color: $colour-block-focus-text-colour !important;\n    }\n\n    span {\n      font-weight: $colour-block-action-font-weight;\n      font-size: $colour-block-action-text-size;\n      line-height: $colour-block-action-line-height;\n\n      @include not-desktop {\n        font-size: $colour-block-action-not-desktop-text-size;\n        line-height: 30px;\n      }\n    }\n  }\n\n  &.admiralty-blue {\n    background-color: $primary-colour-block-colour;\n    * {\n      color: $primary-colour-block-text-colour;\n    }\n  }\n\n  &.teal {\n    background-color: $secondary-colour-block-colour;\n    * {\n      color: $secondary-colour-block-text-colour;\n    }\n  }\n\n  &.bright-blue {\n    background-color: $tertiary-colour-block-colour;\n    color: $tertiary-colour-block-text-colour;\n    .clickAction * {\n      color: $tertiary-colour-block-text-colour;\n    }\n  }\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-colour-block',\n  styleUrl: 'colour-block.scss',\n  scoped: true,\n})\nexport class ColourBlockComponent {\n  /**\n   * The width in pixels of the component.\n   */\n  @Prop() width: number;\n  /**\n   * The height in pixels of the component.\n   */\n  @Prop() height: number;\n  /**\n   * The heading text to display.\n   */\n  @Prop() heading: string;\n  /**\n   * The background colour of the component.\n   */\n  @Prop() colour: 'admiralty-blue' | 'teal' | 'bright-blue' = 'admiralty-blue';\n  /**\n   * The URL to link to.\n   */\n  @Prop() href: string;\n  /**\n   * The link text.\n   */\n  @Prop() linkText: string;\n  /**\n   * Causes the default browser redirect to be suppressed. Can be used in conjunction with the\n   * `colourBlockLinkClicked` event to use a navigation router and prevent a full page reload\n   * when navigating.\n   */\n  @Prop() suppressRedirect: boolean = false;\n  /**\n   * Allow the card to be clicked. Will emit a `colourBlockLinkClicked` event. A value for `href`\n   * should also be provided to ensure the component conforms to accessibility standards.\n   */\n  @Prop() enableCardEvent: boolean = false;\n  /**\n   * An event emitted when this Colour Block link is clicked\n   */\n  @Event() colourBlockLinkClicked: EventEmitter<string>;\n\n  handleClickAction(ev: MouseEvent) {\n    if (this.suppressRedirect) {\n      ev.preventDefault();\n    }\n    ev.stopPropagation();\n    this.colourBlockLinkClicked.emit();\n  }\n\n  /**\n   * The text to display on the action button\n   * @deprecated in favour of `href` and `linkText`\n   */\n  @Prop() actionText: string;\n\n  render() {\n    return (\n      <div\n        class={{\n          colourBlock: true,\n          [this.colour]: true,\n        }}\n        style={{\n          height: this.height ? `${this.height}px` : null,\n          width: this.width ? `${this.width}px` : null,\n          ...(this.enableCardEvent && { cursor: 'pointer' }),\n        }}\n        onClick={ev => (this.enableCardEvent ? this.handleClickAction(ev) : null)}\n      >\n        <h2>{this.heading}</h2>\n        <div\n          class={{\n            'content': true,\n            'white-text': this.colour === 'admiralty-blue' || this.colour === 'teal',\n          }}\n        >\n          <slot></slot>\n        </div>\n        {this.actionText ? (\n          <admiralty-button variant=\"text\" class=\"clickAction\" onClick={ev => this.handleClickAction(ev)}>\n            <span>{this.actionText}</span>\n          </admiralty-button>\n        ) : null}\n        {this.linkText && this.href ? (\n          <a class=\"clickAction\" href={this.href} onClick={ev => this.handleClickAction(ev)}>\n            <span>{this.linkText}</span>\n          </a>\n        ) : null}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-colour-block.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,cAAc,GAAG,k+FAAk+F,CAAC;AAC1/F,mCAAe,cAAc;;MCMhB,oBAAoB;;;;;;;sBAgB6B,gBAAgB;;;gCAcxC,KAAK;+BAKN,KAAK;;;IAMxC,iBAAiB,CAAC,EAAc;QAC9B,IAAI,IAAI,CAAC,gBAAgB,EAAE;YACzB,EAAE,CAAC,cAAc,EAAE,CAAC;SACrB;QACD,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,sBAAsB,CAAC,IAAI,EAAE,CAAC;KACpC;IAQD,MAAM;QACJ,QACEA,kEACE,KAAK,EAAE;gBACL,WAAW,EAAE,IAAI;gBACjB,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI;aACpB,EACD,KAAK,kBACH,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,IAAI,GAAG,IAAI,EAC/C,KAAK,EAAE,IAAI,CAAC,KAAK,GAAG,GAAG,IAAI,CAAC,KAAK,IAAI,GAAG,IAAI,KACxC,IAAI,CAAC,eAAe,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,IAEnD,OAAO,EAAE,EAAE,KAAK,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,IAEzEA,mEAAK,IAAI,CAAC,OAAO,CAAM,EACvBA,kEACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,YAAY,EAAE,IAAI,CAAC,MAAM,KAAK,gBAAgB,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM;aACzE,IAEDA,oEAAa,CACT,EACL,IAAI,CAAC,UAAU,IACdA,8BAAkB,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,aAAa,EAAC,OAAO,EAAE,EAAE,IAAI,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAC5FA,sBAAO,IAAI,CAAC,UAAU,CAAQ,CACb,IACjB,IAAI,EACP,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,IACzBA,eAAG,KAAK,EAAC,aAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,EAAE,IAAI,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,IAC/EA,sBAAO,IAAI,CAAC,QAAQ,CAAQ,CAC1B,IACF,IAAI,CACJ,EACN;KACH;;;;;;","names":["h"],"sources":["src/components/colour-block/colour-block.scss?tag=admiralty-colour-block&encapsulation=scoped","src/components/colour-block/colour-block.tsx"],"sourcesContent":["@import 'colour-block.vars';\n\n.colourBlock {\n  height: 100%;\n  width: 100%;\n  max-width: 100%;\n  padding: $colour-block-padding;\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n\n  .content {\n    flex-grow: 1;\n  }\n\n  .clickAction {\n    align-self: flex-end;\n    cursor: pointer;\n\n    &:focus * {\n      color: $colour-block-focus-text-colour !important;\n    }\n\n    span {\n      font-weight: $colour-block-action-font-weight;\n      font-size: $colour-block-action-text-size;\n      line-height: $colour-block-action-line-height;\n\n      @include not-desktop {\n        font-size: $colour-block-action-not-desktop-text-size;\n        line-height: 30px;\n      }\n    }\n  }\n\n  &.admiralty-blue {\n    background-color: $primary-colour-block-colour;\n    * {\n      color: $primary-colour-block-text-colour;\n    }\n  }\n\n  &.teal {\n    background-color: $secondary-colour-block-colour;\n    * {\n      color: $secondary-colour-block-text-colour;\n    }\n  }\n\n  &.bright-blue {\n    background-color: $tertiary-colour-block-colour;\n    * {\n      color: $tertiary-colour-block-text-colour;\n    }\n    .clickAction * {\n      color: $tertiary-colour-block-text-colour;\n    }\n  }\n}\n","import { Component, Event, EventEmitter, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'admiralty-colour-block',\n  styleUrl: 'colour-block.scss',\n  scoped: true,\n})\nexport class ColourBlockComponent {\n  /**\n   * The width in pixels of the component.\n   */\n  @Prop() width: number;\n  /**\n   * The height in pixels of the component.\n   */\n  @Prop() height: number;\n  /**\n   * The heading text to display.\n   */\n  @Prop() heading: string;\n  /**\n   * The background colour of the component.\n   */\n  @Prop() colour: 'admiralty-blue' | 'teal' | 'bright-blue' = 'admiralty-blue';\n  /**\n   * The URL to link to.\n   */\n  @Prop() href: string;\n  /**\n   * The link text.\n   */\n  @Prop() linkText: string;\n  /**\n   * Causes the default browser redirect to be suppressed. Can be used in conjunction with the\n   * `colourBlockLinkClicked` event to use a navigation router and prevent a full page reload\n   * when navigating.\n   */\n  @Prop() suppressRedirect: boolean = false;\n  /**\n   * Allow the card to be clicked. Will emit a `colourBlockLinkClicked` event. A value for `href`\n   * should also be provided to ensure the component conforms to accessibility standards.\n   */\n  @Prop() enableCardEvent: boolean = false;\n  /**\n   * An event emitted when this Colour Block link is clicked\n   */\n  @Event() colourBlockLinkClicked: EventEmitter<string>;\n\n  handleClickAction(ev: MouseEvent) {\n    if (this.suppressRedirect) {\n      ev.preventDefault();\n    }\n    ev.stopPropagation();\n    this.colourBlockLinkClicked.emit();\n  }\n\n  /**\n   * The text to display on the action button\n   * @deprecated in favour of `href` and `linkText`\n   */\n  @Prop() actionText: string;\n\n  render() {\n    return (\n      <div\n        class={{\n          colourBlock: true,\n          [this.colour]: true,\n        }}\n        style={{\n          height: this.height ? `${this.height}px` : null,\n          width: this.width ? `${this.width}px` : null,\n          ...(this.enableCardEvent && { cursor: 'pointer' }),\n        }}\n        onClick={ev => (this.enableCardEvent ? this.handleClickAction(ev) : null)}\n      >\n        <h2>{this.heading}</h2>\n        <div\n          class={{\n            'content': true,\n            'white-text': this.colour === 'admiralty-blue' || this.colour === 'teal',\n          }}\n        >\n          <slot></slot>\n        </div>\n        {this.actionText ? (\n          <admiralty-button variant=\"text\" class=\"clickAction\" onClick={ev => this.handleClickAction(ev)}>\n            <span>{this.actionText}</span>\n          </admiralty-button>\n        ) : null}\n        {this.linkText && this.href ? (\n          <a class=\"clickAction\" href={this.href} onClick={ev => this.handleClickAction(ev)}>\n            <span>{this.linkText}</span>\n          </a>\n        ) : null}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/admiralty-expansion.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2aa80b51.js');
 
-const expansionCss = ".visually-hidden.sc-admiralty-expansion:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-expansion{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-expansion{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-expansion{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-expansion{display:none}}section.expansion.sc-admiralty-expansion{padding:var(--admiralty-expansion-padding, 2px 0);border-bottom:1px solid transparent}section.expansion.bordered.sc-admiralty-expansion{border-bottom:1px solid var(--admiralty-colour-light)}section.expansion.sc-admiralty-expansion .expansion-content.sc-admiralty-expansion{display:none;max-height:0;overflow:visible}section.expansion.expanded.sc-admiralty-expansion .expansion-content.sc-admiralty-expansion{display:block;max-height:initial;padding-bottom:var(--admiralty-expansion-content-padding-bottom, var(--admiralty-spacing-3))}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion{background-color:transparent;border:none;height:initial;min-width:unset;max-width:unset;white-space:unset;cursor:pointer;margin:var(--admiralty-expansion-button-margin, 10px var(--admiralty-spacing-0) 22px);padding:var(--admiralty-expansion-button-padding, var(--admiralty-spacing-0));display:flex;align-items:center;width:100%;text-align:left;position:relative}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion .expansion-heading-icon.sc-admiralty-expansion{color:var(--admiralty-colour-primary);font-size:var(--admiralty-font-size-5);margin-left:var(--admiralty-expansion-button-icon-margin-left, 30px)}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion:focus{outline:none}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion h3.sc-admiralty-expansion{flex-grow:1;margin-bottom:var(--admiralty-expansion-button-heading-margin-bottom, var(--admiralty-spacing-0));font-size:var(--admiralty-expansion-title-font-size, var(--admiralty-font-size-1));font-weight:var(--admiralty-expansion-title-font-weight, var(--admiralty-font-weight-medium))}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion h3.expansion-heading-right-align.sc-admiralty-expansion{text-align:right}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion:focus{outline:3px solid transparent;color:var(--admiralty-text-colour);background-color:var(--admiralty-focus-colour);box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-text-colour);text-decoration:none}";
+const expansionCss = ".visually-hidden.sc-admiralty-expansion:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-expansion{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-expansion{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-expansion{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-expansion{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-expansion{display:none}}section.expansion.sc-admiralty-expansion{padding:var(--admiralty-expansion-padding, 2px 0);border-bottom:1px solid transparent}section.expansion.bordered.sc-admiralty-expansion{border-bottom:1px solid var(--admiralty-colour-light)}section.expansion.sc-admiralty-expansion .expansion-content.sc-admiralty-expansion{display:none;max-height:0;overflow:visible}section.expansion.expanded.sc-admiralty-expansion .expansion-content.sc-admiralty-expansion{display:block;max-height:initial;padding-bottom:var(--admiralty-expansion-content-padding-bottom, var(--admiralty-spacing-3))}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion{background-color:transparent;border:none;height:initial;min-width:unset;max-width:unset;white-space:unset;cursor:pointer;margin:var(--admiralty-expansion-button-margin, 10px var(--admiralty-spacing-0) 22px);padding:var(--admiralty-expansion-button-padding, var(--admiralty-spacing-0));display:flex;align-items:center;width:100%;text-align:left;position:relative}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion .expansion-heading-icon.sc-admiralty-expansion{color:var(--admiralty-colour-primary);font-size:var(--admiralty-font-size-5);margin-left:var(--admiralty-expansion-button-icon-margin-left, 30px)}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion:focus{outline:none}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion h3.sc-admiralty-expansion{flex-grow:1;margin-bottom:var(--admiralty-expansion-button-heading-margin-bottom, var(--admiralty-spacing-0));font-size:var(--admiralty-expansion-title-font-size, var(--admiralty-font-size-1));font-weight:var(--admiralty-expansion-title-font-weight, var(--admiralty-font-weight-medium))}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion h3.expansion-heading-right-align.sc-admiralty-expansion{text-align:right}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion:focus{outline:3px solid transparent;color:var(--admiralty-focus-contrast);background-color:var(--admiralty-focus-colour);box-shadow:0 -2px var(--admiralty-focus-colour), 0 4px var(--admiralty-focus-contrast);text-decoration:none}section.expansion.sc-admiralty-expansion button.sc-admiralty-expansion:focus h3.sc-admiralty-expansion{color:black}";
 const AdmiraltyExpansionStyle0 = expansionCss;
 
 let nextId = 0;

package/dist/cjs/admiralty-expansion.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-expansion.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,+pGAA+pG,CAAC;AACrrG,iCAAe,YAAY;;ACC3B,IAAI,MAAM,GAAG,CAAC,CAAC;MAOF,kBAAkB;;;;QA0B7B,eAAU,GAAW,uBAAuB,EAAE,MAAM,EAAE,CAAC;QAEvD,aAAQ,GAAW,GAAG,IAAI,CAAC,UAAU,SAAS,CAAC;QAC/C,cAAS,GAAW,GAAG,IAAI,CAAC,UAAU,UAAU,CAAC;;wBApBE,KAAK;iCAK5B,KAAK;0BAKZ,KAAK;;IAY1B,QAAQ;QACN,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KAClC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC,QAAQ,GAAG,2BAA2B,GAAG,6BAA6B,CAAC;KACpF;IAED,MAAM;QACJ,QACEA,sEACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,CAAC,IAAI,CAAC,UAAU;aAC3B,IAEDA,qEAAQ,EAAE,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,QAAQ,mBAAgB,IAAI,CAAC,QAAQ,mBAAiB,IAAI,CAAC,SAAS,EAAE,KAAK,EAAC,0BAA0B,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IACtKA,iEAAI,KAAK,EAAE,EAAE,+BAA+B,EAAE,IAAI,CAAC,iBAAiB,EAAE,IAAG,IAAI,CAAC,OAAO,CAAM,EAC3FA,mEAAM,KAAK,EAAC,iBAAiB,UAAI,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,MAAM,kBAAqB,EACrFA,6EAAgB,KAAK,EAAC,wBAAwB,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAmB,CACxF,EACTA,kEAAK,KAAK,EAAC,mBAAmB,EAAC,EAAE,EAAE,IAAI,CAAC,SAAS,qBAAmB,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ,IACvGA,oEAAa,CACT,CACE,EACV;KACH;;;;;;","names":["h"],"sources":["src/components/expansion/expansion.scss?tag=admiralty-expansion&encapsulation=scoped","src/components/expansion/expansion.tsx"],"sourcesContent":["@import 'expansion.vars';\n\nsection.expansion {\n  padding: $expansion-padding;\n  border-bottom: 1px solid transparent;\n  &.bordered {\n    border-bottom: 1px solid $expansion-border-colour;\n  }\n\n  .expansion-content {\n    display: none;\n    max-height: 0;\n    overflow: visible;\n  }\n  &.expanded .expansion-content {\n    display: block;\n    max-height: initial;\n    padding-bottom: $expansion-content-padding-bottom;\n  }\n\n  button {\n    background-color: transparent;\n    border: none;\n    height: initial;\n    min-width: unset;\n    max-width: unset;\n    white-space: unset;\n    cursor: pointer;\n    margin: $expansion-button-margin;\n    padding: $expansion-button-padding;\n    display: flex;\n    align-items: center;\n    width: 100%;\n    text-align: left;\n    position: relative;\n\n    .expansion-heading-icon {\n      color: $expansion-header-icon-colour;\n      font-size: $expansion-header-icon-size;\n      margin-left: $expansion-button-icon-margin-left;\n    }\n    &:focus {\n      outline: none;\n    }\n    h3 {\n      flex-grow: 1;\n      margin-bottom: $expansion-button-heading-margin-bottom;\n      font-size: $expansion-title-text-size;\n      font-weight: $expansion-title-text-weight;\n\n      &.expansion-heading-right-align {\n        text-align: right;\n      }\n    }\n\n    &:focus {\n      @include focus-highlight;\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\n\nlet nextId = 0;\n\n@Component({\n  tag: 'admiralty-expansion',\n  styleUrl: 'expansion.scss',\n  scoped: true,\n})\nexport class ExpansionComponent {\n  /**\n   * The text to display in the heading of the expansion component.\n   */\n  @Prop() heading: string;\n\n  /**\n   * Whether the component is expanded.\n   */\n  @Prop({ mutable: true, reflect: true }) expanded = false;\n\n  /**\n   * CWhether the heading should be right aligned.\n   */\n  @Prop() alignHeadingRight = false;\n\n  /**\n   * Whether the border on the bottom of the component should be hidden.\n   */\n  @Prop() hideBorder = false;\n\n  /**\n   * The event that is dispatched when the expanded status is toggled.\n   */\n  @Event() toggled: EventEmitter<boolean>;\n\n  internalId: string = `admiralty-expansion-${++nextId}`;\n\n  headerId: string = `${this.internalId}-header`;\n  contentId: string = `${this.internalId}-content`;\n\n  onToggle() {\n    this.expanded = !this.expanded;\n    this.toggled.emit(this.expanded);\n  }\n\n  getExpansionIcon(): string {\n    return this.expanded ? 'keyboard-arrow-up-rounded' : 'keyboard-arrow-down-rounded';\n  }\n\n  render() {\n    return (\n      <section\n        class={{\n          expansion: true,\n          expanded: this.expanded,\n          bordered: !this.hideBorder,\n        }}\n      >\n        <button id={this.headerId} type=\"button\" aria-expanded={this.expanded} aria-controls={this.contentId} class=\"expansion-heading-button\" onClick={this.onToggle.bind(this)}>\n          <h3 class={{ 'expansion-heading-right-align': this.alignHeadingRight }}>{this.heading}</h3>\n          <span class=\"visually-hidden\">, {this.expanded ? 'Hide' : 'Show'} this section</span>\n          <admiralty-icon class=\"expansion-heading-icon\" name={this.getExpansionIcon()}></admiralty-icon>\n        </button>\n        <div class=\"expansion-content\" id={this.contentId} aria-labelledby={this.headerId} hidden={!this.expanded}>\n          <slot></slot>\n        </div>\n      </section>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-expansion.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,wxGAAwxG,CAAC;AAC9yG,iCAAe,YAAY;;ACC3B,IAAI,MAAM,GAAG,CAAC,CAAC;MAOF,kBAAkB;;;;QA0B7B,eAAU,GAAW,uBAAuB,EAAE,MAAM,EAAE,CAAC;QAEvD,aAAQ,GAAW,GAAG,IAAI,CAAC,UAAU,SAAS,CAAC;QAC/C,cAAS,GAAW,GAAG,IAAI,CAAC,UAAU,UAAU,CAAC;;wBApBE,KAAK;iCAK5B,KAAK;0BAKZ,KAAK;;IAY1B,QAAQ;QACN,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QAC/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;KAClC;IAED,gBAAgB;QACd,OAAO,IAAI,CAAC,QAAQ,GAAG,2BAA2B,GAAG,6BAA6B,CAAC;KACpF;IAED,MAAM;QACJ,QACEA,sEACE,KAAK,EAAE;gBACL,SAAS,EAAE,IAAI;gBACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,QAAQ,EAAE,CAAC,IAAI,CAAC,UAAU;aAC3B,IAEDA,qEAAQ,EAAE,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAC,QAAQ,mBAAgB,IAAI,CAAC,QAAQ,mBAAiB,IAAI,CAAC,SAAS,EAAE,KAAK,EAAC,0BAA0B,EAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IACtKA,iEAAI,KAAK,EAAE,EAAE,+BAA+B,EAAE,IAAI,CAAC,iBAAiB,EAAE,IAAG,IAAI,CAAC,OAAO,CAAM,EAC3FA,mEAAM,KAAK,EAAC,iBAAiB,UAAI,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,MAAM,kBAAqB,EACrFA,6EAAgB,KAAK,EAAC,wBAAwB,EAAC,IAAI,EAAE,IAAI,CAAC,gBAAgB,EAAE,GAAmB,CACxF,EACTA,kEAAK,KAAK,EAAC,mBAAmB,EAAC,EAAE,EAAE,IAAI,CAAC,SAAS,qBAAmB,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,QAAQ,IACvGA,oEAAa,CACT,CACE,EACV;KACH;;;;;;","names":["h"],"sources":["src/components/expansion/expansion.scss?tag=admiralty-expansion&encapsulation=scoped","src/components/expansion/expansion.tsx"],"sourcesContent":["@import 'expansion.vars';\n\nsection.expansion {\n  padding: $expansion-padding;\n  border-bottom: 1px solid transparent;\n  &.bordered {\n    border-bottom: 1px solid $expansion-border-colour;\n  }\n\n  .expansion-content {\n    display: none;\n    max-height: 0;\n    overflow: visible;\n  }\n  &.expanded .expansion-content {\n    display: block;\n    max-height: initial;\n    padding-bottom: $expansion-content-padding-bottom;\n  }\n\n  button {\n    background-color: transparent;\n    border: none;\n    height: initial;\n    min-width: unset;\n    max-width: unset;\n    white-space: unset;\n    cursor: pointer;\n    margin: $expansion-button-margin;\n    padding: $expansion-button-padding;\n    display: flex;\n    align-items: center;\n    width: 100%;\n    text-align: left;\n    position: relative;\n\n    .expansion-heading-icon {\n      color: $expansion-header-icon-colour;\n      font-size: $expansion-header-icon-size;\n      margin-left: $expansion-button-icon-margin-left;\n    }\n    &:focus {\n      outline: none;\n    }\n    h3 {\n      flex-grow: 1;\n      margin-bottom: $expansion-button-heading-margin-bottom;\n      font-size: $expansion-title-text-size;\n      font-weight: $expansion-title-text-weight;\n\n      &.expansion-heading-right-align {\n        text-align: right;\n      }\n    }\n\n    &:focus {\n      @include focus-highlight;\n    }\n\n    &:focus h3 {\n      color: black;\n    }\n  }\n}\n","import { Component, Event, EventEmitter, h, Prop } from '@stencil/core';\n\nlet nextId = 0;\n\n@Component({\n  tag: 'admiralty-expansion',\n  styleUrl: 'expansion.scss',\n  scoped: true,\n})\nexport class ExpansionComponent {\n  /**\n   * The text to display in the heading of the expansion component.\n   */\n  @Prop() heading: string;\n\n  /**\n   * Whether the component is expanded.\n   */\n  @Prop({ mutable: true, reflect: true }) expanded = false;\n\n  /**\n   * CWhether the heading should be right aligned.\n   */\n  @Prop() alignHeadingRight = false;\n\n  /**\n   * Whether the border on the bottom of the component should be hidden.\n   */\n  @Prop() hideBorder = false;\n\n  /**\n   * The event that is dispatched when the expanded status is toggled.\n   */\n  @Event() toggled: EventEmitter<boolean>;\n\n  internalId: string = `admiralty-expansion-${++nextId}`;\n\n  headerId: string = `${this.internalId}-header`;\n  contentId: string = `${this.internalId}-content`;\n\n  onToggle() {\n    this.expanded = !this.expanded;\n    this.toggled.emit(this.expanded);\n  }\n\n  getExpansionIcon(): string {\n    return this.expanded ? 'keyboard-arrow-up-rounded' : 'keyboard-arrow-down-rounded';\n  }\n\n  render() {\n    return (\n      <section\n        class={{\n          expansion: true,\n          expanded: this.expanded,\n          bordered: !this.hideBorder,\n        }}\n      >\n        <button id={this.headerId} type=\"button\" aria-expanded={this.expanded} aria-controls={this.contentId} class=\"expansion-heading-button\" onClick={this.onToggle.bind(this)}>\n          <h3 class={{ 'expansion-heading-right-align': this.alignHeadingRight }}>{this.heading}</h3>\n          <span class=\"visually-hidden\">, {this.expanded ? 'Hide' : 'Show'} this section</span>\n          <admiralty-icon class=\"expansion-heading-icon\" name={this.getExpansionIcon()}></admiralty-icon>\n        </button>\n        <div class=\"expansion-content\" id={this.contentId} aria-labelledby={this.headerId} hidden={!this.expanded}>\n          <slot></slot>\n        </div>\n      </section>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/admiralty-footer.cjs.entry.js

@@ -9,7 +9,7 @@ const FooterType = {
     Compact: 'compact'
 };
 
-const footerCss = ".visually-hidden.sc-admiralty-footer:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-footer{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-footer{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-footer{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-footer{display:none}}footer.sc-admiralty-footer{padding:var(--admiralty-footer-padding, 1.25rem 1rem 1.5rem 1rem);border-top:var(--admiralty-colour-primary) 0.375rem solid;background:var(--admiralty-background-colour-tint);display:flex;flex-direction:column}@media (min-width: 481px){footer.sc-admiralty-footer{flex-direction:row;padding:var(--admiralty-footer-desktop-padding, 1.75rem 1.5rem 1.875rem 1rem);gap:1rem}}footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer{height:var(--admiralty-footer-img-height, 86px);margin-bottom:var(--admiralty-footer-branding-image-margin-bottom, 1rem);box-sizing:border-box}@media (min-width: 481px){footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer{height:var(--admiralty-footer-img-desktop-height, 100px);margin-bottom:var(--admiralty-footer-branding-image-desktop-margin-bottom, var(--admiralty-spacing-0))}}footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer a.sc-admiralty-footer{display:block;height:100%;width:min-content}footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer img.sc-admiralty-footer{height:100%}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer{display:flex;flex-grow:1;flex-direction:column}}footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{display:flex;flex-direction:column;align-self:flex-start;margin-left:var(--admiralty-footer-content-links-margin-left, 0.125rem);gap:0.5rem;flex-grow:1}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{flex-direction:row;align-self:flex-end;margin-left:var(--admiralty-footer-content-links-desktop-margin-left, var(--admiralty-spacing-0));gap:1.5rem}}footer .footer-content .footer-links.sc-admiralty-footer-s>admiralty-link a,footer .footer-content .footer-links .sc-admiralty-footer-s>admiralty-link a{font-weight:var(--admiralty-footer-links-font-weight, var(--admiralty-font-weight-medium))}footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{align-self:flex-start;margin-left:var(--admiralty-footer-content-text-margin-left, 0.125rem);margin-top:var(--admiralty-footer-content-text-margin-top, 1rem)}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{align-self:flex-end;margin-left:var(--admiralty-footer-content-text-desktop-margin-left, var(--admiralty-spacing-0))}}footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer p.sc-admiralty-footer{margin:var(--admiralty-footer-content-text-paragraph-margin, var(--admiralty-spacing-0));font-weight:var(--admiralty-footer-text-weight, var(--admiralty-font-weight-normal));color:var(--admiralty-text-colour)}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer p.sc-admiralty-footer{text-align:right}}footer.footer-compact.sc-admiralty-footer{display:inline-flex;width:auto;justify-content:center;align-items:center;flex-wrap:wrap;padding:var(--admiralty-footer-compact-padding, 0.5rem 0.5rem);gap:0.5rem;opacity:0.7;background-color:var(--admiralty-footer-compact-background-colour, var(--admiralty-background-colour));border-radius:0.625rem 0 0 0;border-bottom:3px solid var(--admiralty-colour-primary);border-top:none}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer{display:flex;flex-direction:row-reverse;flex-wrap:wrap}@media (max-width: 479px) and (min-width: 0px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer{justify-content:center;flex-direction:column-reverse}}@media (max-width: 1023px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer{flex-direction:column-reverse}}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{font-size:var(--admiralty-footer-compact-font-size, var(--admiralty-font-size--3));justify-content:flex-end;line-height:0.95rem;flex-flow:nowrap;column-gap:1.25rem;flex-wrap:wrap}@media (max-width: 479px) and (min-width: 0px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{place-self:flex-end}}@media (max-width: 1023px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{row-gap:0}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.text-padding.sc-admiralty-footer{padding-top:var(--admiralty-footer-compact-links-not-desktop-padding-top, 0.2rem);row-gap:0.2rem}}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.text-padding.sc-admiralty-footer{margin-left:var(--admiralty-footer-compact-links-margin-left, 1.25rem)}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{width:14.3rem;height:1.1875rem;flex-shrink:0;align-self:flex-end;margin-left:var(--admiralty-footer-compact-content-text-margin-left, var(--admiralty-spacing-0));margin-top:var(--admiralty-footer-compact-content-text-margin-top, var(--admiralty-spacing-0))}@media (max-width: 479px) and (min-width: 0px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{margin-right:var(--admiralty-footer-compact-content-text-phone-margin-right, var(--admiralty-spacing-0))}}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer p.sc-admiralty-footer{color:var(--admiralty-footer-compact-text-colour, var(--admiralty-colour-primary));font-size:var(--admiralty-footer-compact-font-size, var(--admiralty-font-size--3));font-style:normal;font-weight:var(--admiralty-footer-compact-font-weight, var(--admiralty-font-weight-normal));line-height:1.5rem}";
+const footerCss = ".visually-hidden.sc-admiralty-footer:not(:focus):not(:active){position:absolute !important;width:1px !important;height:1px !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important}@media (max-width: 1023px){.desktop-only.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-footer{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-footer{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-footer{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-footer{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-footer{display:none}}footer.sc-admiralty-footer{padding:var(--admiralty-footer-padding, 1.25rem 1rem 1.5rem 1rem);border-top:var(--admiralty-colour-primary) 0.375rem solid;background:var(--admiralty-background-colour-tint);display:flex;flex-direction:column}@media (min-width: 481px){footer.sc-admiralty-footer{flex-direction:row;padding:var(--admiralty-footer-desktop-padding, 1.75rem 1.5rem 1.875rem 1rem);gap:1rem}}footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer{height:var(--admiralty-footer-img-height, 86px);margin-bottom:var(--admiralty-footer-branding-image-margin-bottom, 1rem);box-sizing:border-box}@media (min-width: 481px){footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer{height:var(--admiralty-footer-img-desktop-height, 100px);margin-bottom:var(--admiralty-footer-branding-image-desktop-margin-bottom, var(--admiralty-spacing-0))}}footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer a.sc-admiralty-footer{display:block;height:100%;width:min-content}footer.sc-admiralty-footer .footer-branding.sc-admiralty-footer .footer-img.sc-admiralty-footer img.sc-admiralty-footer{height:100%}@media (prefers-color-scheme: dark){footer.sc-admiralty-footer img.sc-admiralty-footer{filter:invert(100%) sepia(100%) saturate(0%) hue-rotate(0deg)}}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer{display:flex;flex-grow:1;flex-direction:column}}footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{display:flex;flex-direction:column;align-self:flex-start;margin-left:var(--admiralty-footer-content-links-margin-left, 0.125rem);gap:0.5rem;flex-grow:1}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{flex-direction:row;align-self:flex-end;margin-left:var(--admiralty-footer-content-links-desktop-margin-left, var(--admiralty-spacing-0));gap:1.5rem}}footer .footer-content .footer-links.sc-admiralty-footer-s>admiralty-link a,footer .footer-content .footer-links .sc-admiralty-footer-s>admiralty-link a{font-weight:var(--admiralty-footer-links-font-weight, var(--admiralty-font-weight-medium))}footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{align-self:flex-start;margin-left:var(--admiralty-footer-content-text-margin-left, 0.125rem);margin-top:var(--admiralty-footer-content-text-margin-top, 1rem)}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{align-self:flex-end;margin-left:var(--admiralty-footer-content-text-desktop-margin-left, var(--admiralty-spacing-0))}}footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer p.sc-admiralty-footer{margin:var(--admiralty-footer-content-text-paragraph-margin, var(--admiralty-spacing-0));font-weight:var(--admiralty-footer-text-weight, var(--admiralty-font-weight-normal));color:var(--admiralty-text-colour)}@media (min-width: 481px){footer.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer p.sc-admiralty-footer{text-align:right}}footer.footer-compact.sc-admiralty-footer{display:inline-flex;width:auto;justify-content:center;align-items:center;flex-wrap:wrap;padding:var(--admiralty-footer-compact-padding, 0.5rem 0.5rem);gap:0.5rem;opacity:0.7;background-color:var(--admiralty-footer-compact-background-colour, var(--admiralty-background-colour));border-radius:0.625rem 0 0 0;border-bottom:3px solid var(--admiralty-colour-primary);border-top:none}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer{display:flex;flex-direction:row-reverse;flex-wrap:wrap}@media (max-width: 479px) and (min-width: 0px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer{justify-content:center;flex-direction:column-reverse}}@media (max-width: 1023px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer{flex-direction:column-reverse}}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{font-size:var(--admiralty-footer-compact-font-size, var(--admiralty-font-size--3));justify-content:flex-end;line-height:0.95rem;flex-flow:nowrap;column-gap:1.25rem;flex-wrap:wrap}@media (max-width: 479px) and (min-width: 0px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{place-self:flex-end}}@media (max-width: 1023px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.sc-admiralty-footer{row-gap:0}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.text-padding.sc-admiralty-footer{padding-top:var(--admiralty-footer-compact-links-not-desktop-padding-top, 0.2rem);row-gap:0.2rem}}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-links.text-padding.sc-admiralty-footer{margin-left:var(--admiralty-footer-compact-links-margin-left, 1.25rem)}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{width:14.3rem;height:1.1875rem;flex-shrink:0;align-self:flex-end;margin-left:var(--admiralty-footer-compact-content-text-margin-left, var(--admiralty-spacing-0));margin-top:var(--admiralty-footer-compact-content-text-margin-top, var(--admiralty-spacing-0))}@media (max-width: 479px) and (min-width: 0px){footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer{margin-right:var(--admiralty-footer-compact-content-text-phone-margin-right, var(--admiralty-spacing-0))}}footer.footer-compact.sc-admiralty-footer .footer-content.sc-admiralty-footer .footer-text.sc-admiralty-footer p.sc-admiralty-footer{color:var(--admiralty-footer-compact-text-colour, var(--admiralty-colour-primary));font-size:var(--admiralty-footer-compact-font-size, var(--admiralty-font-size--3));font-style:normal;font-weight:var(--admiralty-footer-compact-font-weight, var(--admiralty-font-weight-normal));line-height:1.5rem}@media (prefers-color-scheme: dark){footer.footer-compact.sc-admiralty-footer{opacity:1}}";
 const AdmiraltyFooterStyle0 = footerCss;
 
 const FooterComponent = class {