@ukho/admiralty-core 4.0.0-next.0 → 4.0.0-next.2

package/dist/types/components/select/select.d.ts

@@ -37,7 +37,7 @@ export declare class SelectComponent {
      */
     admiraltyBlur: EventEmitter<void>;
     /**
-     * The value of the input.
+     * The value of the option selected as a string or number.
      */
     value?: string | number | null;
     protected valueChanged(): void;

package/dist/types/components.d.ts

@@ -635,7 +635,7 @@ export namespace Components {
          */
         "label": string;
         /**
-          * The value of the input.
+          * The value of the option selected as a string or number.
          */
         "value"?: string | number | null;
         /**
@@ -2206,7 +2206,7 @@ declare namespace LocalJSX {
          */
         "onAdmiraltyChange"?: (event: AdmiraltySelectCustomEvent<SelectChangeEventDetail>) => void;
         /**
-          * The value of the input.
+          * The value of the option selected as a string or number.
          */
         "value"?: string | number | null;
         /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukho/admiralty-core",
-  "version": "4.0.0-next.0",
+  "version": "4.0.0-next.2",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -72,5 +72,5 @@
   "license": "MIT",
   "url": "https://github.com/UKHO/admiralty-design-system",
   "repository": "git://github.com/UKHO/admiralty-design-system.git",
-  "gitHead": "cc3b07d3b7188154a63e297d18265ad1d6a3e0f4"
+  "gitHead": "0b15a661c83476ca47d807f5b812125ef17b6502"
 }

package/dist/admiralty/p-0b326027.entry.js

@@ -1,2 +0,0 @@
-import{r as a,h as i,H as t}from"./p-34931ad3.js";import{g as n}from"./p-7419d0f9.js";const d=".visually-hidden.sc-admiralty-hint: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-hint{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-hint{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-hint{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-hint{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-hint{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-hint{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-hint{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-hint{display:none}}p.sc-admiralty-hint{margin-top:0;margin-bottom:6px;display:block;font-weight:var(--admiralty-hint-font-weight, var(--admiralty-font-weight-normal))}p.disabled.sc-admiralty-hint{color:var(--admiralty-disabled-colour)}";const e=d;const l=class{constructor(i){a(this,i);this.disabled=undefined}render(){return i("p",{key:"fa4e0104076ea8fa402097fa0b168a09130ca2b6",class:{disabled:this.disabled}},i("slot",{key:"ddbfe3d97713f7b678d1d5525b12268f1e475f90"}))}};l.style=e;const o=".visually-hidden.sc-admiralty-input-invalid: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-input-invalid{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-input-invalid{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-input-invalid{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-input-invalid{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-input-invalid{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-input-invalid{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-input-invalid{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-input-invalid{display:none}}.sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:var(--admiralty-colour-danger);margin:4px 0}p.sc-admiralty-input-invalid{margin:0;color:var(--admiralty-colour-danger)}";const p=o;const r=class{constructor(i){a(this,i)}render(){return i(t,{key:"af51d1606b951c52a09c995fc5939323da083793"},i("admiralty-icon",{key:"49f7aad40765557e16f3a7f1692ea42274664303","icon-name":n.iconName,class:"error-icon"}),i("p",{key:"2440c856953d5b4f29cf8a8ffd03cae9effa776e"},i("span",{key:"a6c73389144f9140cffafd7e789f6695f573600b",class:"visually-hidden"},"Error:"),i("slot",{key:"d6fffffe66b5e79aea3d7e9beae60be0a2cb90ac"})))}};r.style=p;const m=".visually-hidden.sc-admiralty-label: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-label{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-label{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-label{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-label{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-label{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-label{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-label{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-label{display:none}}label.sc-admiralty-label{margin-bottom:6px;display:inline-block;font-weight:var(--admiralty-label-font-weight, var(--admiralty-font-weight-medium))}label.disabled.sc-admiralty-label{color:var(--admiralty-disabled-colour)}";const s=m;const c=class{constructor(i){a(this,i);this.disabled=undefined;this.for=undefined}render(){return i("label",{key:"505e239217e7cf51d53aa4ee63babbef8bda8e91",htmlFor:this.for,class:{disabled:this.disabled}},i("slot",{key:"99afa7d53e41e54bae6bd2223a4b83da5d346cb3"}))}};c.style=s;export{l as admiralty_hint,r as admiralty_input_invalid,c as admiralty_label};
-//# sourceMappingURL=p-0b326027.entry.js.map

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

@@ -1,2 +0,0 @@
-import{r as t,c as e,h as a,H as i}from"./p-34931ad3.js";const o='.visually-hidden.sc-admiralty-checkbox: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-checkbox{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-checkbox{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-checkbox{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-checkbox{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-checkbox{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-checkbox{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-checkbox{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-checkbox{display:none}}.form-control.sc-admiralty-checkbox{font-size:var(--admiralty-checkbox-font-size, var(--admiralty-font-size-0));font-weight:var(--admiralty-checkbox-font-weight, var(--admiralty-font-weight-normal));position:relative;display:inline-block}.form-control.sc-admiralty-checkbox input[type=checkbox].sc-admiralty-checkbox{box-sizing:border-box;opacity:0;position:absolute;top:0;left:0;padding:0;width:30px;height:30px;margin:0;z-index:1;cursor:pointer}.form-control.sc-admiralty-checkbox input[type=checkbox].sc-admiralty-checkbox:checked+label.sc-admiralty-checkbox::after{content:""}.form-control.sc-admiralty-checkbox label.sc-admiralty-checkbox{position:relative;display:inline-block;padding-left:42px;margin-bottom:14px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;min-height:30px;line-height:30px}.form-control.sc-admiralty-checkbox label.disabled.sc-admiralty-checkbox{cursor:default;pointer-events:none}.form-control.sc-admiralty-checkbox label.sc-admiralty-checkbox::before,.form-control.sc-admiralty-checkbox label.sc-admiralty-checkbox::after{position:absolute;content:none;display:inline-block}.form-control.sc-admiralty-checkbox label.sc-admiralty-checkbox::before{content:"";height:26px;width:26px;border:2px solid var(--admiralty-colour-primary);left:0;top:0;background-color:var(--admiralty-colour-primary-contrast)}.form-control.sc-admiralty-checkbox label.sc-admiralty-checkbox::after{height:6px;width:13px;border-left:3px solid;border-bottom:3px solid;transform:rotate(-45deg);color:var(--admiralty-colour-primary);left:7px;top:8px}.form-control.sc-admiralty-checkbox input[type=checkbox].sc-admiralty-checkbox:focus+label.sc-admiralty-checkbox:before{outline-offset:unset;outline:3px solid var(--admiralty-focus-colour);box-shadow:var(--admiralty-colour-primary) inset 0 0 0 2px}.form-control.right-align.sc-admiralty-checkbox label.sc-admiralty-checkbox{padding-left:unset;padding-right:35px}.form-control.right-align.sc-admiralty-checkbox label.sc-admiralty-checkbox::before{left:unset;right:0}.form-control.right-align.sc-admiralty-checkbox label.sc-admiralty-checkbox::after{left:unset;right:6px}';const c=o;const r=class{constructor(a){t(this,a);this.admiraltyChange=e(this,"admiraltyChange",7);this.checkboxFocus=e(this,"checkboxFocus",7);this.checkboxBlur=e(this,"checkboxBlur",7);this.inputId=`admiralty-${l++}`;this.onBlur=()=>{this.checkboxBlur.emit()};this.onClick=t=>{if(!this.disabled){t.preventDefault();this.checked=!this.checked}};this.onFocus=()=>{this.checkboxFocus.emit()};this.checkboxRight=false;this.disabled=false;this.name=this.inputId;this.checked=false;this.value=undefined;this.labelText=null;this.labelHidden=false}checkedChanged(t){this.admiraltyChange.emit({checked:t,value:this.value})}render(){const{checked:t,checkboxRight:e,disabled:o,inputId:c,labelText:r,name:l,labelHidden:d}=this;return a(i,{key:"a87f6646f9ff7589711280d14ce641870b52e2b7"},a("div",{key:"f848389af634082d5c3d1ded0a3e8e848e358304","aria-hidden":o?"true":null,class:{"form-control":true,"right-align":e}},a("input",{key:"8c926c7225e1ae8353da8228ca1cf34da516fe7f",id:c,"aria-checked":`${t}`,type:"checkbox",onBlur:this.onBlur,onFocus:this.onFocus,onClick:this.onClick,disabled:o,name:l,checked:t}),a("label",{key:"aa8d99990c2995c2bfaf7dae73a4dd6b3e4e9f9a",htmlFor:c,class:{disabled:o},onClick:this.onClick},a("span",Object.assign({key:"d963bf7831d8e75c7fdce75e8049332759d580f6"},d&&{class:"visually-hidden"}),r))))}static get watchers(){return{checked:["checkedChanged"]}}};let l=0;r.style=c;export{r as admiralty_checkbox};
-//# sourceMappingURL=p-f466640f.entry.js.map

package/dist/admiralty/p-f466640f.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["checkboxCss","AdmiraltyCheckboxStyle0","CheckboxComponent","this","inputId","checkboxIds","onBlur","checkboxBlur","emit","onClick","event","disabled","preventDefault","checked","onFocus","checkboxFocus","checkedChanged","isChecked","admiraltyChange","value","render","checkboxRight","labelText","name","labelHidden","h","Host","key","class","id","type","htmlFor","Object","assign"],"sources":["src/components/checkbox/checkbox.scss?tag=admiralty-checkbox&encapsulation=scoped","src/components/checkbox/checkbox.tsx"],"sourcesContent":["@import 'checkbox.vars';\n\n.form-control {\n  font-size: $checkbox-font-size;\n  font-weight: $checkbox-font-weight;\n  position: relative;\n  display: inline-block;\n\n  input[type='checkbox'] {\n    box-sizing: border-box;\n    opacity: 0;\n    position: absolute;\n    top: 0;\n    left: 0;\n    padding: 0;\n    width: 30px;\n    height: 30px;\n    margin: 0;\n    z-index: 1;\n    cursor: pointer;\n\n    &:checked + label::after {\n      content: '';\n    }\n  }\n\n  label {\n    position: relative;\n    display: inline-block;\n    padding-left: 42px;\n    margin-bottom: 14px;\n    cursor: pointer;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n    min-height: 30px;\n    line-height: 30px;\n\n    &.disabled {\n      cursor: default;\n      pointer-events: none;\n    }\n\n    &::before,\n    &::after {\n      position: absolute;\n      content: none;\n      display: inline-block;\n    }\n\n    &::before {\n      content: '';\n      height: 26px;\n      width: 26px;\n      border: 2px solid $checkbox-border-colour;\n      left: 0;\n      top: 0;\n      background-color: $checkbox-colour;\n    }\n\n    &::after {\n      height: 6px;\n      width: 13px;\n      border-left: 3px solid;\n      border-bottom: 3px solid;\n      transform: rotate(-45deg);\n      color: $checkbox-text-colour;\n      left: 7px;\n      top: 8px;\n    }\n  }\n\n  input[type='checkbox']:focus + label:before {\n    outline-offset: unset;\n    outline: 3px solid $checkbox-focus-colour;\n    box-shadow: $checkbox-border-colour inset 0 0 0 2px;\n  }\n\n  &.right-align label {\n    padding-left: unset;\n    padding-right: 35px;\n\n    &::before {\n      left: unset;\n      right: 0;\n    }\n\n    &::after {\n      left: unset;\n      right: 6px;\n    }\n  }\n}\n","import { Component, EventEmitter, Event, Host, h, Prop, Watch } from '@stencil/core';\nimport { CheckboxChangeEventDetail } from './checkbox.interface';\n\n@Component({\n  tag: 'admiralty-checkbox',\n  styleUrl: 'checkbox.scss',\n  scoped: true,\n})\nexport class CheckboxComponent {\n  private inputId = `admiralty-${checkboxIds++}`;\n\n  /**\n   * Whether the checkbox should be positioned to the right of the label.\n   */\n  @Prop() checkboxRight: boolean = false;\n\n  /**\n   * This dictates whether the form field is disabled.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * If `true`, the checkbox is selected.\n   */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n  /**\n   * The value of the checkbox does not mean if it's checked or not, use the `checked`\n   * property for that.\n   *\n   * The value of a checkbox is analogous to the value of an `<input type=\"checkbox\">`,\n   * it's only used when the checkbox participates in a native `<form>`.\n   */\n  @Prop() value: any | null;\n\n  /**\n   * The label text must be provided and is displayed beside the checkbox, use the `labelHidden` property to control its visibility.\n   */\n  @Prop() labelText: string = null;\n\n  /**\n   * This visually hides the labelText while preserving accessibility.\n   */\n  @Prop() labelHidden: boolean = false;\n\n  /**\n   * Event is fired when the form control changes state\n   * @event admiraltyChange\n   */\n  @Event() admiraltyChange: EventEmitter<CheckboxChangeEventDetail>;\n\n  /**\n   * Event is fired when the form control gains focus\n   * @event checkboxFocus\n   */\n  @Event() checkboxFocus: EventEmitter<FocusEvent>;\n\n  /**\n   * Event is fired when the form control loses focus\n   * @event checkboxBlur\n   */\n  @Event() checkboxBlur: EventEmitter<FocusEvent>;\n\n  @Watch('checked')\n  checkedChanged(isChecked: boolean) {\n    this.admiraltyChange.emit({\n      checked: isChecked,\n      value: this.value,\n    });\n  }\n\n  private onBlur = () => {\n    this.checkboxBlur.emit();\n  };\n\n  private onClick = (event: Event) => {\n    if (!this.disabled) {\n      event.preventDefault();\n      this.checked = !this.checked;\n    }\n  };\n\n  private onFocus = () => {\n    this.checkboxFocus.emit();\n  };\n\n  render() {\n    const { checked, checkboxRight, disabled, inputId, labelText, name, labelHidden } = this;\n\n    return (\n      <Host>\n        <div aria-hidden={disabled ? 'true' : null}\n             class={{ 'form-control': true, 'right-align': checkboxRight }}>\n          <input id={inputId}\n                 aria-checked={`${checked}`}\n                 type=\"checkbox\"\n                 onBlur={this.onBlur}\n                 onFocus={this.onFocus}\n                 onClick={this.onClick}\n                 disabled={disabled}\n                 name={name}\n                 checked={checked}/>\n          <label htmlFor={inputId}\n                 class={{ disabled: disabled }}\n                 onClick={this.onClick}>\n            <span {...(labelHidden && { class: 'visually-hidden' })}>{labelText}</span>\n          </label>\n        </div>\n      </Host>\n    );\n  }\n}\n\nlet checkboxIds = 0;\n"],"mappings":"yDAAA,MAAMA,EAAc,onGACpB,MAAAC,EAAeD,E,MCOFE,EAAiB,M,kKACpBC,KAAAC,QAAU,aAAaC,MAmEvBF,KAAAG,OAAS,KACfH,KAAKI,aAAaC,MAAM,EAGlBL,KAAAM,QAAWC,IACjB,IAAKP,KAAKQ,SAAU,CAClBD,EAAME,iBACNT,KAAKU,SAAWV,KAAKU,O,GAIjBV,KAAAW,QAAU,KAChBX,KAAKY,cAAcP,MAAM,E,mBA1EM,M,cAKL,M,UAKLL,KAAKC,Q,aAK+B,M,oCAc/B,K,iBAKG,K,CAqB/B,cAAAY,CAAeC,GACbd,KAAKe,gBAAgBV,KAAK,CACxBK,QAASI,EACTE,MAAOhB,KAAKgB,O,CAmBhB,MAAAC,GACE,MAAMP,QAAEA,EAAOQ,cAAEA,EAAaV,SAAEA,EAAQP,QAAEA,EAAOkB,UAAEA,EAASC,KAAEA,EAAIC,YAAEA,GAAgBrB,KAEpF,OACEsB,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,yDAAkBhB,EAAW,OAAS,KACjCiB,MAAO,CAAE,eAAgB,KAAM,cAAeP,IACjDI,EAAA,SAAAE,IAAA,2CAAOE,GAAIzB,EAAO,eACG,GAAGS,IACjBiB,KAAK,WACLxB,OAAQH,KAAKG,OACbQ,QAASX,KAAKW,QACdL,QAASN,KAAKM,QACdE,SAAUA,EACVY,KAAMA,EACNV,QAASA,IAChBY,EAAA,SAAAE,IAAA,2CAAOI,QAAS3B,EACTwB,MAAO,CAAEjB,SAAUA,GACnBF,QAASN,KAAKM,SACnBgB,EAAA,OAAAO,OAAAC,OAAA,CAAAN,IAAA,4CAAWH,GAAe,CAAEI,MAAO,oBAAuBN,K,4DAQtE,IAAIjB,EAAc,E","ignoreList":[]}

package/dist/admiralty/p-f9054641.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["selectCss","AdmiraltySelectStyle0","SelectComponent","this","internalId","nextId","valueChanged","nativeSelect","nativeInput","value","getValue","admiraltyChange","emit","toString","handleSelect","event","select","target","handleBlur","_event","admiraltyBlur","selectOption","options","el","querySelectorAll","forEach","option","selected","componentWillRender","render","disabled","hint","label","disabledClass","id","inputId","hintId","errorId","h","Host","key","class","for","style","width","maxWidth","ref","invalid","onChange","onBlur","Object","assign","invalidMessage","display"],"sources":["src/components/select/select.scss?tag=admiralty-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["@import 'select.vars';\n.disabled {\n  color: $select-disabled-text-colour;\n}\n\n.select-wrapper {\n  position: relative;\n}\n\n.select-down-icon {\n  font-size: $select-icon-size;\n  font-weight: $select-text-weight;\n  pointer-events: none;\n  position: absolute;\n  right: 12px;\n  top: 12px;\n}\n\nselect {\n  appearance: none;\n  background-color: $select-background-colour;\n  border: 2px solid $select-border-colour;\n  box-sizing: border-box;\n  color: $select-text-colour;\n  font-size: $select-text-size;\n  line-height: 24px;\n  margin-bottom: 6px;\n  position: relative;\n  font-weight: $select-text-weight;\n  padding: 12px;\n  width: 100%;\n\n  &.invalid {\n    border-color: $select-error-border-colour;\n  }\n\n  &:focus-visible {\n    outline: 3px solid $select-focus-colour;\n    box-shadow: inset 0 0 0 2px $select-border-colour;\n  }\n\n  &.disabled {\n    border-color: $select-disabled-border-colour;\n  }\n}\n","import { Component, Event, Prop, Element, EventEmitter, h, Host, Watch } from '@stencil/core';\nimport { SelectChangeEventDetail } from './select.interface';\n\n@Component({\n  tag: 'admiralty-select',\n  styleUrl: 'select.scss',\n  scoped: true,\n})\nexport class SelectComponent {\n  @Element() el?: HTMLElement;\n  private internalId = ++nextId;\n  private nativeInput?: HTMLSelectElement;\n\n  /**\n   * If `true`, the user cannot interact with the select.\n   */\n  @Prop() disabled: boolean = false;\n  /**\n   * Whether to show that the select is in an invalid state.\n   */\n  @Prop() invalid: boolean = false;\n  /**\n   * The message to show when the select is invalid.\n   */\n  @Prop() invalidMessage: string = null;\n  /**\n   * The text that will be used as a field label.\n   */\n  @Prop() hint: string = null;\n  /**\n   * The text that will be used as a field label.\n   */\n  @Prop() label: string = 'Choose a colour';\n  /**\n   * The maximum width (px) for the input field.\n   */\n  @Prop() width?: number;\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() admiraltyChange: EventEmitter<SelectChangeEventDetail>;\n  /**\n   * Emitted when the component loses focus.\n   */\n  @Event() admiraltyBlur: EventEmitter<void>;\n\n  /**\n   * The value of the input.\n   */\n  @Prop({ mutable: true }) value?: string | number | null = '';\n\n  @Watch('value')\n  protected valueChanged() {\n    const nativeSelect = this.nativeInput;\n    const value = this.getValue();\n    if (nativeSelect && nativeSelect.value !== value) {\n      nativeSelect.value = value;\n    }\n    this.admiraltyChange.emit({ value: this.value == null ? this.getValue() : this.value.toString() });\n  }\n\n  private getValue(): string {\n    return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();\n  }\n\n  handleSelect(event: Event) {\n    const select = event.target as HTMLSelectElement | null;\n    if (select) {\n      this.value = select.value || '';\n    }\n  }\n\n  handleBlur(_event: FocusEvent): void {\n    this.admiraltyBlur.emit();\n  }\n\n  selectOption() {\n    const options = this.el.querySelectorAll('option');\n    options.forEach(option => {\n      option.selected = option.value === this.getValue();\n    });\n  }\n\n  componentWillRender() {\n    this.selectOption();\n  }\n\n  render() {\n    const { disabled, hint, label } = this;\n    const disabledClass = disabled ? 'disabled' : '';\n    const id = this.el.id != '' ? this.el.id : `admiralty-select-${this.internalId}`;\n    const inputId = `${id}-input`;\n    const hintId = `${id}-hint`;\n    const errorId = `${id}-error`;\n\n    return (\n      <Host>\n        <div class={`admiralty-select ${disabledClass}`}>\n          <admiralty-label disabled={this.disabled} for={inputId}>\n            {label}\n          </admiralty-label>\n          {hint ? (\n            <admiralty-hint id={hintId} disabled={this.disabled}>\n              {hint}\n            </admiralty-hint>\n          ) : null}\n          <div class=\"select-wrapper\" style={this.width ? { maxWidth: `${this.width}px` } : {}}>\n            <select\n              ref={select => (this.nativeInput = select)}\n              id={inputId}\n              class={{ 'admiralty-form-control': true, 'invalid': this.invalid, 'disabled': disabled }}\n              aria-disabled={disabled ? 'true' : 'false'}\n              aria-label={label}\n              onChange={event => this.handleSelect(event)}\n              onBlur={event => this.handleBlur(event)}\n              disabled={disabled}\n              aria-describedby={(this.hint ? hintId : '') + ' ' + (this.invalid ? errorId : '')}\n            >\n              <slot></slot>\n            </select>\n            <admiralty-icon class={`select-down-icon ${disabledClass}`} icon-name=\"angle-down\"></admiralty-icon>\n          </div>\n          <admiralty-input-invalid id={errorId} style={{ ...(!(this.invalid && this.invalidMessage) ? { display: 'none' } : {}) }}>\n            {this.invalidMessage}\n          </admiralty-input-invalid>\n        </div>\n      </Host>\n    );\n  }\n}\n\nlet nextId = 0;\n"],"mappings":"gEAAA,MAAMA,EAAY,gmEAClB,MAAAC,EAAeD,E,MCOFE,EAAe,M,uHAElBC,KAAAC,aAAeC,E,cAMK,M,aAID,M,oBAIM,K,UAIV,K,WAIC,kB,gCAiBkC,E,CAGhD,YAAAC,GACR,MAAMC,EAAeJ,KAAKK,YAC1B,MAAMC,EAAQN,KAAKO,WACnB,GAAIH,GAAgBA,EAAaE,QAAUA,EAAO,CAChDF,EAAaE,MAAQA,C,CAEvBN,KAAKQ,gBAAgBC,KAAK,CAAEH,MAAON,KAAKM,OAAS,KAAON,KAAKO,WAAaP,KAAKM,MAAMI,Y,CAG/E,QAAAH,GACN,cAAcP,KAAKM,QAAU,SAAWN,KAAKM,MAAMI,YAAcV,KAAKM,OAAS,IAAII,U,CAGrF,YAAAC,CAAaC,GACX,MAAMC,EAASD,EAAME,OACrB,GAAID,EAAQ,CACVb,KAAKM,MAAQO,EAAOP,OAAS,E,EAIjC,UAAAS,CAAWC,GACThB,KAAKiB,cAAcR,M,CAGrB,YAAAS,GACE,MAAMC,EAAUnB,KAAKoB,GAAGC,iBAAiB,UACzCF,EAAQG,SAAQC,IACdA,EAAOC,SAAWD,EAAOjB,QAAUN,KAAKO,UAAU,G,CAItD,mBAAAkB,GACEzB,KAAKkB,c,CAGP,MAAAQ,GACE,MAAMC,SAAEA,EAAQC,KAAEA,EAAIC,MAAEA,GAAU7B,KAClC,MAAM8B,EAAgBH,EAAW,WAAa,GAC9C,MAAMI,EAAK/B,KAAKoB,GAAGW,IAAM,GAAK/B,KAAKoB,GAAGW,GAAK,oBAAoB/B,KAAKC,aACpE,MAAM+B,EAAU,GAAGD,UACnB,MAAME,EAAS,GAAGF,SAClB,MAAMG,EAAU,GAAGH,UAEnB,OACEI,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,oBAAoBR,KAC9BK,EAAA,mBAAAE,IAAA,2CAAiBV,SAAU3B,KAAK2B,SAAUY,IAAKP,GAC5CH,GAEFD,EACCO,EAAA,kBAAgBJ,GAAIE,EAAQN,SAAU3B,KAAK2B,UACxCC,GAED,KACJO,EAAA,OAAAE,IAAA,2CAAKC,MAAM,iBAAiBE,MAAOxC,KAAKyC,MAAQ,CAAEC,SAAU,GAAG1C,KAAKyC,WAAc,IAChFN,EAAA,UAAAE,IAAA,2CACEM,IAAK9B,GAAWb,KAAKK,YAAcQ,EACnCkB,GAAIC,EACJM,MAAO,CAAE,yBAA0B,KAAMM,QAAW5C,KAAK4C,QAASjB,SAAYA,GAAU,gBACzEA,EAAW,OAAS,QAAO,aAC9BE,EACZgB,SAAUjC,GAASZ,KAAKW,aAAaC,GACrCkC,OAAQlC,GAASZ,KAAKe,WAAWH,GACjCe,SAAUA,EAAQ,oBACC3B,KAAK4B,KAAOK,EAAS,IAAM,KAAOjC,KAAK4C,QAAUV,EAAU,KAE9EC,EAAA,QAAAE,IAAA,8CAEFF,EAAA,kBAAAE,IAAA,2CAAgBC,MAAO,oBAAoBR,IAAe,YAAY,gBAExEK,EAAA,2BAAAE,IAAA,2CAAyBN,GAAIG,EAASM,MAAKO,OAAAC,OAAA,KAAUhD,KAAK4C,SAAW5C,KAAKiD,gBAAkB,CAAEC,QAAS,QAAW,KAC/GlD,KAAKiD,iB,gFAQlB,IAAI/C,EAAS,E","ignoreList":[]}

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

@@ -1,2 +0,0 @@
-import{r as a,c as e,h as t}from"./p-34931ad3.js";import{d as i,e as o}from"./p-7419d0f9.js";const n=".visually-hidden.sc-admiralty-read-more: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-read-more{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-read-more{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-read-more{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-read-more{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-read-more{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-read-more{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-read-more{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-read-more{display:none}}section.expansion.sc-admiralty-read-more{padding:2px 0}section.expansion.sc-admiralty-read-more .expansion-content.sc-admiralty-read-more{display:none;max-height:0;overflow:visible;border-left:4px solid var(--admiralty-colour-info)}section.expansion.expanded.sc-admiralty-read-more .expansion-content.sc-admiralty-read-more{display:block;max-height:initial;padding:2px 5px}section.expansion.sc-admiralty-read-more button.sc-admiralty-read-more{background-color:transparent;border:none;white-space:unset;color:var(--admiralty-text-color);font-weight:unset;cursor:pointer;margin:8px 0px;padding:4px;align-items:baseline;text-align:left;text-decoration:underline;text-underline-offset:0.15em}section.expansion.sc-admiralty-read-more button.expanded.sc-admiralty-read-more span.sc-admiralty-read-more{font-weight:var(--admiralty-read-more-font-weight, var(--admiralty-font-weight-medium))}section.expansion.sc-admiralty-read-more button.sc-admiralty-read-more .expansion-heading-icon.sc-admiralty-read-more{margin-left:5px;margin-right:8px;vertical-align:top}section.expansion.sc-admiralty-read-more button.sc-admiralty-read-more:hover{text-decoration-thickness:0.15em}section.expansion.sc-admiralty-read-more button.sc-admiralty-read-more: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 r=n;let d=0;const s=class{constructor(t){a(this,t);this.admiraltyToggled=e(this,"admiraltyToggled",7);this.internalId=`admiralty-read-more-${++d}`;this.headerId=`${this.internalId}-header`;this.contentId=`${this.internalId}-content`;this.heading=undefined;this.expanded=false}get expansionIcon(){return this.expanded?i:o}onToggle(){this.expanded=!this.expanded;this.admiraltyToggled.emit(this.expanded)}render(){return t("section",{key:"5672c454a74e8e3ac1cbe556dd8cb1aa322bf057",class:{expansion:true,expanded:this.expanded}},t("button",{key:"04bf2c513a96542f89b0d8e889a8da22f96772bb",id:this.headerId,type:"button","aria-expanded":this.expanded,"aria-controls":this.contentId,class:{expanded:this.expanded},onClick:this.onToggle.bind(this)},t("admiralty-icon",{key:"b9df26edd2db37b09dc054f1e13a457c171ff3f9",class:"expansion-heading-icon","icon-name":this.expansionIcon.iconName}),t("span",{key:"fb60d5b4fb19539674cdf0db71e699bed3b0b48b"},this.heading),t("span",{key:"ce888d917b881faf32277087f6a67ff92b9a07b8",class:"visually-hidden"},", ",this.expanded?"Hide":"Show"," this section")),t("div",{key:"cac8700c2c899c5676ce46bd82f556d478b6f4b5",class:"expansion-content",id:this.contentId,"aria-labelledby":this.headerId,hidden:!this.expanded},t("slot",{key:"ec8c140702ff031ee0e938993a6d3638f0f3da6f"})))}};s.style=r;export{s as admiralty_read_more};
-//# sourceMappingURL=p-fecc031a.entry.js.map

package/dist/admiralty/p-fecc031a.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["readMoreCss","AdmiraltyReadMoreStyle0","nextId","ReadMoreComponent","this","internalId","headerId","contentId","expansionIcon","expanded","faArrowDown","faArrowRight","onToggle","admiraltyToggled","emit","render","h","key","class","expansion","id","type","onClick","bind","iconName","heading","hidden"],"sources":["src/components/read-more/read-more.scss?tag=admiralty-read-more&encapsulation=scoped","src/components/read-more/read-more.tsx"],"sourcesContent":["@import 'read-more.vars.scss';\n\nsection.expansion {\n  padding: 2px 0;\n\n  .expansion-content {\n    display: none;\n    max-height: 0;\n    overflow: visible;\n    border-left: 4px solid $read-more-border-colour;\n  }\n  &.expanded .expansion-content {\n    display: block;\n    max-height: initial;\n    padding: 2px 5px;\n  }\n\n  button {\n    background-color: transparent;\n    border: none;\n    white-space: unset;\n    color: $read-more-text-colour;\n    font-weight: unset;\n    cursor: pointer;\n    margin: 8px 0px;\n    padding: 4px;\n    align-items: baseline;\n    text-align: left;\n    text-decoration: underline;\n    text-underline-offset: 0.15em;\n\n    &.expanded span {\n      font-weight: $read-more-font-weight;\n    }\n\n    .expansion-heading-icon {\n      margin-left: 5px;\n      margin-right: 8px;\n      vertical-align: top;\n    }\n\n    &:hover {\n      text-decoration-thickness: 0.15em;\n    }\n\n    &:focus {\n      @include focus-highlight;\n    }\n  }\n}\n","import { Component, EventEmitter, Prop, State, Event, h } from '@stencil/core';\nimport { faArrowDown, faArrowRight } from '@fortawesome/free-solid-svg-icons';\nimport { IconDefinition } from '@fortawesome/fontawesome-svg-core';\n\nlet nextId = 0;\n\n@Component({\n  tag: 'admiralty-read-more',\n  styleUrl: 'read-more.scss',\n  scoped: true,\n})\nexport class ReadMoreComponent {\n  /**\n   * The text to display in the heading of the readmore component.\n   */\n  @Prop() heading: string;\n\n  @State() expanded = false;\n\n  /**\n   * The event that is dispatched when the expanded status is toggled.\n   */\n  @Event() admiraltyToggled: EventEmitter<boolean>;\n\n  internalId: string = `admiralty-read-more-${++nextId}`;\n\n  headerId: string = `${this.internalId}-header`;\n  contentId: string = `${this.internalId}-content`;\n\n  get expansionIcon(): IconDefinition {\n    return this.expanded ? faArrowDown : faArrowRight;\n  }\n\n  onToggle() {\n    this.expanded = !this.expanded;\n    this.admiraltyToggled.emit(this.expanded);\n  }\n\n  render() {\n    return (\n      <section\n        class={{\n          expansion: true,\n          expanded: this.expanded,\n        }}\n      >\n        <button\n          id={this.headerId}\n          type=\"button\"\n          aria-expanded={this.expanded}\n          aria-controls={this.contentId}\n          class={{ expanded: this.expanded }}\n          onClick={this.onToggle.bind(this)}\n        >\n          <admiralty-icon class=\"expansion-heading-icon\" icon-name={this.expansionIcon.iconName}></admiralty-icon>\n          <span>{this.heading}</span>\n          <span class=\"visually-hidden\">, {this.expanded ? 'Hide' : 'Show'} this section</span>\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"],"mappings":"6FAAA,MAAMA,EAAc,28EACpB,MAAAC,EAAeD,ECGf,IAAIE,EAAS,E,MAOAC,EAAiB,M,4EAa5BC,KAAAC,WAAqB,yBAAyBH,IAE9CE,KAAAE,SAAmB,GAAGF,KAAKC,oBAC3BD,KAAAG,UAAoB,GAAGH,KAAKC,qB,qCAVR,K,CAYpB,iBAAIG,GACF,OAAOJ,KAAKK,SAAWC,EAAcC,C,CAGvC,QAAAC,GACER,KAAKK,UAAYL,KAAKK,SACtBL,KAAKS,iBAAiBC,KAAKV,KAAKK,S,CAGlC,MAAAM,GACE,OACEC,EAAA,WAAAC,IAAA,2CACEC,MAAO,CACLC,UAAW,KACXV,SAAUL,KAAKK,WAGjBO,EAAA,UAAAC,IAAA,2CACEG,GAAIhB,KAAKE,SACTe,KAAK,SAAQ,gBACEjB,KAAKK,SAAQ,gBACbL,KAAKG,UACpBW,MAAO,CAAET,SAAUL,KAAKK,UACxBa,QAASlB,KAAKQ,SAASW,KAAKnB,OAE5BY,EAAA,kBAAAC,IAAA,2CAAgBC,MAAM,yBAAwB,YAAYd,KAAKI,cAAcgB,WAC7ER,EAAA,QAAAC,IAAA,4CAAOb,KAAKqB,SACZT,EAAA,QAAAC,IAAA,2CAAMC,MAAM,mBAAiB,KAAId,KAAKK,SAAW,OAAS,OAAM,kBAElEO,EAAA,OAAAC,IAAA,2CAAKC,MAAM,oBAAoBE,GAAIhB,KAAKG,UAAS,kBAAmBH,KAAKE,SAAUoB,QAAStB,KAAKK,UAC/FO,EAAA,QAAAC,IAAA,8C","ignoreList":[]}