@ukho/admiralty-core 0.15.0 → 0.16.0

package/dist/admiralty/admiralty.esm.js

@@ -1,2 +1,2 @@
-import{p as a,b as e}from"./p-ac0ad15a.js";export{s as setNonce}from"./p-ac0ad15a.js";import{g as i}from"./p-e1255160.js";var l=()=>{const e=import.meta.url;const i={};if(e!==""){i.resourcesUrl=new URL(".",e).href}return a(i)};l().then((async a=>{await i();return e([["p-0c600251",[[6,"admiralty-type-ahead",{value:[1],label:[1],hint:[1],placeholder:[1],resultsOnInitFocus:[4,"results-on-init-focus"],filterResult:[32]}]]],["p-caf28231",[[2,"admiralty-autocomplete",{autoselect:[4],cssNamespace:[1,"css-namespace"],displayMenu:[1,"display-menu"],minLength:[2,"min-length"],name:[1],placeholder:[1],confirmOnBlur:[4,"confirm-on-blur"],showNoOptionsFound:[4,"show-no-options-found"],showAllValues:[4,"show-all-values"],required:[4],assistiveHint:[1,"assistive-hint"],menuAttributes:[8,"menu-attributes"],inputClasses:[1,"input-classes"],menuClasses:[1,"menu-classes"],label:[1],hint:[1],invalid:[4],invalidMessage:[1,"invalid-message"],disabled:[4],value:[1025],focused:[32],hovered:[32],menuOpen:[32],options:[32],option:[32],query:[32],validChoiceMade:[32],selected:[32],ariaHint:[32]},null,{value:["onValueChange"],focused:["onFocusedChange"]}]]],["p-ea845f4a",[[6,"admiralty-select",{disabled:[4],invalid:[4],invalidMessage:[1,"invalid-message"],hint:[1],label:[1],width:[2],value:[1032]},null,{value:["valueChanged"]}]]],["p-abb4639b",[[2,"admiralty-textarea",{label:[1],hint:[1],width:[2],maxLength:[2,"max-length"],disabled:[4],invalid:[4],invalidMessage:[1,"invalid-message"],value:[1032]},null,{value:["valueChanged"]}]]],["p-5a8e43f2",[[6,"admiralty-colour-block",{width:[2],height:[2],heading:[1],colour:[1],actionText:[1,"action-text"]}]]],["p-4e73bd73",[[2,"admiralty-file-input",{label:[1],multiple:[4],invalid:[4],invalidMessage:[1,"invalid-message"],files:[32]}]]],["p-a2ae15a3",[[6,"admiralty-filter",{filterTitle:[1,"filter-title"]}]]],["p-afadb041",[[6,"admiralty-filter-group",{groupTitle:[1,"group-title"]}]]],["p-55648914",[[2,"admiralty-paginator",{pages:[2],currentPage:[2,"current-page"],label:[1]}]]],["p-13eab822",[[6,"admiralty-radio-group",{name:[1],value:[1032],displayVertical:[4,"display-vertical"],invalid:[4],invalidMessage:[1,"invalid-message"]},null,{value:["valueChanged"],invalid:["invalidChanged"]}]]],["p-b743ca74",[[6,"admiralty-breadcrumb",{active:[4],first:[4],href:[1]}]]],["p-77549f7b",[[6,"admiralty-dialogue",{type:[1],heading:[1]}]]],["p-0e66fea2",[[6,"admiralty-header",{headerTitle:[1,"header-title"],headerTitleUrl:[1,"header-title-url"],logoLinkUrl:[1,"logo-link-url"],logoImgUrl:[1,"logo-img-url"],logoAltText:[1,"logo-alt-text"],mobileMenuOpen:[32],displayHamburger:[32]}]]],["p-e9ff954f",[[2,"admiralty-progress-bar",{label:[1],progression:[2],error:[4],progressionValue:[32]},null,{progression:["progressionChanged"]}]]],["p-2780d617",[[6,"admiralty-read-more",{heading:[1],expanded:[32]}]]],["p-ae23a899",[[2,"admiralty-autocomplete-option",{value:[8]}]]],["p-298fe86e",[[6,"admiralty-breadcrumbs"]]],["p-00bdb9a8",[[6,"admiralty-card",{heading:[1]}]]],["p-5fb35437",[[2,"admiralty-checkbox",{checkboxRight:[4,"checkbox-right"],disabled:[4],name:[1],checked:[1028],value:[8],labelText:[1,"label-text"]},null,{checked:["checkedChanged"]}]]],["p-675fb90c",[[6,"admiralty-footer",{imageLink:[1,"image-link"],imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"],text:[1]}]]],["p-99d0a688",[[6,"admiralty-header-menu-item",{menuTitle:[1,"menu-title"],active:[4]}]]],["p-ba35abbe",[[2,"admiralty-header-profile",{isSignedIn:[4,"is-signed-in"],signedInText:[1,"signed-in-text"],signInOnly:[4,"sign-in-only"]}]]],["p-5585be8a",[[2,"admiralty-header-sub-menu-item",{menuTitle:[1,"menu-title"]}]]],["p-aaf7fb89",[[2,"admiralty-hr"]]],["p-bfb87bdb",[[6,"admiralty-link",{href:[1],newTab:[4,"new-tab"]}]]],["p-e13daa98",[[6,"admiralty-modal-dialog",{heading:[1],label:[1],description:[1],show:[4]}]]],["p-6f84528b",[[4,"admiralty-paginator-wrapper",null,[[0,"pageChange","pageChangedHandler"]]]]],["p-6def54c9",[[2,"admiralty-phase-banner",{phase:[1],link:[1]}]]],["p-73bfd052",[[6,"admiralty-radio",{name:[1],value:[1025],disabled:[4],checked:[1028],invalid:[4],buttonTabindex:[32],setButtonTabindex:[64]},null,{value:["valueChanged"]}]]],["p-bc290da9",[[6,"admiralty-side-nav",{label:[1]}]]],["p-a08bec80",[[2,"admiralty-side-nav-item",{sideNavItemId:[1,"side-nav-item-id"],headingTitle:[1,"heading-title"],navActive:[4,"nav-active"]}]]],["p-60b9c4d4",[[4,"admiralty-side-nav-wrapper",null,[[0,"sideNavItemSelected","onSideNavItemSelected"]]]]],["p-88b9303c",[[2,"admiralty-skip-link",{href:[1]}]]],["p-aa6c608f",[[6,"admiralty-tab",{label:[1],tabLabelId:[1,"tab-label-id"],tabContentId:[1,"tab-content-id"]}]]],["p-79e7da4b",[[6,"admiralty-tab-group",{selectedIndex:[1026,"selected-index"]}]]],["p-1e1935af",[[6,"admiralty-table",{caption:[1]}]]],["p-4c25b2d6",[[6,"admiralty-table-body"]]],["p-4d3c0cdc",[[6,"admiralty-table-cell"]]],["p-2943fbbb",[[6,"admiralty-table-header"]]],["p-003aa9ce",[[6,"admiralty-table-header-cell"]]],["p-f2f92bbf",[[6,"admiralty-table-row"]]],["p-a4d60733",[[2,"admiralty-type-ahead-item",{value:[1]}]]],["p-d93164bf",[[1,"admiralty-icon",{iconName:[1,"icon-name"],iconPrefix:[1,"icon-prefix"]}]]],["p-cf2bfbae",[[2,"admiralty-input",{name:[1],label:[1],hint:[1],disabled:[4],type:[1],placeholder:[1],width:[2],maxLength:[2,"max-length"],required:[4],invalid:[4],invalidMessage:[1,"invalid-message"],autocomplete:[1],value:[1032]},null,{value:["valueChanged"]}]]],["p-68a54540",[[6,"admiralty-expansion",{heading:[1],expanded:[1540],alignHeadingRight:[4,"align-heading-right"],hideBorder:[4,"hide-border"]}]]],["p-b4465943",[[6,"admiralty-button",{variant:[1],icon:[1],disabled:[516],type:[1]}]]],["p-6492124b",[[6,"admiralty-hint",{disabled:[4]}],[6,"admiralty-label",{disabled:[4],for:[1]}],[6,"admiralty-input-invalid"]]]],a)}));
+import{p as a,b as e}from"./p-ac0ad15a.js";export{s as setNonce}from"./p-ac0ad15a.js";import{g as i}from"./p-e1255160.js";var l=()=>{const e=import.meta.url;const i={};if(e!==""){i.resourcesUrl=new URL(".",e).href}return a(i)};l().then((async a=>{await i();return e([["p-6229741b",[[6,"admiralty-type-ahead",{value:[1],label:[1],hint:[1],placeholder:[1],resultsOnInitFocus:[4,"results-on-init-focus"],filterResult:[32]}]]],["p-caf28231",[[2,"admiralty-autocomplete",{autoselect:[4],cssNamespace:[1,"css-namespace"],displayMenu:[1,"display-menu"],minLength:[2,"min-length"],name:[1],placeholder:[1],confirmOnBlur:[4,"confirm-on-blur"],showNoOptionsFound:[4,"show-no-options-found"],showAllValues:[4,"show-all-values"],required:[4],assistiveHint:[1,"assistive-hint"],menuAttributes:[8,"menu-attributes"],inputClasses:[1,"input-classes"],menuClasses:[1,"menu-classes"],label:[1],hint:[1],invalid:[4],invalidMessage:[1,"invalid-message"],disabled:[4],value:[1025],focused:[32],hovered:[32],menuOpen:[32],options:[32],option:[32],query:[32],validChoiceMade:[32],selected:[32],ariaHint:[32]},null,{value:["onValueChange"],focused:["onFocusedChange"]}]]],["p-ea845f4a",[[6,"admiralty-select",{disabled:[4],invalid:[4],invalidMessage:[1,"invalid-message"],hint:[1],label:[1],width:[2],value:[1032]},null,{value:["valueChanged"]}]]],["p-abb4639b",[[2,"admiralty-textarea",{label:[1],hint:[1],width:[2],maxLength:[2,"max-length"],disabled:[4],invalid:[4],invalidMessage:[1,"invalid-message"],value:[1032]},null,{value:["valueChanged"]}]]],["p-5a8e43f2",[[6,"admiralty-colour-block",{width:[2],height:[2],heading:[1],colour:[1],actionText:[1,"action-text"]}]]],["p-4e73bd73",[[2,"admiralty-file-input",{label:[1],multiple:[4],invalid:[4],invalidMessage:[1,"invalid-message"],files:[32]}]]],["p-a2ae15a3",[[6,"admiralty-filter",{filterTitle:[1,"filter-title"]}]]],["p-afadb041",[[6,"admiralty-filter-group",{groupTitle:[1,"group-title"]}]]],["p-55648914",[[2,"admiralty-paginator",{pages:[2],currentPage:[2,"current-page"],label:[1]}]]],["p-13eab822",[[6,"admiralty-radio-group",{name:[1],value:[1032],displayVertical:[4,"display-vertical"],invalid:[4],invalidMessage:[1,"invalid-message"]},null,{value:["valueChanged"],invalid:["invalidChanged"]}]]],["p-b743ca74",[[6,"admiralty-breadcrumb",{active:[4],first:[4],href:[1]}]]],["p-77549f7b",[[6,"admiralty-dialogue",{type:[1],heading:[1]}]]],["p-0e66fea2",[[6,"admiralty-header",{headerTitle:[1,"header-title"],headerTitleUrl:[1,"header-title-url"],logoLinkUrl:[1,"logo-link-url"],logoImgUrl:[1,"logo-img-url"],logoAltText:[1,"logo-alt-text"],mobileMenuOpen:[32],displayHamburger:[32]}]]],["p-e9ff954f",[[2,"admiralty-progress-bar",{label:[1],progression:[2],error:[4],progressionValue:[32]},null,{progression:["progressionChanged"]}]]],["p-2780d617",[[6,"admiralty-read-more",{heading:[1],expanded:[32]}]]],["p-ae23a899",[[2,"admiralty-autocomplete-option",{value:[8]}]]],["p-298fe86e",[[6,"admiralty-breadcrumbs"]]],["p-00bdb9a8",[[6,"admiralty-card",{heading:[1]}]]],["p-5fb35437",[[2,"admiralty-checkbox",{checkboxRight:[4,"checkbox-right"],disabled:[4],name:[1],checked:[1028],value:[8],labelText:[1,"label-text"]},null,{checked:["checkedChanged"]}]]],["p-675fb90c",[[6,"admiralty-footer",{imageLink:[1,"image-link"],imageSrc:[1,"image-src"],imageAlt:[1,"image-alt"],text:[1]}]]],["p-99d0a688",[[6,"admiralty-header-menu-item",{menuTitle:[1,"menu-title"],active:[4]}]]],["p-ba35abbe",[[2,"admiralty-header-profile",{isSignedIn:[4,"is-signed-in"],signedInText:[1,"signed-in-text"],signInOnly:[4,"sign-in-only"]}]]],["p-5585be8a",[[2,"admiralty-header-sub-menu-item",{menuTitle:[1,"menu-title"]}]]],["p-aaf7fb89",[[2,"admiralty-hr"]]],["p-bfb87bdb",[[6,"admiralty-link",{href:[1],newTab:[4,"new-tab"]}]]],["p-e13daa98",[[6,"admiralty-modal-dialog",{heading:[1],label:[1],description:[1],show:[4]}]]],["p-6f84528b",[[4,"admiralty-paginator-wrapper",null,[[0,"pageChange","pageChangedHandler"]]]]],["p-6def54c9",[[2,"admiralty-phase-banner",{phase:[1],link:[1]}]]],["p-73bfd052",[[6,"admiralty-radio",{name:[1],value:[1025],disabled:[4],checked:[1028],invalid:[4],buttonTabindex:[32],setButtonTabindex:[64]},null,{value:["valueChanged"]}]]],["p-bc290da9",[[6,"admiralty-side-nav",{label:[1]}]]],["p-a08bec80",[[2,"admiralty-side-nav-item",{sideNavItemId:[1,"side-nav-item-id"],headingTitle:[1,"heading-title"],navActive:[4,"nav-active"]}]]],["p-60b9c4d4",[[4,"admiralty-side-nav-wrapper",null,[[0,"sideNavItemSelected","onSideNavItemSelected"]]]]],["p-88b9303c",[[2,"admiralty-skip-link",{href:[1]}]]],["p-aa6c608f",[[6,"admiralty-tab",{label:[1],tabLabelId:[1,"tab-label-id"],tabContentId:[1,"tab-content-id"]}]]],["p-79e7da4b",[[6,"admiralty-tab-group",{selectedIndex:[1026,"selected-index"]}]]],["p-1e1935af",[[6,"admiralty-table",{caption:[1]}]]],["p-4c25b2d6",[[6,"admiralty-table-body"]]],["p-4d3c0cdc",[[6,"admiralty-table-cell"]]],["p-2943fbbb",[[6,"admiralty-table-header"]]],["p-003aa9ce",[[6,"admiralty-table-header-cell"]]],["p-f2f92bbf",[[6,"admiralty-table-row"]]],["p-a4d60733",[[2,"admiralty-type-ahead-item",{value:[1]}]]],["p-d93164bf",[[1,"admiralty-icon",{iconName:[1,"icon-name"],iconPrefix:[1,"icon-prefix"]}]]],["p-cf2bfbae",[[2,"admiralty-input",{name:[1],label:[1],hint:[1],disabled:[4],type:[1],placeholder:[1],width:[2],maxLength:[2,"max-length"],required:[4],invalid:[4],invalidMessage:[1,"invalid-message"],autocomplete:[1],value:[1032]},null,{value:["valueChanged"]}]]],["p-68a54540",[[6,"admiralty-expansion",{heading:[1],expanded:[1540],alignHeadingRight:[4,"align-heading-right"],hideBorder:[4,"hide-border"]}]]],["p-b4465943",[[6,"admiralty-button",{variant:[1],icon:[1],disabled:[516],type:[1]}]]],["p-1fd9acd6",[[6,"admiralty-hint",{disabled:[4]}],[6,"admiralty-label",{disabled:[4],for:[1]}],[6,"admiralty-input-invalid"]]]],a)}));
 //# sourceMappingURL=admiralty.esm.js.map

package/dist/admiralty/p-1fd9acd6.entry.js

@@ -0,0 +1,2 @@
+import{r as a,h as e,H as d}from"./p-ac0ad15a.js";import{a as t}from"./p-a28a614b.js";const i="p.sc-admiralty-hint{margin-top:0;margin-bottom:6px;display:block;font-weight:300}p.disabled.sc-admiralty-hint{color:#adadad}";const c=i;const s=class{constructor(e){a(this,e);this.disabled=undefined}render(){return e("p",{key:"d5c32ab0bb0416a7f1e10ae3c134477785cd9c2b",class:{disabled:this.disabled}},e("slot",{key:"2f34effc00bded2b043d3e6329a6d3f1d9e8ba0e"}))}};s.style=c;const l=".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d;margin:4px 0}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";const n=l;const r=class{constructor(e){a(this,e)}render(){return e(d,{key:"9267bec797b4495d10b0a5095c7406a8b9d45189"},e("admiralty-icon",{key:"4d2be552269678fb718cc1a431e8e734602c7dcf","icon-name":t.iconName,class:"error-icon"}),e("p",{key:"2bdee004583f330f204e3601e2dc6fa6dee5759e"},e("slot",{key:"5544283b85989a983a59a2cce4eb4f6de6fae41e"})))}};r.style=n;const o="label.sc-admiralty-label{margin-bottom:6px;display:inline-block;font-weight:normal}label.disabled.sc-admiralty-label{color:#adadad}";const b=o;const m=class{constructor(e){a(this,e);this.disabled=undefined;this.for=undefined}render(){return e("label",{key:"685f1ed5184b955228654c935f24b45efe7b84b0",htmlFor:this.for,class:{disabled:this.disabled}},e("slot",{key:"561906355acbccdaf9cdc12fd09225bae6946d50"}))}};m.style=b;export{s as admiralty_hint,r as admiralty_input_invalid,m as admiralty_label};
+//# sourceMappingURL=p-1fd9acd6.entry.js.map

package/dist/admiralty/p-1fd9acd6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["hintCss","AdmiraltyHintStyle0","HintComponent","render","h","key","class","disabled","this","inputInvalidCss","AdmiraltyInputInvalidStyle0","InputInvalidComponent","Host","faExclamation","iconName","labelCss","AdmiraltyLabelStyle0","LabelComponent","htmlFor","for"],"sources":["src/components/hint/hint.scss?tag=admiralty-hint&encapsulation=scoped","src/components/hint/hint.tsx","src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx","src/components/label/label.scss?tag=admiralty-label&encapsulation=scoped","src/components/label/label.tsx"],"sourcesContent":["@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\np {\n  margin-top: 0;\n  margin-bottom: 6px;\n  display: block;\n  font-weight: typography.$font-weight-light;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  scoped: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n","@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n  margin: 4px 0;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n","@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\nlabel {\n  margin-bottom: 6px;\n  display: inline-block;\n  font-weight: typography.$font-weight-medium;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The label content should be placed in the slot e.g.\n * `<admiralty-label>First Name</admiralty-label>`\n */\n@Component({\n  tag: 'admiralty-label',\n  styleUrl: 'label.scss',\n  scoped: true,\n})\nexport class LabelComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * The id of the input the label is attached to\n   */\n  @Prop() for: string;\n\n  render() {\n    return (\n      <label htmlFor={this.for} class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAU,+HAChB,MAAAC,EAAeD,E,MCUFE,EAAa,M,iDAMxB,MAAAC,GACE,OACEC,EAAA,KAAAC,IAAA,2CAAGC,MAAO,CAAEC,SAAUC,KAAKD,WACzBH,EAAA,QAAAC,IAAA,6C,aCpBR,MAAMI,EAAkB,0LACxB,MAAAC,EAAeD,E,MCWFE,EAAqB,M,yBAChC,MAAAR,GACE,OACEC,EAACQ,EAAI,CAAAP,IAAA,4CACHD,EAAA,kBAAAC,IAAA,uDAA2BQ,EAAcC,SAAUR,MAAM,eACzDF,EAAA,KAAAC,IAAA,4CACED,EAAA,QAAAC,IAAA,8C,aClBV,MAAMU,EAAW,sIACjB,MAAAC,EAAeD,E,MCUFE,EAAc,M,oEAWzB,MAAAd,GACE,OACEC,EAAA,SAAAC,IAAA,2CAAOa,QAASV,KAAKW,IAAKb,MAAO,CAAEC,SAAUC,KAAKD,WAChDH,EAAA,QAAAC,IAAA,6C"}

package/dist/admiralty/{p-0c600251.entry.js → p-6229741b.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,c as a,f as e,h as i,H as s,g as h}from"./p-ac0ad15a.js";import{K as d}from"./p-a4bd6904.js";const n='@charset "UTF-8";.visually-hidden.sc-admiralty-type-ahead: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-type-ahead{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-type-ahead{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-type-ahead{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-type-ahead{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-type-ahead{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-type-ahead{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-type-ahead{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-type-ahead{display:none}}*.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;font-size:18px;line-height:24px;font-weight:300;color:#333333}@media (max-width: 1023px){*.sc-admiralty-type-ahead{font-size:16px}}a.sc-admiralty-type-ahead{color:#09315b}a.sc-admiralty-type-ahead:focus{outline:3px solid #ffdd00;outline-offset:1px}h1.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:48px;line-height:60px;margin:0 0 30px 0}@media (max-width: 1023px){h1.sc-admiralty-type-ahead{font-size:46px;line-height:54px}}h2.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:36px;line-height:48px;margin-bottom:18px}@media (max-width: 1023px){h2.sc-admiralty-type-ahead{font-size:34px;line-height:42px}}h3.sc-admiralty-type-ahead,h4.sc-admiralty-type-ahead,h5.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:21px;line-height:30px;margin-bottom:12px}@media (max-width: 1023px){h3.sc-admiralty-type-ahead,h4.sc-admiralty-type-ahead,h5.sc-admiralty-type-ahead{font-size:20px;line-height:30px}}h6.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:18px;line-height:24px;margin-bottom:12px}@media (max-width: 1023px){h6.sc-admiralty-type-ahead{font-size:16px}}p.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;margin-bottom:30px}.intro.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;font-size:28px;line-height:36px;margin-bottom:30px}@media (max-width: 1023px){.intro.sc-admiralty-type-ahead{font-size:26px}}.small.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;font-size:16px}@media (max-width: 1023px){.small.sc-admiralty-type-ahead{font-size:14px;line-height:22px}}blockquote.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;line-height:30px;width:100%;padding:24px 18px;border-left:5px solid #09315b;margin-bottom:30px;background:#eeeeee}@media (max-width: 1023px){blockquote.sc-admiralty-type-ahead{line-height:24px}}ul.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;list-style:none}ul.sc-admiralty-type-ahead a.sc-admiralty-type-ahead{font-weight:300}ul.sc-admiralty-type-ahead li.sc-admiralty-type-ahead{margin-bottom:12px}ul.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{content:"■";font-size:18px;color:#09315b;vertical-align:text-bottom;margin-right:12px}@media (max-width: 1023px){ul.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{font-size:8px}}ol.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;list-style:none;counter-reset:li}ol.sc-admiralty-type-ahead a.sc-admiralty-type-ahead{font-weight:300}ol.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{content:counter(li) ".";color:#03284f;font-size:18px;margin-right:12px}ol.sc-admiralty-type-ahead li.sc-admiralty-type-ahead{counter-increment:li;margin-bottom:12px}.white-text.sc-admiralty-type-ahead *.sc-admiralty-type-ahead{color:#ffffff}*.sc-admiralty-type-ahead{margin:0px;padding:0px}.text-input-wrap.sc-admiralty-type-ahead{height:auto !important}.filterTextInput.sc-admiralty-type-ahead{width:100%}.typeahead-list-container.sc-admiralty-type-ahead{position:relative}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead{position:absolute;left:0px;top:-24px;background-color:#ffffff;width:100%;box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25);border:2px solid #333333;border-top:none;box-sizing:border-box;max-height:180px;overflow-y:auto;z-index:1;list-style:none}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead li.sc-admiralty-type-ahead{cursor:pointer;transform:unset !important;padding:6px;min-height:24px;margin:0}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{content:none}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead li.highlighted.sc-admiralty-type-ahead{background-color:#09315b;color:#ffffff}';const l=n;const o=class{constructor(e){t(this,e);this.selectionChanged=a(this,"selectionChanged",7);this.valueChanged=a(this,"valueChanged",7);this._id=`admiralty-typeahead-${++r}`;this.hintId=`${this._id}-assistive-hint`;this.listId=`${this._id}-list`;this.filterList=[];this.selectedItemIndex=-1;this.isFocused=false;this.isSilenced=false;this.isAlternateStatusSection=false;this.originalSearch="";this.hasBeenFocusedAtLeastOnce=false;this.filterResult=new Array;this.value=undefined;this.label=undefined;this.hint=undefined;this.placeholder=undefined;this.resultsOnInitFocus=false}get inputValue(){return this.inputControl.value.toString()}set inputValue(t){this.inputControl.value=t}componentDidLoad(){if(this.value){this.inputValue=this.value}}connectedCallback(){this.mutation=new MutationObserver((()=>{this.populateFilterList();e(this)}));this.mutation.observe(this.el,{childList:true,subtree:true})}disconnectedCallback(){if(this.mutation){this.mutation.disconnect();this.mutation=undefined}}populateFilterList(){const t=this.el.querySelectorAll("admiralty-type-ahead-item");this.filterList=[];t.forEach((t=>{this.filterList.push(t.getAttribute("value"));console.log("fliterlist value ",t.getAttribute("value"))}))}handleFocusIn(){if(this.resultsOnInitFocus&&!this.hasBeenFocusedAtLeastOnce){this.performFilter("");this.hasBeenFocusedAtLeastOnce=true}this.isFocused=true;this.isSilenced=false}handleFocusOut(){this.isFocused=false;this.statusText=null;this.isSilenced=true}textChanged(t){this.originalSearch=t;this.performFilter(t);this.isSilenced=false;this.valueChanged.emit(t)}handleKeyPressed(t){t.stopImmediatePropagation();if(t.key===d.UP_ARROW||t.key===d.DOWN_ARROW){this.navigateSuggestions(t.key);this.updateScroll()}else if(t.key!==d.ENTER){this.textChanged(this.inputValue);this.selectCurrentItem()}}handleKeyDown(t){t.stopImmediatePropagation();if(t.key===d.TAB||t.key===d.ENTER){this.selectCurrentItem()}}handleItemSelected(t){this.inputValue=t;this.textChanged(t);this.filterResult=new Array;this.selectionChanged.emit(t)}performFilter(t){const a=(t,a)=>{const e=t.filter((t=>a===null||a.length<1||t.toLowerCase().indexOf(a.toLowerCase())>-1));return e};this.filterResult=a(this.filterList,t);this.selectedItemIndex=-1}addHighlight(){if(this.selectedItemIndex>-1){const t=this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);t.classList.add("highlighted")}}removeHighlight(t){if(t>-1){const a=this.el.querySelector(`#${this.getListItemId(t)}`);a.classList.remove("highlighted")}}selectCurrentItem(){if(this.selectedItemIndex>=0){const t=this.filterResult[this.selectedItemIndex];this.handleItemSelected(t)}}handleItemHovered(t){this.removeHighlight(this.selectedItemIndex);this.selectedItemIndex=t;this.addHighlight()}handleComponentFocusOut(){var t;if(((t=this.filterResult)===null||t===void 0?void 0:t.length)>0){this.filterResult=new Array;this.hasBeenFocusedAtLeastOnce=false}}updateScroll(){const t=this.listContainer;const a=t.querySelector("ul");const e=Array.from(a.childNodes).find((t=>t.ariaPosInSet===`${this.selectedItemIndex+1}`));if(t&&e&&t.scrollHeight+t.clientHeight){e.scrollIntoView()}}navigateSuggestions(t){if(t===d.UP_ARROW){this.removeHighlight(this.selectedItemIndex);this.selectedItemIndex--;if(this.selectedItemIndex===-2){this.selectedItemIndex=this.filterResult.length-1}}if(t===d.DOWN_ARROW){this.removeHighlight(this.selectedItemIndex);this.selectedItemIndex++;if(this.selectedItemIndex>this.filterResult.length-1){this.selectedItemIndex=-1}}if(this.selectedItemIndex===-1){this.inputValue=this.originalSearch}else{const t=this.filterResult[this.selectedItemIndex];this.inputValue=t;this.addHighlight()}}getListItemId(t){return`${this.listId}-item-${t}`}render(){return i(s,{key:"9c58ee688918a293bda88a9cf0150214510f7bc0",onFocusout:t=>this.handleComponentFocusOut()},i("div",{key:"3144d016e0594a18e4dc6d473c32599fae8c01d3",class:"visually-hidden"},i("div",{key:"e6c3c437cb4e12158b8ea880ce21c7908b68a638",class:"results-status-a",role:"status","aria-atomic":"true","aria-live":"polite"},!this.isSilenced&&this.isAlternateStatusSection?this.statusText:""),i("div",{key:"c35e28c3de7e3fb97f9e0c8aab2d3a34f658000b",class:"results-status-b",role:"status","aria-atomic":"true","aria-live":"polite"},!this.isSilenced&&!this.isAlternateStatusSection?this.statusText:"")),i("admiralty-input",{key:"88c82941c54dbad9fea476dbd5ec8b0c88efc1b8",type:"text",ref:t=>this.inputControl=t,label:this.label,hint:this.hint,placeholder:this.placeholder,class:"filterTextInput",onKeyUp:t=>this.handleKeyPressed(t),onKeyDown:t=>this.handleKeyDown(t),onFocusin:t=>this.handleFocusIn(),onFocusout:t=>this.handleFocusOut(),"aria-expanded":this.isFocused&&this.filterResult.length>0}),i("span",{key:"3959c94636207a7fcefeabda1ab693f1aa0e2204",id:this.hintId,class:"visually-hidden"},"When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."),this.filterResult.length>0?i("div",{class:"typeahead-list-container",ref:t=>this.listContainer=t},i("ul",{class:"typeahead-list",id:this.listId,role:"listbox"},this.filterResult.map(((t,a)=>i("li",{id:this.getListItemId(a),onMouseDown:a=>this.handleItemSelected(t),onMouseOver:t=>this.handleItemHovered(a),"aria-selected":a===this.selectedItemIndex,role:"option",tabindex:"-1","aria-posinset":a+1,"aria-setsize":this.filterResult.length},t))))):null,i("slot",{key:"bf5408374f50291a4adfa81cd23b4346712bbd8a"}))}get el(){return h(this)}};let r=0;o.style=l;export{o as admiralty_type_ahead};
-//# sourceMappingURL=p-0c600251.entry.js.map
+import{r as t,c as a,f as e,h as i,H as s,g as h}from"./p-ac0ad15a.js";import{K as d}from"./p-a4bd6904.js";const n='@charset "UTF-8";.visually-hidden.sc-admiralty-type-ahead: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-type-ahead{display:none}}@media (min-width: 1024px){.not-desktop.sc-admiralty-type-ahead{display:none}}@media (min-width: 1024px){.tablet-only.sc-admiralty-type-ahead{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-only.sc-admiralty-type-ahead{display:none}}@media (max-width: 479px) and (min-width: 0px){.tablet-or-desktop.sc-admiralty-type-ahead{display:none}}@media (min-width: 1024px){.phone-or-tablet.sc-admiralty-type-ahead{display:none}}@media (min-width: 1024px){.phone-only.sc-admiralty-type-ahead{display:none}}@media (max-width: 1023px) and (min-width: 480px){.phone-only.sc-admiralty-type-ahead{display:none}}*.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;font-size:18px;line-height:24px;font-weight:300;color:#333333}@media (max-width: 1023px){*.sc-admiralty-type-ahead{font-size:16px}}a.sc-admiralty-type-ahead{color:#09315b}a.sc-admiralty-type-ahead:focus{outline:3px solid #ffdd00;outline-offset:1px}h1.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:48px;line-height:60px;margin:0 0 30px 0}@media (max-width: 1023px){h1.sc-admiralty-type-ahead{font-size:46px;line-height:54px}}h2.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:36px;line-height:48px;margin-bottom:18px}@media (max-width: 1023px){h2.sc-admiralty-type-ahead{font-size:34px;line-height:42px}}h3.sc-admiralty-type-ahead,h4.sc-admiralty-type-ahead,h5.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:21px;line-height:30px;margin-bottom:12px}@media (max-width: 1023px){h3.sc-admiralty-type-ahead,h4.sc-admiralty-type-ahead,h5.sc-admiralty-type-ahead{font-size:20px;line-height:30px}}h6.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;color:#09315b;font-weight:normal;font-size:18px;line-height:24px;margin-bottom:12px}@media (max-width: 1023px){h6.sc-admiralty-type-ahead{font-size:16px}}p.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;margin-bottom:30px}.intro.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;font-size:28px;line-height:36px;margin-bottom:30px}@media (max-width: 1023px){.intro.sc-admiralty-type-ahead{font-size:26px}}.small.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;font-size:16px}@media (max-width: 1023px){.small.sc-admiralty-type-ahead{font-size:14px;line-height:22px}}blockquote.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;line-height:30px;width:100%;padding:24px 18px;border-left:5px solid #09315b;margin-bottom:30px;background:#eeeeee}@media (max-width: 1023px){blockquote.sc-admiralty-type-ahead{line-height:24px}}ul.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;list-style:none}ul.sc-admiralty-type-ahead a.sc-admiralty-type-ahead{font-weight:300}ul.sc-admiralty-type-ahead li.sc-admiralty-type-ahead{margin-bottom:12px}ul.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{content:"■";font-size:18px;color:#09315b;vertical-align:text-bottom;margin-right:12px}@media (max-width: 1023px){ul.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{font-size:8px}}ol.sc-admiralty-type-ahead{font-family:"JohnstonITC", Helvetica, sans-serif;list-style:none;counter-reset:li}ol.sc-admiralty-type-ahead a.sc-admiralty-type-ahead{font-weight:300}ol.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{content:counter(li) ".";color:#03284f;font-size:18px;margin-right:12px}ol.sc-admiralty-type-ahead li.sc-admiralty-type-ahead{counter-increment:li;margin-bottom:12px}.white-text.sc-admiralty-type-ahead *.sc-admiralty-type-ahead{color:#ffffff}*.sc-admiralty-type-ahead{margin:0px;padding:0px}.text-input-wrap.sc-admiralty-type-ahead{height:auto !important}.filterTextInput.sc-admiralty-type-ahead{width:100%}.typeahead-list-container.sc-admiralty-type-ahead{position:relative}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead{position:absolute;left:0px;top:-24px;background-color:#ffffff;width:100%;box-shadow:0px 4px 4px rgba(0, 0, 0, 0.25);border:2px solid #333333;border-top:none;box-sizing:border-box;max-height:180px;overflow-y:auto;z-index:1;list-style:none}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead li.sc-admiralty-type-ahead{cursor:pointer;transform:unset !important;padding:6px;min-height:24px;margin:0}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead li.sc-admiralty-type-ahead:before{content:none}.typeahead-list-container.sc-admiralty-type-ahead .typeahead-list.sc-admiralty-type-ahead li.highlighted.sc-admiralty-type-ahead{background-color:#09315b;color:#ffffff}';const o=n;const l=class{constructor(e){t(this,e);this.selectionChanged=a(this,"selectionChanged",7);this.valueChanged=a(this,"valueChanged",7);this._id=`admiralty-typeahead-${++r}`;this.hintId=`${this._id}-assistive-hint`;this.listId=`${this._id}-list`;this.filterList=[];this.selectedItemIndex=-1;this.isFocused=false;this.isSilenced=false;this.isAlternateStatusSection=false;this.originalSearch="";this.hasBeenFocusedAtLeastOnce=false;this.filterResult=new Array;this.value=undefined;this.label=undefined;this.hint=undefined;this.placeholder=undefined;this.resultsOnInitFocus=false}get inputValue(){return this.inputControl.value.toString()}set inputValue(t){this.inputControl.value=t}componentDidLoad(){if(this.value){this.inputValue=this.value}}connectedCallback(){this.mutation=new MutationObserver((()=>{this.populateFilterList();e(this)}));this.mutation.observe(this.el,{childList:true,subtree:true})}disconnectedCallback(){if(this.mutation){this.mutation.disconnect();this.mutation=undefined}}populateFilterList(){const t=this.el.querySelectorAll("admiralty-type-ahead-item");this.filterList=[];t.forEach((t=>{this.filterList.push(t.getAttribute("value"))}))}handleFocusIn(){if(this.resultsOnInitFocus&&!this.hasBeenFocusedAtLeastOnce){this.performFilter("");this.hasBeenFocusedAtLeastOnce=true}this.isFocused=true;this.isSilenced=false}handleFocusOut(){this.isFocused=false;this.statusText=null;this.isSilenced=true}textChanged(t){this.originalSearch=t;this.performFilter(t);this.isSilenced=false;this.valueChanged.emit(t)}handleKeyPressed(t){t.stopImmediatePropagation();if(t.key===d.UP_ARROW||t.key===d.DOWN_ARROW){this.navigateSuggestions(t.key);this.updateScroll()}else if(t.key!==d.ENTER){this.textChanged(this.inputValue);this.selectCurrentItem()}}handleKeyDown(t){t.stopImmediatePropagation();if(t.key===d.TAB||t.key===d.ENTER){this.selectCurrentItem()}}handleItemSelected(t){this.inputValue=t;this.textChanged(t);this.filterResult=new Array;this.selectionChanged.emit(t)}performFilter(t){const a=(t,a)=>{const e=t.filter((t=>a===null||a.length<1||t.toLowerCase().indexOf(a.toLowerCase())>-1));return e};this.filterResult=a(this.filterList,t);this.selectedItemIndex=-1}addHighlight(){if(this.selectedItemIndex>-1){const t=this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);t.classList.add("highlighted")}}removeHighlight(t){if(t>-1){const a=this.el.querySelector(`#${this.getListItemId(t)}`);a.classList.remove("highlighted")}}selectCurrentItem(){if(this.selectedItemIndex>=0){const t=this.filterResult[this.selectedItemIndex];this.handleItemSelected(t)}}handleItemHovered(t){this.removeHighlight(this.selectedItemIndex);this.selectedItemIndex=t;this.addHighlight()}handleComponentFocusOut(){var t;if(((t=this.filterResult)===null||t===void 0?void 0:t.length)>0){this.filterResult=new Array;this.hasBeenFocusedAtLeastOnce=false}}updateScroll(){const t=this.listContainer;const a=t.querySelector("ul");const e=Array.from(a.childNodes).find((t=>t.ariaPosInSet===`${this.selectedItemIndex+1}`));if(t&&e&&t.scrollHeight+t.clientHeight){e.scrollIntoView()}}navigateSuggestions(t){if(t===d.UP_ARROW){this.removeHighlight(this.selectedItemIndex);this.selectedItemIndex--;if(this.selectedItemIndex===-2){this.selectedItemIndex=this.filterResult.length-1}}if(t===d.DOWN_ARROW){this.removeHighlight(this.selectedItemIndex);this.selectedItemIndex++;if(this.selectedItemIndex>this.filterResult.length-1){this.selectedItemIndex=-1}}if(this.selectedItemIndex===-1){this.inputValue=this.originalSearch}else{const t=this.filterResult[this.selectedItemIndex];this.inputValue=t;this.addHighlight()}}getListItemId(t){return`${this.listId}-item-${t}`}render(){return i(s,{key:"1b207cbc8db3ecc8f56bd37e0a4dd6467760e9f3",onFocusout:t=>this.handleComponentFocusOut()},i("div",{key:"35f64ad887609c0bfb61b2f14bb45e6ae4ea3b11",class:"visually-hidden"},i("div",{key:"05a99b1fa37ae53f40f609a4b26b7ba35926cbae",class:"results-status-a",role:"status","aria-atomic":"true","aria-live":"polite"},!this.isSilenced&&this.isAlternateStatusSection?this.statusText:""),i("div",{key:"560d3c5b1d383cf6055c29bd5ca44a8bd320c30e",class:"results-status-b",role:"status","aria-atomic":"true","aria-live":"polite"},!this.isSilenced&&!this.isAlternateStatusSection?this.statusText:"")),i("admiralty-input",{key:"3adc22e97d4c0c301806294ebf0636c71fddf120",type:"text",ref:t=>this.inputControl=t,label:this.label,hint:this.hint,placeholder:this.placeholder,class:"filterTextInput",onKeyUp:t=>this.handleKeyPressed(t),onKeyDown:t=>this.handleKeyDown(t),onFocusin:t=>this.handleFocusIn(),onFocusout:t=>this.handleFocusOut(),"aria-expanded":this.isFocused&&this.filterResult.length>0}),i("span",{key:"996c387351a79a8b39df0cf3e1bacb18c190d03b",id:this.hintId,class:"visually-hidden"},"When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."),this.filterResult.length>0?i("div",{class:"typeahead-list-container",ref:t=>this.listContainer=t},i("ul",{class:"typeahead-list",id:this.listId,role:"listbox"},this.filterResult.map(((t,a)=>i("li",{id:this.getListItemId(a),onMouseDown:a=>this.handleItemSelected(t),onMouseOver:t=>this.handleItemHovered(a),"aria-selected":a===this.selectedItemIndex,role:"option",tabindex:"-1","aria-posinset":a+1,"aria-setsize":this.filterResult.length},t))))):null,i("slot",{key:"2fd643c3154d7ece80fd1d1fab1c2058e477a047"}))}get el(){return h(this)}};let r=0;l.style=o;export{l as admiralty_type_ahead};
+//# sourceMappingURL=p-6229741b.entry.js.map

package/dist/admiralty/p-6229741b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["typeAheadCss","AdmiraltyTypeAheadStyle0","TypeAheadComponent","this","_id","id","hintId","listId","filterList","selectedItemIndex","isFocused","isSilenced","isAlternateStatusSection","originalSearch","hasBeenFocusedAtLeastOnce","Array","inputValue","inputControl","value","toString","componentDidLoad","connectedCallback","mutation","MutationObserver","populateFilterList","forceUpdate","observe","el","childList","subtree","disconnectedCallback","disconnect","undefined","slotItems","querySelectorAll","forEach","push","getAttribute","handleFocusIn","resultsOnInitFocus","performFilter","handleFocusOut","statusText","textChanged","valueChanged","emit","handleKeyPressed","event","stopImmediatePropagation","key","Keys","UP_ARROW","DOWN_ARROW","navigateSuggestions","updateScroll","ENTER","selectCurrentItem","handleKeyDown","TAB","handleItemSelected","filterResult","selectionChanged","filter","text","length","toLowerCase","indexOf","addHighlight","listItem","querySelector","getListItemId","classList","add","removeHighlight","i","remove","selectedItemText","handleItemHovered","index","handleComponentFocusOut","_a","container","listContainer","ul","selectedItem","from","childNodes","find","item","ariaPosInSet","scrollHeight","clientHeight","scrollIntoView","render","h","Host","onFocusout","_ev","class","role","type","ref","label","hint","placeholder","onKeyUp","ev","onKeyDown","onFocusin","map","onMouseDown","onMouseOver","tabindex"],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"mappings":"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"}

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

@@ -19,7 +19,7 @@ const HintComponent = class {
 };
 HintComponent.style = AdmiraltyHintStyle0;
 
-const inputInvalidCss = ".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";
+const inputInvalidCss = ".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d;margin:4px 0}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";
 const AdmiraltyInputInvalidStyle0 = inputInvalidCss;
 
 const InputInvalidComponent = class {

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

@@ -1 +1 @@
-{"file":"admiralty-hint.admiralty-input-invalid.admiralty-label.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,OAAO,GAAG,8HAA8H,CAAC;AAC/I,4BAAe,OAAO;;MCUT,aAAa;;;;;IAMxB,MAAM;QACJ,QACEA,gEAAG,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IACnCA,oEAAa,CACX,EACJ;KACH;;;;ACvBH,MAAM,eAAe,GAAG,4KAA4K,CAAC;AACrM,oCAAe,eAAe;;MCWjB,qBAAqB;;;;IAChC,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,0FAA2BE,qBAAa,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAkB,EACvFF,kEACEA,oEAAa,CACX,CACC,EACP;KACH;;;;ACtBH,MAAM,QAAQ,GAAG,qIAAqI,CAAC;AACvJ,6BAAe,QAAQ;;MCUV,cAAc;;;;;;IAWzB,MAAM;QACJ,QACEA,oEAAO,OAAO,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAC1DA,oEAAa,CACP,EACR;KACH;;;;;;;;","names":["h","Host","faExclamation"],"sources":["src/components/hint/hint.scss?tag=admiralty-hint&encapsulation=scoped","src/components/hint/hint.tsx","src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx","src/components/label/label.scss?tag=admiralty-label&encapsulation=scoped","src/components/label/label.tsx"],"sourcesContent":["@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\np {\n  margin-top: 0;\n  margin-bottom: 6px;\n  display: block;\n  font-weight: typography.$font-weight-light;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  scoped: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n","@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n","@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\nlabel {\n  margin-bottom: 6px;\n  display: inline-block;\n  font-weight: typography.$font-weight-medium;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The label content should be placed in the slot e.g.\n * `<admiralty-label>First Name</admiralty-label>`\n */\n@Component({\n  tag: 'admiralty-label',\n  styleUrl: 'label.scss',\n  scoped: true,\n})\nexport class LabelComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * The id of the input the label is attached to\n   */\n  @Prop() for: string;\n\n  render() {\n    return (\n      <label htmlFor={this.for} class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-hint.admiralty-input-invalid.admiralty-label.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,OAAO,GAAG,8HAA8H,CAAC;AAC/I,4BAAe,OAAO;;MCUT,aAAa;;;;;IAMxB,MAAM;QACJ,QACEA,gEAAG,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IACnCA,oEAAa,CACX,EACJ;KACH;;;;ACvBH,MAAM,eAAe,GAAG,yLAAyL,CAAC;AAClN,oCAAe,eAAe;;MCWjB,qBAAqB;;;;IAChC,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,0FAA2BE,qBAAa,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAkB,EACvFF,kEACEA,oEAAa,CACX,CACC,EACP;KACH;;;;ACtBH,MAAM,QAAQ,GAAG,qIAAqI,CAAC;AACvJ,6BAAe,QAAQ;;MCUV,cAAc;;;;;;IAWzB,MAAM;QACJ,QACEA,oEAAO,OAAO,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAC1DA,oEAAa,CACP,EACR;KACH;;;;;;;;","names":["h","Host","faExclamation"],"sources":["src/components/hint/hint.scss?tag=admiralty-hint&encapsulation=scoped","src/components/hint/hint.tsx","src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx","src/components/label/label.scss?tag=admiralty-label&encapsulation=scoped","src/components/label/label.tsx"],"sourcesContent":["@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\np {\n  margin-top: 0;\n  margin-bottom: 6px;\n  display: block;\n  font-weight: typography.$font-weight-light;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  scoped: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n","@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n  margin: 4px 0;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n","@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\nlabel {\n  margin-bottom: 6px;\n  display: inline-block;\n  font-weight: typography.$font-weight-medium;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The label content should be placed in the slot e.g.\n * `<admiralty-label>First Name</admiralty-label>`\n */\n@Component({\n  tag: 'admiralty-label',\n  styleUrl: 'label.scss',\n  scoped: true,\n})\nexport class LabelComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * The id of the input the label is attached to\n   */\n  @Prop() for: string;\n\n  render() {\n    return (\n      <label htmlFor={this.for} class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/admiralty-type-ahead.cjs.entry.js

@@ -62,7 +62,6 @@ const TypeAheadComponent = class {
         this.filterList = [];
         slotItems.forEach(el => {
             this.filterList.push(el.getAttribute('value'));
-            console.log('fliterlist value ', el.getAttribute('value'));
         });
     }
     handleFocusIn() {
@@ -187,7 +186,7 @@ const TypeAheadComponent = class {
         return `${this.listId}-item-${i}`;
     }
     render() {
-        return (index.h(index.Host, { key: '9c58ee688918a293bda88a9cf0150214510f7bc0', onFocusout: _ev => this.handleComponentFocusOut() }, index.h("div", { key: '3144d016e0594a18e4dc6d473c32599fae8c01d3', class: "visually-hidden" }, index.h("div", { key: 'e6c3c437cb4e12158b8ea880ce21c7908b68a638', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), index.h("div", { key: 'c35e28c3de7e3fb97f9e0c8aab2d3a34f658000b', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), index.h("admiralty-input", { key: '88c82941c54dbad9fea476dbd5ec8b0c88efc1b8', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), index.h("span", { key: '3959c94636207a7fcefeabda1ab693f1aa0e2204', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (index.h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, index.h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (index.h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, index.h("slot", { key: 'bf5408374f50291a4adfa81cd23b4346712bbd8a' })));
+        return (index.h(index.Host, { key: '1b207cbc8db3ecc8f56bd37e0a4dd6467760e9f3', onFocusout: _ev => this.handleComponentFocusOut() }, index.h("div", { key: '35f64ad887609c0bfb61b2f14bb45e6ae4ea3b11', class: "visually-hidden" }, index.h("div", { key: '05a99b1fa37ae53f40f609a4b26b7ba35926cbae', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), index.h("div", { key: '560d3c5b1d383cf6055c29bd5ca44a8bd320c30e', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), index.h("admiralty-input", { key: '3adc22e97d4c0c301806294ebf0636c71fddf120', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), index.h("span", { key: '996c387351a79a8b39df0cf3e1bacb18c190d03b', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (index.h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, index.h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (index.h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, index.h("slot", { key: '2fd643c3154d7ece80fd1d1fab1c2058e477a047' })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/admiralty-type-ahead.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-type-ahead.entry.cjs.js","mappings":"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","names":["forceUpdate","Keys","h","Host"],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n      console.log('fliterlist value ', el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"version":3}
+{"file":"admiralty-type-ahead.entry.cjs.js","mappings":"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","names":["forceUpdate","Keys","h","Host"],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"version":3}

package/dist/collection/components/input-invalid/input-invalid.css

@@ -22,6 +22,7 @@
 
 admiralty-icon {
   color: #e20d0d;
+  margin: 4px 0;
 }
 
 p {

package/dist/collection/components/type-ahead/type-ahead.js

@@ -51,7 +51,6 @@ export class TypeAheadComponent {
         this.filterList = [];
         slotItems.forEach(el => {
             this.filterList.push(el.getAttribute('value'));
-            console.log('fliterlist value ', el.getAttribute('value'));
         });
     }
     handleFocusIn() {
@@ -176,7 +175,7 @@ export class TypeAheadComponent {
         return `${this.listId}-item-${i}`;
     }
     render() {
-        return (h(Host, { key: '9c58ee688918a293bda88a9cf0150214510f7bc0', onFocusout: _ev => this.handleComponentFocusOut() }, h("div", { key: '3144d016e0594a18e4dc6d473c32599fae8c01d3', class: "visually-hidden" }, h("div", { key: 'e6c3c437cb4e12158b8ea880ce21c7908b68a638', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), h("div", { key: 'c35e28c3de7e3fb97f9e0c8aab2d3a34f658000b', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), h("admiralty-input", { key: '88c82941c54dbad9fea476dbd5ec8b0c88efc1b8', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), h("span", { key: '3959c94636207a7fcefeabda1ab693f1aa0e2204', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, h("slot", { key: 'bf5408374f50291a4adfa81cd23b4346712bbd8a' })));
+        return (h(Host, { key: '1b207cbc8db3ecc8f56bd37e0a4dd6467760e9f3', onFocusout: _ev => this.handleComponentFocusOut() }, h("div", { key: '35f64ad887609c0bfb61b2f14bb45e6ae4ea3b11', class: "visually-hidden" }, h("div", { key: '05a99b1fa37ae53f40f609a4b26b7ba35926cbae', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), h("div", { key: '560d3c5b1d383cf6055c29bd5ca44a8bd320c30e', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), h("admiralty-input", { key: '3adc22e97d4c0c301806294ebf0636c71fddf120', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), h("span", { key: '996c387351a79a8b39df0cf3e1bacb18c190d03b', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, h("slot", { key: '2fd643c3154d7ece80fd1d1fab1c2058e477a047' })));
     }
     static get is() { return "admiralty-type-ahead"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/type-ahead/type-ahead.js.map

@@ -1 +1 @@
-{"version":3,"file":"type-ahead.js","sourceRoot":"","sources":["../../../src/components/type-ahead/type-ahead.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n      console.log('fliterlist value ', el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"]}
+{"version":3,"file":"type-ahead.js","sourceRoot":"","sources":["../../../src/components/type-ahead/type-ahead.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"]}

package/dist/components/admiralty-type-ahead.js

@@ -64,7 +64,6 @@ const TypeAheadComponent = /*@__PURE__*/ proxyCustomElement(class TypeAheadCompo
         this.filterList = [];
         slotItems.forEach(el => {
             this.filterList.push(el.getAttribute('value'));
-            console.log('fliterlist value ', el.getAttribute('value'));
         });
     }
     handleFocusIn() {
@@ -189,7 +188,7 @@ const TypeAheadComponent = /*@__PURE__*/ proxyCustomElement(class TypeAheadCompo
         return `${this.listId}-item-${i}`;
     }
     render() {
-        return (h(Host, { key: '9c58ee688918a293bda88a9cf0150214510f7bc0', onFocusout: _ev => this.handleComponentFocusOut() }, h("div", { key: '3144d016e0594a18e4dc6d473c32599fae8c01d3', class: "visually-hidden" }, h("div", { key: 'e6c3c437cb4e12158b8ea880ce21c7908b68a638', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), h("div", { key: 'c35e28c3de7e3fb97f9e0c8aab2d3a34f658000b', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), h("admiralty-input", { key: '88c82941c54dbad9fea476dbd5ec8b0c88efc1b8', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), h("span", { key: '3959c94636207a7fcefeabda1ab693f1aa0e2204', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, h("slot", { key: 'bf5408374f50291a4adfa81cd23b4346712bbd8a' })));
+        return (h(Host, { key: '1b207cbc8db3ecc8f56bd37e0a4dd6467760e9f3', onFocusout: _ev => this.handleComponentFocusOut() }, h("div", { key: '35f64ad887609c0bfb61b2f14bb45e6ae4ea3b11', class: "visually-hidden" }, h("div", { key: '05a99b1fa37ae53f40f609a4b26b7ba35926cbae', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), h("div", { key: '560d3c5b1d383cf6055c29bd5ca44a8bd320c30e', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), h("admiralty-input", { key: '3adc22e97d4c0c301806294ebf0636c71fddf120', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), h("span", { key: '996c387351a79a8b39df0cf3e1bacb18c190d03b', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, h("slot", { key: '2fd643c3154d7ece80fd1d1fab1c2058e477a047' })));
     }
     get el() { return this; }
     static get style() { return AdmiraltyTypeAheadStyle0; }

package/dist/components/admiralty-type-ahead.js.map

@@ -1 +1 @@
-{"file":"admiralty-type-ahead.js","mappings":"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","names":[],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n      console.log('fliterlist value ', el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"version":3}
+{"file":"admiralty-type-ahead.js","mappings":"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","names":[],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"version":3}

package/dist/components/input-invalid.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { f as faExclamation, d as defineCustomElement$1 } from './icon.js';
 
-const inputInvalidCss = ".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";
+const inputInvalidCss = ".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d;margin:4px 0}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";
 const AdmiraltyInputInvalidStyle0 = inputInvalidCss;
 
 const InputInvalidComponent = /*@__PURE__*/ proxyCustomElement(class InputInvalidComponent extends HTMLElement {

package/dist/components/input-invalid.js.map

@@ -1 +1 @@
-{"file":"input-invalid.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,4KAA4K,CAAC;AACrM,oCAAe,eAAe;;MCWjB,qBAAqB;;;;;IAChC,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,oFAA2B,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAkB,EACvF,4DACE,8DAAa,CACX,CACC,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"input-invalid.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,yLAAyL,CAAC;AAClN,oCAAe,eAAe;;MCWjB,qBAAqB;;;;;IAChC,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,oFAA2B,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAkB,EACvF,4DACE,8DAAa,CACX,CACC,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n  margin: 4px 0;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/admiralty-hint_3.entry.js

@@ -15,7 +15,7 @@ const HintComponent = class {
 };
 HintComponent.style = AdmiraltyHintStyle0;
 
-const inputInvalidCss = ".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";
+const inputInvalidCss = ".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d;margin:4px 0}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";
 const AdmiraltyInputInvalidStyle0 = inputInvalidCss;
 
 const InputInvalidComponent = class {

package/dist/esm/admiralty-hint_3.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-hint.admiralty-input-invalid.admiralty-label.entry.js","mappings":";;;AAAA,MAAM,OAAO,GAAG,8HAA8H,CAAC;AAC/I,4BAAe,OAAO;;MCUT,aAAa;;;;;IAMxB,MAAM;QACJ,QACE,0DAAG,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IACnC,8DAAa,CACX,EACJ;KACH;;;;ACvBH,MAAM,eAAe,GAAG,4KAA4K,CAAC;AACrM,oCAAe,eAAe;;MCWjB,qBAAqB;;;;IAChC,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,oFAA2B,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAkB,EACvF,4DACE,8DAAa,CACX,CACC,EACP;KACH;;;;ACtBH,MAAM,QAAQ,GAAG,qIAAqI,CAAC;AACvJ,6BAAe,QAAQ;;MCUV,cAAc;;;;;;IAWzB,MAAM;QACJ,QACE,8DAAO,OAAO,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAC1D,8DAAa,CACP,EACR;KACH;;;;;;","names":[],"sources":["src/components/hint/hint.scss?tag=admiralty-hint&encapsulation=scoped","src/components/hint/hint.tsx","src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx","src/components/label/label.scss?tag=admiralty-label&encapsulation=scoped","src/components/label/label.tsx"],"sourcesContent":["@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\np {\n  margin-top: 0;\n  margin-bottom: 6px;\n  display: block;\n  font-weight: typography.$font-weight-light;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  scoped: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n","@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n","@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\nlabel {\n  margin-bottom: 6px;\n  display: inline-block;\n  font-weight: typography.$font-weight-medium;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The label content should be placed in the slot e.g.\n * `<admiralty-label>First Name</admiralty-label>`\n */\n@Component({\n  tag: 'admiralty-label',\n  styleUrl: 'label.scss',\n  scoped: true,\n})\nexport class LabelComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * The id of the input the label is attached to\n   */\n  @Prop() for: string;\n\n  render() {\n    return (\n      <label htmlFor={this.for} class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"version":3}
+{"file":"admiralty-hint.admiralty-input-invalid.admiralty-label.entry.js","mappings":";;;AAAA,MAAM,OAAO,GAAG,8HAA8H,CAAC;AAC/I,4BAAe,OAAO;;MCUT,aAAa;;;;;IAMxB,MAAM;QACJ,QACE,0DAAG,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IACnC,8DAAa,CACX,EACJ;KACH;;;;ACvBH,MAAM,eAAe,GAAG,yLAAyL,CAAC;AAClN,oCAAe,eAAe;;MCWjB,qBAAqB;;;;IAChC,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,oFAA2B,aAAa,CAAC,QAAQ,EAAE,KAAK,EAAC,YAAY,GAAkB,EACvF,4DACE,8DAAa,CACX,CACC,EACP;KACH;;;;ACtBH,MAAM,QAAQ,GAAG,qIAAqI,CAAC;AACvJ,6BAAe,QAAQ;;MCUV,cAAc;;;;;;IAWzB,MAAM;QACJ,QACE,8DAAO,OAAO,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,IAC1D,8DAAa,CACP,EACR;KACH;;;;;;","names":[],"sources":["src/components/hint/hint.scss?tag=admiralty-hint&encapsulation=scoped","src/components/hint/hint.tsx","src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx","src/components/label/label.scss?tag=admiralty-label&encapsulation=scoped","src/components/label/label.tsx"],"sourcesContent":["@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\np {\n  margin-top: 0;\n  margin-bottom: 6px;\n  display: block;\n  font-weight: typography.$font-weight-light;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  scoped: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n","@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n  margin: 4px 0;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n","@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\nlabel {\n  margin-bottom: 6px;\n  display: inline-block;\n  font-weight: typography.$font-weight-medium;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The label content should be placed in the slot e.g.\n * `<admiralty-label>First Name</admiralty-label>`\n */\n@Component({\n  tag: 'admiralty-label',\n  styleUrl: 'label.scss',\n  scoped: true,\n})\nexport class LabelComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * The id of the input the label is attached to\n   */\n  @Prop() for: string;\n\n  render() {\n    return (\n      <label htmlFor={this.for} class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"version":3}

package/dist/esm/admiralty-type-ahead.entry.js

@@ -58,7 +58,6 @@ const TypeAheadComponent = class {
         this.filterList = [];
         slotItems.forEach(el => {
             this.filterList.push(el.getAttribute('value'));
-            console.log('fliterlist value ', el.getAttribute('value'));
         });
     }
     handleFocusIn() {
@@ -183,7 +182,7 @@ const TypeAheadComponent = class {
         return `${this.listId}-item-${i}`;
     }
     render() {
-        return (h(Host, { key: '9c58ee688918a293bda88a9cf0150214510f7bc0', onFocusout: _ev => this.handleComponentFocusOut() }, h("div", { key: '3144d016e0594a18e4dc6d473c32599fae8c01d3', class: "visually-hidden" }, h("div", { key: 'e6c3c437cb4e12158b8ea880ce21c7908b68a638', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), h("div", { key: 'c35e28c3de7e3fb97f9e0c8aab2d3a34f658000b', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), h("admiralty-input", { key: '88c82941c54dbad9fea476dbd5ec8b0c88efc1b8', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), h("span", { key: '3959c94636207a7fcefeabda1ab693f1aa0e2204', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, h("slot", { key: 'bf5408374f50291a4adfa81cd23b4346712bbd8a' })));
+        return (h(Host, { key: '1b207cbc8db3ecc8f56bd37e0a4dd6467760e9f3', onFocusout: _ev => this.handleComponentFocusOut() }, h("div", { key: '35f64ad887609c0bfb61b2f14bb45e6ae4ea3b11', class: "visually-hidden" }, h("div", { key: '05a99b1fa37ae53f40f609a4b26b7ba35926cbae', class: "results-status-a", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''), h("div", { key: '560d3c5b1d383cf6055c29bd5ca44a8bd320c30e', class: "results-status-b", role: "status", "aria-atomic": "true", "aria-live": "polite" }, !this.isSilenced && !this.isAlternateStatusSection ? this.statusText : '')), h("admiralty-input", { key: '3adc22e97d4c0c301806294ebf0636c71fddf120', type: "text", ref: el => (this.inputControl = el), label: this.label, hint: this.hint, placeholder: this.placeholder, class: "filterTextInput", onKeyUp: ev => this.handleKeyPressed(ev), onKeyDown: ev => this.handleKeyDown(ev), onFocusin: _ev => this.handleFocusIn(), onFocusout: _ev => this.handleFocusOut(), "aria-expanded": this.isFocused && this.filterResult.length > 0 }), h("span", { key: '996c387351a79a8b39df0cf3e1bacb18c190d03b', id: this.hintId, class: "visually-hidden" }, "When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures."), this.filterResult.length > 0 ? (h("div", { class: "typeahead-list-container", ref: el => (this.listContainer = el) }, h("ul", { class: "typeahead-list", id: this.listId, role: "listbox" }, this.filterResult.map((item, i) => (h("li", { id: this.getListItemId(i), onMouseDown: _ev => this.handleItemSelected(item), onMouseOver: _ev => this.handleItemHovered(i), "aria-selected": i === this.selectedItemIndex, role: "option", tabindex: "-1", "aria-posinset": i + 1, "aria-setsize": this.filterResult.length }, item)))))) : null, h("slot", { key: '2fd643c3154d7ece80fd1d1fab1c2058e477a047' })));
     }
     get el() { return getElement(this); }
 };

package/dist/esm/admiralty-type-ahead.entry.js.map

@@ -1 +1 @@
-{"file":"admiralty-type-ahead.entry.js","mappings":";;;AAAA,MAAM,YAAY,GAAG,2qKAA2qK,CAAC;AACjsK,iCAAe,YAAY;;MCOd,kBAAkB;;;;;QACrB,QAAG,GAAG,uBAAuB,EAAE,EAAE,EAAE,CAAC;QAE5C,WAAM,GAAG,GAAG,IAAI,CAAC,GAAG,iBAAiB,CAAC;QACtC,WAAM,GAAG,GAAG,IAAI,CAAC,GAAG,OAAO,CAAC;QAS5B,eAAU,GAAkB,EAAE,CAAC;QAE/B,sBAAiB,GAAG,CAAC,CAAC,CAAC;QACvB,cAAS,GAAG,KAAK,CAAC;QAElB,eAAU,GAAG,KAAK,CAAC;QACnB,6BAAwB,GAAG,KAAK,CAAC;QAKzB,mBAAc,GAAG,EAAE,CAAC;QACpB,8BAAyB,GAAG,KAAK,CAAC;4BAdR,IAAI,KAAK,EAAU;;;;;kCA+Cf,KAAK;;IA/B3C,IAAY,UAAU;QACpB,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC;KAC3C;IAED,IAAY,UAAU,CAAC,KAAa;QAClC,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,KAAK,CAAC;KACjC;IAsCD,gBAAgB;QACd,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC;SAC9B;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,QAAQ,GAAG,IAAI,gBAAgB,CAAC;YACnC,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC1B,WAAW,CAAC,IAAI,CAAC,CAAC;SACnB,CAAC,CAAC;QACH,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;YAC7B,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;SACd,CAAC,CAAC;KACJ;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;YAC3B,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;SAC3B;KACF;IAED,kBAAkB;QAChB,MAAM,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,2BAA2B,CAAC,CAAC;QACxE,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QACrB,SAAS,CAAC,OAAO,CAAC,EAAE;YAClB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;YAC/C,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC;SAC5D,CAAC,CAAC;KACJ;IAED,aAAa;QACX,IAAI,IAAI,CAAC,kBAAkB,IAAI,CAAC,IAAI,CAAC,yBAAyB,EAAE;YAC9D,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC;YACvB,IAAI,CAAC,yBAAyB,GAAG,IAAI,CAAC;SACvC;QAED,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;KACzB;IAED,cAAc;QACZ,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;KACxB;IAEO,WAAW,CAAC,KAAa;QAC/B,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC1B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC/B;IAED,gBAAgB,CAAC,KAAoB;QACnC,KAAK,CAAC,wBAAwB,EAAE,CAAC;QAEjC,IAAI,KAAK,CAAC,GAAG,KAAK,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,GAAG,KAAK,IAAI,CAAC,UAAU,EAAE;YAChE,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YACpC,IAAI,CAAC,YAAY,EAAE,CAAC;SACrB;aAAM,IAAI,KAAK,CAAC,GAAG,KAAK,IAAI,CAAC,KAAK,EAAE;YACnC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YAClC,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC1B;KACF;IAED,aAAa,CAAC,KAAoB;QAChC,KAAK,CAAC,wBAAwB,EAAE,CAAC;QAEjC,IAAI,KAAK,CAAC,GAAG,KAAK,IAAI,CAAC,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,IAAI,CAAC,KAAK,EAAE;YACtD,IAAI,CAAC,iBAAiB,EAAE,CAAC;SAC1B;KACF;IAED,kBAAkB,CAAC,KAAa;QAC9B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACxB,IAAI,CAAC,YAAY,GAAG,IAAI,KAAK,EAAU,CAAC;QACxC,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KACnC;IAEO,aAAa,CAAC,KAAa;QACjC,MAAM,MAAM,GAAG,CAAC,UAAoB,EAAE,IAAY;YAChD,MAAM,YAAY,GAAG,UAAU,CAAC,MAAM,CAAC,KAAK;gBAC1C,OAAO,IAAI,KAAK,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;aACjG,CAAC,CAAC;YACH,OAAO,YAAY,CAAC;SACrB,CAAC;QAEF,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;QAEnD,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC;KAC7B;IAEO,YAAY;QAClB,IAAI,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,EAAE;YAC/B,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAAC;YACzF,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;SACvC;KACF;IAEO,eAAe,CAAC,CAAS;QAC/B,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE;YACV,MAAM,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;YACpE,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;SAC1C;KACF;IAEO,iBAAiB;QACvB,IAAI,IAAI,CAAC,iBAAiB,IAAI,CAAC,EAAE;YAC/B,MAAM,gBAAgB,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;YACnE,IAAI,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;SAC3C;KACF;IAED,iBAAiB,CAAC,KAAa;QAC7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAC7C,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC;QAC/B,IAAI,CAAC,YAAY,EAAE,CAAC;KACrB;IAED,uBAAuB;;;QAErB,IAAI,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,MAAM,IAAG,CAAC,EAAE;YACjC,IAAI,CAAC,YAAY,GAAG,IAAI,KAAK,EAAU,CAAC;YACxC,IAAI,CAAC,yBAAyB,GAAG,KAAK,CAAC;SACxC;KACF;;;;IAKO,YAAY;QAClB,MAAM,SAAS,GAAG,IAAI,CAAC,aAAa,CAAC;QAErC,MAAM,EAAE,GAAG,SAAS,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;QACzC,MAAM,YAAY,GAAQ,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,CAAC,IAAS,KAAK,IAAI,CAAC,YAAY,KAAK,GAAG,IAAI,CAAC,iBAAiB,GAAG,CAAC,EAAE,CAAC,CAAC;QAE/H,IAAI,SAAS,IAAI,YAAY,IAAI,SAAS,CAAC,YAAY,GAAG,SAAS,CAAC,YAAY,EAAE;YAChF,YAAY,CAAC,cAAc,EAAE,CAAC;SAC/B;KACF;IAEO,mBAAmB,CAAC,GAAS;QACnC,IAAI,GAAG,KAAK,IAAI,CAAC,QAAQ,EAAE;YACzB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAC7C,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,IAAI,CAAC,iBAAiB,KAAK,CAAC,CAAC,EAAE;gBACjC,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC;aACvD;SACF;QACD,IAAI,GAAG,KAAK,IAAI,CAAC,UAAU,EAAE;YAC3B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAC7C,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,IAAI,CAAC,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,EAAE;gBACzD,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,CAAC;aAC7B;SACF;QACD,IAAI,IAAI,CAAC,iBAAiB,KAAK,CAAC,CAAC,EAAE;YACjC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC;SACvC;aAAM;YACL,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAExD,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YAExB,IAAI,CAAC,YAAY,EAAE,CAAC;SACrB;KACF;IAEO,aAAa,CAAC,CAAS;QAC7B,OAAO,GAAG,IAAI,CAAC,MAAM,SAAS,CAAC,EAAE,CAAC;KACnC;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,UAAU,EAAE,GAAG,IAAI,IAAI,CAAC,uBAAuB,EAAE,IACrD,4DAAK,KAAK,EAAC,iBAAiB,IAC1B,4DAAK,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,iBAAa,MAAM,eAAW,QAAQ,IAC9E,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,UAAU,GAAG,EAAE,CACrE,EACN,4DAAK,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,iBAAa,MAAM,eAAW,QAAQ,IAC9E,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,wBAAwB,GAAG,IAAI,CAAC,UAAU,GAAG,EAAE,CACtE,CACF,EACN,wEACE,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,YAAY,GAAG,EAAE,CAAC,EACnC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAC,iBAAiB,EACvB,OAAO,EAAE,EAAE,IAAI,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,EACxC,SAAS,EAAE,EAAE,IAAI,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,EACvC,SAAS,EAAE,GAAG,IAAI,IAAI,CAAC,aAAa,EAAE,EACtC,UAAU,EAAE,GAAG,IAAI,IAAI,CAAC,cAAc,EAAE,mBACzB,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,GAC5C,EAEnB,6DAAM,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAC,iBAAiB,iKAEvC,EACN,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,IAC3B,WAAK,KAAK,EAAC,0BAA0B,EAAC,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC,IACxE,UAAI,KAAK,EAAC,gBAAgB,EAAC,EAAE,EAAE,IAAI,CAAC,MAAM,EAAE,IAAI,EAAC,SAAS,IACvD,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,MAC7B,UACE,EAAE,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,EACzB,WAAW,EAAE,GAAG,IAAI,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,EACjD,WAAW,EAAE,GAAG,IAAI,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,mBAC9B,CAAC,KAAK,IAAI,CAAC,iBAAiB,EAC3C,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAC,IAAI,mBACE,CAAC,GAAG,CAAC,kBACN,IAAI,CAAC,YAAY,CAAC,MAAM,IAErC,IAAI,CACF,CACN,CAAC,CACC,CACD,IACJ,IAAI,EACR,8DAAa,CACR,EACP;KACH;;;AAGH,IAAI,EAAE,GAAG,CAAC,CAAC;;;;;","names":[],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n      console.log('fliterlist value ', el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"version":3}
+{"file":"admiralty-type-ahead.entry.js","mappings":"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","names":[],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"version":3}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukho/admiralty-core",
-  "version": "0.15.0",
+  "version": "0.16.0",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -70,5 +70,5 @@
   "license": "MIT",
   "url": "https://github.com/UKHO/admiralty-design-system",
   "repository": "git://github.com/UKHO/admiralty-design-system.git",
-  "gitHead": "f9877c858b6c00e28a73a729379ca5898940c188"
+  "gitHead": "0309fc4d50c588fdf7498b2405dae81ac0d217fb"
 }

package/dist/admiralty/p-0c600251.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["typeAheadCss","AdmiraltyTypeAheadStyle0","TypeAheadComponent","this","_id","id","hintId","listId","filterList","selectedItemIndex","isFocused","isSilenced","isAlternateStatusSection","originalSearch","hasBeenFocusedAtLeastOnce","Array","inputValue","inputControl","value","toString","componentDidLoad","connectedCallback","mutation","MutationObserver","populateFilterList","forceUpdate","observe","el","childList","subtree","disconnectedCallback","disconnect","undefined","slotItems","querySelectorAll","forEach","push","getAttribute","console","log","handleFocusIn","resultsOnInitFocus","performFilter","handleFocusOut","statusText","textChanged","valueChanged","emit","handleKeyPressed","event","stopImmediatePropagation","key","Keys","UP_ARROW","DOWN_ARROW","navigateSuggestions","updateScroll","ENTER","selectCurrentItem","handleKeyDown","TAB","handleItemSelected","filterResult","selectionChanged","filter","text","length","toLowerCase","indexOf","addHighlight","listItem","querySelector","getListItemId","classList","add","removeHighlight","i","remove","selectedItemText","handleItemHovered","index","handleComponentFocusOut","_a","container","listContainer","ul","selectedItem","from","childNodes","find","item","ariaPosInSet","scrollHeight","clientHeight","scrollIntoView","render","h","Host","onFocusout","_ev","class","role","type","ref","label","hint","placeholder","onKeyUp","ev","onKeyDown","onFocusin","map","onMouseDown","onMouseOver","tabindex"],"sources":["src/components/type-ahead/type-ahead.scss?tag=admiralty-type-ahead&encapsulation=scoped","src/components/type-ahead/type-ahead.tsx"],"sourcesContent":["@use '../../scss/vars/colours';\n@use '../../scss/base/a11y';\n@use '../../scss/base/typography';\n\n* {\n  margin: 0px;\n  padding: 0px;\n}\n\n.text-input-wrap {\n  height: auto !important;\n}\n\n.filterTextInput {\n  width: 100%;\n}\n\n.typeahead-list-container {\n  position: relative;\n\n  .typeahead-list {\n    position: absolute;\n    left: 0px;\n    top: -24px;\n    background-color: colours.$colour-white;\n    width: 100%;\n    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);\n    border: 2px solid colours.$colour-text;\n    border-top: none;\n    box-sizing: border-box;\n    max-height: 180px;\n    overflow-y: auto;\n    z-index: 1;\n    list-style: none;\n\n    li {\n      cursor: pointer;\n      transform: unset !important;\n      padding: 6px;\n      min-height: 24px;\n      margin: 0;\n    }\n\n    li:before {\n      content: none;\n    }\n\n    li.highlighted {\n      background-color: colours.$colour-admiralty-blue;\n      color: colours.$colour-white;\n    }\n  }\n}\n","import { Component, EventEmitter, Host, Prop, Event, h, State, Element, forceUpdate } from '@stencil/core';\nimport { Keys } from '../Keys';\n\n@Component({\n  tag: 'admiralty-type-ahead',\n  styleUrl: 'type-ahead.scss',\n  scoped: true,\n})\nexport class TypeAheadComponent {\n  private _id = `admiralty-typeahead-${++id}`;\n\n  hintId = `${this._id}-assistive-hint`;\n  listId = `${this._id}-list`;\n\n  @Element() el: HTMLElement;\n\n  listContainer!: HTMLDivElement;\n  inputControl!: HTMLAdmiraltyInputElement;\n\n  @State() filterResult: string[] = new Array<string>();\n\n  filterList: Array<string> = [];\n\n  selectedItemIndex = -1;\n  isFocused = false;\n\n  isSilenced = false;\n  isAlternateStatusSection = false;\n  statusText: string;\n\n  private mutation: MutationObserver;\n\n  private originalSearch = '';\n  private hasBeenFocusedAtLeastOnce = false;\n\n  private get inputValue() {\n    return this.inputControl.value.toString();\n  }\n\n  private set inputValue(value: string) {\n    this.inputControl.value = value;\n  }\n\n  /**\n   * The value of the textinput\n   */\n  @Prop() value: string;\n\n  /**\n   * The text content of the label for the input box\n   */\n  @Prop() label: string;\n\n  /**\n   * The hint which will be used under the label to describe the input.\n   */\n  @Prop() hint: string;\n\n  /**\n   * The placeholder text for the input field\n   */\n  @Prop() placeholder: string;\n\n  /**\n   * Optional property to show results when input box is initally focused\n   */\n  @Prop() resultsOnInitFocus: boolean = false;\n\n  /**\n   * Optional function that will be executed when the user selects an item from the typeahead\n   */\n  @Event() selectionChanged: EventEmitter<string>;\n\n  /**\n   * Event that is fired whenever the value of the typeahead changes\n   * e.g. selection from the dropdown or manually typed entry\n   */\n  @Event() valueChanged: EventEmitter<string>;\n\n  componentDidLoad() {\n    if (this.value) {\n      this.inputValue = this.value;\n    }\n  }\n\n  connectedCallback() {\n    this.mutation = new MutationObserver(() => {\n      this.populateFilterList();\n      forceUpdate(this);\n    });\n    this.mutation.observe(this.el, {\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this.mutation) {\n      this.mutation.disconnect();\n      this.mutation = undefined;\n    }\n  }\n\n  populateFilterList() {\n    const slotItems = this.el.querySelectorAll('admiralty-type-ahead-item');\n    this.filterList = [];\n    slotItems.forEach(el => {\n      this.filterList.push(el.getAttribute('value'));\n      console.log('fliterlist value ', el.getAttribute('value'));\n    });\n  }\n\n  handleFocusIn() {\n    if (this.resultsOnInitFocus && !this.hasBeenFocusedAtLeastOnce) {\n      this.performFilter('');\n      this.hasBeenFocusedAtLeastOnce = true;\n    }\n\n    this.isFocused = true;\n    this.isSilenced = false;\n  }\n\n  handleFocusOut() {\n    this.isFocused = false;\n    this.statusText = null;\n    this.isSilenced = true;\n  }\n\n  private textChanged(value: string): void {\n    this.originalSearch = value;\n    this.performFilter(value);\n    this.isSilenced = false;\n    this.valueChanged.emit(value);\n  }\n\n  handleKeyPressed(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.UP_ARROW || event.key === Keys.DOWN_ARROW) {\n      this.navigateSuggestions(event.key);\n      this.updateScroll();\n    } else if (event.key !== Keys.ENTER) {\n      this.textChanged(this.inputValue);\n      this.selectCurrentItem();\n    }\n  }\n\n  handleKeyDown(event: KeyboardEvent): void {\n    event.stopImmediatePropagation();\n\n    if (event.key === Keys.TAB || event.key === Keys.ENTER) {\n      this.selectCurrentItem();\n    }\n  }\n\n  handleItemSelected(value: string): void {\n    this.inputValue = value;\n    this.textChanged(value);\n    this.filterResult = new Array<string>();\n    this.selectionChanged.emit(value);\n  }\n\n  private performFilter(value: string) {\n    const filter = (filterList: string[], text: string) => {\n      const filterResult = filterList.filter(value => {\n        return text === null || text.length < 1 || value.toLowerCase().indexOf(text.toLowerCase()) > -1;\n      });\n      return filterResult;\n    };\n\n    this.filterResult = filter(this.filterList, value);\n\n    this.selectedItemIndex = -1;\n  }\n\n  private addHighlight() {\n    if (this.selectedItemIndex > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(this.selectedItemIndex)}`);\n      listItem.classList.add('highlighted');\n    }\n  }\n\n  private removeHighlight(i: number) {\n    if (i > -1) {\n      const listItem = this.el.querySelector(`#${this.getListItemId(i)}`);\n      listItem.classList.remove('highlighted');\n    }\n  }\n\n  private selectCurrentItem(): void {\n    if (this.selectedItemIndex >= 0) {\n      const selectedItemText = this.filterResult[this.selectedItemIndex];\n      this.handleItemSelected(selectedItemText);\n    }\n  }\n\n  handleItemHovered(index: number): void {\n    this.removeHighlight(this.selectedItemIndex);\n    this.selectedItemIndex = index;\n    this.addHighlight();\n  }\n\n  handleComponentFocusOut() {\n    // Ensure dropdown closed on clicking or tabbing away from this component\n    if (this.filterResult?.length > 0) {\n      this.filterResult = new Array<string>();\n      this.hasBeenFocusedAtLeastOnce = false;\n    }\n  }\n\n  /**\n   * Check if the selected option is in view, and scroll if not\n   */\n  private updateScroll() {\n    const container = this.listContainer;\n\n    const ul = container.querySelector('ul');\n    const selectedItem: any = Array.from(ul.childNodes).find((item: any) => item.ariaPosInSet === `${this.selectedItemIndex + 1}`);\n\n    if (container && selectedItem && container.scrollHeight + container.clientHeight) {\n      selectedItem.scrollIntoView();\n    }\n  }\n\n  private navigateSuggestions(key: Keys) {\n    if (key === Keys.UP_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex--;\n      if (this.selectedItemIndex === -2) {\n        this.selectedItemIndex = this.filterResult.length - 1;\n      }\n    }\n    if (key === Keys.DOWN_ARROW) {\n      this.removeHighlight(this.selectedItemIndex);\n      this.selectedItemIndex++;\n      if (this.selectedItemIndex > this.filterResult.length - 1) {\n        this.selectedItemIndex = -1;\n      }\n    }\n    if (this.selectedItemIndex === -1) {\n      this.inputValue = this.originalSearch;\n    } else {\n      const value = this.filterResult[this.selectedItemIndex];\n\n      this.inputValue = value;\n\n      this.addHighlight();\n    }\n  }\n\n  private getListItemId(i: number) {\n    return `${this.listId}-item-${i}`;\n  }\n\n  render() {\n    return (\n      <Host onFocusout={_ev => this.handleComponentFocusOut()}>\n        <div class=\"visually-hidden\">\n          <div class=\"results-status-a\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n          <div class=\"results-status-b\" role=\"status\" aria-atomic=\"true\" aria-live=\"polite\">\n            {!this.isSilenced && !this.isAlternateStatusSection ? this.statusText : ''}\n          </div>\n        </div>\n        <admiralty-input\n          type=\"text\"\n          ref={el => (this.inputControl = el)}\n          label={this.label}\n          hint={this.hint}\n          placeholder={this.placeholder}\n          class=\"filterTextInput\"\n          onKeyUp={ev => this.handleKeyPressed(ev)}\n          onKeyDown={ev => this.handleKeyDown(ev)}\n          onFocusin={_ev => this.handleFocusIn()}\n          onFocusout={_ev => this.handleFocusOut()}\n          aria-expanded={this.isFocused && this.filterResult.length > 0}\n        ></admiralty-input>\n\n        <span id={this.hintId} class=\"visually-hidden\">\n          When autocomplete results are available use up and down arrows to review and enter to select. Touch device users, explore by touch or with swipe gestures.\n        </span>\n        {this.filterResult.length > 0 ? (\n          <div class=\"typeahead-list-container\" ref={el => (this.listContainer = el)}>\n            <ul class=\"typeahead-list\" id={this.listId} role=\"listbox\">\n              {this.filterResult.map((item, i) => (\n                <li\n                  id={this.getListItemId(i)}\n                  onMouseDown={_ev => this.handleItemSelected(item)}\n                  onMouseOver={_ev => this.handleItemHovered(i)}\n                  aria-selected={i === this.selectedItemIndex}\n                  role=\"option\"\n                  tabindex=\"-1\"\n                  aria-posinset={i + 1}\n                  aria-setsize={this.filterResult.length}\n                >\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </div>\n        ) : null}\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n\nlet id = 0;\n"],"mappings":"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"}

package/dist/admiralty/p-6492124b.entry.js

@@ -1,2 +0,0 @@
-import{r as a,h as e,H as d}from"./p-ac0ad15a.js";import{a as t}from"./p-a28a614b.js";const i="p.sc-admiralty-hint{margin-top:0;margin-bottom:6px;display:block;font-weight:300}p.disabled.sc-admiralty-hint{color:#adadad}";const c=i;const s=class{constructor(e){a(this,e);this.disabled=undefined}render(){return e("p",{key:"d5c32ab0bb0416a7f1e10ae3c134477785cd9c2b",class:{disabled:this.disabled}},e("slot",{key:"2f34effc00bded2b043d3e6329a6d3f1d9e8ba0e"}))}};s.style=c;const l=".sc-admiralty-input-invalid-h{display:flex;align-items:center}admiralty-icon.sc-admiralty-input-invalid{color:#e20d0d}p.sc-admiralty-input-invalid{margin:0;color:#e20d0d}";const n=l;const r=class{constructor(e){a(this,e)}render(){return e(d,{key:"9267bec797b4495d10b0a5095c7406a8b9d45189"},e("admiralty-icon",{key:"4d2be552269678fb718cc1a431e8e734602c7dcf","icon-name":t.iconName,class:"error-icon"}),e("p",{key:"2bdee004583f330f204e3601e2dc6fa6dee5759e"},e("slot",{key:"5544283b85989a983a59a2cce4eb4f6de6fae41e"})))}};r.style=n;const o="label.sc-admiralty-label{margin-bottom:6px;display:inline-block;font-weight:normal}label.disabled.sc-admiralty-label{color:#adadad}";const b=o;const m=class{constructor(e){a(this,e);this.disabled=undefined;this.for=undefined}render(){return e("label",{key:"685f1ed5184b955228654c935f24b45efe7b84b0",htmlFor:this.for,class:{disabled:this.disabled}},e("slot",{key:"561906355acbccdaf9cdc12fd09225bae6946d50"}))}};m.style=b;export{s as admiralty_hint,r as admiralty_input_invalid,m as admiralty_label};
-//# sourceMappingURL=p-6492124b.entry.js.map

package/dist/admiralty/p-6492124b.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["hintCss","AdmiraltyHintStyle0","HintComponent","render","h","key","class","disabled","this","inputInvalidCss","AdmiraltyInputInvalidStyle0","InputInvalidComponent","Host","faExclamation","iconName","labelCss","AdmiraltyLabelStyle0","LabelComponent","htmlFor","for"],"sources":["src/components/hint/hint.scss?tag=admiralty-hint&encapsulation=scoped","src/components/hint/hint.tsx","src/components/input-invalid/input-invalid.scss?tag=admiralty-input-invalid&encapsulation=scoped","src/components/input-invalid/input-invalid.tsx","src/components/label/label.scss?tag=admiralty-label&encapsulation=scoped","src/components/label/label.tsx"],"sourcesContent":["@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\np {\n  margin-top: 0;\n  margin-bottom: 6px;\n  display: block;\n  font-weight: typography.$font-weight-light;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The hint content should be placed in the slot e.g.\n * `<admiralty-hint>Enter your full name</admiralty-hint>`\n */\n@Component({\n  tag: 'admiralty-hint',\n  styleUrl: 'hint.scss',\n  scoped: true,\n})\nexport class HintComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  render() {\n    return (\n      <p class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </p>\n    );\n  }\n}\n","@use '../../scss/vars/colours';\n\n:host {\n  display: flex;\n  align-items: center;\n}\n\nadmiralty-icon {\n  color: colours.$colour-utility-error;\n}\n\np {\n  margin: 0;\n  color: colours.$colour-utility-error;\n}\n\n","import { Component, h, Host } from '@stencil/core';\nimport { faExclamation } from '@fortawesome/free-solid-svg-icons';\n\n/**\n * @slot - The error content should be placed in the slot e.g.\n * `<admiralty-input-invalid>This field is required</admiralty-input-invalid>`\n */\n@Component({\n  tag: 'admiralty-input-invalid',\n  styleUrl: 'input-invalid.scss',\n  scoped: true,\n})\nexport class InputInvalidComponent {\n  render() {\n    return (\n      <Host>\n        <admiralty-icon icon-name={faExclamation.iconName} class=\"error-icon\"></admiralty-icon>\n        <p>\n          <slot></slot>\n        </p>\n      </Host>\n    );\n  }\n}\n","@use \"../../scss/vars/colours\";\n@use \"../../scss/vars/typography\";\n\nlabel {\n  margin-bottom: 6px;\n  display: inline-block;\n  font-weight: typography.$font-weight-medium;\n\n  &.disabled {\n    color: colours.$colour-textinput-text-disabled;\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * @slot - The label content should be placed in the slot e.g.\n * `<admiralty-label>First Name</admiralty-label>`\n */\n@Component({\n  tag: 'admiralty-label',\n  styleUrl: 'label.scss',\n  scoped: true,\n})\nexport class LabelComponent {\n  /**\n   * The disabled option can be used to disable the component.\n   */\n  @Prop() disabled: boolean;\n\n  /**\n   * The id of the input the label is attached to\n   */\n  @Prop() for: string;\n\n  render() {\n    return (\n      <label htmlFor={this.for} class={{ disabled: this.disabled }}>\n        <slot></slot>\n      </label>\n    );\n  }\n}\n"],"mappings":"sFAAA,MAAMA,EAAU,+HAChB,MAAAC,EAAeD,E,MCUFE,EAAa,M,iDAMxB,MAAAC,GACE,OACEC,EAAA,KAAAC,IAAA,2CAAGC,MAAO,CAAEC,SAAUC,KAAKD,WACzBH,EAAA,QAAAC,IAAA,6C,aCpBR,MAAMI,EAAkB,6KACxB,MAAAC,EAAeD,E,MCWFE,EAAqB,M,yBAChC,MAAAR,GACE,OACEC,EAACQ,EAAI,CAAAP,IAAA,4CACHD,EAAA,kBAAAC,IAAA,uDAA2BQ,EAAcC,SAAUR,MAAM,eACzDF,EAAA,KAAAC,IAAA,4CACED,EAAA,QAAAC,IAAA,8C,aClBV,MAAMU,EAAW,sIACjB,MAAAC,EAAeD,E,MCUFE,EAAc,M,oEAWzB,MAAAd,GACE,OACEC,EAAA,SAAAC,IAAA,2CAAOa,QAASV,KAAKW,IAAKb,MAAO,CAAEC,SAAUC,KAAKD,WAChDH,EAAA,QAAAC,IAAA,6C"}