@aurodesignsystem-dev/auro-formkit 0.0.0-pr1503.3 → 0.0.0-pr1503.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (190) hide show
  1. package/components/bibtemplate/dist/index.js +1 -1
  2. package/components/bibtemplate/dist/registered.js +1 -1
  3. package/components/checkbox/demo/accessibility.md +1 -1
  4. package/components/checkbox/demo/customize.html +1 -2
  5. package/components/checkbox/demo/customize.min.js +23 -8
  6. package/components/checkbox/demo/getting-started.min.js +23 -8
  7. package/components/checkbox/demo/index.min.js +23 -8
  8. package/components/checkbox/dist/index.js +23 -8
  9. package/components/checkbox/dist/registered.js +23 -8
  10. package/components/combobox/README.md +1 -1
  11. package/components/combobox/demo/accessibility.md +1 -1
  12. package/components/combobox/demo/api.md +2 -2
  13. package/components/combobox/demo/customize.html +1 -2
  14. package/components/combobox/demo/customize.md +166 -142
  15. package/components/combobox/demo/customize.min.js +2515 -2316
  16. package/components/combobox/demo/getting-started.min.js +2515 -2312
  17. package/components/combobox/demo/index.md +2 -1
  18. package/components/combobox/demo/index.min.js +2515 -2312
  19. package/components/combobox/demo/keyboard-behavior.md +3 -146
  20. package/components/combobox/demo/readme.md +1 -1
  21. package/components/combobox/demo/why-combobox.md +2 -2
  22. package/components/combobox/dist/auro-combobox.d.ts +49 -15
  23. package/components/combobox/dist/index.js +1462 -753
  24. package/components/combobox/dist/registered.js +1462 -753
  25. package/components/counter/demo/customize.min.js +188 -244
  26. package/components/counter/demo/index.min.js +188 -244
  27. package/components/counter/dist/auro-counter.d.ts +0 -8
  28. package/components/counter/dist/index.js +188 -244
  29. package/components/counter/dist/registered.js +188 -244
  30. package/components/datepicker/demo/accessibility.md +20 -10
  31. package/components/datepicker/demo/api.md +65 -62
  32. package/components/datepicker/demo/customize.md +180 -40
  33. package/components/datepicker/demo/customize.min.js +1690 -777
  34. package/components/datepicker/demo/getting-started.md +118 -2
  35. package/components/datepicker/demo/index.min.js +1690 -759
  36. package/components/datepicker/demo/keyboard-behavior.md +3 -3
  37. package/components/datepicker/demo/voiceover.md +4 -4
  38. package/components/datepicker/demo/why-datepicker.md +2 -2
  39. package/components/datepicker/dist/{src/auro-calendar-cell.d.ts → auro-calendar-cell.d.ts} +48 -3
  40. package/components/datepicker/dist/{src/auro-calendar.d.ts → auro-calendar.d.ts} +188 -10
  41. package/components/datepicker/dist/{src/auro-datepicker.d.ts → auro-datepicker.d.ts} +89 -6
  42. package/components/datepicker/dist/blackoutUtils.d.ts +43 -0
  43. package/components/datepicker/dist/index.js +1690 -759
  44. package/components/datepicker/dist/registered.js +1690 -759
  45. package/components/dropdown/demo/customize.html +3 -0
  46. package/components/dropdown/demo/customize.min.js +142 -208
  47. package/components/dropdown/demo/getting-started.min.js +131 -207
  48. package/components/dropdown/demo/index.min.js +131 -207
  49. package/components/dropdown/dist/auro-dropdown.d.ts +17 -1
  50. package/components/dropdown/dist/index.js +131 -207
  51. package/components/dropdown/dist/registered.js +131 -207
  52. package/components/form/demo/api.md +3 -3
  53. package/components/form/demo/customize.html +6 -6
  54. package/components/form/demo/customize.md +535 -135
  55. package/components/form/demo/customize.min.js +6307 -4378
  56. package/components/form/demo/getting-started.md +344 -96
  57. package/components/form/demo/getting-started.min.js +6255 -4378
  58. package/components/form/demo/index.min.js +6206 -4378
  59. package/components/form/demo/registerDemoDeps.min.js +5827 -4333
  60. package/components/form/dist/auro-form.d.ts +128 -10
  61. package/components/form/dist/index.js +377 -43
  62. package/components/form/dist/registered.js +377 -43
  63. package/components/input/demo/accessibility.md +1 -1
  64. package/components/input/demo/api.md +58 -57
  65. package/components/input/demo/customize.html +1 -2
  66. package/components/input/demo/customize.md +62 -61
  67. package/components/input/demo/customize.min.js +396 -275
  68. package/components/input/demo/getting-started.min.js +396 -275
  69. package/components/input/demo/index.min.js +396 -275
  70. package/components/input/dist/auro-input.d.ts +1 -1
  71. package/components/input/dist/base-input.d.ts +60 -81
  72. package/components/input/dist/index.js +409 -276
  73. package/components/input/dist/registered.js +396 -275
  74. package/components/input/dist/utilities.d.ts +10 -1
  75. package/components/menu/demo/accessibility.md +9 -4
  76. package/components/menu/demo/api.md +48 -45
  77. package/components/menu/demo/css-only.md +26 -19
  78. package/components/menu/demo/customize.md +307 -75
  79. package/components/menu/demo/design.md +1 -1
  80. package/components/menu/demo/getting-started.md +144 -7
  81. package/components/menu/demo/index.min.js +961 -1341
  82. package/components/menu/demo/keyboard-behavior.md +83 -4
  83. package/components/menu/demo/voiceover.md +21 -14
  84. package/components/menu/demo/why-menu.md +8 -9
  85. package/components/menu/dist/auro-menu-utils.d.ts +19 -0
  86. package/components/menu/dist/auro-menu.d.ts +97 -116
  87. package/components/menu/dist/auro-menuoption.d.ts +39 -133
  88. package/components/menu/dist/index.js +823 -1309
  89. package/components/menu/dist/registered.js +835 -1309
  90. package/components/radio/demo/accessibility.md +1 -1
  91. package/components/radio/demo/customize.min.js +23 -8
  92. package/components/radio/demo/getting-started.min.js +23 -8
  93. package/components/radio/demo/index.min.js +23 -8
  94. package/components/radio/dist/index.js +23 -8
  95. package/components/radio/dist/registered.js +23 -8
  96. package/components/select/demo/accessibility.md +6 -1
  97. package/components/select/demo/api.md +3 -2
  98. package/components/select/demo/customize.html +1 -2
  99. package/components/select/demo/customize.md +210 -5
  100. package/components/select/demo/customize.min.js +1613 -1854
  101. package/components/select/demo/design.md +10 -10
  102. package/components/select/demo/getting-started.md +1 -1
  103. package/components/select/demo/getting-started.min.js +1617 -1903
  104. package/components/select/demo/index.md +2 -2
  105. package/components/select/demo/index.min.js +1613 -1854
  106. package/components/select/demo/keyboard-behavior.md +81 -54
  107. package/components/select/demo/voiceover.md +28 -15
  108. package/components/select/dist/auro-select.d.ts +70 -12
  109. package/components/select/dist/index.js +580 -315
  110. package/components/select/dist/registered.js +580 -315
  111. package/components/select/dist/selectUtils.d.ts +24 -0
  112. package/custom-elements.json +8071 -7919
  113. package/package.json +7 -3
  114. package/components/checkbox/demo/customize.js +0 -22
  115. package/components/checkbox/demo/demo-support.js +0 -1
  116. package/components/checkbox/demo/getting-started.js +0 -22
  117. package/components/checkbox/demo/index.js +0 -8
  118. package/components/checkbox/demo/styles.scss +0 -1
  119. package/components/combobox/demo/customize.js +0 -24
  120. package/components/combobox/demo/demo-support.js +0 -1
  121. package/components/combobox/demo/getting-started.js +0 -21
  122. package/components/combobox/demo/index.js +0 -23
  123. package/components/combobox/demo/styles.scss +0 -1
  124. package/components/counter/demo/customize.js +0 -21
  125. package/components/counter/demo/demo-support.js +0 -1
  126. package/components/counter/demo/index.js +0 -21
  127. package/components/counter/demo/styles.scss +0 -1
  128. package/components/datepicker/demo/customize.js +0 -19
  129. package/components/datepicker/demo/demo-support.js +0 -1
  130. package/components/datepicker/demo/index.js +0 -23
  131. package/components/datepicker/demo/styles.scss +0 -1
  132. package/components/dropdown/demo/customize.js +0 -9
  133. package/components/dropdown/demo/demo-support.js +0 -1
  134. package/components/dropdown/demo/getting-started.js +0 -9
  135. package/components/dropdown/demo/index.js +0 -16
  136. package/components/dropdown/demo/styles.scss +0 -1
  137. package/components/form/demo/customize.js +0 -9
  138. package/components/form/demo/demo-support.js +0 -1
  139. package/components/form/demo/getting-started.js +0 -9
  140. package/components/form/demo/index.js +0 -5
  141. package/components/form/demo/registerDemoDeps.js +0 -23
  142. package/components/form/demo/styles.scss +0 -1
  143. package/components/input/demo/customize.js +0 -25
  144. package/components/input/demo/demo-support.js +0 -1
  145. package/components/input/demo/getting-started.js +0 -8
  146. package/components/input/demo/index.js +0 -8
  147. package/components/input/demo/styles.css +0 -974
  148. package/components/input/demo/styles.scss +0 -1
  149. package/components/menu/demo/demo-support.js +0 -1
  150. package/components/menu/demo/index.js +0 -25
  151. package/components/menu/demo/styles.scss +0 -1
  152. package/components/menu/dist/auro-menu.context.d.ts +0 -238
  153. package/components/radio/demo/customize.js +0 -22
  154. package/components/radio/demo/demo-support.js +0 -1
  155. package/components/radio/demo/getting-started.js +0 -24
  156. package/components/radio/demo/index.js +0 -8
  157. package/components/radio/demo/styles.scss +0 -1
  158. package/components/select/demo/customize.js +0 -11
  159. package/components/select/demo/demo-support.js +0 -1
  160. package/components/select/demo/getting-started.js +0 -26
  161. package/components/select/demo/index.js +0 -11
  162. package/components/select/demo/styles.scss +0 -1
  163. /package/components/counter/dist/styles/{counter-wrapper-color-css.d.ts → counter-group-color-css.d.ts} +0 -0
  164. /package/components/datepicker/dist/{src/auro-calendar-month.d.ts → auro-calendar-month.d.ts} +0 -0
  165. /package/components/datepicker/dist/{src/buttonVersion.d.ts → buttonVersion.d.ts} +0 -0
  166. /package/components/datepicker/dist/{src/datepickerKeyboardStrategy.d.ts → datepickerKeyboardStrategy.d.ts} +0 -0
  167. /package/components/datepicker/dist/{src/iconVersion.d.ts → iconVersion.d.ts} +0 -0
  168. /package/components/datepicker/dist/{src/index.d.ts → index.d.ts} +0 -0
  169. /package/components/datepicker/dist/{src/popoverVersion.d.ts → popoverVersion.d.ts} +0 -0
  170. /package/components/datepicker/dist/{src/styles → styles}/classic/color-css.d.ts +0 -0
  171. /package/components/datepicker/dist/{src/styles → styles}/classic/style-css.d.ts +0 -0
  172. /package/components/datepicker/dist/{src/styles → styles}/color-calendar-css.d.ts +0 -0
  173. /package/components/datepicker/dist/{src/styles → styles}/color-cell-css.d.ts +0 -0
  174. /package/components/datepicker/dist/{src/styles → styles}/color-css.d.ts +0 -0
  175. /package/components/datepicker/dist/{src/styles → styles}/color-month-css.d.ts +0 -0
  176. /package/components/datepicker/dist/{src/styles → styles}/shapeSize-css.d.ts +0 -0
  177. /package/components/datepicker/dist/{src/styles → styles}/snowflake/color-css.d.ts +0 -0
  178. /package/components/datepicker/dist/{src/styles → styles}/snowflake/style-css.d.ts +0 -0
  179. /package/components/datepicker/dist/{src/styles → styles}/style-auro-calendar-cell-css.d.ts +0 -0
  180. /package/components/datepicker/dist/{src/styles → styles}/style-auro-calendar-css.d.ts +0 -0
  181. /package/components/datepicker/dist/{src/styles → styles}/style-auro-calendar-month-css.d.ts +0 -0
  182. /package/components/datepicker/dist/{src/styles → styles}/style-css.d.ts +0 -0
  183. /package/components/datepicker/dist/{src/styles → styles}/tokens-css.d.ts +0 -0
  184. /package/components/datepicker/dist/{src/utilities.d.ts → utilities.d.ts} +0 -0
  185. /package/components/datepicker/dist/{src/utilitiesCalendar.d.ts → utilitiesCalendar.d.ts} +0 -0
  186. /package/components/datepicker/dist/{src/utilitiesCalendarRender.d.ts → utilitiesCalendarRender.d.ts} +0 -0
  187. /package/components/datepicker/dist/{src/vendor → vendor}/wc-range-datepicker/day.d.ts +0 -0
  188. /package/components/datepicker/dist/{src/vendor → vendor}/wc-range-datepicker/range-datepicker-calendar.d.ts +0 -0
  189. /package/components/datepicker/dist/{src/vendor → vendor}/wc-range-datepicker/range-datepicker-cell.d.ts +0 -0
  190. /package/components/datepicker/dist/{src/vendor → vendor}/wc-range-datepicker/range-datepicker.d.ts +0 -0
@@ -3,34 +3,34 @@
3
3
  * Copyright 2019 Google LLC
4
4
  * SPDX-License-Identifier: BSD-3-Clause
5
5
  */
6
- const t$2=globalThis,e$5=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$6=Symbol(),o$5=new WeakMap;let n$4 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$6)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$5&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$5.set(s,t));}return t}toString(){return this.cssText}};const r$2=t=>new n$4("string"==typeof t?t:t+"",void 0,s$6),i$6=(t,...e)=>{const o=1===t.length?t[0]:e.reduce((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1],t[0]);return new n$4(o,t,s$6)},S$1=(s,o)=>{if(e$5)s.adoptedStyleSheets=o.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$5?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$2(e)})(t):t;
6
+ const t$2=globalThis,e$4=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$3=Symbol(),o$5=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$3)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$4&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$5.set(s,t));}return t}toString(){return this.cssText}};const r$2=t=>new n$3("string"==typeof t?t:t+"",void 0,s$3),i$5=(t,...e)=>{const o=1===t.length?t[0]:e.reduce((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1],t[0]);return new n$3(o,t,s$3)},S$1=(s,o)=>{if(e$4)s.adoptedStyleSheets=o.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$4?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$2(e)})(t):t;
7
7
 
8
8
  /**
9
9
  * @license
10
10
  * Copyright 2017 Google LLC
11
11
  * SPDX-License-Identifier: BSD-3-Clause
12
- */const{is:i$5,defineProperty:e$4,getOwnPropertyDescriptor:h$1,getOwnPropertyNames:r$1,getOwnPropertySymbols:o$4,getPrototypeOf:n$3}=Object,a$2=globalThis,c$1=a$2.trustedTypes,l$2=c$1?c$1.emptyScript:"",p$2=a$2.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$3={toAttribute(t,s){switch(s){case Boolean:t=t?l$2:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$2=(t,s)=>!i$5(t,s),b$1={attribute:true,type:String,converter:u$3,reflect:false,useDefault:false,hasChanged:f$2};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;let y$2 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b$1){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$4(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$1(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$3(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...r$1(t),...o$4(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach(t=>t.hostConnected?.());}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.());}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$3).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$3;this._$Em=e;const r=h.fromAttribute(s,t.type);this[e]=r??this._$Ej?.get(e)??r,this._$Em=null;}}requestUpdate(t,s,i,e=false,h){if(void 0!==t){const r=this.constructor;if(false===e&&(h=this[t]),i??=r.getPropertyOptions(t),!((i.hasChanged??f$2)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(r._$Eu(t,i))))return;this.C(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$EP());}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),true!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),true===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t));}async _$EP(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];true!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e);}}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach(t=>t.hostUpdate?.()),this.update(s)):this._$EM();}catch(s){throw t=false,this._$EM(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EM(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Eq&&=this._$Eq.forEach(t=>this._$ET(t,this[t])),this._$EM();}updated(t){}firstUpdated(t){}};y$2.elementStyles=[],y$2.shadowRootOptions={mode:"open"},y$2[d$1("elementProperties")]=new Map,y$2[d$1("finalized")]=new Map,p$2?.({ReactiveElement:y$2}),(a$2.reactiveElementVersions??=[]).push("2.1.2");
12
+ */const{is:i$4,defineProperty:e$3,getOwnPropertyDescriptor:h$1,getOwnPropertyNames:r$1,getOwnPropertySymbols:o$4,getPrototypeOf:n$2}=Object,a$2=globalThis,c$1=a$2.trustedTypes,l$2=c$1?c$1.emptyScript:"",p$2=a$2.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$3={toAttribute(t,s){switch(s){case Boolean:t=t?l$2:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$2=(t,s)=>!i$4(t,s),b$1={attribute:true,type:String,converter:u$3,reflect:false,useDefault:false,hasChanged:f$2};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;let y$2 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b$1){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$3(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$1(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...r$1(t),...o$4(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach(t=>t.hostConnected?.());}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.());}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$3).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$3;this._$Em=e;const r=h.fromAttribute(s,t.type);this[e]=r??this._$Ej?.get(e)??r,this._$Em=null;}}requestUpdate(t,s,i,e=false,h){if(void 0!==t){const r=this.constructor;if(false===e&&(h=this[t]),i??=r.getPropertyOptions(t),!((i.hasChanged??f$2)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(r._$Eu(t,i))))return;this.C(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$EP());}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),true!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),true===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t));}async _$EP(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];true!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e);}}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach(t=>t.hostUpdate?.()),this.update(s)):this._$EM();}catch(s){throw t=false,this._$EM(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EM(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Eq&&=this._$Eq.forEach(t=>this._$ET(t,this[t])),this._$EM();}updated(t){}firstUpdated(t){}};y$2.elementStyles=[],y$2.shadowRootOptions={mode:"open"},y$2[d$1("elementProperties")]=new Map,y$2[d$1("finalized")]=new Map,p$2?.({ReactiveElement:y$2}),(a$2.reactiveElementVersions??=[]).push("2.1.2");
13
13
 
14
14
  /**
15
15
  * @license
16
16
  * Copyright 2017 Google LLC
17
17
  * SPDX-License-Identifier: BSD-3-Clause
18
18
  */
19
- const t$1=globalThis,i$4=t=>t,s$5=t$1.trustedTypes,e$3=s$5?s$5.createPolicy("lit-html",{createHTML:t=>t}):void 0,h="$lit$",o$3=`lit$${Math.random().toFixed(9).slice(2)}$`,n$2="?"+o$3,r=`<${n$2}>`,l$1=document,c=()=>l$1.createComment(""),a$1=t=>null===t||"object"!=typeof t&&"function"!=typeof t,u$2=Array.isArray,d=t=>u$2(t)||"function"==typeof t?.[Symbol.iterator],f$1="[ \t\n\f\r]",v=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_$1=/-->/g,m$1=/>/g,p$1=RegExp(`>|${f$1}(?:([^\\s"'>=/]+)(${f$1}*=${f$1}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g$1=/'/g,$=/"/g,y$1=/^(?:script|style|textarea|title)$/i,x=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),b=x(1),E=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),C=new WeakMap,P=l$1.createTreeWalker(l$1,129);function V(t,i){if(!u$2(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$3?e$3.createHTML(i):i}const N=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,f=0;for(;f<s.length&&(c.lastIndex=f,u=c.exec(s),null!==u);)f=c.lastIndex,c===v?"!--"===u[1]?c=_$1:void 0!==u[1]?c=m$1:void 0!==u[2]?(y$1.test(u[2])&&(n=RegExp("</"+u[2],"g")),c=p$1):void 0!==u[3]&&(c=p$1):c===p$1?">"===u[0]?(c=n??v,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?p$1:'"'===u[3]?$:g$1):c===$||c===g$1?c=p$1:c===_$1||c===m$1?c=v:(c=p$1,n=void 0);const x=c===p$1&&t[i+1].startsWith("/>")?" ":"";l+=c===v?s+r:d>=0?(e.push(a),s.slice(0,d)+h+s.slice(d)+o$3+x):s+o$3+(-2===d?i:x);}return [V(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};class S{constructor({strings:t,_$litType$:i},e){let r;this.parts=[];let l=0,a=0;const u=t.length-1,d=this.parts,[f,v]=N(t,i);if(this.el=S.createElement(f,e),P.currentNode=this.el.content,2===i||3===i){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=P.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(h)){const i=v[a++],s=r.getAttribute(t).split(o$3),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z$1:H}),r.removeAttribute(t);}else t.startsWith(o$3)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y$1.test(r.tagName)){const t=r.textContent.split(o$3),i=t.length-1;if(i>0){r.textContent=s$5?s$5.emptyScript:"";for(let s=0;s<i;s++)r.append(t[s],c()),P.nextNode(),d.push({type:2,index:++l});r.append(t[i],c());}}}else if(8===r.nodeType)if(r.data===n$2)d.push({type:2,index:l});else {let t=-1;for(;-1!==(t=r.data.indexOf(o$3,t+1));)d.push({type:7,index:l}),t+=o$3.length-1;}l++;}}static createElement(t,i){const s=l$1.createElement("template");return s.innerHTML=t,s}}function M$1(t,i,s=t,e){if(i===E)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=a$1(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=M$1(t,h._$AS(t,i.values),h,e)),i}class R{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??l$1).importNode(i,true);P.currentNode=e;let h=P.nextNode(),o=0,n=0,r=s[0];for(;void 0!==r;){if(o===r.index){let i;2===r.type?i=new k$1(h,h.nextSibling,this,t):1===r.type?i=new r.ctor(h,r.name,r.strings,this,t):6===r.type&&(i=new Z(h,this,t)),this._$AV.push(i),r=s[++n];}o!==r?.index&&(h=P.nextNode(),o++);}return P.currentNode=l$1,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}let k$1 = class k{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=M$1(this,t,i),a$1(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A&&a$1(this._$AH)?this._$AA.nextSibling.data=t:this.T(l$1.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=S.createElement(V(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new R(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C.get(t.strings);return void 0===i&&C.set(t.strings,i=new S(t)),i}k(t){u$2(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new k(this.O(c()),this.O(c()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,s){for(this._$AP?.(false,true,s);t!==this._$AB;){const s=i$4(t).nextSibling;i$4(t).remove(),t=s;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}};class H{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=M$1(this,t,i,0),o=!a$1(t)||t!==this._$AH&&t!==E,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=M$1(this,e[s+n],i,n),r===E&&(r=this._$AH[n]),o||=!a$1(r)||r!==this._$AH[n],r===A?t=A:t!==A&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class I extends H{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class L extends H{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}let z$1 = class z extends H{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=M$1(this,t,i,0)??A)===E)return;const s=this._$AH,e=t===A&&s!==A||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A&&(s===A||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}};class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){M$1(this,t);}}const B=t$1.litHtmlPolyfillSupport;B?.(S,k$1),(t$1.litHtmlVersions??=[]).push("3.3.2");const D=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new k$1(i.insertBefore(c(),t),t,void 0,s??{});}return h._$AI(t),h};
19
+ const t$1=globalThis,i$3=t=>t,s$2=t$1.trustedTypes,e$2=s$2?s$2.createPolicy("lit-html",{createHTML:t=>t}):void 0,h="$lit$",o$3=`lit$${Math.random().toFixed(9).slice(2)}$`,n$1="?"+o$3,r=`<${n$1}>`,l$1=document,c=()=>l$1.createComment(""),a$1=t=>null===t||"object"!=typeof t&&"function"!=typeof t,u$2=Array.isArray,d=t=>u$2(t)||"function"==typeof t?.[Symbol.iterator],f$1="[ \t\n\f\r]",v=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_$1=/-->/g,m$1=/>/g,p$1=RegExp(`>|${f$1}(?:([^\\s"'>=/]+)(${f$1}*=${f$1}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g$1=/'/g,$=/"/g,y$1=/^(?:script|style|textarea|title)$/i,x=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),b=x(1),E=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),C=new WeakMap,P=l$1.createTreeWalker(l$1,129);function V(t,i){if(!u$2(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$2?e$2.createHTML(i):i}const N=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,f=0;for(;f<s.length&&(c.lastIndex=f,u=c.exec(s),null!==u);)f=c.lastIndex,c===v?"!--"===u[1]?c=_$1:void 0!==u[1]?c=m$1:void 0!==u[2]?(y$1.test(u[2])&&(n=RegExp("</"+u[2],"g")),c=p$1):void 0!==u[3]&&(c=p$1):c===p$1?">"===u[0]?(c=n??v,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?p$1:'"'===u[3]?$:g$1):c===$||c===g$1?c=p$1:c===_$1||c===m$1?c=v:(c=p$1,n=void 0);const x=c===p$1&&t[i+1].startsWith("/>")?" ":"";l+=c===v?s+r:d>=0?(e.push(a),s.slice(0,d)+h+s.slice(d)+o$3+x):s+o$3+(-2===d?i:x);}return [V(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};class S{constructor({strings:t,_$litType$:i},e){let r;this.parts=[];let l=0,a=0;const u=t.length-1,d=this.parts,[f,v]=N(t,i);if(this.el=S.createElement(f,e),P.currentNode=this.el.content,2===i||3===i){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=P.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(h)){const i=v[a++],s=r.getAttribute(t).split(o$3),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z$1:H}),r.removeAttribute(t);}else t.startsWith(o$3)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y$1.test(r.tagName)){const t=r.textContent.split(o$3),i=t.length-1;if(i>0){r.textContent=s$2?s$2.emptyScript:"";for(let s=0;s<i;s++)r.append(t[s],c()),P.nextNode(),d.push({type:2,index:++l});r.append(t[i],c());}}}else if(8===r.nodeType)if(r.data===n$1)d.push({type:2,index:l});else {let t=-1;for(;-1!==(t=r.data.indexOf(o$3,t+1));)d.push({type:7,index:l}),t+=o$3.length-1;}l++;}}static createElement(t,i){const s=l$1.createElement("template");return s.innerHTML=t,s}}function M$1(t,i,s=t,e){if(i===E)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=a$1(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=M$1(t,h._$AS(t,i.values),h,e)),i}class R{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??l$1).importNode(i,true);P.currentNode=e;let h=P.nextNode(),o=0,n=0,r=s[0];for(;void 0!==r;){if(o===r.index){let i;2===r.type?i=new k$1(h,h.nextSibling,this,t):1===r.type?i=new r.ctor(h,r.name,r.strings,this,t):6===r.type&&(i=new Z(h,this,t)),this._$AV.push(i),r=s[++n];}o!==r?.index&&(h=P.nextNode(),o++);}return P.currentNode=l$1,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}let k$1 = class k{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=M$1(this,t,i),a$1(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A&&a$1(this._$AH)?this._$AA.nextSibling.data=t:this.T(l$1.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=S.createElement(V(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new R(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C.get(t.strings);return void 0===i&&C.set(t.strings,i=new S(t)),i}k(t){u$2(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new k(this.O(c()),this.O(c()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,s){for(this._$AP?.(false,true,s);t!==this._$AB;){const s=i$3(t).nextSibling;i$3(t).remove(),t=s;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}};class H{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=M$1(this,t,i,0),o=!a$1(t)||t!==this._$AH&&t!==E,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=M$1(this,e[s+n],i,n),r===E&&(r=this._$AH[n]),o||=!a$1(r)||r!==this._$AH[n],r===A?t=A:t!==A&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class I extends H{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class L extends H{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}let z$1 = class z extends H{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=M$1(this,t,i,0)??A)===E)return;const s=this._$AH,e=t===A&&s!==A||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A&&(s===A||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}};class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){M$1(this,t);}}const B=t$1.litHtmlPolyfillSupport;B?.(S,k$1),(t$1.litHtmlVersions??=[]).push("3.3.2");const D=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new k$1(i.insertBefore(c(),t),t,void 0,s??{});}return h._$AI(t),h};
20
20
 
21
21
  /**
22
22
  * @license
23
23
  * Copyright 2017 Google LLC
24
24
  * SPDX-License-Identifier: BSD-3-Clause
25
- */const s$4=globalThis;let i$3 = class i extends y$2{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=D(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return E}};i$3._$litElement$=true,i$3["finalized"]=true,s$4.litElementHydrateSupport?.({LitElement:i$3});const o$2=s$4.litElementPolyfillSupport;o$2?.({LitElement:i$3});(s$4.litElementVersions??=[]).push("4.2.2");
25
+ */const s$1=globalThis;let i$2 = class i extends y$2{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=D(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return E}};i$2._$litElement$=true,i$2["finalized"]=true,s$1.litElementHydrateSupport?.({LitElement:i$2});const o$2=s$1.litElementPolyfillSupport;o$2?.({LitElement:i$2});(s$1.litElementVersions??=[]).push("4.2.2");
26
26
 
27
- var styleCss$1 = i$6`:focus:not(:focus-visible){outline:3px solid transparent}.body-default{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-emphasized-font-size, 1rem);line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-font-size, 0.625rem);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);line-height:var(--wcss-body-2xs-emphasized-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-2xl-weight, 300);line-height:var(--wcss-display-2xl-line-height, 1.3);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));letter-spacing:var(--wcss-display-2xl-letter-spacing, 0)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xl-weight, 300);line-height:var(--wcss-display-xl-line-height, 1.3);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));letter-spacing:var(--wcss-display-xl-letter-spacing, 0)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-lg-weight, 300);line-height:var(--wcss-display-lg-line-height, 1.3);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));letter-spacing:var(--wcss-display-lg-letter-spacing, 0)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-md-weight, 300);line-height:var(--wcss-display-md-line-height, 1.3);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));letter-spacing:var(--wcss-display-md-letter-spacing, 0)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-sm-weight, 300);line-height:var(--wcss-display-sm-line-height, 1.3);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));letter-spacing:var(--wcss-display-sm-letter-spacing, 0)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xs-weight, 300);line-height:var(--wcss-display-xs-line-height, 1.3);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));letter-spacing:var(--wcss-display-xs-letter-spacing, 0)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xl-weight, 300);line-height:var(--wcss-heading-xl-line-height, 1.3);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));letter-spacing:var(--wcss-heading-xl-letter-spacing, 0)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-lg-weight, 300);line-height:var(--wcss-heading-lg-line-height, 1.3);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));letter-spacing:var(--wcss-heading-lg-letter-spacing, 0)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-md-weight, 300);line-height:var(--wcss-heading-md-line-height, 1.3);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));letter-spacing:var(--wcss-heading-md-letter-spacing, 0)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-sm-weight, 300);line-height:var(--wcss-heading-sm-line-height, 1.3);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));letter-spacing:var(--wcss-heading-sm-letter-spacing, 0)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xs-weight, 300);line-height:var(--wcss-heading-xs-line-height, 1.3);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));letter-spacing:var(--wcss-heading-xs-letter-spacing, 0)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-2xs-weight, 300);line-height:var(--wcss-heading-2xs-line-height, 1.3);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xl-weight, 450);line-height:var(--wcss-accent-2xl-line-height, 1);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xl-weight, 450);line-height:var(--wcss-accent-xl-line-height, 1.3);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-lg-weight, 450);line-height:var(--wcss-accent-lg-line-height, 1.3);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-md-weight, 500);line-height:var(--wcss-accent-md-line-height, 1.3);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);text-transform:uppercase}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-sm-weight, 500);line-height:var(--wcss-accent-sm-line-height, 1.3);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xs-weight, 500);line-height:var(--wcss-accent-xs-line-height, 1.3);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);text-transform:uppercase}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xs-weight, 450);line-height:var(--wcss-accent-2xs-line-height, 1.3);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);text-transform:uppercase}:host{display:block;line-height:0;overflow-y:auto}:host .menuWrapper{box-sizing:border-box;display:flex;flex-direction:column;width:100%;margin:0;padding:0}:host ::slotted(hr){box-sizing:content-box !important;height:0 !important;overflow:visible !important;margin:var(--ds-size-100, 0.5rem) 0 !important;border-width:0 !important;border-top-width:1px !important;border-top-style:solid !important}:host [loadingplaceholder].empty{opacity:0;position:absolute}:host [loadingplaceholder] slot[name=loadingIcon]{vertical-align:middle;display:inline-block;margin-bottom:var(--ds-size-25, 0.125rem)}:host [loadingplaceholder] slot[name=loadingIcon]::slotted(*){margin-right:var(--ds-size-150, 0.75rem)}:host([root]) .menuWrapper.lg{padding:var(--ds-size-150, 0.75rem);gap:var(--ds-size-50, 0.25rem)}:host([root]) .menuWrapper.xl{padding:var(--ds-size-200, 1rem);gap:var(--ds-size-100, 0.5rem)}`;
27
+ var styleCss$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.body-default{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-emphasized-font-size, 1rem);line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-font-size, 0.625rem);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);line-height:var(--wcss-body-2xs-emphasized-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-2xl-weight, 300);line-height:var(--wcss-display-2xl-line-height, 1.3);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));letter-spacing:var(--wcss-display-2xl-letter-spacing, 0)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xl-weight, 300);line-height:var(--wcss-display-xl-line-height, 1.3);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));letter-spacing:var(--wcss-display-xl-letter-spacing, 0)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-lg-weight, 300);line-height:var(--wcss-display-lg-line-height, 1.3);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));letter-spacing:var(--wcss-display-lg-letter-spacing, 0)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-md-weight, 300);line-height:var(--wcss-display-md-line-height, 1.3);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));letter-spacing:var(--wcss-display-md-letter-spacing, 0)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-sm-weight, 300);line-height:var(--wcss-display-sm-line-height, 1.3);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));letter-spacing:var(--wcss-display-sm-letter-spacing, 0)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xs-weight, 300);line-height:var(--wcss-display-xs-line-height, 1.3);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));letter-spacing:var(--wcss-display-xs-letter-spacing, 0)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xl-weight, 300);line-height:var(--wcss-heading-xl-line-height, 1.3);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));letter-spacing:var(--wcss-heading-xl-letter-spacing, 0)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-lg-weight, 300);line-height:var(--wcss-heading-lg-line-height, 1.3);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));letter-spacing:var(--wcss-heading-lg-letter-spacing, 0)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-md-weight, 300);line-height:var(--wcss-heading-md-line-height, 1.3);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));letter-spacing:var(--wcss-heading-md-letter-spacing, 0)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-sm-weight, 300);line-height:var(--wcss-heading-sm-line-height, 1.3);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));letter-spacing:var(--wcss-heading-sm-letter-spacing, 0)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xs-weight, 300);line-height:var(--wcss-heading-xs-line-height, 1.3);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));letter-spacing:var(--wcss-heading-xs-letter-spacing, 0)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-2xs-weight, 300);line-height:var(--wcss-heading-2xs-line-height, 1.3);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xl-weight, 450);line-height:var(--wcss-accent-2xl-line-height, 1);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xl-weight, 450);line-height:var(--wcss-accent-xl-line-height, 1.3);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-lg-weight, 450);line-height:var(--wcss-accent-lg-line-height, 1.3);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-md-weight, 500);line-height:var(--wcss-accent-md-line-height, 1.3);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);text-transform:uppercase}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-sm-weight, 500);line-height:var(--wcss-accent-sm-line-height, 1.3);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xs-weight, 500);line-height:var(--wcss-accent-xs-line-height, 1.3);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);text-transform:uppercase}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xs-weight, 450);line-height:var(--wcss-accent-2xs-line-height, 1.3);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);text-transform:uppercase}:host{display:block;line-height:0;overflow-y:auto}:host .menuWrapper{box-sizing:border-box;display:flex;flex-direction:column;width:100%;margin:0;padding:0}:host ::slotted(hr){box-sizing:content-box !important;height:0 !important;overflow:visible !important;margin:var(--ds-size-100, 0.5rem) 0 !important;border-width:0 !important;border-top-width:1px !important;border-top-style:solid !important}:host [loadingplaceholder].empty{opacity:0;position:absolute}:host [loadingplaceholder] slot[name=loadingIcon]{vertical-align:middle;display:inline-block;margin-bottom:var(--ds-size-25, 0.125rem)}:host [loadingplaceholder] slot[name=loadingIcon]::slotted(*){margin-right:var(--ds-size-150, 0.75rem)}:host([root]) .menuWrapper.lg{padding:var(--ds-size-150, 0.75rem);gap:var(--ds-size-50, 0.25rem)}:host([root]) .menuWrapper.xl{padding:var(--ds-size-200, 1rem);gap:var(--ds-size-100, 0.5rem)}`;
28
28
 
29
- var colorCss$1 = i$6`:host ::slotted(hr){border-top-color:var(--ds-auro-menu-divider-color)}[loadingplaceholder] slot[name=loadingIcon]{color:var(--ds-auro-menu-loader-color)}[loadingplaceholder] slot[name=loadingText]{color:var(--ds-auro-menu-loader-text-color)}`;
29
+ var colorCss$1 = i$5`:host ::slotted(hr){border-top-color:var(--ds-auro-menu-divider-color)}[loadingplaceholder] slot[name=loadingIcon]{color:var(--ds-auro-menu-loader-color)}[loadingplaceholder] slot[name=loadingText]{color:var(--ds-auro-menu-loader-text-color)}`;
30
30
 
31
- var tokensCss = i$6`:host{--ds-auro-menu-divider-color: var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15));--ds-auro-menu-loader-color: var(--ds-basic-color-brand-primary, #01426a);--ds-auro-menu-loader-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-menuoption-container-color: transparent;--ds-auro-menuoption-container-border-color: var(--ds-auro-menuoption-container-color);--ds-auro-menuoption-icon-color: transparent;--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
31
+ var tokensCss = i$5`:host{--ds-auro-menu-divider-color: var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15));--ds-auro-menu-loader-color: var(--ds-basic-color-brand-primary, #01426a);--ds-auro-menu-loader-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-menuoption-container-color: transparent;--ds-auro-menuoption-container-border-color: var(--ds-auro-menuoption-container-color);--ds-auro-menuoption-icon-color: transparent;--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
32
32
 
33
- class AuroElement extends i$3 {
33
+ class AuroElement extends i$2 {
34
34
  static get properties() {
35
35
  return {
36
36
 
@@ -134,753 +134,6 @@ class AuroElement extends i$3 {
134
134
  }
135
135
  }
136
136
 
137
- /**
138
- * @license
139
- * Copyright 2021 Google LLC
140
- * SPDX-License-Identifier: BSD-3-Clause
141
- */
142
- let s$3 = class s extends Event{constructor(s,t,e,o){super("context-request",{bubbles:true,composed:true}),this.context=s,this.contextTarget=t,this.callback=e,this.subscribe=o??false;}};
143
-
144
- /**
145
- * @license
146
- * Copyright 2021 Google LLC
147
- * SPDX-License-Identifier: BSD-3-Clause
148
- */
149
- function n$1(n){return n}
150
-
151
- /**
152
- * @license
153
- * Copyright 2021 Google LLC
154
- * SPDX-License-Identifier: BSD-3-Clause
155
- */let s$2 = class s{constructor(t,s,i,h){if(this.subscribe=false,this.provided=false,this.value=void 0,this.t=(t,s)=>{this.unsubscribe&&(this.unsubscribe!==s&&(this.provided=false,this.unsubscribe()),this.subscribe||this.unsubscribe()),this.value=t,this.host.requestUpdate(),this.provided&&!this.subscribe||(this.provided=true,this.callback&&this.callback(t,s)),this.unsubscribe=s;},this.host=t,void 0!==s.context){const t=s;this.context=t.context,this.callback=t.callback,this.subscribe=t.subscribe??false;}else this.context=s,this.callback=i,this.subscribe=h??false;this.host.addController(this);}hostConnected(){this.dispatchRequest();}hostDisconnected(){this.unsubscribe&&(this.unsubscribe(),this.unsubscribe=void 0);}dispatchRequest(){this.host.dispatchEvent(new s$3(this.context,this.host,this.t,this.subscribe));}};
156
-
157
- /**
158
- * @license
159
- * Copyright 2021 Google LLC
160
- * SPDX-License-Identifier: BSD-3-Clause
161
- */
162
- let s$1 = class s{get value(){return this.o}set value(s){this.setValue(s);}setValue(s,t=false){const i=t||!Object.is(s,this.o);this.o=s,i&&this.updateObservers();}constructor(s){this.subscriptions=new Map,this.updateObservers=()=>{for(const[s,{disposer:t}]of this.subscriptions)s(this.o,t);},void 0!==s&&(this.value=s);}addCallback(s,t,i){if(!i)return void s(this.value);this.subscriptions.has(s)||this.subscriptions.set(s,{disposer:()=>{this.subscriptions.delete(s);},consumerHost:t});const{disposer:h}=this.subscriptions.get(s);s(this.value,h);}clearCallbacks(){this.subscriptions.clear();}};
163
-
164
- /**
165
- * @license
166
- * Copyright 2021 Google LLC
167
- * SPDX-License-Identifier: BSD-3-Clause
168
- */let e$2 = class e extends Event{constructor(t,s){super("context-provider",{bubbles:true,composed:true}),this.context=t,this.contextTarget=s;}};let i$2 = class i extends s$1{constructor(s,e,i){super(void 0!==e.context?e.initialValue:i),this.onContextRequest=t=>{if(t.context!==this.context)return;const s=t.contextTarget??t.composedPath()[0];s!==this.host&&(t.stopPropagation(),this.addCallback(t.callback,s,t.subscribe));},this.onProviderRequest=s=>{if(s.context!==this.context)return;if((s.contextTarget??s.composedPath()[0])===this.host)return;const e=new Set;for(const[s,{consumerHost:i}]of this.subscriptions)e.has(s)||(e.add(s),i.dispatchEvent(new s$3(this.context,i,s,true)));s.stopPropagation();},this.host=s,void 0!==e.context?this.context=e.context:this.context=e,this.attachListeners(),this.host.addController?.(this);}attachListeners(){this.host.addEventListener("context-request",this.onContextRequest),this.host.addEventListener("context-provider",this.onProviderRequest);}hostConnected(){this.host.dispatchEvent(new e$2(this.context,this.host));}};
169
-
170
- /* eslint-disable */
171
-
172
- class MenuService {
173
-
174
- /**
175
- * PROPERTIES AND GETTERS
176
- */
177
-
178
- /**
179
- * Gets the list of registered menu options.
180
- * @returns {AuroMenuOption[]}
181
- */
182
- get menuOptions() {
183
- return this._menuOptions;
184
- }
185
-
186
- /**
187
- * Gets the currently highlighted option.
188
- * @returns {AuroMenuOption|null}
189
- */
190
- get highlightedOption() {
191
- return this._menuOptions[this.highlightedIndex] || null;
192
- }
193
-
194
- /**
195
- * Gets the current value(s) of the selected option(s).
196
- * @returns {string|string[]|undefined}
197
- */
198
- get currentValue() {
199
- const values = (this.selectedOptions || []).map(option => option.value);
200
- return this.multiSelect ? values : values[0];
201
- }
202
-
203
- /**
204
- * Gets the label(s) of the currently selected option(s).
205
- * @returns {string}
206
- */
207
- get currentLabel() {
208
- const labels = (this.selectedOptions || []).map(option => option.textContent);
209
- return this.multiSelect ? labels.join(", ") : labels[0] || '';
210
- }
211
-
212
- /**
213
- * Gets the string representation of the current value(s).
214
- * For multi-select, this is a JSON stringified array.
215
- * @returns {string|undefined}
216
- */
217
- get stringValue() {
218
- const { currentValue } = this;
219
-
220
- if (Array.isArray(currentValue)) {
221
- if (currentValue.length > 0) {
222
- return JSON.stringify(currentValue);
223
- }
224
- return undefined;
225
- }
226
-
227
- if (typeof currentValue === 'string') {
228
- if (currentValue.length > 0) {
229
- return currentValue;
230
- }
231
- return undefined;
232
- }
233
-
234
- // Future: handle other types here (e.g., number, object, etc.)
235
- return undefined;
236
- }
237
-
238
- /**
239
- * Gets the key(s) of the currently selected option(s).
240
- * @returns {string|string[]|undefined}
241
- */
242
- get currentKeys() {
243
- const keys = (this.selectedOptions || []).map(option => option.key);
244
- return this.multiSelect ? keys : keys[0];
245
- }
246
-
247
- /**
248
- * CONSTRUCTOR
249
- */
250
-
251
- /**
252
- * Creates a new MenuService instance.
253
- * @param {Object} options - The options object.
254
- * @param {AuroMenu} options.host - The host element that this service will control. Required.
255
- * @throws {Error} If the host is not provided.
256
- */
257
- constructor({ host } = {}) {
258
-
259
- // Ensure a host was passed
260
- if (!host) {
261
- throw new Error("MenuService requires a host element.");
262
- }
263
-
264
- // Attach the service to the host
265
- this.host = host;
266
- this.host.addController(this);
267
-
268
- // Set default properties
269
- this.size = undefined;
270
- this.shape = undefined;
271
- this.noCheckmark = undefined;
272
- this.disabled = undefined;
273
- this.matchWord = undefined;
274
- this.multiSelect = undefined;
275
- this.allowDeselect = undefined;
276
- this.selectAllMatchingOptions = undefined;
277
-
278
- this.highlightedIndex = -1;
279
-
280
- this._menuOptions = [];
281
- this._subscribers = [];
282
- this.internalUpdateInProgress = false;
283
- this.selectedOptions = [];
284
- this._pendingValue = null;
285
- this._pendingRetryScheduled = false;
286
- this._pendingRetryCount = 0;
287
- }
288
-
289
- /**
290
- * PROPERTY SYNCING
291
- */
292
-
293
- /**
294
- * Handles host updates.
295
- * This is a lit reactive lifecycle method.
296
- * This comes from the Lit controller interface provided by adding this service as a controller to the host.
297
- * See constructor for `this.host.addController(this)`
298
- * You can read more about Lit reactive controllers here: https://lit.dev/docs/composition/controllers/
299
- */
300
- hostUpdated() {
301
-
302
- // Reset selection if multiSelect mode changes
303
- if (this.host.multiSelect !== this.multiSelect) {
304
- this.selectedOptions = [];
305
- }
306
-
307
- // Update properties on host update
308
- this.setProperties({
309
- size: this.host.size,
310
- shape: this.host.shape,
311
- noCheckmark: this.host.noCheckmark,
312
- disabled: this.host.disabled,
313
- matchWord: this.host.matchWord,
314
- multiSelect: this.host.multiSelect,
315
- allowDeselect: this.host.allowDeselect,
316
- selectAllMatchingOptions: this.host.selectAllMatchingOptions
317
- });
318
- }
319
-
320
- /**
321
- * Handles host disconnection and memory cleanup.
322
- */
323
- hostDisconnected() {
324
- this._subscribers = [];
325
- this._menuOptions = [];
326
- this._pendingValue = null;
327
- this._pendingRetryScheduled = false;
328
- this._pendingRetryCount = 0;
329
- }
330
-
331
- /**
332
- * Sets a property value if it exists on the instance and the value has changed.
333
- * @param {string} property
334
- * @param {any} value
335
- */
336
- setProperty(property, value) {
337
-
338
- // Only update if we are tracking the property in this service
339
- if (this.hasOwnProperty(property)) {
340
-
341
- // Check if the value has changed
342
- const valueChanged = this[property] !== value;
343
-
344
- // Update and notify if changed
345
- if (valueChanged) {
346
- this[property] = value;
347
- this.notify({ property, value });
348
- }
349
- }
350
- }
351
-
352
- /**
353
- * Sets multiple properties on the instance.
354
- * @param {Object} properties - Key-value pairs of properties to set.
355
- */
356
- setProperties(properties) {
357
- for (const [key, value] of Object.entries(properties)) {
358
- this.setProperty(key, value);
359
- }
360
- }
361
-
362
- /**
363
- * MENU OPTION HIGHLIGHTING
364
- */
365
-
366
- /**
367
- * Highlights the next active option in the menu.
368
- */
369
- highlightNext() {
370
- this.moveHighlightedOption("next");
371
- }
372
-
373
- /**
374
- * Highlights the previous active option in the menu.
375
- */
376
- highlightPrevious() {
377
- this.moveHighlightedOption("previous");
378
- }
379
-
380
- /**
381
- * Moves the highlighted option in the specified direction.
382
- * @param {string} direction - The direction to move the highlight ("next" or "previous").
383
- */
384
- moveHighlightedOption(direction) {
385
-
386
- // Get the active options
387
- const activeOptions = this._menuOptions.filter(option => option.isActive);
388
-
389
- // Get the currently active option
390
- const currentActiveOption = activeOptions[activeOptions.indexOf(this.highlightedOption)];
391
-
392
- // Determine the new index based on the currently active option and direction
393
- let newIndex = currentActiveOption
394
- ? direction === "previous"
395
- ? activeOptions.indexOf(currentActiveOption) - 1
396
- : activeOptions.indexOf(currentActiveOption) + 1
397
- : direction === "previous"
398
- ? activeOptions.length - 1
399
- : 0;
400
-
401
- // Wrap around the index if needed
402
- newIndex = newIndex < 0 ? activeOptions.length - 1 : newIndex >= activeOptions.length ? 0 : newIndex;
403
-
404
- // Get the new active option and set it as highlighted
405
- const newActiveOption = activeOptions[newIndex];
406
- this.setHighlightedOption(newActiveOption);
407
- }
408
-
409
- /**
410
- * Sets the highlighted index to the specified option.
411
- * @param {AuroMenuOption} option - The option to highlight.
412
- */
413
- setHighlightedOption(option) {
414
-
415
- if (!option) return;
416
-
417
- // Get the index of the option to highlight
418
- const index = this._menuOptions.indexOf(option);
419
-
420
- // Update highlighted index
421
- this.highlightedIndex = index;
422
-
423
- // Notify subscribers of highlight change
424
- this.notify({ type: 'highlightChange', option, index: this.highlightedIndex });
425
-
426
- // Dispatch the change event
427
- this.dispatchChangeEvent('auroMenu-activatedOption', option);
428
- }
429
-
430
- /**
431
- * Sets the highlighted option to the option at the specified index if it exists.
432
- * @param {number} index
433
- */
434
- setHighlightedIndex(index) {
435
- const option = this._menuOptions[index] || null;
436
- this.setHighlightedOption(option);
437
- }
438
-
439
- /**
440
- * Selects the currently highlighted option.
441
- */
442
- selectHighlightedOption() {
443
- if (this.highlightedOption) {
444
- this.toggleOption(this.highlightedOption);
445
- }
446
- }
447
-
448
- /**
449
- * SELECTION AND DESELECTION METHODS
450
- */
451
-
452
- /**
453
- * Selects one or more options in a batch operation
454
- * @param {AuroMenuOption|AuroMenuOption[]} options - Single option or array of options to select
455
- */
456
- selectOptions(options) {
457
- let optionsToSelect = Array.isArray(options) ? options : [options];
458
-
459
- // Filter out options that are inactive
460
- optionsToSelect = optionsToSelect.filter(option => option.isActive);
461
-
462
- if (!optionsToSelect.length) return;
463
-
464
- if (this.multiSelect) {
465
- this.selectedOptions = [...(this.selectedOptions || []), ...optionsToSelect];
466
- } else {
467
- // In single select mode, only take the last option
468
- this.selectedOptions = [optionsToSelect[optionsToSelect.length - 1]];
469
- }
470
-
471
- this.stageUpdate();
472
- }
473
-
474
- /**
475
- * Deselects one or more options in a batch operation
476
- * @param {AuroMenuOption|AuroMenuOption[]} options - Single option or array of options to deselect
477
- */
478
- deselectOptions(options) {
479
- const optionsToDeselect = Array.isArray(options) ? options : [options];
480
-
481
- if (!optionsToDeselect.length) return;
482
-
483
- // Check if deselection should be prevented
484
- const shouldPreventDeselect = !this.allowDeselect && !this.multiSelect;
485
- const isOnlySelectedOption = this.selectedOptions.length === 1 && optionsToDeselect.includes(this.selectedOptions[0]);
486
-
487
- // Prevent deselecting the only selected option if not allowed
488
- if (shouldPreventDeselect && isOnlySelectedOption) {
489
- optionsToDeselect.forEach(option => {
490
- option.selected = true;
491
- });
492
- this.dispatchChangeEvent('auroMenu-deselectPrevented', {
493
- values: optionsToDeselect
494
- });
495
- return;
496
- }
497
-
498
- const optionsSet = new Set(optionsToDeselect);
499
- const previousCount = this.selectedOptions.length;
500
- this.selectedOptions = (this.selectedOptions || [])
501
- .filter(opt => !optionsSet.has(opt));
502
-
503
- if (this.selectedOptions.length < previousCount) {
504
- this.stageUpdate();
505
- }
506
- }
507
-
508
- /**
509
- * Selects a single option.
510
- * @param {AuroMenuOption} option
511
- */
512
- selectOption(option) {
513
- this.selectOptions(option);
514
- }
515
-
516
- /**
517
- * Deselects a single option.
518
- * @param {AuroMenuOption} option
519
- */
520
- deselectOption(option) {
521
- this.deselectOptions(option);
522
- }
523
-
524
- /**
525
- * Toggles the selection state of a single option.
526
- * @param {AuroMenuOption} option
527
- */
528
- toggleOption(option) {
529
- if (option.selected) {
530
- this.deselectOption(option);
531
- } else {
532
- this.selectOption(option);
533
- }
534
- }
535
-
536
- /**
537
- * Selects options based on their value(s) when compared to a passed value or values.
538
- * Value or values are normalized to an array of strings that can be matched to option keys.
539
- * @param {string|number|Array<string|number>} value - The value(s) to select.
540
- */
541
- selectByValue(value) {
542
- const isEmptyValue = value === undefined ||
543
- value === null ||
544
- (Array.isArray(value) && value.length === 0) ||
545
- (typeof value === 'string' && value.trim() === '');
546
-
547
- // Early exit for invalid/empty values
548
- if (isEmptyValue) {
549
- this.selectedOptions.forEach(opt => opt.selected = false);
550
- this.selectedOptions = [];
551
- return;
552
- }
553
-
554
- // If an internal update cycle is still in progress, defer value application
555
- // rather than dropping it.
556
- if (this.internalUpdateInProgress || this.host.internalUpdateInProgress) {
557
- this.queuePendingValue(value);
558
- return;
559
- }
560
-
561
- // Normalize values to array of strings
562
- const normalizedValues = this._getNormalizedValues(value);
563
-
564
- // Validate for single-select mode
565
- let validatedValues = normalizedValues;
566
- if (normalizedValues.length > 1 && !this.multiSelect) {
567
- console.warn("MenuService - Multiple values provided for single-select menu. Only the first value will be selected.");
568
- validatedValues = [normalizedValues[0]];
569
- }
570
-
571
- if (this._menuOptions.length === 0) {
572
- this.queuePendingValue(value);
573
- return;
574
- }
575
-
576
- // Find matching options by comparing available options to validated values
577
- const trackedKeys = new Set();
578
- const optionsToSelect = this._menuOptions.filter(option => {
579
- const passesFilter = validatedValues.includes(option.key);
580
- const alreadyTracked = trackedKeys.has(option.key);
581
- const isActive = option.isActive;
582
-
583
- trackedKeys.add(option.key);
584
-
585
- // Include the option in the options to be selected if it passes the filter check and
586
- // either hasn't been tracked yet or selectAllMatchingOptions is true
587
- return isActive && passesFilter && (!alreadyTracked || (alreadyTracked && this.selectAllMatchingOptions));
588
- });
589
-
590
- // Handle no matches: clear existing selection, but do not dispatch an intermediate
591
- // undefined value that can overwrite the host value in parent components.
592
- if (!optionsToSelect.length) {
593
- const hasUnresolvedKeys = this._menuOptions.some((option) => option.isActive && option.key == null);
594
-
595
- if (hasUnresolvedKeys) {
596
- this.queuePendingValue(value);
597
- return;
598
- }
599
-
600
- this.clearPendingValue();
601
-
602
- if (this.selectedOptions.length > 0) {
603
- this.selectedOptions = [];
604
- }
605
-
606
- // Always notify so the host resets any stale invalid value, even when
607
- // selectedOptions was already empty (e.g. double-clicking set-invalid).
608
- this.stageUpdate({ reason: 'no-match' });
609
-
610
- // Dispatch failure event if no matches found
611
- if (validatedValues.length) {
612
- this.dispatchChangeEvent('auroMenu-selectValueFailure', {
613
- message: 'No matching options found for the provided value(s).',
614
- values: validatedValues
615
- });
616
- }
617
-
618
- return;
619
- }
620
-
621
- this.clearPendingValue();
622
-
623
- if (this.optionsArraysMatch(optionsToSelect, this.selectedOptions)) {
624
- return;
625
- }
626
-
627
- // Apply programmatic selection as a single transaction and emit one final state.
628
- this.selectedOptions = optionsToSelect;
629
- this.stageUpdate();
630
- }
631
-
632
- /**
633
- * Queues a pending value and schedules a bounded retry.
634
- * @param {string|number|Array<string|number>} value - The value to retry.
635
- */
636
- queuePendingValue(value) {
637
- this._pendingValue = value;
638
-
639
- if (this._pendingRetryScheduled || this._pendingRetryCount >= 5) {
640
- return;
641
- }
642
-
643
- this._pendingRetryScheduled = true;
644
- this._pendingRetryCount += 1;
645
-
646
- setTimeout(() => {
647
- this._pendingRetryScheduled = false;
648
-
649
- if (this._pendingValue == null) {
650
- return;
651
- }
652
-
653
- const pendingValue = this._pendingValue;
654
- this.selectByValue(pendingValue);
655
- }, 0);
656
- }
657
-
658
- /**
659
- * Clears pending retry state.
660
- */
661
- clearPendingValue() {
662
- this._pendingValue = null;
663
- this._pendingRetryScheduled = false;
664
- this._pendingRetryCount = 0;
665
- }
666
-
667
- /**
668
- * Resets the selected options to an empty array.
669
- */
670
- reset() {
671
- const previousOptions = [...this.selectedOptions];
672
- previousOptions.forEach(opt => opt.selected = false);
673
- this.selectedOptions = [];
674
-
675
- // Single update after clearing all
676
- if (previousOptions.length) {
677
- this.stageUpdate();
678
- }
679
- }
680
-
681
- /**
682
- * SUBSCRIPTION, NOTIFICATION AND EVENT DISPATCH METHODS
683
- */
684
-
685
- /**
686
- * Subscribes a callback to menu service events.
687
- * @param {Function} callback - The callback to invoke on events.
688
- */
689
- subscribe(callback) {
690
- this._subscribers.push(callback);
691
- }
692
-
693
- /**
694
- * Remove a previously subscribed callback from menu service events.
695
- * @param {Function} callback
696
- */
697
- unsubscribe(callback) {
698
- this._subscribers = this._subscribers.filter(cb => cb !== callback);
699
- }
700
-
701
- /**
702
- * Stages an update to notify subscribers of state and value changes.
703
- */
704
- stageUpdate(meta = {}) {
705
- this.notifyStateChange(meta);
706
- this.notifyValueChange(meta);
707
- }
708
-
709
- /**
710
- * Notifies subscribers of a menu service event.
711
- * All notifications are sent to all subscribers.
712
- * @param {string} event - The event to send to subscribers.
713
- */
714
- notify(event) {
715
- this._subscribers.forEach(callback => callback(event));
716
- }
717
-
718
- /**
719
- * Notifies subscribers of a state change (selected options has changed).
720
- */
721
- notifyStateChange(meta = {}) {
722
- this.notify({
723
- type: 'stateChange',
724
- selectedOptions: this.selectedOptions,
725
- ...meta
726
- });
727
- }
728
-
729
- /**
730
- * Notifies subscribers of a value change (current value has changed).
731
- */
732
- notifyValueChange(meta = {}) {
733
-
734
- // Prepare details for the event
735
- const details = {
736
- value: this.currentValue,
737
- stringValue: this.stringValue,
738
- keys: this.currentKeys,
739
- options: this.selectedOptions,
740
- label: this.currentLabel
741
- };
742
-
743
- // If only one option is selected, include its index
744
- if (this.selectedOptions.length === 1) details.index = this._menuOptions.indexOf(this.selectedOptions[0]);
745
-
746
- this.notify({
747
- type: 'valueChange',
748
- ...meta,
749
- ...details
750
- });
751
- }
752
-
753
- /**
754
- * Dispatches a custom event from the host element.
755
- * @param {string} eventName
756
- * @param {any} detail
757
- */
758
- dispatchChangeEvent(eventName, detail) {
759
- this.host.dispatchEvent(new CustomEvent(eventName, {
760
- bubbles: true,
761
- cancelable: false,
762
- composed: true,
763
- detail
764
- }));
765
- }
766
-
767
- /**
768
- * MENU OPTION MANAGEMENT METHODS
769
- */
770
-
771
- /**
772
- * Adds a menu option to the service's list.
773
- * @param {AuroMenuOption} option - the option to track
774
- */
775
- addMenuOption(option) {
776
- this._menuOptions.push(option);
777
- this.notify({ type: 'optionsChange', options: this._menuOptions });
778
-
779
- if (this._pendingValue != null) {
780
- this.queuePendingValue(this._pendingValue);
781
- }
782
- }
783
-
784
- /**
785
- * Removes a menu option from the service's list.
786
- * @param {AuroMenuOption} option - the option to remove
787
- */
788
- removeMenuOption(option) {
789
- this._menuOptions = this._menuOptions.filter(opt => opt !== option);
790
- this.notify({ type: 'optionsChange', options: this._menuOptions });
791
-
792
- if (this._menuOptions.length === 0) {
793
- this.clearPendingValue();
794
- }
795
- }
796
-
797
- /**
798
- * UTILITIES
799
- */
800
-
801
- /**
802
- * Normalizes a value or array of values into an array of strings for option selection.
803
- * This function ensures that input values are consistently formatted for matching menu options.
804
- *
805
- * @param {string|number|Array<string|number>} value - The value(s) to normalize.
806
- * @returns {Array<string>} An array of string values suitable for option matching.
807
- * @throws {Error} If any value is not a string or number.
808
- */
809
- _getNormalizedValues(value) {
810
- let values = value;
811
-
812
- // Handle JSON string and single value string input
813
- if (!Array.isArray(values) && typeof values === 'string') {
814
-
815
- // Attempt to parse as JSON array
816
- try {
817
-
818
- // Normalize single quotes to double quotes for JSON parsing
819
- // This will not handle complex cases but will cover basic usage
820
- const parseValue = values.replace(/'([^']*?)'/g, '"$1"');
821
-
822
- // Attempt parse
823
- const parsed = JSON.parse(parseValue);
824
-
825
- // Ensure parsed value is an array
826
- if (!Array.isArray(parsed)) throw new Error('Not an array');
827
-
828
- // Set values to parsed array
829
- values = parsed;
830
- } catch (err) {
831
-
832
- // If parsing fails, treat as single value
833
- values = [value];
834
- }
835
- }
836
-
837
- // Handle a single number being passed
838
- if (typeof values === 'number') {
839
- values = [String(values)];
840
- }
841
-
842
- // Coerce each value to string and validate types
843
- values.forEach((val, index) => {
844
-
845
- // Throw an error for invalid value types
846
- if (typeof val !== 'string' && typeof val !== 'number') {
847
- throw new Error('Value contains invalid value type. Supported types are string and number.');
848
- }
849
-
850
- // Convert numbers to strings for consistency
851
- if (typeof val === 'number') {
852
- values[index] = String(val);
853
- }
854
- });
855
-
856
- // Return the resulting array of string values
857
- return values;
858
- }
859
-
860
- /**
861
- * Returns whether two arrays of options contain the same elements.
862
- * @param {AuroMenuOption[]} arr1 - First array of options.
863
- * @param {AuroMenuOption[]} arr2 - Second array of options.
864
- * @returns {boolean} True if arrays match, false otherwise.
865
- */
866
- optionsArraysMatch(arr1, arr2) {
867
- if (arr1.length !== arr2.length) return false;
868
-
869
- const set1 = new Set(arr1);
870
- const set2 = new Set(arr2);
871
-
872
- for (let item of set1) {
873
- if (!set2.has(item)) {
874
- return false;
875
- }
876
- }
877
-
878
- return true;
879
- }
880
- }
881
-
882
- const MenuContext = n$1('menu-context');
883
-
884
137
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
885
138
  // See LICENSE in the project root for license information.
886
139
 
@@ -968,6 +221,44 @@ class AuroLibraryRuntimeUtils {
968
221
  // See LICENSE in the project root for license information.
969
222
 
970
223
 
224
+ /**
225
+ * Serializes a multi-select value array back into the String `value` property.
226
+ * An empty (or missing) array collapses to `undefined` so an emptied selection
227
+ * clears `value` rather than reflecting a `"[]"` attribute.
228
+ * @private
229
+ * @param {Array<string>|undefined} values - The selected values.
230
+ * @returns {string|undefined} JSON string of the values, or undefined when empty.
231
+ */
232
+ function serializeMultiSelectValue(values) {
233
+ return values && values.length > 0 ? JSON.stringify(values) : undefined;
234
+ }
235
+
236
+ /**
237
+ * Validates if an option can be interacted with.
238
+ * @private
239
+ * @param {HTMLElement} option - The option to check.
240
+ * @returns {boolean} True if option is interactive.
241
+ */
242
+ function isOptionInteractive(option) {
243
+ return !option.hasAttribute('hidden') &&
244
+ !option.hasAttribute('disabled') &&
245
+ !option.hasAttribute('static');
246
+ }
247
+
248
+ /**
249
+ * Validates if an option may be selected by matching a programmatic value.
250
+ * Unlike `isOptionInteractive`, `hidden` is allowed: the combobox toggles
251
+ * `hidden` as its type-ahead filter, so a filtered-out option is still a
252
+ * valid programmatic selection. Only disabled and static options — which are
253
+ * never selectable — are rejected.
254
+ * @param {HTMLElement} option - The option to check.
255
+ * @returns {boolean} True if option can be selected by value.
256
+ */
257
+ function isSelectableByValue(option) {
258
+ return !option.hasAttribute('disabled') &&
259
+ !option.hasAttribute('static');
260
+ }
261
+
971
262
  /**
972
263
  * Helper method to dispatch custom events.
973
264
  * @param {HTMLElement} element - Element to dispatch event from.
@@ -1001,7 +292,7 @@ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});let i$1 = cl
1001
292
  * SPDX-License-Identifier: BSD-3-Clause
1002
293
  */const e=e$1(class extends i$1{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter(s=>t[s]).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return E}});
1003
294
 
1004
- /* eslint-disable no-underscore-dangle */
295
+ /* eslint-disable no-underscore-dangle, no-magic-numbers, max-lines, no-extra-parens, max-depth */
1005
296
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1006
297
  // See LICENSE in the project root for license information.
1007
298
 
@@ -1015,16 +306,12 @@ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});let i$1 = cl
1015
306
  * @event {CustomEvent<any>} auroMenu-customEventFired - Notifies that a custom event has been fired.
1016
307
  * @event {CustomEvent<{ loading: boolean; hasLoadingPlaceholder: boolean; }>} auroMenu-loadingChange - Notifies when the loading attribute is changed.
1017
308
  * @event {CustomEvent<any>} auroMenu-selectValueFailure - Notifies that an attempt to select a menuoption by matching a value has failed.
1018
- * @event {CustomEvent<{ values: HTMLElement[] }>} auroMenu-deselectPrevented - Notifies that deselection was prevented and includes the affected options in `detail.values`.
1019
309
  * @event {CustomEvent<any>} auroMenu-selectValueReset - Notifies that the component value has been reset.
1020
310
  * @event {CustomEvent<any>} auroMenu-selectedOption - Notifies that a new menuoption selection has been made.
1021
311
  * @slot loadingText - Text to show while loading attribute is set
1022
312
  * @slot loadingIcon - Icon to show while loading attribute is set
1023
313
  * @slot - Slot for insertion of menu options.
1024
314
  */
1025
-
1026
- /* eslint-disable max-lines */
1027
-
1028
315
  class AuroMenu extends AuroElement {
1029
316
 
1030
317
  constructor() {
@@ -1042,6 +329,8 @@ class AuroMenu extends AuroElement {
1042
329
  */
1043
330
  this.size = "sm";
1044
331
 
332
+ // Value of the selected options
333
+ this.value = undefined;
1045
334
  // Currently selected option
1046
335
  this.optionSelected = undefined;
1047
336
  // String used for highlighting/filtering
@@ -1054,13 +343,24 @@ class AuroMenu extends AuroElement {
1054
343
  this.loading = false;
1055
344
  // Multi-select mode
1056
345
  this.multiSelect = false;
1057
- // Allow deselecting of menu options
1058
- this.allowDeselect = false;
1059
- // Select all matching options when setting value in multi-select mode
1060
- this.selectAllMatchingOptions = false;
1061
346
 
1062
347
  // Event Bindings
1063
348
 
349
+ /**
350
+ * @private
351
+ */
352
+ this.handleKeyDown = this.handleKeyDown.bind(this);
353
+
354
+ /**
355
+ * @private
356
+ */
357
+ this.handleMouseSelect = this.handleMouseSelect.bind(this);
358
+
359
+ /**
360
+ * @private
361
+ */
362
+ this.handleOptionHover = this.handleOptionHover.bind(this);
363
+
1064
364
  /**
1065
365
  * @private
1066
366
  */
@@ -1087,14 +387,6 @@ class AuroMenu extends AuroElement {
1087
387
  return {
1088
388
  ...super.properties,
1089
389
 
1090
- /**
1091
- * Allows deselecting an already selected option when clicked again in single-select mode.
1092
- */
1093
- allowDeselect: {
1094
- type: Boolean,
1095
- reflect: true,
1096
- },
1097
-
1098
390
  /**
1099
391
  * When true, the entire menu and all options are disabled.
1100
392
  */
@@ -1103,20 +395,6 @@ class AuroMenu extends AuroElement {
1103
395
  reflect: true
1104
396
  },
1105
397
 
1106
- /**
1107
- * Indicates whether the menu has a loadingIcon or loadingText to render when in a loading state.
1108
- */
1109
- hasLoadingPlaceholder: {
1110
- type: Boolean
1111
- },
1112
-
1113
- /**
1114
- * @private
1115
- */
1116
- layout: {
1117
- type: String
1118
- },
1119
-
1120
398
  /**
1121
399
  * Indent level for submenus.
1122
400
  * @private
@@ -1163,60 +441,26 @@ class AuroMenu extends AuroElement {
1163
441
 
1164
442
  /**
1165
443
  * Specifies the current active menuOption.
444
+ * @readonly
1166
445
  */
1167
446
  optionActive: {
1168
447
  type: Object,
1169
- attribute: 'optionactive'
448
+ attribute: false
1170
449
  },
1171
450
 
1172
451
  /**
1173
- * An array of currently selected menu options, type `HTMLElement` by default. In multi-select mode, `optionSelected` is an array of HTML elements.
452
+ * The currently selected menu option(s). In single-select mode this is a single `HTMLElement` (or `undefined` when nothing is selected). In multi-select mode this is an array of `HTMLElement`s.
453
+ * @readonly
1174
454
  */
1175
455
  optionSelected: {
1176
456
  // Allow HTMLElement, HTMLElement[] arrays and undefined
1177
- type: Object
1178
- },
1179
-
1180
- /**
1181
- * Available menu options.
1182
- * @readonly
1183
- */
1184
- options: {
1185
- type: Array,
1186
- reflect: false,
457
+ type: Object,
1187
458
  attribute: false
1188
459
  },
1189
460
 
1190
- /**
1191
- * Sets the size of the menu.
1192
- * @type {'sm' | 'md'}
1193
- * @default 'sm'
1194
- */
1195
- size: {
1196
- type: String,
1197
- reflect: true
1198
- },
1199
-
1200
- /**
1201
- * When true, selects all options that match the provided value/key when setting value and multiselect is enabled.
1202
- */
1203
- selectAllMatchingOptions: {
1204
- type: Boolean,
1205
- reflect: true,
1206
- },
1207
-
1208
- /**
1209
- * Sets the shape of the menu.
1210
- * @type {'box' | 'round'}
1211
- * @default 'box'
1212
- */
1213
- shape: {
1214
- type: String,
1215
- reflect: true
1216
- },
1217
-
1218
461
  /**
1219
462
  * The value of the selected option. In multi-select mode, this is a JSON stringified array of selected option values.
463
+ * Options marked `disabled` or `static` are not selectable by value; `hidden` options remain selectable. In single-select mode, if the value matches a non-selectable option the selection is cleared (`optionSelected` becomes `undefined`) and `auroMenu-selectValueFailure` is dispatched. In multi-select mode, non-selectable entries are dropped from the value and the remaining selectable entries are selected; `auroMenu-selectValueFailure` is dispatched only when none of the entries match a selectable option.
1220
464
  */
1221
465
  value: {
1222
466
  type: String,
@@ -1234,40 +478,9 @@ class AuroMenu extends AuroElement {
1234
478
  ];
1235
479
  }
1236
480
 
1237
- /**
1238
- * @readonly
1239
- * @returns {string} - Returns the label of the currently selected option(s).
1240
- */
1241
- get currentLabel() {
1242
- return this.menuService.currentLabel;
1243
- };
1244
-
1245
- /**
1246
- * @readonly
1247
- * @returns {Array<HTMLElement>} - Returns the array of available menu options.
1248
- * @deprecated Use `options` property instead.
1249
- */
1250
- get items() {
1251
- return this.options;
1252
- }
1253
-
1254
- /**
1255
- * @returns {number} - Returns the index of the currently active option.
1256
- */
1257
- get index() {
1258
- return this._index;
1259
- }
1260
-
1261
- /**
1262
- * @param {number} value - Sets the index of the currently active option.
1263
- */
1264
- set index(value) {
1265
- this.menuService.setHighlightedIndex(value);
1266
- }
1267
-
1268
481
  /**
1269
482
  * This will register this element with the browser.
1270
- * @param {string} [name="auro-menu"] - The name of the element that you want to register.
483
+ * @param {string} [name="auro-menu"] - The name of element that you want to register to.
1271
484
  *
1272
485
  * @example
1273
486
  * AuroMenu.register("custom-menu") // this will register this element to <custom-menu/>
@@ -1278,126 +491,116 @@ class AuroMenu extends AuroElement {
1278
491
  }
1279
492
 
1280
493
  /**
1281
- * Formatted value based on `multiSelect` state.
1282
- * Default type is `String`, changing to `Array<String>` when `multiSelect` is true.
1283
- * @private
1284
- * @returns {String|Array<String>}
494
+ * @readonly
495
+ * @returns {Array<HTMLElement>} - Returns the array of available menu options.
496
+ */
497
+ get options() {
498
+ return this.items;
499
+ }
500
+
501
+ /**
502
+ * @returns {number} - Returns the index of the currently active option.
1285
503
  */
1286
- get formattedValue() {
1287
- return this.menuService.currentValue;
504
+ get index() {
505
+ return this._index;
1288
506
  }
1289
507
 
1290
508
  /**
1291
- * Gets the current property values for the menu service.
1292
- * @private
1293
- * @returns {Object}
509
+ * @param {number} value - Sets the index of the currently active option.
1294
510
  */
1295
- get propertyValues() {
1296
- return {
1297
- size: this.size,
1298
- shape: this.shape,
1299
- noCheckmark: this.nocheckmark,
1300
- disabled: this.disabled
1301
- };
511
+ set index(value) {
512
+ this.updateActiveOption(value);
1302
513
  }
1303
514
 
1304
515
  /**
1305
- * Provides the menu context to child components.
1306
- * Initializes the MenuService and subscribes to menu changes.
1307
- * @protected
516
+ * Gets the currently selected options as an array.
517
+ * @returns {Array<HTMLElement>}
1308
518
  */
1309
- provideContext() {
1310
- if (this.parentElement && this.parentElement.closest('auro-menu, [auro-menu]')) {
1311
- this.rootMenu = false;
1312
- this.menuService = this.parentElement.menuService;
1313
- this._contextProvider = this.parentElement._contextProvider;
1314
- return;
519
+ get selectedOptions() {
520
+ if (!this.optionSelected) {
521
+ return [];
1315
522
  }
1316
-
1317
- this.menuService = new MenuService({host: this});
1318
- this.menuService.setProperties(this.propertyValues);
1319
- this.menuService.subscribe(this.handleMenuChange.bind(this));
1320
- this._contextProvider = new i$2(this, {
1321
- context: MenuContext,
1322
- initialValue: this.menuService
1323
- });
523
+ if (Array.isArray(this.optionSelected)) {
524
+ return this.optionSelected;
525
+ }
526
+ return [this.optionSelected];
1324
527
  }
1325
528
 
1326
529
  /**
1327
- * Updates the currently active option in the menu.
1328
- * @param {HTMLElement} option - The option to set as active.
530
+ * Gets the first selected option, or null if none.
531
+ * @returns {HTMLElement|null}
1329
532
  */
1330
- updateActiveOption(option) {
1331
- this.menuService.setHighlightedOption(option);
533
+ get selectedOption() {
534
+ const opts = this.selectedOptions;
535
+ return opts.length > 0 ? opts[0] : null;
1332
536
  }
1333
537
 
1334
538
  /**
1335
- * Sets the internal value and manages update state.
1336
- * @param {String|Array<String>} value - The value to set.
1337
- * @protected
539
+ * @readonly
540
+ * @returns {string} - Returns the label of the currently selected option(s).
1338
541
  */
1339
- setInternalValue(value) {
1340
- if (this.value !== value) {
1341
- this.internalUpdateInProgress = true;
1342
- this.value = value;
1343
-
1344
- setTimeout(() => {
1345
- this.internalUpdateInProgress = false;
1346
- });
542
+ get currentLabel() {
543
+ if (!this.optionSelected) {
544
+ return '';
1347
545
  }
546
+ if (Array.isArray(this.optionSelected)) {
547
+ return this.optionSelected.map((opt) => opt.textContent).join(', ');
548
+ }
549
+ return this.optionSelected.textContent || '';
1348
550
  }
1349
551
 
1350
552
  /**
1351
- * Handles changes from the menu service and updates component state.
1352
- * @param {Object} event - The event object from the menu service.
1353
- * @protected
553
+ * Formatted value based on `multiSelect` state.
554
+ * Default type is `String`, changing to `Array<String>` when `multiSelect` is true.
555
+ * @private
556
+ * @returns {String|Array<String>}
1354
557
  */
1355
- handleMenuChange(event) {
1356
- if (event.type === 'valueChange') {
1357
-
1358
- // New option is array value or first option with fallback to undefined for empty array in all cases
1359
- const newOption = this.multiSelect && event.options.length ? event.options : event.options[0] || undefined;
1360
- const newValue = event.stringValue;
1361
-
1362
- // Check if the option or value has actually changed
1363
- if (this.optionSelected !== newOption || this.stringValue !== newValue) {
1364
- this.optionSelected = newOption;
1365
- this.setInternalValue(newValue);
558
+ get formattedValue() {
559
+ if (this.multiSelect) {
560
+ if (!this.value) {
561
+ return undefined;
1366
562
  }
1367
-
1368
- // Notify components of selection change
1369
- this.notifySelectionChange(event);
1370
- }
1371
-
1372
- if (event.type === 'highlightChange') {
1373
- this.optionActive = event.option;
1374
- this._index = event.index;
1375
- }
1376
-
1377
- if (event.type === 'optionsChange') {
1378
- this.options = event.options;
1379
- this.dispatchEvent(new CustomEvent('auroMenu-optionsChange', {
1380
- detail: {
1381
- options: event.options
563
+ // Defensive: `value` is declared as String, but consumers may assign arrays or other
564
+ // types programmatically. Normalize without throwing so render/update never hard-crashes.
565
+ if (Array.isArray(this.value)) {
566
+ return this.value;
567
+ }
568
+ if (typeof this.value !== 'string') {
569
+ return [String(this.value)];
570
+ }
571
+ if (this.value.startsWith("[")) {
572
+ // Malformed JSON (e.g. a literal string that happens to start with "[") falls back
573
+ // to a single-item array rather than throwing during render.
574
+ try {
575
+ // any valid JSON starting with `[` ALWAYS parses to an array
576
+ return JSON.parse(this.value);
577
+ } catch {
578
+ return [this.value];
1382
579
  }
1383
- }));
580
+ }
581
+ return [this.value];
1384
582
  }
583
+ return this.value;
1385
584
  }
1386
585
 
1387
586
  /**
1388
- * Gets the currently selected options.
1389
- * @returns {Array<HTMLElement>}
587
+ * Selects options by value. Options marked `disabled` or `static` are not selectable; `hidden` options remain selectable. In single-select mode, if the value matches a non-selectable option the selection is cleared and `auroMenu-selectValueFailure` is dispatched. In multi-select mode, non-selectable entries are dropped and the remaining selectable entries are selected; `auroMenu-selectValueFailure` is dispatched only when none of the entries match a selectable option. Passing `undefined`, `null`, an empty string, or an empty array clears the selection without dispatching a failure.
588
+ * @param {string|string[]|undefined|null} value - The value(s) to select.
589
+ * @public
1390
590
  */
1391
- get selectedOptions() {
1392
- return this.menuService ? this.menuService.selectedOptions : [];
1393
- }
591
+ selectByValue(value) {
592
+ const isEmpty = value === undefined ||
593
+ value === null ||
594
+ (Array.isArray(value) && value.length === 0) ||
595
+ (typeof value === 'string' && value.trim() === '');
1394
596
 
1395
- /**
1396
- * Gets the first selected option, or null if none.
1397
- * @returns {HTMLElement|null}
1398
- */
1399
- get selectedOption() {
1400
- return this.menuService ? this.menuService.selectedOptions[0] : null;
597
+ if (isEmpty) {
598
+ this.clearSelection();
599
+ return;
600
+ }
601
+
602
+ // `value` is a String property; stringify arrays so attribute reflection and `formattedValue` parsing stay correct.
603
+ this.value = Array.isArray(value) ? JSON.stringify(value) : value;
1401
604
  }
1402
605
 
1403
606
  // Lifecycle Methods
@@ -1405,9 +608,7 @@ class AuroMenu extends AuroElement {
1405
608
  connectedCallback() {
1406
609
  super.connectedCallback();
1407
610
 
1408
- this.provideContext();
1409
-
1410
- // this.addEventListener('keydown', this.handleKeyDown);
611
+ this.addEventListener('keydown', this.handleKeyDown);
1411
612
  this.addEventListener('auroMenuOption-click', this.handleMouseSelect);
1412
613
  this.addEventListener('auroMenuOption-mouseover', this.handleOptionHover);
1413
614
  this.addEventListener('slotchange', this.handleSlotChange);
@@ -1415,7 +616,7 @@ class AuroMenu extends AuroElement {
1415
616
  }
1416
617
 
1417
618
  disconnectedCallback() {
1418
- // this.removeEventListener('keydown', this.handleKeyDown);
619
+ this.removeEventListener('keydown', this.handleKeyDown);
1419
620
  this.removeEventListener('auroMenuOption-click', this.handleMouseSelect);
1420
621
  this.removeEventListener('auroMenuOption-mouseover', this.handleOptionHover);
1421
622
  this.removeEventListener('slotchange', this.handleSlotChange);
@@ -1430,25 +631,140 @@ class AuroMenu extends AuroElement {
1430
631
  this.initializeMenu();
1431
632
  }
1432
633
 
634
+ /**
635
+ * Sets an attribute that matches the default tag name if the tag name is not the default.
636
+ * @param {string} tagName - The tag name to set as an attribute.
637
+ * @private
638
+ */
639
+ setTagAttribute(tagName) {
640
+ if (this.tagName.toLowerCase() !== tagName) {
641
+ this.setAttribute(tagName, true);
642
+ }
643
+ }
1433
644
 
645
+ // eslint-disable-next-line complexity
1434
646
  updated(changedProperties) {
1435
647
  super.updated(changedProperties);
1436
648
 
1437
- // Apply value selection synchronously so that static-HTML fixtures
1438
- // resolve within a single update cycle. The refactored selectByValue
1439
- // no longer calls reset() first, so the destructive intermediate-event
1440
- // cascade that originally required deferral is eliminated. If option
1441
- // keys are not yet resolved (framework mount-order race), selectByValue
1442
- // queues a bounded retry automatically via queuePendingValue.
1443
- if (changedProperties.has('value') && !this.internalUpdateInProgress) {
1444
- this.menuService.selectByValue(this.value);
649
+ // Single source of truth for 'auroMenu-selectedOption'. Selection handlers
650
+ // mutate optionSelected and let Lit's update cycle dispatch here; the prior
651
+ // .value comparison missed multi-select array changes and combined with the
652
+ // explicit calls in handleDeselectState/makeSelection produced 2-3 duplicate
653
+ // events per selection.
654
+ if (changedProperties.has('optionSelected')) {
655
+ this.notifySelectionChange();
1445
656
  }
1446
657
 
1447
- // Handle loading state changes
1448
- if (changedProperties.has('loading')) {
1449
- this.setLoadingState(this.loading);
658
+ // Reset selection if multiSelect mode changes
659
+ if (changedProperties.has('multiSelect') && !changedProperties.has("value")) {
660
+ this.clearSelection();
661
+ }
662
+
663
+ if (changedProperties.has("value")) {
664
+ // Ensure items are populated before matching. `firstUpdated` normally initializes them,
665
+ // but a `value` change can arrive before slotted options are appended (e.g. parent sets
666
+ // value before children render). Without this guard, matching against an empty `items`
667
+ // would falsely dispatch `auroMenu-selectValueFailure` for valid initial values.
668
+ if (!this.items) {
669
+ this.initItems();
670
+ }
671
+
672
+ // Set when reconciliation reassigns `value` below. That reassignment schedules a
673
+ // second updated() cycle, so the `event`-attribute dispatch is deferred to that
674
+ // cycle to avoid firing option custom events twice on the same selection.
675
+ let valueReconciled = false;
676
+
677
+ // Handle null/undefined/empty case — empty/whitespace strings clear selection
678
+ // consistently with selectByValue(''), and avoid downstream `.includes('')` matches.
679
+ if (this.value === undefined || this.value === null || (typeof this.value === 'string' && this.value.trim() === '')) {
680
+ this.clearSelection();
681
+ } else {
682
+ let newSelected = null;
683
+
684
+ if (this.multiSelect) {
685
+ // In multiselect mode, this.value should be an array of strings.
686
+ // Defensive default: `formattedValue` can be undefined for unexpected value types,
687
+ // and calling `.includes` on undefined would throw during reconciliation.
688
+ const valueArray = this.formattedValue || [];
689
+ const matchingOptions = this.items ? this.items.filter((item) => isSelectableByValue(item) && valueArray.includes(item.value)) : [];
690
+ newSelected = matchingOptions.length > 0 ? matchingOptions : undefined;
691
+
692
+ // Reconcile `value` with the selectable set. Drop only entries whose option is
693
+ // loaded but non-selectable (disabled/static) — leaving them would desync `value`
694
+ // from `optionSelected`, and the toggle handlers rebuild `value` from `formattedValue`,
695
+ // so the rejected entry would resurface on the next select/deselect. Entries with no
696
+ // matching item yet are preserved so async preselection still works once options render.
697
+ const rejectedValues = this.items
698
+ ? this.items.filter((item) => !isSelectableByValue(item) && valueArray.includes(item.value)).map((item) => item.value)
699
+ : [];
700
+ if (rejectedValues.length > 0) {
701
+ const reconciled = valueArray.filter((val) => !rejectedValues.includes(val));
702
+ this.value = serializeMultiSelectValue(reconciled);
703
+ valueReconciled = true;
704
+ }
705
+ } else {
706
+ // In single-select mode, this.value should be a string. Reject
707
+ // disabled/static options so a programmatic value pointing at a
708
+ // non-selectable option falls through to the no-match path below
709
+ // (dispatching auroMenu-selectValueFailure) instead of pinning it.
710
+ // `hidden` is intentionally NOT excluded: the combobox toggles
711
+ // `hidden` as its type-ahead filter, so a filtered-out option is
712
+ // still a valid programmatic selection.
713
+ const matchingOption = this.items ? this.items.find((item) => isSelectableByValue(item) && item.value === this.value) : undefined;
714
+
715
+ if (matchingOption) {
716
+ newSelected = matchingOption;
717
+ this._index = this.items.indexOf(matchingOption);
718
+ } else {
719
+ // If no matching option found, reset selection
720
+ newSelected = undefined;
721
+ this._index = -1;
722
+ }
723
+ }
724
+
725
+ // If no matching options were found in either mode
726
+ if (!newSelected || (Array.isArray(newSelected) && newSelected.length === 0)) {
727
+ // Defer failure when no options are loaded yet (async pattern: parent sets
728
+ // value before slotted options render). handleSlotChange re-runs matching
729
+ // once items arrive. Without this guard, a valid preselected value gets
730
+ // cleared by the failure listener before options ever exist to match against.
731
+ const hasItemsToMatch = this.items && this.items.length > 0;
732
+ if (hasItemsToMatch) {
733
+ // Clear state BEFORE dispatching so synchronous listeners (e.g. auro-select's
734
+ // updateDisplayedValue) read fresh `optionSelected` rather than the stale prior
735
+ // selection and re-render the old label.
736
+ if (this.optionSelected !== undefined) {
737
+ this.optionSelected = undefined;
738
+ }
739
+ this._index = -1;
740
+ dispatchMenuEvent(this, 'auroMenu-selectValueFailure');
741
+ }
742
+ } else if (!this.selectionEquals(this.optionSelected, newSelected)) {
743
+ this.optionSelected = newSelected;
744
+ }
745
+ }
746
+
747
+ // Update UI state
748
+ this.updateItemsState(new Map([
749
+ [
750
+ 'optionSelected',
751
+ true
752
+ ]
753
+ ]));
754
+
755
+ // Notify of changes. Skip when reconciliation just reassigned `value`: the
756
+ // follow-on update cycle re-runs this branch and fires the events exactly once.
757
+ if (this.optionSelected !== undefined && !valueReconciled) {
758
+ const selected = Array.isArray(this.optionSelected) ? this.optionSelected : [this.optionSelected];
759
+ selected.forEach((opt) => {
760
+ if (opt.hasAttribute('event')) {
761
+ this.handleCustomEvent(opt);
762
+ }
763
+ });
764
+ }
1450
765
  }
1451
766
 
767
+ // Process all other UI updates
1452
768
  if (changedProperties.has('multiSelect') && this.rootMenu) {
1453
769
  if (this.multiSelect) {
1454
770
  this.setAttribute('aria-multiselectable', 'true');
@@ -1456,30 +772,129 @@ class AuroMenu extends AuroElement {
1456
772
  this.removeAttribute('aria-multiselectable');
1457
773
  }
1458
774
  }
775
+
776
+ this.updateItemsState(changedProperties);
1459
777
  }
1460
778
 
1461
779
  /**
1462
- * Sets an attribute that matches the default tag name if the tag name is not the default.
1463
- * @param {string} tagName - The tag name to set as an attribute.
780
+ * Updates the UI state and appearance of menu items based on changed properties.
1464
781
  * @private
782
+ * @param {Map<string, boolean>} changedProperties - LitElement's changed properties map.
1465
783
  */
1466
- setTagAttribute(tagName) {
1467
- if (this.tagName.toLowerCase() !== tagName) {
1468
- this.setAttribute(tagName, true);
784
+ updateItemsState(changedProperties) {
785
+ // Handle loading state changes
786
+ if (changedProperties.has('loading')) {
787
+ this.setAttribute("aria-busy", this.loading);
788
+ dispatchMenuEvent(this, "auroMenu-loadingChange", {
789
+ loading: this.loading,
790
+ hasLoadingPlaceholder: this.hasLoadingPlaceholder
791
+ });
1469
792
  }
1470
- }
1471
793
 
1472
- /**
1473
- * Sets the loading state and dispatches a loading change event.
1474
- * @param {boolean} isLoading - Whether the menu is loading.
1475
- * @protected
1476
- */
1477
- setLoadingState(isLoading) {
1478
- this.setAttribute("aria-busy", isLoading);
1479
- dispatchMenuEvent(this, "auroMenu-loadingChange", {
1480
- loading: isLoading,
1481
- hasLoadingPlaceholder: this.hasLoadingPlaceholder
794
+ if (!this.items) {
795
+ return;
796
+ }
797
+
798
+ // Handle noCheckmark propagation to all menus and options.
799
+ // Propagate in both directions so toggling back to false also clears nested elements
800
+ // (otherwise nested menus/options would stay stuck in no-checkmark mode).
801
+ if (changedProperties.has('noCheckmark')) {
802
+ this.querySelectorAll('auro-menu, [auro-menu], auro-menuoption, [auro-menuoption]').forEach((element) => {
803
+ element.noCheckmark = this.noCheckmark;
804
+ });
805
+ }
806
+
807
+ // Handle layout propagation to all menus and options.
808
+ // Skip elements that had size/shape set by the author (marked in initItems);
809
+ // explicit per-option overrides must survive menu-level propagation.
810
+ const propagationTargets = this.querySelectorAll('auro-menu, [auro-menu], auro-menuoption, [auro-menuoption]');
811
+ [
812
+ 'size',
813
+ 'shape'
814
+ ].forEach((prop) => {
815
+ if (changedProperties.has(prop)) {
816
+ const explicitKey = prop === 'size' ? '_explicitSize' : '_explicitShape';
817
+ propagationTargets.forEach((el) => {
818
+ if (el[explicitKey]) {
819
+ return;
820
+ }
821
+ el.setAttribute(prop, this[prop]);
822
+ });
823
+ }
824
+ });
825
+
826
+ // Regex for matchWord if needed
827
+ let regexWord = null;
828
+
829
+ if (changedProperties.has('matchWord') && this.matchWord && this.matchWord.length) {
830
+ const escapedWord = this.matchWord.replace(/[.*+?^${}()|[\]\\]/gu, '\\$&');
831
+ regexWord = new RegExp(escapedWord, 'giu');
832
+ }
833
+
834
+ // Handle direct item updates
835
+ this.items.forEach((option) => {
836
+ // Update selection if option or value changed
837
+ if (changedProperties.has('optionSelected') || changedProperties.has('value')) {
838
+ const isSelected = this.isOptionSelected(option);
839
+ option.setAttribute('aria-selected', isSelected ? 'true' : 'false');
840
+
841
+ // Add/remove selected attribute based on state
842
+ if (isSelected) {
843
+ option.setAttribute('selected', '');
844
+ } else {
845
+ option.removeAttribute('selected');
846
+ }
847
+ }
848
+
849
+ // Update text highlighting if matchWord changed
850
+ if (changedProperties.has('matchWord') && regexWord &&
851
+ isOptionInteractive(option) && !option.hasAttribute('persistent')) {
852
+ // Create nested spacers
853
+ const nested = option.querySelectorAll('.nestingSpacer');
854
+
855
+ const displayValueEl = option.querySelector('[slot="displayValue"]');
856
+ if (displayValueEl) {
857
+ option.removeChild(displayValueEl);
858
+ }
859
+
860
+ // Build highlighted content via DOM APIs rather than innerHTML so any
861
+ // `<`, `>`, or `&` in the option text renders literally (prevents XSS).
862
+ const originalText = option.textContent;
863
+ option.textContent = '';
864
+
865
+ nested.forEach(() => {
866
+ const spacer = document.createElement('span');
867
+ spacer.className = 'nestingSpacer';
868
+ option.appendChild(spacer);
869
+ });
870
+
871
+ const matches = [...originalText.matchAll(regexWord)];
872
+ let lastIndex = 0;
873
+ matches.forEach((match) => {
874
+ const [matchText] = match;
875
+ if (match.index > lastIndex) {
876
+ option.appendChild(document.createTextNode(originalText.slice(lastIndex, match.index)));
877
+ }
878
+ const strong = document.createElement('strong');
879
+ strong.textContent = matchText;
880
+ option.appendChild(strong);
881
+ lastIndex = match.index + matchText.length;
882
+ });
883
+ if (lastIndex < originalText.length) {
884
+ option.appendChild(document.createTextNode(originalText.slice(lastIndex)));
885
+ }
886
+
887
+ if (displayValueEl) {
888
+ option.append(displayValueEl);
889
+ }
890
+ }
891
+
892
+ // Update disabled state
893
+ if (changedProperties.has('disabled')) {
894
+ option.disabled = this.disabled;
895
+ }
1482
896
  });
897
+
1483
898
  }
1484
899
 
1485
900
  // Init Methods
@@ -1489,6 +904,7 @@ class AuroMenu extends AuroElement {
1489
904
  * @private
1490
905
  */
1491
906
  initializeMenu() {
907
+ this.initItems();
1492
908
  if (this.rootMenu) {
1493
909
  this.setAttribute('role', 'listbox');
1494
910
  this.setAttribute('root', '');
@@ -1498,15 +914,111 @@ class AuroMenu extends AuroElement {
1498
914
  }
1499
915
  }
1500
916
 
917
+ // Must run for nested menus too — sets level, role="group", and aria-label="submenu" based on parent.
1501
918
  this.handleNestedMenus(this);
1502
919
  }
1503
920
 
1504
921
  /**
1505
- * Selects the currently highlighted option.
1506
- * @protected
922
+ * Initializes menu items and their attributes.
923
+ * @private
1507
924
  */
1508
- makeSelection() {
1509
- this.menuService.selectHighlightedOption();
925
+ initItems() {
926
+ const found = Array.from(this.querySelectorAll('auro-menuoption, [auro-menuoption]'));
927
+ this.items = found.length > 0 ? found : undefined;
928
+
929
+ // Record whether each propagation target had an author-set size/shape attribute
930
+ // BEFORE menu has had a chance to propagate. Marker is set once per element so a
931
+ // later menu-driven setAttribute doesn't re-flag the element as "explicit".
932
+ this.querySelectorAll('auro-menu, [auro-menu], auro-menuoption, [auro-menuoption]').forEach((el) => {
933
+ if (el._explicitSize === undefined) {
934
+ el._explicitSize = el.hasAttribute('size');
935
+ }
936
+ if (el._explicitShape === undefined) {
937
+ el._explicitShape = el.hasAttribute('shape');
938
+ }
939
+ });
940
+
941
+ if (this.noCheckmark) {
942
+ this.updateItemsState(new Map([
943
+ [
944
+ 'noCheckmark',
945
+ true
946
+ ]
947
+ ]));
948
+ }
949
+
950
+ this.dispatchEvent(new CustomEvent('auroMenu-optionsChange', {
951
+ detail: {
952
+ options: this.items
953
+ }
954
+ }));
955
+ }
956
+
957
+ // Logic Methods
958
+
959
+ /**
960
+ * Updates menu state when an option is selected.
961
+ * @private
962
+ * @param {HTMLElement} option - The option element to select.
963
+ */
964
+ handleSelectState(option) {
965
+ if (this.multiSelect) {
966
+ const currentValue = this.formattedValue || [];
967
+ const currentSelected = this.optionSelected || [];
968
+
969
+ if (!currentValue.includes(option.value)) {
970
+ this.value = serializeMultiSelectValue([
971
+ ...currentValue,
972
+ option.value
973
+ ]);
974
+ }
975
+ if (!currentSelected.includes(option)) {
976
+ this.optionSelected = [
977
+ ...currentSelected,
978
+ option
979
+ ];
980
+ }
981
+ } else {
982
+ this.value = option.value;
983
+ this.optionSelected = option;
984
+ }
985
+
986
+ this._index = this.items.indexOf(option);
987
+ }
988
+
989
+ /**
990
+ * Deselects a menu option and updates related state.
991
+ * @private
992
+ * @param {HTMLElement} option - The menuoption to be deselected.
993
+ */
994
+ handleDeselectState(option) {
995
+ if (this.multiSelect) {
996
+ // Remove this option from array; an empty result collapses `value` to undefined.
997
+ const newFormattedValue = (this.formattedValue || []).filter((val) => val !== option.value);
998
+ this.value = serializeMultiSelectValue(newFormattedValue);
999
+
1000
+ this.optionSelected = this.optionSelected.filter((val) => val !== option);
1001
+ if (this.optionSelected.length === 0) {
1002
+ this.optionSelected = undefined;
1003
+ }
1004
+ } else {
1005
+ // For single-select: Back to undefined when deselected
1006
+ this.value = undefined;
1007
+ this.optionSelected = undefined;
1008
+ }
1009
+
1010
+ // Update the index tracking
1011
+ this._index = this.items.indexOf(option);
1012
+
1013
+ // Update UI to reflect changes
1014
+ this.updateItemsState(new Map([
1015
+ [
1016
+ 'optionSelected',
1017
+ true
1018
+ ]
1019
+ ]));
1020
+
1021
+ // Notification happens via updated() when optionSelected changes above.
1510
1022
  }
1511
1023
 
1512
1024
  /**
@@ -1525,7 +1037,23 @@ class AuroMenu extends AuroElement {
1525
1037
  * @public
1526
1038
  */
1527
1039
  reset() {
1528
- this.menuService.reset();
1040
+ // Reset to undefined - initial state
1041
+ this.value = undefined;
1042
+ this.optionSelected = undefined;
1043
+ this._index = -1;
1044
+
1045
+ // Clear active option state so a follow-up open/navigation starts fresh
1046
+ // rather than reusing a stale reference from before the reset.
1047
+ this.items?.forEach((item) => item.classList.remove('active'));
1048
+ this.optionActive = undefined;
1049
+
1050
+ // Reset UI state
1051
+ this.updateItemsState(new Map([
1052
+ [
1053
+ 'optionSelected',
1054
+ true
1055
+ ]
1056
+ ]));
1529
1057
 
1530
1058
  // Dispatch reset event
1531
1059
  dispatchMenuEvent(this, 'auroMenu-selectValueReset');
@@ -1537,6 +1065,14 @@ class AuroMenu extends AuroElement {
1537
1065
  * @param {HTMLElement} menu - Root menu element.
1538
1066
  */
1539
1067
  handleNestedMenus(menu) {
1068
+ // Slot changes can fire on a menu mid-teardown (e.g. while a parent menu
1069
+ // is removing children to rebuild its content). In that window the menu
1070
+ // is detached and parentElement is null. Skip — handleNestedMenus will
1071
+ // run again when the menu is reattached.
1072
+ if (!menu.parentElement) {
1073
+ return;
1074
+ }
1075
+
1540
1076
  menu.level = menu.parentElement.level >= 0 ? menu.parentElement.level + 1 : 0;
1541
1077
 
1542
1078
  if (menu.level > 0) {
@@ -1554,16 +1090,121 @@ class AuroMenu extends AuroElement {
1554
1090
  });
1555
1091
  }
1556
1092
 
1093
+ // Event Handlers
1094
+
1557
1095
  /**
1558
- * Navigates the menu options in the specified direction.
1559
- * @param {'up'|'down'} direction - The direction to navigate.
1560
- * @protected
1096
+ * Makes a selection based on the current index.
1097
+ * @private
1561
1098
  */
1562
- navigateOptions(direction) {
1563
- if (direction === 'up') {
1564
- this.menuService.highlightPrevious();
1565
- } else if (direction === 'down') {
1566
- this.menuService.highlightNext();
1099
+ makeSelection() {
1100
+ if (!this.items) {
1101
+ this.initItems();
1102
+ }
1103
+
1104
+ // Get currently selected menu option based on index
1105
+ const option = this.items ? this.items[this._index] : undefined;
1106
+
1107
+ // Return early if option is not interactive
1108
+ if (!option || !isOptionInteractive(option)) {
1109
+ return;
1110
+ }
1111
+
1112
+ // Handle custom events first
1113
+ if (option.hasAttribute('event')) {
1114
+ this.handleCustomEvent(option);
1115
+ return;
1116
+ }
1117
+
1118
+ if (this.multiSelect) {
1119
+ // In multiselect, toggle individual selections
1120
+ this.toggleOption(option);
1121
+ // In single select, only handle selection of new options
1122
+ } else if (!this.isOptionSelected(option)) {
1123
+ this.clearSelection();
1124
+ this.handleSelectState(option);
1125
+ } else {
1126
+ // Re-selecting the already-selected option in single-select doesn't change
1127
+ // state, so updated() won't fire. Notify explicitly so consumers (e.g.
1128
+ // auro-select closing its dropdown on Enter) still get the event.
1129
+ this.notifySelectionChange();
1130
+ }
1131
+ }
1132
+
1133
+ /**
1134
+ * Toggle the selection state of the menuoption.
1135
+ * @private
1136
+ * @param {HTMLElement} option - The menuoption to toggle.
1137
+ */
1138
+ toggleOption(option) {
1139
+ const isCurrentlySelected = this.isOptionSelected(option);
1140
+
1141
+ if (isCurrentlySelected) {
1142
+ this.handleDeselectState(option);
1143
+ } else if (option.value === undefined || option.value === '') {
1144
+ dispatchMenuEvent(this, 'auroMenu-selectValueFailure');
1145
+ } else {
1146
+ this.handleSelectState(option);
1147
+ }
1148
+ }
1149
+
1150
+ /**
1151
+ * Handles keyboard navigation and selection.
1152
+ * @private
1153
+ * @param {KeyboardEvent} event - The keydown event.
1154
+ */
1155
+ handleKeyDown(event) {
1156
+ switch (event.key) {
1157
+ case "ArrowDown":
1158
+ event.preventDefault();
1159
+ this.navigateOptions('down');
1160
+ break;
1161
+ case "ArrowUp":
1162
+ event.preventDefault();
1163
+ this.navigateOptions('up');
1164
+ break;
1165
+ case "Tab":
1166
+ // Do not preventDefault on Tab so focus can move out of the menu (a11y: avoid trapping keyboard users).
1167
+ this.makeSelection();
1168
+ break;
1169
+ case "Enter":
1170
+ event.preventDefault();
1171
+ this.makeSelection();
1172
+ break;
1173
+ }
1174
+ }
1175
+
1176
+ /**
1177
+ * Handles option selection via click events from menuoptions.
1178
+ * @private
1179
+ * @param {CustomEvent} event - The auroMenuOption-click event.
1180
+ */
1181
+ handleMouseSelect(event) {
1182
+ if (!this.rootMenu || this.disabled) {
1183
+ return;
1184
+ }
1185
+
1186
+ const option = event.detail;
1187
+ if (option && this.items) {
1188
+ const idx = this.items.indexOf(option);
1189
+ if (idx >= 0) {
1190
+ this._index = idx;
1191
+ this.makeSelection();
1192
+ }
1193
+ }
1194
+ }
1195
+
1196
+ /**
1197
+ * Handles option hover events.
1198
+ * @private
1199
+ * @param {CustomEvent} event - Event object from the browser.
1200
+ */
1201
+ handleOptionHover(event) {
1202
+ const option = event.detail;
1203
+ if (this.items) {
1204
+ const idx = this.items.indexOf(option);
1205
+ if (idx >= 0) {
1206
+ this.updateActiveOption(idx);
1207
+ }
1567
1208
  }
1568
1209
  }
1569
1210
 
@@ -1572,9 +1213,91 @@ class AuroMenu extends AuroElement {
1572
1213
  * @private
1573
1214
  */
1574
1215
  handleSlotChange() {
1575
- if (this.rootMenu) {
1576
- this.initializeMenu();
1216
+ if (this.parentElement && this.parentElement.closest('auro-menu, [auro-menu]')) {
1217
+ this.rootMenu = false;
1218
+ }
1219
+
1220
+ // Nested menus must also reinitialize so items, level, role="group", and aria-label refresh on content changes.
1221
+ // Root-specific attributes (listbox/root/aria-multiselectable) remain gated by `rootMenu` inside initializeMenu.
1222
+ this.initializeMenu();
1223
+
1224
+ // When options arrive after `value` was set (async option load), re-run matching
1225
+ // against the now-populated items. The earlier updated('value') call deferred
1226
+ // the failure dispatch because items were empty; this triggers the match now.
1227
+ const hasPendingValue = this.value !== undefined &&
1228
+ this.value !== null &&
1229
+ !(typeof this.value === 'string' && this.value.trim() === '');
1230
+ if (hasPendingValue && this.items && this.items.length > 0 && this.optionSelected === undefined) {
1231
+ this.requestUpdate('value', undefined);
1232
+ }
1233
+ }
1234
+
1235
+ /**
1236
+ * Navigates through options using keyboard.
1237
+ * @param {string} direction - 'up' or 'down'.
1238
+ */
1239
+ navigateOptions(direction) {
1240
+ // Return early if no items exist
1241
+ if (!this.items || !this.items.length) {
1242
+ return;
1243
+ }
1244
+
1245
+ let newIndex = this._index;
1246
+ if (newIndex === -1 && direction === 'up') {
1247
+ newIndex = this.items.length;
1248
+ }
1249
+ const increment = direction === 'down' ? 1 : -1;
1250
+ const maxIterations = this.items.length;
1251
+ let iterations = 0;
1252
+ let foundInteractiveOption = false;
1253
+
1254
+ do {
1255
+ newIndex = (newIndex + increment + this.items.length) % this.items.length;
1256
+ iterations += 1;
1257
+
1258
+ // Check if current option is interactive
1259
+ const currentOption = this.items[newIndex];
1260
+ if (isOptionInteractive(currentOption)) {
1261
+ foundInteractiveOption = true;
1262
+ break;
1263
+ }
1264
+
1265
+ // Break if all options were checked
1266
+ if (iterations >= maxIterations) {
1267
+ break;
1268
+ }
1269
+ } while (iterations < maxIterations);
1270
+
1271
+ // Update only if an interactive option was found
1272
+ if (foundInteractiveOption) {
1273
+ this.updateActiveOption(newIndex);
1274
+ }
1275
+ }
1276
+
1277
+ /**
1278
+ * Updates the active option state and dispatches events.
1279
+ * Accepts either a numeric index or an HTMLElement option.
1280
+ * @param {number|HTMLElement} indexOrOption - Index of the option or the option element to make active.
1281
+ */
1282
+ updateActiveOption(indexOrOption) {
1283
+ let idx = -1;
1284
+
1285
+ if (typeof indexOrOption === 'number') {
1286
+ idx = indexOrOption;
1287
+ } else {
1288
+ idx = this.items ? this.items.indexOf(indexOrOption) : -1;
1289
+ }
1290
+
1291
+ if (!this.items || !this.items[idx]) {
1292
+ return;
1577
1293
  }
1294
+
1295
+ this.items.forEach((item) => item.classList.remove('active'));
1296
+ this.items[idx].classList.add('active');
1297
+ this.optionActive = this.items[idx];
1298
+ this._index = idx;
1299
+
1300
+ dispatchMenuEvent(this, 'auroMenu-activatedOption', this.items[idx]);
1578
1301
  }
1579
1302
 
1580
1303
  /**
@@ -1584,8 +1307,8 @@ class AuroMenu extends AuroElement {
1584
1307
  */
1585
1308
  handleCustomEvent(option) {
1586
1309
  const eventName = option.getAttribute('event');
1587
- dispatchMenuEvent(this, eventName);
1588
- dispatchMenuEvent(this, 'auroMenu-customEventFired');
1310
+ dispatchMenuEvent(this, eventName, { option });
1311
+ dispatchMenuEvent(this, 'auroMenu-customEventFired', { option });
1589
1312
  }
1590
1313
 
1591
1314
  /**
@@ -1593,14 +1316,33 @@ class AuroMenu extends AuroElement {
1593
1316
  * @param {any} source - The source that triggers this event.
1594
1317
  * @private
1595
1318
  */
1596
- notifySelectionChange({value, stringValue, keys, options, reason} = {}) {
1597
- dispatchMenuEvent(this, 'auroMenu-selectedOption', {
1598
- value,
1599
- stringValue,
1600
- keys,
1601
- options,
1602
- reason
1603
- });
1319
+ notifySelectionChange(source = undefined) {
1320
+ dispatchMenuEvent(this, 'auroMenu-selectedOption', { source });
1321
+ }
1322
+
1323
+ /**
1324
+ * @private
1325
+ * @param {any} current - Current selection.
1326
+ * @param {any} next - New selection to compare.
1327
+ * @returns {boolean} Whether the selections are equal.
1328
+ */
1329
+ selectionEquals(current, next) {
1330
+ if (current === next) {
1331
+ return true;
1332
+ }
1333
+ if (!current || !next) {
1334
+ return false;
1335
+ }
1336
+ if (Array.isArray(current) && Array.isArray(next)) {
1337
+ if (current.length !== next.length) {
1338
+ return false;
1339
+ }
1340
+ // Compare as sets — selection order may differ from DOM order after value-driven
1341
+ // reconciliation, but the selected set is what matters for change detection.
1342
+ const nextSet = new Set(next);
1343
+ return current.every((item) => nextSet.has(item));
1344
+ }
1345
+ return false;
1604
1346
  }
1605
1347
 
1606
1348
  /**
@@ -1615,7 +1357,6 @@ class AuroMenu extends AuroElement {
1615
1357
  }
1616
1358
 
1617
1359
  if (this.multiSelect) {
1618
- // In multi-select mode, check if the option is in the selected array
1619
1360
  return Array.isArray(this.optionSelected) && this.optionSelected.some((selectedOption) => selectedOption === option);
1620
1361
  }
1621
1362
 
@@ -1680,9 +1421,9 @@ class AuroMenu extends AuroElement {
1680
1421
  */
1681
1422
  const a=Symbol.for(""),o$1=t=>{if(t?.r===a)return t?._$litStatic$},s=t=>({_$litStatic$:t,r:a}),i=(t,...r)=>({_$litStatic$:r.reduce((r,e,a)=>r+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1],t[0]),r:a}),l=new Map,n=t=>(r,...e)=>{const a=e.length;let s,i;const n=[],u=[];let c,$=0,f=false;for(;$<a;){for(c=r[$];$<a&&void 0!==(i=e[$],s=o$1(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l.get(t))&&(n.raw=n,l.set(t,r=n)),e=u;}return t(r,...e)},u$1=n(b);
1682
1423
 
1683
- var styleCss = i$6`.body-default{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-emphasized-font-size, 1rem);line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-font-size, 0.625rem);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);line-height:var(--wcss-body-2xs-emphasized-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-2xl-weight, 300);line-height:var(--wcss-display-2xl-line-height, 1.3);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));letter-spacing:var(--wcss-display-2xl-letter-spacing, 0)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xl-weight, 300);line-height:var(--wcss-display-xl-line-height, 1.3);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));letter-spacing:var(--wcss-display-xl-letter-spacing, 0)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-lg-weight, 300);line-height:var(--wcss-display-lg-line-height, 1.3);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));letter-spacing:var(--wcss-display-lg-letter-spacing, 0)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-md-weight, 300);line-height:var(--wcss-display-md-line-height, 1.3);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));letter-spacing:var(--wcss-display-md-letter-spacing, 0)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-sm-weight, 300);line-height:var(--wcss-display-sm-line-height, 1.3);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));letter-spacing:var(--wcss-display-sm-letter-spacing, 0)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xs-weight, 300);line-height:var(--wcss-display-xs-line-height, 1.3);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));letter-spacing:var(--wcss-display-xs-letter-spacing, 0)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xl-weight, 300);line-height:var(--wcss-heading-xl-line-height, 1.3);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));letter-spacing:var(--wcss-heading-xl-letter-spacing, 0)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-lg-weight, 300);line-height:var(--wcss-heading-lg-line-height, 1.3);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));letter-spacing:var(--wcss-heading-lg-letter-spacing, 0)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-md-weight, 300);line-height:var(--wcss-heading-md-line-height, 1.3);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));letter-spacing:var(--wcss-heading-md-letter-spacing, 0)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-sm-weight, 300);line-height:var(--wcss-heading-sm-line-height, 1.3);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));letter-spacing:var(--wcss-heading-sm-letter-spacing, 0)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xs-weight, 300);line-height:var(--wcss-heading-xs-line-height, 1.3);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));letter-spacing:var(--wcss-heading-xs-letter-spacing, 0)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-2xs-weight, 300);line-height:var(--wcss-heading-2xs-line-height, 1.3);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xl-weight, 450);line-height:var(--wcss-accent-2xl-line-height, 1);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xl-weight, 450);line-height:var(--wcss-accent-xl-line-height, 1.3);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-lg-weight, 450);line-height:var(--wcss-accent-lg-line-height, 1.3);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-md-weight, 500);line-height:var(--wcss-accent-md-line-height, 1.3);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);text-transform:uppercase}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-sm-weight, 500);line-height:var(--wcss-accent-sm-line-height, 1.3);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xs-weight, 500);line-height:var(--wcss-accent-xs-line-height, 1.3);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);text-transform:uppercase}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xs-weight, 450);line-height:var(--wcss-accent-2xs-line-height, 1.3);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);text-transform:uppercase}:host{cursor:pointer;user-select:none;text-overflow:ellipsis;max-width:100dvw}:host .wrapper{display:flex;align-items:center;height:var(--ds-size-400, 2rem);padding-right:var(--ds-size-200, 1rem);padding-left:calc(var(--ds-size-150, 0.75rem) + var(--ds-size-300, 1.5rem) + var(--ds-size-100, 0.5rem));border-radius:var(--ds-size-100, 0.5rem);-webkit-tap-highlight-color:transparent}:host .wrapper[class*=shape-box]{border-radius:unset}:host .wrapper[class*=shape-snowflake]{border-radius:unset;line-height:24px}:host .wrapper[class*=shape-pill]{border-radius:30px}:host .wrapper[class*=-lg]{padding-top:var(--ds-size-75, 0.375rem);padding-bottom:var(--ds-size-75, 0.375rem);padding-right:var(--ds-size-150, 0.75rem);line-height:26px}:host .wrapper[class*=-xl]{padding-top:var(--ds-size-100, 0.5rem);padding-bottom:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);line-height:26px}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}[slot=displayValue]{display:none}:host([loadingplaceholder]) .wrapper{padding-left:calc(var(--ds-size-150, 0.75rem) + var(--ds-size-300, 1.5rem) + var(--ds-size-100, 0.5rem))}:host([selected]) .wrapper{padding-left:0}:host([nocheckmark]) .wrapper{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-lg]{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-xl]{padding-left:var(--ds-size-200, 1rem)}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
1424
+ var styleCss = i$5`.body-default{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-default-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-default-emphasized-font-size, 1rem);line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-lg-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-sm-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-font-size, 0.625rem);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-2xs-emphasized-weight, );letter-spacing:var(--wcss-body-letter-spacing, 0);font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);line-height:var(--wcss-body-2xs-emphasized-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-2xl-weight, 300);line-height:var(--wcss-display-2xl-line-height, 1.3);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));letter-spacing:var(--wcss-display-2xl-letter-spacing, 0)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xl-weight, 300);line-height:var(--wcss-display-xl-line-height, 1.3);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));letter-spacing:var(--wcss-display-xl-letter-spacing, 0)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-lg-weight, 300);line-height:var(--wcss-display-lg-line-height, 1.3);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));letter-spacing:var(--wcss-display-lg-letter-spacing, 0)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-md-weight, 300);line-height:var(--wcss-display-md-line-height, 1.3);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));letter-spacing:var(--wcss-display-md-letter-spacing, 0)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-sm-weight, 300);line-height:var(--wcss-display-sm-line-height, 1.3);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));letter-spacing:var(--wcss-display-sm-letter-spacing, 0)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-display-xs-weight, 300);line-height:var(--wcss-display-xs-line-height, 1.3);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));letter-spacing:var(--wcss-display-xs-letter-spacing, 0)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xl-weight, 300);line-height:var(--wcss-heading-xl-line-height, 1.3);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));letter-spacing:var(--wcss-heading-xl-letter-spacing, 0)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-lg-weight, 300);line-height:var(--wcss-heading-lg-line-height, 1.3);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));letter-spacing:var(--wcss-heading-lg-letter-spacing, 0)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-md-weight, 300);line-height:var(--wcss-heading-md-line-height, 1.3);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));letter-spacing:var(--wcss-heading-md-letter-spacing, 0)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-sm-weight, 300);line-height:var(--wcss-heading-sm-line-height, 1.3);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));letter-spacing:var(--wcss-heading-sm-letter-spacing, 0)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-xs-weight, 300);line-height:var(--wcss-heading-xs-line-height, 1.3);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));letter-spacing:var(--wcss-heading-xs-letter-spacing, 0)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-heading-2xs-weight, 300);line-height:var(--wcss-heading-2xs-line-height, 1.3);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xl-weight, 450);line-height:var(--wcss-accent-2xl-line-height, 1);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xl-weight, 450);line-height:var(--wcss-accent-xl-line-height, 1.3);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);text-transform:uppercase}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-lg-weight, 450);line-height:var(--wcss-accent-lg-line-height, 1.3);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-md-weight, 500);line-height:var(--wcss-accent-md-line-height, 1.3);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);text-transform:uppercase}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-sm-weight, 500);line-height:var(--wcss-accent-sm-line-height, 1.3);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-xs-weight, 500);line-height:var(--wcss-accent-xs-line-height, 1.3);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);text-transform:uppercase}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-weight:var(--wcss-accent-2xs-weight, 450);line-height:var(--wcss-accent-2xs-line-height, 1.3);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);text-transform:uppercase}:host{cursor:pointer;user-select:none;text-overflow:ellipsis;max-width:100dvw}:host .wrapper{display:flex;align-items:center;height:var(--ds-size-400, 2rem);padding-right:var(--ds-size-200, 1rem);padding-left:calc(var(--ds-size-150, 0.75rem) + var(--ds-size-300, 1.5rem) + var(--ds-size-100, 0.5rem));border-radius:var(--ds-size-100, 0.5rem);-webkit-tap-highlight-color:transparent}:host .wrapper[class*=shape-box]{border-radius:unset}:host .wrapper[class*=shape-snowflake]{border-radius:unset;line-height:24px}:host .wrapper[class*=shape-pill]{border-radius:30px}:host .wrapper[class*=-lg]{padding-top:var(--ds-size-75, 0.375rem);padding-bottom:var(--ds-size-75, 0.375rem);padding-right:var(--ds-size-150, 0.75rem);line-height:26px}:host .wrapper[class*=-xl]{padding-top:var(--ds-size-100, 0.5rem);padding-bottom:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);line-height:26px}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}[slot=displayValue]{display:none}:host([loadingplaceholder]) .wrapper{padding-left:calc(var(--ds-size-150, 0.75rem) + var(--ds-size-300, 1.5rem) + var(--ds-size-100, 0.5rem))}:host([selected]) .wrapper{padding-left:0}:host([nocheckmark]) .wrapper{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-lg]{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-xl]{padding-left:var(--ds-size-200, 1rem)}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
1684
1425
 
1685
- var colorCss = i$6`:host .wrapper{background-color:var(--ds-auro-menuoption-container-color, transparent);box-shadow:inset 0 0 0 1px var(--ds-auro-menuoption-container-border-color, transparent);color:var(--ds-auro-menuoption-text-color)}:host svg{fill:var(--ds-auro-menuoption-icon-color)}:host([disabled]){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}@media(hover: hover){:host(:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}}:host(:focus){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}:host([selected]){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-subtle, #b4eff9);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([selected].active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}@media(hover: hover){:host([selected]:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}}:host([selected]:focus){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-subtle, #b4eff9);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}:host(:focus.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}@media(hover: hover){:host(:focus:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}}:host([selected]:focus.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}@media(hover: hover){:host([selected]:focus:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}}`;
1426
+ var colorCss = i$5`:host .wrapper{background-color:var(--ds-auro-menuoption-container-color, transparent);box-shadow:inset 0 0 0 1px var(--ds-auro-menuoption-container-border-color, transparent);color:var(--ds-auro-menuoption-text-color)}:host svg{fill:var(--ds-auro-menuoption-icon-color)}:host([disabled]){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}@media(hover: hover){:host(:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}}:host(:focus){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}:host([selected]){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-subtle, #b4eff9);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([selected].active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}@media(hover: hover){:host([selected]:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd)}}:host([selected]:focus){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-subtle, #b4eff9);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}:host(:focus.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}@media(hover: hover){:host(:focus:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}}:host([selected]:focus.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}@media(hover: hover){:host([selected]:focus:hover){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-accent1-muted, #ebfafd);--ds-auro-menuoption-container-border-color: var(--ds-basic-color-border-brand, #00274a)}}`;
1686
1427
 
1687
1428
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
1688
1429
  // See LICENSE in the project root for license information.
@@ -1730,10 +1471,10 @@ class AuroDependencyVersioning {
1730
1471
  * SPDX-License-Identifier: BSD-3-Clause
1731
1472
  */const o=o=>o??A;
1732
1473
 
1733
- class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,class extends a{});}closestElement(t,a=this,e=(a,s=a&&a.closest(t))=>a&&a!==document&&a!==window?s||e(a.getRootNode().host):null){return e(a)}handleComponentTagRename(t,a){const e=a.toLowerCase();t.tagName.toLowerCase()!==e&&t.setAttribute(e,true);}elementMatch(t,a){const e=a.toLowerCase();return t.tagName.toLowerCase()===e||t.hasAttribute(e)}getSlotText(t,a){const e=t.shadowRoot?.querySelector(`slot[name="${a}"]`);return (e?.assignedNodes({flatten:true})||[]).map(t=>t.textContent?.trim()).join(" ").trim()||null}}var u='<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-labelledby="error__desc" class="ico_squareLarge" data-deprecated="true" role="img" style="min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor" viewBox="0 0 24 24" part="svg"><title/><desc id="error__desc">Error alert indicator.</desc><path d="m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0m-1.165.87a.23.23 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084M12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5m-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583"/></svg>',g='<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="min-width:100%;height:auto;fill:currentColor" viewBox="0 0 142 138" part="svg"><title id="tail-DEFAULT__title">Airplane tail default image with light gray color</title><path fill="url(#paint0_linear_9225_2069)" fill-rule="evenodd" d="M124.093 14.665a3.26 3.26 0 0 1 3.208 3.829L101.097 119.85c-.47 1.087-2.211 3.398-5.692 3.471l-.106.001-80.65.013A659230 659230 0 0 1 99.08 17.412c1.214-1.497 3.275-2.722 5.372-2.747z" clip-rule="evenodd"/><defs><linearGradient id="paint0_linear_9225_2069" x1="114.823" x2="60.061" y1="14.665" y2="123.335" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#707984"/><stop offset=".5" stop-color="#646E7B"/></linearGradient></defs></svg>';class m extends i$3{static get properties(){return {hidden:{type:Boolean,reflect:true},hiddenVisually:{type:Boolean,reflect:true},hiddenAudible:{type:Boolean,reflect:true}}}hideAudible(t){return t?"true":"false"}}const f=new Map,w=(t,a={})=>{const e=a.responseParser||(t=>t.text());return f.has(t)||f.set(t,fetch(t).then(e)),f.get(t)};var z=i$6`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, .75rem))}:host{color:currentColor;vertical-align:middle;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem)!important;width:var(--ds-auro-icon-size, 1.5rem)!important;height:var(--ds-auro-icon-size, 1.5rem)!important}.componentWrapper{display:flex;line-height:var(--ds-auro-icon-size)}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.svgWrapper [part=svg]{display:flex}.labelWrapper{margin-left:var(--ds-size-50, .25rem)}.labelWrapper ::slotted(*){line-height:inherit!important}
1734
- `;class y extends m{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.onDark=false,this.appearance="default";}static get properties(){return {...m.properties,onDark:{type:Boolean,reflect:true},appearance:{type:String,reflect:true},svg:{attribute:false,reflect:true}}}static get styles(){return z}async fetchIcon(t,a){let e="";e="logos"===t?await w(`${this.uri}/${t}/${a}.svg`):await w(`${this.uri}/icons/${t}/${a}.svg`);return (new DOMParser).parseFromString(e,"text/html").body.querySelector("svg")}async firstUpdated(){try{if(!this.customSvg){const t=await this.fetchIcon(this.category,this.name);if(t)this.svg=t;else if(!t){const t=this.name?.startsWith("tail-")?g:u;this.svg=(new DOMParser).parseFromString(t,"text/html").body.querySelector("svg");}}}catch(t){this.svg=void 0;}}}i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host{display:inline-block;--ds-auro-icon-size: 100%;width:100%;height:100%}:host .logo{color:var(--ds-auro-alaska-color)}:host([onDark]),:host([appearance=inverse]){--ds-auro-alaska-color: #FFF}
1735
- `;var M=i$6`:host{--ds-auro-icon-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color: #02426D;--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}
1736
- `;var _=i$6`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]),:host(:not([appearance=inverse])[variant=accent1]){--ds-auro-icon-color: var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]),:host(:not([appearance=inverse])[variant=disabled]){--ds-auro-icon-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]),:host(:not([appearance=inverse])[variant=muted]){--ds-auro-icon-color: var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]),:host(:not([appearance=inverse])[variant=statusDefault]){--ds-auro-icon-color: var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]),:host(:not([appearance=inverse])[variant=statusInfo]){--ds-auro-icon-color: var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]),:host(:not([appearance=inverse])[variant=statusSuccess]){--ds-auro-icon-color: var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]),:host(:not([appearance=inverse])[variant=statusWarning]){--ds-auro-icon-color: var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]),:host(:not([appearance=inverse])[variant=statusError]){--ds-auro-icon-color: var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]),:host(:not([appearance=inverse])[variant=statusInfoSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]),:host(:not([appearance=inverse])[variant=statusSuccessSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]),:host(:not([appearance=inverse])[variant=statusWarningSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]),:host(:not([appearance=inverse])[variant=statusErrorSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]),:host(:not([appearance=inverse])[variant=fareBasicEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]),:host(:not([appearance=inverse])[variant=fareBusiness]){--ds-auro-icon-color: var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]),:host(:not([appearance=inverse])[variant=fareEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]),:host(:not([appearance=inverse])[variant=fareFirst]){--ds-auro-icon-color: var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]),:host(:not([appearance=inverse])[variant=farePremiumEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]),:host(:not([appearance=inverse])[variant=tierOneWorldEmerald]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]),:host(:not([appearance=inverse])[variant=tierOneWorldSapphire]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]),:host(:not([appearance=inverse])[variant=tierOneWorldRuby]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]),:host([appearance=inverse]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]),:host([appearance=inverse][variant=disabled]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]),:host([appearance=inverse][variant=muted]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][variant=statusError]),:host([appearance=inverse][variant=statusError]){--ds-auro-icon-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}
1474
+ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,class extends a{});}closestElement(t,a=this,e=(a,s=a&&a.closest(t))=>a&&a!==document&&a!==window?s||e(a.getRootNode().host):null){return e(a)}handleComponentTagRename(t,a){const e=a.toLowerCase();t.tagName.toLowerCase()!==e&&t.setAttribute(e,true);}elementMatch(t,a){const e=a.toLowerCase();return t.tagName.toLowerCase()===e||t.hasAttribute(e)}getSlotText(t,a){const e=t.shadowRoot?.querySelector(`slot[name="${a}"]`);return (e?.assignedNodes({flatten:true})||[]).map(t=>t.textContent?.trim()).join(" ").trim()||null}}var u='<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-labelledby="error__desc" class="ico_squareLarge" data-deprecated="true" role="img" style="min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor" viewBox="0 0 24 24" part="svg"><title/><desc id="error__desc">Error alert indicator.</desc><path d="m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0m-1.165.87a.23.23 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084M12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5m-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583"/></svg>',g='<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="min-width:100%;height:auto;fill:currentColor" viewBox="0 0 142 138" part="svg"><title id="tail-DEFAULT__title">Airplane tail default image with light gray color</title><path fill="url(#paint0_linear_9225_2069)" fill-rule="evenodd" d="M124.093 14.665a3.26 3.26 0 0 1 3.208 3.829L101.097 119.85c-.47 1.087-2.211 3.398-5.692 3.471l-.106.001-80.65.013A659230 659230 0 0 1 99.08 17.412c1.214-1.497 3.275-2.722 5.372-2.747z" clip-rule="evenodd"/><defs><linearGradient id="paint0_linear_9225_2069" x1="114.823" x2="60.061" y1="14.665" y2="123.335" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#707984"/><stop offset=".5" stop-color="#646E7B"/></linearGradient></defs></svg>';class m extends i$2{static get properties(){return {hidden:{type:Boolean,reflect:true},hiddenVisually:{type:Boolean,reflect:true},hiddenAudible:{type:Boolean,reflect:true}}}hideAudible(t){return t?"true":"false"}}const f=new Map,w=(t,a={})=>{const e=a.responseParser||(t=>t.text());return f.has(t)||f.set(t,fetch(t).then(e)),f.get(t)};var z=i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, .75rem))}:host{color:currentColor;vertical-align:middle;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem)!important;width:var(--ds-auro-icon-size, 1.5rem)!important;height:var(--ds-auro-icon-size, 1.5rem)!important}.componentWrapper{display:flex;line-height:var(--ds-auro-icon-size)}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.svgWrapper [part=svg]{display:flex}.labelWrapper{margin-left:var(--ds-size-50, .25rem)}.labelWrapper ::slotted(*){line-height:inherit!important}
1475
+ `;class y extends m{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.onDark=false,this.appearance="default";}static get properties(){return {...m.properties,onDark:{type:Boolean,reflect:true},appearance:{type:String,reflect:true},svg:{attribute:false,reflect:true}}}static get styles(){return z}async fetchIcon(t,a){let e="";e="logos"===t?await w(`${this.uri}/${t}/${a}.svg`):await w(`${this.uri}/icons/${t}/${a}.svg`);return (new DOMParser).parseFromString(e,"text/html").body.querySelector("svg")}async firstUpdated(){try{if(!this.customSvg){const t=await this.fetchIcon(this.category,this.name);if(t)this.svg=t;else if(!t){const t=this.name?.startsWith("tail-")?g:u;this.svg=(new DOMParser).parseFromString(t,"text/html").body.querySelector("svg");}}}catch(t){this.svg=void 0;}}}i$5`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host{display:inline-block;--ds-auro-icon-size: 100%;width:100%;height:100%}:host .logo{color:var(--ds-auro-alaska-color)}:host([onDark]),:host([appearance=inverse]){--ds-auro-alaska-color: #FFF}
1476
+ `;var M=i$5`:host{--ds-auro-icon-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color: #02426D;--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}
1477
+ `;var _=i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]),:host(:not([appearance=inverse])[variant=accent1]){--ds-auro-icon-color: var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]),:host(:not([appearance=inverse])[variant=disabled]){--ds-auro-icon-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]),:host(:not([appearance=inverse])[variant=muted]){--ds-auro-icon-color: var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]),:host(:not([appearance=inverse])[variant=statusDefault]){--ds-auro-icon-color: var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]),:host(:not([appearance=inverse])[variant=statusInfo]){--ds-auro-icon-color: var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]),:host(:not([appearance=inverse])[variant=statusSuccess]){--ds-auro-icon-color: var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]),:host(:not([appearance=inverse])[variant=statusWarning]){--ds-auro-icon-color: var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]),:host(:not([appearance=inverse])[variant=statusError]){--ds-auro-icon-color: var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]),:host(:not([appearance=inverse])[variant=statusInfoSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]),:host(:not([appearance=inverse])[variant=statusSuccessSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]),:host(:not([appearance=inverse])[variant=statusWarningSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]),:host(:not([appearance=inverse])[variant=statusErrorSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]),:host(:not([appearance=inverse])[variant=fareBasicEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]),:host(:not([appearance=inverse])[variant=fareBusiness]){--ds-auro-icon-color: var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]),:host(:not([appearance=inverse])[variant=fareEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]),:host(:not([appearance=inverse])[variant=fareFirst]){--ds-auro-icon-color: var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]),:host(:not([appearance=inverse])[variant=farePremiumEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]),:host(:not([appearance=inverse])[variant=tierOneWorldEmerald]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]),:host(:not([appearance=inverse])[variant=tierOneWorldSapphire]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]),:host(:not([appearance=inverse])[variant=tierOneWorldRuby]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]),:host([appearance=inverse]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]),:host([appearance=inverse][variant=disabled]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]),:host([appearance=inverse][variant=muted]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][variant=statusError]),:host([appearance=inverse][variant=statusError]){--ds-auro-icon-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}
1737
1478
  `;class k extends y{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.variant=void 0,this.uri="https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist",this.runtimeUtils=new p;}static get properties(){return {...y.properties,ariaHidden:{type:String,reflect:true},category:{type:String,reflect:true},customColor:{type:Boolean,reflect:true},customSvg:{type:Boolean},label:{type:Boolean,reflect:true},name:{type:String,reflect:true},variant:{type:String,reflect:true}}}static get styles(){return [y.styles,M,z,_]}static register(t="auro-icon"){p.prototype.registerComponent(t,k);}connectedCallback(){super.connectedCallback(),this.runtimeUtils.handleComponentTagRename(this,"auro-icon");}exposeCssParts(){this.setAttribute("exportparts","svg:iconSvg");}async firstUpdated(){if(await super.firstUpdated(),this.hasAttribute("ariaHidden")&&this.svg){const t=this.svg.querySelector("desc");t&&(t.remove(),this.svg.removeAttribute("aria-labelledby"));}}render(){const t={labelWrapper:true,util_displayHiddenVisually:!this.label};return b`
1738
1479
  <div class="componentWrapper">
1739
1480
  <div
@@ -1768,40 +1509,16 @@ let menuOptionIdCounter = 0;
1768
1509
  * The `auro-menuoption` element provides users a way to define a menu option.
1769
1510
  * @customElement auro-menuoption
1770
1511
  *
1512
+ * @attr {Boolean} static - When present, marks the option as non-interactive — it renders but is skipped during keyboard navigation and cannot be selected. Useful for section headers, informational rows inside a menu, or attaching event listeners.
1771
1513
  * @slot default - The default slot for the menu option text.
1772
1514
  *
1773
1515
  * @event auroMenuOption-mouseover - Notifies that this option has been hovered over.
1516
+ * @event auroMenuOption-click - Notifies that this option has been clicked.
1774
1517
  */
1775
1518
  class AuroMenuOption extends AuroElement {
1776
-
1777
- /**
1778
- * This will register this element with the browser.
1779
- * @param {string} [name="auro-menuoption"] - The name of the element that you want to register.
1780
- *
1781
- * @example
1782
- * AuroMenuOption.register("custom-menuoption") // this will register this element to <custom-menuoption/>
1783
- *
1784
- */
1785
- static register(name = "auro-menuoption") {
1786
- AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroMenuOption);
1787
- }
1788
-
1789
- /**
1790
- * Returns whether the menu option is currently active and selectable.
1791
- * An option is considered active if it is not hidden, not disabled, and not static.
1792
- * @returns {boolean} True if the option is active, false otherwise.
1793
- */
1794
- get isActive() {
1795
- return !this.hasAttribute('hidden') &&
1796
- !this.disabled &&
1797
- !this.hasAttribute('static');
1798
- }
1799
-
1800
1519
  constructor() {
1801
1520
  super();
1802
1521
 
1803
- this.bindEvents();
1804
-
1805
1522
  /**
1806
1523
  * @private
1807
1524
  */
@@ -1822,83 +1539,62 @@ class AuroMenuOption extends AuroElement {
1822
1539
  this.noCheckmark = false;
1823
1540
  this.disabled = false;
1824
1541
  this.noMatch = false;
1542
+ this.persistent = false;
1825
1543
 
1826
1544
  /**
1827
1545
  * @private
1828
1546
  */
1829
- this.runtimeUtils = new AuroLibraryRuntimeUtils();
1830
-
1831
- // Initialize context-related properties
1832
- this.menuService = null;
1833
- this.unsubscribe = null;
1547
+ this.tabIndex = -1;
1834
1548
 
1835
1549
  /**
1836
1550
  * @private
1837
1551
  */
1838
- this.handleMenuChange = this.handleMenuChange.bind(this);
1552
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
1553
+
1554
+ this.addEventListener('click', this.handleClick.bind(this));
1839
1555
  }
1840
1556
 
1841
1557
  static get properties() {
1842
1558
  return {
1843
1559
  ...super.properties,
1844
-
1845
- /**
1846
- * When true, disables the menu option.
1847
- */
1848
- disabled: {
1560
+ noCheckmark: {
1849
1561
  type: Boolean,
1850
1562
  reflect: true
1851
1563
  },
1852
1564
 
1853
1565
  /**
1854
- * @private
1566
+ * **Deprecated.** Use the `value` attribute on `auro-menu` to set the selected option when the menu renders (or call `menu.selectByValue(value)` programmatically). Support for the child-level `selected` attribute will be removed in a future major release.
1567
+ *
1568
+ * @deprecated Use the `value` attribute on `auro-menu` instead.
1855
1569
  */
1856
- event: {
1857
- type: String,
1570
+ selected: {
1571
+ type: Boolean,
1858
1572
  reflect: true
1859
1573
  },
1860
-
1861
- /**
1862
- * @private
1863
- */
1864
- layout: {
1865
- type: String
1574
+ disabled: {
1575
+ type: Boolean,
1576
+ reflect: true
1866
1577
  },
1867
-
1868
- /**
1869
- * Allows users to set a unique key for the menu option for specified option selection. If no key is provided, the value property will be used.
1870
- */
1871
- key: {
1578
+ value: {
1872
1579
  type: String,
1873
1580
  reflect: true
1874
1581
  },
1875
-
1876
- /**
1877
- * @private
1878
- */
1879
- menuService: {
1880
- type: Object,
1881
- state: true
1582
+ tabIndex: {
1583
+ type: Number,
1584
+ reflect: true
1882
1585
  },
1883
1586
 
1884
1587
  /**
1885
1588
  * @private
1886
1589
  */
1887
- matchWord: {
1590
+ event: {
1888
1591
  type: String,
1889
- state: true
1890
- },
1891
-
1892
- /**
1893
- * @private
1894
- */
1895
- noCheckmark: {
1896
- type: Boolean,
1897
1592
  reflect: true
1898
1593
  },
1899
1594
 
1900
1595
  /**
1901
- * When true, marks this option as the "no matching results" placeholder shown by combobox when the user's input does not match any available options. Enables distinct styling and prevents the option from being treated as a selectable match.
1596
+ * When true, marks this option as the "no matching results" placeholder shown by combobox
1597
+ * when the user's input does not match any available options.
1902
1598
  */
1903
1599
  noMatch: {
1904
1600
  type: Boolean,
@@ -1906,29 +1602,11 @@ class AuroMenuOption extends AuroElement {
1906
1602
  attribute: 'nomatch'
1907
1603
  },
1908
1604
 
1909
- /**
1910
- * Specifies that an option is selected.
1911
- */
1912
- selected: {
1605
+ /** When true, this option is excluded from `matchWord` DOM rewriting — useful for utility rows (e.g., "Add new…") that must render identically regardless of the current filter. */
1606
+ persistent: {
1913
1607
  type: Boolean,
1914
1608
  reflect: true
1915
1609
  },
1916
-
1917
- /**
1918
- * Specifies the tab index of the menu option.
1919
- */
1920
- tabIndex: {
1921
- type: Number,
1922
- reflect: true
1923
- },
1924
-
1925
- /**
1926
- * Specifies the value to be sent to a server.
1927
- */
1928
- value: {
1929
- type: String,
1930
- reflect: true
1931
- },
1932
1610
  };
1933
1611
  }
1934
1612
 
@@ -1940,41 +1618,48 @@ class AuroMenuOption extends AuroElement {
1940
1618
  ];
1941
1619
  }
1942
1620
 
1621
+ /**
1622
+ * This will register this element with the browser.
1623
+ * @param {string} [name="auro-menuoption"] - The name of element that you want to register to.
1624
+ *
1625
+ * @example
1626
+ * AuroMenuOption.register("custom-menuoption") // this will register this element to <custom-menuoption/>
1627
+ *
1628
+ */
1629
+ static register(name = "auro-menuoption") {
1630
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroMenuOption);
1631
+ }
1632
+
1633
+ /**
1634
+ * Returns whether the menu option is currently active and selectable.
1635
+ * @returns {boolean}
1636
+ */
1637
+ get isActive() {
1638
+ return !this.hasAttribute('hidden') &&
1639
+ !this.disabled &&
1640
+ !this.hasAttribute('static');
1641
+ }
1642
+
1943
1643
  connectedCallback() {
1944
1644
  super.connectedCallback();
1945
1645
 
1946
- // Add the tag name as an attribute if it is different than the component name
1947
- // Add this step soon as this node gets attached to the DOM to avoid racing condition with menu's value setting logic.
1948
1646
  this.runtimeUtils.handleComponentTagRename(this, 'auro-menuoption');
1949
-
1950
- // Set up context consumption in connectedCallback
1951
- this._contextConsumer = new s$2(this, {
1952
- context: MenuContext,
1953
- callback: this.attachTo.bind(this),
1954
- subscribe: true
1955
- });
1956
-
1957
- // Establish the key property as early as possible.
1958
- // When a framework (e.g. Svelte) inserts the element into the DOM before
1959
- // setting its `value` property, both `getAttribute('value')` and
1960
- // `getAttribute('key')` return null here. Setting `this.key = null`
1961
- // would block the fallback in `updated()` that assigns key from the
1962
- // value property (the guard checked `=== undefined`). Only assign key
1963
- // if at least one source attribute is actually present so that the
1964
- // `updated()` fallback can run when the value property arrives later.
1965
- const valueAttr = this.getAttribute('value');
1966
- const keyAttr = this.getAttribute('key');
1967
- const resolvedKey = keyAttr !== null ? keyAttr : valueAttr;
1968
- if (resolvedKey !== null) {
1969
- this.key = resolvedKey;
1970
- }
1971
1647
  }
1972
1648
 
1973
1649
  firstUpdated() {
1974
- // Add the tag name as an attribute if it is different than the component name
1975
1650
  this.runtimeUtils.handleComponentTagRename(this, 'auro-menuoption');
1976
1651
 
1977
- // Generate unique ID if not already set (required for aria-activedescendant)
1652
+ // firstUpdated can fire on an option that was detached before the first
1653
+ // render completed (e.g. dynamic-menu rebuilds clear and repopulate the
1654
+ // menu mid-cycle). parentElement is null in that case — fall back to
1655
+ // defaults; the next render after re-attachment will pick up real values.
1656
+ if (!this.hasAttribute('size')) {
1657
+ this.size = this.parentElement ? this.parentElement.getAttribute('size') || 'sm' : 'sm';
1658
+ }
1659
+ if (!this.hasAttribute('shape')) {
1660
+ this.shape = this.parentElement ? this.parentElement.getAttribute('shape') || 'box' : 'box';
1661
+ }
1662
+
1978
1663
  if (!this.id) {
1979
1664
  menuOptionIdCounter += 1;
1980
1665
  this.id = `menuoption-${menuOptionIdCounter}`;
@@ -1996,16 +1681,8 @@ class AuroMenuOption extends AuroElement {
1996
1681
  updated(changedProperties) {
1997
1682
  super.updated(changedProperties);
1998
1683
 
1999
- // Update aria-selected attribute if selected changed
2000
1684
  if (changedProperties.has('selected')) {
2001
-
2002
- // Update aria-selected attribute
2003
1685
  this.setAttribute('aria-selected', this.selected.toString());
2004
-
2005
- // Update menu service selection state if this isn't an internal update
2006
- if (this.internalUpdateInProgress !== true && this.menuService) {
2007
- this.menuService[this.selected ? 'selectOption' : 'deselectOption'](this);
2008
- }
2009
1686
  }
2010
1687
 
2011
1688
  if (changedProperties.has('disabled')) {
@@ -2015,231 +1692,48 @@ class AuroMenuOption extends AuroElement {
2015
1692
  this.removeAttribute('aria-disabled');
2016
1693
  }
2017
1694
  }
2018
-
2019
- if (changedProperties.has('active')) {
2020
- this.updateActiveClasses();
2021
- }
2022
-
2023
- // Update text highlight if matchWord changed
2024
- if (changedProperties.has('matchWord')) {
2025
- this.updateTextHighlight();
2026
- }
2027
-
2028
- // Set the key to be the passed value if no key is provided.
2029
- // Loose equality (== null) is intentional: it catches both null AND
2030
- // undefined. When a framework (e.g. Svelte, React) inserts the element
2031
- // before setting its value property, connectedCallback skips key
2032
- // assignment because both attributes are null at that point. The Lit
2033
- // property default for `key` is undefined (not null), so strict
2034
- // === null would miss the case and the fallback would never run.
2035
- if (changedProperties.has('value') && this.key == null) { // eslint-disable-line eqeqeq, no-eq-null
2036
- this.key = this.value;
2037
- }
2038
- }
2039
-
2040
- disconnectedCallback() {
2041
- if (this.menuService) {
2042
- this.menuService.unsubscribe(this.handleMenuChange);
2043
- this.menuService.removeMenuOption(this);
2044
- }
2045
1695
  }
2046
1696
 
2047
- /**
2048
- * Sets up event listeners for user interaction with the menu option.
2049
- * This function enables click and mouse enter events to trigger selection and highlighting logic.
2050
- */
2051
- bindEvents() {
2052
- this.addEventListener('click', this.handleClick.bind(this));
2053
- this.addEventListener('mouseenter', this.handleMouseEnter.bind(this));
2054
- }
2055
-
2056
- /**
2057
- * Attaches this menu option to a menu service and subscribes to its events.
2058
- * This method enables the option to participate in menu selection and highlighting logic.
2059
- * @param {Object} service - The menu service instance to attach to.
2060
- */
2061
- attachTo(service) {
2062
- if (!service) {
2063
- return;
2064
- }
2065
- this.menuService = service;
2066
- this.menuService.addMenuOption(this);
2067
- this.menuService.subscribe(this.handleMenuChange);
1697
+ handleMenuChange() {
1698
+ // no-op: menu owns state in the distributed architecture
2068
1699
  }
2069
1700
 
2070
- /**
2071
- * Handles changes from the menu service and updates the option's state.
2072
- * This function synchronizes the option's properties and selection/highlight state with menu events.
2073
- * @param {Object} event - The event object from the menu service.
2074
- */
2075
- handleMenuChange(event) {
2076
-
2077
- // Ignore events without a type or property
2078
- if (!event || (!event.type && !event.property)) {
2079
- return;
2080
- }
2081
-
2082
- // Update reactive properties based on event type
2083
- if (event.property && Object.keys(AuroMenuOption.properties).includes(event.property)) {
2084
- this[event.property] = event.value;
2085
- }
2086
-
2087
- // Handle highlight changes
2088
- if (event.type === 'highlightChange') {
2089
- const isActive = event.option === this;
2090
- this.active = isActive;
2091
- this.updateActiveClasses();
2092
- }
2093
-
2094
- if (event.type === 'stateChange') {
2095
- const isSelected = event.selectedOptions.includes(this);
2096
- this.setInternalSelected(isSelected);
2097
- }
1701
+ setSelected(value) {
1702
+ this.selected = value;
2098
1703
  }
2099
1704
 
2100
- /**
2101
- * Updates the internal selected state of the menu option bypassing 'updated' and triggers custom events if selected.
2102
- * This function ensures the option's selection state is synchronized with menu logic and notifies listeners.
2103
- * @param {boolean} isSelected - Whether the option should be marked as selected.
2104
- */
2105
- setInternalSelected(isSelected) {
2106
- this.internalUpdateInProgress = true;
2107
- this.selected = isSelected;
2108
-
2109
- // Fire custom event if selected
2110
- if (isSelected) {
2111
- this.handleCustomEvent();
1705
+ updateActive(active) {
1706
+ this.active = active;
1707
+ if (active) {
1708
+ this.classList.add('active');
1709
+ } else {
1710
+ this.classList.remove('active');
2112
1711
  }
2113
-
2114
- setTimeout(() => {
2115
- this.internalUpdateInProgress = false;
2116
- }, 0);
2117
- }
2118
-
2119
- /**
2120
- * Sets the selected state of the menu option.
2121
- * This function updates whether the option is currently selected.
2122
- * @param {boolean} isSelected - Whether the option should be marked as selected.
2123
- * @deprecated Simply modify the `selected` property directly instead.
2124
- */
2125
- setSelected(isSelected) {
2126
- this.selected = isSelected;
2127
- }
2128
-
2129
- /**
2130
- * Updates the active state and visual highlighting of the menu option.
2131
- * This function toggles the option's active status and applies or removes the active CSS class.
2132
- * @param {boolean} isActive - Whether the option should be marked as active.
2133
- * @deprecated Simply modify the `active` property directly instead.
2134
- */
2135
- updateActive(isActive) {
2136
-
2137
- // Set active state
2138
- this.active = isActive;
2139
- this.updateActiveClasses();
2140
- }
2141
-
2142
- /**
2143
- * Updates the CSS class for the menu option based on its active state.
2144
- * This function adds or removes the 'active' class to visually indicate the option's active status.
2145
- * @private
2146
- */
2147
- updateActiveClasses() {
2148
- // Update class based on active state
2149
- if (this.active) this.classList.add('active');
2150
- else this.classList.remove('active');
2151
1712
  }
2152
1713
 
2153
-
2154
- /**
2155
- * Updates the visual highlighting of text within the menu option based on the current match word.
2156
- * This function highlights matching text segments and manages nested spacers for display formatting.
2157
- * @private
2158
- */
2159
- updateTextHighlight() {
2160
-
2161
- // Regex for matchWord if needed
2162
- let regexWord = null;
2163
-
2164
- if (this.matchWord && this.matchWord.length) {
2165
- const escapedWord = this.matchWord.replace(/[.*+?^${}()|[\]\\]/gu, '\\$&');
2166
- regexWord = new RegExp(escapedWord, 'giu');
2167
- }
2168
-
2169
- // Update text highlighting if matchWord changed
2170
- if (regexWord &&
2171
- this.isActive && !this.hasAttribute('persistent')) {
2172
- const nested = this.querySelectorAll('.nestingSpacer');
2173
-
2174
- const displayValueEl = this.querySelector('[slot="displayValue"]');
2175
- if (displayValueEl) {
2176
- this.removeChild(displayValueEl);
2177
- }
2178
-
2179
- // Create nested spacers
2180
- const nestingSpacerBundle = [...nested].map(() => this.nestingSpacer).join('');
2181
-
2182
- // Update with spacers and matchWord
2183
- this.innerHTML = nestingSpacerBundle +
2184
- this.textContent.replace(
2185
- regexWord,
2186
- (match) => `<strong>${match}</strong>`
2187
- );
2188
- if (displayValueEl) {
2189
- this.append(displayValueEl);
2190
- }
2191
- }
1714
+ attachTo() {
1715
+ // no-op: menu owns state in the distributed architecture
2192
1716
  }
2193
1717
 
2194
1718
  /**
2195
- * Handles click events on the menu option, toggling its selected state.
2196
- * This function dispatches a click event and updates selection if the option is not disabled.
1719
+ * Handles click events on the menu option.
2197
1720
  * @private
2198
1721
  */
2199
1722
  handleClick() {
2200
- if (!this.disabled && !this.menuService?.disabled) {
2201
- this.dispatchClickEvent();
2202
- this.selected = !this.selected;
2203
- }
2204
- }
2205
-
2206
- /**
2207
- * Handles mouse enter events to highlight the menu option.
2208
- * This function updates the menu service to set this option as the currently highlighted item if not disabled.
2209
- * @private
2210
- */
2211
- handleMouseEnter() {
2212
1723
  if (!this.disabled) {
2213
- this.menuService.setHighlightedOption(this);
2214
- }
2215
- }
2216
-
2217
- /**
2218
- * Dispatches custom events defined for this menu option.
2219
- * This function notifies listeners when a custom event is triggered by the option.
2220
- * @private
2221
- */
2222
- handleCustomEvent() {
2223
- if (this.event) {
2224
- dispatchMenuEvent(this, this.event, { option: this });
2225
- dispatchMenuEvent(this, 'auroMenu-customEventFired', { option: this });
1724
+ // Pure event emitter: the parent menu owns selection state and will
1725
+ // update `selected` via setSelected(). Toggling here desyncs the option
1726
+ // UI from auro-menu.optionSelected (e.g. single-select re-click on the
1727
+ // already-selected option would flip the option off while the menu keeps it on).
1728
+ this.dispatchEvent(new CustomEvent('auroMenuOption-click', {
1729
+ bubbles: true,
1730
+ cancelable: false,
1731
+ composed: true,
1732
+ detail: this
1733
+ }));
2226
1734
  }
2227
1735
  }
2228
1736
 
2229
- /**
2230
- * Dispatches a click event for this menu option.
2231
- * This function notifies listeners that the option has been clicked.
2232
- * @private
2233
- */
2234
- dispatchClickEvent() {
2235
- this.dispatchEvent(new CustomEvent('auroMenuOption-click', {
2236
- bubbles: true,
2237
- cancelable: false,
2238
- composed: true,
2239
- detail: this
2240
- }));
2241
- }
2242
-
2243
1737
  /**
2244
1738
  * Generates an HTML element containing an SVG icon based on the provided `svgContent`.
2245
1739
  *
@@ -2279,14 +1773,111 @@ class AuroMenuOption extends AuroElement {
2279
1773
  return u$1`
2280
1774
  <div class="${classes}">
2281
1775
  ${this.selected && !this.noCheckmark
2282
- ? this.generateIconHtml(checkmarkIcon.svg)
2283
- : undefined}
1776
+ ? this.generateIconHtml(checkmarkIcon.svg)
1777
+ : undefined}
2284
1778
  <slot></slot>
2285
1779
  </div>
2286
1780
  `;
2287
1781
  }
2288
1782
  }
2289
1783
 
1784
+ function auroMenuLoadingExample() {
1785
+ document.querySelector("#loadingExampleToggleButton").addEventListener("click", () => {
1786
+ document.querySelectorAll("#loadingExampleTable auro-menu").forEach(menu => menu.toggleAttribute("loading"));
1787
+ });
1788
+ }
1789
+
1790
+ function updateMatch() {
1791
+ let matchWordMenu = document.querySelector('#matchWordMenu');
1792
+
1793
+ matchWordMenu.matchWord = matchWordInput.value;
1794
+ }
1795
+
1796
+ function auroMenuMatchWordExample() {
1797
+ let matchWordInput = document.querySelector('#matchWordInput');
1798
+
1799
+ matchWordInput.addEventListener('keyup', updateMatch);
1800
+ }
1801
+
1802
+ function auroMenuResetExample() {
1803
+ const resetExampleBtnElem = document.querySelector('#resetExampleBtn');
1804
+ const resetExampleElem = document.querySelector('#resetExample');
1805
+
1806
+ if (resetExampleElem && resetExampleBtnElem) {
1807
+ resetExampleBtnElem.addEventListener('click', () => {
1808
+ resetExampleElem.reset();
1809
+ });
1810
+ }
1811
+ }
1812
+
1813
+ function auroMenuEventAttributeExample() {
1814
+ const menu = document.querySelector('#eventAttrExample');
1815
+ const output = document.querySelector('#eventAttrOutput');
1816
+
1817
+ menu.addEventListener('auroMenu-customEventFired', (evt) => {
1818
+ const eventName = evt.detail.option.getAttribute('event');
1819
+ output.textContent = `${eventName} (from "${evt.detail.option.textContent}")`;
1820
+ });
1821
+ }
1822
+
1823
+ function auroMenuEventsExample() {
1824
+ const menu = document.querySelector('#eventsExampleMenu');
1825
+ const log = document.querySelector('#eventsExampleLog');
1826
+ const resetBtn = document.querySelector('#eventsExampleReset');
1827
+ const badValueBtn = document.querySelector('#eventsExampleBadValue');
1828
+ const clearBtn = document.querySelector('#eventsExampleClearLog');
1829
+
1830
+ let entries = [];
1831
+ const write = (name, detail) => {
1832
+ const label = detail && detail.tagName ? detail.tagName.toLowerCase() : JSON.stringify(detail);
1833
+ entries.unshift(`${name}: ${label}`);
1834
+ log.textContent = entries.slice(0, 10).join('\n');
1835
+ };
1836
+
1837
+ menu.addEventListener('auroMenu-selectedOption', () => {
1838
+ write('auroMenu-selectedOption', menu.optionSelected);
1839
+ });
1840
+ menu.addEventListener('auroMenu-activatedOption', (evt) => {
1841
+ write('auroMenu-activatedOption', evt.detail);
1842
+ });
1843
+ menu.addEventListener('auroMenu-optionsChange', (evt) => {
1844
+ write('auroMenu-optionsChange', { count: (evt.detail.options || []).length });
1845
+ });
1846
+ menu.addEventListener('auroMenu-selectValueReset', () => {
1847
+ write('auroMenu-selectValueReset', { value: menu.value });
1848
+ });
1849
+ menu.addEventListener('auroMenu-selectValueFailure', (evt) => {
1850
+ write('auroMenu-selectValueFailure', evt.detail);
1851
+ });
1852
+
1853
+ resetBtn.addEventListener('click', () => menu.reset());
1854
+ badValueBtn.addEventListener('click', () => menu.selectByValue('nonexistent'));
1855
+ clearBtn.addEventListener('click', () => {
1856
+ entries = [];
1857
+ log.textContent = '(interact with the menu above)';
1858
+ });
1859
+ }
1860
+
1861
+ function auroMenuPersistentExample() {
1862
+ const input = document.querySelector('#persistentExampleInput');
1863
+ const menu = document.querySelector('#persistentExampleMenu');
1864
+
1865
+ input.addEventListener('keyup', () => {
1866
+ menu.matchWord = input.value;
1867
+ });
1868
+ }
1869
+
1870
+ function auroMenuSelectByValueExample() {
1871
+ const menu = document.querySelector('#selectByValueMenu');
1872
+ const stopsBtn = document.querySelector('#selectByValueStops');
1873
+ const durationBtn = document.querySelector('#selectByValueDuration');
1874
+ const clearBtn = document.querySelector('#selectByValueClear');
1875
+
1876
+ stopsBtn.addEventListener('click', () => menu.selectByValue('stops'));
1877
+ durationBtn.addEventListener('click', () => menu.selectByValue('duration'));
1878
+ clearBtn.addEventListener('click', () => menu.selectByValue(undefined));
1879
+ }
1880
+
2290
1881
  /* eslint-disable jsdoc/require-jsdoc, no-magic-numbers, no-param-reassign */
2291
1882
 
2292
1883
 
@@ -2295,7 +1886,36 @@ AuroMenuOption.register();
2295
1886
  AuroMenu.register('custom-menu');
2296
1887
  AuroMenuOption.register('custom-menuoption');
2297
1888
 
2298
- function initExamples(initCount) {
1889
+ const examples = [
1890
+ auroMenuLoadingExample,
1891
+ auroMenuMatchWordExample,
1892
+ auroMenuResetExample,
1893
+ auroMenuEventAttributeExample,
1894
+ auroMenuEventsExample,
1895
+ auroMenuPersistentExample,
1896
+ auroMenuSelectByValueExample
1897
+ ];
1898
+
1899
+ function initExamples(pending, initCount) {
1900
+ pending = pending || examples.slice();
1901
+ initCount = initCount || 0;
1902
+ const stillPending = [];
1903
+
1904
+ for (const fn of pending) {
1905
+ try {
1906
+ fn();
1907
+ } catch {
1908
+ stillPending.push(fn);
1909
+ }
1910
+ }
1911
+
1912
+ if (stillPending.length && initCount <= 20) {
1913
+ setTimeout(() => {
1914
+ initExamples(stillPending, initCount + 1);
1915
+ }, 100);
1916
+ }
2299
1917
  }
2300
1918
 
1919
+ initExamples();
1920
+
2301
1921
  export { initExamples };