@aurodesignsystem/auro-formkit 5.10.0 → 5.11.0
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.
- package/CHANGELOG.md +55 -15
- package/components/bibtemplate/dist/auro-bibtemplate.d.ts +6 -0
- package/components/bibtemplate/dist/index.js +12 -0
- package/components/bibtemplate/dist/registered.js +12 -0
- package/components/checkbox/demo/api.min.js +3 -3
- package/components/checkbox/demo/index.min.js +3 -3
- package/components/checkbox/dist/index.js +3 -3
- package/components/checkbox/dist/registered.js +3 -3
- package/components/combobox/demo/api.min.js +1140 -305
- package/components/combobox/demo/index.min.js +1140 -305
- package/components/combobox/dist/auro-combobox.d.ts +24 -1
- package/components/combobox/dist/comboboxKeyboardStrategy.d.ts +6 -0
- package/components/combobox/dist/index.js +1082 -264
- package/components/combobox/dist/registered.js +1082 -264
- package/components/counter/demo/api.min.js +583 -172
- package/components/counter/demo/index.min.js +583 -172
- package/components/counter/dist/auro-counter.d.ts +8 -0
- package/components/counter/dist/buttonVersion.d.ts +1 -1
- package/components/counter/dist/iconVersion.d.ts +1 -1
- package/components/counter/dist/index.js +583 -172
- package/components/counter/dist/registered.js +583 -172
- package/components/datepicker/demo/api.md +108 -85
- package/components/datepicker/demo/api.min.js +872 -257
- package/components/datepicker/demo/index.md +18 -12
- package/components/datepicker/demo/index.min.js +872 -257
- package/components/datepicker/dist/auro-calendar.d.ts +6 -0
- package/components/datepicker/dist/auro-datepicker.d.ts +11 -1
- package/components/datepicker/dist/index.js +819 -208
- package/components/datepicker/dist/registered.js +819 -208
- package/components/dropdown/demo/api.md +15 -17
- package/components/dropdown/demo/api.min.js +537 -183
- package/components/dropdown/demo/index.min.js +537 -183
- package/components/dropdown/dist/auro-dropdown.d.ts +27 -1
- package/components/dropdown/dist/auro-dropdownBib.d.ts +87 -0
- package/components/dropdown/dist/index.js +514 -160
- package/components/dropdown/dist/keyboardUtils.d.ts +18 -0
- package/components/dropdown/dist/registered.js +514 -160
- package/components/form/README.md +47 -2
- package/components/form/demo/api.js +2 -0
- package/components/form/demo/api.md +303 -30
- package/components/form/demo/api.min.js +69256 -62
- package/components/form/demo/index.html +0 -1
- package/components/form/demo/index.js +1 -0
- package/components/form/demo/index.md +1 -275
- package/components/form/demo/index.min.js +69255 -62
- package/components/form/demo/readme.md +47 -2
- package/components/form/demo/working.html +123 -32
- package/components/form/dist/auro-form.d.ts +98 -61
- package/components/form/dist/index.js +135 -51
- package/components/form/dist/registered.js +135 -51
- package/components/input/demo/api.md +1 -0
- package/components/input/demo/api.min.js +78 -24
- package/components/input/demo/index.min.js +78 -24
- package/components/input/dist/base-input.d.ts +34 -0
- package/components/input/dist/index.js +78 -24
- package/components/input/dist/registered.js +78 -24
- package/components/menu/demo/api.md +4 -10
- package/components/menu/demo/api.min.js +18 -5
- package/components/menu/demo/index.min.js +18 -5
- package/components/menu/dist/auro-menuoption.d.ts +0 -8
- package/components/menu/dist/iconVersion.d.ts +1 -1
- package/components/menu/dist/index.js +18 -5
- package/components/menu/dist/registered.js +18 -5
- package/components/radio/demo/api.min.js +3 -3
- package/components/radio/demo/index.min.js +3 -3
- package/components/radio/dist/index.js +3 -3
- package/components/radio/dist/registered.js +3 -3
- package/components/select/demo/api.js +2 -0
- package/components/select/demo/api.md +333 -78
- package/components/select/demo/api.min.js +945 -282
- package/components/select/demo/index.min.js +933 -282
- package/components/select/dist/auro-select.d.ts +26 -0
- package/components/select/dist/index.js +881 -247
- package/components/select/dist/registered.js +881 -247
- package/components/select/dist/selectKeyboardStrategy.d.ts +8 -0
- package/custom-elements.json +596 -89
- package/package.json +7 -5
|
@@ -3,20 +3,20 @@
|
|
|
3
3
|
* Copyright 2019 Google LLC
|
|
4
4
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
5
|
*/
|
|
6
|
-
const t$2=globalThis,e$
|
|
6
|
+
const t$2=globalThis,e$7=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$7=Symbol(),o$7=new WeakMap;let n$7 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$7)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$7&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$7.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$7.set(s,t));}return t}toString(){return this.cssText}};const r$5=t=>new n$7("string"==typeof t?t:t+"",void 0,s$7),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$7(o,t,s$7)},S$2=(s,o)=>{if(e$7)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$5=e$7?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$5(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$
|
|
12
|
+
*/const{is:i$5,defineProperty:e$6,getOwnPropertyDescriptor:h$4,getOwnPropertyNames:r$4,getOwnPropertySymbols:o$6,getPrototypeOf:n$6}=Object,a$2=globalThis,c$4=a$2.trustedTypes,l$3=c$4?c$4.emptyScript:"",p$5=a$2.reactiveElementPolyfillSupport,d$2=(t,s)=>t,u$6={toAttribute(t,s){switch(s){case Boolean:t=t?l$3: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$6=(t,s)=>!i$5(t,s),b$2={attribute:true,type:String,converter:u$6,reflect:false,useDefault:false,hasChanged:f$6};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;let y$5 = 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$2){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$6(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$4(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$2}static _$Ei(){if(this.hasOwnProperty(d$2("elementProperties")))return;const t=n$6(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$2("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$2("properties"))){const t=this.properties,s=[...r$4(t),...o$6(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$5(s));}else void 0!==s&&i.push(c$5(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$2(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$6).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$6;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$6)(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$5.elementStyles=[],y$5.shadowRootOptions={mode:"open"},y$5[d$2("elementProperties")]=new Map,y$5[d$2("finalized")]=new Map,p$5?.({ReactiveElement:y$5}),(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$6=t$1.trustedTypes,e$
|
|
19
|
+
const t$1=globalThis,i$4=t=>t,s$6=t$1.trustedTypes,e$5=s$6?s$6.createPolicy("lit-html",{createHTML:t=>t}):void 0,h$3="$lit$",o$5=`lit$${Math.random().toFixed(9).slice(2)}$`,n$5="?"+o$5,r$3=`<${n$5}>`,l$2=document,c$3=()=>l$2.createComment(""),a$1=t=>null===t||"object"!=typeof t&&"function"!=typeof t,u$5=Array.isArray,d$1=t=>u$5(t)||"function"==typeof t?.[Symbol.iterator],f$5="[ \t\n\f\r]",v$1=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_$3=/-->/g,m$4=/>/g,p$4=RegExp(`>|${f$5}(?:([^\\s"'>=/]+)(${f$5}*=${f$5}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g$4=/'/g,$=/"/g,y$4=/^(?:script|style|textarea|title)$/i,x$4=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),b$1=x$4(1),E=Symbol.for("lit-noChange"),A$1=Symbol.for("lit-nothing"),C$1=new WeakMap,P=l$2.createTreeWalker(l$2,129);function V(t,i){if(!u$5(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$5?e$5.createHTML(i):i}const N$1=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v$1;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$1?"!--"===u[1]?c=_$3:void 0!==u[1]?c=m$4:void 0!==u[2]?(y$4.test(u[2])&&(n=RegExp("</"+u[2],"g")),c=p$4):void 0!==u[3]&&(c=p$4):c===p$4?">"===u[0]?(c=n??v$1,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?p$4:'"'===u[3]?$:g$4):c===$||c===g$4?c=p$4:c===_$3||c===m$4?c=v$1:(c=p$4,n=void 0);const x=c===p$4&&t[i+1].startsWith("/>")?" ":"";l+=c===v$1?s+r$3:d>=0?(e.push(a),s.slice(0,d)+h$3+s.slice(d)+o$5+x):s+o$5+(-2===d?i:x);}return [V(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};let S$1 = 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$1(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$3)){const i=v[a++],s=r.getAttribute(t).split(o$5),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z$4:H$1}),r.removeAttribute(t);}else t.startsWith(o$5)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y$4.test(r.tagName)){const t=r.textContent.split(o$5),i=t.length-1;if(i>0){r.textContent=s$6?s$6.emptyScript:"";for(let s=0;s<i;s++)r.append(t[s],c$3()),P.nextNode(),d.push({type:2,index:++l});r.append(t[i],c$3());}}}else if(8===r.nodeType)if(r.data===n$5)d.push({type:2,index:l});else {let t=-1;for(;-1!==(t=r.data.indexOf(o$5,t+1));)d.push({type:7,index:l}),t+=o$5.length-1;}l++;}}static createElement(t,i){const s=l$2.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}let R$1 = 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$2).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$2,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$1,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$1||null==t||""===t?(this._$AH!==A$1&&this._$AR(),this._$AH=A$1):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d$1(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$1&&a$1(this._$AH)?this._$AA.nextSibling.data=t:this.T(l$2.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$1.createElement(V(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new R$1(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C$1.get(t.strings);return void 0===i&&C$1.set(t.strings,i=new S$1(t)),i}k(t){u$5(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$3()),this.O(c$3()),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));}};let H$1 = 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$1,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$1;}_$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$1?t=A$1:t!==A$1&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A$1?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}};class I extends H$1{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A$1?void 0:t;}}class L extends H$1{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A$1);}}let z$4 = class z extends H$1{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$1)===E)return;const s=this._$AH,e=t===A$1&&s!==A$1||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A$1&&(s===A$1||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$1=t$1.litHtmlPolyfillSupport;B$1?.(S$1,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$3(),t),t,void 0,s??{});}return h._$AI(t),h};
|
|
20
20
|
|
|
21
21
|
/**
|
|
22
22
|
* @license
|
|
@@ -29,13 +29,13 @@ const t$1=globalThis,i$4=t=>t,s$6=t$1.trustedTypes,e$4=s$6?s$6.createPolicy("lit
|
|
|
29
29
|
* Copyright 2017 Google LLC
|
|
30
30
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
31
31
|
*/
|
|
32
|
-
const t={ATTRIBUTE:1,CHILD:2},e$
|
|
32
|
+
const t={ATTRIBUTE:1,CHILD:2},e$4=t=>(...e)=>({_$litDirective$:t,values:e});let i$2 = class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};
|
|
33
33
|
|
|
34
34
|
/**
|
|
35
35
|
* @license
|
|
36
36
|
* Copyright 2018 Google LLC
|
|
37
37
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
38
|
-
*/const e$
|
|
38
|
+
*/const e$3=e$4(class extends i$2{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}});
|
|
39
39
|
|
|
40
40
|
/**
|
|
41
41
|
* @license
|
|
@@ -991,7 +991,7 @@ class AuroFormValidation {
|
|
|
991
991
|
}
|
|
992
992
|
}
|
|
993
993
|
|
|
994
|
-
if (!hasValue && elem.required && elem.touched) {
|
|
994
|
+
if (!hasValue && elem.required && (force || elem.touched)) {
|
|
995
995
|
elem.validity = 'valueMissing';
|
|
996
996
|
elem.errorMessage = elem.setCustomValidityValueMissing || elem.setCustomValidity || '';
|
|
997
997
|
} else if (hasValue && this.runtimeUtils.elementMatch(elem, 'auro-input')) {
|
|
@@ -1015,7 +1015,7 @@ class AuroFormValidation {
|
|
|
1015
1015
|
if (!isCombobox || isCombobox && !elem.persistInput) {
|
|
1016
1016
|
|
|
1017
1017
|
// run validation on all inputs since we're going to use them to set the validity of this component
|
|
1018
|
-
this.auroInputElements.forEach(input => input.validate());
|
|
1018
|
+
this.auroInputElements.forEach(input => input.validate(force));
|
|
1019
1019
|
|
|
1020
1020
|
// Reset element validity to the validity of the input
|
|
1021
1021
|
elem.validity = this.auroInputElements[0].validity;
|
|
@@ -1106,6 +1106,177 @@ class AuroFormValidation {
|
|
|
1106
1106
|
}
|
|
1107
1107
|
}
|
|
1108
1108
|
|
|
1109
|
+
/**
|
|
1110
|
+
* Announces text to screen readers via an `aria-live` region inside the given shadow root.
|
|
1111
|
+
*
|
|
1112
|
+
* Expects the shadow root to contain an element with `id="srAnnouncement"`.
|
|
1113
|
+
* The text is cleared and re-set inside a `requestAnimationFrame` so that
|
|
1114
|
+
* repeated identical announcements still fire, and is cleared again after
|
|
1115
|
+
* {@link ANNOUNCEMENT_DURATION_MS} so VoiceOver cannot swipe to stale text.
|
|
1116
|
+
*
|
|
1117
|
+
* @param {ShadowRoot} shadowRoot - The shadow root containing the live region.
|
|
1118
|
+
* @param {string} text - The text to announce.
|
|
1119
|
+
*/
|
|
1120
|
+
|
|
1121
|
+
const ANNOUNCEMENT_DURATION_MS = 1000;
|
|
1122
|
+
|
|
1123
|
+
function announceToScreenReader(shadowRoot, text) {
|
|
1124
|
+
const liveRegion = shadowRoot.querySelector('#srAnnouncement');
|
|
1125
|
+
if (liveRegion) {
|
|
1126
|
+
// Clear and re-set to ensure the announcement fires even with same text
|
|
1127
|
+
liveRegion.textContent = '';
|
|
1128
|
+
requestAnimationFrame(() => {
|
|
1129
|
+
liveRegion.textContent = text;
|
|
1130
|
+
|
|
1131
|
+
// Clear after the announcement so VoiceOver cannot swipe to stale text
|
|
1132
|
+
setTimeout(() => {
|
|
1133
|
+
liveRegion.textContent = '';
|
|
1134
|
+
}, ANNOUNCEMENT_DURATION_MS);
|
|
1135
|
+
});
|
|
1136
|
+
}
|
|
1137
|
+
}
|
|
1138
|
+
|
|
1139
|
+
/**
|
|
1140
|
+
* Schedules a callback after two animation frames.
|
|
1141
|
+
*
|
|
1142
|
+
* Used when opening a fullscreen dialog to wait for the dialog to render
|
|
1143
|
+
* (first frame) and then for a Lit update cycle to complete (second frame)
|
|
1144
|
+
* before performing an action like focusing the close button.
|
|
1145
|
+
*
|
|
1146
|
+
* @param {Function} fn - The callback to execute after two animation frames.
|
|
1147
|
+
*/
|
|
1148
|
+
function doubleRaf(fn) {
|
|
1149
|
+
requestAnimationFrame(() => {
|
|
1150
|
+
requestAnimationFrame(fn);
|
|
1151
|
+
});
|
|
1152
|
+
}
|
|
1153
|
+
|
|
1154
|
+
/**
|
|
1155
|
+
* Prevents touch pass-through when a fullscreen dialog opens on a touch device.
|
|
1156
|
+
*
|
|
1157
|
+
* On coarse-pointer devices (phones / tablets), the tap that opens the
|
|
1158
|
+
* fullscreen dialog can "pass through" to content beneath the finger —
|
|
1159
|
+
* the touchstart opens the dialog, but the finger is still on the screen,
|
|
1160
|
+
* so the subsequent touchend / click lands on whatever element sits at
|
|
1161
|
+
* those coordinates (e.g. a menu option or calendar cell), selecting it
|
|
1162
|
+
* unintentionally. This does NOT happen with mouse clicks because
|
|
1163
|
+
* showModal() promotes the dialog to the top layer synchronously and the
|
|
1164
|
+
* click has already completed.
|
|
1165
|
+
*
|
|
1166
|
+
* Guard: only activates on devices whose primary input is coarse.
|
|
1167
|
+
* Laptops with a touchscreen report `pointer: fine` (trackpad / mouse is
|
|
1168
|
+
* primary) so they are unaffected. Re-enables on the next touchstart,
|
|
1169
|
+
* which is the user's first deliberate gesture inside the dialog.
|
|
1170
|
+
*
|
|
1171
|
+
* @param {HTMLElement} element - The element to disable pointer events on
|
|
1172
|
+
* (e.g. the menu or calendar wrapper).
|
|
1173
|
+
*/
|
|
1174
|
+
function guardTouchPassthrough(element) {
|
|
1175
|
+
if (!element || !window.matchMedia('(pointer: coarse)').matches) return;
|
|
1176
|
+
|
|
1177
|
+
element.style.pointerEvents = 'none';
|
|
1178
|
+
document.addEventListener('touchstart', () => {
|
|
1179
|
+
element.style.pointerEvents = '';
|
|
1180
|
+
}, { once: true });
|
|
1181
|
+
}
|
|
1182
|
+
|
|
1183
|
+
/**
|
|
1184
|
+
* Restores the dropdown trigger after a fullscreen dialog closes.
|
|
1185
|
+
*
|
|
1186
|
+
* Removes the `inert` attribute from the trigger so it is accessible again,
|
|
1187
|
+
* and restores focus to the given target after one animation frame. The rAF
|
|
1188
|
+
* delay lets Lit's microtask update cycle call `dialog.close()` first —
|
|
1189
|
+
* without it the browser's native dialog focus restoration can conflict.
|
|
1190
|
+
*
|
|
1191
|
+
* The focus is only applied if the dropdown is still closed at the time the
|
|
1192
|
+
* rAF fires, guarding against a rapid close-then-reopen race.
|
|
1193
|
+
*
|
|
1194
|
+
* @param {HTMLElement} dropdown - The `auro-dropdown` element.
|
|
1195
|
+
* @param {HTMLElement} focusTarget - The element to focus (e.g. trigger or input).
|
|
1196
|
+
*/
|
|
1197
|
+
function restoreTriggerAfterClose(dropdown, focusTarget) {
|
|
1198
|
+
dropdown.trigger.inert = false;
|
|
1199
|
+
|
|
1200
|
+
if (dropdown.isBibFullscreen) {
|
|
1201
|
+
requestAnimationFrame(() => {
|
|
1202
|
+
if (!dropdown.isPopoverVisible) {
|
|
1203
|
+
focusTarget.focus();
|
|
1204
|
+
}
|
|
1205
|
+
});
|
|
1206
|
+
}
|
|
1207
|
+
}
|
|
1208
|
+
|
|
1209
|
+
/**
|
|
1210
|
+
* @license
|
|
1211
|
+
* Copyright 2017 Google LLC
|
|
1212
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
1213
|
+
*/let e$2 = class e extends i$2{constructor(i){if(super(i),this.it=A$1,i.type!==t.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(r){if(r===A$1||null==r)return this._t=void 0,this.it=r;if(r===E)return r;if("string"!=typeof r)throw Error(this.constructor.directiveName+"() called with a non-string value");if(r===this.it)return this._t;this.it=r;const s=[r];return s.raw=s,this._t={_$litType$:this.constructor.resultType,strings:s,values:[]}}};e$2.directiveName="unsafeHTML",e$2.resultType=1;
|
|
1214
|
+
|
|
1215
|
+
/**
|
|
1216
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
1217
|
+
* Handles both sync and async handlers.
|
|
1218
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
1219
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
1220
|
+
*/
|
|
1221
|
+
function applyKeyboardStrategy(component, strategy) {
|
|
1222
|
+
component.addEventListener('keydown', async (evt) => {
|
|
1223
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
1224
|
+
if (handler) {
|
|
1225
|
+
await handler(component, evt);
|
|
1226
|
+
}
|
|
1227
|
+
});
|
|
1228
|
+
}
|
|
1229
|
+
|
|
1230
|
+
/**
|
|
1231
|
+
* Shared arrow navigation. Calls menu.navigateOptions(direction) if visible.
|
|
1232
|
+
* Optionally opens dropdown via showFn when closed.
|
|
1233
|
+
* @param {HTMLElement} component - The component with dropdown and menu references.
|
|
1234
|
+
* @param {string} direction - 'up' or 'down'.
|
|
1235
|
+
* @param {Object} [options] - Optional config.
|
|
1236
|
+
* @param {Function} [options.showFn] - Called to open the dropdown when closed.
|
|
1237
|
+
*/
|
|
1238
|
+
function navigateArrow(component, direction, options = {}) {
|
|
1239
|
+
if (component.dropdown.isPopoverVisible) {
|
|
1240
|
+
component.menu.navigateOptions(direction);
|
|
1241
|
+
} else if (options.showFn) {
|
|
1242
|
+
options.showFn();
|
|
1243
|
+
}
|
|
1244
|
+
}
|
|
1245
|
+
|
|
1246
|
+
const selectKeyboardStrategy = {
|
|
1247
|
+
ArrowUp(component, evt) {
|
|
1248
|
+
evt.preventDefault();
|
|
1249
|
+
navigateArrow(component, 'up', { showFn: () => component.dropdown.show() });
|
|
1250
|
+
},
|
|
1251
|
+
|
|
1252
|
+
ArrowDown(component, evt) {
|
|
1253
|
+
evt.preventDefault();
|
|
1254
|
+
navigateArrow(component, 'down', { showFn: () => component.dropdown.show() });
|
|
1255
|
+
},
|
|
1256
|
+
|
|
1257
|
+
Enter(component, evt) {
|
|
1258
|
+
evt.preventDefault();
|
|
1259
|
+
component.menu.makeSelection();
|
|
1260
|
+
},
|
|
1261
|
+
|
|
1262
|
+
Tab(component) {
|
|
1263
|
+
if (!component.dropdown.isPopoverVisible) {
|
|
1264
|
+
return;
|
|
1265
|
+
}
|
|
1266
|
+
|
|
1267
|
+
// Tab selects the focused option and closes the popup per the
|
|
1268
|
+
// WAI-ARIA APG select-only combobox / listbox pattern.
|
|
1269
|
+
if (component.optionActive && !component.multiSelect) {
|
|
1270
|
+
component.menu.makeSelection();
|
|
1271
|
+
}
|
|
1272
|
+
component.dropdown.hide();
|
|
1273
|
+
},
|
|
1274
|
+
|
|
1275
|
+
default(component, evt) {
|
|
1276
|
+
component.updateActiveOptionBasedOnKey(evt.key);
|
|
1277
|
+
},
|
|
1278
|
+
};
|
|
1279
|
+
|
|
1109
1280
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
1110
1281
|
// See LICENSE in the project root for license information.
|
|
1111
1282
|
|
|
@@ -1162,7 +1333,7 @@ let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
|
|
|
1162
1333
|
* @license
|
|
1163
1334
|
* Copyright 2020 Google LLC
|
|
1164
1335
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
1165
|
-
*/const e$1=()=>new h$1;let h$1 = class h{};const o$1=new WeakMap,n$2=e$
|
|
1336
|
+
*/const e$1=()=>new h$1;let h$1 = class h{};const o$1=new WeakMap,n$2=e$4(class extends f$4{render(i){return A$1}update(i,[s]){const e=s!==this.G;return e&&void 0!==this.G&&this.rt(void 0),(e||this.lt!==this.ct)&&(this.G=s,this.ht=i.options?.host,this.rt(this.ct=i.element)),A$1}rt(t){if(this.isConnected||(t=void 0),"function"==typeof this.G){const i=this.ht??globalThis;let s=o$1.get(i);void 0===s&&(s=new WeakMap,o$1.set(i,s)),void 0!==s.get(this.G)&&this.G.call(this.ht,void 0),s.set(this.G,t),void 0!==t&&this.G.call(this.ht,t);}else this.G.value=t;}get lt(){return "function"==typeof this.G?o$1.get(this.ht??globalThis)?.get(this.G):this.G?.value}disconnected(){this.lt===this.ct&&this.rt(void 0);}reconnected(){this.rt(this.ct);}});
|
|
1166
1337
|
|
|
1167
1338
|
/**
|
|
1168
1339
|
* @license
|
|
@@ -2897,11 +3068,9 @@ const computePosition = (reference, floating, options) => {
|
|
|
2897
3068
|
/* eslint-disable line-comment-position, no-inline-comments */
|
|
2898
3069
|
|
|
2899
3070
|
|
|
2900
|
-
|
|
2901
3071
|
const MAX_CONFIGURATION_COUNT = 10;
|
|
2902
3072
|
|
|
2903
3073
|
class AuroFloatingUI {
|
|
2904
|
-
|
|
2905
3074
|
/**
|
|
2906
3075
|
* @private
|
|
2907
3076
|
*/
|
|
@@ -2916,7 +3085,11 @@ class AuroFloatingUI {
|
|
|
2916
3085
|
* @private
|
|
2917
3086
|
*/
|
|
2918
3087
|
static setupMousePressChecker() {
|
|
2919
|
-
if (
|
|
3088
|
+
if (
|
|
3089
|
+
!AuroFloatingUI.isMousePressHandlerInitialized &&
|
|
3090
|
+
window &&
|
|
3091
|
+
window.addEventListener
|
|
3092
|
+
) {
|
|
2920
3093
|
AuroFloatingUI.isMousePressHandlerInitialized = true;
|
|
2921
3094
|
|
|
2922
3095
|
// Track timeout for isMousePressed reset to avoid race conditions
|
|
@@ -2924,7 +3097,7 @@ class AuroFloatingUI {
|
|
|
2924
3097
|
AuroFloatingUI._mousePressedTimeout = null;
|
|
2925
3098
|
}
|
|
2926
3099
|
const mouseEventGlobalHandler = (event) => {
|
|
2927
|
-
const isPressed = event.type ===
|
|
3100
|
+
const isPressed = event.type === "mousedown";
|
|
2928
3101
|
if (isPressed) {
|
|
2929
3102
|
// Clear any pending timeout to prevent race condition
|
|
2930
3103
|
if (AuroFloatingUI._mousePressedTimeout !== null) {
|
|
@@ -2943,8 +3116,8 @@ class AuroFloatingUI {
|
|
|
2943
3116
|
}
|
|
2944
3117
|
};
|
|
2945
3118
|
|
|
2946
|
-
window.addEventListener(
|
|
2947
|
-
window.addEventListener(
|
|
3119
|
+
window.addEventListener("mousedown", mouseEventGlobalHandler);
|
|
3120
|
+
window.addEventListener("mouseup", mouseEventGlobalHandler);
|
|
2948
3121
|
}
|
|
2949
3122
|
}
|
|
2950
3123
|
|
|
@@ -2992,11 +3165,12 @@ class AuroFloatingUI {
|
|
|
2992
3165
|
// mirror the boxsize from bibSizer
|
|
2993
3166
|
if (this.element.bibSizer && this.element.matchWidth) {
|
|
2994
3167
|
const sizerStyle = window.getComputedStyle(this.element.bibSizer);
|
|
2995
|
-
const bibContent =
|
|
2996
|
-
|
|
3168
|
+
const bibContent =
|
|
3169
|
+
this.element.bib.shadowRoot.querySelector(".container");
|
|
3170
|
+
if (sizerStyle.width !== "0px") {
|
|
2997
3171
|
bibContent.style.width = sizerStyle.width;
|
|
2998
3172
|
}
|
|
2999
|
-
if (sizerStyle.height !==
|
|
3173
|
+
if (sizerStyle.height !== "0px") {
|
|
3000
3174
|
bibContent.style.height = sizerStyle.height;
|
|
3001
3175
|
}
|
|
3002
3176
|
bibContent.style.maxWidth = sizerStyle.maxWidth;
|
|
@@ -3014,28 +3188,34 @@ class AuroFloatingUI {
|
|
|
3014
3188
|
* @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
|
|
3015
3189
|
*/
|
|
3016
3190
|
getPositioningStrategy() {
|
|
3017
|
-
const breakpoint =
|
|
3191
|
+
const breakpoint =
|
|
3192
|
+
this.element.bib.mobileFullscreenBreakpoint ||
|
|
3193
|
+
this.element.floaterConfig?.fullscreenBreakpoint;
|
|
3018
3194
|
switch (this.behavior) {
|
|
3019
3195
|
case "tooltip":
|
|
3020
3196
|
return "floating";
|
|
3021
3197
|
case "dialog":
|
|
3022
3198
|
case "drawer":
|
|
3023
3199
|
if (breakpoint) {
|
|
3024
|
-
const smallerThanBreakpoint = window.matchMedia(
|
|
3200
|
+
const smallerThanBreakpoint = window.matchMedia(
|
|
3201
|
+
`(max-width: ${breakpoint})`,
|
|
3202
|
+
).matches;
|
|
3025
3203
|
|
|
3026
3204
|
this.element.expanded = smallerThanBreakpoint;
|
|
3027
3205
|
}
|
|
3028
3206
|
if (this.element.nested) {
|
|
3029
3207
|
return "cover";
|
|
3030
3208
|
}
|
|
3031
|
-
return
|
|
3209
|
+
return "fullscreen";
|
|
3032
3210
|
case "dropdown":
|
|
3033
3211
|
case undefined:
|
|
3034
3212
|
case null:
|
|
3035
3213
|
if (breakpoint) {
|
|
3036
|
-
const smallerThanBreakpoint = window.matchMedia(
|
|
3214
|
+
const smallerThanBreakpoint = window.matchMedia(
|
|
3215
|
+
`(max-width: ${breakpoint})`,
|
|
3216
|
+
).matches;
|
|
3037
3217
|
if (smallerThanBreakpoint) {
|
|
3038
|
-
return
|
|
3218
|
+
return "fullscreen";
|
|
3039
3219
|
}
|
|
3040
3220
|
}
|
|
3041
3221
|
return "floating";
|
|
@@ -3056,37 +3236,39 @@ class AuroFloatingUI {
|
|
|
3056
3236
|
const strategy = this.getPositioningStrategy();
|
|
3057
3237
|
this.configureBibStrategy(strategy);
|
|
3058
3238
|
|
|
3059
|
-
if (strategy ===
|
|
3239
|
+
if (strategy === "floating") {
|
|
3060
3240
|
this.mirrorSize();
|
|
3061
3241
|
// Define the middlware for the floater configuration
|
|
3062
3242
|
const middleware = [
|
|
3063
3243
|
offset(this.element.floaterConfig?.offset || 0),
|
|
3064
|
-
...this.element.floaterConfig?.shift ? [shift()] : [], // Add shift middleware if shift is enabled.
|
|
3065
|
-
...this.element.floaterConfig?.flip ? [flip()] : [], // Add flip middleware if flip is enabled.
|
|
3066
|
-
...this.element.floaterConfig?.autoPlacement ? [autoPlacement()] : [], // Add autoPlacement middleware if autoPlacement is enabled.
|
|
3244
|
+
...(this.element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
|
|
3245
|
+
...(this.element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
|
|
3246
|
+
...(this.element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
3067
3247
|
];
|
|
3068
3248
|
|
|
3069
3249
|
// Compute the position of the bib
|
|
3070
3250
|
computePosition(this.element.trigger, this.element.bib, {
|
|
3071
|
-
strategy: this.element.floaterConfig?.strategy ||
|
|
3251
|
+
strategy: this.element.floaterConfig?.strategy || "fixed",
|
|
3072
3252
|
placement: this.element.floaterConfig?.placement,
|
|
3073
|
-
middleware: middleware || []
|
|
3074
|
-
}).then(({ x, y }) => {
|
|
3253
|
+
middleware: middleware || [],
|
|
3254
|
+
}).then(({ x, y }) => {
|
|
3255
|
+
// eslint-disable-line id-length
|
|
3075
3256
|
Object.assign(this.element.bib.style, {
|
|
3076
3257
|
left: `${x}px`,
|
|
3077
3258
|
top: `${y}px`,
|
|
3078
3259
|
});
|
|
3079
3260
|
});
|
|
3080
|
-
} else if (strategy ===
|
|
3261
|
+
} else if (strategy === "cover") {
|
|
3081
3262
|
// Compute the position of the bib
|
|
3082
3263
|
computePosition(this.element.parentNode, this.element.bib, {
|
|
3083
|
-
placement:
|
|
3084
|
-
}).then(({ x, y }) => {
|
|
3264
|
+
placement: "bottom-start",
|
|
3265
|
+
}).then(({ x, y }) => {
|
|
3266
|
+
// eslint-disable-line id-length
|
|
3085
3267
|
Object.assign(this.element.bib.style, {
|
|
3086
3268
|
left: `${x}px`,
|
|
3087
3269
|
top: `${y - this.element.parentNode.offsetHeight}px`,
|
|
3088
3270
|
width: `${this.element.parentNode.offsetWidth}px`,
|
|
3089
|
-
height: `${this.element.parentNode.offsetHeight}px
|
|
3271
|
+
height: `${this.element.parentNode.offsetHeight}px`,
|
|
3090
3272
|
});
|
|
3091
3273
|
});
|
|
3092
3274
|
}
|
|
@@ -3099,12 +3281,12 @@ class AuroFloatingUI {
|
|
|
3099
3281
|
*/
|
|
3100
3282
|
lockScroll(lock = true) {
|
|
3101
3283
|
if (lock) {
|
|
3102
|
-
document.body.style.overflow =
|
|
3284
|
+
document.body.style.overflow = "hidden"; // hide body's scrollbar
|
|
3103
3285
|
|
|
3104
3286
|
// Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
|
|
3105
3287
|
this.element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
3106
3288
|
} else {
|
|
3107
|
-
document.body.style.overflow =
|
|
3289
|
+
document.body.style.overflow = "";
|
|
3108
3290
|
}
|
|
3109
3291
|
}
|
|
3110
3292
|
|
|
@@ -3118,23 +3300,24 @@ class AuroFloatingUI {
|
|
|
3118
3300
|
* @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
|
|
3119
3301
|
*/
|
|
3120
3302
|
configureBibStrategy(value) {
|
|
3121
|
-
if (value ===
|
|
3303
|
+
if (value === "fullscreen") {
|
|
3122
3304
|
this.element.isBibFullscreen = true;
|
|
3123
3305
|
// reset the prev position
|
|
3124
|
-
this.element.bib.setAttribute(
|
|
3125
|
-
this.element.bib.style.position =
|
|
3306
|
+
this.element.bib.setAttribute("isfullscreen", "");
|
|
3307
|
+
this.element.bib.style.position = "fixed";
|
|
3126
3308
|
this.element.bib.style.top = "0px";
|
|
3127
3309
|
this.element.bib.style.left = "0px";
|
|
3128
|
-
this.element.bib.style.width =
|
|
3129
|
-
this.element.bib.style.height =
|
|
3130
|
-
this.element.style.contain =
|
|
3310
|
+
this.element.bib.style.width = "";
|
|
3311
|
+
this.element.bib.style.height = "";
|
|
3312
|
+
this.element.style.contain = "";
|
|
3131
3313
|
|
|
3132
3314
|
// reset the size that was mirroring `size` css-part
|
|
3133
|
-
const bibContent =
|
|
3315
|
+
const bibContent =
|
|
3316
|
+
this.element.bib.shadowRoot.querySelector(".container");
|
|
3134
3317
|
if (bibContent) {
|
|
3135
|
-
bibContent.style.width =
|
|
3136
|
-
bibContent.style.height =
|
|
3137
|
-
bibContent.style.maxWidth =
|
|
3318
|
+
bibContent.style.width = "";
|
|
3319
|
+
bibContent.style.height = "";
|
|
3320
|
+
bibContent.style.maxWidth = "";
|
|
3138
3321
|
bibContent.style.maxHeight = `${window?.visualViewport?.height}px`;
|
|
3139
3322
|
this.configureTrial = 0;
|
|
3140
3323
|
} else if (this.configureTrial < MAX_CONFIGURATION_COUNT) {
|
|
@@ -3149,21 +3332,26 @@ class AuroFloatingUI {
|
|
|
3149
3332
|
this.lockScroll(true);
|
|
3150
3333
|
}
|
|
3151
3334
|
} else {
|
|
3152
|
-
this.element.bib.style.position =
|
|
3153
|
-
this.element.bib.removeAttribute(
|
|
3335
|
+
this.element.bib.style.position = "";
|
|
3336
|
+
this.element.bib.removeAttribute("isfullscreen");
|
|
3154
3337
|
this.element.isBibFullscreen = false;
|
|
3155
|
-
this.element.style.contain =
|
|
3338
|
+
this.element.style.contain = "layout";
|
|
3156
3339
|
}
|
|
3157
3340
|
|
|
3158
3341
|
const isChanged = this.strategy && this.strategy !== value;
|
|
3159
3342
|
this.strategy = value;
|
|
3160
3343
|
if (isChanged) {
|
|
3161
|
-
const event = new CustomEvent(
|
|
3162
|
-
|
|
3163
|
-
|
|
3344
|
+
const event = new CustomEvent(
|
|
3345
|
+
this.eventPrefix
|
|
3346
|
+
? `${this.eventPrefix}-strategy-change`
|
|
3347
|
+
: "strategy-change",
|
|
3348
|
+
{
|
|
3349
|
+
detail: {
|
|
3350
|
+
value,
|
|
3351
|
+
},
|
|
3352
|
+
composed: true,
|
|
3164
3353
|
},
|
|
3165
|
-
|
|
3166
|
-
});
|
|
3354
|
+
);
|
|
3167
3355
|
|
|
3168
3356
|
this.element.dispatchEvent(event);
|
|
3169
3357
|
}
|
|
@@ -3195,19 +3383,24 @@ class AuroFloatingUI {
|
|
|
3195
3383
|
return;
|
|
3196
3384
|
}
|
|
3197
3385
|
|
|
3198
|
-
if (
|
|
3199
|
-
this.element.
|
|
3386
|
+
if (
|
|
3387
|
+
this.element.noHideOnThisFocusLoss ||
|
|
3388
|
+
this.element.hasAttribute("noHideOnThisFocusLoss")
|
|
3389
|
+
) {
|
|
3200
3390
|
return;
|
|
3201
3391
|
}
|
|
3202
3392
|
|
|
3203
3393
|
const { activeElement } = document;
|
|
3204
3394
|
// if focus is still inside of trigger or bib, do not close
|
|
3205
|
-
if (
|
|
3395
|
+
if (
|
|
3396
|
+
this.element.contains(activeElement) ||
|
|
3397
|
+
this.element.bib?.contains(activeElement)
|
|
3398
|
+
) {
|
|
3206
3399
|
return;
|
|
3207
3400
|
}
|
|
3208
3401
|
|
|
3209
3402
|
// if fullscreen bib is in fullscreen mode, do not close
|
|
3210
|
-
if (this.element.bib.hasAttribute(
|
|
3403
|
+
if (this.element.bib.hasAttribute("isfullscreen")) {
|
|
3211
3404
|
return;
|
|
3212
3405
|
}
|
|
3213
3406
|
|
|
@@ -3219,12 +3412,27 @@ class AuroFloatingUI {
|
|
|
3219
3412
|
this.focusHandler = () => this.handleFocusLoss();
|
|
3220
3413
|
|
|
3221
3414
|
this.clickHandler = (evt) => {
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
|
|
3225
|
-
|
|
3415
|
+
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
3416
|
+
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
3417
|
+
// <dialog> may not include the bib in composedPath(), causing false
|
|
3418
|
+
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
3419
|
+
if (this.element.bib && this.element.bib.hasAttribute("isfullscreen")) {
|
|
3420
|
+
return;
|
|
3421
|
+
}
|
|
3226
3422
|
|
|
3227
|
-
|
|
3423
|
+
if (
|
|
3424
|
+
(!evt.composedPath().includes(this.element.trigger) &&
|
|
3425
|
+
!evt.composedPath().includes(this.element.bib)) ||
|
|
3426
|
+
(this.element.bib.backdrop &&
|
|
3427
|
+
evt.composedPath().includes(this.element.bib.backdrop))
|
|
3428
|
+
) {
|
|
3429
|
+
const existedVisibleFloatingUI =
|
|
3430
|
+
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
3431
|
+
|
|
3432
|
+
if (
|
|
3433
|
+
existedVisibleFloatingUI &&
|
|
3434
|
+
existedVisibleFloatingUI.element.isPopoverVisible
|
|
3435
|
+
) {
|
|
3228
3436
|
// if something else is open, close that
|
|
3229
3437
|
existedVisibleFloatingUI.hideBib();
|
|
3230
3438
|
document.expandedAuroFormkitDropdown = null;
|
|
@@ -3237,9 +3445,14 @@ class AuroFloatingUI {
|
|
|
3237
3445
|
|
|
3238
3446
|
// ESC key handler
|
|
3239
3447
|
this.keyDownHandler = (evt) => {
|
|
3240
|
-
if (evt.key ===
|
|
3241
|
-
const existedVisibleFloatingUI =
|
|
3242
|
-
|
|
3448
|
+
if (evt.key === "Escape" && this.element.isPopoverVisible) {
|
|
3449
|
+
const existedVisibleFloatingUI =
|
|
3450
|
+
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
3451
|
+
if (
|
|
3452
|
+
existedVisibleFloatingUI &&
|
|
3453
|
+
existedVisibleFloatingUI !== this &&
|
|
3454
|
+
existedVisibleFloatingUI.element.isPopoverVisible
|
|
3455
|
+
) {
|
|
3243
3456
|
// if something else is open, let it handle itself
|
|
3244
3457
|
return;
|
|
3245
3458
|
}
|
|
@@ -3247,17 +3460,17 @@ class AuroFloatingUI {
|
|
|
3247
3460
|
}
|
|
3248
3461
|
};
|
|
3249
3462
|
|
|
3250
|
-
if (this.behavior !==
|
|
3463
|
+
if (this.behavior !== "drawer" && this.behavior !== "dialog") {
|
|
3251
3464
|
// Add event listeners using the stored references
|
|
3252
|
-
document.addEventListener(
|
|
3465
|
+
document.addEventListener("focusin", this.focusHandler);
|
|
3253
3466
|
}
|
|
3254
3467
|
|
|
3255
|
-
document.addEventListener(
|
|
3468
|
+
document.addEventListener("keydown", this.keyDownHandler);
|
|
3256
3469
|
|
|
3257
3470
|
// send this task to the end of queue to prevent conflicting
|
|
3258
3471
|
// it conflicts if showBib gets call from a button that's not this.element.trigger
|
|
3259
3472
|
setTimeout(() => {
|
|
3260
|
-
window.addEventListener(
|
|
3473
|
+
window.addEventListener("click", this.clickHandler);
|
|
3261
3474
|
}, 0);
|
|
3262
3475
|
}
|
|
3263
3476
|
|
|
@@ -3265,34 +3478,38 @@ class AuroFloatingUI {
|
|
|
3265
3478
|
// Remove event listeners if they exist
|
|
3266
3479
|
|
|
3267
3480
|
if (this.focusHandler) {
|
|
3268
|
-
document.removeEventListener(
|
|
3481
|
+
document.removeEventListener("focusin", this.focusHandler);
|
|
3269
3482
|
this.focusHandler = null;
|
|
3270
3483
|
}
|
|
3271
3484
|
|
|
3272
3485
|
if (this.clickHandler) {
|
|
3273
|
-
window.removeEventListener(
|
|
3486
|
+
window.removeEventListener("click", this.clickHandler);
|
|
3274
3487
|
this.clickHandler = null;
|
|
3275
3488
|
}
|
|
3276
3489
|
|
|
3277
3490
|
if (this.keyDownHandler) {
|
|
3278
|
-
document.removeEventListener(
|
|
3491
|
+
document.removeEventListener("keydown", this.keyDownHandler);
|
|
3279
3492
|
this.keyDownHandler = null;
|
|
3280
3493
|
}
|
|
3281
3494
|
}
|
|
3282
3495
|
|
|
3283
3496
|
handleUpdate(changedProperties) {
|
|
3284
|
-
if (changedProperties.has(
|
|
3497
|
+
if (changedProperties.has("isPopoverVisible")) {
|
|
3285
3498
|
this.updateState();
|
|
3286
3499
|
}
|
|
3287
3500
|
}
|
|
3288
3501
|
|
|
3289
3502
|
updateCurrentExpandedDropdown() {
|
|
3290
3503
|
// Close any other dropdown that is already open
|
|
3291
|
-
const existedVisibleFloatingUI =
|
|
3292
|
-
|
|
3504
|
+
const existedVisibleFloatingUI =
|
|
3505
|
+
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
3506
|
+
if (
|
|
3507
|
+
existedVisibleFloatingUI &&
|
|
3508
|
+
existedVisibleFloatingUI !== this &&
|
|
3293
3509
|
existedVisibleFloatingUI.element.isPopoverVisible &&
|
|
3294
|
-
|
|
3295
|
-
|
|
3510
|
+
existedVisibleFloatingUI.eventPrefix === this.eventPrefix
|
|
3511
|
+
) {
|
|
3512
|
+
existedVisibleFloatingUI.hideBib();
|
|
3296
3513
|
}
|
|
3297
3514
|
|
|
3298
3515
|
document.expandedAuroFloater = this;
|
|
@@ -3301,7 +3518,7 @@ class AuroFloatingUI {
|
|
|
3301
3518
|
showBib() {
|
|
3302
3519
|
if (!this.element.disabled && !this.showing) {
|
|
3303
3520
|
this.updateCurrentExpandedDropdown();
|
|
3304
|
-
this.element.triggerChevron?.setAttribute(
|
|
3521
|
+
this.element.triggerChevron?.setAttribute("data-expanded", true);
|
|
3305
3522
|
|
|
3306
3523
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
3307
3524
|
if (!this.showing) {
|
|
@@ -3315,9 +3532,13 @@ class AuroFloatingUI {
|
|
|
3315
3532
|
}
|
|
3316
3533
|
|
|
3317
3534
|
// Setup auto update to handle resize and scroll
|
|
3318
|
-
this.element.cleanup = autoUpdate(
|
|
3319
|
-
this.
|
|
3320
|
-
|
|
3535
|
+
this.element.cleanup = autoUpdate(
|
|
3536
|
+
this.element.trigger || this.element.parentNode,
|
|
3537
|
+
this.element.bib,
|
|
3538
|
+
() => {
|
|
3539
|
+
this.position();
|
|
3540
|
+
},
|
|
3541
|
+
);
|
|
3321
3542
|
}
|
|
3322
3543
|
}
|
|
3323
3544
|
|
|
@@ -3328,7 +3549,7 @@ class AuroFloatingUI {
|
|
|
3328
3549
|
hideBib(eventType = "unknown") {
|
|
3329
3550
|
if (!this.element.disabled && !this.element.noToggle) {
|
|
3330
3551
|
this.lockScroll(false);
|
|
3331
|
-
this.element.triggerChevron?.removeAttribute(
|
|
3552
|
+
this.element.triggerChevron?.removeAttribute("data-expanded");
|
|
3332
3553
|
|
|
3333
3554
|
if (this.element.isPopoverVisible) {
|
|
3334
3555
|
this.element.isPopoverVisible = false;
|
|
@@ -3348,13 +3569,16 @@ class AuroFloatingUI {
|
|
|
3348
3569
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
3349
3570
|
*/
|
|
3350
3571
|
dispatchEventDropdownToggle(eventType) {
|
|
3351
|
-
const event = new CustomEvent(
|
|
3352
|
-
|
|
3353
|
-
|
|
3354
|
-
|
|
3572
|
+
const event = new CustomEvent(
|
|
3573
|
+
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
3574
|
+
{
|
|
3575
|
+
detail: {
|
|
3576
|
+
expanded: this.showing,
|
|
3577
|
+
eventType: eventType || "unknown",
|
|
3578
|
+
},
|
|
3579
|
+
composed: true,
|
|
3355
3580
|
},
|
|
3356
|
-
|
|
3357
|
-
});
|
|
3581
|
+
);
|
|
3358
3582
|
|
|
3359
3583
|
this.element.dispatchEvent(event);
|
|
3360
3584
|
}
|
|
@@ -3366,12 +3590,15 @@ class AuroFloatingUI {
|
|
|
3366
3590
|
this.showBib();
|
|
3367
3591
|
}
|
|
3368
3592
|
|
|
3369
|
-
const event = new CustomEvent(
|
|
3370
|
-
|
|
3371
|
-
|
|
3372
|
-
|
|
3373
|
-
|
|
3374
|
-
|
|
3593
|
+
const event = new CustomEvent(
|
|
3594
|
+
this.eventPrefix ? `${this.eventPrefix}-triggerClick` : "triggerClick",
|
|
3595
|
+
{
|
|
3596
|
+
composed: true,
|
|
3597
|
+
detail: {
|
|
3598
|
+
expanded: this.element.isPopoverVisible,
|
|
3599
|
+
},
|
|
3600
|
+
},
|
|
3601
|
+
);
|
|
3375
3602
|
|
|
3376
3603
|
this.element.dispatchEvent(event);
|
|
3377
3604
|
}
|
|
@@ -3379,30 +3606,32 @@ class AuroFloatingUI {
|
|
|
3379
3606
|
handleEvent(event) {
|
|
3380
3607
|
if (!this.element.disableEventShow) {
|
|
3381
3608
|
switch (event.type) {
|
|
3382
|
-
case
|
|
3609
|
+
case "keydown": {
|
|
3383
3610
|
// Support both Enter and Space keys for accessibility
|
|
3384
3611
|
// Space is included as it's expected behavior for interactive elements
|
|
3385
3612
|
|
|
3386
3613
|
const origin = event.composedPath()[0];
|
|
3387
|
-
if (
|
|
3388
|
-
|
|
3614
|
+
if (
|
|
3615
|
+
event.key === "Enter" ||
|
|
3616
|
+
(event.key === " " && (!origin || origin.tagName !== "INPUT"))
|
|
3617
|
+
) {
|
|
3389
3618
|
event.preventDefault();
|
|
3390
3619
|
this.handleClick();
|
|
3391
3620
|
}
|
|
3392
3621
|
break;
|
|
3393
|
-
|
|
3622
|
+
}
|
|
3623
|
+
case "mouseenter":
|
|
3394
3624
|
if (this.element.hoverToggle) {
|
|
3395
3625
|
this.showBib();
|
|
3396
3626
|
}
|
|
3397
3627
|
break;
|
|
3398
|
-
case
|
|
3628
|
+
case "mouseleave":
|
|
3399
3629
|
if (this.element.hoverToggle) {
|
|
3400
3630
|
this.hideBib("mouseleave");
|
|
3401
3631
|
}
|
|
3402
3632
|
break;
|
|
3403
|
-
case
|
|
3633
|
+
case "focus":
|
|
3404
3634
|
if (this.element.focusShow) {
|
|
3405
|
-
|
|
3406
3635
|
/*
|
|
3407
3636
|
This needs to better handle clicking that gives focus -
|
|
3408
3637
|
currently it shows and then immediately hides the bib
|
|
@@ -3410,12 +3639,12 @@ class AuroFloatingUI {
|
|
|
3410
3639
|
this.showBib();
|
|
3411
3640
|
}
|
|
3412
3641
|
break;
|
|
3413
|
-
case
|
|
3642
|
+
case "blur":
|
|
3414
3643
|
// send this task 100ms later queue to
|
|
3415
3644
|
// wait a frame in case focus moves within the floating element/bib
|
|
3416
3645
|
setTimeout(() => this.handleFocusLoss(), 0);
|
|
3417
3646
|
break;
|
|
3418
|
-
case
|
|
3647
|
+
case "click":
|
|
3419
3648
|
if (document.activeElement === document.body) {
|
|
3420
3649
|
event.currentTarget.focus();
|
|
3421
3650
|
}
|
|
@@ -3434,15 +3663,15 @@ class AuroFloatingUI {
|
|
|
3434
3663
|
*/
|
|
3435
3664
|
handleTriggerTabIndex() {
|
|
3436
3665
|
const focusableElementSelectors = [
|
|
3437
|
-
|
|
3438
|
-
|
|
3666
|
+
"a",
|
|
3667
|
+
"button",
|
|
3439
3668
|
'input:not([type="hidden"])',
|
|
3440
|
-
|
|
3441
|
-
|
|
3669
|
+
"select",
|
|
3670
|
+
"textarea",
|
|
3442
3671
|
'[tabindex]:not([tabindex="-1"])',
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
|
|
3672
|
+
"auro-button",
|
|
3673
|
+
"auro-input",
|
|
3674
|
+
"auro-hyperlink",
|
|
3446
3675
|
];
|
|
3447
3676
|
|
|
3448
3677
|
const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
|
|
@@ -3470,10 +3699,10 @@ class AuroFloatingUI {
|
|
|
3470
3699
|
* @param {*} eventPrefix
|
|
3471
3700
|
*/
|
|
3472
3701
|
regenerateBibId() {
|
|
3473
|
-
this.id = this.element.getAttribute(
|
|
3702
|
+
this.id = this.element.getAttribute("id");
|
|
3474
3703
|
if (!this.id) {
|
|
3475
3704
|
this.id = window.crypto.randomUUID();
|
|
3476
|
-
this.element.setAttribute(
|
|
3705
|
+
this.element.setAttribute("id", this.id);
|
|
3477
3706
|
}
|
|
3478
3707
|
|
|
3479
3708
|
this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
|
|
@@ -3494,11 +3723,15 @@ class AuroFloatingUI {
|
|
|
3494
3723
|
if (this.element.trigger) {
|
|
3495
3724
|
this.disconnect();
|
|
3496
3725
|
}
|
|
3497
|
-
this.element.trigger =
|
|
3498
|
-
|
|
3499
|
-
|
|
3500
|
-
|
|
3501
|
-
|
|
3726
|
+
this.element.trigger =
|
|
3727
|
+
this.element.triggerElement ||
|
|
3728
|
+
this.element.shadowRoot.querySelector("#trigger") ||
|
|
3729
|
+
this.element.trigger;
|
|
3730
|
+
this.element.bib =
|
|
3731
|
+
this.element.shadowRoot.querySelector("#bib") || this.element.bib;
|
|
3732
|
+
this.element.bibSizer = this.element.shadowRoot.querySelector("#bibSizer");
|
|
3733
|
+
this.element.triggerChevron =
|
|
3734
|
+
this.element.shadowRoot.querySelector("#showStateIcon");
|
|
3502
3735
|
|
|
3503
3736
|
if (this.element.floaterConfig) {
|
|
3504
3737
|
this.element.hoverToggle = this.element.floaterConfig.hoverToggle;
|
|
@@ -3509,12 +3742,12 @@ class AuroFloatingUI {
|
|
|
3509
3742
|
|
|
3510
3743
|
this.handleEvent = this.handleEvent.bind(this);
|
|
3511
3744
|
if (this.element.trigger) {
|
|
3512
|
-
this.element.trigger.addEventListener(
|
|
3513
|
-
this.element.trigger.addEventListener(
|
|
3514
|
-
this.element.trigger.addEventListener(
|
|
3515
|
-
this.element.trigger.addEventListener(
|
|
3516
|
-
this.element.trigger.addEventListener(
|
|
3517
|
-
this.element.trigger.addEventListener(
|
|
3745
|
+
this.element.trigger.addEventListener("keydown", this.handleEvent);
|
|
3746
|
+
this.element.trigger.addEventListener("click", this.handleEvent);
|
|
3747
|
+
this.element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
3748
|
+
this.element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
3749
|
+
this.element.trigger.addEventListener("focus", this.handleEvent);
|
|
3750
|
+
this.element.trigger.addEventListener("blur", this.handleEvent);
|
|
3518
3751
|
}
|
|
3519
3752
|
}
|
|
3520
3753
|
|
|
@@ -3529,12 +3762,18 @@ class AuroFloatingUI {
|
|
|
3529
3762
|
|
|
3530
3763
|
// Remove event & keyboard listeners
|
|
3531
3764
|
if (this.element?.trigger) {
|
|
3532
|
-
this.element.trigger.removeEventListener(
|
|
3533
|
-
this.element.trigger.removeEventListener(
|
|
3534
|
-
this.element.trigger.removeEventListener(
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
|
|
3765
|
+
this.element.trigger.removeEventListener("keydown", this.handleEvent);
|
|
3766
|
+
this.element.trigger.removeEventListener("click", this.handleEvent);
|
|
3767
|
+
this.element.trigger.removeEventListener(
|
|
3768
|
+
"mouseenter",
|
|
3769
|
+
this.handleEvent,
|
|
3770
|
+
);
|
|
3771
|
+
this.element.trigger.removeEventListener(
|
|
3772
|
+
"mouseleave",
|
|
3773
|
+
this.handleEvent,
|
|
3774
|
+
);
|
|
3775
|
+
this.element.trigger.removeEventListener("focus", this.handleEvent);
|
|
3776
|
+
this.element.trigger.removeEventListener("blur", this.handleEvent);
|
|
3538
3777
|
}
|
|
3539
3778
|
}
|
|
3540
3779
|
}
|
|
@@ -3962,7 +4201,7 @@ let p$3 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
3962
4201
|
`;let _$2 = class _ extends z$3{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.variant=void 0,this.uri="https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist",this.runtimeUtils=new p$3;}static get properties(){return {...z$3.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 [z$3.styles,y$3,w$3,x$3]}static register(t="auro-icon"){p$3.prototype.registerComponent(t,_);}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$1`
|
|
3963
4202
|
<div class="componentWrapper">
|
|
3964
4203
|
<div
|
|
3965
|
-
class="${e$
|
|
4204
|
+
class="${e$3({svgWrapper:true})}"
|
|
3966
4205
|
title="${o(this.title||void 0)}">
|
|
3967
4206
|
<span aria-hidden="${o(this.ariaHidden||true)}" part="svg">
|
|
3968
4207
|
${this.customSvg?b$1`
|
|
@@ -3973,7 +4212,7 @@ let p$3 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
3973
4212
|
</span>
|
|
3974
4213
|
</div>
|
|
3975
4214
|
|
|
3976
|
-
<div class="${e$
|
|
4215
|
+
<div class="${e$3(t)}" part="label">
|
|
3977
4216
|
<slot></slot>
|
|
3978
4217
|
</div>
|
|
3979
4218
|
</div>
|
|
@@ -3981,7 +4220,7 @@ let p$3 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
3981
4220
|
|
|
3982
4221
|
var iconVersion$2 = '9.1.2';
|
|
3983
4222
|
|
|
3984
|
-
var styleCss$2$1 = i$6`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}
|
|
4223
|
+
var styleCss$2$1 = i$6`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
|
|
3985
4224
|
|
|
3986
4225
|
var colorCss$2$1 = i$6`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
3987
4226
|
|
|
@@ -3989,6 +4228,8 @@ var tokensCss$1$1 = i$6`:host(:not([ondark])),:host(:not([appearance=inverse])){
|
|
|
3989
4228
|
|
|
3990
4229
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
3991
4230
|
// See LICENSE in the project root for license information.
|
|
4231
|
+
/* eslint-disable max-lines */
|
|
4232
|
+
// ---------------------------------------------------------------------
|
|
3992
4233
|
|
|
3993
4234
|
|
|
3994
4235
|
const DESIGN_TOKEN_BREAKPOINT_PREFIX = '--ds-grid-breakpoint-';
|
|
@@ -4083,6 +4324,28 @@ class AuroDropdownBib extends i$3 {
|
|
|
4083
4324
|
shape: {
|
|
4084
4325
|
type: String,
|
|
4085
4326
|
reflect: true
|
|
4327
|
+
},
|
|
4328
|
+
|
|
4329
|
+
/**
|
|
4330
|
+
* Accessible label for the dialog element, used when displayed as a modal.
|
|
4331
|
+
* Applied via aria-labelledby on a visually hidden element rather than
|
|
4332
|
+
* aria-label because iOS VoiceOver does not reliably read aria-label
|
|
4333
|
+
* on <dialog> elements.
|
|
4334
|
+
* @private
|
|
4335
|
+
*/
|
|
4336
|
+
dialogLabel: {
|
|
4337
|
+
type: String
|
|
4338
|
+
},
|
|
4339
|
+
|
|
4340
|
+
/**
|
|
4341
|
+
* Overrides the native role of the dialog element.
|
|
4342
|
+
* For example, set to `"presentation"` on desktop combobox to prevent
|
|
4343
|
+
* VoiceOver from announcing "listbox inside of a dialog".
|
|
4344
|
+
* When `undefined`, the dialog keeps its native role.
|
|
4345
|
+
* @private
|
|
4346
|
+
*/
|
|
4347
|
+
dialogRole: {
|
|
4348
|
+
type: String
|
|
4086
4349
|
}
|
|
4087
4350
|
};
|
|
4088
4351
|
}
|
|
@@ -4150,7 +4413,10 @@ class AuroDropdownBib extends i$3 {
|
|
|
4150
4413
|
firstUpdated(changedProperties) {
|
|
4151
4414
|
super.firstUpdated(changedProperties);
|
|
4152
4415
|
|
|
4153
|
-
|
|
4416
|
+
const dialog = this.shadowRoot.querySelector('dialog');
|
|
4417
|
+
this._setupCancelHandler(dialog);
|
|
4418
|
+
this._setupKeyboardBridge(dialog);
|
|
4419
|
+
|
|
4154
4420
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
4155
4421
|
bubbles: true,
|
|
4156
4422
|
composed: true,
|
|
@@ -4160,6 +4426,189 @@ class AuroDropdownBib extends i$3 {
|
|
|
4160
4426
|
}));
|
|
4161
4427
|
}
|
|
4162
4428
|
|
|
4429
|
+
/**
|
|
4430
|
+
* Forwards the dialog's native `cancel` event (fired on ESC) as
|
|
4431
|
+
* an `auro-bib-cancel` custom event so parent components can close.
|
|
4432
|
+
* @param {HTMLDialogElement} dialog
|
|
4433
|
+
* @private
|
|
4434
|
+
*/
|
|
4435
|
+
_setupCancelHandler(dialog) {
|
|
4436
|
+
dialog.addEventListener('cancel', (event) => {
|
|
4437
|
+
event.preventDefault();
|
|
4438
|
+
this.dispatchEvent(new CustomEvent('auro-bib-cancel', {
|
|
4439
|
+
bubbles: true,
|
|
4440
|
+
composed: true
|
|
4441
|
+
}));
|
|
4442
|
+
});
|
|
4443
|
+
}
|
|
4444
|
+
|
|
4445
|
+
/**
|
|
4446
|
+
* showModal() creates a closed focus scope — keyboard events inside
|
|
4447
|
+
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
4448
|
+
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
4449
|
+
* that gap by re-dispatching navigation keys so they cross the
|
|
4450
|
+
* shadow boundary and reach the menu navigation logic in the parent
|
|
4451
|
+
* component.
|
|
4452
|
+
*
|
|
4453
|
+
* The trade-off: intercepting these keys means native keyboard
|
|
4454
|
+
* behaviors that would normally "just work" must be manually
|
|
4455
|
+
* re-implemented here:
|
|
4456
|
+
*
|
|
4457
|
+
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
4458
|
+
* native Enter→click that <button> provides, so we call .click()
|
|
4459
|
+
* directly when Enter is pressed on a button-like element.
|
|
4460
|
+
*
|
|
4461
|
+
* - Tab: Intercepted and re-dispatched so parent components
|
|
4462
|
+
* (select/combobox) can select the active option and close the
|
|
4463
|
+
* dialog. The <dialog> provides containment and isolation
|
|
4464
|
+
* (inert background, VoiceOver focus trapping, top layer), while
|
|
4465
|
+
* the content inside is a role="listbox" navigated via
|
|
4466
|
+
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
4467
|
+
* behavior follows listbox conventions (select + close) because
|
|
4468
|
+
* the dialog's native Tab trap only cycles between the close
|
|
4469
|
+
* button and browser chrome.
|
|
4470
|
+
*
|
|
4471
|
+
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
4472
|
+
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
4473
|
+
* is a secondary path for parent components that also listen for
|
|
4474
|
+
* Escape keydown.
|
|
4475
|
+
*
|
|
4476
|
+
* @param {HTMLDialogElement} dialog
|
|
4477
|
+
* @private
|
|
4478
|
+
*/
|
|
4479
|
+
_setupKeyboardBridge(dialog) {
|
|
4480
|
+
const navKeys = new Set([
|
|
4481
|
+
'ArrowUp',
|
|
4482
|
+
'ArrowDown',
|
|
4483
|
+
'Enter',
|
|
4484
|
+
'Escape',
|
|
4485
|
+
'Tab'
|
|
4486
|
+
]);
|
|
4487
|
+
|
|
4488
|
+
dialog.addEventListener('keydown', (event) => {
|
|
4489
|
+
if (!navKeys.has(event.key)) {
|
|
4490
|
+
return;
|
|
4491
|
+
}
|
|
4492
|
+
|
|
4493
|
+
// Custom elements (auro-button) don't get the native Enter→click
|
|
4494
|
+
// behavior that <button> has. Find the button in the composed path
|
|
4495
|
+
// and click it directly.
|
|
4496
|
+
if (event.key === 'Enter') {
|
|
4497
|
+
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
4498
|
+
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
4499
|
+
if (btn) {
|
|
4500
|
+
event.preventDefault();
|
|
4501
|
+
event.stopPropagation();
|
|
4502
|
+
btn.click();
|
|
4503
|
+
return;
|
|
4504
|
+
}
|
|
4505
|
+
}
|
|
4506
|
+
|
|
4507
|
+
event.preventDefault();
|
|
4508
|
+
event.stopPropagation();
|
|
4509
|
+
const newEvent = new KeyboardEvent('keydown', {
|
|
4510
|
+
key: event.key,
|
|
4511
|
+
code: event.code,
|
|
4512
|
+
shiftKey: event.shiftKey,
|
|
4513
|
+
altKey: event.altKey,
|
|
4514
|
+
ctrlKey: event.ctrlKey,
|
|
4515
|
+
metaKey: event.metaKey,
|
|
4516
|
+
bubbles: true,
|
|
4517
|
+
composed: true,
|
|
4518
|
+
cancelable: true
|
|
4519
|
+
});
|
|
4520
|
+
this.dispatchEvent(newEvent);
|
|
4521
|
+
});
|
|
4522
|
+
}
|
|
4523
|
+
|
|
4524
|
+
/**
|
|
4525
|
+
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
4526
|
+
*
|
|
4527
|
+
* The showModal() function places the dialog in the browser's **top layer**,
|
|
4528
|
+
* which is a separate rendering layer above the normal DOM. On mobile, the
|
|
4529
|
+
* compositor processes visual-viewport panning before top-layer touch
|
|
4530
|
+
* handling. This means the entire viewport — including the top-layer dialog
|
|
4531
|
+
* — can be panned by a touch gesture, causing the page behind the dialog to
|
|
4532
|
+
* scroll into view. To prevent this, we add a touchmove listener that cancels
|
|
4533
|
+
* the event if the touch started outside the dialog or any scrollable child within it.
|
|
4534
|
+
*
|
|
4535
|
+
* @private
|
|
4536
|
+
*/
|
|
4537
|
+
_lockTouchScroll() {
|
|
4538
|
+
const dialog = this.shadowRoot.querySelector('dialog');
|
|
4539
|
+
|
|
4540
|
+
this._touchMoveHandler = (event) => {
|
|
4541
|
+
// Walk the composed path (which crosses shadow DOM boundaries) to
|
|
4542
|
+
// check whether the touch started inside a scrollable element that
|
|
4543
|
+
// lives within the dialog. If so, allow the scroll.
|
|
4544
|
+
for (const el of event.composedPath()) {
|
|
4545
|
+
if (el === dialog) {
|
|
4546
|
+
// Reached the dialog boundary without finding a scrollable child.
|
|
4547
|
+
break;
|
|
4548
|
+
}
|
|
4549
|
+
if (el instanceof HTMLElement && el.scrollHeight > el.clientHeight) {
|
|
4550
|
+
const { overflowY } = getComputedStyle(el);
|
|
4551
|
+
if (overflowY === 'auto' || overflowY === 'scroll') {
|
|
4552
|
+
return;
|
|
4553
|
+
}
|
|
4554
|
+
}
|
|
4555
|
+
}
|
|
4556
|
+
|
|
4557
|
+
event.preventDefault();
|
|
4558
|
+
};
|
|
4559
|
+
|
|
4560
|
+
document.addEventListener('touchmove', this._touchMoveHandler, { passive: false });
|
|
4561
|
+
}
|
|
4562
|
+
|
|
4563
|
+
/**
|
|
4564
|
+
* Removes the touchmove listener added by _lockTouchScroll().
|
|
4565
|
+
* @private
|
|
4566
|
+
*/
|
|
4567
|
+
_unlockTouchScroll() {
|
|
4568
|
+
if (this._touchMoveHandler) {
|
|
4569
|
+
document.removeEventListener('touchmove', this._touchMoveHandler);
|
|
4570
|
+
this._touchMoveHandler = undefined;
|
|
4571
|
+
}
|
|
4572
|
+
}
|
|
4573
|
+
|
|
4574
|
+
open(modal = true) {
|
|
4575
|
+
const dialog = this.shadowRoot.querySelector('dialog');
|
|
4576
|
+
if (dialog && !dialog.open) {
|
|
4577
|
+
if (modal) {
|
|
4578
|
+
// Prevent showModal() from scrolling the page to bring the dialog
|
|
4579
|
+
// into view. Locking overflow on <html> blocks the viewport scroll
|
|
4580
|
+
// that browsers perform natively; we release it immediately after
|
|
4581
|
+
// so it doesn't interfere with the modal's focus management.
|
|
4582
|
+
const { documentElement } = document;
|
|
4583
|
+
const prevOverflow = documentElement.style.overflow;
|
|
4584
|
+
documentElement.style.overflow = 'hidden';
|
|
4585
|
+
|
|
4586
|
+
dialog.showModal();
|
|
4587
|
+
|
|
4588
|
+
documentElement.style.overflow = prevOverflow;
|
|
4589
|
+
|
|
4590
|
+
this._lockTouchScroll();
|
|
4591
|
+
|
|
4592
|
+
} else {
|
|
4593
|
+
// Use setAttribute instead of dialog.show() to avoid the dialog
|
|
4594
|
+
// focusing steps which steal focus from the trigger and cause
|
|
4595
|
+
// the floater's handleFocusLoss() to immediately hide the bib.
|
|
4596
|
+
dialog.setAttribute('open', '');
|
|
4597
|
+
}
|
|
4598
|
+
}
|
|
4599
|
+
}
|
|
4600
|
+
|
|
4601
|
+
/**
|
|
4602
|
+
* Closes the dialog.
|
|
4603
|
+
*/
|
|
4604
|
+
close() {
|
|
4605
|
+
const dialog = this.shadowRoot.querySelector('dialog');
|
|
4606
|
+
if (dialog && dialog.open) {
|
|
4607
|
+
this._unlockTouchScroll();
|
|
4608
|
+
dialog.close();
|
|
4609
|
+
}
|
|
4610
|
+
}
|
|
4611
|
+
|
|
4163
4612
|
// function that renders the HTML and CSS into the scope of the component
|
|
4164
4613
|
render() {
|
|
4165
4614
|
const classes = {
|
|
@@ -4171,9 +4620,10 @@ class AuroDropdownBib extends i$3 {
|
|
|
4171
4620
|
classes[`shape-${this.shape}`] = true;
|
|
4172
4621
|
|
|
4173
4622
|
return u$4`
|
|
4174
|
-
<
|
|
4623
|
+
<dialog class="${e$3(classes)}" part="bibContainer" role="${o(this.dialogRole)}" aria-labelledby="${o(this.dialogLabel ? 'dialogLabel' : undefined)}">
|
|
4624
|
+
${this.dialogLabel ? u$4`<span id="dialogLabel" class="util_displayHiddenVisually" aria-hidden="true">${this.dialogLabel}</span>` : ''}
|
|
4175
4625
|
<slot></slot>
|
|
4176
|
-
</
|
|
4626
|
+
</dialog>
|
|
4177
4627
|
`;
|
|
4178
4628
|
}
|
|
4179
4629
|
}
|
|
@@ -4182,7 +4632,7 @@ var shapeSizeCss = i$6`.shape-classic-xl,.shape-classic-lg,.shape-classic-md,.sh
|
|
|
4182
4632
|
|
|
4183
4633
|
var colorCss$1$1 = i$6`:host(:not([layout*=classic])){--ds-auro-dropdown-trigger-border-color: transparent}:host(:not([disabled],[onDark])) .wrapper:focus-within,:host(:not([disabled],[onDark])) .wrapper:active,:host(:not([disabled],[appearance=inverse])) .wrapper:focus-within,:host(:not([disabled],[appearance=inverse])) .wrapper:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host(:not([disabled],[onDark])) .wrapper:hover,:host(:not([disabled],[appearance=inverse])) .wrapper:hover{--ds-auro-dropdown-trigger-background-color: var(--ds-auro-dropdown-trigger-hover-background-color)}:host(:not([ondark])) .wrapper,:host(:not([appearance=inverse])) .wrapper{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-background-color);color:var(--ds-auro-dropdown-trigger-text-color)}:host(:not([onDark])[disabled]),:host(:not([appearance=inverse])[disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([onDark])[disabled]) #triggerLabel,:host(:not([appearance=inverse])[disabled]) #triggerLabel{cursor:default}:host(:not([ondark])[error]),:host(:not([appearance=inverse])[error]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host(:not([disabled])[onDark]) .wrapper:focus-within,:host(:not([disabled])[onDark]) .wrapper:active,:host(:not([disabled])[appearance=inverse]) .wrapper:focus-within,:host(:not([disabled])[appearance=inverse]) .wrapper:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host(:not([disabled])[onDark]) .wrapper:hover,:host(:not([disabled])[appearance=inverse]) .wrapper:hover{--ds-auro-dropdown-trigger-background-color: var(--ds-auro-dropdown-trigger-hover-background-color)}:host([onDark]) .label,:host([onDark]) .helpText,:host([appearance=inverse]) .label,:host([appearance=inverse]) .helpText{color:var(--ds-auro-dropdown-label-text-color)}:host([onDark]) .wrapper,:host([appearance=inverse]) .wrapper{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-background-color);color:var(--ds-auro-dropdown-trigger-text-color)}:host([onDark][disabled]),:host([appearance=inverse][disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}:host([onDark][disabled]) #triggerLabel,:host([appearance=inverse][disabled]) #triggerLabel{cursor:default}:host([ondark][error]),:host([appearance=inverse][error]){--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}`;
|
|
4184
4634
|
|
|
4185
|
-
var styleCss$1$1 = i$6`:host{position:relative;display:block;text-align:left}
|
|
4635
|
+
var styleCss$1$1 = i$6`:host{position:relative;display:block;text-align:left}:host([open]){z-index:var(--depth-tooltip, 400)}.wrapper{display:flex;flex:1;flex-direction:row;align-items:center;justify-content:center;outline:none}.triggerContentWrapper{display:flex;overflow:hidden;width:100%;flex:1;align-items:center;justify-content:center;text-overflow:ellipsis;white-space:nowrap}:host([matchwidth]) #bibSizer{width:100%}`;
|
|
4186
4636
|
|
|
4187
4637
|
var classicColorCss = i$6``;
|
|
4188
4638
|
|
|
@@ -4420,7 +4870,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
|
|
|
4420
4870
|
}
|
|
4421
4871
|
};
|
|
4422
4872
|
|
|
4423
|
-
var formkitVersion$1 = '
|
|
4873
|
+
var formkitVersion$1 = '202603102257';
|
|
4424
4874
|
|
|
4425
4875
|
class AuroElement extends i$3 {
|
|
4426
4876
|
static get properties() {
|
|
@@ -4534,7 +4984,7 @@ class AuroElement extends i$3 {
|
|
|
4534
4984
|
* The `auro-dropdown` element provides a way to place content in a bib that can be toggled.
|
|
4535
4985
|
* @customElement auro-dropdown
|
|
4536
4986
|
*
|
|
4537
|
-
* @slot - Default slot for the
|
|
4987
|
+
* @slot - Default slot for the dropdown bib content.
|
|
4538
4988
|
* @slot helpText - Defines the content of the helpText.
|
|
4539
4989
|
* @slot trigger - Defines the content of the trigger.
|
|
4540
4990
|
* @csspart trigger - The trigger content container.
|
|
@@ -4546,6 +4996,13 @@ class AuroElement extends i$3 {
|
|
|
4546
4996
|
* @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
|
|
4547
4997
|
*/
|
|
4548
4998
|
class AuroDropdown extends AuroElement {
|
|
4999
|
+
static get shadowRootOptions() {
|
|
5000
|
+
return {
|
|
5001
|
+
...AuroElement.shadowRootOptions,
|
|
5002
|
+
delegatesFocus: true,
|
|
5003
|
+
};
|
|
5004
|
+
}
|
|
5005
|
+
|
|
4549
5006
|
constructor() {
|
|
4550
5007
|
super();
|
|
4551
5008
|
|
|
@@ -4611,15 +5068,6 @@ class AuroDropdown extends AuroElement {
|
|
|
4611
5068
|
this.shift = false;
|
|
4612
5069
|
this.autoPlacement = false;
|
|
4613
5070
|
|
|
4614
|
-
/**
|
|
4615
|
-
* @private
|
|
4616
|
-
* @property {boolean} delegatesFocus - Whether the shadow root delegates focus.
|
|
4617
|
-
*/
|
|
4618
|
-
this.constructor.shadowRootOptions = {
|
|
4619
|
-
...i$3.shadowRootOptions,
|
|
4620
|
-
delegatesFocus: true,
|
|
4621
|
-
};
|
|
4622
|
-
|
|
4623
5071
|
/**
|
|
4624
5072
|
* @private
|
|
4625
5073
|
*/
|
|
@@ -4693,6 +5141,18 @@ class AuroDropdown extends AuroElement {
|
|
|
4693
5141
|
*/
|
|
4694
5142
|
show() {
|
|
4695
5143
|
this.floater.showBib();
|
|
5144
|
+
|
|
5145
|
+
// Open dialog synchronously so callers remain in the user gesture
|
|
5146
|
+
// chain. This is critical for mobile browsers (iOS Safari) to keep
|
|
5147
|
+
// the virtual keyboard open when transitioning from the trigger
|
|
5148
|
+
// input to an input inside the fullscreen dialog. Without this,
|
|
5149
|
+
// showModal() fires asynchronously via Lit's update cycle, which
|
|
5150
|
+
// falls outside the user activation window and causes iOS to
|
|
5151
|
+
// dismiss the keyboard.
|
|
5152
|
+
if (this.isBibFullscreen && this.bibElement && this.bibElement.value) {
|
|
5153
|
+
const useModal = !this.disableFocusTrap;
|
|
5154
|
+
this.bibElement.value.open(useModal);
|
|
5155
|
+
}
|
|
4696
5156
|
}
|
|
4697
5157
|
|
|
4698
5158
|
/**
|
|
@@ -4700,13 +5160,37 @@ class AuroDropdown extends AuroElement {
|
|
|
4700
5160
|
* If not, trigger element will get focus.
|
|
4701
5161
|
*/
|
|
4702
5162
|
focus() {
|
|
4703
|
-
if (this.isPopoverVisible && this.
|
|
4704
|
-
this.
|
|
5163
|
+
if (this.isPopoverVisible && this.bibContent) {
|
|
5164
|
+
const focusables = getFocusableElements(this.bibContent);
|
|
5165
|
+
if (focusables.length > 0) {
|
|
5166
|
+
focusables[0].focus();
|
|
5167
|
+
}
|
|
4705
5168
|
} else {
|
|
4706
5169
|
this.trigger.focus();
|
|
4707
5170
|
}
|
|
4708
5171
|
}
|
|
4709
5172
|
|
|
5173
|
+
/**
|
|
5174
|
+
* Sets the active descendant element for accessibility.
|
|
5175
|
+
* Uses ariaActiveDescendantElement to cross shadow DOM boundaries.
|
|
5176
|
+
* This function is used in components that contain `auro-dropdown` to set the active descendant.
|
|
5177
|
+
* @private
|
|
5178
|
+
* @param {HTMLElement|null} element - The element to set as the active descendant, or null to clear.
|
|
5179
|
+
* @returns {void}
|
|
5180
|
+
*/
|
|
5181
|
+
setActiveDescendant(element) {
|
|
5182
|
+
if (!this.trigger) {
|
|
5183
|
+
return;
|
|
5184
|
+
}
|
|
5185
|
+
|
|
5186
|
+
if (element) {
|
|
5187
|
+
this.trigger.ariaActiveDescendantElement = element;
|
|
5188
|
+
} else {
|
|
5189
|
+
this.trigger.ariaActiveDescendantElement = null;
|
|
5190
|
+
this.trigger.removeAttribute('aria-activedescendant');
|
|
5191
|
+
}
|
|
5192
|
+
}
|
|
5193
|
+
|
|
4710
5194
|
// function to define props used within the scope of this component
|
|
4711
5195
|
static get properties() {
|
|
4712
5196
|
return {
|
|
@@ -4964,6 +5448,16 @@ class AuroDropdown extends AuroElement {
|
|
|
4964
5448
|
*/
|
|
4965
5449
|
tabIndex: {
|
|
4966
5450
|
type: Number
|
|
5451
|
+
},
|
|
5452
|
+
|
|
5453
|
+
/**
|
|
5454
|
+
* Accessible label for the dropdown bib dialog element.
|
|
5455
|
+
* @private
|
|
5456
|
+
*/
|
|
5457
|
+
bibDialogLabel: {
|
|
5458
|
+
type: String,
|
|
5459
|
+
attribute: false,
|
|
5460
|
+
reflect: false
|
|
4967
5461
|
}
|
|
4968
5462
|
};
|
|
4969
5463
|
}
|
|
@@ -5015,7 +5509,10 @@ class AuroDropdown extends AuroElement {
|
|
|
5015
5509
|
|
|
5016
5510
|
disconnectedCallback() {
|
|
5017
5511
|
super.disconnectedCallback();
|
|
5018
|
-
this.floater
|
|
5512
|
+
if (this.floater) {
|
|
5513
|
+
this.floater.hideBib('disconnect');
|
|
5514
|
+
this.floater.disconnect();
|
|
5515
|
+
}
|
|
5019
5516
|
this.clearTriggerFocusEventBinding();
|
|
5020
5517
|
}
|
|
5021
5518
|
|
|
@@ -5037,11 +5534,22 @@ class AuroDropdown extends AuroElement {
|
|
|
5037
5534
|
|
|
5038
5535
|
if (changedProperties.has('isPopoverVisible') && this.bibElement.value) {
|
|
5039
5536
|
if (this.isPopoverVisible) {
|
|
5040
|
-
|
|
5537
|
+
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
5538
|
+
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
5539
|
+
const useModal = this.isBibFullscreen && !this.disableFocusTrap;
|
|
5540
|
+
this.bibElement.value.open(useModal);
|
|
5041
5541
|
} else {
|
|
5042
|
-
this.bibElement.value.
|
|
5542
|
+
this.bibElement.value.close();
|
|
5043
5543
|
}
|
|
5044
5544
|
}
|
|
5545
|
+
|
|
5546
|
+
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
5547
|
+
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
5548
|
+
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
5549
|
+
const useModal = this.isBibFullscreen && !this.disableFocusTrap;
|
|
5550
|
+
this.bibElement.value.close();
|
|
5551
|
+
this.bibElement.value.open(useModal);
|
|
5552
|
+
}
|
|
5045
5553
|
}
|
|
5046
5554
|
|
|
5047
5555
|
/**
|
|
@@ -5059,11 +5567,28 @@ class AuroDropdown extends AuroElement {
|
|
|
5059
5567
|
}
|
|
5060
5568
|
|
|
5061
5569
|
firstUpdated() {
|
|
5062
|
-
|
|
5063
5570
|
// Configure the floater to, this will generate the ID for the bib
|
|
5064
5571
|
this.floater.configure(this, 'auroDropdown');
|
|
5572
|
+
|
|
5573
|
+
// Prevent `contain: layout` on the dropdown host. Layout containment
|
|
5574
|
+
// creates a containing block for position:fixed descendants (the bib),
|
|
5575
|
+
// which clips the bib inside ancestor overflow contexts such as a
|
|
5576
|
+
// <dialog> element. Without it, the bib's position:fixed is relative
|
|
5577
|
+
// to the viewport, letting Floating UI's flip middleware detect
|
|
5578
|
+
// viewport boundaries and the bib escape overflow clipping.
|
|
5579
|
+
const origConfigureBibStrategy = this.floater.configureBibStrategy.bind(this.floater);
|
|
5580
|
+
this.floater.configureBibStrategy = (value) => {
|
|
5581
|
+
origConfigureBibStrategy(value);
|
|
5582
|
+
this.style.contain = '';
|
|
5583
|
+
};
|
|
5584
|
+
|
|
5065
5585
|
this.addEventListener('auroDropdown-toggled', this.handleDropdownToggle);
|
|
5066
5586
|
|
|
5587
|
+
// Handle ESC key from dialog's cancel event
|
|
5588
|
+
this.addEventListener('auro-bib-cancel', () => {
|
|
5589
|
+
this.floater.hideBib('keydown');
|
|
5590
|
+
});
|
|
5591
|
+
|
|
5067
5592
|
/**
|
|
5068
5593
|
* @description Let subscribers know that the dropdown ID ha been generated and added.
|
|
5069
5594
|
* @event auroDropdown-idAdded
|
|
@@ -5071,9 +5596,9 @@ class AuroDropdown extends AuroElement {
|
|
|
5071
5596
|
*/
|
|
5072
5597
|
this.dispatchEvent(new CustomEvent('auroDropdown-idAdded', {detail: {id: this.floater.element.id}}));
|
|
5073
5598
|
|
|
5074
|
-
// Set the bib ID locally
|
|
5599
|
+
// Set the bib ID locally for aria-controls (must be in the same shadow root as the trigger)
|
|
5075
5600
|
if (!this.triggerContentFocusable) {
|
|
5076
|
-
this.dropdownId = this.floater.element.id;
|
|
5601
|
+
this.dropdownId = this.floater.element.bib.id;
|
|
5077
5602
|
}
|
|
5078
5603
|
|
|
5079
5604
|
this.bibContent = this.floater.element.bib;
|
|
@@ -5133,21 +5658,20 @@ class AuroDropdown extends AuroElement {
|
|
|
5133
5658
|
* @private
|
|
5134
5659
|
*/
|
|
5135
5660
|
updateFocusTrap() {
|
|
5136
|
-
// If the dropdown is open, create a focus trap and focus the first element
|
|
5137
5661
|
if (this.isPopoverVisible && !this.disableFocusTrap) {
|
|
5138
|
-
|
|
5139
|
-
|
|
5662
|
+
if (!this.isBibFullscreen) {
|
|
5663
|
+
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
5664
|
+
this.focusTrap = new FocusTrap(this.bibContent);
|
|
5665
|
+
this.focusTrap.focusFirstElement();
|
|
5666
|
+
}
|
|
5667
|
+
// Fullscreen: showModal() provides native focus trapping
|
|
5140
5668
|
return;
|
|
5141
5669
|
}
|
|
5142
5670
|
|
|
5143
|
-
|
|
5144
|
-
|
|
5145
|
-
|
|
5671
|
+
if (this.focusTrap) {
|
|
5672
|
+
this.focusTrap.disconnect();
|
|
5673
|
+
this.focusTrap = undefined;
|
|
5146
5674
|
}
|
|
5147
|
-
|
|
5148
|
-
// If the dropdown is not open, disconnect the focus trap if it exists
|
|
5149
|
-
this.focusTrap.disconnect();
|
|
5150
|
-
this.focusTrap = undefined;
|
|
5151
5675
|
}
|
|
5152
5676
|
|
|
5153
5677
|
/**
|
|
@@ -5346,7 +5870,7 @@ class AuroDropdown extends AuroElement {
|
|
|
5346
5870
|
<div>
|
|
5347
5871
|
<div
|
|
5348
5872
|
id="trigger"
|
|
5349
|
-
class="${e$
|
|
5873
|
+
class="${e$3(this.commonWrapperClasses)}" part="wrapper"
|
|
5350
5874
|
tabindex="${o(this.triggerContentFocusable ? undefined : this.tabIndex)}"
|
|
5351
5875
|
role="${o(this.triggerContentFocusable ? undefined : this.a11yRole)}"
|
|
5352
5876
|
aria-expanded="${o(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
|
|
@@ -5363,18 +5887,19 @@ class AuroDropdown extends AuroElement {
|
|
|
5363
5887
|
<div
|
|
5364
5888
|
id="showStateIcon"
|
|
5365
5889
|
class="chevron"
|
|
5366
|
-
part="chevron"
|
|
5890
|
+
part="chevron"
|
|
5891
|
+
aria-hidden="true">
|
|
5367
5892
|
<${this.iconTag}
|
|
5368
5893
|
category="interface"
|
|
5369
5894
|
name="${this.isPopoverVisible ? 'chevron-up' : `chevron-down`}"
|
|
5370
5895
|
appearance="${this.onDark ? 'inverse' : this.appearance}"
|
|
5371
|
-
variant="${this.disabled ? 'disabled' : 'muted'}"
|
|
5372
|
-
>
|
|
5896
|
+
variant="${this.disabled ? 'disabled' : 'muted'}"
|
|
5897
|
+
ariaHidden="true">
|
|
5373
5898
|
</${this.iconTag}>
|
|
5374
5899
|
</div>
|
|
5375
5900
|
` : undefined }
|
|
5376
5901
|
</div>
|
|
5377
|
-
<div class="${e$
|
|
5902
|
+
<div class="${e$3(helpTextClasses)}">
|
|
5378
5903
|
<slot name="helpText"></slot>
|
|
5379
5904
|
</div>
|
|
5380
5905
|
<div id="bibSizer" part="size"></div>
|
|
@@ -5383,8 +5908,8 @@ class AuroDropdown extends AuroElement {
|
|
|
5383
5908
|
shape="${this.shape}"
|
|
5384
5909
|
?data-show="${this.isPopoverVisible}"
|
|
5385
5910
|
?isfullscreen="${this.isBibFullscreen}"
|
|
5911
|
+
.dialogLabel="${this.bibDialogLabel}"
|
|
5386
5912
|
${n$2(this.bibElement)}
|
|
5387
|
-
popover="manual"
|
|
5388
5913
|
>
|
|
5389
5914
|
<div class="slotContent">
|
|
5390
5915
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
@@ -5630,7 +6155,7 @@ class l{generateElementName(t,e){let o=t;return o+="-",o+=e.replace(/[.]/g,"_"),
|
|
|
5630
6155
|
aria-labelledby="${o(this.loading?void 0:this.currentAriaLabelledBy||void 0)}"
|
|
5631
6156
|
tabindex="${o(this.static?-1:l)}"
|
|
5632
6157
|
?autofocus="${this.autofocus}"
|
|
5633
|
-
class=${e$
|
|
6158
|
+
class=${e$3(s)}
|
|
5634
6159
|
?disabled="${this.disabled||this.loading}"
|
|
5635
6160
|
?onDark="${this.onDark}"
|
|
5636
6161
|
title="${o(this.title?this.title:void 0)}"
|
|
@@ -5650,8 +6175,8 @@ class l{generateElementName(t,e){let o=t;return o+="-",o+=e.replace(/[.]/g,"_"),
|
|
|
5650
6175
|
>
|
|
5651
6176
|
${o(this.loading?u$4`<${this.loaderTag} pulse part="loader"></${this.loaderTag}>`:void 0)}
|
|
5652
6177
|
|
|
5653
|
-
<span class="${e$
|
|
5654
|
-
<span class="${e$
|
|
6178
|
+
<span class="${e$3(a)}" part="contentWrapper">
|
|
6179
|
+
<span class="${e$3(r)}" part="text">
|
|
5655
6180
|
<slot></slot>
|
|
5656
6181
|
</span>
|
|
5657
6182
|
</span>
|
|
@@ -5667,7 +6192,7 @@ let p$2 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
5667
6192
|
`;let _$1 = class _ extends z$2{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.variant=void 0,this.uri="https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist",this.runtimeUtils=new p$2;}static get properties(){return {...z$2.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 [z$2.styles,y$2,w$2,x$2]}static register(t="auro-icon"){p$2.prototype.registerComponent(t,_);}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$1`
|
|
5668
6193
|
<div class="componentWrapper">
|
|
5669
6194
|
<div
|
|
5670
|
-
class="${e$
|
|
6195
|
+
class="${e$3({svgWrapper:true})}"
|
|
5671
6196
|
title="${o(this.title||void 0)}">
|
|
5672
6197
|
<span aria-hidden="${o(this.ariaHidden||true)}" part="svg">
|
|
5673
6198
|
${this.customSvg?b$1`
|
|
@@ -5678,7 +6203,7 @@ let p$2 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
5678
6203
|
</span>
|
|
5679
6204
|
</div>
|
|
5680
6205
|
|
|
5681
|
-
<div class="${e$
|
|
6206
|
+
<div class="${e$3(t)}" part="label">
|
|
5682
6207
|
<slot></slot>
|
|
5683
6208
|
</div>
|
|
5684
6209
|
</div>
|
|
@@ -5687,7 +6212,7 @@ let p$2 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
5687
6212
|
var iconVersion$1 = '9.1.2';
|
|
5688
6213
|
|
|
5689
6214
|
class r{registerComponent(e,s){customElements.get(e)||customElements.define(e,class extends s{});}closestElement(e,s=this,t=(s,a=s&&s.closest(e))=>s&&s!==document&&s!==window?a||t(s.getRootNode().host):null){return t(s)}handleComponentTagRename(e,s){const t=s.toLowerCase();e.tagName.toLowerCase()!==t&&e.setAttribute(t,true);}elementMatch(e,s){const t=s.toLowerCase();return e.tagName.toLowerCase()===t||e.hasAttribute(t)}getSlotText(e,s){const t=e.shadowRoot?.querySelector(`slot[name="${s}"]`);return (t?.assignedNodes({flatten:true})||[]).map(e=>e.textContent?.trim()).join(" ").trim()||null}}var n$1=i$6`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.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-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.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-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-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-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .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-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.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-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.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-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.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-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.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-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.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-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.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-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.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-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.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-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.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-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.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-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.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-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.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-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{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-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.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-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{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-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.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-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{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-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.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-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{display:block}:host .heading{margin-block:0}.util_stackMarginnone--bottom{margin-bottom:0}.util_stackMargin25--bottom{margin-bottom:var(--ds-size-25, .125rem)}.util_stackMargin50--bottom{margin-bottom:var(--ds-size-50, .25rem)}.util_stackMargin100--bottom{margin-bottom:var(--ds-size-100, .5rem)}.util_stackMargin150--bottom{margin-bottom:var(--ds-size-150, .75rem)}.util_stackMargin200--bottom{margin-bottom:var(--ds-size-200, 1rem)}.util_stackMargin300--bottom{margin-bottom:var(--ds-size-300, 1.5rem)}.util_stackMargin400--bottom{margin-bottom:var(--ds-size-400, 2rem)}.util_stackMargin600--bottom{margin-bottom:var(--ds-size-600, 3rem)}.util_stackMargin800--bottom{margin-bottom:var(--ds-size-800, 4rem)}.util_stackMarginnone--top{margin-top:0}.util_stackMargin25--top{margin-top:var(--ds-size-25, .125rem)}.util_stackMargin50--top{margin-top:var(--ds-size-50, .25rem)}.util_stackMargin100--top{margin-top:var(--ds-size-100, .5rem)}.util_stackMargin150--top{margin-top:var(--ds-size-150, .75rem)}.util_stackMargin200--top{margin-top:var(--ds-size-200, 1rem)}.util_stackMargin300--top{margin-top:var(--ds-size-300, 1.5rem)}.util_stackMargin400--top{margin-top:var(--ds-size-400, 2rem)}.util_stackMargin600--top{margin-top:var(--ds-size-600, 3rem)}.util_stackMargin800--top{margin-top:var(--ds-size-800, 4rem)}
|
|
5690
|
-
`;class c extends i$3{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.level=1,this.typography="heading",this.runtimeUtils=new r;}static get properties(){return {color:{type:String,reflect:true},display:{type:String,reflect:true},level:{type:Number,reflect:true,converter(e){const s=Number(e);return Number.isNaN(s)||s<1?1:s>6?6:s}},margin:{type:String,reflect:true},size:{type:String,reflect:true},typography:{type:String,reflect:true},visualLevel:{type:Number,reflect:true,converter(e){const s=Number(e);return Number.isNaN(s)||s<1?1:s>6?6:s}}}}static get styles(){return [n$1]}static get displayClassMap(){return {800:"heading-xl",700:"heading-lg",600:"heading-md",500:"heading-sm",400:"heading-xs",300:"heading-2xs",heading:{1:"heading-xl",2:"heading-lg",3:"heading-md",4:"heading-sm",5:"heading-xs",6:"heading-2xs"},display:{1:"display-2xl",2:"display-xl",3:"display-lg",4:"display-md",5:"display-sm",6:"display-xs"}}}static register(e="auro-header"){r.prototype.registerComponent(e,c);}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-header");}spacingDecision(e){if("both"===this.margin)switch(e){case "none":return "util_stackMarginnone--top util_stackMarginnone--bottom";case "25":return "util_stackMargin25--top util_stackMargin25--bottom";case "50":return "util_stackMargin50--top util_stackMargin50--bottom";case "100":return "util_stackMargin100--top util_stackMargin100--bottom";case "150":return "util_stackMargin150--top util_stackMargin150--bottom";case "200":return "util_stackMargin200--top util_stackMargin200--bottom";case "300":return "util_stackMargin300--top util_stackMargin300--bottom";case "400":return "util_stackMargin400--top util_stackMargin400--bottom";case "600":return "util_stackMargin600--top util_stackMargin600--bottom";case "800":return "util_stackMargin800--top util_stackMargin800--bottom";default:return ""}return this.spacingApplied(e)}spacingApplied(e){switch(e){case "none":return `util_stackMarginnone--${this.margin}`;case "25":return `util_stackMargin25--${this.margin}`;case "50":return `util_stackMargin50--${this.margin}`;case "100":return `util_stackMargin100--${this.margin}`;case "150":return `util_stackMargin150--${this.margin}`;case "200":return `util_stackMargin200--${this.margin}`;case "300":return `util_stackMargin300--${this.margin}`;case "400":return `util_stackMargin400--${this.margin}`;case "600":return `util_stackMarginX600--${this.margin}`;case "800":return `util_stackMargin800--${this.margin}`;default:return ""}}template(e){this.visualLevel||this.display||(this.visualLevel=this.level);const s=e||"1",r=this.spacingDecision(this.size),n=this.visualLevel?c.displayClassMap[this.typography][this.visualLevel]:c.displayClassMap[this.display],o$1={heading:true,[n]:true};if(r){r.split(" ").forEach(e=>{e.trim()&&(o$1[e.trim()]=true);});}const m=e$
|
|
6215
|
+
`;class c extends i$3{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.level=1,this.typography="heading",this.runtimeUtils=new r;}static get properties(){return {color:{type:String,reflect:true},display:{type:String,reflect:true},level:{type:Number,reflect:true,converter(e){const s=Number(e);return Number.isNaN(s)||s<1?1:s>6?6:s}},margin:{type:String,reflect:true},size:{type:String,reflect:true},typography:{type:String,reflect:true},visualLevel:{type:Number,reflect:true,converter(e){const s=Number(e);return Number.isNaN(s)||s<1?1:s>6?6:s}}}}static get styles(){return [n$1]}static get displayClassMap(){return {800:"heading-xl",700:"heading-lg",600:"heading-md",500:"heading-sm",400:"heading-xs",300:"heading-2xs",heading:{1:"heading-xl",2:"heading-lg",3:"heading-md",4:"heading-sm",5:"heading-xs",6:"heading-2xs"},display:{1:"display-2xl",2:"display-xl",3:"display-lg",4:"display-md",5:"display-sm",6:"display-xs"}}}static register(e="auro-header"){r.prototype.registerComponent(e,c);}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-header");}spacingDecision(e){if("both"===this.margin)switch(e){case "none":return "util_stackMarginnone--top util_stackMarginnone--bottom";case "25":return "util_stackMargin25--top util_stackMargin25--bottom";case "50":return "util_stackMargin50--top util_stackMargin50--bottom";case "100":return "util_stackMargin100--top util_stackMargin100--bottom";case "150":return "util_stackMargin150--top util_stackMargin150--bottom";case "200":return "util_stackMargin200--top util_stackMargin200--bottom";case "300":return "util_stackMargin300--top util_stackMargin300--bottom";case "400":return "util_stackMargin400--top util_stackMargin400--bottom";case "600":return "util_stackMargin600--top util_stackMargin600--bottom";case "800":return "util_stackMargin800--top util_stackMargin800--bottom";default:return ""}return this.spacingApplied(e)}spacingApplied(e){switch(e){case "none":return `util_stackMarginnone--${this.margin}`;case "25":return `util_stackMargin25--${this.margin}`;case "50":return `util_stackMargin50--${this.margin}`;case "100":return `util_stackMargin100--${this.margin}`;case "150":return `util_stackMargin150--${this.margin}`;case "200":return `util_stackMargin200--${this.margin}`;case "300":return `util_stackMargin300--${this.margin}`;case "400":return `util_stackMargin400--${this.margin}`;case "600":return `util_stackMarginX600--${this.margin}`;case "800":return `util_stackMargin800--${this.margin}`;default:return ""}}template(e){this.visualLevel||this.display||(this.visualLevel=this.level);const s=e||"1",r=this.spacingDecision(this.size),n=this.visualLevel?c.displayClassMap[this.typography][this.visualLevel]:c.displayClassMap[this.display],o$1={heading:true,[n]:true};if(r){r.split(" ").forEach(e=>{e.trim()&&(o$1[e.trim()]=true);});}const m=e$3(o$1),g=s$4(`h${s}`);return u$4`<${g} class="${m}" style="color: ${o(this.color?this.color:void 0)}"><slot></slot></${g}>`}render(){return this.template(this.level)}}
|
|
5691
6216
|
|
|
5692
6217
|
var headerVersion = '5.0.1';
|
|
5693
6218
|
|
|
@@ -5791,6 +6316,18 @@ class AuroBibtemplate extends i$3 {
|
|
|
5791
6316
|
this.removeEventListener('touchmove', this.preventBodyScroll, { passive: false });
|
|
5792
6317
|
}
|
|
5793
6318
|
|
|
6319
|
+
/**
|
|
6320
|
+
* Focuses the close button inside the bibtemplate's shadow DOM.
|
|
6321
|
+
* Used by parent components to set initial focus when the fullscreen dialog opens.
|
|
6322
|
+
* @returns {void}
|
|
6323
|
+
*/
|
|
6324
|
+
focusCloseButton() {
|
|
6325
|
+
const closeBtn = this.shadowRoot.querySelector('#closeButton');
|
|
6326
|
+
if (closeBtn) {
|
|
6327
|
+
closeBtn.focus();
|
|
6328
|
+
}
|
|
6329
|
+
}
|
|
6330
|
+
|
|
5794
6331
|
onCloseButtonClick() {
|
|
5795
6332
|
this.dispatchEvent(new Event("close-click", { bubbles: true,
|
|
5796
6333
|
composed: true }));
|
|
@@ -6077,7 +6614,7 @@ class AuroHelpText extends i$3 {
|
|
|
6077
6614
|
}
|
|
6078
6615
|
}
|
|
6079
6616
|
|
|
6080
|
-
var formkitVersion = '
|
|
6617
|
+
var formkitVersion = '202603102257';
|
|
6081
6618
|
|
|
6082
6619
|
var styleCss$2 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.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-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.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-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-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-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-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-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.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-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.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-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.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-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.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-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.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-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.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-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.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-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.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-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.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-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.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-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.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-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.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-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{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-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.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-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{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-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.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-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{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-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.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-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-outline-color: var(--ds-auro-select-outline-color)}:host{display:inline-block;text-align:left;vertical-align:top}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-200, 1rem)}:host([layout*=snowflake]) label{padding-block:var(--ds-size-25, 0.125rem)}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) .value{height:auto}label{color:var(--ds-auro-select-label-text-color)}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-select-outline-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown],:host([appearance=inverse]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-select-outline-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([fluid]){width:100%}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown],:host([disabled]:not([appearance=inverse])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown],:host(:not([layout*=classic])[disabled][appearance=inverse]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
|
|
6083
6620
|
|
|
@@ -6597,28 +7134,76 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6597
7134
|
configureDropdown() {
|
|
6598
7135
|
this.dropdown = this.shadowRoot.querySelector(this.dropdownTag._$litStatic$);
|
|
6599
7136
|
|
|
7137
|
+
// Prevent dropdown from closing on focus loss since menu content is slotted
|
|
7138
|
+
// from select's light DOM and won't be detected by dropdown's contains() check.
|
|
7139
|
+
// Select handles Tab key closing explicitly, ESC via dialog cancel, and
|
|
7140
|
+
// click outside works correctly via composedPath().
|
|
7141
|
+
this.dropdown.noHideOnThisFocusLoss = true;
|
|
7142
|
+
|
|
7143
|
+
|
|
6600
7144
|
this.dropdown.addEventListener('auroDropdown-toggled', () => {
|
|
6601
7145
|
this.isPopoverVisible = this.dropdown.isPopoverVisible;
|
|
6602
7146
|
|
|
7147
|
+
// Clear aria-activedescendant when dropdown closes
|
|
7148
|
+
if (!this.dropdown.isPopoverVisible) {
|
|
7149
|
+
this.dropdown.setActiveDescendant(null);
|
|
7150
|
+
this.optionActive = null;
|
|
7151
|
+
|
|
7152
|
+
restoreTriggerAfterClose(this.dropdown, this.dropdown.trigger);
|
|
7153
|
+
}
|
|
7154
|
+
|
|
6603
7155
|
if (this.dropdown.isPopoverVisible) {
|
|
6604
7156
|
this.updateMenuShapeSize();
|
|
6605
|
-
// wait til the bib gets fully rendered
|
|
6606
|
-
setTimeout(() => {
|
|
6607
|
-
if (this.dropdown.isBibFullscreen) {
|
|
6608
|
-
// trigger holds the focus since menu is not a focusable element.
|
|
6609
|
-
this.dropdown.trigger.focus();
|
|
6610
7157
|
|
|
6611
|
-
|
|
6612
|
-
|
|
6613
|
-
|
|
7158
|
+
if (this.dropdown.isBibFullscreen) {
|
|
7159
|
+
// Hide the trigger from assistive technology so VoiceOver cannot reach it
|
|
7160
|
+
// behind the fullscreen dialog
|
|
7161
|
+
this.dropdown.trigger.inert = true;
|
|
7162
|
+
|
|
7163
|
+
guardTouchPassthrough(this.menu);
|
|
7164
|
+
|
|
7165
|
+
// Wait for the bibtemplate to fully render (close button) across
|
|
7166
|
+
// multiple Lit update cycles before moving focus into the bib
|
|
7167
|
+
doubleRaf(() => {
|
|
7168
|
+
this.bibtemplate.focusCloseButton();
|
|
7169
|
+
|
|
7170
|
+
// If there's a selected option, highlight it (per W3C APG combobox-select-only pattern)
|
|
7171
|
+
// No selection → no highlight
|
|
7172
|
+
if (this.optionSelected && !Array.isArray(this.optionSelected)) {
|
|
7173
|
+
this.menu.updateActiveOption(this.optionSelected);
|
|
7174
|
+
} else if (this.multiSelect && Array.isArray(this.optionSelected) && this.optionSelected.length > 0) {
|
|
7175
|
+
this.menu.updateActiveOption(this.optionSelected[0]);
|
|
6614
7176
|
}
|
|
6615
|
-
|
|
6616
|
-
|
|
7177
|
+
|
|
7178
|
+
// Scroll the selected option into view when dropdown opens
|
|
7179
|
+
this.scrollSelectedOptionIntoView();
|
|
7180
|
+
});
|
|
7181
|
+
} else {
|
|
7182
|
+
// wait til the bib gets fully rendered
|
|
7183
|
+
setTimeout(() => {
|
|
7184
|
+
// Keep focus on trigger so aria-activedescendant announces menu options
|
|
7185
|
+
this.dropdown.trigger.focus();
|
|
7186
|
+
|
|
7187
|
+
// Scroll the selected option into view when dropdown opens
|
|
7188
|
+
this.scrollSelectedOptionIntoView();
|
|
7189
|
+
});
|
|
7190
|
+
}
|
|
6617
7191
|
}
|
|
6618
7192
|
});
|
|
6619
7193
|
|
|
6620
7194
|
this.dropdown.addEventListener('auroDropdown-strategy-change', () => {
|
|
6621
7195
|
this.updateMenuShapeSize();
|
|
7196
|
+
|
|
7197
|
+
// When switching to fullscreen while open, focus the close button
|
|
7198
|
+
// so it's not stuck on the trigger behind the dialog
|
|
7199
|
+
if (this.dropdown.isBibFullscreen && this.dropdown.isPopoverVisible) {
|
|
7200
|
+
this.dropdown.trigger.inert = true;
|
|
7201
|
+
doubleRaf(() => {
|
|
7202
|
+
this.bibtemplate.focusCloseButton();
|
|
7203
|
+
});
|
|
7204
|
+
} else if (!this.dropdown.isBibFullscreen) {
|
|
7205
|
+
this.dropdown.trigger.inert = false;
|
|
7206
|
+
}
|
|
6622
7207
|
});
|
|
6623
7208
|
|
|
6624
7209
|
// setting up bibtemplate
|
|
@@ -6628,6 +7213,12 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6628
7213
|
this.dropdown.dropdownWidth = this.customBibWidth;
|
|
6629
7214
|
}
|
|
6630
7215
|
|
|
7216
|
+
// Pass label text to the dropdown bib for accessible dialog naming
|
|
7217
|
+
const labelElement = this.querySelector('span[slot="label"]');
|
|
7218
|
+
if (labelElement) {
|
|
7219
|
+
this.dropdown.bibDialogLabel = labelElement.textContent.trim() || undefined;
|
|
7220
|
+
}
|
|
7221
|
+
|
|
6631
7222
|
// Exposes the CSS parts from the dropdown for styling
|
|
6632
7223
|
this.dropdown.exposeCssParts();
|
|
6633
7224
|
}
|
|
@@ -6729,6 +7320,23 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6729
7320
|
}
|
|
6730
7321
|
}
|
|
6731
7322
|
|
|
7323
|
+
/**
|
|
7324
|
+
* Sets aria-setsize and aria-posinset on each menu option so screen readers
|
|
7325
|
+
* can announce position even when the listbox context is broken by
|
|
7326
|
+
* shadow DOM boundaries.
|
|
7327
|
+
* @private
|
|
7328
|
+
* @returns {void}
|
|
7329
|
+
*/
|
|
7330
|
+
updateOptionPositions() {
|
|
7331
|
+
if (!this.menu || !this.menu.options) return;
|
|
7332
|
+
const visibleOptions = this.menu.options;
|
|
7333
|
+
const count = visibleOptions.length;
|
|
7334
|
+
visibleOptions.forEach((option, index) => {
|
|
7335
|
+
option.setAttribute('aria-setsize', count);
|
|
7336
|
+
option.setAttribute('aria-posinset', index + 1);
|
|
7337
|
+
});
|
|
7338
|
+
}
|
|
7339
|
+
|
|
6732
7340
|
/**
|
|
6733
7341
|
* Binds all behavior needed to the menu after rendering.
|
|
6734
7342
|
* @private
|
|
@@ -6750,13 +7358,38 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6750
7358
|
this.updateMenuShapeSize();
|
|
6751
7359
|
this.setMenuValue(this.value);
|
|
6752
7360
|
|
|
7361
|
+
// Set accessible name on the menu for screen readers based on the label slot content
|
|
7362
|
+
const labelElement = this.querySelector('[slot="label"]');
|
|
7363
|
+
if (labelElement) {
|
|
7364
|
+
this.menu.setAttribute('aria-label', labelElement.textContent.trim());
|
|
7365
|
+
}
|
|
7366
|
+
|
|
6753
7367
|
if (this.multiSelect) {
|
|
6754
7368
|
this.menu.multiSelect = this.multiSelect;
|
|
6755
7369
|
}
|
|
6756
7370
|
|
|
6757
7371
|
this.options = this.menu.options;
|
|
6758
|
-
this.
|
|
7372
|
+
this.updateOptionPositions();
|
|
6759
7373
|
this.menu.addEventListener("auroMenu-loadingChange", (event) => this.handleMenuLoadingChange(event));
|
|
7374
|
+
|
|
7375
|
+
this.menu.addEventListener('auroMenu-activatedOption', (evt) => {
|
|
7376
|
+
this.optionActive = evt.detail;
|
|
7377
|
+
|
|
7378
|
+
if (this.dropdown) {
|
|
7379
|
+
this.dropdown.setActiveDescendant(this.optionActive);
|
|
7380
|
+
}
|
|
7381
|
+
|
|
7382
|
+
// Announce the active option for screen readers
|
|
7383
|
+
if (this.optionActive) {
|
|
7384
|
+
const optionText = this.optionActive.textContent.trim();
|
|
7385
|
+
const selectedState = this.optionActive.hasAttribute('selected') ? ', selected' : ', not selected';
|
|
7386
|
+
announceToScreenReader(this.shadowRoot, `${optionText}${selectedState}`);
|
|
7387
|
+
}
|
|
7388
|
+
|
|
7389
|
+
if (this.dropdown.isPopoverVisible) {
|
|
7390
|
+
this.scrollActiveOptionIntoView();
|
|
7391
|
+
}
|
|
7392
|
+
});
|
|
6760
7393
|
this.menu.addEventListener('auroMenu-selectedOption', (event) => {
|
|
6761
7394
|
|
|
6762
7395
|
// Update the displayed value
|
|
@@ -6769,6 +7402,14 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6769
7402
|
if (this.dropdown.isPopoverVisible) {
|
|
6770
7403
|
this.dropdown.hide();
|
|
6771
7404
|
}
|
|
7405
|
+
|
|
7406
|
+
// Announce the selection after the dropdown closes so it isn't
|
|
7407
|
+
// overridden by VoiceOver's "collapsed" announcement from aria-expanded.
|
|
7408
|
+
const selectedValue = event.detail.stringValue;
|
|
7409
|
+
const announcementDelay = 300;
|
|
7410
|
+
setTimeout(() => {
|
|
7411
|
+
announceToScreenReader(this.shadowRoot, `${selectedValue}, selected`);
|
|
7412
|
+
}, announcementDelay);
|
|
6772
7413
|
});
|
|
6773
7414
|
}
|
|
6774
7415
|
|
|
@@ -6780,66 +7421,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6780
7421
|
configureSelect() {
|
|
6781
7422
|
this.nativeSelect = this.shadowRoot.querySelector('select');
|
|
6782
7423
|
|
|
6783
|
-
this
|
|
6784
|
-
|
|
6785
|
-
// when the focus is on trigger not on close button
|
|
6786
|
-
if (this.dropdown.shadowRoot.activeElement === this.dropdown.trigger) {
|
|
6787
|
-
if (evt.key === 'ArrowUp') {
|
|
6788
|
-
evt.preventDefault();
|
|
6789
|
-
|
|
6790
|
-
this.dropdown.show();
|
|
6791
|
-
|
|
6792
|
-
if (this.dropdown.isPopoverVisible) {
|
|
6793
|
-
this.menu.navigateOptions('up');
|
|
6794
|
-
}
|
|
6795
|
-
|
|
6796
|
-
return;
|
|
6797
|
-
}
|
|
6798
|
-
|
|
6799
|
-
if (evt.key === 'ArrowDown') {
|
|
6800
|
-
evt.preventDefault();
|
|
6801
|
-
|
|
6802
|
-
this.dropdown.show();
|
|
6803
|
-
|
|
6804
|
-
if (this.dropdown.isPopoverVisible) {
|
|
6805
|
-
this.menu.navigateOptions('down');
|
|
6806
|
-
}
|
|
6807
|
-
|
|
6808
|
-
return;
|
|
6809
|
-
}
|
|
6810
|
-
|
|
6811
|
-
if (evt.key === 'Enter') {
|
|
6812
|
-
if (!this.dropdown.isPopoverVisible) {
|
|
6813
|
-
evt.preventDefault();
|
|
6814
|
-
this.menu.makeSelection();
|
|
6815
|
-
}
|
|
6816
|
-
|
|
6817
|
-
return;
|
|
6818
|
-
}
|
|
6819
|
-
}
|
|
6820
|
-
|
|
6821
|
-
if (evt.key === 'Tab' && this.dropdown.isPopoverVisible) {
|
|
6822
|
-
if (this.dropdown.isBibFullscreen) {
|
|
6823
|
-
evt.preventDefault();
|
|
6824
|
-
|
|
6825
|
-
// when the focus is on trigger not on close button
|
|
6826
|
-
if (this.dropdown.shadowRoot.activeElement === this.dropdown.trigger) {
|
|
6827
|
-
// `dropdown.focus` will move focus to the first focusable element in bib when it's open,
|
|
6828
|
-
// when bib it not open, it will focus onto trigger.
|
|
6829
|
-
this.dropdown.focus();
|
|
6830
|
-
} else {
|
|
6831
|
-
// when close button has the focus, move focus back to the trigger
|
|
6832
|
-
this.dropdown.trigger.focus();
|
|
6833
|
-
}
|
|
6834
|
-
} else {
|
|
6835
|
-
this.dropdown.hide();
|
|
6836
|
-
}
|
|
6837
|
-
return;
|
|
6838
|
-
}
|
|
6839
|
-
|
|
6840
|
-
// Handle all other key presses by updating the active option based on the key pressed
|
|
6841
|
-
this.updateActiveOptionBasedOnKey(evt.key);
|
|
6842
|
-
});
|
|
7424
|
+
applyKeyboardStrategy(this, selectKeyboardStrategy);
|
|
6843
7425
|
|
|
6844
7426
|
this.addEventListener('focusin', this.handleFocusin);
|
|
6845
7427
|
|
|
@@ -6849,6 +7431,16 @@ class AuroSelect extends AuroElement$1 {
|
|
|
6849
7431
|
});
|
|
6850
7432
|
}
|
|
6851
7433
|
|
|
7434
|
+
/**
|
|
7435
|
+
* Updates the active option in the menu.
|
|
7436
|
+
* @param {number} index - Index of the option to make active.
|
|
7437
|
+
*/
|
|
7438
|
+
updateActiveOption(index) {
|
|
7439
|
+
if (this.menu) {
|
|
7440
|
+
this.menu.index = index;
|
|
7441
|
+
}
|
|
7442
|
+
}
|
|
7443
|
+
|
|
6852
7444
|
/**
|
|
6853
7445
|
* Updates the active option in the menu based on keyboard input.
|
|
6854
7446
|
* @private
|
|
@@ -7012,6 +7604,48 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7012
7604
|
this.menu.value = value;
|
|
7013
7605
|
}
|
|
7014
7606
|
|
|
7607
|
+
/**
|
|
7608
|
+
* Scrolls the currently active option into view.
|
|
7609
|
+
* Respects user's motion preferences for accessibility.
|
|
7610
|
+
* @private
|
|
7611
|
+
*/
|
|
7612
|
+
scrollActiveOptionIntoView() {
|
|
7613
|
+
if (!this.menu || !this.menu.optionActive) return;
|
|
7614
|
+
|
|
7615
|
+
// Check if user prefers reduced motion for accessibility
|
|
7616
|
+
const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
7617
|
+
|
|
7618
|
+
this.menu.optionActive.scrollIntoView({
|
|
7619
|
+
alignToTop: false,
|
|
7620
|
+
block: "nearest",
|
|
7621
|
+
behavior: prefersReducedMotion ? "auto" : "smooth"
|
|
7622
|
+
});
|
|
7623
|
+
}
|
|
7624
|
+
|
|
7625
|
+
/**
|
|
7626
|
+
* Scrolls the currently selected option into view.
|
|
7627
|
+
* Respects user's motion preferences for accessibility.
|
|
7628
|
+
* @private
|
|
7629
|
+
*/
|
|
7630
|
+
scrollSelectedOptionIntoView() {
|
|
7631
|
+
if (!this.menu || !this.menu.optionSelected) return;
|
|
7632
|
+
|
|
7633
|
+
const selectedOption = this.multiSelect && Array.isArray(this.menu.optionSelected)
|
|
7634
|
+
? this.menu.optionSelected[0]
|
|
7635
|
+
: this.menu.optionSelected;
|
|
7636
|
+
|
|
7637
|
+
if (selectedOption) {
|
|
7638
|
+
// Check if user prefers reduced motion for accessibility
|
|
7639
|
+
const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
7640
|
+
|
|
7641
|
+
selectedOption.scrollIntoView({
|
|
7642
|
+
alignToTop: true,
|
|
7643
|
+
block: "start",
|
|
7644
|
+
behavior: prefersReducedMotion ? "auto" : "smooth"
|
|
7645
|
+
});
|
|
7646
|
+
}
|
|
7647
|
+
}
|
|
7648
|
+
|
|
7015
7649
|
updated(changedProperties) {
|
|
7016
7650
|
if (changedProperties.has('multiSelect') && !changedProperties.has('value')) {
|
|
7017
7651
|
this.clearSelection();
|
|
@@ -7023,7 +7657,9 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7023
7657
|
this._updateNativeSelect();
|
|
7024
7658
|
this.validate();
|
|
7025
7659
|
this.hideBib();
|
|
7026
|
-
this.
|
|
7660
|
+
if (this.dropdown && this.dropdown.trigger) {
|
|
7661
|
+
this.dropdown.trigger.focus();
|
|
7662
|
+
}
|
|
7027
7663
|
|
|
7028
7664
|
// LEGACY EVENT
|
|
7029
7665
|
this.dispatchEvent(new CustomEvent('auroSelect-valueSet', {
|
|
@@ -7072,6 +7708,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7072
7708
|
* @returns {void}
|
|
7073
7709
|
*/
|
|
7074
7710
|
reset() {
|
|
7711
|
+
this.menu.reset();
|
|
7075
7712
|
this.validation.reset(this);
|
|
7076
7713
|
}
|
|
7077
7714
|
|
|
@@ -7221,7 +7858,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7221
7858
|
</div>
|
|
7222
7859
|
<${this.dropdownTag}
|
|
7223
7860
|
appearance="${this.onDark ? 'inverse' : this.appearance}"
|
|
7224
|
-
a11yRole
|
|
7861
|
+
.a11yRole=${"combobox"}
|
|
7225
7862
|
?autoPlacement="${this.autoPlacement}"
|
|
7226
7863
|
?error="${this.validity !== undefined && this.validity !== 'valid'}"
|
|
7227
7864
|
?matchWidth="${this.matchWidth}"
|
|
@@ -7236,28 +7873,27 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7236
7873
|
part="dropdown"
|
|
7237
7874
|
shape="${this.shape}"
|
|
7238
7875
|
size="${this.size}">
|
|
7239
|
-
<div slot="trigger"
|
|
7876
|
+
<div slot="trigger" id="triggerFocus" class="triggerContent">
|
|
7240
7877
|
<div class="accents left">
|
|
7241
7878
|
<slot name="typeIcon"></slot>
|
|
7242
7879
|
</div>
|
|
7243
7880
|
<div class="mainContent">
|
|
7244
|
-
<div class="${e$
|
|
7245
|
-
<
|
|
7881
|
+
<div class="${e$3(valueContainerClasses)}">
|
|
7882
|
+
<span id="dropdownLabel" class="${e$3(this.commonLabelClasses)}">
|
|
7246
7883
|
<slot name="label"></slot>
|
|
7247
7884
|
${this.required ? undefined : u$4`<slot name="optionalLabel"> (optional)</slot>`}
|
|
7248
|
-
</
|
|
7885
|
+
</span>
|
|
7249
7886
|
<div class="value" id="value"></div>
|
|
7250
|
-
<div id="placeholder" class="${e$
|
|
7887
|
+
<div id="placeholder" class="${e$3(placeholderClass)}">
|
|
7251
7888
|
${this.placeholder}
|
|
7252
7889
|
</div>
|
|
7253
7890
|
</div>
|
|
7254
|
-
<div class="${e$
|
|
7891
|
+
<div class="${e$3(displayValueClasses)}" aria-hidden="true" part="displayValue">
|
|
7255
7892
|
<slot name="displayValue"></slot>
|
|
7256
7893
|
</div>
|
|
7257
7894
|
</div>
|
|
7258
7895
|
<div class="accents right"></div>
|
|
7259
7896
|
</div>
|
|
7260
|
-
<div class="menuWrapper"></div>
|
|
7261
7897
|
<${this.bibtemplateTag} ?large="${this.largeFullscreenHeadline}" @close-click="${this.hideBib}">
|
|
7262
7898
|
<slot name="ariaLabel.bib.close" slot="ariaLabel.close">Close</slot>
|
|
7263
7899
|
<slot></slot>
|
|
@@ -7301,6 +7937,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7301
7937
|
</div>
|
|
7302
7938
|
<${this.dropdownTag}
|
|
7303
7939
|
appearance="${this.onDark ? 'inverse' : this.appearance}"
|
|
7940
|
+
.a11yRole=${"combobox"}
|
|
7304
7941
|
?autoPlacement="${this.autoPlacement}"
|
|
7305
7942
|
?error="${this.validity !== undefined && this.validity !== 'valid'}"
|
|
7306
7943
|
?matchWidth="${this.matchWidth}"
|
|
@@ -7314,28 +7951,27 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7314
7951
|
part="dropdown"
|
|
7315
7952
|
shape="${this.shape}"
|
|
7316
7953
|
size="${this.size}">
|
|
7317
|
-
<div slot="trigger"
|
|
7954
|
+
<div slot="trigger" id="triggerFocus" class="triggerContent">
|
|
7318
7955
|
<div class="accents left">
|
|
7319
7956
|
<slot name="typeIcon"></slot>
|
|
7320
7957
|
</div>
|
|
7321
7958
|
<div class="mainContent">
|
|
7322
|
-
<div class="${e$
|
|
7323
|
-
<
|
|
7959
|
+
<div class="${e$3(valueContainerClasses)}">
|
|
7960
|
+
<span id="dropdownLabel" class="${e$3(this.commonLabelClasses)}">
|
|
7324
7961
|
<slot name="label"></slot>
|
|
7325
7962
|
${this.required ? undefined : u$4`<slot name="optionalLabel"> (optional)</slot>`}
|
|
7326
|
-
</
|
|
7963
|
+
</span>
|
|
7327
7964
|
<div class="value body-default" id="value"></div>
|
|
7328
|
-
<div id="placeholder" class="${e$
|
|
7965
|
+
<div id="placeholder" class="${e$3(placeholderClass)}">
|
|
7329
7966
|
${this.placeholder}
|
|
7330
7967
|
</div>
|
|
7331
7968
|
</div>
|
|
7332
|
-
<div class="${e$
|
|
7969
|
+
<div class="${e$3(displayValueClasses)}" aria-hidden="true" part="displayValue">
|
|
7333
7970
|
<slot name="displayValue"></slot>
|
|
7334
7971
|
</div>
|
|
7335
7972
|
</div>
|
|
7336
7973
|
<div class="accents right"></div>
|
|
7337
7974
|
</div>
|
|
7338
|
-
<div class="menuWrapper"></div>
|
|
7339
7975
|
<${this.bibtemplateTag} ?large="${this.largeFullscreenHeadline}" @close-click="${this.hideBib}">
|
|
7340
7976
|
<slot name="ariaLabel.bib.close" slot="ariaLabel.close">Close</slot>
|
|
7341
7977
|
<slot></slot>
|
|
@@ -7345,6 +7981,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7345
7981
|
</div>
|
|
7346
7982
|
</${this.dropdownTag}>
|
|
7347
7983
|
${this.renderNativeSelect()}
|
|
7984
|
+
<span id="srAnnouncement" class="util_displayHiddenVisually" aria-live="polite" role="status"></span>
|
|
7348
7985
|
</div>
|
|
7349
7986
|
`;
|
|
7350
7987
|
}
|
|
@@ -7385,6 +8022,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7385
8022
|
</div>
|
|
7386
8023
|
<${this.dropdownTag}
|
|
7387
8024
|
appearance="${this.onDark ? 'inverse' : this.appearance}"
|
|
8025
|
+
.a11yRole=${"combobox"}
|
|
7388
8026
|
?autoPlacement="${this.autoPlacement}"
|
|
7389
8027
|
?error="${this.validity !== undefined && this.validity !== 'valid'}"
|
|
7390
8028
|
?matchWidth="${!this.flexMenuWidth}"
|
|
@@ -7398,28 +8036,27 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7398
8036
|
part="dropdown"
|
|
7399
8037
|
shape="${this.shape}"
|
|
7400
8038
|
size="${this.size}">
|
|
7401
|
-
<div slot="trigger"
|
|
8039
|
+
<div slot="trigger" id="triggerFocus" class="triggerContent">
|
|
7402
8040
|
<div class="accents left">
|
|
7403
8041
|
<slot name="typeIcon"></slot>
|
|
7404
8042
|
</div>
|
|
7405
8043
|
<div class="mainContent">
|
|
7406
|
-
<div class="${e$
|
|
7407
|
-
<
|
|
8044
|
+
<div class="${e$3(valueContainerClasses)}">
|
|
8045
|
+
<span id="dropdownLabel" class="${e$3(this.commonLabelClasses)}">
|
|
7408
8046
|
<slot name="label"></slot>
|
|
7409
8047
|
${this.required ? undefined : u$4`<slot name="optionalLabel"> (optional)</slot>`}
|
|
7410
|
-
</
|
|
7411
|
-
<div class="${e$
|
|
7412
|
-
<div id="placeholder" class="${e$
|
|
8048
|
+
</span>
|
|
8049
|
+
<div class="${e$3(valueClasses)}" id="value"></div>
|
|
8050
|
+
<div id="placeholder" class="${e$3(placeholderClass)}">
|
|
7413
8051
|
${this.placeholder}
|
|
7414
8052
|
</div>
|
|
7415
8053
|
</div>
|
|
7416
|
-
<div class="${e$
|
|
8054
|
+
<div class="${e$3(displayValueClasses)}" aria-hidden="true" part="displayValue">
|
|
7417
8055
|
<slot name="displayValue"></slot>
|
|
7418
8056
|
</div>
|
|
7419
8057
|
</div>
|
|
7420
8058
|
<div class="accents right"></div>
|
|
7421
8059
|
</div>
|
|
7422
|
-
<div class="menuWrapper"></div>
|
|
7423
8060
|
<${this.bibtemplateTag} ?large="${this.largeFullscreenHeadline}" @close-click="${this.hideBib}">
|
|
7424
8061
|
<slot name="ariaLabel.bib.close" slot="ariaLabel.close">Close</slot>
|
|
7425
8062
|
<slot></slot>
|
|
@@ -7429,6 +8066,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7429
8066
|
</div>
|
|
7430
8067
|
</${this.dropdownTag}>
|
|
7431
8068
|
${this.renderNativeSelect()}
|
|
8069
|
+
<span id="srAnnouncement" class="util_displayHiddenVisually" aria-live="polite" role="status"></span>
|
|
7432
8070
|
</div>
|
|
7433
8071
|
`;
|
|
7434
8072
|
}
|
|
@@ -7464,7 +8102,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
7464
8102
|
// aria-hidden="${this.hideAudible(this.hiddenAudible)}"
|
|
7465
8103
|
}
|
|
7466
8104
|
|
|
7467
|
-
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-weight, 450);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-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-weight, 450);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-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-weight, 450);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-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-weight, 450);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-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-weight, 450);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)}.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);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-md-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);font-weight:var(--wcss-heading-xs-weight, 450);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))}.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);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);font-weight:var(--wcss-heading-2xs-weight, 450);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))}.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);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);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));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);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);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));text-transform:uppercase}:host{display:block;vertical-align:middle;line-height:0}: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]){overflow-y:auto}: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)}`;
|
|
8105
|
+
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-weight, 450);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-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-weight, 450);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-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-weight, 450);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-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-weight, 450);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-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-weight, 450);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)}.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);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-md-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);font-weight:var(--wcss-heading-xs-weight, 450);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))}.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);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);font-weight:var(--wcss-heading-2xs-weight, 450);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))}.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);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);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));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);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);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));text-transform:uppercase}:host{display:block;vertical-align:middle;line-height:0}: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)}`;
|
|
7468
8106
|
|
|
7469
8107
|
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)}`;
|
|
7470
8108
|
|
|
@@ -7505,7 +8143,7 @@ class s{get value(){return this.o}set value(s){this.setValue(s);}setValue(s,t=fa
|
|
|
7505
8143
|
|
|
7506
8144
|
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-weight, 450);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-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-weight, 450);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-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-weight, 450);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-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-weight, 450);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-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-weight, 450);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)}.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);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-md-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);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))}.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);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);font-weight:var(--wcss-heading-xs-weight, 450);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))}.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);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);font-weight:var(--wcss-heading-2xs-weight, 450);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))}.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);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);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));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);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);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));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);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);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));text-transform:uppercase}:host{cursor:pointer;user-select:none;text-overflow:ellipsis;max-width:100dvw}:host .wrapper{display:flex;align-items:center;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));padding-top:var(--ds-size-50, 0.25rem);padding-bottom:var(--ds-size-50, 0.25rem);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}`;
|
|
7507
8145
|
|
|
7508
|
-
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(:hover)
|
|
8146
|
+
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)}}`;
|
|
7509
8147
|
|
|
7510
8148
|
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>';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 g=new Map,f=(t,a={})=>{const e=a.responseParser||(t=>t.text());return g.has(t)||g.set(t,fetch(t).then(e)),g.get(t)};var w=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}
|
|
7511
8149
|
`;class z 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 w}async fetchIcon(t,a){let e="";e="logos"===t?await f(`${this.uri}/${t}/${a}.svg`):await f(`${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=(new DOMParser).parseFromString(u,"text/html");this.svg=t.body.firstChild;}}}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}
|
|
@@ -7514,7 +8152,7 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
7514
8152
|
`;class _ extends z{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 {...z.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 [z.styles,y,w,x]}static register(t="auro-icon"){p.prototype.registerComponent(t,_);}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$1`
|
|
7515
8153
|
<div class="componentWrapper">
|
|
7516
8154
|
<div
|
|
7517
|
-
class="${e$
|
|
8155
|
+
class="${e$3({svgWrapper:true})}"
|
|
7518
8156
|
title="${o(this.title||void 0)}">
|
|
7519
8157
|
<span aria-hidden="${o(this.ariaHidden||true)}" part="svg">
|
|
7520
8158
|
${this.customSvg?b$1`
|
|
@@ -7525,13 +8163,13 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
7525
8163
|
</span>
|
|
7526
8164
|
</div>
|
|
7527
8165
|
|
|
7528
|
-
<div class="${e$
|
|
8166
|
+
<div class="${e$3(t)}" part="label">
|
|
7529
8167
|
<slot></slot>
|
|
7530
8168
|
</div>
|
|
7531
8169
|
</div>
|
|
7532
8170
|
`}}
|
|
7533
8171
|
|
|
7534
|
-
var iconVersion = '9.1.
|
|
8172
|
+
var iconVersion = '9.1.2';
|
|
7535
8173
|
|
|
7536
8174
|
var checkmarkIcon = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"checkmark-sm__desc\" class=\"ico_squareLarge\" 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=\"checkmark-sm__desc\">a small check mark.</desc><path d=\"M8.461 11.84a.625.625 0 1 0-.922.844l2.504 2.738c.247.27.674.27.922 0l5.496-6a.625.625 0 1 0-.922-.844l-5.035 5.496z\"/></svg>"};
|
|
7537
8175
|
|
|
@@ -7571,6 +8209,8 @@ function dispatchMenuEvent(element, eventName, detail = null) {
|
|
|
7571
8209
|
*
|
|
7572
8210
|
* @event auroMenuOption-mouseover - Notifies that this option has been hovered over.
|
|
7573
8211
|
*/
|
|
8212
|
+
let menuOptionIdCounter = 0;
|
|
8213
|
+
|
|
7574
8214
|
class AuroMenuOption extends AuroElement$1 {
|
|
7575
8215
|
|
|
7576
8216
|
/**
|
|
@@ -7753,6 +8393,12 @@ class AuroMenuOption extends AuroElement$1 {
|
|
|
7753
8393
|
// Add the tag name as an attribute if it is different than the component name
|
|
7754
8394
|
this.runtimeUtils.handleComponentTagRename(this, 'auro-menuoption');
|
|
7755
8395
|
|
|
8396
|
+
// Generate unique ID if not already set (required for aria-activedescendant)
|
|
8397
|
+
if (!this.id) {
|
|
8398
|
+
menuOptionIdCounter += 1;
|
|
8399
|
+
this.id = `menuoption-${menuOptionIdCounter}`;
|
|
8400
|
+
}
|
|
8401
|
+
|
|
7756
8402
|
this.setAttribute('role', 'option');
|
|
7757
8403
|
this.setAttribute('aria-selected', 'false');
|
|
7758
8404
|
|
|
@@ -8030,7 +8676,7 @@ class AuroMenuOption extends AuroElement$1 {
|
|
|
8030
8676
|
xl: 'body-lg'
|
|
8031
8677
|
};
|
|
8032
8678
|
|
|
8033
|
-
const classes = e$
|
|
8679
|
+
const classes = e$3({
|
|
8034
8680
|
'wrapper': true,
|
|
8035
8681
|
[this.size ? fontClassMap[this.size] : 'body-sm']: true,
|
|
8036
8682
|
});
|
|
@@ -8657,7 +9303,7 @@ class MenuService {
|
|
|
8657
9303
|
|
|
8658
9304
|
const MenuContext = n('menu-context');
|
|
8659
9305
|
|
|
8660
|
-
/* eslint-disable no-underscore-dangle
|
|
9306
|
+
/* eslint-disable no-underscore-dangle */
|
|
8661
9307
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
8662
9308
|
// See LICENSE in the project root for license information.
|
|
8663
9309
|
|
|
@@ -8678,7 +9324,7 @@ const MenuContext = n('menu-context');
|
|
|
8678
9324
|
* @slot - Slot for insertion of menu options.
|
|
8679
9325
|
*/
|
|
8680
9326
|
|
|
8681
|
-
/* eslint-disable
|
|
9327
|
+
/* eslint-disable max-lines */
|
|
8682
9328
|
|
|
8683
9329
|
class AuroMenu extends AuroElement$1 {
|
|
8684
9330
|
|
|
@@ -9135,6 +9781,11 @@ class AuroMenu extends AuroElement$1 {
|
|
|
9135
9781
|
if (this.rootMenu) {
|
|
9136
9782
|
this.setAttribute('role', 'listbox');
|
|
9137
9783
|
this.setAttribute('root', '');
|
|
9784
|
+
|
|
9785
|
+
if (this.multiSelect) {
|
|
9786
|
+
this.setAttribute('aria-multiselectable', 'true');
|
|
9787
|
+
}
|
|
9788
|
+
|
|
9138
9789
|
this.handleNestedMenus(this);
|
|
9139
9790
|
}
|
|
9140
9791
|
}
|
|
@@ -9300,7 +9951,7 @@ class AuroMenu extends AuroElement$1 {
|
|
|
9300
9951
|
* @private
|
|
9301
9952
|
*/
|
|
9302
9953
|
get wrapperClasses() {
|
|
9303
|
-
return e$
|
|
9954
|
+
return e$3({
|
|
9304
9955
|
'menuWrapper': true,
|
|
9305
9956
|
[this.size]: true,
|
|
9306
9957
|
});
|