@aurodesignsystem-dev/auro-formkit 0.0.0-pr1408.8 → 0.0.0-pr1411.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/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 +121 -144
- package/components/combobox/demo/index.min.js +121 -144
- package/components/combobox/demo/keyboardBehavior.html +1 -0
- package/components/combobox/demo/keyboardBehavior.md +21 -22
- package/components/combobox/dist/index.js +87 -117
- package/components/combobox/dist/registered.js +87 -117
- package/components/counter/demo/api.md +1 -1
- package/components/counter/demo/api.min.js +184 -148
- package/components/counter/demo/index.min.js +184 -148
- package/components/counter/demo/keyboardBehavior.html +1 -0
- package/components/counter/demo/keyboardBehavior.md +1 -1
- package/components/counter/dist/auro-counter.d.ts +11 -8
- package/components/counter/dist/index.js +184 -148
- package/components/counter/dist/keyboardStrategy.d.ts +4 -0
- package/components/counter/dist/registered.js +184 -148
- package/components/datepicker/demo/api.min.js +89 -120
- package/components/datepicker/demo/index.min.js +89 -120
- package/components/datepicker/demo/keyboardBehavior.html +1 -0
- package/components/datepicker/demo/keyboardBehavior.md +14 -13
- package/components/datepicker/dist/index.js +84 -115
- package/components/datepicker/dist/registered.js +84 -115
- package/components/dropdown/demo/api.md +0 -1
- package/components/dropdown/demo/api.min.js +99 -123
- package/components/dropdown/demo/index.md +2 -2
- package/components/dropdown/demo/index.min.js +99 -123
- package/components/dropdown/demo/keyboardBehavior.html +1 -0
- package/components/dropdown/dist/auro-dropdown.d.ts +0 -8
- 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 +83 -111
- package/components/dropdown/dist/registered.js +83 -111
- package/components/form/demo/api.min.js +542 -564
- package/components/form/demo/index.min.js +542 -564
- 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 +181 -178
- package/components/select/demo/index.min.js +181 -178
- package/components/select/demo/keyboardBehavior.html +1 -0
- package/components/select/demo/keyboardBehavior.md +240 -239
- package/components/select/dist/index.js +147 -151
- package/components/select/dist/registered.js +147 -151
- package/components/select/dist/selectKeyboardStrategy.d.ts +3 -1
- package/custom-elements.json +1521 -1503
- package/package.json +5 -3
|
@@ -30,7 +30,7 @@ function customExample() {
|
|
|
30
30
|
* Copyright 2017 Google LLC
|
|
31
31
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
32
32
|
*/
|
|
33
|
-
const t$2=globalThis,i$5=t=>t,s$4=t$2.trustedTypes,e$
|
|
33
|
+
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};
|
|
34
34
|
|
|
35
35
|
/**
|
|
36
36
|
* @license
|
|
@@ -44,13 +44,13 @@ const a$1=Symbol.for(""),o$6=t=>{if(t?.r===a$1)return t?._$litStatic$},s$3=t=>({
|
|
|
44
44
|
* Copyright 2017 Google LLC
|
|
45
45
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
46
46
|
*/
|
|
47
|
-
const t$1={ATTRIBUTE:1,CHILD:2},e$
|
|
47
|
+
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)}};
|
|
48
48
|
|
|
49
49
|
/**
|
|
50
50
|
* @license
|
|
51
51
|
* Copyright 2018 Google LLC
|
|
52
52
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
53
|
-
*/const e$
|
|
53
|
+
*/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}});
|
|
54
54
|
|
|
55
55
|
/**
|
|
56
56
|
* @license
|
|
@@ -68,7 +68,7 @@ const t$1={ATTRIBUTE:1,CHILD:2},e$4=t=>(...e)=>({_$litDirective$:t,values:e});le
|
|
|
68
68
|
* @license
|
|
69
69
|
* Copyright 2020 Google LLC
|
|
70
70
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
71
|
-
*/const e$
|
|
71
|
+
*/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);}});
|
|
72
72
|
|
|
73
73
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
74
74
|
// See LICENSE in the project root for license information.
|
|
@@ -2119,11 +2119,10 @@ class AuroFloatingUI {
|
|
|
2119
2119
|
return;
|
|
2120
2120
|
}
|
|
2121
2121
|
|
|
2122
|
-
const { activeElement } = document;
|
|
2123
2122
|
// if focus is still inside of trigger or bib, do not close
|
|
2124
2123
|
if (
|
|
2125
|
-
this.element.
|
|
2126
|
-
this.element.
|
|
2124
|
+
this.element.matches(":focus") ||
|
|
2125
|
+
this.element.matches(":focus-within")
|
|
2127
2126
|
) {
|
|
2128
2127
|
return;
|
|
2129
2128
|
}
|
|
@@ -2941,13 +2940,13 @@ class AuroDependencyVersioning {
|
|
|
2941
2940
|
* Copyright 2019 Google LLC
|
|
2942
2941
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
2943
2942
|
*/
|
|
2944
|
-
const t=globalThis,e$
|
|
2943
|
+
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;
|
|
2945
2944
|
|
|
2946
2945
|
/**
|
|
2947
2946
|
* @license
|
|
2948
2947
|
* Copyright 2017 Google LLC
|
|
2949
2948
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
2950
|
-
*/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");
|
|
2949
|
+
*/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");
|
|
2951
2950
|
|
|
2952
2951
|
/**
|
|
2953
2952
|
* @license
|
|
@@ -2968,7 +2967,7 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
2968
2967
|
`;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`
|
|
2969
2968
|
<div class="componentWrapper">
|
|
2970
2969
|
<div
|
|
2971
|
-
class="${e$
|
|
2970
|
+
class="${e$4({svgWrapper:true})}"
|
|
2972
2971
|
title="${o(this.title||void 0)}">
|
|
2973
2972
|
<span aria-hidden="${o(this.ariaHidden||true)}" part="svg">
|
|
2974
2973
|
${this.customSvg?b$1`
|
|
@@ -2979,7 +2978,7 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
2979
2978
|
</span>
|
|
2980
2979
|
</div>
|
|
2981
2980
|
|
|
2982
|
-
<div class="${e$
|
|
2981
|
+
<div class="${e$4(t)}" part="label">
|
|
2983
2982
|
<slot></slot>
|
|
2984
2983
|
</div>
|
|
2985
2984
|
</div>
|
|
@@ -2987,12 +2986,89 @@ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,cl
|
|
|
2987
2986
|
|
|
2988
2987
|
var iconVersion = '9.1.2';
|
|
2989
2988
|
|
|
2989
|
+
/**
|
|
2990
|
+
* @license
|
|
2991
|
+
* Copyright 2017 Google LLC
|
|
2992
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
2993
|
+
*/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;
|
|
2994
|
+
|
|
2995
|
+
/**
|
|
2996
|
+
* Computes display state once per keydown event.
|
|
2997
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
2998
|
+
*
|
|
2999
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
3000
|
+
* @param {Object} [options] - Optional config.
|
|
3001
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
3002
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
3003
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
3004
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
3005
|
+
*/
|
|
3006
|
+
function createDisplayContext(component, options = {}) {
|
|
3007
|
+
const dd = options.dropdown || component.dropdown;
|
|
3008
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
3009
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
3010
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
3011
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
3012
|
+
|
|
3013
|
+
const ctx = {
|
|
3014
|
+
isExpanded,
|
|
3015
|
+
isModal: isFullscreen,
|
|
3016
|
+
isPopover: !isFullscreen,
|
|
3017
|
+
activeInput: null,
|
|
3018
|
+
};
|
|
3019
|
+
|
|
3020
|
+
if (options.inputResolver) {
|
|
3021
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
3022
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
3023
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
3024
|
+
}
|
|
3025
|
+
|
|
3026
|
+
return ctx;
|
|
3027
|
+
}
|
|
3028
|
+
|
|
3029
|
+
/**
|
|
3030
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
3031
|
+
* Handles both sync and async handlers.
|
|
3032
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
3033
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
3034
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
3035
|
+
*/
|
|
3036
|
+
function applyKeyboardStrategy(component, strategy, options = {}) {
|
|
3037
|
+
component.addEventListener('keydown', async (evt) => {
|
|
3038
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
3039
|
+
if (typeof handler === 'function') {
|
|
3040
|
+
const ctx = createDisplayContext(component, options);
|
|
3041
|
+
await handler(component, evt, ctx);
|
|
3042
|
+
}
|
|
3043
|
+
});
|
|
3044
|
+
}
|
|
3045
|
+
|
|
2990
3046
|
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}`;
|
|
2991
3047
|
|
|
2992
3048
|
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)}`;
|
|
2993
3049
|
|
|
2994
3050
|
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)}`;
|
|
2995
3051
|
|
|
3052
|
+
/**
|
|
3053
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
3054
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
3055
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
3056
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
3057
|
+
*/
|
|
3058
|
+
// eslint-disable-next-line no-unused-vars
|
|
3059
|
+
function createDropdownBibKeyboardStrategy(bib) {
|
|
3060
|
+
return {
|
|
3061
|
+
// eslint-disable-next-line no-unused-vars
|
|
3062
|
+
Enter(_dialog, event) {
|
|
3063
|
+
// Floating UI handles Enter key to open the dropdown
|
|
3064
|
+
},
|
|
3065
|
+
// eslint-disable-next-line no-unused-vars
|
|
3066
|
+
Escape(_dialog, event) {
|
|
3067
|
+
// Floating UI handles Escape key to close the dropdown
|
|
3068
|
+
}
|
|
3069
|
+
};
|
|
3070
|
+
}
|
|
3071
|
+
|
|
2996
3072
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2997
3073
|
// See LICENSE in the project root for license information.
|
|
2998
3074
|
/* eslint-disable max-lines */
|
|
@@ -3117,11 +3193,7 @@ class AuroDropdownBib extends i {
|
|
|
3117
3193
|
},
|
|
3118
3194
|
|
|
3119
3195
|
/**
|
|
3120
|
-
*
|
|
3121
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
3122
|
-
* flag so that Enter selects the highlighted option instead of
|
|
3123
|
-
* activating the focused interactive element (e.g. the trigger
|
|
3124
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
3196
|
+
* Tracks whether a menu option is currently highlighted.
|
|
3125
3197
|
* @private
|
|
3126
3198
|
*/
|
|
3127
3199
|
hasActiveDescendant: {
|
|
@@ -3195,7 +3267,7 @@ class AuroDropdownBib extends i {
|
|
|
3195
3267
|
|
|
3196
3268
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
3197
3269
|
this._setupCancelHandler(dialog);
|
|
3198
|
-
|
|
3270
|
+
applyKeyboardStrategy(dialog, createDropdownBibKeyboardStrategy());
|
|
3199
3271
|
|
|
3200
3272
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
3201
3273
|
bubbles: true,
|
|
@@ -3222,92 +3294,6 @@ class AuroDropdownBib extends i {
|
|
|
3222
3294
|
});
|
|
3223
3295
|
}
|
|
3224
3296
|
|
|
3225
|
-
/**
|
|
3226
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
3227
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
3228
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
3229
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
3230
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
3231
|
-
* component.
|
|
3232
|
-
*
|
|
3233
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
3234
|
-
* behaviors that would normally "just work" must be manually
|
|
3235
|
-
* re-implemented here:
|
|
3236
|
-
*
|
|
3237
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
3238
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
3239
|
-
* directly when Enter is pressed on a button-like element.
|
|
3240
|
-
*
|
|
3241
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
3242
|
-
* (select/combobox) can select the active option and close the
|
|
3243
|
-
* dialog. The <dialog> provides containment and isolation
|
|
3244
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
3245
|
-
* the content inside is a role="listbox" navigated via
|
|
3246
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
3247
|
-
* behavior follows listbox conventions (select + close) because
|
|
3248
|
-
* the dialog's native Tab trap only cycles between the close
|
|
3249
|
-
* button and browser chrome.
|
|
3250
|
-
*
|
|
3251
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
3252
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
3253
|
-
* is a secondary path for parent components that also listen for
|
|
3254
|
-
* Escape keydown.
|
|
3255
|
-
*
|
|
3256
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
3257
|
-
* @private
|
|
3258
|
-
*/
|
|
3259
|
-
_setupKeyboardBridge(dialog) {
|
|
3260
|
-
const navKeys = new Set([
|
|
3261
|
-
'ArrowUp',
|
|
3262
|
-
'ArrowDown',
|
|
3263
|
-
'Enter',
|
|
3264
|
-
'Escape',
|
|
3265
|
-
'Tab'
|
|
3266
|
-
]);
|
|
3267
|
-
|
|
3268
|
-
dialog.addEventListener('keydown', (event) => {
|
|
3269
|
-
if (!navKeys.has(event.key)) {
|
|
3270
|
-
return;
|
|
3271
|
-
}
|
|
3272
|
-
|
|
3273
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
3274
|
-
// behavior that <button> has. Find the button in the composed path
|
|
3275
|
-
// and click it directly — but only when no menu option is
|
|
3276
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
3277
|
-
// while arrow keys move the active-descendant highlight through
|
|
3278
|
-
// the listbox. If the user presses Enter with an option
|
|
3279
|
-
// highlighted, the intent is to select that option, not to click
|
|
3280
|
-
// the close button. In that case we fall through and bridge the
|
|
3281
|
-
// Enter key to the parent component's keyboard strategy.
|
|
3282
|
-
if (event.key === 'Enter') {
|
|
3283
|
-
if (!this.hasActiveDescendant) {
|
|
3284
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
3285
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
3286
|
-
if (btn) {
|
|
3287
|
-
event.preventDefault();
|
|
3288
|
-
event.stopPropagation();
|
|
3289
|
-
btn.click();
|
|
3290
|
-
return;
|
|
3291
|
-
}
|
|
3292
|
-
}
|
|
3293
|
-
}
|
|
3294
|
-
|
|
3295
|
-
event.preventDefault();
|
|
3296
|
-
event.stopPropagation();
|
|
3297
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
3298
|
-
key: event.key,
|
|
3299
|
-
code: event.code,
|
|
3300
|
-
shiftKey: event.shiftKey,
|
|
3301
|
-
altKey: event.altKey,
|
|
3302
|
-
ctrlKey: event.ctrlKey,
|
|
3303
|
-
metaKey: event.metaKey,
|
|
3304
|
-
bubbles: true,
|
|
3305
|
-
composed: true,
|
|
3306
|
-
cancelable: true
|
|
3307
|
-
});
|
|
3308
|
-
this.dispatchEvent(newEvent);
|
|
3309
|
-
});
|
|
3310
|
-
}
|
|
3311
3297
|
|
|
3312
3298
|
/**
|
|
3313
3299
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -3432,7 +3418,7 @@ class AuroDropdownBib extends i {
|
|
|
3432
3418
|
classes[`shape-${this.shape}`] = true;
|
|
3433
3419
|
|
|
3434
3420
|
return u$2`
|
|
3435
|
-
<dialog class="${e$
|
|
3421
|
+
<dialog class="${e$4(classes)}" part="bibContainer" role="${o(this.dialogRole)}" aria-labelledby="${o(this.dialogLabel ? 'dialogLabel' : undefined)}">
|
|
3436
3422
|
${this.dialogLabel ? u$2`<span id="dialogLabel" class="util_displayHiddenVisually">${this.dialogLabel}</span>` : ''}
|
|
3437
3423
|
<slot></slot>
|
|
3438
3424
|
</dialog>
|
|
@@ -3682,7 +3668,7 @@ class AuroHelpText extends i {
|
|
|
3682
3668
|
}
|
|
3683
3669
|
}
|
|
3684
3670
|
|
|
3685
|
-
var formkitVersion = '
|
|
3671
|
+
var formkitVersion = '202604021512';
|
|
3686
3672
|
|
|
3687
3673
|
class AuroElement extends i {
|
|
3688
3674
|
static get properties() {
|
|
@@ -3836,7 +3822,7 @@ class AuroDropdown extends AuroElement {
|
|
|
3836
3822
|
this.handleDropdownToggle = this.handleDropdownToggle.bind(this);
|
|
3837
3823
|
|
|
3838
3824
|
/** @private */
|
|
3839
|
-
this.bibElement = e$
|
|
3825
|
+
this.bibElement = e$3();
|
|
3840
3826
|
|
|
3841
3827
|
this._intializeDefaults();
|
|
3842
3828
|
}
|
|
@@ -3863,7 +3849,6 @@ class AuroDropdown extends AuroElement {
|
|
|
3863
3849
|
this.appearance = 'default';
|
|
3864
3850
|
this.chevron = false;
|
|
3865
3851
|
this.disabled = false;
|
|
3866
|
-
this.disableFocusTrap = false;
|
|
3867
3852
|
this.error = false;
|
|
3868
3853
|
this.tabIndex = 0;
|
|
3869
3854
|
this.noToggle = false;
|
|
@@ -3961,9 +3946,8 @@ class AuroDropdown extends AuroElement {
|
|
|
3961
3946
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
3962
3947
|
// falls outside the user activation window and causes iOS to
|
|
3963
3948
|
// dismiss the keyboard.
|
|
3964
|
-
if (this.
|
|
3965
|
-
|
|
3966
|
-
this.bibElement.value.open(useModal);
|
|
3949
|
+
if (this.bibElement && this.bibElement.value) {
|
|
3950
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
3967
3951
|
}
|
|
3968
3952
|
}
|
|
3969
3953
|
|
|
@@ -4076,14 +4060,6 @@ class AuroDropdown extends AuroElement {
|
|
|
4076
4060
|
reflect: true
|
|
4077
4061
|
},
|
|
4078
4062
|
|
|
4079
|
-
/**
|
|
4080
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
4081
|
-
*/
|
|
4082
|
-
disableFocusTrap: {
|
|
4083
|
-
type: Boolean,
|
|
4084
|
-
reflect: true
|
|
4085
|
-
},
|
|
4086
|
-
|
|
4087
4063
|
/**
|
|
4088
4064
|
* @private
|
|
4089
4065
|
*/
|
|
@@ -4357,7 +4333,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4357
4333
|
if (this.isPopoverVisible) {
|
|
4358
4334
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
4359
4335
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
4360
|
-
const useModal = this.isBibFullscreen
|
|
4336
|
+
const useModal = this.isBibFullscreen;
|
|
4361
4337
|
this.bibElement.value.open(useModal);
|
|
4362
4338
|
} else {
|
|
4363
4339
|
this.bibElement.value.close();
|
|
@@ -4367,7 +4343,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4367
4343
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
4368
4344
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
4369
4345
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
4370
|
-
const useModal = this.isBibFullscreen
|
|
4346
|
+
const useModal = this.isBibFullscreen;
|
|
4371
4347
|
this.bibElement.value.close();
|
|
4372
4348
|
this.bibElement.value.open(useModal);
|
|
4373
4349
|
}
|
|
@@ -4479,7 +4455,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4479
4455
|
* @private
|
|
4480
4456
|
*/
|
|
4481
4457
|
updateFocusTrap() {
|
|
4482
|
-
if (this.isPopoverVisible
|
|
4458
|
+
if (this.isPopoverVisible) {
|
|
4483
4459
|
if (!this.isBibFullscreen) {
|
|
4484
4460
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
4485
4461
|
this.focusTrap = new FocusTrap(this.bibContent);
|
|
@@ -4691,7 +4667,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4691
4667
|
<div>
|
|
4692
4668
|
<div
|
|
4693
4669
|
id="trigger"
|
|
4694
|
-
class="${e$
|
|
4670
|
+
class="${e$4(this.commonWrapperClasses)}" part="wrapper"
|
|
4695
4671
|
tabindex="${o(this.triggerContentFocusable ? undefined : this.tabIndex)}"
|
|
4696
4672
|
role="${o(this.triggerContentFocusable ? undefined : this.a11yRole)}"
|
|
4697
4673
|
aria-expanded="${o(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
|
|
@@ -4720,7 +4696,7 @@ class AuroDropdown extends AuroElement {
|
|
|
4720
4696
|
</div>
|
|
4721
4697
|
` : undefined }
|
|
4722
4698
|
</div>
|
|
4723
|
-
<div class="${e$
|
|
4699
|
+
<div class="${e$4(helpTextClasses)}">
|
|
4724
4700
|
<slot name="helpText"></slot>
|
|
4725
4701
|
</div>
|
|
4726
4702
|
<div id="bibSizer" part="size"></div>
|
|
@@ -76,5 +76,6 @@
|
|
|
76
76
|
|
|
77
77
|
<!-- If additional elements are needed for the demo, add them here. -->
|
|
78
78
|
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-header@latest/+esm" type="module"></script>
|
|
79
|
+
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-hyperlink@latest/+esm" type="module"></script>
|
|
79
80
|
</body>
|
|
80
81
|
</html>
|
|
@@ -73,13 +73,6 @@ export class AuroDropdown extends AuroElement {
|
|
|
73
73
|
type: BooleanConstructor;
|
|
74
74
|
reflect: boolean;
|
|
75
75
|
};
|
|
76
|
-
/**
|
|
77
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
78
|
-
*/
|
|
79
|
-
disableFocusTrap: {
|
|
80
|
-
type: BooleanConstructor;
|
|
81
|
-
reflect: boolean;
|
|
82
|
-
};
|
|
83
76
|
/**
|
|
84
77
|
* @private
|
|
85
78
|
*/
|
|
@@ -286,7 +279,6 @@ export class AuroDropdown extends AuroElement {
|
|
|
286
279
|
appearance: string;
|
|
287
280
|
chevron: boolean;
|
|
288
281
|
disabled: boolean;
|
|
289
|
-
disableFocusTrap: boolean;
|
|
290
282
|
error: boolean;
|
|
291
283
|
noToggle: boolean;
|
|
292
284
|
a11yRole: string;
|
|
@@ -72,11 +72,7 @@ export class AuroDropdownBib extends LitElement {
|
|
|
72
72
|
type: StringConstructor;
|
|
73
73
|
};
|
|
74
74
|
/**
|
|
75
|
-
*
|
|
76
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
77
|
-
* flag so that Enter selects the highlighted option instead of
|
|
78
|
-
* activating the focused interactive element (e.g. the trigger
|
|
79
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
75
|
+
* Tracks whether a menu option is currently highlighted.
|
|
80
76
|
* @private
|
|
81
77
|
*/
|
|
82
78
|
hasActiveDescendant: {
|
|
@@ -102,41 +98,6 @@ export class AuroDropdownBib extends LitElement {
|
|
|
102
98
|
* @private
|
|
103
99
|
*/
|
|
104
100
|
private _setupCancelHandler;
|
|
105
|
-
/**
|
|
106
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
107
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
108
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
109
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
110
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
111
|
-
* component.
|
|
112
|
-
*
|
|
113
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
114
|
-
* behaviors that would normally "just work" must be manually
|
|
115
|
-
* re-implemented here:
|
|
116
|
-
*
|
|
117
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
118
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
119
|
-
* directly when Enter is pressed on a button-like element.
|
|
120
|
-
*
|
|
121
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
122
|
-
* (select/combobox) can select the active option and close the
|
|
123
|
-
* dialog. The <dialog> provides containment and isolation
|
|
124
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
125
|
-
* the content inside is a role="listbox" navigated via
|
|
126
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
127
|
-
* behavior follows listbox conventions (select + close) because
|
|
128
|
-
* the dialog's native Tab trap only cycles between the close
|
|
129
|
-
* button and browser chrome.
|
|
130
|
-
*
|
|
131
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
132
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
133
|
-
* is a secondary path for parent components that also listen for
|
|
134
|
-
* Escape keydown.
|
|
135
|
-
*
|
|
136
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
137
|
-
* @private
|
|
138
|
-
*/
|
|
139
|
-
private _setupKeyboardBridge;
|
|
140
101
|
/**
|
|
141
102
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
142
103
|
*
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
3
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
4
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
5
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
6
|
+
*/
|
|
7
|
+
export function createDropdownBibKeyboardStrategy(bib: HTMLElement): any;
|