@aurodesignsystem-dev/auro-formkit 0.0.0-pr1408.14 → 0.0.0-pr1408.16
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/components/checkbox/demo/api.min.js +1 -1
- package/components/checkbox/demo/index.min.js +1 -1
- package/components/checkbox/demo/keyboardBehavior.md +0 -0
- package/components/checkbox/dist/index.js +1 -1
- package/components/checkbox/dist/registered.js +1 -1
- package/components/combobox/demo/api.min.js +139 -142
- package/components/combobox/demo/index.min.js +139 -142
- package/components/combobox/demo/keyboardBehavior.md +1 -2
- package/components/combobox/dist/index.js +105 -115
- package/components/combobox/dist/registered.js +105 -115
- package/components/counter/demo/api.md +1 -1
- package/components/counter/demo/api.min.js +202 -146
- package/components/counter/demo/index.min.js +202 -146
- package/components/counter/dist/auro-counter.d.ts +11 -8
- package/components/counter/dist/index.js +202 -146
- package/components/counter/dist/keyboardStrategy.d.ts +4 -0
- package/components/counter/dist/registered.js +202 -146
- package/components/datepicker/demo/api.min.js +107 -118
- package/components/datepicker/demo/index.min.js +107 -118
- package/components/datepicker/dist/index.js +102 -113
- package/components/datepicker/dist/registered.js +102 -113
- package/components/dropdown/demo/api.md +29 -29
- package/components/dropdown/demo/api.min.js +117 -121
- package/components/dropdown/demo/index.min.js +117 -121
- package/components/dropdown/dist/auro-dropdown.d.ts +3 -3
- package/components/dropdown/dist/auro-dropdownBib.d.ts +1 -40
- package/components/dropdown/dist/dropdownBibKeyboardStrategy.d.ts +7 -0
- package/components/dropdown/dist/index.js +101 -109
- package/components/dropdown/dist/registered.js +101 -109
- package/components/form/demo/api.min.js +629 -544
- package/components/form/demo/index.min.js +629 -544
- package/components/form/demo/keyboardBehavior.md +0 -0
- package/components/input/demo/api.min.js +1 -1
- package/components/input/demo/index.min.js +1 -1
- package/components/input/demo/keyboardBehavior.md +0 -0
- package/components/input/dist/index.js +1 -1
- package/components/input/dist/registered.js +1 -1
- package/components/menu/demo/api.min.js +34 -27
- package/components/menu/demo/index.min.js +34 -27
- package/components/menu/dist/auro-menu.d.ts +0 -6
- package/components/menu/dist/index.js +34 -27
- package/components/menu/dist/registered.js +34 -27
- package/components/radio/demo/api.min.js +1 -1
- package/components/radio/demo/index.min.js +1 -1
- package/components/radio/dist/index.js +1 -1
- package/components/radio/dist/registered.js +1 -1
- package/components/select/demo/api.min.js +214 -164
- package/components/select/demo/index.min.js +214 -164
- package/components/select/demo/keyboardBehavior.md +3 -3
- package/components/select/dist/index.js +180 -137
- package/components/select/dist/registered.js +180 -137
- package/components/select/dist/selectKeyboardStrategy.d.ts +5 -2
- package/custom-elements.json +1518 -1481
- package/package.json +8 -6
|
@@ -90,7 +90,7 @@ function inDialogExample() {
|
|
|
90
90
|
* Copyright 2017 Google LLC
|
|
91
91
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
92
92
|
*/
|
|
93
|
-
const t$2=globalThis,i$5=t=>t,s$4=t$2.trustedTypes,e$
|
|
93
|
+
const t$2=globalThis,i$5=t=>t,s$4=t$2.trustedTypes,e$6=s$4?s$4.createPolicy("lit-html",{createHTML:t=>t}):void 0,h$3="$lit$",o$7=`lit$${Math.random().toFixed(9).slice(2)}$`,n$5="?"+o$7,r$4=`<${n$5}>`,l$2=document,c$3=()=>l$2.createComment(""),a$2=t=>null===t||"object"!=typeof t&&"function"!=typeof t,u$3=Array.isArray,d$1=t=>u$3(t)||"function"==typeof t?.[Symbol.iterator],f$3="[ \t\n\f\r]",v=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_$1=/-->/g,m$1=/>/g,p$2=RegExp(`>|${f$3}(?:([^\\s"'>=/]+)(${f$3}*=${f$3}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g$1=/'/g,$=/"/g,y$2=/^(?:script|style|textarea|title)$/i,x$1=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),b$1=x$1(1),E=Symbol.for("lit-noChange"),A=Symbol.for("lit-nothing"),C=new WeakMap,P=l$2.createTreeWalker(l$2,129);function V(t,i){if(!u$3(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==e$6?e$6.createHTML(i):i}const N=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,f=0;for(;f<s.length&&(c.lastIndex=f,u=c.exec(s),null!==u);)f=c.lastIndex,c===v?"!--"===u[1]?c=_$1:void 0!==u[1]?c=m$1:void 0!==u[2]?(y$2.test(u[2])&&(n=RegExp("</"+u[2],"g")),c=p$2):void 0!==u[3]&&(c=p$2):c===p$2?">"===u[0]?(c=n??v,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?p$2:'"'===u[3]?$:g$1):c===$||c===g$1?c=p$2:c===_$1||c===m$1?c=v:(c=p$2,n=void 0);const x=c===p$2&&t[i+1].startsWith("/>")?" ":"";l+=c===v?s+r$4:d>=0?(e.push(a),s.slice(0,d)+h$3+s.slice(d)+o$7+x):s+o$7+(-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(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$7),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z$1:H}),r.removeAttribute(t);}else t.startsWith(o$7)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y$2.test(r.tagName)){const t=r.textContent.split(o$7),i=t.length-1;if(i>0){r.textContent=s$4?s$4.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$7,t+1));)d.push({type:7,index:l}),t+=o$7.length-1;}l++;}}static createElement(t,i){const s=l$2.createElement("template");return s.innerHTML=t,s}};function M(t,i,s=t,e){if(i===E)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=a$2(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(t,h._$AS(t,i.values),h,e)),i}class R{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??l$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(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++;}}class k{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=A,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=M(this,t,i),a$2(t)?t===A||null==t||""===t?(this._$AH!==A&&this._$AR(),this._$AH=A):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d$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&&a$2(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(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C.get(t.strings);return void 0===i&&C.set(t.strings,i=new S$1(t)),i}k(t){u$3(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$5(t).nextSibling;i$5(t).remove(),t=s;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class H{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=A,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=M(this,t,i,0),o=!a$2(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(this,e[s+n],i,n),r===E&&(r=this._$AH[n]),o||=!a$2(r)||r!==this._$AH[n],r===A?t=A:t!==A&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class I extends H{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A?void 0:t;}}class L extends H{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A);}}let z$1 = class z extends H{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=M(this,t,i,0)??A)===E)return;const s=this._$AH,e=t===A&&s!==A||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A&&(s===A||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}};class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){M(this,t);}}const B=t$2.litHtmlPolyfillSupport;B?.(S$1,k),(t$2.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(i.insertBefore(c$3(),t),t,void 0,s??{});}return h._$AI(t),h};
|
|
94
94
|
|
|
95
95
|
/**
|
|
96
96
|
* @license
|
|
@@ -104,13 +104,13 @@ const a$1=Symbol.for(""),o$6=t=>{if(t?.r===a$1)return t?._$litStatic$},s$3=t=>({
|
|
|
104
104
|
* Copyright 2017 Google LLC
|
|
105
105
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
106
106
|
*/
|
|
107
|
-
const t$1={ATTRIBUTE:1,CHILD:2},e$
|
|
107
|
+
const t$1={ATTRIBUTE:1,CHILD:2},e$5=t=>(...e)=>({_$litDirective$:t,values:e});let i$3 = 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)}};
|
|
108
108
|
|
|
109
109
|
/**
|
|
110
110
|
* @license
|
|
111
111
|
* Copyright 2018 Google LLC
|
|
112
112
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
113
|
-
*/const e$
|
|
113
|
+
*/const e$4=e$5(class extends i$3{constructor(t){if(super(t),t.type!==t$1.ATTRIBUTE||"class"!==t.name||t.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}});
|
|
114
114
|
|
|
115
115
|
/**
|
|
116
116
|
* @license
|
|
@@ -128,7 +128,7 @@ const t$1={ATTRIBUTE:1,CHILD:2},e$4=t=>(...e)=>({_$litDirective$:t,values:e});le
|
|
|
128
128
|
* @license
|
|
129
129
|
* Copyright 2020 Google LLC
|
|
130
130
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
131
|
-
*/const e$
|
|
131
|
+
*/const e$3=()=>new h$1;let h$1 = class h{};const o$4=new WeakMap,n$2=e$5(class extends f$2{render(i){return A}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}rt(t){if(this.isConnected||(t=void 0),"function"==typeof this.G){const i=this.ht??globalThis;let s=o$4.get(i);void 0===s&&(s=new WeakMap,o$4.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$4.get(this.ht??globalThis)?.get(this.G):this.G?.value}disconnected(){this.lt===this.ct&&this.rt(void 0);}reconnected(){this.rt(this.ct);}});
|
|
132
132
|
|
|
133
133
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
134
134
|
// See LICENSE in the project root for license information.
|
|
@@ -1919,6 +1919,11 @@ class AuroFloatingUI {
|
|
|
1919
1919
|
this.clickHandler = null;
|
|
1920
1920
|
this.keyDownHandler = null;
|
|
1921
1921
|
|
|
1922
|
+
/**
|
|
1923
|
+
* @private
|
|
1924
|
+
*/
|
|
1925
|
+
this.enableKeyboardHandling = true;
|
|
1926
|
+
|
|
1922
1927
|
/**
|
|
1923
1928
|
* @private
|
|
1924
1929
|
*/
|
|
@@ -2179,11 +2184,10 @@ class AuroFloatingUI {
|
|
|
2179
2184
|
return;
|
|
2180
2185
|
}
|
|
2181
2186
|
|
|
2182
|
-
const { activeElement } = document;
|
|
2183
2187
|
// if focus is still inside of trigger or bib, do not close
|
|
2184
2188
|
if (
|
|
2185
|
-
this.element.
|
|
2186
|
-
this.element.
|
|
2189
|
+
this.element.matches(":focus") ||
|
|
2190
|
+
this.element.matches(":focus-within")
|
|
2187
2191
|
) {
|
|
2188
2192
|
return;
|
|
2189
2193
|
}
|
|
@@ -2254,7 +2258,9 @@ class AuroFloatingUI {
|
|
|
2254
2258
|
document.addEventListener("focusin", this.focusHandler);
|
|
2255
2259
|
}
|
|
2256
2260
|
|
|
2257
|
-
|
|
2261
|
+
if (this.enableKeyboardHandling) {
|
|
2262
|
+
document.addEventListener("keydown", this.keyDownHandler);
|
|
2263
|
+
}
|
|
2258
2264
|
|
|
2259
2265
|
// send this task to the end of queue to prevent conflicting
|
|
2260
2266
|
// it conflicts if showBib gets call from a button that's not this.element.trigger
|
|
@@ -2510,8 +2516,9 @@ class AuroFloatingUI {
|
|
|
2510
2516
|
this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
|
|
2511
2517
|
}
|
|
2512
2518
|
|
|
2513
|
-
configure(elem, eventPrefix) {
|
|
2519
|
+
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
2514
2520
|
AuroFloatingUI.setupMousePressChecker();
|
|
2521
|
+
this.enableKeyboardHandling = enableKeyboardHandling;
|
|
2515
2522
|
|
|
2516
2523
|
this.eventPrefix = eventPrefix;
|
|
2517
2524
|
if (this.element !== elem) {
|
|
@@ -2544,7 +2551,9 @@ class AuroFloatingUI {
|
|
|
2544
2551
|
|
|
2545
2552
|
this.handleEvent = this.handleEvent.bind(this);
|
|
2546
2553
|
if (this.element.trigger) {
|
|
2547
|
-
|
|
2554
|
+
if (this.enableKeyboardHandling) {
|
|
2555
|
+
this.element.trigger.addEventListener("keydown", this.handleEvent);
|
|
2556
|
+
}
|
|
2548
2557
|
this.element.trigger.addEventListener("click", this.handleEvent);
|
|
2549
2558
|
this.element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
2550
2559
|
this.element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
@@ -3001,13 +3010,13 @@ class AuroDependencyVersioning {
|
|
|
3001
3010
|
* Copyright 2019 Google LLC
|
|
3002
3011
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
3003
3012
|
*/
|
|
3004
|
-
const t=globalThis,e$
|
|
3013
|
+
const t=globalThis,e$2=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$1=Symbol(),o$3=new WeakMap;let n$1 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$1)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$2&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$3.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$3.set(s,t));}return t}toString(){return this.cssText}};const r$1=t=>new n$1("string"==typeof t?t:t+"",void 0,s$1),i$2=(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$1(o,t,s$1)},S=(s,o)=>{if(e$2)s.adoptedStyleSheets=o.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const e of o){const o=document.createElement("style"),n=t.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$1=e$2?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$1(e)})(t):t;
|
|
3005
3014
|
|
|
3006
3015
|
/**
|
|
3007
3016
|
* @license
|
|
3008
3017
|
* Copyright 2017 Google LLC
|
|
3009
3018
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
3010
|
-
*/const{is:i$1,defineProperty:e,getOwnPropertyDescriptor:h,getOwnPropertyNames:r,getOwnPropertySymbols:o$2,getPrototypeOf:n}=Object,a=globalThis,c=a.trustedTypes,l=c?c.emptyScript:"",p$1=a.reactiveElementPolyfillSupport,d=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l: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$1=(t,s)=>!i$1(t,s),b={attribute:true,type:String,converter:u$1,reflect:false,useDefault:false,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a.litPropertyMetadata??=new WeakMap;let y$1 = 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){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(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h(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}static _$Ei(){if(this.hasOwnProperty(d("elementProperties")))return;const t=n(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d("properties"))){const t=this.properties,s=[...r(t),...o$2(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$1(s));}else void 0!==s&&i.push(c$1(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(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$1).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$1;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$1)(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$1.elementStyles=[],y$1.shadowRootOptions={mode:"open"},y$1[d("elementProperties")]=new Map,y$1[d("finalized")]=new Map,p$1?.({ReactiveElement:y$1}),(a.reactiveElementVersions??=[]).push("2.1.2");
|
|
3019
|
+
*/const{is:i$1,defineProperty:e$1,getOwnPropertyDescriptor:h,getOwnPropertyNames:r,getOwnPropertySymbols:o$2,getPrototypeOf:n}=Object,a=globalThis,c=a.trustedTypes,l=c?c.emptyScript:"",p$1=a.reactiveElementPolyfillSupport,d=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l: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$1=(t,s)=>!i$1(t,s),b={attribute:true,type:String,converter:u$1,reflect:false,useDefault:false,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a.litPropertyMetadata??=new WeakMap;let y$1 = 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){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$1(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h(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}static _$Ei(){if(this.hasOwnProperty(d("elementProperties")))return;const t=n(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d("properties"))){const t=this.properties,s=[...r(t),...o$2(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$1(s));}else void 0!==s&&i.push(c$1(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(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$1).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$1;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$1)(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$1.elementStyles=[],y$1.shadowRootOptions={mode:"open"},y$1[d("elementProperties")]=new Map,y$1[d("finalized")]=new Map,p$1?.({ReactiveElement:y$1}),(a.reactiveElementVersions??=[]).push("2.1.2");
|
|
3011
3020
|
|
|
3012
3021
|
/**
|
|
3013
3022
|
* @license
|
|
@@ -3028,7 +3037,7 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
3028
3037
|
`;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`
|
|
3029
3038
|
<div class="componentWrapper">
|
|
3030
3039
|
<div
|
|
3031
|
-
class="${e$
|
|
3040
|
+
class="${e$4({svgWrapper:true})}"
|
|
3032
3041
|
title="${o(this.title||void 0)}">
|
|
3033
3042
|
<span aria-hidden="${o(this.ariaHidden||true)}" part="svg">
|
|
3034
3043
|
${this.customSvg?b$1`
|
|
@@ -3039,7 +3048,7 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
3039
3048
|
</span>
|
|
3040
3049
|
</div>
|
|
3041
3050
|
|
|
3042
|
-
<div class="${e$
|
|
3051
|
+
<div class="${e$4(t)}" part="label">
|
|
3043
3052
|
<slot></slot>
|
|
3044
3053
|
</div>
|
|
3045
3054
|
</div>
|
|
@@ -3047,12 +3056,89 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
3047
3056
|
|
|
3048
3057
|
var iconVersion = '9.1.2';
|
|
3049
3058
|
|
|
3059
|
+
/**
|
|
3060
|
+
* @license
|
|
3061
|
+
* Copyright 2017 Google LLC
|
|
3062
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
3063
|
+
*/class e extends i$3{constructor(i){if(super(i),this.it=A,i.type!==t$1.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(r){if(r===A||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.directiveName="unsafeHTML",e.resultType=1;
|
|
3064
|
+
|
|
3065
|
+
/**
|
|
3066
|
+
* Computes display state once per keydown event.
|
|
3067
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
3068
|
+
*
|
|
3069
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
3070
|
+
* @param {Object} [options] - Optional config.
|
|
3071
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
3072
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
3073
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
3074
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
3075
|
+
*/
|
|
3076
|
+
function createDisplayContext(component, options = {}) {
|
|
3077
|
+
const dd = options.dropdown || component.dropdown;
|
|
3078
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
3079
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
3080
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
3081
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
3082
|
+
|
|
3083
|
+
const ctx = {
|
|
3084
|
+
isExpanded,
|
|
3085
|
+
isModal: isFullscreen,
|
|
3086
|
+
isPopover: !isFullscreen,
|
|
3087
|
+
activeInput: null,
|
|
3088
|
+
};
|
|
3089
|
+
|
|
3090
|
+
if (options.inputResolver) {
|
|
3091
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
3092
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
3093
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
3094
|
+
}
|
|
3095
|
+
|
|
3096
|
+
return ctx;
|
|
3097
|
+
}
|
|
3098
|
+
|
|
3099
|
+
/**
|
|
3100
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
3101
|
+
* Handles both sync and async handlers.
|
|
3102
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
3103
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
3104
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
3105
|
+
*/
|
|
3106
|
+
function applyKeyboardStrategy(component, strategy, options = {}) {
|
|
3107
|
+
component.addEventListener('keydown', async (evt) => {
|
|
3108
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
3109
|
+
if (typeof handler === 'function') {
|
|
3110
|
+
const ctx = createDisplayContext(component, options);
|
|
3111
|
+
await handler(component, evt, ctx);
|
|
3112
|
+
}
|
|
3113
|
+
});
|
|
3114
|
+
}
|
|
3115
|
+
|
|
3050
3116
|
var styleCss$2 = i$2`: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(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}: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}`;
|
|
3051
3117
|
|
|
3052
3118
|
var colorCss$2 = i$2`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
3053
3119
|
|
|
3054
3120
|
var tokensCss$1 = i$2`:host(:not([ondark])),:host(:not([appearance=inverse])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-hover-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
3055
3121
|
|
|
3122
|
+
/**
|
|
3123
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
3124
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
3125
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
3126
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
3127
|
+
*/
|
|
3128
|
+
// eslint-disable-next-line no-unused-vars
|
|
3129
|
+
function createDropdownBibKeyboardStrategy(bib) {
|
|
3130
|
+
return {
|
|
3131
|
+
// eslint-disable-next-line no-unused-vars
|
|
3132
|
+
Enter(_dialog, event) {
|
|
3133
|
+
// Floating UI handles Enter key to open the dropdown
|
|
3134
|
+
},
|
|
3135
|
+
// eslint-disable-next-line no-unused-vars
|
|
3136
|
+
Escape(_dialog, event) {
|
|
3137
|
+
// Floating UI handles Escape key to close the dropdown
|
|
3138
|
+
}
|
|
3139
|
+
};
|
|
3140
|
+
}
|
|
3141
|
+
|
|
3056
3142
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
3057
3143
|
// See LICENSE in the project root for license information.
|
|
3058
3144
|
/* eslint-disable max-lines */
|
|
@@ -3177,11 +3263,7 @@ class AuroDropdownBib extends i {
|
|
|
3177
3263
|
},
|
|
3178
3264
|
|
|
3179
3265
|
/**
|
|
3180
|
-
*
|
|
3181
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
3182
|
-
* flag so that Enter selects the highlighted option instead of
|
|
3183
|
-
* activating the focused interactive element (e.g. the trigger
|
|
3184
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
3266
|
+
* Tracks whether a menu option is currently highlighted.
|
|
3185
3267
|
* @private
|
|
3186
3268
|
*/
|
|
3187
3269
|
hasActiveDescendant: {
|
|
@@ -3255,7 +3337,7 @@ class AuroDropdownBib extends i {
|
|
|
3255
3337
|
|
|
3256
3338
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
3257
3339
|
this._setupCancelHandler(dialog);
|
|
3258
|
-
|
|
3340
|
+
applyKeyboardStrategy(dialog, createDropdownBibKeyboardStrategy());
|
|
3259
3341
|
|
|
3260
3342
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
3261
3343
|
bubbles: true,
|
|
@@ -3282,92 +3364,6 @@ class AuroDropdownBib extends i {
|
|
|
3282
3364
|
});
|
|
3283
3365
|
}
|
|
3284
3366
|
|
|
3285
|
-
/**
|
|
3286
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
3287
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
3288
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
3289
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
3290
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
3291
|
-
* component.
|
|
3292
|
-
*
|
|
3293
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
3294
|
-
* behaviors that would normally "just work" must be manually
|
|
3295
|
-
* re-implemented here:
|
|
3296
|
-
*
|
|
3297
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
3298
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
3299
|
-
* directly when Enter is pressed on a button-like element.
|
|
3300
|
-
*
|
|
3301
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
3302
|
-
* (select/combobox) can select the active option and close the
|
|
3303
|
-
* dialog. The <dialog> provides containment and isolation
|
|
3304
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
3305
|
-
* the content inside is a role="listbox" navigated via
|
|
3306
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
3307
|
-
* behavior follows listbox conventions (select + close) because
|
|
3308
|
-
* the dialog's native Tab trap only cycles between the close
|
|
3309
|
-
* button and browser chrome.
|
|
3310
|
-
*
|
|
3311
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
3312
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
3313
|
-
* is a secondary path for parent components that also listen for
|
|
3314
|
-
* Escape keydown.
|
|
3315
|
-
*
|
|
3316
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
3317
|
-
* @private
|
|
3318
|
-
*/
|
|
3319
|
-
_setupKeyboardBridge(dialog) {
|
|
3320
|
-
const navKeys = new Set([
|
|
3321
|
-
'ArrowUp',
|
|
3322
|
-
'ArrowDown',
|
|
3323
|
-
'Enter',
|
|
3324
|
-
'Escape',
|
|
3325
|
-
'Tab'
|
|
3326
|
-
]);
|
|
3327
|
-
|
|
3328
|
-
dialog.addEventListener('keydown', (event) => {
|
|
3329
|
-
if (!navKeys.has(event.key)) {
|
|
3330
|
-
return;
|
|
3331
|
-
}
|
|
3332
|
-
|
|
3333
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
3334
|
-
// behavior that <button> has. Find the button in the composed path
|
|
3335
|
-
// and click it directly — but only when no menu option is
|
|
3336
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
3337
|
-
// while arrow keys move the active-descendant highlight through
|
|
3338
|
-
// the listbox. If the user presses Enter with an option
|
|
3339
|
-
// highlighted, the intent is to select that option, not to click
|
|
3340
|
-
// the close button. In that case we fall through and bridge the
|
|
3341
|
-
// Enter key to the parent component's keyboard strategy.
|
|
3342
|
-
if (event.key === 'Enter') {
|
|
3343
|
-
if (!this.hasActiveDescendant) {
|
|
3344
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
3345
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
3346
|
-
if (btn) {
|
|
3347
|
-
event.preventDefault();
|
|
3348
|
-
event.stopPropagation();
|
|
3349
|
-
btn.click();
|
|
3350
|
-
return;
|
|
3351
|
-
}
|
|
3352
|
-
}
|
|
3353
|
-
}
|
|
3354
|
-
|
|
3355
|
-
event.preventDefault();
|
|
3356
|
-
event.stopPropagation();
|
|
3357
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
3358
|
-
key: event.key,
|
|
3359
|
-
code: event.code,
|
|
3360
|
-
shiftKey: event.shiftKey,
|
|
3361
|
-
altKey: event.altKey,
|
|
3362
|
-
ctrlKey: event.ctrlKey,
|
|
3363
|
-
metaKey: event.metaKey,
|
|
3364
|
-
bubbles: true,
|
|
3365
|
-
composed: true,
|
|
3366
|
-
cancelable: true
|
|
3367
|
-
});
|
|
3368
|
-
this.dispatchEvent(newEvent);
|
|
3369
|
-
});
|
|
3370
|
-
}
|
|
3371
3367
|
|
|
3372
3368
|
/**
|
|
3373
3369
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -3492,7 +3488,7 @@ class AuroDropdownBib extends i {
|
|
|
3492
3488
|
classes[`shape-${this.shape}`] = true;
|
|
3493
3489
|
|
|
3494
3490
|
return u$2`
|
|
3495
|
-
<dialog class="${e$
|
|
3491
|
+
<dialog class="${e$4(classes)}" part="bibContainer" role="${o(this.dialogRole)}" aria-labelledby="${o(this.dialogLabel ? 'dialogLabel' : undefined)}">
|
|
3496
3492
|
${this.dialogLabel ? u$2`<span id="dialogLabel" class="util_displayHiddenVisually">${this.dialogLabel}</span>` : ''}
|
|
3497
3493
|
<slot></slot>
|
|
3498
3494
|
</dialog>
|
|
@@ -3742,7 +3738,7 @@ class AuroHelpText extends i {
|
|
|
3742
3738
|
}
|
|
3743
3739
|
}
|
|
3744
3740
|
|
|
3745
|
-
var formkitVersion = '
|
|
3741
|
+
var formkitVersion = '202604022013';
|
|
3746
3742
|
|
|
3747
3743
|
class AuroElement extends i {
|
|
3748
3744
|
static get properties() {
|
|
@@ -3896,7 +3892,7 @@ class AuroDropdown extends AuroElement {
|
|
|
3896
3892
|
this.handleDropdownToggle = this.handleDropdownToggle.bind(this);
|
|
3897
3893
|
|
|
3898
3894
|
/** @private */
|
|
3899
|
-
this.bibElement = e$
|
|
3895
|
+
this.bibElement = e$3();
|
|
3900
3896
|
|
|
3901
3897
|
this._intializeDefaults();
|
|
3902
3898
|
}
|
|
@@ -3923,7 +3919,7 @@ class AuroDropdown extends AuroElement {
|
|
|
3923
3919
|
this.appearance = 'default';
|
|
3924
3920
|
this.chevron = false;
|
|
3925
3921
|
this.disabled = false;
|
|
3926
|
-
this.
|
|
3922
|
+
this.disableKeyboardHandling = false;
|
|
3927
3923
|
this.error = false;
|
|
3928
3924
|
this.tabIndex = 0;
|
|
3929
3925
|
this.noToggle = false;
|
|
@@ -4021,9 +4017,8 @@ class AuroDropdown extends AuroElement {
|
|
|
4021
4017
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
4022
4018
|
// falls outside the user activation window and causes iOS to
|
|
4023
4019
|
// dismiss the keyboard.
|
|
4024
|
-
if (this.
|
|
4025
|
-
|
|
4026
|
-
this.bibElement.value.open(useModal);
|
|
4020
|
+
if (this.bibElement && this.bibElement.value) {
|
|
4021
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
4027
4022
|
}
|
|
4028
4023
|
}
|
|
4029
4024
|
|
|
@@ -4137,9 +4132,9 @@ class AuroDropdown extends AuroElement {
|
|
|
4137
4132
|
},
|
|
4138
4133
|
|
|
4139
4134
|
/**
|
|
4140
|
-
* If declared, the
|
|
4135
|
+
* If declared, the dropdown will not handle keyboard events and will require the consumer to manage this behavior.
|
|
4141
4136
|
*/
|
|
4142
|
-
|
|
4137
|
+
disableKeyboardHandling: {
|
|
4143
4138
|
type: Boolean,
|
|
4144
4139
|
reflect: true
|
|
4145
4140
|
},
|
|
@@ -4417,7 +4412,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4417
4412
|
if (this.isPopoverVisible) {
|
|
4418
4413
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
4419
4414
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
4420
|
-
const useModal = this.isBibFullscreen
|
|
4415
|
+
const useModal = this.isBibFullscreen;
|
|
4421
4416
|
this.bibElement.value.open(useModal);
|
|
4422
4417
|
} else {
|
|
4423
4418
|
this.bibElement.value.close();
|
|
@@ -4427,7 +4422,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4427
4422
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
4428
4423
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
4429
4424
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
4430
|
-
const useModal = this.isBibFullscreen
|
|
4425
|
+
const useModal = this.isBibFullscreen;
|
|
4431
4426
|
this.bibElement.value.close();
|
|
4432
4427
|
this.bibElement.value.open(useModal);
|
|
4433
4428
|
}
|
|
@@ -4449,7 +4444,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4449
4444
|
|
|
4450
4445
|
firstUpdated() {
|
|
4451
4446
|
// Configure the floater to, this will generate the ID for the bib
|
|
4452
|
-
this.floater.configure(this, 'auroDropdown');
|
|
4447
|
+
this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
|
|
4453
4448
|
|
|
4454
4449
|
// Prevent `contain: layout` on the dropdown host. Layout containment
|
|
4455
4450
|
// creates a containing block for position:fixed descendants (the bib),
|
|
@@ -4539,7 +4534,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4539
4534
|
* @private
|
|
4540
4535
|
*/
|
|
4541
4536
|
updateFocusTrap() {
|
|
4542
|
-
if (this.isPopoverVisible
|
|
4537
|
+
if (this.isPopoverVisible) {
|
|
4543
4538
|
if (!this.isBibFullscreen) {
|
|
4544
4539
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
4545
4540
|
this.focusTrap = new FocusTrap(this.bibContent);
|
|
@@ -4751,12 +4746,13 @@ class AuroDropdown extends AuroElement {
|
|
|
4751
4746
|
<div>
|
|
4752
4747
|
<div
|
|
4753
4748
|
id="trigger"
|
|
4754
|
-
class="${e$
|
|
4749
|
+
class="${e$4(this.commonWrapperClasses)}" part="wrapper"
|
|
4755
4750
|
tabindex="${o(this.triggerContentFocusable ? undefined : this.tabIndex)}"
|
|
4756
4751
|
role="${o(this.triggerContentFocusable ? undefined : this.a11yRole)}"
|
|
4757
4752
|
aria-expanded="${o(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
|
|
4758
4753
|
aria-controls="${o(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.dropdownId)}"
|
|
4759
4754
|
aria-labelledby="${o(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
|
|
4755
|
+
aria-disabled="${o(this.disabled ? 'true' : undefined)}"
|
|
4760
4756
|
@focusin="${this.handleFocusin}"
|
|
4761
4757
|
@blur="${this.handleFocusOut}">
|
|
4762
4758
|
<div class="triggerContentWrapper" id="triggerLabel">
|
|
@@ -4780,7 +4776,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4780
4776
|
</div>
|
|
4781
4777
|
` : undefined }
|
|
4782
4778
|
</div>
|
|
4783
|
-
<div class="${e$
|
|
4779
|
+
<div class="${e$4(helpTextClasses)}">
|
|
4784
4780
|
<slot name="helpText"></slot>
|
|
4785
4781
|
</div>
|
|
4786
4782
|
<div id="bibSizer" part="size"></div>
|