@aurodesignsystem/auro-dialog 4.2.0 → 4.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/CHANGELOG.md +3 -19
  2. package/README.md +8 -9
  3. package/demo/accessibility.html +42 -0
  4. package/demo/accessibility.js +21 -0
  5. package/demo/accessibility.md +129 -0
  6. package/demo/accessibility.min.js +3969 -0
  7. package/demo/api.html +16 -40
  8. package/demo/api.md +0 -750
  9. package/demo/customize.html +45 -0
  10. package/demo/{api.js → customize.js} +2 -14
  11. package/demo/customize.md +226 -0
  12. package/demo/customize.min.js +3974 -0
  13. package/demo/demo-nav.css +32 -0
  14. package/demo/design.html +42 -0
  15. package/demo/design.js +23 -0
  16. package/demo/design.md +306 -0
  17. package/demo/design.min.js +4041 -0
  18. package/demo/getting-started.html +38 -0
  19. package/demo/getting-started.md +295 -0
  20. package/demo/index.html +17 -36
  21. package/demo/index.js +2 -3
  22. package/demo/index.md +220 -144
  23. package/demo/index.min.js +3984 -7
  24. package/demo/keyboard-behavior.html +38 -0
  25. package/demo/keyboard-behavior.md +51 -0
  26. package/demo/pages.json +1 -0
  27. package/demo/readme.html +42 -0
  28. package/demo/readme.js +24 -0
  29. package/demo/readme.md +176 -0
  30. package/demo/{auro-dialog.min.js → readme.min.js} +434 -281
  31. package/demo/support/demo-support.js +140 -0
  32. package/demo/voiceover.html +38 -0
  33. package/demo/voiceover.md +19 -0
  34. package/demo/why-dialog.html +38 -0
  35. package/demo/why-dialog.md +36 -0
  36. package/dist/{auro-dialog-CWkXz5VA.js → auro-dialog-T9I85UZL.js} +20 -20
  37. package/dist/index.d.ts +198 -98
  38. package/dist/index.js +1 -1
  39. package/dist/registered.js +1 -1
  40. package/package.json +6 -6
  41. package/demo/api.min.js +0 -219
@@ -0,0 +1,4041 @@
1
+ function initSizeOptionsExample() {
2
+ const defaultButtons = [
3
+ document.querySelector("#openDefaultSize"),
4
+ document.querySelector("#closeDefaultSize"),
5
+ ];
6
+ const defaultDialog = document.querySelector("#defaultSizeDialog");
7
+
8
+ const mediumButtons = [
9
+ document.querySelector("#openMediumSize"),
10
+ document.querySelector("#closeMediumSize"),
11
+ ];
12
+ const mediumDialog = document.querySelector("#mediumSizeDialog");
13
+
14
+ const smallButtons = [
15
+ document.querySelector("#openSmallSize"),
16
+ document.querySelector("#closeSmallSize"),
17
+ ];
18
+ const smallDialog = document.querySelector("#smallSizeDialog");
19
+
20
+ defaultButtons.forEach((button) => {
21
+ button.addEventListener("click", () => {
22
+ if (defaultDialog.hasAttribute("open")) {
23
+ defaultDialog.removeAttribute("open");
24
+ } else {
25
+ defaultDialog.setAttribute("open", true);
26
+ }
27
+ });
28
+ });
29
+
30
+ mediumButtons.forEach((button) => {
31
+ button.addEventListener("click", () => {
32
+ if (mediumDialog.hasAttribute("open")) {
33
+ mediumDialog.removeAttribute("open");
34
+ } else {
35
+ mediumDialog.setAttribute("open", true);
36
+ }
37
+ });
38
+ });
39
+
40
+ smallButtons.forEach((button) => {
41
+ button.addEventListener("click", () => {
42
+ if (smallDialog.hasAttribute("open")) {
43
+ smallDialog.removeAttribute("open");
44
+ } else {
45
+ smallDialog.setAttribute("open", true);
46
+ }
47
+ });
48
+ });
49
+ }
50
+
51
+ function initDecoupledExample() {
52
+ const smLgButtons = [
53
+ document.querySelector("#openSmLg"),
54
+ document.querySelector("#closeSmLg"),
55
+ ];
56
+ const smLgDialog = document.querySelector("#smLgDialog");
57
+
58
+ const mdLgButtons = [
59
+ document.querySelector("#openMdLg"),
60
+ document.querySelector("#closeMdLg"),
61
+ ];
62
+ const mdLgDialog = document.querySelector("#mdLgDialog");
63
+
64
+ smLgButtons.forEach((button) => {
65
+ button.addEventListener("click", () => {
66
+ if (smLgDialog.hasAttribute("open")) {
67
+ smLgDialog.removeAttribute("open");
68
+ } else {
69
+ smLgDialog.setAttribute("open", true);
70
+ }
71
+ });
72
+ });
73
+
74
+ mdLgButtons.forEach((button) => {
75
+ button.addEventListener("click", () => {
76
+ if (mdLgDialog.hasAttribute("open")) {
77
+ mdLgDialog.removeAttribute("open");
78
+ } else {
79
+ mdLgDialog.setAttribute("open", true);
80
+ }
81
+ });
82
+ });
83
+ }
84
+
85
+ function initAccessibilityUnformattedHeaderExample() {
86
+ const button = document.querySelector("#openAccessibility");
87
+ const dialog = document.querySelector("#unformattedMdDialog");
88
+
89
+ button.addEventListener("click", () => {
90
+ if (dialog.hasAttribute("open")) {
91
+ dialog.removeAttribute("open");
92
+ } else {
93
+ dialog.setAttribute("open", true);
94
+ }
95
+ });
96
+ }
97
+
98
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
99
+ // See LICENSE in the project root for license information.
100
+
101
+ // ---------------------------------------------------------------------
102
+
103
+ /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
104
+
105
+ class AuroLibraryRuntimeUtils {
106
+
107
+ /* eslint-disable jsdoc/require-param */
108
+
109
+ /**
110
+ * This will register a new custom element with the browser.
111
+ * @param {String} name - The name of the custom element.
112
+ * @param {Object} componentClass - The class to register as a custom element.
113
+ * @returns {void}
114
+ */
115
+ registerComponent(name, componentClass) {
116
+ if (!customElements.get(name)) {
117
+ customElements.define(name, class extends componentClass {});
118
+ }
119
+ }
120
+
121
+ /**
122
+ * Finds and returns the closest HTML Element based on a selector.
123
+ * @returns {void}
124
+ */
125
+ closestElement(
126
+ selector, // selector like in .closest()
127
+ base = this, // extra functionality to skip a parent
128
+ __Closest = (el, found = el && el.closest(selector)) =>
129
+ !el || el === document || el === window
130
+ ? null // standard .closest() returns null for non-found selectors also
131
+ : found
132
+ ? found // found a selector INside this element
133
+ : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
134
+ ) {
135
+ return __Closest(base);
136
+ }
137
+ /* eslint-enable jsdoc/require-param */
138
+
139
+ /**
140
+ * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
141
+ * @param {Object} elem - The element to check.
142
+ * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
143
+ * @returns {void}
144
+ */
145
+ handleComponentTagRename(elem, tagName) {
146
+ const tag = tagName.toLowerCase();
147
+ const elemTag = elem.tagName.toLowerCase();
148
+
149
+ if (elemTag !== tag) {
150
+ elem.setAttribute(tag, true);
151
+ }
152
+ }
153
+
154
+ /**
155
+ * Validates if an element is a specific Auro component.
156
+ * @param {Object} elem - The element to validate.
157
+ * @param {String} tagName - The name of the Auro component to check against.
158
+ * @returns {Boolean} - Returns true if the element is the specified Auro component.
159
+ */
160
+ elementMatch(elem, tagName) {
161
+ const tag = tagName.toLowerCase();
162
+ const elemTag = elem.tagName.toLowerCase();
163
+
164
+ return elemTag === tag || elem.hasAttribute(tag);
165
+ }
166
+
167
+ /**
168
+ * Gets the text content of a named slot.
169
+ * @returns {String}
170
+ * @private
171
+ */
172
+ getSlotText(elem, name) {
173
+ const slot = elem.shadowRoot?.querySelector(`slot[name="${name}"]`);
174
+ const nodes = slot?.assignedNodes({ flatten: true }) || [];
175
+ const text = nodes.map(n => n.textContent?.trim()).join(' ').trim();
176
+
177
+ return text || null;
178
+ }
179
+ }
180
+
181
+ /**
182
+ * @license
183
+ * Copyright 2019 Google LLC
184
+ * SPDX-License-Identifier: BSD-3-Clause
185
+ */
186
+ const t$2=globalThis,e$4=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$3=Symbol(),o$5=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$3)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$4&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$5.set(s,t));}return t}toString(){return this.cssText}};const r$2=t=>new n$3("string"==typeof t?t:t+"",void 0,s$3),i$5=(t,...e)=>{const o=1===t.length?t[0]:e.reduce((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1],t[0]);return new n$3(o,t,s$3)},S$2=(s,o)=>{if(e$4)s.adoptedStyleSheets=o.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$3=e$4?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$2(e)})(t):t;
187
+
188
+ /**
189
+ * @license
190
+ * Copyright 2017 Google LLC
191
+ * SPDX-License-Identifier: BSD-3-Clause
192
+ */const{is:i$4,defineProperty:e$3,getOwnPropertyDescriptor:h$2,getOwnPropertyNames:r$1,getOwnPropertySymbols:o$4,getPrototypeOf:n$2}=Object,a$2=globalThis,c$2=a$2.trustedTypes,l$3=c$2?c$2.emptyScript:"",p$3=a$2.reactiveElementPolyfillSupport,d$2=(t,s)=>t,u$4={toAttribute(t,s){switch(s){case Boolean:t=t?l$3:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$3=(t,s)=>!i$4(t,s),b$2={attribute:true,type:String,converter:u$4,reflect:false,useDefault:false,hasChanged:f$3};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;let y$3 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b$2){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$3(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$2(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b$2}static _$Ei(){if(this.hasOwnProperty(d$2("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$2("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$2("properties"))){const t=this.properties,s=[...r$1(t),...o$4(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$3(s));}else void 0!==s&&i.push(c$3(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$2(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach(t=>t.hostConnected?.());}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach(t=>t.hostDisconnected?.());}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$4).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$4;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$3)(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$3.elementStyles=[],y$3.shadowRootOptions={mode:"open"},y$3[d$2("elementProperties")]=new Map,y$3[d$2("finalized")]=new Map,p$3?.({ReactiveElement:y$3}),(a$2.reactiveElementVersions??=[]).push("2.1.2");
193
+
194
+ /**
195
+ * @license
196
+ * Copyright 2017 Google LLC
197
+ * SPDX-License-Identifier: BSD-3-Clause
198
+ */
199
+ const t$1=globalThis,i$3=t=>t,s$2=t$1.trustedTypes,e$2=s$2?s$2.createPolicy("lit-html",{createHTML:t=>t}):void 0,h$1="$lit$",o$3=`lit$${Math.random().toFixed(9).slice(2)}$`,n$1="?"+o$3,r=`<${n$1}>`,l$2=document,c$1=()=>l$2.createComment(""),a$1=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$2="[ \t\n\f\r]",v$1=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,_$1=/-->/g,m$2=/>/g,p$2=RegExp(`>|${f$2}(?:([^\\s"'>=/]+)(${f$2}*=${f$2}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),g$2=/'/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$1=Symbol.for("lit-nothing"),C$1=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$2?e$2.createHTML(i):i}const N$1=(t,i)=>{const s=t.length-1,e=[];let n,l=2===i?"<svg>":3===i?"<math>":"",c=v$1;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,f=0;for(;f<s.length&&(c.lastIndex=f,u=c.exec(s),null!==u);)f=c.lastIndex,c===v$1?"!--"===u[1]?c=_$1:void 0!==u[1]?c=m$2: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$1,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$2):c===$||c===g$2?c=p$2:c===_$1||c===m$2?c=v$1:(c=p$2,n=void 0);const x=c===p$2&&t[i+1].startsWith("/>")?" ":"";l+=c===v$1?s+r:d>=0?(e.push(a),s.slice(0,d)+h$1+s.slice(d)+o$3+x):s+o$3+(-2===d?i:x);}return [V(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),e]};let S$1 = class S{constructor({strings:t,_$litType$:i},e){let r;this.parts=[];let l=0,a=0;const u=t.length-1,d=this.parts,[f,v]=N$1(t,i);if(this.el=S.createElement(f,e),P.currentNode=this.el.content,2===i||3===i){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=P.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(h$1)){const i=v[a++],s=r.getAttribute(t).split(o$3),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:l,name:e[2],strings:s,ctor:"."===e[1]?I:"?"===e[1]?L:"@"===e[1]?z$2:H$1}),r.removeAttribute(t);}else t.startsWith(o$3)&&(d.push({type:6,index:l}),r.removeAttribute(t));if(y$2.test(r.tagName)){const t=r.textContent.split(o$3),i=t.length-1;if(i>0){r.textContent=s$2?s$2.emptyScript:"";for(let s=0;s<i;s++)r.append(t[s],c$1()),P.nextNode(),d.push({type:2,index:++l});r.append(t[i],c$1());}}}else if(8===r.nodeType)if(r.data===n$1)d.push({type:2,index:l});else {let t=-1;for(;-1!==(t=r.data.indexOf(o$3,t+1));)d.push({type:7,index:l}),t+=o$3.length-1;}l++;}}static createElement(t,i){const s=l$2.createElement("template");return s.innerHTML=t,s}};function M$2(t,i,s=t,e){if(i===E)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=a$1(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=M$2(t,h._$AS(t,i.values),h,e)),i}let R$1 = class R{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??l$2).importNode(i,true);P.currentNode=e;let h=P.nextNode(),o=0,n=0,r=s[0];for(;void 0!==r;){if(o===r.index){let i;2===r.type?i=new k$2(h,h.nextSibling,this,t):1===r.type?i=new r.ctor(h,r.name,r.strings,this,t):6===r.type&&(i=new Z(h,this,t)),this._$AV.push(i),r=s[++n];}o!==r?.index&&(h=P.nextNode(),o++);}return P.currentNode=l$2,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}};let k$2 = class k{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=A$1,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=M$2(this,t,i),a$1(t)?t===A$1||null==t||""===t?(this._$AH!==A$1&&this._$AR(),this._$AH=A$1):t!==this._$AH&&t!==E&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):d$1(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==A$1&&a$1(this._$AH)?this._$AA.nextSibling.data=t:this.T(l$2.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=S$1.createElement(V(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new R$1(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=C$1.get(t.strings);return void 0===i&&C$1.set(t.strings,i=new S$1(t)),i}k(t){u$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$1()),this.O(c$1()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,s){for(this._$AP?.(false,true,s);t!==this._$AB;){const s=i$3(t).nextSibling;i$3(t).remove(),t=s;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}};let H$1 = class H{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=A$1,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=A$1;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=M$2(this,t,i,0),o=!a$1(t)||t!==this._$AH&&t!==E,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=M$2(this,e[s+n],i,n),r===E&&(r=this._$AH[n]),o||=!a$1(r)||r!==this._$AH[n],r===A$1?t=A$1:t!==A$1&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===A$1?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}};class I extends H$1{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===A$1?void 0:t;}}class L extends H$1{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==A$1);}}let z$2 = class z extends H$1{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=M$2(this,t,i,0)??A$1)===E)return;const s=this._$AH,e=t===A$1&&s!==A$1||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==A$1&&(s===A$1||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}};class Z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){M$2(this,t);}}const B$1=t$1.litHtmlPolyfillSupport;B$1?.(S$1,k$2),(t$1.litHtmlVersions??=[]).push("3.3.3");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$2(i.insertBefore(c$1(),t),t,void 0,s??{});}return h._$AI(t),h};
200
+
201
+ /**
202
+ * @license
203
+ * Copyright 2017 Google LLC
204
+ * SPDX-License-Identifier: BSD-3-Clause
205
+ */const s$1=globalThis;let i$2 = class i extends y$3{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=D(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return E}};i$2._$litElement$=true,i$2["finalized"]=true,s$1.litElementHydrateSupport?.({LitElement:i$2});const o$2=s$1.litElementPolyfillSupport;o$2?.({LitElement:i$2});(s$1.litElementVersions??=[]).push("4.2.2");
206
+
207
+ /**
208
+ * @license
209
+ * Copyright 2017 Google LLC
210
+ * SPDX-License-Identifier: BSD-3-Clause
211
+ */
212
+ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});let i$1 = 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)}};
213
+
214
+ /**
215
+ * @license
216
+ * Copyright 2018 Google LLC
217
+ * SPDX-License-Identifier: BSD-3-Clause
218
+ */const e=e$1(class extends i$1{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter(s=>t[s]).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter(t=>""!==t)));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return E}});
219
+
220
+ /**
221
+ * @license
222
+ * Copyright 2018 Google LLC
223
+ * SPDX-License-Identifier: BSD-3-Clause
224
+ */const o$1=o=>o??A$1;
225
+
226
+ /**
227
+ * @license
228
+ * Copyright 2020 Google LLC
229
+ * SPDX-License-Identifier: BSD-3-Clause
230
+ */
231
+ const a=Symbol.for(""),o=t=>{if(t?.r===a)return t?._$litStatic$},s=t=>({_$litStatic$:t,r:a}),i=(t,...r)=>({_$litStatic$:r.reduce((r,e,a)=>r+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1],t[0]),r:a}),l$1=new Map,n=t=>(r,...e)=>{const a=e.length;let s,i;const n=[],u=[];let c,$=0,f=false;for(;$<a;){for(c=r[$];$<a&&void 0!==(i=e[$],s=o(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l$1.get(t))&&(n.raw=n,l$1.set(t,r=n)),e=u;}return t(r,...e)},u$2=n(b$1);
232
+
233
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
234
+ // See LICENSE in the project root for license information.
235
+
236
+
237
+ class AuroDependencyVersioning {
238
+
239
+ /**
240
+ * Generates a unique string to be used for child auro element naming.
241
+ * @private
242
+ * @param {string} baseName - Defines the first part of the unique element name.
243
+ * @param {string} version - Version of the component that will be appended to the baseName.
244
+ * @returns {string} - Unique string to be used for naming.
245
+ */
246
+ generateElementName(baseName, version) {
247
+ let result = baseName;
248
+
249
+ result += '-';
250
+ result += version.replace(/[.]/g, '_');
251
+
252
+ return result;
253
+ }
254
+
255
+ /**
256
+ * Generates a unique string to be used for child auro element naming.
257
+ * @param {string} baseName - Defines the first part of the unique element name.
258
+ * @param {string} version - Version of the component that will be appended to the baseName.
259
+ * @returns {string} - Unique string to be used for naming.
260
+ */
261
+ generateTag(baseName, version, tagClass) {
262
+ const elementName = this.generateElementName(baseName, version);
263
+ const tag = i`${s(elementName)}`;
264
+
265
+ if (!customElements.get(elementName)) {
266
+ customElements.define(elementName, class extends tagClass {});
267
+ }
268
+
269
+ return tag;
270
+ }
271
+ }
272
+
273
+ // Selectors for focusable elements
274
+ const FOCUSABLE_SELECTORS = [
275
+ "a[href]",
276
+ "button:not([disabled])",
277
+ "textarea:not([disabled])",
278
+ "input:not([disabled])",
279
+ "select:not([disabled])",
280
+ '[role="tab"]:not([disabled])',
281
+ '[role="link"]:not([disabled])',
282
+ '[role="button"]:not([disabled])',
283
+ '[tabindex]:not([tabindex="-1"])',
284
+ '[contenteditable]:not([contenteditable="false"])',
285
+ ];
286
+
287
+ // List of custom components that are known to be focusable
288
+ const FOCUSABLE_COMPONENTS = [
289
+ "auro-checkbox",
290
+ "auro-radio",
291
+ "auro-dropdown",
292
+ "auro-button",
293
+ "auro-combobox",
294
+ "auro-input",
295
+ "auro-counter",
296
+ // 'auro-menu', // Auro menu is not focusable by default, it uses a different interaction model
297
+ "auro-select",
298
+ "auro-datepicker",
299
+ "auro-hyperlink",
300
+ "auro-accordion",
301
+ ];
302
+
303
+ /**
304
+ * Determines if a given element is a custom focusable component.
305
+ * Returns true if the element matches a known focusable component and is not disabled.
306
+ *
307
+ * @param {HTMLElement} element The element to check for focusability.
308
+ * @returns {boolean} True if the element is a focusable custom component, false otherwise.
309
+ */
310
+ function isFocusableComponent(element) {
311
+ const componentName = element.tagName.toLowerCase();
312
+
313
+ // Guard Clause: Element is a focusable component
314
+ if (
315
+ !FOCUSABLE_COMPONENTS.some(
316
+ (name) => element.hasAttribute(name) || componentName === name,
317
+ )
318
+ )
319
+ return false;
320
+
321
+ // Guard Clause: Element is not disabled
322
+ if (element.hasAttribute("disabled")) return false;
323
+
324
+ // Guard Clause: The element is a hyperlink and has no href attribute
325
+ if (componentName.match("hyperlink") && !element.hasAttribute("href"))
326
+ return false;
327
+
328
+ // If all guard clauses pass, the element is a focusable component
329
+ return true;
330
+ }
331
+
332
+ /**
333
+ * Safely get a numeric tabindex for an element.
334
+ * Returns a number if the tabindex is a valid integer, otherwise null.
335
+ *
336
+ * @param {HTMLElement} element The element whose tabindex to read.
337
+ * @returns {?number} The numeric tabindex or null if missing/invalid.
338
+ */
339
+ function getNumericTabIndex(element) {
340
+ const raw = element.getAttribute("tabindex");
341
+ if (raw == null) return null;
342
+
343
+ const value = Number.parseInt(raw, 10);
344
+ return Number.isNaN(value) ? null : value;
345
+ }
346
+
347
+ /**
348
+ * Retrieves all focusable elements within the container in DOM order, including those in shadow DOM and slots.
349
+ * Returns a unique, ordered array of elements that can receive focus.
350
+ * Also sorts elements with tabindex first, preserving their order.
351
+ *
352
+ * @param {HTMLElement} container The container to search within
353
+ * @returns {Array<HTMLElement>} An array of focusable elements within the container.
354
+ */
355
+ function getFocusableElements(container) {
356
+ // Get elements in DOM order by walking the tree
357
+ const orderedFocusableElements = [];
358
+
359
+ // Define a recursive function to collect focusable elements in DOM order
360
+ const collectFocusableElements = (root) => {
361
+ // Check if current element is focusable
362
+ if (root.nodeType === Node.ELEMENT_NODE) {
363
+ // Check if this is a custom component that is focusable
364
+ const isComponentFocusable = isFocusableComponent(root);
365
+
366
+ if (isComponentFocusable) {
367
+ // Add the component itself as a focusable element and don't traverse its shadow DOM
368
+ orderedFocusableElements.push(root);
369
+ return; // Skip traversing inside this component
370
+ }
371
+
372
+ // Check if the element itself matches any selector
373
+ for (const selector of FOCUSABLE_SELECTORS) {
374
+ if (root.matches?.(selector)) {
375
+ orderedFocusableElements.push(root);
376
+ break; // Once we know it's focusable, no need to check other selectors
377
+ }
378
+ }
379
+
380
+ // Process shadow DOM only for non-Auro components
381
+ if (root.shadowRoot) {
382
+ // Process shadow DOM children in order
383
+ if (root.shadowRoot.children) {
384
+ Array.from(root.shadowRoot.children).forEach((child) => {
385
+ collectFocusableElements(child);
386
+ });
387
+ }
388
+ }
389
+
390
+ // Process slots and their assigned nodes in order
391
+ if (root.tagName === "SLOT") {
392
+ const assignedNodes = root.assignedNodes({ flatten: true });
393
+ for (const node of assignedNodes) {
394
+ collectFocusableElements(node);
395
+ }
396
+ } else {
397
+ // Process light DOM children in order
398
+ if (root.children) {
399
+ Array.from(root.children).forEach((child) => {
400
+ collectFocusableElements(child);
401
+ });
402
+ }
403
+ }
404
+ }
405
+ };
406
+
407
+ // Start the traversal from the container
408
+ collectFocusableElements(container);
409
+
410
+ // Remove duplicates that might have been collected through different paths
411
+ // while preserving order
412
+ const uniqueElements = [];
413
+ const seen = new Set();
414
+
415
+ for (const element of orderedFocusableElements) {
416
+ if (!seen.has(element)) {
417
+ seen.add(element);
418
+ uniqueElements.push(element);
419
+ }
420
+ }
421
+
422
+ // Move tab-indexed elements to the front while preserving their order
423
+ // This ensures that elements with tabindex are prioritized in the focus order
424
+
425
+ // First extract elements with valid positive tabindex
426
+ const elementsWithTabindex = uniqueElements.filter((el) => {
427
+ const tabindex = getNumericTabIndex(el);
428
+ return tabindex !== null && tabindex > 0;
429
+ });
430
+
431
+ // Sort these elements by their tabindex value
432
+ elementsWithTabindex.sort((a, b) => {
433
+ const aIndex = getNumericTabIndex(a) ?? 0;
434
+ const bIndex = getNumericTabIndex(b) ?? 0;
435
+ return aIndex - bIndex;
436
+ });
437
+
438
+ // Elements without tabindex (preserving their original order)
439
+ const elementsWithoutTabindex = uniqueElements.filter((el) => {
440
+ const tabindex = getNumericTabIndex(el);
441
+
442
+ // Elements without tabindex or with tabindex of 0 stay in DOM order
443
+ return tabindex === null || tabindex === 0;
444
+ });
445
+
446
+ // Combine both arrays with tabindex elements first
447
+ const tabIndexedUniqueElements = [
448
+ ...elementsWithTabindex,
449
+ ...elementsWithoutTabindex,
450
+ ];
451
+
452
+ return tabIndexedUniqueElements;
453
+ }
454
+
455
+ /**
456
+ * FocusTrap manages keyboard focus within a specified container element, ensuring that focus does not leave the container when tabbing.
457
+ * It is commonly used for modal dialogs or overlays to improve accessibility by trapping focus within interactive UI components.
458
+ */
459
+ class FocusTrap {
460
+ /**
461
+ * Creates a new FocusTrap instance for the given container element.
462
+ * Initializes event listeners and prepares the container for focus management.
463
+ *
464
+ * @param {HTMLElement} container The DOM element to trap focus within.
465
+ * @param {boolean} [controlTabOrder=false] If true enables manual control of the tab order by the FocusTrap.
466
+ * @throws {Error} If the provided container is not a valid HTMLElement.
467
+ */
468
+ constructor(container, controlTabOrder = false) {
469
+ if (!container || !(container instanceof HTMLElement)) {
470
+ throw new Error("FocusTrap requires a valid HTMLElement.");
471
+ }
472
+
473
+ this.container = container;
474
+ this.tabDirection = "forward"; // or 'backward';
475
+ this.controlTabOrder = controlTabOrder;
476
+
477
+ this._init();
478
+ }
479
+
480
+ /**
481
+ * Initializes the focus trap by setting up event listeners and attributes on the container.
482
+ * Prepares the container for focus management, including support for shadow DOM and inert attributes.
483
+ *
484
+ * @private
485
+ */
486
+ _init() {
487
+ // Add inert attribute to prevent focusing programmatically as well (if supported)
488
+ if ("inert" in HTMLElement.prototype) {
489
+ this.container.inert = false; // Ensure the container isn't inert
490
+ this.container.setAttribute("data-focus-trap-container", true); // Mark for identification
491
+ }
492
+
493
+ // Track tab direction
494
+ this.container.addEventListener("keydown", this._onKeydown);
495
+ }
496
+
497
+ /**
498
+ * Gets an array of currently active (focused) elements in the document and shadow DOM.
499
+ * @returns {Array<HTMLElement>} An array of focusable elements within the container.
500
+ * @private
501
+ */
502
+ _getActiveElements() {
503
+ // Get the active element(s) in the document and shadow root
504
+ // This will include the active element in the shadow DOM if it exists
505
+ // Active element may be inside the shadow DOM depending on delegatesFocus, so we need to check both
506
+ let { activeElement } = document;
507
+ const actives = [activeElement];
508
+ while (activeElement?.shadowRoot?.activeElement) {
509
+ actives.push(activeElement.shadowRoot.activeElement);
510
+ activeElement = activeElement.shadowRoot.activeElement;
511
+ }
512
+ return actives;
513
+ }
514
+
515
+ /**
516
+ * Gets the next focus index based on the current index and focusable elements.
517
+ * @param {number} currentIndex The current index of the focused element.
518
+ * @param {Array<HTMLElement>} focusables The array of focusable elements.
519
+ * @returns {number|null} The next focus index or null if not determined.
520
+ */
521
+ _getNextFocusIndex(currentIndex, focusables, actives) {
522
+ if (this.controlTabOrder) {
523
+ // Calculate the new index based on the current index and tab direction
524
+ let newFocusIndex =
525
+ currentIndex + (this.tabDirection === "forward" ? 1 : -1);
526
+
527
+ // Wrap-around logic
528
+ if (newFocusIndex < 0) newFocusIndex = focusables.length - 1;
529
+ if (newFocusIndex >= focusables.length) newFocusIndex = 0;
530
+
531
+ // Early return with the new index
532
+ return newFocusIndex;
533
+ }
534
+
535
+ // Determine if we need to wrap
536
+ const atFirst =
537
+ actives.includes(focusables[0]) || actives.includes(this.container);
538
+ const atLast = actives.includes(focusables[focusables.length - 1]);
539
+
540
+ // Only wrap if at the ends
541
+ if (this.tabDirection === "backward" && atFirst) {
542
+ return focusables.length - 1;
543
+ }
544
+
545
+ if (this.tabDirection === "forward" && atLast) {
546
+ return 0;
547
+ }
548
+
549
+ // No wrap, so don't change focus, return early
550
+ return null;
551
+ }
552
+
553
+ /**
554
+ * Handles the Tab key press event to manage focus within the container.
555
+ * @param {KeyboardEvent} e The keyboard event triggered by the user.
556
+ * @returns {void}
557
+ */
558
+ _handleTabKey(e) {
559
+ // Update the focusable elements
560
+ const focusables = this._getFocusableElements();
561
+
562
+ // If there are no focusable elements, exit
563
+ if (!focusables.length) return;
564
+
565
+ // Set the tab direction based on the key pressed
566
+ this.tabDirection = e.shiftKey ? "backward" : "forward";
567
+
568
+ // Get the active elements that are currently focused
569
+ const actives = this._getActiveElements();
570
+
571
+ // If we're at either end of the focusable elements, wrap around to the other end
572
+ let focusIndex = focusables.findIndex((el) => actives.includes(el));
573
+
574
+ // Fallback if we have no focused element
575
+ if (focusIndex === -1) focusIndex = 0;
576
+
577
+ // Get the next focus index based on the current focus index, tab direction, and controlTabOrder setting
578
+ // Is null if no new focus index is determined
579
+ const newFocusIndex = this._getNextFocusIndex(
580
+ focusIndex,
581
+ focusables,
582
+ actives,
583
+ );
584
+
585
+ // If we have a new focus index, set focus to that element
586
+ if (newFocusIndex !== null) {
587
+ e.preventDefault();
588
+ focusables[newFocusIndex].focus();
589
+ }
590
+ }
591
+
592
+ /**
593
+ * Catches the keydown event
594
+ * @param {KeyboardEvent} e The keyboard event triggered by user interaction.
595
+ * @private
596
+ */
597
+ _onKeydown = (e) => {
598
+ // Handle tab
599
+ if (e.key === "Tab") this._handleTabKey(e);
600
+ };
601
+
602
+ /**
603
+ * Retrieves all focusable elements within the container in DOM order, including those in shadow DOM and slots.
604
+ * Returns a unique, ordered array of elements that can receive focus.
605
+ *
606
+ * @returns {Array<HTMLElement>} An array of focusable elements within the container.
607
+ * @private
608
+ */
609
+ _getFocusableElements() {
610
+ // Use the imported utility function to get focusable elements
611
+ const elements = getFocusableElements(this.container);
612
+
613
+ // Return the elements found
614
+ return elements;
615
+ }
616
+
617
+ /**
618
+ * Moves focus to the first focusable element within the container.
619
+ * Useful for setting initial focus when activating the focus trap.
620
+ */
621
+ focusFirstElement() {
622
+ const focusables = this._getFocusableElements();
623
+ if (focusables.length) focusables[0].focus();
624
+ }
625
+
626
+ /**
627
+ * Moves focus to the last focusable element within the container.
628
+ * Useful for setting focus when deactivating or cycling focus in reverse.
629
+ */
630
+ focusLastElement() {
631
+ const focusables = this._getFocusableElements();
632
+ if (focusables.length) focusables[focusables.length - 1].focus();
633
+ }
634
+
635
+ /**
636
+ * Removes event listeners and attributes added by the focus trap.
637
+ * Call this method to clean up when the focus trap is no longer needed.
638
+ */
639
+ disconnect() {
640
+ if (this.container.hasAttribute("data-focus-trap-container")) {
641
+ this.container.removeAttribute("data-focus-trap-container");
642
+ }
643
+
644
+ this.container.removeEventListener("keydown", this._onKeydown);
645
+ }
646
+ }
647
+
648
+ /**
649
+ * Custom positioning reference element.
650
+ * @see https://floating-ui.com/docs/virtual-elements
651
+ */
652
+
653
+ const sides = ['top', 'right', 'bottom', 'left'];
654
+ const alignments = ['start', 'end'];
655
+ const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
656
+ const min = Math.min;
657
+ const max = Math.max;
658
+ const round = Math.round;
659
+ const floor = Math.floor;
660
+ const createCoords = v => ({
661
+ x: v,
662
+ y: v
663
+ });
664
+ const oppositeSideMap = {
665
+ left: 'right',
666
+ right: 'left',
667
+ bottom: 'top',
668
+ top: 'bottom'
669
+ };
670
+ function clamp(start, value, end) {
671
+ return max(start, min(value, end));
672
+ }
673
+ function evaluate(value, param) {
674
+ return typeof value === 'function' ? value(param) : value;
675
+ }
676
+ function getSide(placement) {
677
+ return placement.split('-')[0];
678
+ }
679
+ function getAlignment(placement) {
680
+ return placement.split('-')[1];
681
+ }
682
+ function getOppositeAxis(axis) {
683
+ return axis === 'x' ? 'y' : 'x';
684
+ }
685
+ function getAxisLength(axis) {
686
+ return axis === 'y' ? 'height' : 'width';
687
+ }
688
+ function getSideAxis(placement) {
689
+ const firstChar = placement[0];
690
+ return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
691
+ }
692
+ function getAlignmentAxis(placement) {
693
+ return getOppositeAxis(getSideAxis(placement));
694
+ }
695
+ function getAlignmentSides(placement, rects, rtl) {
696
+ if (rtl === void 0) {
697
+ rtl = false;
698
+ }
699
+ const alignment = getAlignment(placement);
700
+ const alignmentAxis = getAlignmentAxis(placement);
701
+ const length = getAxisLength(alignmentAxis);
702
+ let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
703
+ if (rects.reference[length] > rects.floating[length]) {
704
+ mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
705
+ }
706
+ return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
707
+ }
708
+ function getExpandedPlacements(placement) {
709
+ const oppositePlacement = getOppositePlacement(placement);
710
+ return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
711
+ }
712
+ function getOppositeAlignmentPlacement(placement) {
713
+ return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
714
+ }
715
+ const lrPlacement = ['left', 'right'];
716
+ const rlPlacement = ['right', 'left'];
717
+ const tbPlacement = ['top', 'bottom'];
718
+ const btPlacement = ['bottom', 'top'];
719
+ function getSideList(side, isStart, rtl) {
720
+ switch (side) {
721
+ case 'top':
722
+ case 'bottom':
723
+ if (rtl) return isStart ? rlPlacement : lrPlacement;
724
+ return isStart ? lrPlacement : rlPlacement;
725
+ case 'left':
726
+ case 'right':
727
+ return isStart ? tbPlacement : btPlacement;
728
+ default:
729
+ return [];
730
+ }
731
+ }
732
+ function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
733
+ const alignment = getAlignment(placement);
734
+ let list = getSideList(getSide(placement), direction === 'start', rtl);
735
+ if (alignment) {
736
+ list = list.map(side => side + "-" + alignment);
737
+ if (flipAlignment) {
738
+ list = list.concat(list.map(getOppositeAlignmentPlacement));
739
+ }
740
+ }
741
+ return list;
742
+ }
743
+ function getOppositePlacement(placement) {
744
+ const side = getSide(placement);
745
+ return oppositeSideMap[side] + placement.slice(side.length);
746
+ }
747
+ function expandPaddingObject(padding) {
748
+ var _padding$top, _padding$right, _padding$bottom, _padding$left;
749
+ return {
750
+ top: (_padding$top = padding.top) != null ? _padding$top : 0,
751
+ right: (_padding$right = padding.right) != null ? _padding$right : 0,
752
+ bottom: (_padding$bottom = padding.bottom) != null ? _padding$bottom : 0,
753
+ left: (_padding$left = padding.left) != null ? _padding$left : 0
754
+ };
755
+ }
756
+ function getPaddingObject(padding) {
757
+ return typeof padding !== 'number' ? expandPaddingObject(padding) : {
758
+ top: padding,
759
+ right: padding,
760
+ bottom: padding,
761
+ left: padding
762
+ };
763
+ }
764
+ function rectToClientRect(rect) {
765
+ const {
766
+ x,
767
+ y,
768
+ width,
769
+ height
770
+ } = rect;
771
+ return {
772
+ width,
773
+ height,
774
+ top: y,
775
+ left: x,
776
+ right: x + width,
777
+ bottom: y + height,
778
+ x,
779
+ y
780
+ };
781
+ }
782
+
783
+ function computeCoordsFromPlacement(_ref, placement, rtl) {
784
+ let {
785
+ reference,
786
+ floating
787
+ } = _ref;
788
+ const sideAxis = getSideAxis(placement);
789
+ const alignmentAxis = getAlignmentAxis(placement);
790
+ const alignLength = getAxisLength(alignmentAxis);
791
+ const side = getSide(placement);
792
+ const isVertical = sideAxis === 'y';
793
+ const commonX = reference.x + reference.width / 2 - floating.width / 2;
794
+ const commonY = reference.y + reference.height / 2 - floating.height / 2;
795
+ const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
796
+ let coords;
797
+ switch (side) {
798
+ case 'top':
799
+ coords = {
800
+ x: commonX,
801
+ y: reference.y - floating.height
802
+ };
803
+ break;
804
+ case 'bottom':
805
+ coords = {
806
+ x: commonX,
807
+ y: reference.y + reference.height
808
+ };
809
+ break;
810
+ case 'right':
811
+ coords = {
812
+ x: reference.x + reference.width,
813
+ y: commonY
814
+ };
815
+ break;
816
+ case 'left':
817
+ coords = {
818
+ x: reference.x - floating.width,
819
+ y: commonY
820
+ };
821
+ break;
822
+ default:
823
+ coords = {
824
+ x: reference.x,
825
+ y: reference.y
826
+ };
827
+ }
828
+ const alignment = getAlignment(placement);
829
+ if (alignment) {
830
+ coords[alignmentAxis] += commonAlign * (alignment === 'end' ? 1 : -1) * (rtl && isVertical ? -1 : 1);
831
+ }
832
+ return coords;
833
+ }
834
+
835
+ /**
836
+ * Resolves with an object of overflow side offsets that determine how much the
837
+ * element is overflowing a given clipping boundary on each side.
838
+ * - positive = overflowing the boundary by that number of pixels
839
+ * - negative = how many pixels left before it will overflow
840
+ * - 0 = lies flush with the boundary
841
+ * @see https://floating-ui.com/docs/detectOverflow
842
+ */
843
+ async function detectOverflow(state, options) {
844
+ var _await$platform$isEle;
845
+ if (options === void 0) {
846
+ options = {};
847
+ }
848
+ const {
849
+ x,
850
+ y,
851
+ platform,
852
+ rects,
853
+ elements,
854
+ strategy
855
+ } = state;
856
+ const {
857
+ boundary = 'clippingAncestors',
858
+ rootBoundary = 'viewport',
859
+ elementContext = 'floating',
860
+ altBoundary = false,
861
+ padding = 0
862
+ } = evaluate(options, state);
863
+ const paddingObject = getPaddingObject(padding);
864
+ const altContext = elementContext === 'floating' ? 'reference' : 'floating';
865
+ const element = elements[altBoundary ? altContext : elementContext];
866
+ const clippingClientRect = rectToClientRect(await platform.getClippingRect({
867
+ element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
868
+ boundary,
869
+ rootBoundary,
870
+ strategy
871
+ }));
872
+ const rect = elementContext === 'floating' ? {
873
+ x,
874
+ y,
875
+ width: rects.floating.width,
876
+ height: rects.floating.height
877
+ } : rects.reference;
878
+ const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
879
+ const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) && (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
880
+ x: 1,
881
+ y: 1
882
+ };
883
+ const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
884
+ elements,
885
+ rect,
886
+ offsetParent,
887
+ strategy
888
+ }) : rect);
889
+ return {
890
+ top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
891
+ bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
892
+ left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
893
+ right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
894
+ };
895
+ }
896
+
897
+ // Maximum number of resets that can occur before bailing to avoid infinite reset loops.
898
+ const MAX_RESET_COUNT = 50;
899
+
900
+ /**
901
+ * Computes the `x` and `y` coordinates that will place the floating element
902
+ * next to a given reference element.
903
+ *
904
+ * This export does not have any `platform` interface logic. You will need to
905
+ * write one for the platform you are using Floating UI with.
906
+ */
907
+ const computePosition$1 = async (reference, floating, config) => {
908
+ const {
909
+ placement = 'bottom',
910
+ strategy = 'absolute',
911
+ middleware = [],
912
+ platform
913
+ } = config;
914
+ const platformWithDetectOverflow = platform.detectOverflow ? platform : {
915
+ ...platform,
916
+ detectOverflow
917
+ };
918
+ const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
919
+ let rects = await platform.getElementRects({
920
+ reference,
921
+ floating,
922
+ strategy
923
+ });
924
+ let {
925
+ x,
926
+ y
927
+ } = computeCoordsFromPlacement(rects, placement, rtl);
928
+ let statefulPlacement = placement;
929
+ let resetCount = 0;
930
+ const middlewareData = {};
931
+ for (let i = 0; i < middleware.length; i++) {
932
+ const currentMiddleware = middleware[i];
933
+ if (!currentMiddleware) {
934
+ continue;
935
+ }
936
+ const {
937
+ name,
938
+ fn
939
+ } = currentMiddleware;
940
+ const {
941
+ x: nextX,
942
+ y: nextY,
943
+ data,
944
+ reset
945
+ } = await fn({
946
+ x,
947
+ y,
948
+ initialPlacement: placement,
949
+ placement: statefulPlacement,
950
+ strategy,
951
+ middlewareData,
952
+ rects,
953
+ platform: platformWithDetectOverflow,
954
+ elements: {
955
+ reference,
956
+ floating
957
+ }
958
+ });
959
+ x = nextX != null ? nextX : x;
960
+ y = nextY != null ? nextY : y;
961
+ middlewareData[name] = {
962
+ ...middlewareData[name],
963
+ ...data
964
+ };
965
+ if (reset && resetCount < MAX_RESET_COUNT) {
966
+ resetCount++;
967
+ if (typeof reset === 'object') {
968
+ if (reset.placement) {
969
+ statefulPlacement = reset.placement;
970
+ }
971
+ if (reset.rects) {
972
+ rects = reset.rects === true ? await platform.getElementRects({
973
+ reference,
974
+ floating,
975
+ strategy
976
+ }) : reset.rects;
977
+ }
978
+ ({
979
+ x,
980
+ y
981
+ } = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
982
+ }
983
+ i = -1;
984
+ }
985
+ }
986
+ return {
987
+ x,
988
+ y,
989
+ placement: statefulPlacement,
990
+ strategy,
991
+ middlewareData
992
+ };
993
+ };
994
+
995
+ function getPlacementList(alignment, autoAlignment, allowedPlacements) {
996
+ const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
997
+ return allowedPlacementsSortedByAlignment.filter(placement => {
998
+ if (alignment) {
999
+ return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
1000
+ }
1001
+ return true;
1002
+ });
1003
+ }
1004
+ /**
1005
+ * Optimizes the visibility of the floating element by choosing the placement
1006
+ * that has the most space available automatically, without needing to specify a
1007
+ * preferred placement. Alternative to `flip`.
1008
+ * @see https://floating-ui.com/docs/autoPlacement
1009
+ */
1010
+ const autoPlacement$1 = function (options) {
1011
+ if (options === void 0) {
1012
+ options = {};
1013
+ }
1014
+ return {
1015
+ name: 'autoPlacement',
1016
+ options,
1017
+ async fn(state) {
1018
+ var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
1019
+ const {
1020
+ rects,
1021
+ middlewareData,
1022
+ placement,
1023
+ platform,
1024
+ elements
1025
+ } = state;
1026
+ const {
1027
+ crossAxis = false,
1028
+ alignment,
1029
+ allowedPlacements = placements,
1030
+ autoAlignment = true,
1031
+ ...detectOverflowOptions
1032
+ } = evaluate(options, state);
1033
+ const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
1034
+ const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
1035
+ const currentPlacement = placements$1[currentIndex];
1036
+ if (currentPlacement == null) {
1037
+ return {};
1038
+ }
1039
+
1040
+ // Make `computeCoords` start from the right place.
1041
+ if (placement !== currentPlacement) {
1042
+ return {
1043
+ reset: {
1044
+ placement: placements$1[0]
1045
+ }
1046
+ };
1047
+ }
1048
+ const overflow = await platform.detectOverflow(state, detectOverflowOptions);
1049
+ const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
1050
+ const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
1051
+ const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
1052
+ placement: currentPlacement,
1053
+ overflows: currentOverflows
1054
+ }];
1055
+ const nextPlacement = placements$1[currentIndex + 1];
1056
+
1057
+ // There are more placements to check.
1058
+ if (nextPlacement) {
1059
+ return {
1060
+ data: {
1061
+ index: currentIndex + 1,
1062
+ overflows: allOverflows
1063
+ },
1064
+ reset: {
1065
+ placement: nextPlacement
1066
+ }
1067
+ };
1068
+ }
1069
+ const placementsSortedByMostSpace = allOverflows.map(d => {
1070
+ const alignment = getAlignment(d.placement);
1071
+ return [d.placement, alignment && crossAxis ?
1072
+ // Check along the mainAxis and main crossAxis side.
1073
+ d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
1074
+ // Check only the mainAxis.
1075
+ d.overflows[0], d.overflows];
1076
+ }).sort((a, b) => a[1] - b[1]);
1077
+ const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
1078
+ // Aligned placements should not check their opposite crossAxis
1079
+ // side.
1080
+ getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
1081
+ const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
1082
+ if (resetPlacement !== placement) {
1083
+ return {
1084
+ data: {
1085
+ index: currentIndex + 1,
1086
+ overflows: allOverflows
1087
+ },
1088
+ reset: {
1089
+ placement: resetPlacement
1090
+ }
1091
+ };
1092
+ }
1093
+ return {};
1094
+ }
1095
+ };
1096
+ };
1097
+
1098
+ /**
1099
+ * Optimizes the visibility of the floating element by flipping the `placement`
1100
+ * in order to keep it in view when the preferred placement(s) will overflow the
1101
+ * clipping boundary. Alternative to `autoPlacement`.
1102
+ * @see https://floating-ui.com/docs/flip
1103
+ */
1104
+ const flip$1 = function (options) {
1105
+ if (options === void 0) {
1106
+ options = {};
1107
+ }
1108
+ return {
1109
+ name: 'flip',
1110
+ options,
1111
+ async fn(state) {
1112
+ var _middlewareData$arrow, _middlewareData$flip;
1113
+ const {
1114
+ placement,
1115
+ middlewareData,
1116
+ rects,
1117
+ initialPlacement,
1118
+ platform,
1119
+ elements
1120
+ } = state;
1121
+ const {
1122
+ mainAxis: checkMainAxis = true,
1123
+ crossAxis: checkCrossAxis = true,
1124
+ fallbackPlacements: specifiedFallbackPlacements,
1125
+ fallbackStrategy = 'bestFit',
1126
+ fallbackAxisSideDirection = 'none',
1127
+ flipAlignment = true,
1128
+ ...detectOverflowOptions
1129
+ } = evaluate(options, state);
1130
+
1131
+ // If a reset by the arrow was caused due to an alignment offset being
1132
+ // added, we should skip any logic now since `flip()` has already done its
1133
+ // work.
1134
+ // https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
1135
+ if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
1136
+ return {};
1137
+ }
1138
+ const side = getSide(placement);
1139
+ const initialSideAxis = getSideAxis(initialPlacement);
1140
+ const isBasePlacement = getSide(initialPlacement) === initialPlacement;
1141
+ const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
1142
+ const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
1143
+ const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
1144
+ if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
1145
+ fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
1146
+ }
1147
+ const placements = [initialPlacement, ...fallbackPlacements];
1148
+ const overflow = await platform.detectOverflow(state, detectOverflowOptions);
1149
+ const overflows = [];
1150
+ let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
1151
+ if (checkMainAxis) {
1152
+ overflows.push(overflow[side]);
1153
+ }
1154
+ if (checkCrossAxis) {
1155
+ const sides = getAlignmentSides(placement, rects, rtl);
1156
+ overflows.push(overflow[sides[0]], overflow[sides[1]]);
1157
+ }
1158
+ overflowsData = [...overflowsData, {
1159
+ placement,
1160
+ overflows
1161
+ }];
1162
+
1163
+ // One or more sides is overflowing.
1164
+ if (!overflows.every(side => side <= 0)) {
1165
+ var _middlewareData$flip2, _overflowsData$filter;
1166
+ const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
1167
+ const nextPlacement = placements[nextIndex];
1168
+ if (nextPlacement) {
1169
+ const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
1170
+ if (!ignoreCrossAxisOverflow ||
1171
+ // We leave the current main axis only if every placement on that axis
1172
+ // overflows the main axis.
1173
+ overflowsData.every(d => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
1174
+ // Try next placement and re-run the lifecycle.
1175
+ return {
1176
+ data: {
1177
+ index: nextIndex,
1178
+ overflows: overflowsData
1179
+ },
1180
+ reset: {
1181
+ placement: nextPlacement
1182
+ }
1183
+ };
1184
+ }
1185
+ }
1186
+
1187
+ // First, find the candidates that fit on the mainAxis side of overflow,
1188
+ // then find the placement that fits the best on the main crossAxis side.
1189
+ let resetPlacement = (_overflowsData$filter = overflowsData.filter(d => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
1190
+
1191
+ // Otherwise fallback.
1192
+ if (!resetPlacement) {
1193
+ switch (fallbackStrategy) {
1194
+ case 'bestFit':
1195
+ {
1196
+ var _overflowsData$filter2;
1197
+ const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
1198
+ if (hasFallbackAxisSideDirection) {
1199
+ const currentSideAxis = getSideAxis(d.placement);
1200
+ return currentSideAxis === initialSideAxis ||
1201
+ // Create a bias to the `y` side axis due to horizontal
1202
+ // reading directions favoring greater width.
1203
+ currentSideAxis === 'y';
1204
+ }
1205
+ return true;
1206
+ }).map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$filter2[0];
1207
+ if (placement) {
1208
+ resetPlacement = placement;
1209
+ }
1210
+ break;
1211
+ }
1212
+ case 'initialPlacement':
1213
+ resetPlacement = initialPlacement;
1214
+ break;
1215
+ }
1216
+ }
1217
+ if (placement !== resetPlacement) {
1218
+ return {
1219
+ reset: {
1220
+ placement: resetPlacement
1221
+ }
1222
+ };
1223
+ }
1224
+ }
1225
+ return {};
1226
+ }
1227
+ };
1228
+ };
1229
+
1230
+ const originSides = /*#__PURE__*/new Set(['left', 'top']);
1231
+
1232
+ // For type backwards-compatibility, the `OffsetOptions` type was also
1233
+ // Derivable.
1234
+
1235
+ async function convertValueToCoords(state, options) {
1236
+ const {
1237
+ placement,
1238
+ platform,
1239
+ elements
1240
+ } = state;
1241
+ const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
1242
+ const side = getSide(placement);
1243
+ const alignment = getAlignment(placement);
1244
+ const isVertical = getSideAxis(placement) === 'y';
1245
+ const mainAxisMulti = originSides.has(side) ? -1 : 1;
1246
+ const crossAxisMulti = rtl && isVertical ? -1 : 1;
1247
+ const rawValue = evaluate(options, state);
1248
+
1249
+ // eslint-disable-next-line prefer-const
1250
+ let {
1251
+ mainAxis,
1252
+ crossAxis,
1253
+ alignmentAxis
1254
+ } = typeof rawValue === 'number' ? {
1255
+ mainAxis: rawValue,
1256
+ crossAxis: 0,
1257
+ alignmentAxis: null
1258
+ } : {
1259
+ mainAxis: rawValue.mainAxis || 0,
1260
+ crossAxis: rawValue.crossAxis || 0,
1261
+ alignmentAxis: rawValue.alignmentAxis
1262
+ };
1263
+ if (alignment && typeof alignmentAxis === 'number') {
1264
+ crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
1265
+ }
1266
+ return isVertical ? {
1267
+ x: crossAxis * crossAxisMulti,
1268
+ y: mainAxis * mainAxisMulti
1269
+ } : {
1270
+ x: mainAxis * mainAxisMulti,
1271
+ y: crossAxis * crossAxisMulti
1272
+ };
1273
+ }
1274
+
1275
+ /**
1276
+ * Modifies the placement by translating the floating element along the
1277
+ * specified axes.
1278
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
1279
+ * object may be passed.
1280
+ * @see https://floating-ui.com/docs/offset
1281
+ */
1282
+ const offset$1 = function (options) {
1283
+ if (options === void 0) {
1284
+ options = 0;
1285
+ }
1286
+ return {
1287
+ name: 'offset',
1288
+ options,
1289
+ async fn(state) {
1290
+ var _middlewareData$offse, _middlewareData$arrow;
1291
+ const {
1292
+ x,
1293
+ y,
1294
+ placement,
1295
+ middlewareData
1296
+ } = state;
1297
+ const diffCoords = await convertValueToCoords(state, options);
1298
+
1299
+ // If the placement is the same and the arrow caused an alignment offset
1300
+ // then we don't need to change the positioning coordinates.
1301
+ if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
1302
+ return {};
1303
+ }
1304
+ return {
1305
+ x: x + diffCoords.x,
1306
+ y: y + diffCoords.y,
1307
+ data: {
1308
+ ...diffCoords,
1309
+ placement
1310
+ }
1311
+ };
1312
+ }
1313
+ };
1314
+ };
1315
+
1316
+ /**
1317
+ * Optimizes the visibility of the floating element by shifting it in order to
1318
+ * keep it in view when it will overflow the clipping boundary.
1319
+ * @see https://floating-ui.com/docs/shift
1320
+ */
1321
+ const shift$1 = function (options) {
1322
+ if (options === void 0) {
1323
+ options = {};
1324
+ }
1325
+ return {
1326
+ name: 'shift',
1327
+ options,
1328
+ async fn(state) {
1329
+ const {
1330
+ x,
1331
+ y,
1332
+ placement,
1333
+ platform
1334
+ } = state;
1335
+ const {
1336
+ mainAxis: checkMainAxis = true,
1337
+ crossAxis: checkCrossAxis = false,
1338
+ limiter = {
1339
+ fn: _ref => {
1340
+ let {
1341
+ x,
1342
+ y
1343
+ } = _ref;
1344
+ return {
1345
+ x,
1346
+ y
1347
+ };
1348
+ }
1349
+ },
1350
+ ...detectOverflowOptions
1351
+ } = evaluate(options, state);
1352
+ const coords = {
1353
+ x,
1354
+ y
1355
+ };
1356
+ const overflow = await platform.detectOverflow(state, detectOverflowOptions);
1357
+ const crossAxis = getSideAxis(placement);
1358
+ const mainAxis = getOppositeAxis(crossAxis);
1359
+ let mainAxisCoord = coords[mainAxis];
1360
+ let crossAxisCoord = coords[crossAxis];
1361
+ const clampCoord = (axis, coord) => clamp(coord + overflow[axis === 'y' ? 'top' : 'left'], coord, coord - overflow[axis === 'y' ? 'bottom' : 'right']);
1362
+ if (checkMainAxis) {
1363
+ mainAxisCoord = clampCoord(mainAxis, mainAxisCoord);
1364
+ }
1365
+ if (checkCrossAxis) {
1366
+ crossAxisCoord = clampCoord(crossAxis, crossAxisCoord);
1367
+ }
1368
+ const limitedCoords = limiter.fn({
1369
+ ...state,
1370
+ [mainAxis]: mainAxisCoord,
1371
+ [crossAxis]: crossAxisCoord
1372
+ });
1373
+ return {
1374
+ ...limitedCoords,
1375
+ data: {
1376
+ x: limitedCoords.x - x,
1377
+ y: limitedCoords.y - y,
1378
+ enabled: {
1379
+ [mainAxis]: checkMainAxis,
1380
+ [crossAxis]: checkCrossAxis
1381
+ }
1382
+ }
1383
+ };
1384
+ }
1385
+ };
1386
+ };
1387
+
1388
+ function hasWindow() {
1389
+ return typeof window !== 'undefined';
1390
+ }
1391
+ function getNodeName(node) {
1392
+ if (isNode(node)) {
1393
+ return (node.nodeName || '').toLowerCase();
1394
+ }
1395
+ // Mocked nodes in testing environments may not be instances of Node. By
1396
+ // returning `#document` an infinite loop won't occur.
1397
+ // https://github.com/floating-ui/floating-ui/issues/2317
1398
+ return '#document';
1399
+ }
1400
+ function getWindow(node) {
1401
+ var _node$ownerDocument;
1402
+ return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
1403
+ }
1404
+ function getDocumentElement(node) {
1405
+ var _ref;
1406
+ return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
1407
+ }
1408
+ function isNode(value) {
1409
+ if (!hasWindow()) {
1410
+ return false;
1411
+ }
1412
+ return value instanceof Node || value instanceof getWindow(value).Node;
1413
+ }
1414
+ function isElement(value) {
1415
+ if (!hasWindow()) {
1416
+ return false;
1417
+ }
1418
+ return value instanceof Element || value instanceof getWindow(value).Element;
1419
+ }
1420
+ function isHTMLElement(value) {
1421
+ if (!hasWindow()) {
1422
+ return false;
1423
+ }
1424
+ return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
1425
+ }
1426
+ function isShadowRoot(value) {
1427
+ if (!hasWindow() || typeof ShadowRoot === 'undefined') {
1428
+ return false;
1429
+ }
1430
+ return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
1431
+ }
1432
+ function isOverflowElement(element) {
1433
+ const {
1434
+ overflow,
1435
+ overflowX,
1436
+ overflowY,
1437
+ display
1438
+ } = getComputedStyle$1(element);
1439
+ return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
1440
+ }
1441
+ function isTableElement(element) {
1442
+ return /^(table|td|th)$/.test(getNodeName(element));
1443
+ }
1444
+ function isTopLayer(element) {
1445
+ try {
1446
+ if (element.matches(':popover-open')) {
1447
+ return true;
1448
+ }
1449
+ } catch (_e) {
1450
+ // no-op
1451
+ }
1452
+ try {
1453
+ return element.matches(':modal');
1454
+ } catch (_e) {
1455
+ return false;
1456
+ }
1457
+ }
1458
+ const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
1459
+ const containRe = /paint|layout|strict|content/;
1460
+ const isNotNone = value => !!value && value !== 'none';
1461
+ let isWebKitValue;
1462
+ function isContainingBlock(elementOrCss) {
1463
+ const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
1464
+
1465
+ // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
1466
+ // https://drafts.csswg.org/css-transforms-2/#individual-transforms
1467
+ return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || '') || containRe.test(css.contain || '');
1468
+ }
1469
+ function getContainingBlock(element) {
1470
+ let currentNode = getParentNode(element);
1471
+ while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
1472
+ if (isContainingBlock(currentNode)) {
1473
+ return currentNode;
1474
+ } else if (isTopLayer(currentNode)) {
1475
+ return null;
1476
+ }
1477
+ currentNode = getParentNode(currentNode);
1478
+ }
1479
+ return null;
1480
+ }
1481
+ function isWebKit() {
1482
+ if (isWebKitValue == null) {
1483
+ isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
1484
+ }
1485
+ return isWebKitValue;
1486
+ }
1487
+ function isLastTraversableNode(node) {
1488
+ return /^(html|body|#document)$/.test(getNodeName(node));
1489
+ }
1490
+ function getComputedStyle$1(element) {
1491
+ return getWindow(element).getComputedStyle(element);
1492
+ }
1493
+ function getNodeScroll(element) {
1494
+ if (isElement(element)) {
1495
+ return {
1496
+ scrollLeft: element.scrollLeft,
1497
+ scrollTop: element.scrollTop
1498
+ };
1499
+ }
1500
+ return {
1501
+ scrollLeft: element.scrollX,
1502
+ scrollTop: element.scrollY
1503
+ };
1504
+ }
1505
+ function getParentNode(node) {
1506
+ if (getNodeName(node) === 'html') {
1507
+ return node;
1508
+ }
1509
+ const result =
1510
+ // Step into the shadow DOM of the parent of a slotted node.
1511
+ node.assignedSlot ||
1512
+ // DOM Element detected.
1513
+ node.parentNode ||
1514
+ // ShadowRoot detected.
1515
+ isShadowRoot(node) && node.host ||
1516
+ // Fallback.
1517
+ getDocumentElement(node);
1518
+ return isShadowRoot(result) ? result.host : result;
1519
+ }
1520
+ function getNearestOverflowAncestor(node) {
1521
+ const parentNode = getParentNode(node);
1522
+ if (isLastTraversableNode(parentNode)) {
1523
+ return (node.ownerDocument || node).body;
1524
+ }
1525
+ if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
1526
+ return parentNode;
1527
+ }
1528
+ return getNearestOverflowAncestor(parentNode);
1529
+ }
1530
+ function getOverflowAncestors(node, list, traverseIframes) {
1531
+ var _node$ownerDocument2;
1532
+ if (list === void 0) {
1533
+ list = [];
1534
+ }
1535
+ if (traverseIframes === void 0) {
1536
+ traverseIframes = true;
1537
+ }
1538
+ const scrollableAncestor = getNearestOverflowAncestor(node);
1539
+ const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
1540
+ const win = getWindow(scrollableAncestor);
1541
+ if (isBody) {
1542
+ const frameElement = getFrameElement(win);
1543
+ return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
1544
+ } else {
1545
+ return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
1546
+ }
1547
+ }
1548
+ function getFrameElement(win) {
1549
+ return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
1550
+ }
1551
+
1552
+ function getCssDimensions(element) {
1553
+ const css = getComputedStyle$1(element);
1554
+ // In testing environments, the `width` and `height` properties are empty
1555
+ // strings for SVG elements, returning NaN. Fallback to `0` in this case.
1556
+ let width = parseFloat(css.width) || 0;
1557
+ let height = parseFloat(css.height) || 0;
1558
+ const hasOffset = isHTMLElement(element);
1559
+ const offsetWidth = hasOffset ? element.offsetWidth : width;
1560
+ const offsetHeight = hasOffset ? element.offsetHeight : height;
1561
+ const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
1562
+ if (shouldFallback) {
1563
+ width = offsetWidth;
1564
+ height = offsetHeight;
1565
+ }
1566
+ return {
1567
+ width,
1568
+ height,
1569
+ $: shouldFallback
1570
+ };
1571
+ }
1572
+
1573
+ function unwrapElement(element) {
1574
+ return !isElement(element) ? element.contextElement : element;
1575
+ }
1576
+
1577
+ function getScale(element) {
1578
+ const domElement = unwrapElement(element);
1579
+ if (!isHTMLElement(domElement)) {
1580
+ return createCoords(1);
1581
+ }
1582
+ const rect = domElement.getBoundingClientRect();
1583
+ const {
1584
+ width,
1585
+ height,
1586
+ $
1587
+ } = getCssDimensions(domElement);
1588
+ let x = ($ ? round(rect.width) : rect.width) / width;
1589
+ let y = ($ ? round(rect.height) : rect.height) / height;
1590
+
1591
+ // 0, NaN, or Infinity should always fallback to 1.
1592
+
1593
+ if (!x || !Number.isFinite(x)) {
1594
+ x = 1;
1595
+ }
1596
+ if (!y || !Number.isFinite(y)) {
1597
+ y = 1;
1598
+ }
1599
+ return {
1600
+ x,
1601
+ y
1602
+ };
1603
+ }
1604
+
1605
+ const noOffsets = /*#__PURE__*/createCoords(0);
1606
+ function getVisualOffsets(element) {
1607
+ const win = getWindow(element);
1608
+ if (!isWebKit() || !win.visualViewport) {
1609
+ return noOffsets;
1610
+ }
1611
+ return {
1612
+ x: win.visualViewport.offsetLeft,
1613
+ y: win.visualViewport.offsetTop
1614
+ };
1615
+ }
1616
+ function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
1617
+ if (isFixed === void 0) {
1618
+ isFixed = false;
1619
+ }
1620
+ return !!floatingOffsetParent && isFixed && floatingOffsetParent === getWindow(element);
1621
+ }
1622
+
1623
+ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
1624
+ if (includeScale === void 0) {
1625
+ includeScale = false;
1626
+ }
1627
+ if (isFixedStrategy === void 0) {
1628
+ isFixedStrategy = false;
1629
+ }
1630
+ const clientRect = element.getBoundingClientRect();
1631
+ const domElement = unwrapElement(element);
1632
+ let scale = createCoords(1);
1633
+ if (includeScale) {
1634
+ if (offsetParent) {
1635
+ if (isElement(offsetParent)) {
1636
+ scale = getScale(offsetParent);
1637
+ }
1638
+ } else {
1639
+ scale = getScale(element);
1640
+ }
1641
+ }
1642
+ const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
1643
+ let x = (clientRect.left + visualOffsets.x) / scale.x;
1644
+ let y = (clientRect.top + visualOffsets.y) / scale.y;
1645
+ let width = clientRect.width / scale.x;
1646
+ let height = clientRect.height / scale.y;
1647
+ if (domElement && offsetParent) {
1648
+ const win = getWindow(domElement);
1649
+ const offsetWin = isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
1650
+ let currentWin = win;
1651
+ let currentIFrame = getFrameElement(currentWin);
1652
+ while (currentIFrame && offsetWin !== currentWin) {
1653
+ const iframeScale = getScale(currentIFrame);
1654
+ const iframeRect = currentIFrame.getBoundingClientRect();
1655
+ const css = getComputedStyle$1(currentIFrame);
1656
+ const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
1657
+ const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
1658
+ x *= iframeScale.x;
1659
+ y *= iframeScale.y;
1660
+ width *= iframeScale.x;
1661
+ height *= iframeScale.y;
1662
+ x += left;
1663
+ y += top;
1664
+ currentWin = getWindow(currentIFrame);
1665
+ currentIFrame = getFrameElement(currentWin);
1666
+ }
1667
+ }
1668
+ return rectToClientRect({
1669
+ width,
1670
+ height,
1671
+ x,
1672
+ y
1673
+ });
1674
+ }
1675
+
1676
+ // If <html> has a CSS width greater than the viewport, then this will be
1677
+ // incorrect for RTL.
1678
+ function getWindowScrollBarX(element, rect) {
1679
+ const leftScroll = getNodeScroll(element).scrollLeft;
1680
+ if (!rect) {
1681
+ return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
1682
+ }
1683
+ return rect.left + leftScroll;
1684
+ }
1685
+
1686
+ function getHTMLOffset(documentElement, scroll) {
1687
+ const htmlRect = documentElement.getBoundingClientRect();
1688
+ const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
1689
+ const y = htmlRect.top + scroll.scrollTop;
1690
+ return {
1691
+ x,
1692
+ y
1693
+ };
1694
+ }
1695
+
1696
+ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
1697
+ let {
1698
+ elements,
1699
+ rect,
1700
+ offsetParent,
1701
+ strategy
1702
+ } = _ref;
1703
+ const isFixed = strategy === 'fixed';
1704
+ const documentElement = getDocumentElement(offsetParent);
1705
+ const topLayer = elements ? isTopLayer(elements.floating) : false;
1706
+ if (offsetParent === documentElement || topLayer && isFixed) {
1707
+ return rect;
1708
+ }
1709
+ let scroll = {
1710
+ scrollLeft: 0,
1711
+ scrollTop: 0
1712
+ };
1713
+ let scale = createCoords(1);
1714
+ const offsets = createCoords(0);
1715
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
1716
+ if (isOffsetParentAnElement || !isFixed) {
1717
+ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
1718
+ scroll = getNodeScroll(offsetParent);
1719
+ }
1720
+ if (isOffsetParentAnElement) {
1721
+ const offsetRect = getBoundingClientRect(offsetParent);
1722
+ scale = getScale(offsetParent);
1723
+ offsets.x = offsetRect.x + offsetParent.clientLeft;
1724
+ offsets.y = offsetRect.y + offsetParent.clientTop;
1725
+ }
1726
+ }
1727
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1728
+ return {
1729
+ width: rect.width * scale.x,
1730
+ height: rect.height * scale.y,
1731
+ x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
1732
+ y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
1733
+ };
1734
+ }
1735
+
1736
+ function getClientRects(element) {
1737
+ return element.getClientRects ? Array.from(element.getClientRects()) : [];
1738
+ }
1739
+
1740
+ // Gets the entire size of the scrollable document area, even extending outside
1741
+ // of the `<html>` and `<body>` rect bounds if horizontally scrollable.
1742
+ function getDocumentRect(html) {
1743
+ const scroll = getNodeScroll(html);
1744
+ const body = html.ownerDocument.body;
1745
+ const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
1746
+ const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
1747
+ let x = -scroll.scrollLeft + getWindowScrollBarX(html);
1748
+ const y = -scroll.scrollTop;
1749
+ if (getComputedStyle$1(body).direction === 'rtl') {
1750
+ x += max(html.clientWidth, body.clientWidth) - width;
1751
+ }
1752
+ return {
1753
+ width,
1754
+ height,
1755
+ x,
1756
+ y
1757
+ };
1758
+ }
1759
+
1760
+ // Safety check: ensure the scrollbar space is reasonable in case this
1761
+ // calculation is affected by unusual styles.
1762
+ // Most scrollbars leave 15-18px of space.
1763
+ const SCROLLBAR_MAX = 25;
1764
+ function getViewportRect(element, strategy, rootBoundary) {
1765
+ if (rootBoundary === void 0) {
1766
+ rootBoundary = 'viewport';
1767
+ }
1768
+ const isLayoutViewport = rootBoundary === 'layoutViewport';
1769
+ const win = getWindow(element);
1770
+ const html = getDocumentElement(element);
1771
+ const visualViewport = win.visualViewport;
1772
+ let width = html.clientWidth;
1773
+ let height = html.clientHeight;
1774
+ let x = 0;
1775
+ let y = 0;
1776
+ if (visualViewport) {
1777
+ // Client coordinates are relative to the layout viewport, except in
1778
+ // WebKit with an `absolute` strategy, where they are relative to the
1779
+ // visual viewport.
1780
+ const layoutRelativeClientCoords = !isWebKit() || strategy === 'fixed';
1781
+ if (isLayoutViewport) {
1782
+ if (!layoutRelativeClientCoords) {
1783
+ x = -visualViewport.offsetLeft;
1784
+ y = -visualViewport.offsetTop;
1785
+ }
1786
+ } else {
1787
+ width = visualViewport.width;
1788
+ height = visualViewport.height;
1789
+ if (layoutRelativeClientCoords) {
1790
+ x = visualViewport.offsetLeft;
1791
+ y = visualViewport.offsetTop;
1792
+ }
1793
+ }
1794
+ }
1795
+ const windowScrollbarX = getWindowScrollBarX(html);
1796
+ // `scrollbar-gutter: stable` on the <html> reserves gutter space that shrinks
1797
+ // the visual width but isn't reflected in `html.clientWidth`, so subtract it.
1798
+ // Only the inline-end (right) gutter can hold the scrollbar; `both-edges` also
1799
+ // reserves an empty inline-start gutter that clips nothing, so exclude just
1800
+ // the one scrollbar-side gutter — halve the measured (two-gutter) total. A
1801
+ // left-side scrollbar (`windowScrollbarX > 0`) is already handled by
1802
+ // `getHTMLOffset`/`visualViewport.width`; skip it here.
1803
+ if (windowScrollbarX <= 0) {
1804
+ const doc = html.ownerDocument;
1805
+ const body = doc.body;
1806
+ const bodyStyles = getComputedStyle(body);
1807
+ const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
1808
+ const reservedWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
1809
+ const gutter = getComputedStyle(html).scrollbarGutter === 'stable both-edges' ? reservedWidth / 2 : reservedWidth;
1810
+ if (gutter <= SCROLLBAR_MAX) {
1811
+ width -= gutter;
1812
+ }
1813
+ }
1814
+ return {
1815
+ width,
1816
+ height,
1817
+ x,
1818
+ y
1819
+ };
1820
+ }
1821
+
1822
+ // Returns the inner client rect, subtracting scrollbars if present.
1823
+ function getInnerBoundingClientRect(element, strategy) {
1824
+ const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
1825
+ const top = clientRect.top + element.clientTop;
1826
+ const left = clientRect.left + element.clientLeft;
1827
+ const scale = getScale(element);
1828
+ const width = element.clientWidth * scale.x;
1829
+ const height = element.clientHeight * scale.y;
1830
+ const x = left * scale.x;
1831
+ const y = top * scale.y;
1832
+ return {
1833
+ width,
1834
+ height,
1835
+ x,
1836
+ y
1837
+ };
1838
+ }
1839
+ function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
1840
+ let rect;
1841
+ if (clippingAncestor === 'viewport' || clippingAncestor === 'layoutViewport') {
1842
+ rect = getViewportRect(element, strategy, clippingAncestor);
1843
+ } else if (clippingAncestor === 'document') {
1844
+ rect = getDocumentRect(getDocumentElement(element));
1845
+ } else if (isElement(clippingAncestor)) {
1846
+ rect = getInnerBoundingClientRect(clippingAncestor, strategy);
1847
+ } else {
1848
+ const visualOffsets = getVisualOffsets(element);
1849
+ rect = {
1850
+ x: clippingAncestor.x - visualOffsets.x,
1851
+ y: clippingAncestor.y - visualOffsets.y,
1852
+ width: clippingAncestor.width,
1853
+ height: clippingAncestor.height
1854
+ };
1855
+ }
1856
+ return rectToClientRect(rect);
1857
+ }
1858
+
1859
+ // A "clipping ancestor" is an `overflow` element with the characteristic of
1860
+ // clipping (or hiding) child elements. This returns all clipping ancestors
1861
+ // of the given element up the tree.
1862
+ function getClippingElementAncestors(element, cache) {
1863
+ const cachedResult = cache.get(element);
1864
+ if (cachedResult) {
1865
+ return cachedResult;
1866
+ }
1867
+ let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
1868
+ let lastKeptComputedStyle = null;
1869
+ const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
1870
+ let currentNode = elementIsFixed ? getParentNode(element) : element;
1871
+
1872
+ // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
1873
+ while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
1874
+ const computedStyle = getComputedStyle$1(currentNode);
1875
+ const currentNodeIsContaining = isContainingBlock(currentNode);
1876
+ // Position of the containing block chain below the current node. A fixed
1877
+ // element whose containing block hasn't been found yet is a fixed chain.
1878
+ const lastPosition = lastKeptComputedStyle ? lastKeptComputedStyle.position : elementIsFixed ? 'fixed' : '';
1879
+
1880
+ // A non-containing ancestor does not clip the element when the chain
1881
+ // below it escapes it: a fixed chain escapes all ancestors up to the
1882
+ // next containing block, an absolute chain escapes static ancestors.
1883
+ const shouldDropCurrentNode = !currentNodeIsContaining && (lastPosition === 'fixed' || lastPosition === 'absolute' && computedStyle.position === 'static');
1884
+ if (shouldDropCurrentNode) {
1885
+ // Drop non-containing blocks.
1886
+ result = result.filter(ancestor => ancestor !== currentNode);
1887
+ } else {
1888
+ // The kept node carries the chain position for the next iteration.
1889
+ lastKeptComputedStyle = computedStyle;
1890
+ }
1891
+ currentNode = getParentNode(currentNode);
1892
+ }
1893
+ cache.set(element, result);
1894
+ return result;
1895
+ }
1896
+
1897
+ // Gets the maximum area that the element is visible in due to any number of
1898
+ // clipping ancestors.
1899
+ function getClippingRect(_ref) {
1900
+ let {
1901
+ element,
1902
+ boundary,
1903
+ rootBoundary,
1904
+ strategy
1905
+ } = _ref;
1906
+ const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
1907
+ const clippingAncestors = [...elementClippingAncestors, rootBoundary];
1908
+ const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
1909
+ let top = firstRect.top;
1910
+ let right = firstRect.right;
1911
+ let bottom = firstRect.bottom;
1912
+ let left = firstRect.left;
1913
+ for (let i = 1; i < clippingAncestors.length; i++) {
1914
+ const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
1915
+ top = max(rect.top, top);
1916
+ right = min(rect.right, right);
1917
+ bottom = min(rect.bottom, bottom);
1918
+ left = max(rect.left, left);
1919
+ }
1920
+ return {
1921
+ width: right - left,
1922
+ height: bottom - top,
1923
+ x: left,
1924
+ y: top
1925
+ };
1926
+ }
1927
+
1928
+ function getDimensions(element) {
1929
+ const {
1930
+ width,
1931
+ height
1932
+ } = getCssDimensions(element);
1933
+ return {
1934
+ width,
1935
+ height
1936
+ };
1937
+ }
1938
+
1939
+ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
1940
+ const isOffsetParentAnElement = isHTMLElement(offsetParent);
1941
+ const documentElement = getDocumentElement(offsetParent);
1942
+ const isFixed = strategy === 'fixed';
1943
+ const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
1944
+ let scroll = {
1945
+ scrollLeft: 0,
1946
+ scrollTop: 0
1947
+ };
1948
+ const offsets = createCoords(0);
1949
+ if (isOffsetParentAnElement || !isFixed) {
1950
+ if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
1951
+ scroll = getNodeScroll(offsetParent);
1952
+ }
1953
+ if (isOffsetParentAnElement) {
1954
+ const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
1955
+ offsets.x = offsetRect.x + offsetParent.clientLeft;
1956
+ offsets.y = offsetRect.y + offsetParent.clientTop;
1957
+ }
1958
+ }
1959
+
1960
+ // If the <body> scrollbar appears on the left (e.g. RTL systems). Use
1961
+ // Firefox with layout.scrollbar.side = 3 in about:config to test this.
1962
+ if (!isOffsetParentAnElement && documentElement) {
1963
+ offsets.x = getWindowScrollBarX(documentElement);
1964
+ }
1965
+ const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
1966
+ const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
1967
+ const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
1968
+ return {
1969
+ x,
1970
+ y,
1971
+ width: rect.width,
1972
+ height: rect.height
1973
+ };
1974
+ }
1975
+
1976
+ function isStaticPositioned(element) {
1977
+ return getComputedStyle$1(element).position === 'static';
1978
+ }
1979
+
1980
+ function getTrueOffsetParent(element, polyfill) {
1981
+ if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
1982
+ return null;
1983
+ }
1984
+ if (polyfill) {
1985
+ return polyfill(element);
1986
+ }
1987
+ let rawOffsetParent = element.offsetParent;
1988
+
1989
+ // Firefox returns the <html> element as the offsetParent if it's non-static,
1990
+ // while Chrome and Safari return the <body> element. The <body> element must
1991
+ // be used to perform the correct calculations even if the <html> element is
1992
+ // non-static.
1993
+ if (getDocumentElement(element) === rawOffsetParent) {
1994
+ rawOffsetParent = rawOffsetParent.ownerDocument.body;
1995
+ }
1996
+ return rawOffsetParent;
1997
+ }
1998
+
1999
+ // Gets the closest ancestor positioned element. Handles some edge cases,
2000
+ // such as table ancestors and cross browser bugs.
2001
+ function getOffsetParent(element, polyfill) {
2002
+ const win = getWindow(element);
2003
+ if (isTopLayer(element)) {
2004
+ return win;
2005
+ }
2006
+ if (!isHTMLElement(element)) {
2007
+ let svgOffsetParent = getParentNode(element);
2008
+ while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
2009
+ if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
2010
+ return svgOffsetParent;
2011
+ }
2012
+ svgOffsetParent = getParentNode(svgOffsetParent);
2013
+ }
2014
+ return win;
2015
+ }
2016
+ let offsetParent = getTrueOffsetParent(element, polyfill);
2017
+ while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
2018
+ offsetParent = getTrueOffsetParent(offsetParent, polyfill);
2019
+ }
2020
+ if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
2021
+ return win;
2022
+ }
2023
+ return offsetParent || getContainingBlock(element) || win;
2024
+ }
2025
+
2026
+ const getElementRects = async function (data) {
2027
+ const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
2028
+ const getDimensionsFn = this.getDimensions;
2029
+ const floatingDimensions = await getDimensionsFn(data.floating);
2030
+ return {
2031
+ reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
2032
+ floating: {
2033
+ x: 0,
2034
+ y: 0,
2035
+ width: floatingDimensions.width,
2036
+ height: floatingDimensions.height
2037
+ }
2038
+ };
2039
+ };
2040
+
2041
+ function isRTL(element) {
2042
+ return getComputedStyle$1(element).direction === 'rtl';
2043
+ }
2044
+
2045
+ const platform = {
2046
+ convertOffsetParentRelativeRectToViewportRelativeRect,
2047
+ getDocumentElement,
2048
+ getClippingRect,
2049
+ getOffsetParent,
2050
+ getElementRects,
2051
+ getClientRects,
2052
+ getDimensions,
2053
+ getScale,
2054
+ isElement,
2055
+ isRTL
2056
+ };
2057
+
2058
+ function rectsAreEqual(a, b) {
2059
+ return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
2060
+ }
2061
+
2062
+ // https://samthor.au/2021/observing-dom/
2063
+ function observeMove(element, onMove, ancestorResize) {
2064
+ let io = null;
2065
+ let timeoutId;
2066
+ const root = getDocumentElement(element);
2067
+ function cleanup() {
2068
+ var _io;
2069
+ clearTimeout(timeoutId);
2070
+ (_io = io) == null || _io.disconnect();
2071
+ io = null;
2072
+ }
2073
+ function refresh(skip, threshold) {
2074
+ if (skip === void 0) {
2075
+ skip = false;
2076
+ }
2077
+ if (threshold === void 0) {
2078
+ threshold = 1;
2079
+ }
2080
+ cleanup();
2081
+ const elementRectForRootMargin = element.getBoundingClientRect();
2082
+ const {
2083
+ left,
2084
+ top,
2085
+ width,
2086
+ height
2087
+ } = elementRectForRootMargin;
2088
+ if (!skip) {
2089
+ onMove();
2090
+ }
2091
+ if (!width || !height) {
2092
+ return;
2093
+ }
2094
+ const insetTop = floor(top);
2095
+ const insetRight = floor(root.clientWidth - (left + width));
2096
+ const insetBottom = floor(root.clientHeight - (top + height));
2097
+ const insetLeft = floor(left);
2098
+ const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
2099
+ const options = {
2100
+ rootMargin,
2101
+ threshold: max(0, min(1, threshold)) || 1
2102
+ };
2103
+ let isFirstUpdate = true;
2104
+ function handleObserve(entries) {
2105
+ const ratio = entries[0].intersectionRatio;
2106
+
2107
+ // The entry is a snapshot, so the reference may have moved since the
2108
+ // intersection was computed (under performance constraints, or between
2109
+ // consecutive frames of a multi-frame layout shift). The reported ratio
2110
+ // and the observed area are stale in that case and cannot be trusted to
2111
+ // detect subsequent movement, so refresh regardless of the ratio.
2112
+ if (!rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
2113
+ return refresh();
2114
+ }
2115
+ if (ratio !== threshold) {
2116
+ if (!isFirstUpdate) {
2117
+ return refresh();
2118
+ }
2119
+ if (!ratio) {
2120
+ // If the reference is clipped in place, the ratio is 0. Throttle
2121
+ // the refresh to prevent an infinite loop of updates.
2122
+ timeoutId = setTimeout(() => {
2123
+ refresh(false, 1e-7);
2124
+ }, 1000);
2125
+ } else {
2126
+ refresh(false, ratio);
2127
+ }
2128
+ }
2129
+ isFirstUpdate = false;
2130
+ }
2131
+
2132
+ // Older browsers don't support a `document` as the root and will throw an
2133
+ // error.
2134
+ try {
2135
+ io = new IntersectionObserver(handleObserve, {
2136
+ ...options,
2137
+ // Handle <iframe>s
2138
+ root: root.ownerDocument
2139
+ });
2140
+ } catch (_e) {
2141
+ io = new IntersectionObserver(handleObserve, options);
2142
+ }
2143
+ io.observe(element);
2144
+ }
2145
+ const win = getWindow(element);
2146
+ // The window is a resize ancestor, so when `ancestorResize` is enabled its
2147
+ // listener already runs the update on resize. Here we only need to rebuild
2148
+ // the `IntersectionObserver` for the new root size, skipping a redundant
2149
+ // update. When `ancestorResize` is disabled, this becomes the sole update.
2150
+ const handleResize = () => refresh(ancestorResize);
2151
+ win.addEventListener('resize', handleResize);
2152
+ refresh(true);
2153
+ return () => {
2154
+ win.removeEventListener('resize', handleResize);
2155
+ cleanup();
2156
+ };
2157
+ }
2158
+
2159
+ /**
2160
+ * Automatically updates the position of the floating element when necessary.
2161
+ * Should only be called when the floating element is mounted on the DOM or
2162
+ * visible on the screen.
2163
+ * @returns cleanup function that should be invoked when the floating element is
2164
+ * removed from the DOM or hidden from the screen.
2165
+ * @see https://floating-ui.com/docs/autoUpdate
2166
+ */
2167
+ function autoUpdate(reference, floating, update, options) {
2168
+ if (options === void 0) {
2169
+ options = {};
2170
+ }
2171
+ const {
2172
+ ancestorScroll = true,
2173
+ ancestorResize = true,
2174
+ elementResize = typeof ResizeObserver === 'function',
2175
+ layoutShift = typeof IntersectionObserver === 'function',
2176
+ animationFrame = false
2177
+ } = options;
2178
+ const referenceEl = unwrapElement(reference);
2179
+ const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...(floating ? getOverflowAncestors(floating) : [])] : [];
2180
+ ancestors.forEach(ancestor => {
2181
+ ancestorScroll && ancestor.addEventListener('scroll', update);
2182
+ ancestorResize && ancestor.addEventListener('resize', update);
2183
+ });
2184
+ const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update, ancestorResize) : null;
2185
+ let reobserveFrame = -1;
2186
+ let resizeObserver = null;
2187
+ if (elementResize) {
2188
+ resizeObserver = new ResizeObserver(_ref => {
2189
+ let [firstEntry] = _ref;
2190
+ if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) {
2191
+ // Prevent update loops when using the `size` middleware.
2192
+ // https://github.com/floating-ui/floating-ui/issues/1740
2193
+ resizeObserver.unobserve(floating);
2194
+ cancelAnimationFrame(reobserveFrame);
2195
+ reobserveFrame = requestAnimationFrame(() => {
2196
+ var _resizeObserver;
2197
+ (_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
2198
+ });
2199
+ }
2200
+ update();
2201
+ });
2202
+ if (referenceEl && !animationFrame) {
2203
+ resizeObserver.observe(referenceEl);
2204
+ }
2205
+ if (floating) {
2206
+ resizeObserver.observe(floating);
2207
+ }
2208
+ }
2209
+ let frameId;
2210
+ let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
2211
+ if (animationFrame) {
2212
+ frameLoop();
2213
+ }
2214
+ function frameLoop() {
2215
+ const nextRefRect = getBoundingClientRect(reference);
2216
+ if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
2217
+ update();
2218
+ }
2219
+ prevRefRect = nextRefRect;
2220
+ frameId = requestAnimationFrame(frameLoop);
2221
+ }
2222
+ update();
2223
+ return () => {
2224
+ var _resizeObserver2;
2225
+ ancestors.forEach(ancestor => {
2226
+ ancestorScroll && ancestor.removeEventListener('scroll', update);
2227
+ ancestorResize && ancestor.removeEventListener('resize', update);
2228
+ });
2229
+ cleanupIo == null || cleanupIo();
2230
+ (_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
2231
+ resizeObserver = null;
2232
+ if (animationFrame) {
2233
+ cancelAnimationFrame(frameId);
2234
+ }
2235
+ };
2236
+ }
2237
+
2238
+ /**
2239
+ * Modifies the placement by translating the floating element along the
2240
+ * specified axes.
2241
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
2242
+ * object may be passed.
2243
+ * @see https://floating-ui.com/docs/offset
2244
+ */
2245
+ const offset = offset$1;
2246
+
2247
+ /**
2248
+ * Optimizes the visibility of the floating element by choosing the placement
2249
+ * that has the most space available automatically, without needing to specify a
2250
+ * preferred placement. Alternative to `flip`.
2251
+ * @see https://floating-ui.com/docs/autoPlacement
2252
+ */
2253
+ const autoPlacement = autoPlacement$1;
2254
+
2255
+ /**
2256
+ * Optimizes the visibility of the floating element by shifting it in order to
2257
+ * keep it in view when it will overflow the clipping boundary.
2258
+ * @see https://floating-ui.com/docs/shift
2259
+ */
2260
+ const shift = shift$1;
2261
+
2262
+ /**
2263
+ * Optimizes the visibility of the floating element by flipping the `placement`
2264
+ * in order to keep it in view when the preferred placement(s) will overflow the
2265
+ * clipping boundary. Alternative to `autoPlacement`.
2266
+ * @see https://floating-ui.com/docs/flip
2267
+ */
2268
+ const flip = flip$1;
2269
+
2270
+ /**
2271
+ * Computes the `x` and `y` coordinates that will place the floating element
2272
+ * next to a given reference element.
2273
+ */
2274
+ const computePosition = (reference, floating, options) => {
2275
+ // This caches the expensive `getClippingElementAncestors` function so that
2276
+ // multiple lifecycle resets re-use the same result. It only lives for a
2277
+ // single call. If other functions become expensive, we can add them as well.
2278
+ const cache = new Map();
2279
+ const mergedOptions = options != null ? options : {};
2280
+ const platformWithCache = {
2281
+ ...platform,
2282
+ ...mergedOptions.platform,
2283
+ _c: cache
2284
+ };
2285
+ return computePosition$1(reference, floating, {
2286
+ ...mergedOptions,
2287
+ platform: platformWithCache
2288
+ });
2289
+ };
2290
+
2291
+ /* eslint-disable line-comment-position, no-inline-comments */
2292
+
2293
+
2294
+ const MAX_CONFIGURATION_COUNT = 10;
2295
+
2296
+ class AuroFloatingUI {
2297
+ /**
2298
+ * @private
2299
+ */
2300
+ static isMousePressed = false;
2301
+
2302
+ /**
2303
+ * @private
2304
+ */
2305
+ static isMousePressHandlerInitialized = false;
2306
+
2307
+ /**
2308
+ * @private
2309
+ */
2310
+ static setupMousePressChecker() {
2311
+ if (
2312
+ !AuroFloatingUI.isMousePressHandlerInitialized &&
2313
+ window &&
2314
+ window.addEventListener
2315
+ ) {
2316
+ AuroFloatingUI.isMousePressHandlerInitialized = true;
2317
+
2318
+ // Track timeout for isMousePressed reset to avoid race conditions
2319
+ if (!AuroFloatingUI._mousePressedTimeout) {
2320
+ AuroFloatingUI._mousePressedTimeout = null;
2321
+ }
2322
+ const mouseEventGlobalHandler = (event) => {
2323
+ const isPressed = event.type === "mousedown";
2324
+ if (isPressed) {
2325
+ // Clear any pending timeout to prevent race condition
2326
+ if (AuroFloatingUI._mousePressedTimeout !== null) {
2327
+ clearTimeout(AuroFloatingUI._mousePressedTimeout);
2328
+ AuroFloatingUI._mousePressedTimeout = null;
2329
+ }
2330
+ if (!AuroFloatingUI.isMousePressed) {
2331
+ AuroFloatingUI.isMousePressed = true;
2332
+ }
2333
+ } else if (AuroFloatingUI.isMousePressed && !isPressed) {
2334
+ // Schedule reset and track timeout ID
2335
+ AuroFloatingUI._mousePressedTimeout = setTimeout(() => {
2336
+ AuroFloatingUI.isMousePressed = false;
2337
+ AuroFloatingUI._mousePressedTimeout = null;
2338
+ }, 0);
2339
+ }
2340
+ };
2341
+
2342
+ window.addEventListener("mousedown", mouseEventGlobalHandler);
2343
+ window.addEventListener("mouseup", mouseEventGlobalHandler);
2344
+ }
2345
+ }
2346
+
2347
+ static openingQueue = [];
2348
+
2349
+ /**
2350
+ * Returns the currently active floating UI instance that should be considered "on top".
2351
+ * Prefers any globally tracked expanded dropdown or floater, falling back to the last entry in the local opening queue.
2352
+ *
2353
+ * This getter first checks the global document references for a visible floating UI and returns it if found.
2354
+ * If the global reference is stale or not visible, it clears those references and instead returns the most recently opened instance from `openingQueue`, or `null` if none exist.
2355
+ *
2356
+ * Side effect: clears stale global refs so callers don't need a separate cleanup step.
2357
+ */
2358
+ static get topOpeningFloatingUI() {
2359
+ const existedVisibleFloatingUI =
2360
+ document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
2361
+ if (
2362
+ existedVisibleFloatingUI &&
2363
+ existedVisibleFloatingUI.element.isPopoverVisible
2364
+ ) {
2365
+ return existedVisibleFloatingUI;
2366
+ }
2367
+
2368
+ // clear existedVisibleFloatingUI in case it's not flushed well when it hidden by other reasons (e.g. noToggle + click)
2369
+ document.expandedAuroFormkitDropdown = null;
2370
+ document.expandedAuroFloater = null;
2371
+
2372
+ return AuroFloatingUI.openingQueue.length > 0
2373
+ ? AuroFloatingUI.openingQueue[AuroFloatingUI.openingQueue.length - 1]
2374
+ : null;
2375
+ }
2376
+
2377
+ constructor(element, behavior) {
2378
+ this.element = element;
2379
+ this.behavior = behavior;
2380
+
2381
+ // Store event listener references for cleanup
2382
+ this.focusHandler = null;
2383
+ this.clickHandler = null;
2384
+ this.keyDownHandler = null;
2385
+ this.touchHandler = null;
2386
+
2387
+ /**
2388
+ * @private
2389
+ */
2390
+ this.enableKeyboardHandling = true;
2391
+
2392
+ /**
2393
+ * @private
2394
+ */
2395
+ this.configureTrial = 0;
2396
+
2397
+ /**
2398
+ * @private
2399
+ */
2400
+ this.eventPrefix = undefined;
2401
+
2402
+ /**
2403
+ * @private
2404
+ */
2405
+ this.id = undefined;
2406
+
2407
+ /**
2408
+ * @private
2409
+ */
2410
+ this.showing = false;
2411
+
2412
+ /**
2413
+ * @private
2414
+ */
2415
+ this.strategy = undefined;
2416
+ }
2417
+
2418
+ /**
2419
+ * Mirrors the size of the bibSizer element to the bib content.
2420
+ * Copies the width, height, max-width, and max-height styles from the bibSizer element to the bib content container.
2421
+ * This ensures that the bib content has the same dimensions as the sizer element.
2422
+ */
2423
+ mirrorSize() {
2424
+ const element = this.element;
2425
+ if (!element) {
2426
+ return;
2427
+ }
2428
+
2429
+ // mirror the boxsize from bibSizer
2430
+ if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
2431
+ const sizerStyle = window.getComputedStyle(element.bibSizer);
2432
+ const bibContent = element.bib.shadowRoot.querySelector(".container");
2433
+ if (!bibContent) {
2434
+ return;
2435
+ }
2436
+
2437
+ if (sizerStyle.width !== "0px") {
2438
+ bibContent.style.width = sizerStyle.width;
2439
+ }
2440
+ if (sizerStyle.height !== "0px") {
2441
+ bibContent.style.height = sizerStyle.height;
2442
+ }
2443
+ bibContent.style.maxWidth = sizerStyle.maxWidth;
2444
+ bibContent.style.maxHeight = sizerStyle.maxHeight;
2445
+ }
2446
+ }
2447
+
2448
+ /**
2449
+ * @private
2450
+ * Determines the positioning strategy based on the current viewport size and mobile breakpoint.
2451
+ *
2452
+ * This method checks if the current viewport width is less than or equal to the specified mobile fullscreen breakpoint
2453
+ * defined in the bib element. If it is, the strategy is set to 'fullscreen'; otherwise, it defaults to 'floating'.
2454
+ *
2455
+ * @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
2456
+ */
2457
+ getPositioningStrategy() {
2458
+ const element = this.element;
2459
+ if (!element) {
2460
+ return "floating";
2461
+ }
2462
+
2463
+ const breakpoint =
2464
+ element.bib?.mobileFullscreenBreakpoint ||
2465
+ element.floaterConfig?.fullscreenBreakpoint;
2466
+ switch (this.behavior) {
2467
+ case "tooltip":
2468
+ return "floating";
2469
+ case "dialog":
2470
+ case "drawer":
2471
+ if (breakpoint) {
2472
+ const smallerThanBreakpoint = window.matchMedia(
2473
+ `(max-width: ${breakpoint})`,
2474
+ ).matches;
2475
+
2476
+ this.element.expanded = smallerThanBreakpoint;
2477
+
2478
+ if (this.element.nested) {
2479
+ return "cover";
2480
+ }
2481
+ return smallerThanBreakpoint || this.element.modal
2482
+ ? "fullscreen"
2483
+ : "dialog";
2484
+ }
2485
+ return "dialog";
2486
+ case "dropdown":
2487
+ case undefined:
2488
+ case null:
2489
+ if (breakpoint) {
2490
+ const smallerThanBreakpoint = window.matchMedia(
2491
+ `(max-width: ${breakpoint})`,
2492
+ ).matches;
2493
+ if (smallerThanBreakpoint) {
2494
+ return "fullscreen";
2495
+ }
2496
+ }
2497
+ return "floating";
2498
+ default:
2499
+ return this.behavior;
2500
+ }
2501
+ }
2502
+
2503
+ /**
2504
+ * @private
2505
+ * Positions the bib element based on the current configuration and positioning strategy.
2506
+ *
2507
+ * This method determines the appropriate positioning strategy (fullscreen or not) and configures the bib accordingly.
2508
+ * It also sets up middleware for the floater configuration, computes the position of the bib relative to the trigger element,
2509
+ * and applies the calculated position to the bib's style.
2510
+ */
2511
+ position() {
2512
+ const element = this.element;
2513
+ if (!element) {
2514
+ return;
2515
+ }
2516
+
2517
+ const strategy = this.getPositioningStrategy();
2518
+ this.configureBibStrategy(strategy);
2519
+
2520
+ if (strategy === "floating") {
2521
+ if (!element.trigger || !element.bib) {
2522
+ return;
2523
+ }
2524
+
2525
+ this.mirrorSize();
2526
+ // Define the middlware for the floater configuration
2527
+ const middleware = [
2528
+ offset(element.floaterConfig?.offset || 0),
2529
+ ...(element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
2530
+ ...(element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
2531
+ ...(element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
2532
+ ];
2533
+
2534
+ // Compute the position of the bib
2535
+ computePosition(element.trigger, element.bib, {
2536
+ strategy: element.floaterConfig?.strategy || "fixed",
2537
+ placement: element.floaterConfig?.placement,
2538
+ middleware: middleware || [],
2539
+ }).then(({ x, y }) => {
2540
+ // eslint-disable-line id-length
2541
+ const currentElement = this.element;
2542
+ if (!currentElement?.bib) {
2543
+ return;
2544
+ }
2545
+
2546
+ Object.assign(currentElement.bib.style, {
2547
+ left: `${x}px`,
2548
+ top: `${y}px`,
2549
+ });
2550
+ });
2551
+ } else if (strategy === "cover") {
2552
+ if (!element.parentNode || !element.bib) {
2553
+ return;
2554
+ }
2555
+
2556
+ // Compute the position of the bib
2557
+ computePosition(element.parentNode, element.bib, {
2558
+ placement: "bottom-start",
2559
+ }).then(({ x, y }) => {
2560
+ // eslint-disable-line id-length
2561
+ const currentElement = this.element;
2562
+ if (!currentElement?.bib || !currentElement.parentNode) {
2563
+ return;
2564
+ }
2565
+
2566
+ Object.assign(currentElement.bib.style, {
2567
+ left: `${x}px`,
2568
+ top: `${y - currentElement.parentNode.offsetHeight}px`,
2569
+ width: `${currentElement.parentNode.offsetWidth}px`,
2570
+ height: `${currentElement.parentNode.offsetHeight}px`,
2571
+ });
2572
+ });
2573
+ }
2574
+ }
2575
+
2576
+ /**
2577
+ * @private
2578
+ * Controls whether to lock the scrolling for the document's body.
2579
+ * @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
2580
+ */
2581
+ lockScroll(lock = true) {
2582
+ const element = this.element;
2583
+
2584
+ if (!element?.bib) {
2585
+ return;
2586
+ }
2587
+
2588
+ const dialog = (
2589
+ element.bib?.shadowRoot ||
2590
+ element.bib ||
2591
+ element
2592
+ ).querySelector("dialog");
2593
+ if (dialog) {
2594
+ if (lock) {
2595
+ dialog.setAttribute("aria-modal", "true");
2596
+ } else {
2597
+ dialog.removeAttribute("aria-modal");
2598
+ }
2599
+ }
2600
+
2601
+ if (lock) {
2602
+ if (!this._scrollLocked) {
2603
+ this._scrollLocked = true;
2604
+ this._savedScrollY = window.scrollY;
2605
+ this._savedScrollStyles = {
2606
+ rootScrollbarGutter: document.documentElement.style.scrollbarGutter,
2607
+ rootOverflow: document.documentElement.style.overflow,
2608
+ bodyOverflow: document.body.style.overflow,
2609
+ bodyPosition: document.body.style.position,
2610
+ bodyTop: document.body.style.top,
2611
+ bodyWidth: document.body.style.width,
2612
+ bibTransform: element?.bib?.style.transform,
2613
+ };
2614
+ document.documentElement.style.scrollbarGutter = "stable";
2615
+ document.documentElement.style.overflow = "hidden";
2616
+ document.body.style.overflow = "hidden";
2617
+
2618
+ // position:fixed is the only way to block VoiceOver three-finger swipe,
2619
+ // which bypasses both overflow:hidden and touchmove preventDefault.
2620
+ document.body.style.position = "fixed";
2621
+ document.body.style.top = `-${this._savedScrollY}px`;
2622
+ document.body.style.width = "100%";
2623
+
2624
+ // Keep the bib aligned with the visual viewport as the VKB opens.
2625
+ // A one-shot offsetTop check at lock time is stale by the time the user
2626
+ // taps an input mid-drawer — iOS then pans visualViewport upward and the
2627
+ // bib drifts off-screen. Listen continuously so the transform tracks the pan.
2628
+ // RAF-throttled to avoid a style recalc on every scroll tick during the
2629
+ // keyboard animation; the pending frame is canceled on unlock so it cannot
2630
+ // reapply a translate after bibTransform has been restored.
2631
+ if (window.visualViewport) {
2632
+ this._viewportRafId = undefined;
2633
+ this._viewportHandler = () => {
2634
+ if (this._viewportRafId !== undefined) {
2635
+ return;
2636
+ }
2637
+ this._viewportRafId = requestAnimationFrame(() => {
2638
+ this._viewportRafId = undefined;
2639
+ if (element?.bib) {
2640
+ element.bib.style.transform = `translateY(${window.visualViewport.offsetTop}px)`;
2641
+ }
2642
+ });
2643
+ };
2644
+ window.visualViewport.addEventListener(
2645
+ "resize",
2646
+ this._viewportHandler,
2647
+ );
2648
+ window.visualViewport.addEventListener(
2649
+ "scroll",
2650
+ this._viewportHandler,
2651
+ );
2652
+ this._viewportHandler();
2653
+ }
2654
+
2655
+ this.lockTouchScroll(true);
2656
+ }
2657
+ } else {
2658
+ if (this._scrollLocked) {
2659
+ if (this._viewportHandler && window.visualViewport) {
2660
+ window.visualViewport.removeEventListener(
2661
+ "resize",
2662
+ this._viewportHandler,
2663
+ );
2664
+ window.visualViewport.removeEventListener(
2665
+ "scroll",
2666
+ this._viewportHandler,
2667
+ );
2668
+ this._viewportHandler = undefined;
2669
+ }
2670
+ if (this._viewportRafId !== undefined) {
2671
+ cancelAnimationFrame(this._viewportRafId);
2672
+ this._viewportRafId = undefined;
2673
+ }
2674
+
2675
+ document.documentElement.style.scrollbarGutter =
2676
+ this._savedScrollStyles?.rootScrollbarGutter ?? "";
2677
+ document.documentElement.style.overflow =
2678
+ this._savedScrollStyles?.rootOverflow ?? "";
2679
+ document.body.style.overflow =
2680
+ this._savedScrollStyles?.bodyOverflow ?? "";
2681
+ document.body.style.position =
2682
+ this._savedScrollStyles?.bodyPosition ?? "";
2683
+ document.body.style.top = this._savedScrollStyles?.bodyTop ?? "";
2684
+ document.body.style.width = this._savedScrollStyles?.bodyWidth ?? "";
2685
+ if (element?.bib) {
2686
+ element.bib.style.transform =
2687
+ this._savedScrollStyles?.bibTransform ?? "";
2688
+ }
2689
+ window.scrollTo(0, this._savedScrollY || 0);
2690
+ this._savedScrollY = undefined;
2691
+ this._savedScrollStyles = undefined;
2692
+ this._scrollLocked = false;
2693
+
2694
+ this.lockTouchScroll(false);
2695
+ }
2696
+ }
2697
+ }
2698
+
2699
+ /**
2700
+ * Locks page-level touch scroll while bib is open.
2701
+ * Walks composedPath() so scrollable children inside the dialog still scroll.
2702
+ * @private
2703
+ */
2704
+ lockTouchScroll(lock = true) {
2705
+ if (lock) {
2706
+ if (this._boundTouchMoveHandler) {
2707
+ return;
2708
+ }
2709
+ this._boundTouchMoveHandler = (e) => {
2710
+ const path = e.composedPath();
2711
+ const insideScrollable = path.some(
2712
+ (el) =>
2713
+ el !== document &&
2714
+ el !== document.documentElement &&
2715
+ el !== document.body &&
2716
+ (el.scrollHeight > el.clientHeight ||
2717
+ el.scrollWidth > el.clientWidth),
2718
+ );
2719
+ if (!insideScrollable) {
2720
+ e.preventDefault();
2721
+ }
2722
+ };
2723
+ document.addEventListener("touchmove", this._boundTouchMoveHandler, {
2724
+ passive: false,
2725
+ });
2726
+ } else if (this._boundTouchMoveHandler) {
2727
+ document.removeEventListener("touchmove", this._boundTouchMoveHandler, {
2728
+ passive: false,
2729
+ });
2730
+ this._boundTouchMoveHandler = undefined;
2731
+ }
2732
+ }
2733
+
2734
+ /**
2735
+ * @private
2736
+ * Configures the bib element's display strategy.
2737
+ *
2738
+ * Sets the bib to fullscreen or floating mode based on the provided strategy.
2739
+ * Dispatches a 'strategy-change' event if the strategy changes.
2740
+ *
2741
+ * @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
2742
+ */
2743
+ configureBibStrategy(value) {
2744
+ const element = this.element;
2745
+ if (!element?.bib) {
2746
+ return;
2747
+ }
2748
+
2749
+ if (value === "fullscreen" || value === "dialog") {
2750
+ element.isBibFullscreen = true;
2751
+ // reset the prev position
2752
+ element.bib.setAttribute("isfullscreen", "");
2753
+ element.bib.style.position = "fixed";
2754
+ element.bib.style.top = "0px";
2755
+ element.bib.style.left = "0px";
2756
+ element.bib.style.width = "";
2757
+ element.bib.style.height = "";
2758
+ element.style.contain = "";
2759
+
2760
+ // reset the size that was mirroring `size` css-part
2761
+ const bibContent = element.bib.shadowRoot?.querySelector(".container");
2762
+ if (bibContent) {
2763
+ bibContent.style.width = "";
2764
+ bibContent.style.height = "";
2765
+ bibContent.style.maxWidth = "";
2766
+ bibContent.style.maxHeight = "";
2767
+ this.configureTrial = 0;
2768
+ } else if (this.configureTrial < MAX_CONFIGURATION_COUNT) {
2769
+ this.configureTrial += 1;
2770
+
2771
+ setTimeout(() => {
2772
+ this.configureBibStrategy(value);
2773
+ }, 0);
2774
+ }
2775
+
2776
+ if (element.isPopoverVisible) {
2777
+ this.lockScroll(value === "fullscreen");
2778
+ }
2779
+ } else {
2780
+ element.bib.style.position = "";
2781
+ element.bib.removeAttribute("isfullscreen");
2782
+ element.isBibFullscreen = false;
2783
+ element.style.contain = "layout";
2784
+ }
2785
+
2786
+ const isChanged = this.strategy && this.strategy !== value;
2787
+ this.strategy = value;
2788
+ if (isChanged) {
2789
+ const event = new CustomEvent(
2790
+ this.eventPrefix
2791
+ ? `${this.eventPrefix}-strategy-change`
2792
+ : "strategy-change",
2793
+ {
2794
+ detail: {
2795
+ value,
2796
+ },
2797
+ composed: true,
2798
+ },
2799
+ );
2800
+
2801
+ element.dispatchEvent(event);
2802
+ }
2803
+ }
2804
+
2805
+ updateState() {
2806
+ const element = this.element;
2807
+ if (!element) {
2808
+ return;
2809
+ }
2810
+
2811
+ const isVisible = element.isPopoverVisible;
2812
+ if (!isVisible) {
2813
+ this.cleanupHideHandlers();
2814
+ try {
2815
+ element.cleanup?.();
2816
+ } catch (error) {
2817
+ // Do nothing
2818
+ }
2819
+ }
2820
+ }
2821
+
2822
+ /**
2823
+ * @private
2824
+ * getting called on 'blur' in trigger or `focusin` in document
2825
+ *
2826
+ * Hides the bib if focus moves outside of the trigger or bib, unless a 'noHideOnThisFocusLoss' flag is set.
2827
+ * This method checks if the currently active element is still within the trigger or bib.
2828
+ * If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
2829
+ */
2830
+ handleFocusLoss() {
2831
+ const element = this.element;
2832
+ if (!element?.bib) {
2833
+ return;
2834
+ }
2835
+
2836
+ // if mouse is being pressed, skip and let click event to handle the action
2837
+ if (AuroFloatingUI.isMousePressed) {
2838
+ return;
2839
+ }
2840
+
2841
+ if (
2842
+ element.noHideOnThisFocusLoss ||
2843
+ element.hasAttribute("noHideOnThisFocusLoss")
2844
+ ) {
2845
+ return;
2846
+ }
2847
+
2848
+ // if focus is still inside of trigger or bib, do not close
2849
+ if (element.matches(":focus") || element.matches(":focus-within")) {
2850
+ return;
2851
+ }
2852
+
2853
+ // Chrome-specific: during popover top-layer promotion after a click on a
2854
+ // slotted focusable, :focus-within can briefly evaluate false while the
2855
+ // active element is still structurally inside the trigger/bib. Fall back
2856
+ // to a shadow-piercing ancestry walk from the deep active element before
2857
+ // treating this as a real focus loss.
2858
+ try {
2859
+ let active = document.activeElement;
2860
+ while (active && active.shadowRoot && active.shadowRoot.activeElement) {
2861
+ active = active.shadowRoot.activeElement;
2862
+ }
2863
+ const targets = [element, element.trigger, element.bib].filter(Boolean);
2864
+ let node = active;
2865
+ while (node) {
2866
+ if (targets.includes(node)) {
2867
+ return;
2868
+ }
2869
+ node =
2870
+ node.parentElement ||
2871
+ (node.getRootNode && node.getRootNode().host) ||
2872
+ null;
2873
+ }
2874
+ } catch (e) {
2875
+ // Defensive: fall through to the existing close path if traversal fails.
2876
+ }
2877
+
2878
+ // if fullscreen bib is in fullscreen mode, do not close
2879
+ if (element.bib.hasAttribute("isfullscreen")) {
2880
+ return;
2881
+ }
2882
+
2883
+ // eventType "focusloss" distinguishes a Tab/click-driven close from an
2884
+ // Escape keydown close. Consumers use this to decide whether to restore
2885
+ // focus to the trigger (Escape) or let it advance naturally (Tab).
2886
+ this.hideBib("focusloss");
2887
+ }
2888
+
2889
+ setupHideHandlers() {
2890
+ const element = this.element;
2891
+ if (!element) {
2892
+ return;
2893
+ }
2894
+
2895
+ // Define handlers & store references
2896
+ this.focusHandler = () => this.handleFocusLoss();
2897
+
2898
+ this.clickHandler = (evt) => {
2899
+ const element = this.element;
2900
+ if (!element?.bib) {
2901
+ return;
2902
+ }
2903
+
2904
+ // When the bib is fullscreen (modal dialog), don't close on outside
2905
+ // clicks. VoiceOver's synthetic click events inside a top-layer modal
2906
+ // <dialog> may not include the bib in composedPath(), causing false
2907
+ // positives. This mirrors the fullscreen guard in handleFocusLoss().
2908
+ if (element.bib.hasAttribute("isfullscreen")) {
2909
+ return;
2910
+ }
2911
+
2912
+ if (
2913
+ (!evt.composedPath().includes(element.trigger) &&
2914
+ !evt.composedPath().includes(element.bib)) ||
2915
+ (element.bib.backdrop &&
2916
+ evt.composedPath().includes(element.bib.backdrop))
2917
+ ) {
2918
+ const existedVisibleFloatingUI =
2919
+ document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
2920
+
2921
+ if (
2922
+ existedVisibleFloatingUI &&
2923
+ existedVisibleFloatingUI.element.isPopoverVisible
2924
+ ) {
2925
+ // if something else is open, close that
2926
+ existedVisibleFloatingUI.hideBib();
2927
+ document.expandedAuroFormkitDropdown = null;
2928
+ document.expandedAuroFloater = this;
2929
+ } else {
2930
+ this.hideBib("click");
2931
+ }
2932
+ }
2933
+ };
2934
+
2935
+ // ESC key handler
2936
+ this.keyDownHandler = (evt) => {
2937
+ const element = this.element;
2938
+ if (!element) {
2939
+ return;
2940
+ }
2941
+
2942
+ if (evt.key === "Escape" && element.isPopoverVisible) {
2943
+ const existedVisibleFloatingUI =
2944
+ document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
2945
+ if (
2946
+ existedVisibleFloatingUI &&
2947
+ existedVisibleFloatingUI !== this &&
2948
+ existedVisibleFloatingUI.element.isPopoverVisible
2949
+ ) {
2950
+ // if something else is open, let it handle itself
2951
+ return;
2952
+ }
2953
+ this.hideBib("keydown");
2954
+ }
2955
+ };
2956
+
2957
+ if (this.behavior !== "drawer" && this.behavior !== "dialog") {
2958
+ // Add event listeners using the stored references
2959
+ document.addEventListener("focusin", this.focusHandler);
2960
+ }
2961
+
2962
+ if (this.enableKeyboardHandling) {
2963
+ document.addEventListener("keydown", this.keyDownHandler);
2964
+ }
2965
+
2966
+ // send this task to the end of queue to prevent conflicting
2967
+ // it conflicts if showBib gets call from a button that's not this.element.trigger
2968
+ setTimeout(() => {
2969
+ window.addEventListener("click", this.clickHandler);
2970
+ }, 0);
2971
+
2972
+ // iOS Safari does not fire `click` on non-interactive elements, so
2973
+ // tapping an inert backdrop never reaches the click handler above.
2974
+ // Mirror the same outside-tap logic with a passive touchstart listener.
2975
+ this.touchHandler = (evt) => {
2976
+ const element = this.element;
2977
+ if (!element?.bib) {
2978
+ return;
2979
+ }
2980
+
2981
+ // fullscreen (modal) dialog handles its own dismissal
2982
+ if (element.bib.hasAttribute("isfullscreen")) {
2983
+ return;
2984
+ }
2985
+
2986
+ const path = evt.composedPath();
2987
+ if (!path.includes(element.trigger) && !path.includes(element.bib)) {
2988
+ this.hideBib("click");
2989
+ }
2990
+ };
2991
+
2992
+ window.addEventListener("touchstart", this.touchHandler, { passive: true });
2993
+ }
2994
+
2995
+ cleanupHideHandlers() {
2996
+ // Remove event listeners if they exist
2997
+
2998
+ if (this.focusHandler) {
2999
+ document.removeEventListener("focusin", this.focusHandler);
3000
+ this.focusHandler = null;
3001
+ }
3002
+
3003
+ if (this.clickHandler) {
3004
+ window.removeEventListener("click", this.clickHandler);
3005
+ this.clickHandler = null;
3006
+ }
3007
+
3008
+ if (this.touchHandler) {
3009
+ window.removeEventListener("touchstart", this.touchHandler);
3010
+ this.touchHandler = null;
3011
+ }
3012
+
3013
+ if (this.keyDownHandler) {
3014
+ document.removeEventListener("keydown", this.keyDownHandler);
3015
+ this.keyDownHandler = null;
3016
+ }
3017
+ }
3018
+
3019
+ handleUpdate(changedProperties) {
3020
+ if (changedProperties.has("isPopoverVisible")) {
3021
+ this.updateState();
3022
+ }
3023
+ }
3024
+
3025
+ updateCurrentExpandedDropdown() {
3026
+ if (!this.element) {
3027
+ return;
3028
+ }
3029
+
3030
+ // Close any other dropdown that is already open
3031
+ const existedVisibleFloatingUI =
3032
+ document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
3033
+ if (
3034
+ existedVisibleFloatingUI &&
3035
+ existedVisibleFloatingUI !== this &&
3036
+ existedVisibleFloatingUI.element.isPopoverVisible &&
3037
+ existedVisibleFloatingUI.eventPrefix === this.eventPrefix
3038
+ ) {
3039
+ existedVisibleFloatingUI.hideBib();
3040
+ }
3041
+
3042
+ document.expandedAuroFloater = this;
3043
+ }
3044
+
3045
+ showBib() {
3046
+ const element = this.element;
3047
+ if (!element) {
3048
+ return;
3049
+ }
3050
+
3051
+ if (!element.bib || (!element.trigger && !element.parentNode)) {
3052
+ return;
3053
+ }
3054
+
3055
+ if (!element.disabled && !this.showing) {
3056
+ this.updateCurrentExpandedDropdown();
3057
+ element.triggerChevron?.setAttribute("data-expanded", true);
3058
+
3059
+ // prevent double showing: isPopovervisible gets first and showBib gets called later
3060
+ if (!this.showing) {
3061
+ if (!element.modal) {
3062
+ this.setupHideHandlers();
3063
+ } else {
3064
+ if (this.keyDownHandler) {
3065
+ document.removeEventListener("keydown", this.keyDownHandler);
3066
+ }
3067
+ this.keyDownHandler = (evt) => {
3068
+ if (evt.key === "Escape" && element.isPopoverVisible) {
3069
+ // Intercept at keydown so CloseWatcher never sees the keystroke.
3070
+ // Canceling `cancel` alone is insufficient — a second Esc with no
3071
+ // intervening user activation triggers the anti-trap and fires `close`
3072
+ // directly, bypassing any `cancel` preventDefault (AB#1613688).
3073
+ // stopImmediatePropagation is intentional: it prevents other document
3074
+ // keydown handlers (e.g. consumer code, auro-dialog) from also acting
3075
+ // on Escape while the modal owns the key.
3076
+ evt.preventDefault();
3077
+ evt.stopImmediatePropagation();
3078
+ }
3079
+ };
3080
+ document.addEventListener("keydown", this.keyDownHandler);
3081
+ }
3082
+ this.showing = true;
3083
+ element.isPopoverVisible = true;
3084
+ this.position();
3085
+ this.dispatchEventDropdownToggle();
3086
+ }
3087
+
3088
+ // Setup auto update to handle resize and scroll
3089
+ element.cleanup = autoUpdate(
3090
+ element.trigger || element.parentNode,
3091
+ element.bib,
3092
+ () => {
3093
+ this.position();
3094
+ },
3095
+ );
3096
+
3097
+ const idx = AuroFloatingUI.openingQueue.indexOf(this);
3098
+ if (idx > -1) {
3099
+ AuroFloatingUI.openingQueue.splice(idx, 1);
3100
+ }
3101
+ AuroFloatingUI.openingQueue.push(this);
3102
+ }
3103
+ }
3104
+
3105
+ /**
3106
+ * Hides the floating UI element.
3107
+ * @param {String} eventType - The event type that triggered the hiding action.
3108
+ */
3109
+ hideBib(eventType = "unknown") {
3110
+ const element = this.element;
3111
+ if (!element) {
3112
+ return;
3113
+ }
3114
+
3115
+ if (element.disabled) {
3116
+ return;
3117
+ }
3118
+
3119
+ // noToggle dropdowns should not close when the trigger is clicked (the
3120
+ // "toggle" behavior), but they CAN still close via other interactions like
3121
+ // Escape key or focus loss.
3122
+ if (element.noToggle && eventType === "click") {
3123
+ return;
3124
+ }
3125
+
3126
+ this.lockScroll(false);
3127
+ element.triggerChevron?.removeAttribute("data-expanded");
3128
+
3129
+ if (element.isPopoverVisible) {
3130
+ element.isPopoverVisible = false;
3131
+ }
3132
+ if (this.showing) {
3133
+ this.cleanupHideHandlers();
3134
+ this.showing = false;
3135
+ this.dispatchEventDropdownToggle(eventType);
3136
+ }
3137
+
3138
+ // Only clear the global reference if the bib was actually hidden.
3139
+ // Clearing it when hideBib is blocked (e.g. noToggle + click) corrupts
3140
+ // the singleton state so other dropdowns can't detect this one is still open.
3141
+ document.expandedAuroFloater = null;
3142
+ const idx = AuroFloatingUI.openingQueue.indexOf(this);
3143
+ if (idx > -1) {
3144
+ AuroFloatingUI.openingQueue.splice(idx, 1);
3145
+ }
3146
+ }
3147
+
3148
+ /**
3149
+ * @private
3150
+ * @returns {void} Dispatches event with an object showing the state of the dropdown.
3151
+ * @param {String} eventType - The event type that triggered the toggle action.
3152
+ */
3153
+ dispatchEventDropdownToggle(eventType) {
3154
+ const element = this.element;
3155
+ if (!element) {
3156
+ return;
3157
+ }
3158
+
3159
+ const event = new CustomEvent(
3160
+ this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
3161
+ {
3162
+ detail: {
3163
+ expanded: this.showing,
3164
+ eventType: eventType || "unknown",
3165
+ },
3166
+ composed: true,
3167
+ },
3168
+ );
3169
+
3170
+ element.dispatchEvent(event);
3171
+ }
3172
+
3173
+ handleClick() {
3174
+ const element = this.element;
3175
+ if (!element) {
3176
+ return;
3177
+ }
3178
+
3179
+ if (element.isPopoverVisible) {
3180
+ this.hideBib("click");
3181
+ } else {
3182
+ this.showBib();
3183
+ }
3184
+
3185
+ const event = new CustomEvent(
3186
+ this.eventPrefix ? `${this.eventPrefix}-triggerClick` : "triggerClick",
3187
+ {
3188
+ composed: true,
3189
+ detail: {
3190
+ expanded: element.isPopoverVisible,
3191
+ },
3192
+ },
3193
+ );
3194
+
3195
+ element.dispatchEvent(event);
3196
+ }
3197
+
3198
+ handleEvent(event) {
3199
+ const element = this.element;
3200
+ if (!element || element.disableEventShow) {
3201
+ return;
3202
+ }
3203
+
3204
+ switch (event.type) {
3205
+ case "keydown": {
3206
+ // Support both Enter and Space keys for accessibility
3207
+ // Space is included as it's expected behavior for interactive elements
3208
+
3209
+ const origin = event.composedPath()[0];
3210
+ if (
3211
+ event.key === "Enter" ||
3212
+ (event.key === " " && (!origin || origin.tagName !== "INPUT"))
3213
+ ) {
3214
+ event.preventDefault();
3215
+ this.handleClick();
3216
+ }
3217
+ break;
3218
+ }
3219
+ case "mouseenter":
3220
+ if (element.hoverToggle) {
3221
+ this.showBib();
3222
+ }
3223
+ break;
3224
+ case "mouseleave":
3225
+ if (element.hoverToggle) {
3226
+ this.hideBib("mouseleave");
3227
+ }
3228
+ break;
3229
+ case "focus":
3230
+ if (element.focusShow) {
3231
+ /*
3232
+ This needs to better handle clicking that gives focus -
3233
+ currently it shows and then immediately hides the bib
3234
+ */
3235
+ this.showBib();
3236
+ }
3237
+ break;
3238
+ case "blur":
3239
+ // send this task 100ms later queue to
3240
+ // wait a frame in case focus moves within the floating element/bib
3241
+ setTimeout(() => this.handleFocusLoss(), 0);
3242
+ break;
3243
+ case "click":
3244
+ if (document.activeElement === document.body) {
3245
+ event.currentTarget.focus();
3246
+ }
3247
+ this.handleClick();
3248
+ break;
3249
+ // Do nothing
3250
+ }
3251
+ }
3252
+
3253
+ /**
3254
+ * Manages the tabIndex of the trigger element based on its focusability.
3255
+ *
3256
+ * If the trigger element or any of its children are inherently focusable, the tabIndex of the component is set to -1.
3257
+ * This prevents the component itself from being focusable when the trigger element already handles focus.
3258
+ */
3259
+ handleTriggerTabIndex() {
3260
+ const element = this.element;
3261
+ if (!element) {
3262
+ return;
3263
+ }
3264
+
3265
+ const focusableElementSelectors = [
3266
+ "a",
3267
+ "button",
3268
+ 'input:not([type="hidden"])',
3269
+ "select",
3270
+ "textarea",
3271
+ '[tabindex]:not([tabindex="-1"])',
3272
+ "auro-button",
3273
+ "auro-input",
3274
+ "auro-hyperlink",
3275
+ ];
3276
+
3277
+ const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
3278
+ if (!triggerNode) {
3279
+ return;
3280
+ }
3281
+ const triggerNodeTagName = triggerNode.tagName.toLowerCase();
3282
+
3283
+ focusableElementSelectors.forEach((selector) => {
3284
+ // Check if the trigger node element is focusable
3285
+ if (triggerNodeTagName === selector) {
3286
+ element.tabIndex = -1;
3287
+ return;
3288
+ }
3289
+
3290
+ // Check if any child is focusable
3291
+ if (triggerNode.querySelector(selector)) {
3292
+ element.tabIndex = -1;
3293
+ }
3294
+ });
3295
+ }
3296
+
3297
+ /**
3298
+ *
3299
+ * @param {*} eventPrefix
3300
+ */
3301
+ regenerateBibId() {
3302
+ const element = this.element;
3303
+ if (!element) {
3304
+ return;
3305
+ }
3306
+
3307
+ this.id = element.getAttribute("id");
3308
+ if (!this.id) {
3309
+ this.id = window.crypto.randomUUID();
3310
+ element.setAttribute("id", this.id);
3311
+ }
3312
+
3313
+ element.bib?.setAttribute("id", `${this.id}-floater-bib`);
3314
+ }
3315
+
3316
+ configure(elem, eventPrefix, enableKeyboardHandling = true) {
3317
+ AuroFloatingUI.setupMousePressChecker();
3318
+ this.enableKeyboardHandling = enableKeyboardHandling;
3319
+
3320
+ this.eventPrefix = eventPrefix;
3321
+ if (this.element !== elem) {
3322
+ this.element = elem;
3323
+ }
3324
+
3325
+ const element = this.element;
3326
+ if (!element) {
3327
+ return;
3328
+ }
3329
+
3330
+ if (this.behavior !== element.behavior) {
3331
+ this.behavior = element.behavior;
3332
+ }
3333
+
3334
+ if (element.trigger) {
3335
+ this.disconnect();
3336
+ }
3337
+ element.trigger =
3338
+ element.triggerElement ||
3339
+ element.shadowRoot?.querySelector("#trigger") ||
3340
+ element.trigger;
3341
+ element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
3342
+ element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
3343
+ element.triggerChevron =
3344
+ element.shadowRoot?.querySelector("#showStateIcon");
3345
+
3346
+ if (element.floaterConfig) {
3347
+ element.hoverToggle = element.floaterConfig.hoverToggle;
3348
+ }
3349
+
3350
+ this.regenerateBibId();
3351
+ this.handleTriggerTabIndex();
3352
+
3353
+ this.handleEvent = this.handleEvent.bind(this);
3354
+ if (element.trigger) {
3355
+ if (this.enableKeyboardHandling) {
3356
+ element.trigger.addEventListener("keydown", this.handleEvent);
3357
+ }
3358
+ element.trigger.addEventListener("click", this.handleEvent);
3359
+ element.trigger.addEventListener("mouseenter", this.handleEvent);
3360
+ element.trigger.addEventListener("mouseleave", this.handleEvent);
3361
+ element.trigger.addEventListener("focus", this.handleEvent);
3362
+ element.trigger.addEventListener("blur", this.handleEvent);
3363
+ }
3364
+ }
3365
+
3366
+ disconnect() {
3367
+ this.cleanupHideHandlers();
3368
+
3369
+ const element = this.element;
3370
+ if (!element) {
3371
+ return;
3372
+ }
3373
+
3374
+ element.cleanup?.();
3375
+
3376
+ if (element.bib && element.shadowRoot) {
3377
+ element.shadowRoot.append(element.bib);
3378
+ }
3379
+
3380
+ // Remove event & keyboard listeners
3381
+ if (element.trigger) {
3382
+ element.trigger.removeEventListener("keydown", this.handleEvent);
3383
+ element.trigger.removeEventListener("click", this.handleEvent);
3384
+ element.trigger.removeEventListener("mouseenter", this.handleEvent);
3385
+ element.trigger.removeEventListener("mouseleave", this.handleEvent);
3386
+ element.trigger.removeEventListener("focus", this.handleEvent);
3387
+ element.trigger.removeEventListener("blur", this.handleEvent);
3388
+ }
3389
+ }
3390
+ }
3391
+
3392
+ class l{generateElementName(t,e){let o=t;return o+="-",o+=e.replace(/[.]/g,"_"),o}generateTag(o,s$1,a){const r=this.generateElementName(o,s$1),i$1=i`${s(r)}`;return customElements.get(r)||customElements.define(r,class extends a{}),i$1}}class d{registerComponent(t,e){customElements.get(t)||customElements.define(t,class extends e{});}closestElement(t,e=this,o=(e,s=e&&e.closest(t))=>e&&e!==document&&e!==window?s||o(e.getRootNode().host):null){return o(e)}handleComponentTagRename(t,e){const o=e.toLowerCase();t.tagName.toLowerCase()!==o&&t.setAttribute(o,true);}elementMatch(t,e){const o=e.toLowerCase();return t.tagName.toLowerCase()===o||t.hasAttribute(o)}getSlotText(t,e){const o=t.shadowRoot?.querySelector(`slot[name="${e}"]`),s=(o?.assignedNodes({flatten:true})||[]).map(t=>t.textContent?.trim()).join(" ").trim();return s||null}}class h{registerComponent(t,e){customElements.get(t)||customElements.define(t,class extends e{});}closestElement(t,e=this,o=(e,s=e&&e.closest(t))=>e&&e!==document&&e!==window?s||o(e.getRootNode().host):null){return o(e)}handleComponentTagRename(t,e){const o=e.toLowerCase();t.tagName.toLowerCase()!==o&&t.setAttribute(o,true);}elementMatch(t,e){const o=e.toLowerCase();return t.tagName.toLowerCase()===o||t.hasAttribute(o)}}var c=i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]),:host([appearance=brand]){--ds-auro-loader-color: var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-loader-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([orbit])>span{--ds-auro-loader-background-color: transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color: currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color: currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}
3393
+ `,u$1=i$5`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0;box-sizing:border-box}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin: .375rem;--margin-xs: .2rem;--margin-sm: .5rem;--margin-md: .75rem;--margin-lg: 1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin) * 6);height:calc(1rem + var(--margin) * 2)}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(1.95rem + var(--margin-xs) * 6);height:calc(.65rem + var(--margin-xs) * 2)}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm) * 6);height:calc(2rem + var(--margin-sm) * 2)}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md) * 6);height:calc(3rem + var(--margin-md) * 2)}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg) * 6);height:calc(5rem + var(--margin-lg) * 2)}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-.4s}:host([pulse])>span:nth-child(2){animation-delay:-.2s}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,to{opacity:.1;transform:scale(.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}to{left:110%}}:host>.no-animation{display:none}@media (prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center}:host>span{opacity:1}:host>.loader{display:none}:host>svg{display:none}:host>.no-animation{display:block}}
3394
+ `,p$1=i$5`:host{--ds-auro-loader-background-color: currentcolor;--ds-auro-loader-border-color: currentcolor;--ds-auro-loader-color: currentcolor}
3395
+ `;class b extends i$2{constructor(){super(),this.appearance="default",this.keys=[0,1,2,3,4,5,6,7,8,9],this.mdCount=3,this.smCount=2,this.runtimeUtils=new h,this.orbit=false,this.ringworm=false,this.laser=false,this.pulse=false;}static get properties(){return {appearance:{type:String,reflect:true},laser:{type:Boolean,reflect:true},orbit:{type:Boolean,reflect:true},pulse:{type:Boolean,reflect:true},ringworm:{type:Boolean,reflect:true}}}static get styles(){return [u$1,c,p$1]}static register(t="auro-loader"){h.prototype.registerComponent(t,b);}firstUpdated(){this.runtimeUtils.handleComponentTagRename(this,"auro-loader");}connectedCallback(){super.connectedCallback();}defineTemplate(){let t=Array.from(Array(this.mdCount).keys());return this.orbit||this.laser?t=Array.from(Array(this.smCount).keys()):this.ringworm&&(t=Array.from(Array(0).keys())),t}render(){return b$1`
3396
+ ${this.defineTemplate().map(t=>b$1`
3397
+ <span part="element" class="loader node-${t}"></span>
3398
+ `)}
3399
+
3400
+ <div class="no-animation body-default">Loading...</div>
3401
+
3402
+ ${this.ringworm?b$1`
3403
+ <svg part="element" class="circular" viewBox="25 25 50 50">
3404
+ <circle class="path" cx="50" cy="50" r="20" fill="none"/>
3405
+ </svg>`:""}
3406
+ `}}const m$1=new WeakMap,v=new WeakMap,x=({host:t,target:e,matcher:o,removeOriginal:s=true})=>{v.has(t)||v.set(t,{matchers:new Set,targets:new Map});const a=v.get(t);return a.matchers.add(o),a.targets.has(e)||a.targets.set(e,new Map),a.targets.get(e).set(o,{removeOriginal:s,currentAttributes:new Map}),f$1({host:t,target:e,matcher:o,removeOriginal:s}),y$1(t),{cleanup:()=>g$1(t,e,o),getObservedAttributes:()=>A(t,e,o),getObservedAttribute:s=>S(t,e,o,s)}},g$1=(t,e,o)=>{const s=v.get(t);if(!s)return;const a=s.targets.get(e);a&&(a.delete(o),0===a.size&&s.targets.delete(e));let r=false;for(const t of s.targets.values())if(t.has(o)){r=true;break}r||s.matchers.delete(o),0!==s.targets.size&&0!==s.matchers.size||w$1(t);},f$1=({host:t,target:e,matcher:o,removeOriginal:s=true})=>{const a=t.getAttributeNames().filter(t=>o(t)).reduce((e,o)=>(e[o]=t.getAttribute(o),e),{});Object.entries(a).forEach(([a,r])=>{k$1(t,e,o,a,r),e.setAttribute(a,r),s&&t.removeAttribute(a);});},y$1=t=>{if(m$1.has(t))return m$1.get(t);const e=new MutationObserver(e=>{const o=v.get(t);o&&e.filter(t=>"attributes"===t.type).forEach(e=>{const s=e.attributeName;for(const e of o.matchers)if(e(s))for(const[s,a]of o.targets.entries())if(a.has(e)){const{removeOriginal:o}=a.get(e);f$1({host:t,target:s,matcher:e,removeOriginal:o});}});});return e.observe(t,{attributes:true}),m$1.set(t,e),e},w$1=t=>{if(m$1.has(t)){m$1.get(t).disconnect(),m$1.delete(t);}v.has(t)&&v.delete(t);},z$1=(t,e,o)=>{const s=v.get(t);if(!s)return;const a=s.targets.get(e);return a?a.get(o):void 0},k$1=(t,e,o,s,a)=>{const r=z$1(t,e,o);r&&r.currentAttributes.set(s,a);},S=(t,e,o,s)=>{const a=z$1(t,e,o);if(a)return a.currentAttributes.get(s)},A=(t,e,o)=>{const s=z$1(t,e,o);return s?Array.from(s.currentAttributes.entries()):[]},q={"aria-":t=>t.startsWith("aria-"),role:t=>t.match(/^role$/)},B=({host:t,target:e,removeOriginal:o=true})=>(({host:t,target:e,match:o,removeOriginal:s=true})=>{if("object"!=typeof t||!(t instanceof HTMLElement))throw new TypeError('a11yUtilities.js | transportAttributes | The "host" parameter must be an instance of HTMLElement.');if("object"!=typeof e||!(e instanceof HTMLElement))throw new TypeError('a11yUtilities.js | transportAttributes | The "target" parameter must be an instance of HTMLElement.');if("function"!=typeof o)throw new TypeError('a11yUtilities.js | transportAttributes | The "match" parameter must be a function.');if("boolean"!=typeof s)throw new TypeError('a11yUtilities.js | transportAttributes | The "removeOriginal" parameter must be a boolean.');return x({host:t,target:e,matcher:o,removeOriginal:s})})({host:t,target:e,match:t=>{for(const e in q)if(q[e](t))return true;return false},removeOriginal:o});class C extends i$2{attributeWatcher;static get properties(){return {layout:{type:String,attribute:"layout",reflect:true},shape:{type:String,attribute:"shape",reflect:true},size:{type:String,attribute:"size",reflect:true},appearance:{type:String,reflect:true},onDark:{type:Boolean,attribute:"ondark",reflect:true},wrapper:{attribute:false,reflect:false}}}constructor(){super(),this.onDark=false,this.appearance="default";}resetShapeClasses(){this.shape&&this.size&&this.wrapper&&(this.wrapper.classList.forEach(t=>{t.startsWith("shape-")&&this.wrapper.classList.remove(t);}),this.wrapper.classList.add(`shape-${this.shape.toLowerCase()}-${this.size.toLowerCase()}`));}resetLayoutClasses(){this.layout&&this.wrapper&&(this.wrapper.classList.forEach(t=>{t.startsWith("layout-")&&this.wrapper.classList.remove(t);}),this.wrapper.classList.add(`layout-${this.layout.toLowerCase()}`));}updateComponentArchitecture(){this.resetLayoutClasses(),this.resetShapeClasses();}updated(t){(t.has("layout")||t.has("shape")||t.has("size"))&&this.updateComponentArchitecture();}firstUpdated(){super.firstUpdated(),this.wrapper=this.shadowRoot.querySelector(".wrapper"),this.attributeWatcher=B({host:this,target:this.shadowRoot.querySelector(".wrapper")});}disconnectedCallback(){super.disconnectedCallback(),this.attributeWatcher&&(this.attributeWatcher.cleanup(),this.attributeWatcher=null);}render(){try{return this.renderLayout()}catch(t){return console.error("Failed to get the defined layout - using the default layout",t),this.getLayout("default")}}}var U=i$5`[auro-loader]{color:var(--ds-auro-button-loader-color, #ffffff)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image),var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}:host(:focus-within) .auro-button{outline-color:var(--ds-auro-button-border-inset-color)}:host(:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border-hover, #00274a)}:host([disabled]){--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}:host([variant=secondary]){--ds-auro-button-container-color: var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image: var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color: var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color: var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color: var(--ds-advanced-color-button-secondary-text, #01426a)}:host([variant=secondary]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-container-color: var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image: var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color: var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color: var(--ds-advanced-color-button-secondary-text-hover, #00274a)}:host([variant=secondary]:focus-within){--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused, #01426a)}:host([variant=secondary][disabled]){--ds-auro-button-container-color: var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image: var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color: var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([variant=tertiary]){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, .05));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, .05));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color: var(--ds-advanced-color-button-tertiary-text, #01426a)}:host([variant=tertiary]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, .1));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, .1));--ds-auro-button-border-color: transparent}:host([variant=tertiary]:focus-within){--ds-auro-button-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused, #01426a)}:host([variant=tertiary][disabled]){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, .05));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, .05));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([variant=ghost]){--ds-auro-button-container-color: transparent;--ds-auro-button-container-image: transparent;--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-advanced-color-button-ghost-text, #01426a);--ds-auro-button-loader-color: var(--ds-advanced-color-button-ghost-text, #01426a)}:host([variant=ghost]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-container-color: var(--ds-advanced-color-button-ghost-background-hover, rgba(0, 0, 0, .05));--ds-auro-button-container-image: var(--ds-advanced-color-button-ghost-background-hover, rgba(0, 0, 0, .05));--ds-auro-button-border-color: transparent}:host([variant=ghost]:focus-within){--ds-auro-button-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused, #01426a)}:host([variant=ghost][disabled]){--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([variant=flat]) .auro-button{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}:host([variant=flat]) .auro-button:active:not(:disabled),:host([variant=flat]) .auro-button:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}:host([variant=flat]) .auro-button:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}:host([variant=flat]:focus-within){--ds-auro-button-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused, #01426a)}:host([onDark]),:host([appearance=inverse]){--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-loader-color: var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-text-color: var(--ds-advanced-color-button-primary-text-inverse, #01426a)}:host([ondark]:not([disabled]):is([data-hover],[data-active])),:host([appearance=inverse]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}:host([ondark]:focus-within),:host([appearance=inverse]:focus-within){--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused, #01426a)}:host([ondark][disabled]),:host([appearance=inverse][disabled]){--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, .75));--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, .75));--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, .75));--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([ondark][variant=secondary]),:host([appearance=inverse][variant=secondary]){--ds-auro-button-container-color: transparent;--ds-auro-button-container-image: transparent;--ds-auro-button-border-color: var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color: var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color: var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}:host([ondark][variant=secondary]:not([disabled]):is([data-hover],[data-active])),:host([appearance=inverse][variant=secondary]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-text-color: var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-container-color: var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, .1));--ds-auro-button-container-image: var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, .1))}:host([ondark][variant=secondary]:focus-within),:host([appearance=inverse][variant=secondary]:focus-within){--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([ondark][variant=secondary][disabled]),:host([appearance=inverse][variant=secondary][disabled]){--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color: var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}:host([ondark][variant=tertiary]),:host([appearance=inverse][variant=tertiary]){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, .05));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, .05));--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color: var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}:host([ondark][variant=tertiary]:not([disabled]):is([data-hover],[data-active])),:host([appearance=inverse][variant=tertiary]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, .1));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, .1))}:host([ondark][variant=tertiary]:focus-within),:host([appearance=inverse][variant=tertiary]:focus-within){--ds-auro-button-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([ondark][variant=tertiary][disabled]),:host([appearance=inverse][variant=tertiary][disabled]){--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([ondark][variant=ghost]),:host([appearance=inverse][variant=ghost]){--ds-auro-button-container-color: transparent;--ds-auro-button-container-image: transparent;--ds-auro-button-border-color: transparent;--ds-auro-button-text-color: var(--ds-advanced-color-button-ghost-text-inverse, #ffffff);--ds-auro-button-loader-color: var(--ds-advanced-color-button-ghost-text-inverse, #ffffff)}:host([ondark][variant=ghost]:not([disabled]):is([data-hover],[data-active])),:host([appearance=inverse][variant=ghost]:not([disabled]):is([data-hover],[data-active])){--ds-auro-button-container-color: var(--ds-advanced-color-button-ghost-background-inverse-hover, rgba(255, 255, 255, .05));--ds-auro-button-container-image: var(--ds-advanced-color-button-ghost-background-inverse-hover, rgba(255, 255, 255, .05));--ds-auro-button-border-color: transparent}:host([ondark][variant=ghost]:focus-within),:host([appearance=inverse][variant=ghost]:focus-within){border-color:transparent;--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([ondark][variant=ghost][disabled]),:host([appearance=inverse][variant=ghost][disabled]){--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([ondark][variant=flat]) .auro-button,:host([appearance=inverse][variant=flat]) .auro-button{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}:host([ondark][variant=flat]) .auro-button:active:not(:disabled),:host([ondark][variant=flat]) .auro-button:hover:not(:disabled),:host([appearance=inverse][variant=flat]) .auro-button:active:not(:disabled),:host([appearance=inverse][variant=flat]) .auro-button:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}:host([ondark][variant=flat]) .auro-button:disabled,:host([appearance=inverse][variant=flat]) .auro-button:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}:host([ondark][variant=flat]:focus-within),:host([appearance=inverse][variant=flat]:focus-within){--ds-auro-button-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}
3407
+ `,H=i$5`.shape-rounded-xl{min-height:68px;max-height:68px;border-style:solid;overflow:hidden;border-radius:6px}.shape-rounded-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-rounded-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-rounded-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-xl{min-height:68px;max-height:68px;border-style:solid;overflow:hidden;border-radius:36px}.shape-pill-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-left-xl{min-height:68px;max-height:68px;border-style:solid;overflow:hidden;border-radius:36px 0 0 36px}.shape-pill-left-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-left-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-left-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-pill-right-xl{min-height:68px;max-height:68px;border-style:solid;overflow:hidden;border-radius:0 36px 36px 0}.shape-pill-right-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-pill-right-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-pill-right-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-circle-xl{min-height:68px;max-height:68px;border-style:solid;overflow:hidden;border-radius:50%;min-width:72px;max-width:72px;padding:0}.shape-circle-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-circle-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-circle-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-square-xl{min-height:68px;max-height:68px;border-style:solid;overflow:hidden;border-radius:6px;min-width:72px;max-width:72px;padding:0}.shape-square-xl.simple{border-width:0px;min-height:72px;max-height:72px;background-color:unset;box-shadow:none}.shape-square-xl.thin{border-width:1px;min-height:70px;max-height:70px;background-color:unset}.shape-square-xl.parentBorder{border:0;box-shadow:unset;min-height:68px;max-height:68px}.shape-rounded-lg{min-height:52px;max-height:52px;border-style:solid;overflow:hidden;border-radius:6px}.shape-rounded-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-rounded-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-rounded-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-pill-lg{min-height:52px;max-height:52px;border-style:solid;overflow:hidden;border-radius:28px}.shape-pill-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-pill-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-pill-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-pill-left-lg{min-height:52px;max-height:52px;border-style:solid;overflow:hidden;border-radius:28px 0 0 28px}.shape-pill-left-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-pill-left-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-pill-left-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-pill-right-lg{min-height:52px;max-height:52px;border-style:solid;overflow:hidden;border-radius:0 28px 28px 0}.shape-pill-right-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-pill-right-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-pill-right-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-circle-lg{min-height:52px;max-height:52px;border-style:solid;overflow:hidden;border-radius:50%;min-width:56px;max-width:56px;padding:0}.shape-circle-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-circle-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-circle-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-square-lg{min-height:52px;max-height:52px;border-style:solid;overflow:hidden;border-radius:6px;min-width:56px;max-width:56px;padding:0}.shape-square-lg.simple{border-width:0px;min-height:56px;max-height:56px;background-color:unset;box-shadow:none}.shape-square-lg.thin{border-width:1px;min-height:54px;max-height:54px;background-color:unset}.shape-square-lg.parentBorder{border:0;box-shadow:unset;min-height:52px;max-height:52px}.shape-rounded-md{min-height:44px;max-height:44px;border-style:solid;overflow:hidden;border-radius:6px}.shape-rounded-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-rounded-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-rounded-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-md{min-height:44px;max-height:44px;border-style:solid;overflow:hidden;border-radius:24px}.shape-pill-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-left-md{min-height:44px;max-height:44px;border-style:solid;overflow:hidden;border-radius:24px 0 0 24px}.shape-pill-left-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-left-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-left-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-pill-right-md{min-height:44px;max-height:44px;border-style:solid;overflow:hidden;border-radius:0 24px 24px 0}.shape-pill-right-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-pill-right-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-pill-right-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-circle-md{min-height:44px;max-height:44px;border-style:solid;overflow:hidden;border-radius:50%;min-width:48px;max-width:48px;padding:0}.shape-circle-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-circle-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-circle-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-square-md{min-height:44px;max-height:44px;border-style:solid;overflow:hidden;border-radius:6px;min-width:48px;max-width:48px;padding:0}.shape-square-md.simple{border-width:0px;min-height:48px;max-height:48px;background-color:unset;box-shadow:none}.shape-square-md.thin{border-width:1px;min-height:46px;max-height:46px;background-color:unset}.shape-square-md.parentBorder{border:0;box-shadow:unset;min-height:44px;max-height:44px}.shape-rounded-sm{min-height:32px;max-height:32px;border-style:solid;overflow:hidden;border-radius:6px}.shape-rounded-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-rounded-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-rounded-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-pill-sm{min-height:32px;max-height:32px;border-style:solid;overflow:hidden;border-radius:18px}.shape-pill-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-pill-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-pill-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-pill-left-sm{min-height:32px;max-height:32px;border-style:solid;overflow:hidden;border-radius:18px 0 0 18px}.shape-pill-left-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-pill-left-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-pill-left-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-pill-right-sm{min-height:32px;max-height:32px;border-style:solid;overflow:hidden;border-radius:0 18px 18px 0}.shape-pill-right-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-pill-right-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-pill-right-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-circle-sm{min-height:32px;max-height:32px;border-style:solid;overflow:hidden;border-radius:50%;min-width:36px;max-width:36px;padding:0}.shape-circle-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-circle-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-circle-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-square-sm{min-height:32px;max-height:32px;border-style:solid;overflow:hidden;border-radius:6px;min-width:36px;max-width:36px;padding:0}.shape-square-sm.simple{border-width:0px;min-height:36px;max-height:36px;background-color:unset;box-shadow:none}.shape-square-sm.thin{border-width:1px;min-height:34px;max-height:34px;background-color:unset}.shape-square-sm.parentBorder{border:0;box-shadow:unset;min-height:32px;max-height:32px}.shape-rounded-xs{min-height:20px;max-height:20px;border-style:solid;overflow:hidden;border-radius:4px}.shape-rounded-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-rounded-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-rounded-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-pill-xs{min-height:20px;max-height:20px;border-style:solid;overflow:hidden;border-radius:12px}.shape-pill-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-pill-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-pill-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-pill-left-xs{min-height:20px;max-height:20px;border-style:solid;overflow:hidden;border-radius:12px 0 0 12px}.shape-pill-left-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-pill-left-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-pill-left-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-pill-right-xs{min-height:20px;max-height:20px;border-style:solid;overflow:hidden;border-radius:0 12px 12px 0}.shape-pill-right-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-pill-right-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-pill-right-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-circle-xs{min-height:20px;max-height:20px;border-style:solid;overflow:hidden;border-radius:50%;min-width:24px;max-width:24px;padding:0}.shape-circle-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-circle-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-circle-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}.shape-square-xs{min-height:20px;max-height:20px;border-style:solid;overflow:hidden;border-radius:6px;min-width:24px;max-width:24px;padding:0}.shape-square-xs.simple{border-width:0px;min-height:24px;max-height:24px;background-color:unset;box-shadow:none}.shape-square-xs.thin{border-width:1px;min-height:22px;max-height:22px;background-color:unset}.shape-square-xs.parentBorder{border:0;box-shadow:unset;min-height:20px;max-height:20px}
3408
+ `,M$1=i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host([size=xs][shape=rounded]) ::slotted(auro-icon),:host([size=xs][shape=rounded]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-200, 1rem)}:host([size=xs][shape=rounded][variant=primary]) .auro-button:focus,:host([size=xs][shape=rounded][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=rounded][variant=primary]) .auro-button:focus:after,:host([size=xs][shape=rounded][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xs][shape=rounded][variant=secondary]) .auro-button:focus,:host([size=xs][shape=rounded][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=rounded][variant=tertiary]) .auro-button:focus,:host([size=xs][shape=rounded][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=rounded][variant=ghost]) .auro-button:focus,:host([size=xs][shape=rounded][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill]) ::slotted(auro-icon),:host([size=xs][shape=pill]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-200, 1rem)}:host([size=xs][shape=pill][variant=primary]) .auro-button:focus,:host([size=xs][shape=pill][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill][variant=primary]) .auro-button:focus:after,:host([size=xs][shape=pill][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xs][shape=pill][variant=secondary]) .auro-button:focus,:host([size=xs][shape=pill][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill][variant=tertiary]) .auro-button:focus,:host([size=xs][shape=pill][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill][variant=ghost]) .auro-button:focus,:host([size=xs][shape=pill][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-left]) ::slotted(auro-icon),:host([size=xs][shape=pill-left]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-200, 1rem)}:host([size=xs][shape=pill-left][variant=primary]) .auro-button:focus,:host([size=xs][shape=pill-left][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-left][variant=primary]) .auro-button:focus:after,:host([size=xs][shape=pill-left][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xs][shape=pill-left][variant=secondary]) .auro-button:focus,:host([size=xs][shape=pill-left][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-left][variant=tertiary]) .auro-button:focus,:host([size=xs][shape=pill-left][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-left][variant=ghost]) .auro-button:focus,:host([size=xs][shape=pill-left][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-right]) ::slotted(auro-icon),:host([size=xs][shape=pill-right]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-200, 1rem)}:host([size=xs][shape=pill-right][variant=primary]) .auro-button:focus,:host([size=xs][shape=pill-right][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-right][variant=primary]) .auro-button:focus:after,:host([size=xs][shape=pill-right][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xs][shape=pill-right][variant=secondary]) .auro-button:focus,:host([size=xs][shape=pill-right][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-right][variant=tertiary]) .auro-button:focus,:host([size=xs][shape=pill-right][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=pill-right][variant=ghost]) .auro-button:focus,:host([size=xs][shape=pill-right][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=circle]) ::slotted(auro-icon),:host([size=xs][shape=circle]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=xs][shape=circle][variant=primary]) .auro-button:focus,:host([size=xs][shape=circle][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=circle][variant=primary]) .auro-button:focus:after,:host([size=xs][shape=circle][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xs][shape=circle][variant=secondary]) .auro-button:focus,:host([size=xs][shape=circle][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 1px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=circle][variant=tertiary]) .auro-button:focus,:host([size=xs][shape=circle][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=circle][variant=flat]) .auro-button:focus,:host([size=xs][shape=circle][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=circle][variant=ghost]) .auro-button:focus,:host([size=xs][shape=circle][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=square]) ::slotted(auro-icon),:host([size=xs][shape=square]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=xs][shape=square][variant=primary]) .auro-button:focus,:host([size=xs][shape=square][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=square][variant=primary]) .auro-button:focus:after,:host([size=xs][shape=square][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xs][shape=square][variant=secondary]) .auro-button:focus,:host([size=xs][shape=square][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 1px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=square][variant=tertiary]) .auro-button:focus,:host([size=xs][shape=square][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=square][variant=flat]) .auro-button:focus,:host([size=xs][shape=square][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs][shape=square][variant=ghost]) .auro-button:focus,:host([size=xs][shape=square][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=rounded]) ::slotted(auro-icon),:host([size=sm][shape=rounded]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=sm][shape=rounded][variant=primary]) .auro-button:focus,:host([size=sm][shape=rounded][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=rounded][variant=primary]) .auro-button:focus:after,:host([size=sm][shape=rounded][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=sm][shape=rounded][variant=secondary]) .auro-button:focus,:host([size=sm][shape=rounded][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=rounded][variant=tertiary]) .auro-button:focus,:host([size=sm][shape=rounded][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=rounded][variant=ghost]) .auro-button:focus,:host([size=sm][shape=rounded][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill]) ::slotted(auro-icon),:host([size=sm][shape=pill]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=sm][shape=pill][variant=primary]) .auro-button:focus,:host([size=sm][shape=pill][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill][variant=primary]) .auro-button:focus:after,:host([size=sm][shape=pill][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=sm][shape=pill][variant=secondary]) .auro-button:focus,:host([size=sm][shape=pill][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill][variant=tertiary]) .auro-button:focus,:host([size=sm][shape=pill][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill][variant=ghost]) .auro-button:focus,:host([size=sm][shape=pill][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-left]) ::slotted(auro-icon),:host([size=sm][shape=pill-left]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=sm][shape=pill-left][variant=primary]) .auro-button:focus,:host([size=sm][shape=pill-left][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-left][variant=primary]) .auro-button:focus:after,:host([size=sm][shape=pill-left][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=sm][shape=pill-left][variant=secondary]) .auro-button:focus,:host([size=sm][shape=pill-left][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-left][variant=tertiary]) .auro-button:focus,:host([size=sm][shape=pill-left][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-left][variant=ghost]) .auro-button:focus,:host([size=sm][shape=pill-left][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-right]) ::slotted(auro-icon),:host([size=sm][shape=pill-right]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=sm][shape=pill-right][variant=primary]) .auro-button:focus,:host([size=sm][shape=pill-right][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-right][variant=primary]) .auro-button:focus:after,:host([size=sm][shape=pill-right][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=sm][shape=pill-right][variant=secondary]) .auro-button:focus,:host([size=sm][shape=pill-right][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-right][variant=tertiary]) .auro-button:focus,:host([size=sm][shape=pill-right][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=pill-right][variant=ghost]) .auro-button:focus,:host([size=sm][shape=pill-right][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=circle]) ::slotted(auro-icon),:host([size=sm][shape=circle]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=sm][shape=circle][variant=primary]) .auro-button:focus,:host([size=sm][shape=circle][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=circle][variant=primary]) .auro-button:focus:after,:host([size=sm][shape=circle][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=sm][shape=circle][variant=secondary]) .auro-button:focus,:host([size=sm][shape=circle][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=circle][variant=tertiary]) .auro-button:focus,:host([size=sm][shape=circle][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=circle][variant=flat]) .auro-button:focus,:host([size=sm][shape=circle][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=circle][variant=ghost]) .auro-button:focus,:host([size=sm][shape=circle][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=square]) ::slotted(auro-icon),:host([size=sm][shape=square]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=sm][shape=square][variant=primary]) .auro-button:focus,:host([size=sm][shape=square][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=square][variant=primary]) .auro-button:focus:after,:host([size=sm][shape=square][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=sm][shape=square][variant=secondary]) .auro-button:focus,:host([size=sm][shape=square][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=square][variant=tertiary]) .auro-button:focus,:host([size=sm][shape=square][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=square][variant=flat]) .auro-button:focus,:host([size=sm][shape=square][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=sm][shape=square][variant=ghost]) .auro-button:focus,:host([size=sm][shape=square][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=rounded]) ::slotted(auro-icon),:host([size=md][shape=rounded]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=md][shape=rounded][variant=primary]) .auro-button:focus,:host([size=md][shape=rounded][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=rounded][variant=primary]) .auro-button:focus:after,:host([size=md][shape=rounded][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=md][shape=rounded][variant=secondary]) .auro-button:focus,:host([size=md][shape=rounded][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=rounded][variant=tertiary]) .auro-button:focus,:host([size=md][shape=rounded][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=rounded][variant=ghost]) .auro-button:focus,:host([size=md][shape=rounded][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill]) ::slotted(auro-icon),:host([size=md][shape=pill]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=md][shape=pill][variant=primary]) .auro-button:focus,:host([size=md][shape=pill][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill][variant=primary]) .auro-button:focus:after,:host([size=md][shape=pill][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=md][shape=pill][variant=secondary]) .auro-button:focus,:host([size=md][shape=pill][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill][variant=tertiary]) .auro-button:focus,:host([size=md][shape=pill][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill][variant=ghost]) .auro-button:focus,:host([size=md][shape=pill][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-left]) ::slotted(auro-icon),:host([size=md][shape=pill-left]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=md][shape=pill-left][variant=primary]) .auro-button:focus,:host([size=md][shape=pill-left][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-left][variant=primary]) .auro-button:focus:after,:host([size=md][shape=pill-left][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=md][shape=pill-left][variant=secondary]) .auro-button:focus,:host([size=md][shape=pill-left][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-left][variant=tertiary]) .auro-button:focus,:host([size=md][shape=pill-left][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-left][variant=ghost]) .auro-button:focus,:host([size=md][shape=pill-left][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-right]) ::slotted(auro-icon),:host([size=md][shape=pill-right]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=md][shape=pill-right][variant=primary]) .auro-button:focus,:host([size=md][shape=pill-right][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-right][variant=primary]) .auro-button:focus:after,:host([size=md][shape=pill-right][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=md][shape=pill-right][variant=secondary]) .auro-button:focus,:host([size=md][shape=pill-right][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-right][variant=tertiary]) .auro-button:focus,:host([size=md][shape=pill-right][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=pill-right][variant=ghost]) .auro-button:focus,:host([size=md][shape=pill-right][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=circle]) ::slotted(auro-icon),:host([size=md][shape=circle]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=md][shape=circle][variant=primary]) .auro-button:focus,:host([size=md][shape=circle][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=circle][variant=primary]) .auro-button:focus:after,:host([size=md][shape=circle][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=md][shape=circle][variant=secondary]) .auro-button:focus,:host([size=md][shape=circle][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=circle][variant=tertiary]) .auro-button:focus,:host([size=md][shape=circle][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=circle][variant=flat]) .auro-button:focus,:host([size=md][shape=circle][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=circle][variant=ghost]) .auro-button:focus,:host([size=md][shape=circle][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=square]) ::slotted(auro-icon),:host([size=md][shape=square]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=md][shape=square][variant=primary]) .auro-button:focus,:host([size=md][shape=square][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=square][variant=primary]) .auro-button:focus:after,:host([size=md][shape=square][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=md][shape=square][variant=secondary]) .auro-button:focus,:host([size=md][shape=square][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=square][variant=tertiary]) .auro-button:focus,:host([size=md][shape=square][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=square][variant=flat]) .auro-button:focus,:host([size=md][shape=square][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=md][shape=square][variant=ghost]) .auro-button:focus,:host([size=md][shape=square][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=rounded]) ::slotted(auro-icon),:host([size=lg][shape=rounded]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=lg][shape=rounded][variant=primary]) .auro-button:focus,:host([size=lg][shape=rounded][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=rounded][variant=primary]) .auro-button:focus:after,:host([size=lg][shape=rounded][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=lg][shape=rounded][variant=secondary]) .auro-button:focus,:host([size=lg][shape=rounded][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=rounded][variant=tertiary]) .auro-button:focus,:host([size=lg][shape=rounded][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=rounded][variant=ghost]) .auro-button:focus,:host([size=lg][shape=rounded][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill]) ::slotted(auro-icon),:host([size=lg][shape=pill]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=lg][shape=pill][variant=primary]) .auro-button:focus,:host([size=lg][shape=pill][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill][variant=primary]) .auro-button:focus:after,:host([size=lg][shape=pill][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=lg][shape=pill][variant=secondary]) .auro-button:focus,:host([size=lg][shape=pill][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill][variant=tertiary]) .auro-button:focus,:host([size=lg][shape=pill][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill][variant=ghost]) .auro-button:focus,:host([size=lg][shape=pill][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-left]) ::slotted(auro-icon),:host([size=lg][shape=pill-left]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=lg][shape=pill-left][variant=primary]) .auro-button:focus,:host([size=lg][shape=pill-left][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-left][variant=primary]) .auro-button:focus:after,:host([size=lg][shape=pill-left][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=lg][shape=pill-left][variant=secondary]) .auro-button:focus,:host([size=lg][shape=pill-left][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-left][variant=tertiary]) .auro-button:focus,:host([size=lg][shape=pill-left][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-left][variant=ghost]) .auro-button:focus,:host([size=lg][shape=pill-left][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-right]) ::slotted(auro-icon),:host([size=lg][shape=pill-right]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=lg][shape=pill-right][variant=primary]) .auro-button:focus,:host([size=lg][shape=pill-right][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-right][variant=primary]) .auro-button:focus:after,:host([size=lg][shape=pill-right][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=lg][shape=pill-right][variant=secondary]) .auro-button:focus,:host([size=lg][shape=pill-right][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-right][variant=tertiary]) .auro-button:focus,:host([size=lg][shape=pill-right][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=pill-right][variant=ghost]) .auro-button:focus,:host([size=lg][shape=pill-right][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=circle]) ::slotted(auro-icon),:host([size=lg][shape=circle]) ::slotted([auro-icon]){--ds-auro-icon-size: calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, .25rem))}:host([size=lg][shape=circle][variant=primary]) .auro-button:focus,:host([size=lg][shape=circle][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4.33px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=circle][variant=primary]) .auro-button:focus:after,:host([size=lg][shape=circle][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=lg][shape=circle][variant=secondary]) .auro-button:focus,:host([size=lg][shape=circle][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=circle][variant=tertiary]) .auro-button:focus,:host([size=lg][shape=circle][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=circle][variant=flat]) .auro-button:focus,:host([size=lg][shape=circle][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=circle][variant=ghost]) .auro-button:focus,:host([size=lg][shape=circle][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=square]) ::slotted(auro-icon),:host([size=lg][shape=square]) ::slotted([auro-icon]){--ds-auro-icon-size: calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, .25rem))}:host([size=lg][shape=square][variant=primary]) .auro-button:focus,:host([size=lg][shape=square][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4.33px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=square][variant=primary]) .auro-button:focus:after,:host([size=lg][shape=square][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=lg][shape=square][variant=secondary]) .auro-button:focus,:host([size=lg][shape=square][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=square][variant=tertiary]) .auro-button:focus,:host([size=lg][shape=square][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=square][variant=flat]) .auro-button:focus,:host([size=lg][shape=square][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=lg][shape=square][variant=ghost]) .auro-button:focus,:host([size=lg][shape=square][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=rounded]) ::slotted(auro-icon),:host([size=xl][shape=rounded]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=xl][shape=rounded][variant=primary]) .auro-button:focus,:host([size=xl][shape=rounded][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=rounded][variant=primary]) .auro-button:focus:after,:host([size=xl][shape=rounded][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xl][shape=rounded][variant=secondary]) .auro-button:focus,:host([size=xl][shape=rounded][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=rounded][variant=tertiary]) .auro-button:focus,:host([size=xl][shape=rounded][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=rounded][variant=ghost]) .auro-button:focus,:host([size=xl][shape=rounded][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill]) ::slotted(auro-icon),:host([size=xl][shape=pill]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=xl][shape=pill][variant=primary]) .auro-button:focus,:host([size=xl][shape=pill][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill][variant=primary]) .auro-button:focus:after,:host([size=xl][shape=pill][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xl][shape=pill][variant=secondary]) .auro-button:focus,:host([size=xl][shape=pill][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill][variant=tertiary]) .auro-button:focus,:host([size=xl][shape=pill][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill][variant=ghost]) .auro-button:focus,:host([size=xl][shape=pill][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-left]) ::slotted(auro-icon),:host([size=xl][shape=pill-left]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=xl][shape=pill-left][variant=primary]) .auro-button:focus,:host([size=xl][shape=pill-left][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-left][variant=primary]) .auro-button:focus:after,:host([size=xl][shape=pill-left][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xl][shape=pill-left][variant=secondary]) .auro-button:focus,:host([size=xl][shape=pill-left][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-left][variant=tertiary]) .auro-button:focus,:host([size=xl][shape=pill-left][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-left][variant=ghost]) .auro-button:focus,:host([size=xl][shape=pill-left][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-right]) ::slotted(auro-icon),:host([size=xl][shape=pill-right]) ::slotted([auro-icon]){--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}:host([size=xl][shape=pill-right][variant=primary]) .auro-button:focus,:host([size=xl][shape=pill-right][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-right][variant=primary]) .auro-button:focus:after,:host([size=xl][shape=pill-right][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xl][shape=pill-right][variant=secondary]) .auro-button:focus,:host([size=xl][shape=pill-right][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-right][variant=tertiary]) .auro-button:focus,:host([size=xl][shape=pill-right][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=pill-right][variant=ghost]) .auro-button:focus,:host([size=xl][shape=pill-right][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=circle]) ::slotted(auro-icon),:host([size=xl][shape=circle]) ::slotted([auro-icon]){--ds-auro-icon-size: calc(var(--ds-size-400, 2rem) + var(--ds-size-50, .25rem))}:host([size=xl][shape=circle][variant=primary]) .auro-button:focus,:host([size=xl][shape=circle][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=circle][variant=primary]) .auro-button:focus:after,:host([size=xl][shape=circle][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xl][shape=circle][variant=secondary]) .auro-button:focus,:host([size=xl][shape=circle][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=circle][variant=tertiary]) .auro-button:focus,:host([size=xl][shape=circle][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=circle][variant=flat]) .auro-button:focus,:host([size=xl][shape=circle][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=circle][variant=ghost]) .auro-button:focus,:host([size=xl][shape=circle][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=square]) ::slotted(auro-icon),:host([size=xl][shape=square]) ::slotted([auro-icon]){--ds-auro-icon-size: calc(var(--ds-size-400, 2rem) + var(--ds-size-50, .25rem))}:host([size=xl][shape=square][variant=primary]) .auro-button:focus,:host([size=xl][shape=square][variant=primary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 5px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=square][variant=primary]) .auro-button:focus:after,:host([size=xl][shape=square][variant=primary]) .auro-button:focus-visible:after{content:"";position:absolute;border-radius:inherit;box-sizing:content-box;top:0;left:0;width:calc(100% - 2px);height:calc(100% - 2px);border:1px solid var(--ds-auro-button-border-color)}:host([size=xl][shape=square][variant=secondary]) .auro-button:focus,:host([size=xl][shape=square][variant=secondary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 3px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=square][variant=tertiary]) .auro-button:focus,:host([size=xl][shape=square][variant=tertiary]) .auro-button:focus-visible{box-shadow:inset 0 0 0 4px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=square][variant=flat]) .auro-button:focus,:host([size=xl][shape=square][variant=flat]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xl][shape=square][variant=ghost]) .auro-button:focus,:host([size=xl][shape=square][variant=ghost]) .auro-button:focus-visible{box-shadow:inset 0 0 0 2px var(--ds-auro-button-border-inset-color)}:host([size=xs]) .inset .contentWrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-inline:var(--ds-size-150, .75rem)}:host([size=sm]) .inset .contentWrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-inline:var(--ds-size-200, 1rem)}:host([size=md]) .inset .contentWrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-inline:var(--ds-size-300, 1.5rem)}:host([size=lg]) .inset .contentWrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-inline:var(--ds-size-400, 2rem)}:host([size=xl]) .inset .contentWrapper{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-inline:var(--ds-size-500, 2.5rem)}:host([shape=circle]) ::slotted(:not(auro-icon):not([auro-icon])){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host([shape=square]) ::slotted(:not(auro-icon):not([auro-icon])){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host([variant=flat]){display:inline-block}::slotted(svg){vertical-align:middle}.textSlot{display:inline-flex;align-items:center;gap:var(--ds-size-100, .5rem)}.contentWrapper{font-size:0}slot{pointer-events:none}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host{display:inline-block;overflow:hidden}.auro-button{position:relative;cursor:pointer;padding:0 var(--ds-size-300, 1.5rem);padding-inline:unset;padding-block:unset;box-sizing:content-box;overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;outline:none;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, .5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none;transition:padding .3s ease-out}.auro-button:focus,.auro-button:focus-visible{outline:none}.auro-button:active{transform:scale(.95)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}:host([fluid]){display:block}:host([fluid]) .auro-button:not(.thin):not(.simple){width:calc(100% - 4px)}:host([fluid]) .auro-button.thin{width:calc(100% - 2px)}:host([fluid]) .auro-button.simple{width:100%}:host([static]) .auro-button{pointer-events:none;cursor:default;display:inline-flex}:host([static]) .auro-button .contentWrapper{display:inline-flex}
3409
+ `,R=i$5`:host{--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border, #01426a);--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-loader-color: var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-text-color: var(--ds-advanced-color-button-primary-text, #ffffff)}
3410
+ `;const N=["circle","square"];class T extends C{static get formAssociated(){return true}constructor(){super(),this.autofocus=false,this.disabled=false,this.loading=false,this.static=false,this.size="md",this.shape="rounded",this.fluid=false,this.loadingText=this.loadingText||"Loading...",this.variant="primary",this.runtimeUtils=new d,"function"==typeof this.attachInternals?this.internals=this.attachInternals():(this.internals=null,console.warn("This browser does not support form association features. Some form-related functionality may not work as expected. Consider using a polyfill or handling click events manually."));const t=new l;this.loaderTag=t.generateTag("auro-loader","6.1.0",b),this.buttonHref=void 0,this.buttonTarget=void 0,this.buttonRel=void 0;}static get styles(){return [R,M$1,U,H]}static get properties(){return {...C.properties,layout:{type:Boolean,attribute:false,reflect:false},autofocus:{type:Boolean,reflect:true},disabled:{type:Boolean,reflect:true},fluid:{type:Boolean,reflect:true},loading:{type:Boolean,reflect:true},loadingText:{type:String},tIndex:{type:String,reflect:true},tabindex:{type:String,reflect:false},title:{type:String,reflect:true},type:{type:String,reflect:true},value:{type:String,reflect:true},variant:{type:String,reflect:true},buttonHref:{type:String},buttonTarget:{type:String},buttonRel:{type:String},static:{type:Boolean,reflect:true},onHover:{attribute:"data-hover",type:Boolean,reflect:true},onActive:{attribute:"data-active",type:Boolean,reflect:true}}}static register(t="auro-button"){d.prototype.registerComponent(t,T);}focus(){this.renderRoot.querySelector("button").focus();}surfaceSubmitEvent(){this.form&&this.form.requestSubmit();}get form(){return this.internals?this.internals.form:null}get showText(){return !N.includes(this.shape)}get currentAriaLabel(){if(!this.attributeWatcher)return;return this.attributeWatcher.getObservedAttribute("aria-label")||void 0}get currentAriaLabelledBy(){if(!this.attributeWatcher)return;return this.attributeWatcher.getObservedAttribute("aria-labelledby")||void 0}get iconOnly(){return N.includes(this.shape)}getFontSize(){return (this.iconOnly?{xs:"heading-xs",sm:"heading-sm",md:"heading-sm",lg:"heading-md",xl:"heading-lg"}:{xs:"body-xs",sm:"body-sm",md:"body-default",lg:"body-lg",xl:"body-lg"})[this.size]||"body-default"}get _renderTag(){return this.static?i`span`:this.buttonHref?i`a`:i`button`}firstUpdated(){super.firstUpdated(),this.runtimeUtils.handleComponentTagRename(this,"auro-button");}generateAriaLabel(){return this.loading?this.runtimeUtils.getSlotText(this,"ariaLabel.loading")||this.loadingText:this.runtimeUtils.getSlotText(this,"ariaLabel")||this.currentAriaLabel}onPointerEvent(t){switch(t.type){case "pointerenter":this.onHover=true;break;case "pointerleave":this.onHover=false;break;case "pointerdown":this.onActive=true;break;case "pointerup":case "blur":this.onActive=false;}}renderLayoutDefault(){const t=this.getFontSize(),e$1=this.buttonHref?"link":"button",s={"auro-button":true,inset:this.showText,wrapper:true,loading:this.loading,simple:!["secondary"].includes(this.variant),thin:["secondary"].includes(this.variant)},a={contentWrapper:true,loading:this.loading},r={textSlot:true,[t]:this.showText},l=this.tIndex||this.tabindex;return u$2`
3411
+ <!-- Hidden slots for aria labels -->
3412
+ <slot name="ariaLabel" hidden @slotchange="${this.requestUpdate}"></slot>
3413
+ <slot name="ariaLabel.loading" hidden @slotchange="${this.requestUpdate}"></slot>
3414
+
3415
+ <${this._renderTag}
3416
+ part="${e$1}"
3417
+ aria-label="${o$1(this.generateAriaLabel())}"
3418
+ aria-labelledby="${o$1(this.loading?void 0:this.currentAriaLabelledBy||void 0)}"
3419
+ tabindex="${o$1(this.static?-1:l)}"
3420
+ ?autofocus="${this.autofocus}"
3421
+ class=${e(s)}
3422
+ ?disabled="${this.disabled||this.loading}"
3423
+ ?onDark="${this.onDark}"
3424
+ title="${o$1(this.title?this.title:void 0)}"
3425
+ name="${o$1(this.name?this.name:void 0)}"
3426
+ type="${o$1(this.type?this.type:void 0)}"
3427
+ variant="${o$1(this.variant?this.variant:void 0)}"
3428
+ .value="${o$1(this.value?this.value:void 0)}"
3429
+ @click="${this.static||"submit"!==this.type?void 0:this.surfaceSubmitEvent}"
3430
+ @pointerenter="${this.onPointerEvent}"
3431
+ @pointerleave="${this.onPointerEvent}"
3432
+ @pointerdown="${this.onPointerEvent}"
3433
+ @pointerup="${this.onPointerEvent}"
3434
+ @blur="${this.onPointerEvent}"
3435
+ href="${o$1(this.buttonHref||void 0)}"
3436
+ target="${o$1(this.buttonTarget||void 0)}"
3437
+ rel="${o$1(this.buttonRel||void 0)}"
3438
+ >
3439
+ ${o$1(this.loading?u$2`<${this.loaderTag} pulse part="loader"></${this.loaderTag}>`:void 0)}
3440
+
3441
+ <span class="${e(a)}" part="contentWrapper">
3442
+ <span class="${e(r)}" part="text">
3443
+ <slot></slot>
3444
+ </span>
3445
+ </span>
3446
+ </${this._renderTag}>
3447
+ `}renderLayout(){return this.renderLayoutDefault()}}
3448
+
3449
+ class p{registerComponent(t,a){customElements.get(t)||customElements.define(t,class extends a{});}closestElement(t,a=this,e=(a,s=a&&a.closest(t))=>a&&a!==document&&a!==window?s||e(a.getRootNode().host):null){return e(a)}handleComponentTagRename(t,a){const e=a.toLowerCase();t.tagName.toLowerCase()!==e&&t.setAttribute(e,true);}elementMatch(t,a){const e=a.toLowerCase();return t.tagName.toLowerCase()===e||t.hasAttribute(e)}getSlotText(t,a){const e=t.shadowRoot?.querySelector(`slot[name="${a}"]`);return (e?.assignedNodes({flatten:true})||[]).map(t=>t.textContent?.trim()).join(" ").trim()||null}}var u='<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-labelledby="error__desc" class="ico_squareLarge" data-deprecated="true" role="img" style="min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor" viewBox="0 0 24 24" part="svg"><title/><desc id="error__desc">Error alert indicator.</desc><path d="m13.047 5.599 6.786 11.586A1.207 1.207 0 0 1 18.786 19H5.214a1.207 1.207 0 0 1-1.047-1.815l6.786-11.586a1.214 1.214 0 0 1 2.094 0m-1.165.87a.23.23 0 0 0-.085.085L5.419 17.442a.232.232 0 0 0 .203.35h12.756a.234.234 0 0 0 .203-.35L12.203 6.554a.236.236 0 0 0-.321-.084M12 15.5a.75.75 0 1 1 0 1.5.75.75 0 0 1 0-1.5m-.024-6.22c.325 0 .589.261.589.583v4.434a.586.586 0 0 1-.589.583.586.586 0 0 1-.588-.583V9.863c0-.322.264-.583.588-.583"/></svg>',g='<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" style="min-width:100%;height:auto;fill:currentColor" viewBox="0 0 142 138" part="svg"><title id="tail-DEFAULT__title">Airplane tail default image with light gray color</title><path fill="url(#paint0_linear_9225_2069)" fill-rule="evenodd" d="M124.093 14.665a3.26 3.26 0 0 1 3.208 3.829L101.097 119.85c-.47 1.087-2.211 3.398-5.692 3.471l-.106.001-80.65.013A659230 659230 0 0 1 99.08 17.412c1.214-1.497 3.275-2.722 5.372-2.747z" clip-rule="evenodd"/><defs><linearGradient id="paint0_linear_9225_2069" x1="114.823" x2="60.061" y1="14.665" y2="123.335" gradientUnits="userSpaceOnUse"><stop offset=".5" stop-color="#707984"/><stop offset=".5" stop-color="#646E7B"/></linearGradient></defs></svg>';class m extends i$2{static get properties(){return {hidden:{type:Boolean,reflect:true},hiddenVisually:{type:Boolean,reflect:true},hiddenAudible:{type:Boolean,reflect:true}}}hideAudible(t){return t?"true":"false"}}const f=new Map,w=(t,a={})=>{const e=a.responseParser||(t=>t.text());return f.has(t)||f.set(t,fetch(t).then(e)),f.get(t)};var z=i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, .75rem))}:host{color:currentColor;vertical-align:middle;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem)!important;width:var(--ds-auro-icon-size, 1.5rem)!important;height:var(--ds-auro-icon-size, 1.5rem)!important}.componentWrapper{display:flex;line-height:var(--ds-auro-icon-size)}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.svgWrapper [part=svg]{display:flex}.labelWrapper{margin-left:var(--ds-size-50, .25rem)}.labelWrapper ::slotted(*){line-height:inherit!important}
3450
+ `;class y extends m{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.onDark=false,this.appearance="default";}static get properties(){return {...m.properties,onDark:{type:Boolean,reflect:true},appearance:{type:String,reflect:true},svg:{attribute:false,reflect:true}}}static get styles(){return z}async fetchIcon(t,a){let e="";e="logos"===t?await w(`${this.uri}/${t}/${a}.svg`):await w(`${this.uri}/icons/${t}/${a}.svg`);return (new DOMParser).parseFromString(e,"text/html").body.querySelector("svg")}async firstUpdated(){try{if(!this.customSvg){const t=await this.fetchIcon(this.category,this.name);if(t)this.svg=t;else if(!t){const t=this.name?.startsWith("tail-")?g:u;this.svg=(new DOMParser).parseFromString(t,"text/html").body.querySelector("svg");}}}catch(t){this.svg=void 0;}}}i$5`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}:host{display:inline-block;--ds-auro-icon-size: 100%;width:100%;height:100%}:host .logo{color:var(--ds-auro-alaska-color)}:host([onDark]),:host([appearance=inverse]){--ds-auro-alaska-color: #FFF}
3451
+ `;var M=i$5`:host{--ds-auro-icon-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color: #02426D;--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}
3452
+ `;var _=i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]),:host(:not([appearance=inverse])[variant=accent1]){--ds-auro-icon-color: var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]),:host(:not([appearance=inverse])[variant=disabled]){--ds-auro-icon-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]),:host(:not([appearance=inverse])[variant=muted]){--ds-auro-icon-color: var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]),:host(:not([appearance=inverse])[variant=statusDefault]){--ds-auro-icon-color: var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]),:host(:not([appearance=inverse])[variant=statusInfo]){--ds-auro-icon-color: var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]),:host(:not([appearance=inverse])[variant=statusSuccess]){--ds-auro-icon-color: var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]),:host(:not([appearance=inverse])[variant=statusWarning]){--ds-auro-icon-color: var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]),:host(:not([appearance=inverse])[variant=statusError]){--ds-auro-icon-color: var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]),:host(:not([appearance=inverse])[variant=statusInfoSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]),:host(:not([appearance=inverse])[variant=statusSuccessSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]),:host(:not([appearance=inverse])[variant=statusWarningSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]),:host(:not([appearance=inverse])[variant=statusErrorSubtle]){--ds-auro-icon-color: var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]),:host(:not([appearance=inverse])[variant=fareBasicEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]),:host(:not([appearance=inverse])[variant=fareBusiness]){--ds-auro-icon-color: var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]),:host(:not([appearance=inverse])[variant=fareEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]),:host(:not([appearance=inverse])[variant=fareFirst]){--ds-auro-icon-color: var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]),:host(:not([appearance=inverse])[variant=farePremiumEconomy]){--ds-auro-icon-color: var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]),:host(:not([appearance=inverse])[variant=tierOneWorldEmerald]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]),:host(:not([appearance=inverse])[variant=tierOneWorldSapphire]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]),:host(:not([appearance=inverse])[variant=tierOneWorldRuby]){--ds-auro-icon-color: var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]),:host([appearance=inverse]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]),:host([appearance=inverse][variant=disabled]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]),:host([appearance=inverse][variant=muted]){--ds-auro-icon-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][variant=statusError]),:host([appearance=inverse][variant=statusError]){--ds-auro-icon-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}
3453
+ `;class k extends y{constructor(){super(),this._initializeDefaults();}_initializeDefaults(){this.variant=void 0,this.uri="https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist",this.runtimeUtils=new p;}static get properties(){return {...y.properties,ariaHidden:{type:String,reflect:true},category:{type:String,reflect:true},customColor:{type:Boolean,reflect:true},customSvg:{type:Boolean},label:{type:Boolean,reflect:true},name:{type:String,reflect:true},variant:{type:String,reflect:true}}}static get styles(){return [y.styles,M,z,_]}static register(t="auro-icon"){p.prototype.registerComponent(t,k);}connectedCallback(){super.connectedCallback(),this.runtimeUtils.handleComponentTagRename(this,"auro-icon");}exposeCssParts(){this.setAttribute("exportparts","svg:iconSvg");}async firstUpdated(){if(await super.firstUpdated(),this.hasAttribute("ariaHidden")&&this.svg){const t=this.svg.querySelector("desc");t&&(t.remove(),this.svg.removeAttribute("aria-labelledby"));}}render(){const t={labelWrapper:true,util_displayHiddenVisually:!this.label};return b$1`
3454
+ <div class="componentWrapper">
3455
+ <div
3456
+ class="${e({svgWrapper:true})}"
3457
+ title="${o$1(this.title||void 0)}">
3458
+ <span aria-hidden="${o$1(this.ariaHidden||true)}" part="svg">
3459
+ ${this.customSvg?b$1`
3460
+ <slot name="svg"></slot>
3461
+ `:b$1`
3462
+ ${this.svg}
3463
+ `}
3464
+ </span>
3465
+ </div>
3466
+
3467
+ <div class="${e(t)}" part="label">
3468
+ <slot></slot>
3469
+ </div>
3470
+ </div>
3471
+ `}}
3472
+
3473
+ var buttonVersion = "12.3.2";
3474
+
3475
+ var iconVersion = "9.2.0";
3476
+
3477
+ var colorCss = i$5`dialog.container .wrapper{background:var(--ds-auro-dialog-container-color);color:var(--ds-auro-dialog-text-color)}dialog.container::backdrop{background:var(--ds-auro-dialog-overlay-open-background-color)}dialog.container:not([popover])::backdrop{background:var(--ds-auro-dialog-overlay-modal-background-color)}@media screen and (min-width:768px){dialog.container{box-shadow:var(--ds-auro-dialog-boxshadow-color)}}.dialog-header--action{border:2px solid transparent;border-radius:var(--ds-border-radius, .375rem);background-color:transparent}
3478
+ `;
3479
+
3480
+ var styleCss = i$5`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);font-weight:var(--wcss-body-default-weight, );line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-default-emphasized{font-size:var(--wcss-body-default-emphasized-font-size, 1rem);font-weight:var(--wcss-body-default-emphasized-weight, );line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);font-weight:var(--wcss-body-lg-weight, );line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg,.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg-emphasized{font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);font-weight:var(--wcss-body-lg-emphasized-weight, );line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);font-weight:var(--wcss-body-sm-weight, );line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-sm-emphasized{font-size:var(--wcss-body-sm-emphasized-font-size, .875rem);font-weight:var(--wcss-body-sm-emphasized-weight, );line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);font-weight:var(--wcss-body-xs-weight, );line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs,.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs-emphasized{font-size:var(--wcss-body-xs-emphasized-font-size, .75rem);font-weight:var(--wcss-body-xs-emphasized-weight, );line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-2xs-weight, );line-height:var(--wcss-body-2xs-line-height, .875rem)}.body-2xs,.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-2xs-emphasized{font-size:var(--wcss-body-2xs-emphasized-font-size, .625rem);font-weight:var(--wcss-body-2xs-emphasized-weight, );line-height:var(--wcss-body-2xs-emphasized-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 300);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 300);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{--insetPaddingXl: 0 var(--ds-size-400, 2rem) var(--ds-size-400, 2rem) var(--ds-size-400, 2rem);--insetPaddingXxl: 0 var(--ds-size-600, 3rem) var(--ds-size-600, 3rem) var(--ds-size-600, 3rem);--insetPaddingXxxl: 0 var(--ds-size-800, 4rem) var(--ds-size-800, 4rem) var(--ds-size-800, 4rem)}[auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}.dialogOverlay{position:fixed;z-index:-1;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.dialogOverlay--open{z-index:var(--ds-depth-overlay);pointer-events:unset;transition:background .3s cubic-bezier(.4,0,.2,0)}.dialogOverlay--modal{z-index:var(--ds-depth-overlay);transition:background .3s cubic-bezier(.4,0,.5,0)}.bib{position:fixed;inset:0;visibility:hidden;overflow:hidden}.bib dialog.container{display:inline-block;width:100%;max-width:none;height:100%;max-height:none;padding:0;border-width:medium;border-style:none;border-color:currentcolor;border-image:initial;margin:0;background-color:transparent;outline:none;transform:translateZ(0);overflow:hidden}:host([open]) .bib{visibility:visible}.dialog{position:fixed;z-index:-1;top:unset;right:0;bottom:-100%;left:0;box-sizing:border-box;display:flex;flex-direction:column;overflow:visible;width:calc(100% - var(--insetPaddingXl) - var(--insetPaddingXl));max-height:90%;padding:var(--insetPaddingXl);opacity:0;border:0;margin:0;max-width:none;transition:opacity .3s ease-in-out,visibility .3s ease-in-out,bottom .3s ease-in-out}.dialog--open{z-index:var(--ds-depth-modal, 300);visibility:visible;bottom:0;opacity:1}@media screen and (min-width:768px){.dialog{top:10%;bottom:unset;left:0;right:0;max-width:80%;max-height:80%;margin:auto;padding:var(--insetPaddingXxxl);opacity:0;width:calc(100% - var(--insetPaddingXxxl) - var(--insetPaddingXxxl));height:auto;overflow:visible}.dialog--open{opacity:1}}@media screen and (min-width:1024px){.dialog{max-width:986px}}.dialog-footer{padding-top:var(--ds-size-400, 2rem)}@media screen and (min-width:768px){.dialog-footer ::slotted(*){display:flex;justify-content:flex-end}}.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;padding-top:var(--ds-size-800, 4rem);margin-bottom:var(--ds-size-300, 1.5rem)}.dialog-header--action{margin:0;padding:0}.dialog-header--action:hover{cursor:pointer}.dialog-header .heading{flex:1;margin-block:0}.dialog-content{flex:1;overflow:auto;overscroll-behavior:contain;margin:calc(-1 * var(--ds-size-100));padding:var(--ds-size-100)}::slotted([slot=content]){position:relative}:host([unformatted]) .dialog-header--action{position:absolute;top:var(--ds-size-400, 2rem);bottom:unset;right:var(--ds-size-400, 2rem)}@media screen and (min-width:768px){:host([unformatted]) .dialog-header--action{top:var(--ds-size-800, 4rem);bottom:unset;right:var(--ds-size-800, 4rem)}}:host([sm]) .dialog{max-height:30%}@media screen and (min-width:768px){:host([sm]) .dialog{top:10%;bottom:unset;max-width:40%;max-height:80%;padding:var(--insetPaddingXxl)}}@media screen and (min-width:1024px){:host([sm]) .dialog{max-width:740px}}:host([md]) .dialog{max-height:50%}@media screen and (min-width:768px){:host([md]) .dialog{top:10%;bottom:unset;max-width:70%;max-height:80%}}@media screen and (min-width:1024px){:host([md]) .dialog{top:10%;bottom:unset;max-width:986px}}@media screen and (min-width:768px){:host([sm][lg]) .dialog,:host([md][lg]) .dialog{max-height:80%}}:host([sm][lg]) .dialog,:host([md][lg]) .dialog{max-height:90%}:host([unformatted]) .dialog{padding:0}
3481
+ `;
3482
+
3483
+ var styleUnformattedCss = i$5`[unformatted] .unformattedWrapper{padding:var(--ds-size-400, 2rem)}@media screen and (min-width:768px){[unformatted] .unformattedWrapper{padding:var(--ds-size-800, 4rem);padding-top:var(--ds-size-400, 2rem)}}
3484
+ `;
3485
+
3486
+ var tokensCss = i$5`:host{--ds-auro-dialog-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dialog-boxshadow-color: var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, .2));--ds-auro-dialog-overlay-modal-background-color: var(--ds-advanced-color-shared-scrim, rgba(0, 0, 0, .5));--ds-auro-dialog-overlay-open-background-color: var(--ds-advanced-color-shared-scrim, rgba(0, 0, 0, .5));--ds-auro-dialog-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}
3487
+ `;
3488
+
3489
+ // Copyright (c) 2024 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
3490
+ // See LICENSE in the project root for license information.
3491
+
3492
+
3493
+ const MOBILE_BREAKPOINT = '--ds-grid-breakpoint-md';
3494
+ /**
3495
+ * @slot header - Text to display as the header of the modal
3496
+ * @slot content - Injects content into the body of the modal
3497
+ * @slot footer - Used for action options, e.g. buttons
3498
+ * @slot ariaLabel.dialog.close - Text to describe the "x" icon close button for screen readers. Default: "Close".
3499
+ * @event toggle - Event fires when the element is closed
3500
+ * @csspart close-button - adjust position of the close X icon in the dialog window
3501
+ * @csspart dialog-overlay - DEPRECATED. Use `--ds-auro-dialog-overlay-modal-background-color` or `--ds-auro-dialog-overlay-open-background-color` for backdrop styling instead.
3502
+ * @csspart dialog - apply CSS to the entire dialog
3503
+ * @csspart dialog-header - apply CSS to the header of the dialog
3504
+ * @csspart dialog-content - apply CSS to the content of the dialog
3505
+ * @csspart dialog-footer - apply CSS to the footer of the dialog
3506
+ */
3507
+ class ComponentBase extends i$2 {
3508
+ constructor() {
3509
+ super();
3510
+
3511
+ this._initializeDefaults();
3512
+ }
3513
+
3514
+ _initializeDefaults() {
3515
+ this.modal = false;
3516
+ this.unformatted = false;
3517
+ this.closeButtonAppearance = 'default';
3518
+
3519
+ this.isPopoverVisible = false;
3520
+ this.isBibFullscreen = false;
3521
+ this.floater = new AuroFloatingUI(this, 'dialog');
3522
+
3523
+ const versioning = new AuroDependencyVersioning();
3524
+
3525
+ /**
3526
+ * @private
3527
+ */
3528
+ this.buttonTag = versioning.generateTag(
3529
+ "auro-button",
3530
+ buttonVersion,
3531
+ T,
3532
+ );
3533
+
3534
+ /**
3535
+ * @private
3536
+ */
3537
+ this.iconTag = versioning.generateTag("auro-icon", iconVersion, k);
3538
+
3539
+ /**
3540
+ * @private
3541
+ */
3542
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
3543
+ }
3544
+
3545
+ static get properties() {
3546
+ return {
3547
+
3548
+ /**
3549
+ * Defines whether the close button should be light colored for use on dark backgrounds.
3550
+ * @type {'default'|'inverse'}
3551
+ * @default 'default'
3552
+ */
3553
+ closeButtonAppearance: {
3554
+ type: String,
3555
+ attribute: 'close-button-appearance',
3556
+ reflect: true
3557
+ },
3558
+
3559
+ /**
3560
+ * Sets dialog box to large style. Adding both lg and sm/md will set the dialog to lg for mobile and sm/md for desktop.
3561
+ * Must be used in conjunction with sm or md to have an effect.
3562
+ */
3563
+ lg: {
3564
+ type: Boolean,
3565
+ reflect: true
3566
+ },
3567
+
3568
+ /**
3569
+ * Sets dialog box to medium style. Adding both md and lg will set the dialog to md for desktop and lg for mobile.
3570
+ */
3571
+ md: {
3572
+ type: Boolean,
3573
+ reflect: true
3574
+ },
3575
+
3576
+ /**
3577
+ * Modal dialog restricts the user to take an action (no default close actions).
3578
+ */
3579
+ modal: { type: Boolean },
3580
+
3581
+ /**
3582
+ * DEPRECATED - use `close-button-appearance="inverse" instead.
3583
+ */
3584
+ onDark: {
3585
+ type: Boolean,
3586
+ reflect: true
3587
+ },
3588
+
3589
+ /**
3590
+ * Sets state of dialog to open.
3591
+ */
3592
+ isPopoverVisible: {
3593
+ type: Boolean,
3594
+ reflect: true,
3595
+ attribute: 'open'
3596
+ },
3597
+
3598
+ /**
3599
+ * If true, the dialog bib is in fullscreen mode.
3600
+ * @private
3601
+ */
3602
+ isBibFullscreen: {
3603
+ type: Boolean,
3604
+ reflect: true
3605
+ },
3606
+
3607
+ /**
3608
+ * Sets dialog box to small style. Adding both sm and lg will set the dialog to sm for desktop and lg for mobile.
3609
+ */
3610
+ sm: {
3611
+ type: Boolean,
3612
+ reflect: true
3613
+ },
3614
+
3615
+ /**
3616
+ * The element to focus when the dialog is closed. If not set, defaults to the value of document.activeElement when the dialog is opened.
3617
+ * @type {HTMLElement}
3618
+ */
3619
+ triggerElement: {
3620
+ type: Object,
3621
+ attribute: false
3622
+ },
3623
+
3624
+ /**
3625
+ * Unformatted dialog window, edge-to-edge fill for content.
3626
+ */
3627
+ unformatted: {
3628
+ type: Boolean,
3629
+ reflect: true
3630
+ }
3631
+ };
3632
+ }
3633
+
3634
+ get open() {
3635
+ return this.isPopoverVisible;
3636
+ }
3637
+
3638
+ set open(value) {
3639
+ this.isPopoverVisible = Boolean(value);
3640
+ }
3641
+
3642
+ /**
3643
+ * @ignore
3644
+ */
3645
+ get floaterConfig() {
3646
+ if (!ComponentBase._mobileBreakpointValue) {
3647
+ const docStyle = getComputedStyle(document.documentElement);
3648
+ ComponentBase._mobileBreakpointValue = docStyle.getPropertyValue(MOBILE_BREAKPOINT).trim();
3649
+ }
3650
+ return {
3651
+ prefix: 'auroDialog',
3652
+ fullscreenBreakpoint: ComponentBase._mobileBreakpointValue,
3653
+ };
3654
+ }
3655
+
3656
+ get behavior() {
3657
+ return 'dialog';
3658
+ }
3659
+
3660
+ firstUpdated() {
3661
+ // Add the tag name as an attribute if it is different than the component name
3662
+ this.runtimeUtils.handleComponentTagRename(this, "auro-dialog");
3663
+
3664
+ const slot = this.shadowRoot.querySelector("#footer");
3665
+ const slotWrapper = this.shadowRoot.querySelector("#footerWrapper");
3666
+
3667
+ this.dialog = this.shadowRoot.getElementById("dialog");
3668
+
3669
+ if (!this.unformatted && slot.assignedNodes().length === 0) {
3670
+ slotWrapper.classList.remove("dialog-footer");
3671
+ }
3672
+
3673
+ this.floater.configure(this, this.floaterConfig.prefix);
3674
+
3675
+ // Forward FloatingUI toggle event to backward-compatible 'toggle' event
3676
+ this.addEventListener('auroDialog-toggled', (event) => {
3677
+ if (!event.detail.expanded) {
3678
+ this.dispatchToggleEvent();
3679
+ }
3680
+ });
3681
+
3682
+ // Always intercept the native ESC/cancel event so we can decide
3683
+ // whether to honour it based on `modal`. Re-dispatch via FloatingUI
3684
+ // for non-modal so the hide lifecycle runs correctly.
3685
+ this.dialog.addEventListener('cancel', (e) => {
3686
+ e.preventDefault();
3687
+ if (!this.modal) {
3688
+ this.hide();
3689
+ }
3690
+ });
3691
+
3692
+ // Clicks that land directly on the <dialog> element (not on a child) are
3693
+ // backdrop clicks. With the dialog in the top layer the ::backdrop sits above
3694
+ // the deprecated overlay div, so this listener replaces the overlay div's
3695
+ // click handler for backdrop-area interactions.
3696
+ this.dialog.addEventListener('click', (e) => {
3697
+ if (e.target !== this.dialog) {
3698
+ return;
3699
+ }
3700
+ if (this.modal) {
3701
+ return; // Modal drawers require an explicit action to close.
3702
+ }
3703
+ if (AuroFloatingUI.topOpeningFloatingUI !== this.floater) {
3704
+ return; // there is another floatingUI that is currently visible, so ignore backdrop clicks on this one
3705
+ }
3706
+ this.hide();
3707
+ });
3708
+ }
3709
+
3710
+ /**
3711
+ * LitElement lifecycle method. Called after the DOM has been updated.
3712
+ * @param {Map<string, any>} changedProperties - Keys are the names of changed properties, values are the corresponding previous values.
3713
+ * @returns {void}
3714
+ */
3715
+ updated(changedProperties) {
3716
+ this.floater.handleUpdate(changedProperties);
3717
+
3718
+ if (changedProperties.has('isPopoverVisible')) {
3719
+ if (this.isPopoverVisible) {
3720
+ if (!this.floater.showing) {
3721
+ this.show();
3722
+ }
3723
+ } else {
3724
+ if (this.floater.showing) {
3725
+ this.hide();
3726
+ }
3727
+ }
3728
+ }
3729
+
3730
+ if (changedProperties.has('triggerElement')) {
3731
+ this.floater.configure(this, this.floaterConfig.prefix);
3732
+ }
3733
+ }
3734
+
3735
+ disconnectedCallback() {
3736
+ super.disconnectedCallback();
3737
+ if (this._hidePopoverTimerId) {
3738
+ clearTimeout(this._hidePopoverTimerId);
3739
+ this._hidePopoverTimerId = undefined;
3740
+ }
3741
+ if (this._focusFallbackTimerId) {
3742
+ clearTimeout(this._focusFallbackTimerId);
3743
+ this._focusFallbackTimerId = undefined;
3744
+ }
3745
+ if (this.focusTrap) {
3746
+ this.focusTrap.disconnect();
3747
+ this.focusTrap = undefined;
3748
+ }
3749
+ this._focusTrapActivated = false;
3750
+ this.floater.disconnect();
3751
+ }
3752
+
3753
+ /**
3754
+ * @private
3755
+ * @returns {void}
3756
+ */
3757
+ openDialog() {
3758
+ this.defaultTrigger = document.activeElement || this.triggerElement;
3759
+
3760
+ if (this._hidePopoverTimerId) {
3761
+ clearTimeout(this._hidePopoverTimerId);
3762
+ this._hidePopoverTimerId = undefined;
3763
+ }
3764
+
3765
+ if (this.modal) {
3766
+ this.dialog.showModal();
3767
+ } else {
3768
+ this.dialog.showPopover();
3769
+ }
3770
+
3771
+ if (this._focusFallbackTimerId) {
3772
+ clearTimeout(this._focusFallbackTimerId);
3773
+ this._focusFallbackTimerId = undefined;
3774
+ }
3775
+ if (this.focusTrap) {
3776
+ this.focusTrap.disconnect();
3777
+ }
3778
+
3779
+ this.focusTrap = new FocusTrap(this.dialog);
3780
+ this._focusTrapActivated = false;
3781
+
3782
+ // Fallback: if transitionend never fires (dialog mounted already-open,
3783
+ // reduced motion, or interrupted transition), engage the focus trap after
3784
+ // the transition duration elapses. 350ms = CSS open transition (300ms in
3785
+ // style.scss) + 50ms buffer.
3786
+ this._focusFallbackTimerId = setTimeout(() => {
3787
+ this._focusFallbackTimerId = undefined;
3788
+ if (this.isPopoverVisible && this.focusTrap && !this._focusTrapActivated) {
3789
+ this.focusTrap.focusFirstElement();
3790
+ this._focusTrapActivated = true;
3791
+ }
3792
+ }, 350);
3793
+ }
3794
+
3795
+ /**
3796
+ * Cancels the focus-trap fallback timer (if pending) and moves focus into
3797
+ * the dialog once the open CSS transition completes. No-ops when the
3798
+ * fallback timer already activated the trap (_focusTrapActivated === true).
3799
+ * @private
3800
+ */
3801
+ onDialogTransitionEnd() {
3802
+ if (this._focusFallbackTimerId) {
3803
+ clearTimeout(this._focusFallbackTimerId);
3804
+ this._focusFallbackTimerId = undefined;
3805
+ }
3806
+ if (this.isPopoverVisible && this.focusTrap && !this._focusTrapActivated) {
3807
+ this.focusTrap.focusFirstElement();
3808
+ this._focusTrapActivated = true;
3809
+ }
3810
+ }
3811
+
3812
+ /**
3813
+ * @private
3814
+ * @returns {void}
3815
+ */
3816
+ closeDialog() {
3817
+ if (this._focusFallbackTimerId) {
3818
+ clearTimeout(this._focusFallbackTimerId);
3819
+ this._focusFallbackTimerId = undefined;
3820
+ }
3821
+ this._focusTrapActivated = false;
3822
+
3823
+ if (this.focusTrap) {
3824
+ this.focusTrap.disconnect();
3825
+ this.focusTrap = undefined;
3826
+ }
3827
+
3828
+ if (this.modal) {
3829
+ // Dialog spec: close() immediately so the top-layer focus restriction is
3830
+ // lifted before we attempt to restore focus to the trigger.
3831
+ if (this.dialog?.open) {
3832
+ this.dialog.close();
3833
+ }
3834
+ } else {
3835
+ // Popover spec: delay hidePopover() so the dialog stays in the top layer
3836
+ // during the CSS close animation before leaving it.
3837
+ if (!this._hidePopoverTimerId) {
3838
+ this._hidePopoverTimerId = setTimeout(() => {
3839
+ this.dialog?.hidePopover?.();
3840
+ this._hidePopoverTimerId = undefined;
3841
+ }, 300);
3842
+ }
3843
+ }
3844
+
3845
+ if (this.defaultTrigger) {
3846
+ this.defaultTrigger.focus();
3847
+ this.defaultTrigger = undefined;
3848
+ }
3849
+ }
3850
+
3851
+ /**
3852
+ * @private
3853
+ * @returns {void}
3854
+ */
3855
+ dispatchToggleEvent() {
3856
+ const toggleEvent = new Event("toggle", {
3857
+ bubbles: true,
3858
+ cancelable: false
3859
+ });
3860
+
3861
+ this.dispatchEvent(toggleEvent);
3862
+ }
3863
+
3864
+ /**
3865
+ * @private
3866
+ * @returns {void}
3867
+ */
3868
+ handleCloseButtonClick() {
3869
+ this.hide();
3870
+ }
3871
+
3872
+ /**
3873
+ * Focus the dialog.
3874
+ * @private
3875
+ * @returns {void}
3876
+ */
3877
+ focus() {
3878
+ if (this.isPopoverVisible) {
3879
+ this.dialog.focus();
3880
+ }
3881
+ }
3882
+
3883
+ /**
3884
+ * Opens the dialog.
3885
+ * @returns {void}
3886
+ */
3887
+ show() {
3888
+ this.floater.showBib();
3889
+ this.openDialog();
3890
+ }
3891
+
3892
+ /**
3893
+ * Closes the dialog.
3894
+ * @returns {void}
3895
+ */
3896
+ hide() {
3897
+ this.floater.hideBib();
3898
+ this.closeDialog();
3899
+ }
3900
+
3901
+ static get styles() {
3902
+ return [styleCss, styleUnformattedCss, colorCss, tokensCss];
3903
+ }
3904
+
3905
+ /**
3906
+ * @private
3907
+ * @returns {TemplateResult} - The close button template.
3908
+ */
3909
+ getCloseButton() {
3910
+ return this.modal
3911
+ ? u$2``
3912
+ : u$2`
3913
+ <${this.buttonTag}
3914
+ aria-label="${this.runtimeUtils.getSlotText(this, 'ariaLabel.dialog.close') || 'Close'}"
3915
+ variant="ghost"
3916
+ shape="circle"
3917
+ size="sm"
3918
+ appearance=${this.hasAttribute("ondark") ? 'inverse' : this.closeButtonAppearance}
3919
+ class="dialog-header--action"
3920
+ id="dialog-close"
3921
+ @click="${this.handleCloseButtonClick}"
3922
+ part="close-button"
3923
+ >
3924
+ <${this.iconTag} customColor category="interface" name="x-lg"></${this.iconTag}>
3925
+ </${this.buttonTag}>
3926
+ `;
3927
+ }
3928
+
3929
+ render() {
3930
+ const classes = {
3931
+ dialogOverlay: true,
3932
+ "dialogOverlay--modal": this.modal && this.isPopoverVisible,
3933
+ "dialogOverlay--open": this.isPopoverVisible,
3934
+ util_displayHidden: !this.isPopoverVisible,
3935
+ };
3936
+ const wrapperClasses = {
3937
+ dialog: true,
3938
+ wrapper: true,
3939
+ "dialog--open": this.isPopoverVisible,
3940
+ };
3941
+
3942
+ return u$2`
3943
+ <!-- Hidden slot for close button aria-label -->
3944
+ <slot name="ariaLabel.dialog.close" hidden @slotchange=${this.requestUpdate}></slot>
3945
+
3946
+ <!-- @deprecated dialog-overlay: backdrop styling is now provided by ::backdrop on the dialog element.
3947
+ Retained for backward compatibility; part="dialog-overlay" remains available for custom CSS. -->
3948
+ <div class="${e(classes)}" id="dialog-overlay" part="dialog-overlay"></div>
3949
+
3950
+ <div id="bib" class="bib">
3951
+ <dialog
3952
+ id="dialog"
3953
+ popover="${o$1(this.modal ? undefined : 'manual')}"
3954
+ class="container"
3955
+ aria-labelledby="dialog-header"
3956
+ aria-describedby="dialog-content">
3957
+ <div class="${e(wrapperClasses)}"
3958
+ part="dialog"
3959
+ @transitionend="${this.onDialogTransitionEnd}">
3960
+ ${
3961
+ this.unformatted
3962
+ ? u$2`
3963
+ <slot name="content"></slot>
3964
+ ${this.getCloseButton()}
3965
+ `
3966
+ : u$2`
3967
+ <div class="dialog-header" part="dialog-header">
3968
+ <h1 class="heading heading-lg util_stackMarginNone--top" id="dialog-header">
3969
+ <slot name="header">Default header...</slot>
3970
+ </h1>
3971
+ ${this.getCloseButton()}
3972
+ </div>
3973
+ <div id="dialog-content" class="dialog-content body-default" part="dialog-content">
3974
+ <slot name="content"></slot>
3975
+ </div>
3976
+ <div class="dialog-footer" id="footerWrapper" part="dialog-footer">
3977
+ <slot name="footer" id="footer"></slot>
3978
+ </div>
3979
+ `
3980
+ }
3981
+ </div>
3982
+ </dialog>
3983
+ </div>
3984
+ `;
3985
+ }
3986
+ }
3987
+
3988
+ // Copyright (c) 2024 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
3989
+ // See LICENSE in the project root for license information.
3990
+
3991
+
3992
+ /**
3993
+ * The `auro-dialog` appears on top of the page and presents information that requires the users immediate attention.
3994
+ * @customElement auro-dialog
3995
+ */
3996
+ class AuroDialog extends ComponentBase {
3997
+
3998
+ static get properties() {
3999
+ return {
4000
+ ...ComponentBase.properties,
4001
+ };
4002
+ }
4003
+
4004
+ static get styles() {
4005
+ return [ComponentBase.styles];
4006
+ }
4007
+
4008
+ /**
4009
+ * This will register this element with the browser.
4010
+ * @param {string} [name="auro-dialog"] - The name of the element that you want to register.
4011
+ *
4012
+ * @example
4013
+ * AuroDialog.register("custom-dialog") // this will register this element to <custom-dialog/>
4014
+ *
4015
+ */
4016
+ static register(name = "auro-dialog") {
4017
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroDialog);
4018
+ }
4019
+ }
4020
+
4021
+ AuroDialog.register();
4022
+
4023
+ function initExamples(initCount) {
4024
+ // biome-ignore lint/style/noParameterAssign: legacy error handling
4025
+ initCount = initCount || 0;
4026
+
4027
+ try {
4028
+ initSizeOptionsExample();
4029
+ initDecoupledExample();
4030
+ initAccessibilityUnformattedHeaderExample();
4031
+ } catch (_err) {
4032
+ if (initCount <= 20) {
4033
+ // setTimeout handles issue where content is sometimes loaded after the functions get called
4034
+ setTimeout(() => {
4035
+ initExamples(initCount + 1);
4036
+ }, 100);
4037
+ }
4038
+ }
4039
+ }
4040
+
4041
+ export { initExamples };