@aurodesignsystem-dev/auro-card 0.0.0-pr130.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,2807 @@
1
+ /**
2
+ * @license
3
+ * Copyright 2019 Google LLC
4
+ * SPDX-License-Identifier: BSD-3-Clause
5
+ */
6
+ const t$2=globalThis,e$5=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$4=Symbol(),o$7=new WeakMap;let n$5 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$4)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$5&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$7.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$7.set(s,t));}return t}toString(){return this.cssText}};const r$3=t=>new n$5("string"==typeof t?t:t+"",void 0,s$4),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$5(o,t,s$4)},S$1=(s,o)=>{if(e$5)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$3=e$5?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$3(e)})(t):t;
7
+
8
+ /**
9
+ * @license
10
+ * Copyright 2017 Google LLC
11
+ * SPDX-License-Identifier: BSD-3-Clause
12
+ */const{is:i$4,defineProperty:e$4,getOwnPropertyDescriptor:h$3,getOwnPropertyNames:r$2,getOwnPropertySymbols:o$6,getPrototypeOf:n$4}=Object,a$2=globalThis,c$2=a$2.trustedTypes,l$2=c$2?c$2.emptyScript:"",p$1=a$2.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$2={toAttribute(t,s){switch(s){case Boolean:t=t?l$2:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$3=(t,s)=>!i$4(t,s),b={attribute:true,type:String,converter:u$2,reflect:false,useDefault:false,hasChanged:f$3};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;let y$1 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$4(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$3(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$4(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...r$2(t),...o$6(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$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$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$2).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$2;this._$Em=e,this[e]=h.fromAttribute(s,t.type)??this._$Ej?.get(e)??null,this._$Em=null;}}requestUpdate(t,s,i){if(void 0!==t){const e=this.constructor,h=this[t];if(i??=e.getPropertyOptions(t),!((i.hasChanged??f$3)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(e._$Eu(t,i))))return;this.C(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$EP());}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),true!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),true===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t));}async _$EP(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];true!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e);}}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EM();}catch(s){throw t=false,this._$EM(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EM(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Eq&&=this._$Eq.forEach((t=>this._$ET(t,this[t]))),this._$EM();}updated(t){}firstUpdated(t){}};y$1.elementStyles=[],y$1.shadowRootOptions={mode:"open"},y$1[d$1("elementProperties")]=new Map,y$1[d$1("finalized")]=new Map,p$1?.({ReactiveElement:y$1}),(a$2.reactiveElementVersions??=[]).push("2.1.0");
13
+
14
+ /**
15
+ * @license
16
+ * Copyright 2017 Google LLC
17
+ * SPDX-License-Identifier: BSD-3-Clause
18
+ */
19
+ const t$1=globalThis,i$3=t$1.trustedTypes,s$3=i$3?i$3.createPolicy("lit-html",{createHTML:t=>t}):void 0,e$3="$lit$",h$2=`lit$${Math.random().toFixed(9).slice(2)}$`,o$5="?"+h$2,n$3=`<${o$5}>`,r$1=document,l$1=()=>r$1.createComment(""),c$1=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a$1=Array.isArray,u$1=t=>a$1(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f$2=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),T=Symbol.for("lit-noChange"),E=Symbol.for("lit-nothing"),A=new WeakMap,C=r$1.createTreeWalker(r$1,129);function P(t,i){if(!a$1(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==s$3?s$3.createHTML(i):i}const V=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":3===i?"<math>":"",c=f$2;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f$2?"!--"===u[1]?c=v:void 0!==u[1]?c=_:void 0!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):void 0!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f$2,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f$2:(c=m,r=void 0);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f$2?s+n$3:d>=0?(o.push(a),s.slice(0,d)+e$3+s.slice(d)+h$2+x):s+h$2+(-2===d?i:x);}return [P(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),o]};class N{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=V(t,s);if(this.el=N.createElement(f,n),C.currentNode=this.el.content,2===s||3===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=C.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$3)){const i=v[a++],s=r.getAttribute(t).split(h$2),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?H:"?"===e[1]?I:"@"===e[1]?L:k}),r.removeAttribute(t);}else t.startsWith(h$2)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h$2),s=t.length-1;if(s>0){r.textContent=i$3?i$3.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l$1()),C.nextNode(),d.push({type:2,index:++c});r.append(t[s],l$1());}}}else if(8===r.nodeType)if(r.data===o$5)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h$2,t+1));)d.push({type:7,index:c}),t+=h$2.length-1;}c++;}}static createElement(t,i){const s=r$1.createElement("template");return s.innerHTML=t,s}}function S(t,i,s=t,e){if(i===T)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=c$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=S(t,h._$AS(t,i.values),h,e)),i}class M{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??r$1).importNode(i,true);C.currentNode=e;let h=C.nextNode(),o=0,n=0,l=s[0];for(;void 0!==l;){if(o===l.index){let i;2===l.type?i=new R(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new z(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=C.nextNode(),o++);}return C.currentNode=r$1,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class R{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=E,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=S(this,t,i),c$1(t)?t===E||null==t||""===t?(this._$AH!==E&&this._$AR(),this._$AH=E):t!==this._$AH&&t!==T&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):u$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!==E&&c$1(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$1.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=N.createElement(P(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new M(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return void 0===i&&A.set(t.strings,i=new N(t)),i}k(t){a$1(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 R(this.O(l$1()),this.O(l$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,i){for(this._$AP?.(false,true,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class k{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=E,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=E;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=S(this,t,i,0),o=!c$1(t)||t!==this._$AH&&t!==T,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=S(this,e[s+n],i,n),r===T&&(r=this._$AH[n]),o||=!c$1(r)||r!==this._$AH[n],r===E?t=E:t!==E&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===E?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class H extends k{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===E?void 0:t;}}class I extends k{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==E);}}class L extends k{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=S(this,t,i,0)??E)===T)return;const s=this._$AH,e=t===E&&s!==E||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==E&&(s===E||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){S(this,t);}}const j=t$1.litHtmlPolyfillSupport;j?.(N,R),(t$1.litHtmlVersions??=[]).push("3.3.0");const B=(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 R(i.insertBefore(l$1(),t),t,void 0,s??{});}return h._$AI(t),h};
20
+
21
+ /**
22
+ * @license
23
+ * Copyright 2017 Google LLC
24
+ * SPDX-License-Identifier: BSD-3-Clause
25
+ */const s$2=globalThis;let i$2 = class i extends y$1{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=B(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return T}};i$2._$litElement$=true,i$2["finalized"]=true,s$2.litElementHydrateSupport?.({LitElement:i$2});const o$4=s$2.litElementPolyfillSupport;o$4?.({LitElement:i$2});(s$2.litElementVersions??=[]).push("4.2.0");
26
+
27
+ /**
28
+ * @license
29
+ * Copyright 2020 Google LLC
30
+ * SPDX-License-Identifier: BSD-3-Clause
31
+ */
32
+ const a=Symbol.for(""),o$3=t=>{if(t?.r===a)return t?._$litStatic$},s$1=t=>({_$litStatic$:t,r:a}),i$1=(t,...r)=>({_$litStatic$:r.reduce(((r,e,a)=>r+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1]),t[0]),r:a}),l=new Map,n$2=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$3(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l.get(t))&&(n.raw=n,l.set(t,r=n)),e=u;}return t(r,...e)},u=n$2(x);
33
+
34
+ /**
35
+ * @license
36
+ * Copyright 2020 Google LLC
37
+ * SPDX-License-Identifier: BSD-3-Clause
38
+ */const f$1=o=>void 0===o.strings;
39
+
40
+ /**
41
+ * @license
42
+ * Copyright 2017 Google LLC
43
+ * SPDX-License-Identifier: BSD-3-Clause
44
+ */
45
+ const t={ATTRIBUTE:1,CHILD:2},e$2=t=>(...e)=>({_$litDirective$:t,values:e});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)}}
46
+
47
+ /**
48
+ * @license
49
+ * Copyright 2017 Google LLC
50
+ * SPDX-License-Identifier: BSD-3-Clause
51
+ */const s=(i,t)=>{const e=i._$AN;if(void 0===e)return false;for(const i of e)i._$AO?.(t,false),s(i,t);return true},o$2=i=>{let t,e;do{if(void 0===(t=i._$AM))break;e=t._$AN,e.delete(i),i=t;}while(0===e?.size)},r=i=>{for(let t;t=i._$AM;i=t){let e=t._$AN;if(void 0===e)t._$AN=e=new Set;else if(e.has(i))break;e.add(i),c(t);}};function h$1(i){ void 0!==this._$AN?(o$2(this),this._$AM=i,r(this)):this._$AM=i;}function n$1(i,t=false,e=0){const r=this._$AH,h=this._$AN;if(void 0!==h&&0!==h.size)if(t)if(Array.isArray(r))for(let i=e;i<r.length;i++)s(r[i],false),o$2(r[i]);else null!=r&&(s(r,false),o$2(r));else s(this,i);}const c=i=>{i.type==t.CHILD&&(i._$AP??=n$1,i._$AQ??=h$1);};class f extends i{constructor(){super(...arguments),this._$AN=void 0;}_$AT(i,t,e){super._$AT(i,t,e),r(this),this.isConnected=i._$AU;}_$AO(i,t=true){i!==this.isConnected&&(this.isConnected=i,i?this.reconnected?.():this.disconnected?.()),t&&(s(this,i),o$2(this));}setValue(t){if(f$1(this._$Ct))this._$Ct._$AI(t,this);else {const i=[...this._$Ct._$AH];i[this._$Ci]=t,this._$Ct._$AI(i,this,0);}}disconnected(){}reconnected(){}}
52
+
53
+ /**
54
+ * @license
55
+ * Copyright 2020 Google LLC
56
+ * SPDX-License-Identifier: BSD-3-Clause
57
+ */const e$1=()=>new h;class h{}const o$1=new WeakMap,n=e$2(class extends f{render(i){return E}update(i,[s]){const e=s!==this.G;return e&&void 0!==this.G&&this.rt(void 0),(e||this.lt!==this.ct)&&(this.G=s,this.ht=i.options?.host,this.rt(this.ct=i.element)),E}rt(t){if(this.isConnected||(t=void 0),"function"==typeof this.G){const i=this.ht??globalThis;let s=o$1.get(i);void 0===s&&(s=new WeakMap,o$1.set(i,s)),void 0!==s.get(this.G)&&this.G.call(this.ht,void 0),s.set(this.G,t),void 0!==t&&this.G.call(this.ht,t);}else this.G.value=t;}get lt(){return "function"==typeof this.G?o$1.get(this.ht??globalThis)?.get(this.G):this.G?.value}disconnected(){this.lt===this.ct&&this.rt(void 0);}reconnected(){this.rt(this.ct);}});
58
+
59
+ /**
60
+ * @license
61
+ * Copyright 2018 Google LLC
62
+ * SPDX-License-Identifier: BSD-3-Clause
63
+ */const o=o=>o??E;
64
+
65
+ /**
66
+ * @license
67
+ * Copyright 2018 Google LLC
68
+ * SPDX-License-Identifier: BSD-3-Clause
69
+ */const e=e$2(class extends i{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 T}});
70
+
71
+ let AuroElement$2 = class AuroElement extends i$2 {
72
+ static get properties() {
73
+ return {
74
+
75
+ /**
76
+ * Defines the language of an element.
77
+ * @default {'default'}
78
+ */
79
+ layout: {
80
+ type: String,
81
+ attribute: "layout",
82
+ reflect: true
83
+ },
84
+
85
+ shape: {
86
+ type: String,
87
+ attribute: "shape",
88
+ reflect: true
89
+ },
90
+
91
+ size: {
92
+ type: String,
93
+ attribute: "size",
94
+ reflect: true
95
+ },
96
+
97
+ onDark: {
98
+ type: Boolean,
99
+ attribute: "ondark",
100
+ reflect: true
101
+ }
102
+ };
103
+ }
104
+
105
+ };
106
+
107
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
108
+ // See LICENSE in the project root for license information.
109
+
110
+ // ---------------------------------------------------------------------
111
+
112
+ /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
113
+
114
+ class AuroLibraryRuntimeUtils {
115
+
116
+ /* eslint-disable jsdoc/require-param */
117
+
118
+ /**
119
+ * This will register a new custom element with the browser.
120
+ * @param {String} name - The name of the custom element.
121
+ * @param {Object} componentClass - The class to register as a custom element.
122
+ * @returns {void}
123
+ */
124
+ registerComponent(name, componentClass) {
125
+ if (!customElements.get(name)) {
126
+ customElements.define(name, class extends componentClass {});
127
+ }
128
+ }
129
+
130
+ /**
131
+ * Finds and returns the closest HTML Element based on a selector.
132
+ * @returns {void}
133
+ */
134
+ closestElement(
135
+ selector, // selector like in .closest()
136
+ base = this, // extra functionality to skip a parent
137
+ __Closest = (el, found = el && el.closest(selector)) =>
138
+ !el || el === document || el === window
139
+ ? null // standard .closest() returns null for non-found selectors also
140
+ : found
141
+ ? found // found a selector INside this element
142
+ : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
143
+ ) {
144
+ return __Closest(base);
145
+ }
146
+ /* eslint-enable jsdoc/require-param */
147
+
148
+ /**
149
+ * 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.
150
+ * @param {Object} elem - The element to check.
151
+ * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
152
+ * @returns {void}
153
+ */
154
+ handleComponentTagRename(elem, tagName) {
155
+ const tag = tagName.toLowerCase();
156
+ const elemTag = elem.tagName.toLowerCase();
157
+
158
+ if (elemTag !== tag) {
159
+ elem.setAttribute(tag, true);
160
+ }
161
+ }
162
+
163
+ /**
164
+ * Validates if an element is a specific Auro component.
165
+ * @param {Object} elem - The element to validate.
166
+ * @param {String} tagName - The name of the Auro component to check against.
167
+ * @returns {Boolean} - Returns true if the element is the specified Auro component.
168
+ */
169
+ elementMatch(elem, tagName) {
170
+ const tag = tagName.toLowerCase();
171
+ const elemTag = elem.tagName.toLowerCase();
172
+
173
+ return elemTag === tag || elem.hasAttribute(tag);
174
+ }
175
+ }
176
+
177
+ var externalLink = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"external-link-stroke__title external-link-stroke__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title id=\"external-link-stroke__title\">Link to external site.</title><desc id=\"external-link-stroke__desc\">This indicates a link to an external site that may not follow the same accessibility or privacy policies as Alaska Airlines. By selecting a partner link you agree to share your data with these sites.</desc><path d=\"M7 6.25h5a.75.75 0 0 1 .102 1.494L12 7.75H7a1.25 1.25 0 0 0-1.244 1.123L5.75 9v8c0 .648.492 1.18 1.122 1.244L7 18.25h8a1.25 1.25 0 0 0 1.244-1.122L16.25 17v-5a.75.75 0 0 1 1.493-.101l.007.101v5a2.75 2.75 0 0 1-2.582 2.745L15 19.75H7a2.75 2.75 0 0 1-2.745-2.582L4.25 17V9a2.75 2.75 0 0 1 2.582-2.745zh5zm12.025-2 .125.015.11.032.128.061c.18.108.317.29.353.522l.009.12v5a.75.75 0 0 1-1.493.102L18.25 10V6.811l-6.72 6.72a.75.75 0 0 1-1.133-.977l.073-.084 6.718-6.72H14a.75.75 0 0 1-.743-.648L13.25 5a.75.75 0 0 1 .648-.743L14 4.25z\"/></svg>"};
178
+
179
+ var newWindow = {"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"new-window-stroke__title new-window-stroke__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title id=\"new-window-stroke__title\">Link will open a new tab or window.</title><desc id=\"new-window-stroke__desc\">Notice indicator to alert users that action will result in the browser opening a new tab or window.</desc><path fill-rule=\"evenodd\" d=\"M20.246 5.687a2.063 2.063 0 0 0-2.058-1.937H8.813l-.126.004A2.063 2.063 0 0 0 6.75 5.813v.937H6.5l-.168.005A2.75 2.75 0 0 0 3.75 9.5v8l.005.168A2.75 2.75 0 0 0 6.5 20.25h8l.168-.005A2.75 2.75 0 0 0 17.25 17.5v-.25h.938l.125-.004a2.063 2.063 0 0 0 1.937-2.058V5.813zM15.75 17.25H8.813a2.063 2.063 0 0 1-2.06-1.937l-.003-.126V8.25H6.5a1.25 1.25 0 0 0-1.244 1.123L5.25 9.5v8c0 .648.492 1.18 1.122 1.244l.128.006h8a1.25 1.25 0 0 0 1.243-1.122l.007-.128zm-6.625-12h8.75l.09.005a.875.875 0 0 1 .785.87v8.75l-.005.09a.875.875 0 0 1-.87.785h-8.75l-.09-.005a.875.875 0 0 1-.785-.87v-8.75l.005-.09a.875.875 0 0 1 .87-.785m4.28 1.757L13.507 7c.38 0 .693.3.743.69l.007.11-.007 1.938h2c.38 0 .694.301.743.691l.007.108c0 .405-.282.74-.648.792l-.102.007h-2.001l.001 1.865c0 .404-.282.739-.648.792L13.5 14c-.38 0-.694-.3-.743-.69l-.007-.11-.001-1.864H10.75c-.38 0-.694-.3-.743-.69L10 10.537c0-.404.282-.738.648-.791l.102-.008h2l.007-1.939c0-.404.282-.739.648-.792\"/></svg>"};
180
+
181
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
182
+ // See LICENSE in the project root for license information.
183
+
184
+
185
+ // build the component class
186
+ class ComponentBase extends AuroElement$2 {
187
+ constructor() {
188
+ super();
189
+
190
+ this.download = false;
191
+ this.relative = false;
192
+ this.ondark = false;
193
+ this.variant = 'primary';
194
+
195
+
196
+ /**
197
+ * @private
198
+ */
199
+ this.layout = this.type === 'cta' ? 'block' : null;
200
+
201
+ /**
202
+ * @private
203
+ */
204
+ this.shape = this.type === 'cta' ? 'rounded' : null;
205
+
206
+ /**
207
+ * @private
208
+ */
209
+ this.size = this.type === 'cta' ? 'md' : null;
210
+
211
+ /**
212
+ * @private
213
+ */
214
+ this.defaultReferrerPolicy = 'strict-origin-when-cross-origin';
215
+
216
+ /**
217
+ * @private
218
+ */
219
+ this.ariapressed = 'false';
220
+
221
+ /**
222
+ * @private
223
+ */
224
+ this.tabIsActive = 'false';
225
+
226
+ /**
227
+ * @private
228
+ */
229
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
230
+
231
+ /*
232
+ If the component requires a touch detection,
233
+ please use this function to determine if a user is
234
+ actively touching a device, versus detecting if
235
+ the device is touch enables or a handheld device.
236
+
237
+ Also uncomment the touch detection lib above
238
+ */
239
+ this.addEventListener('touchstart', function() {
240
+ this.classList.add('is-touching');
241
+ });
242
+ }
243
+
244
+ // function to define props used within the scope of this component
245
+ static get properties() {
246
+ return {
247
+ ...super.properties,
248
+
249
+ /**
250
+ * Defines the URL of the linked page.
251
+ */
252
+ href: {
253
+ type: String,
254
+ reflect: true
255
+ },
256
+
257
+ /**
258
+ * Defines the relationship between the current document and the linked document.
259
+ */
260
+ rel: {
261
+ type: String,
262
+ reflect: true
263
+ },
264
+
265
+ /**
266
+ * Defines where to open the linked document.
267
+ */
268
+ target: {
269
+ type: String,
270
+ reflect: true
271
+ },
272
+
273
+ /**
274
+ * If true, the linked resource will be downloaded when the hyperlink is clicked.
275
+ */
276
+ download: {
277
+ type: Boolean,
278
+ reflect: true
279
+ },
280
+
281
+ /**
282
+ * If true, the auto URL re-write feature will be disabled.
283
+ */
284
+ relative: {
285
+ type: Boolean,
286
+ reflect: true
287
+ },
288
+
289
+ /**
290
+ * If true, the hyperlink will be styled for use on a dark background.
291
+ */
292
+ ondark: { type: Boolean },
293
+
294
+ /**
295
+ * Defines the type of hyperlink; accepts `nav` or `cta`.
296
+ */
297
+ type: {
298
+ type: String,
299
+ reflect: true
300
+ },
301
+
302
+ /**
303
+ * If true and `type="cta"`, the hyperlink will have a fluid-width UI.
304
+ */
305
+ fluid: { type: Boolean },
306
+
307
+ /**
308
+ * If true, sets `strict-origin-when-cross-origin` to control the referrer information sent with requests.
309
+ */
310
+ referrerpolicy: {
311
+ type: Boolean,
312
+ reflect: true
313
+ },
314
+
315
+ /**
316
+ * Sets button variant option.
317
+ * @default primary
318
+ */
319
+ variant: {
320
+ type: String,
321
+ reflect: true
322
+ },
323
+ };
324
+ }
325
+
326
+ firstUpdated() {
327
+ // Add the tag name as an attribute if it is different than the component name
328
+ this.runtimeUtils.handleComponentTagRename(this, 'auro-hyperlink');
329
+ }
330
+
331
+ /**
332
+ * Returns a safe URI based on the provided `href` and `relative` parameters.
333
+ * If `href` is truthy, it generates a safe URL using the `safeUrl` function.
334
+ * Otherwise, it returns an empty string.
335
+ *
336
+ * @example
337
+ * // Assuming this.href = 'http://example.com' and this.relative = false
338
+ * this.safeUri; // Returns 'http://example.com'
339
+ *
340
+ * @example
341
+ * // Assuming this.href = '' or this.href = null
342
+ * this.safeUri; // Returns ''
343
+ *
344
+ * @returns {string} The safe URI or an empty string.
345
+ */
346
+ get safeUri() {
347
+ return this.href ? this.safeUrl(this.href, this.relative) : '';
348
+ }
349
+
350
+ /**
351
+ * Checks whether the provided URI (if available) includes the 'http' protocol.
352
+ * If the URI is truthy, it examines whether it contains 'http'.
353
+ * Otherwise, it returns false.
354
+ *
355
+ * @example
356
+ * // Assuming this.href = 'http://example.com'
357
+ * this.includesDomain; // Returns true
358
+ *
359
+ * @example
360
+ * // Assuming this.href = '/path/to/file'
361
+ * this.includesDomain; // Returns false
362
+ *
363
+ * @example
364
+ * // Assuming this.href = '' or this.href = null
365
+ * this.includesDomain; // Returns false
366
+ *
367
+ * @private
368
+ * @returns {boolean} True if the URI includes 'http', false otherwise.
369
+ */
370
+ get includesDomain() {
371
+ return this.href ? this.safeUri.includes('http') : false;
372
+ }
373
+
374
+ /**
375
+ * Generates a safe URL based on the provided `href` and `relative` parameters.
376
+ * If `href` is falsy, it returns `undefined`.
377
+ *
378
+ * @example
379
+ * // Assuming href = 'http://example.com' and relative = false
380
+ * this.safeUrl(href, relative); // Returns 'https://example.com'
381
+ *
382
+ * @example
383
+ * // Assuming href = '/path/to/file' and relative = true
384
+ * this.safeUrl(href, relative); // Returns '/path/to/file'
385
+ *
386
+ * @example
387
+ * // Assuming href = 'javascript:alert("Hello")'
388
+ * this.safeUrl(href, relative); // Returns undefined
389
+ *
390
+ * @private
391
+ * @param {string} href - The original URL.
392
+ * @param {boolean} relative - Indicates whether the URL is relative.
393
+ * @returns {string|undefined} The safe URL or `undefined`.
394
+ */
395
+ safeUrl(href, relative) {
396
+ if (!href) {
397
+ return undefined;
398
+ }
399
+
400
+ const url = new URL(href, 'https://www.alaskaair.com');
401
+
402
+ switch (url.protocol) {
403
+ case 'tel:':
404
+ case 'sms:':
405
+ case 'mailto:':
406
+ return href;
407
+
408
+ // Specifically want to render NO shadowDOM for the following refs
409
+ case 'javascript:':
410
+ case 'data:':
411
+ case 'vbscript:':
412
+ return undefined;
413
+
414
+ default:
415
+ if (!relative) {
416
+ url.protocol = 'https:';
417
+ return url.href;
418
+ } else {
419
+ return href.replace(/^[^:]+:/, "");
420
+ }
421
+ }
422
+ }
423
+
424
+ /**
425
+ * Generates an HTML element containing an SVG icon based on the provided `svgContent`.
426
+ *
427
+ * @example
428
+ * // Assuming svgContent = '<svg><path d="..."/></svg>'
429
+ * this.generateIconHtml(svgContent); // Returns HTML element containing the SVG icon
430
+ *
431
+ * @private
432
+ * @param {string} svgContent - The SVG content to be embedded.
433
+ * @returns {Element} The HTML element containing the SVG icon.
434
+ */
435
+ generateIconHtml(svgContent) {
436
+ const dom = new DOMParser().parseFromString(svgContent, 'text/html');
437
+ const svg = dom.body.firstChild;
438
+
439
+ svg.setAttribute('slot', 'svg');
440
+
441
+ return u`<${this.iconTag} customColor customSvg part="targetIcon">${svg}</${this.iconTag}>`;
442
+ }
443
+
444
+ /**
445
+ * Generates an icon HTML element based on the target attribute.
446
+ *
447
+ * @example
448
+ * // Assuming target = '_blank' and this.safeUri = 'http://alaskaair.com'
449
+ * this.targetIcon(target); // Returns HTML element containing the new window icon
450
+ *
451
+ * @example
452
+ * // Assuming target = '_blank' and this.safeUri = 'http://external.com'
453
+ * this.targetIcon(target); // Returns HTML element containing the external link icon
454
+ *
455
+ * @example
456
+ * // Assuming target = '_self' or this.safeUri = '/relative/path'
457
+ * this.targetIcon(target); // Returns undefined
458
+ *
459
+ * @private
460
+ * @param {string} target - The target attribute of the anchor element.
461
+ * @returns {HTMLElement|undefined} The HTML element containing the icon, or undefined if no icon is generated.
462
+ */
463
+ targetIcon(target) {
464
+
465
+ /**
466
+ * Checks if a URL's domain is from the 'alaskaair.com' domain or its subdomains.
467
+ * @param {string} url - The URL to check.
468
+ * @returns {boolean} Returns true if the URL's domain is 'alaskaair.com' or one of its subdomains, otherwise false.
469
+ */
470
+ const isAlaskaAirDomain = (url) => {
471
+ const urlObject = new URL(url);
472
+ return urlObject.hostname.endsWith('.alaskaair.com');
473
+ };
474
+
475
+ // If target is '_blank' and the URL's domain is 'alaskaair.com' or one of its subdomains, return icon for new window
476
+ if (target === '_blank' && isAlaskaAirDomain(this.safeUri)) {
477
+ return this.generateIconHtml(newWindow.svg);
478
+ } else if (target === '_blank' && !isAlaskaAirDomain(this.safeUri) && this.includesDomain) {
479
+ // If target is '_blank' and the URL does not belong to 'alaskaair.com' or its subdomains but contains a domain, return icon for external link
480
+ return this.generateIconHtml(externalLink.svg);
481
+ }
482
+
483
+ return undefined;
484
+ }
485
+
486
+ /**
487
+ * Returns the state of a tab as a string.
488
+ *
489
+ * @example
490
+ * // Assuming tabIsActive = true
491
+ * this.getTabState(tabIsActive); // Returns 'is-active'
492
+ *
493
+ * @example
494
+ * // Assuming tabIsActive = false
495
+ * this.getTabState(tabIsActive); // Returns ''
496
+ *
497
+ * @private
498
+ * @param {boolean} tabIsActive - Indicates whether the tab is active.
499
+ * @returns {string} 'is-active' if the tab is active, otherwise an empty string.
500
+ */
501
+ getTabState(tabIsActive) {
502
+ return tabIsActive === true ? "is-active" : '';
503
+ }
504
+
505
+ /**
506
+ * Gets the rel attribute value based on target and rel values.
507
+ *
508
+ * @example
509
+ * // Assuming target = '_blank', rel = 'noFollow', and this.safeUri = 'http://alaskaair.com'
510
+ * this.getRelType(target, rel); // Returns 'noFollow'
511
+ *
512
+ * @example
513
+ * // Assuming target = '_blank', rel = undefined, this.safeUri = 'http://alaskaair.com', and this.includesDomain = true
514
+ * this.getRelType(target, rel); // Returns undefined
515
+ *
516
+ * @example
517
+ * // Assuming target = '_blank', rel = undefined, this.safeUri = 'http://external.com', this.includesDomain = true, and this.referrerpolicy = undefined
518
+ * this.getRelType(target, rel); // Returns 'noOpener noReferrer'
519
+ *
520
+ * @example
521
+ * // Assuming target = '_blank', rel = undefined, this.safeUri = 'http://external.com', this.includesDomain = true, and this.referrerpolicy = 'no-referrer'
522
+ * this.getRelType(target, rel); // Returns 'external'
523
+ *
524
+ * @private
525
+ * @param {string} target - The target attribute of the anchor element.
526
+ * @param {string} rel - The rel attribute of the anchor element.
527
+ * @returns {string|undefined} The rel attribute value or undefined if not applicable.
528
+ */
529
+ getRelType(target, rel) {
530
+
531
+ if (rel) {
532
+ return rel;
533
+ }
534
+
535
+ if (target === '_blank' && this.safeUri.includes('alaskaair.com')) {
536
+ return rel;
537
+ }
538
+
539
+ if (target === '_blank' && this.includesDomain && !this.rel && !this.referrerpolicy) {
540
+ return 'noOpener noReferrer';
541
+ }
542
+
543
+ if (target === '_blank' && this.referrerpolicy) {
544
+ return 'external';
545
+ }
546
+
547
+ return undefined;
548
+ }
549
+
550
+ /**
551
+ * Sets the ARIA pressed state based on user interactions.
552
+ *
553
+ * @example
554
+ * // Assuming ariaPressed = false and user performs a mousedown event
555
+ * this.ariaPressedState(ariaPressed); // Returns true
556
+ *
557
+ * @example
558
+ * // Assuming ariaPressed = true and user performs a mouseup event
559
+ * this.ariaPressedState(ariaPressed); // Returns false
560
+ *
561
+ * @example
562
+ * // Assuming ariaPressed = false and user performs a keydown event with 'Enter' or 'Space'
563
+ * this.ariaPressedState(ariaPressed); // Returns true
564
+ *
565
+ * @example
566
+ * // Assuming ariaPressed = true and user performs a keyup event
567
+ * this.ariaPressedState(ariaPressed); // Returns false
568
+ *
569
+ * @private
570
+ * @param {boolean} ariaPressed - The initial value of the ARIA pressed state.
571
+ * @returns {boolean} The updated ARIA pressed state.
572
+ */
573
+ ariaPressedState(ariaPressed) {
574
+ const ariaToggle = function (event) {
575
+ const ariaPressedNode = this.shadowRoot.querySelector('[aria-pressed]');
576
+ ariaPressedNode.setAttribute("aria-pressed", 'false');
577
+
578
+ if (event.type === 'mousedown') {
579
+ ariaPressedNode.ariaPressed = true;
580
+ } else {
581
+ ariaPressedNode.ariaPressed = false;
582
+ }
583
+
584
+ if (event.type === 'keydown') {
585
+ if (event.code === 'Enter') {
586
+ ariaPressedNode.ariaPressed = true;
587
+
588
+ if (this.hyperlinkRef && this.hyperlinkRef.value && this.hyperlinkRef.value.role === 'button') {
589
+ this.click();
590
+ }
591
+ } else {
592
+ ariaPressedNode.ariaPressed = false;
593
+ }
594
+ }
595
+ };
596
+
597
+ // Add event listeners
598
+ this.addEventListener('mousedown', ariaToggle);
599
+ this.addEventListener('mouseup', ariaToggle);
600
+ this.addEventListener('keydown', ariaToggle);
601
+ this.addEventListener('keyup', ariaToggle);
602
+
603
+ return ariaPressed;
604
+ }
605
+
606
+ // function renders HTML and CSS into the scope of the component
607
+ render() {
608
+ return this.getMarkup();
609
+ }
610
+ }
611
+
612
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
613
+ // See LICENSE in the project root for license information.
614
+
615
+
616
+ class AuroDependencyVersioning {
617
+
618
+ /**
619
+ * Generates a unique string to be used for child auro element naming.
620
+ * @private
621
+ * @param {string} baseName - Defines the first part of the unique element name.
622
+ * @param {string} version - Version of the component that will be appended to the baseName.
623
+ * @returns {string} - Unique string to be used for naming.
624
+ */
625
+ generateElementName(baseName, version) {
626
+ let result = baseName;
627
+
628
+ result += '-';
629
+ result += version.replace(/[.]/g, '_');
630
+
631
+ return result;
632
+ }
633
+
634
+ /**
635
+ * Generates a unique string to be used for child auro element naming.
636
+ * @param {string} baseName - Defines the first part of the unique element name.
637
+ * @param {string} version - Version of the component that will be appended to the baseName.
638
+ * @returns {string} - Unique string to be used for naming.
639
+ */
640
+ generateTag(baseName, version, tagClass) {
641
+ const elementName = this.generateElementName(baseName, version);
642
+ const tag = i$1`${s$1(elementName)}`;
643
+
644
+ if (!customElements.get(elementName)) {
645
+ customElements.define(elementName, class extends tagClass {});
646
+ }
647
+
648
+ return tag;
649
+ }
650
+ }
651
+
652
+ /**
653
+ * Private module-level WeakMap to hold MutationObservers for each host element.
654
+ */
655
+ const _observers$1 = new WeakMap();
656
+
657
+ /**
658
+ * Private module-level WeakMap to hold attribute matchers and targets for each host element.
659
+ * Structure: {
660
+ * host: {
661
+ * matchers: Set<Function>,
662
+ * targets: Map<HTMLElement, Map<Function, {removeOriginal: boolean, currentAttributes: Map<string, string>}>>
663
+ * }
664
+ * }
665
+ */
666
+ const _transportConfig$1 = new WeakMap();
667
+
668
+ /**
669
+ * Transfers all matching attributes from a host element to a target element and observes for future changes.
670
+ *
671
+ * @param {Object} params - The parameters for the function.
672
+ * @param {HTMLElement} params.host - The host element from which attributes will be transported.
673
+ * @param {HTMLElement} params.target - The target element to which attributes will be transported.
674
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove the attributes from the host element.
675
+ * @param {boolean} [params.observe=true] - Whether to attach a MutationObserver to the host element.
676
+ * @returns {Function} A function to detach the observer when no longer needed.
677
+ * @throws {TypeError} If the host or target parameters are not instances of HTMLElement.
678
+ */
679
+ const transportAttributes$1 = ({ host, target, match, removeOriginal = true }) => {
680
+ // Guard Clause: Ensure host is valid HTMLElement instance
681
+ if (typeof host !== 'object' || !(host instanceof HTMLElement)) {
682
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "host" parameter must be an instance of HTMLElement.');
683
+ }
684
+
685
+ // Guard Clause: Ensure target is valid HTMLElement instance
686
+ if (typeof target !== 'object' || !(target instanceof HTMLElement)) {
687
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "target" parameter must be an instance of HTMLElement.');
688
+ }
689
+
690
+ // Guard Clause: Ensure match is a function
691
+ if (typeof match !== 'function') {
692
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "match" parameter must be a function.');
693
+ }
694
+
695
+ // Guard Clause: Ensure removeOriginal is a boolean
696
+ if (typeof removeOriginal !== 'boolean') {
697
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "removeOriginal" parameter must be a boolean.');
698
+ }
699
+
700
+ // Register this transport and get cleanup function
701
+ return _registerTransport$1({
702
+ host,
703
+ target,
704
+ matcher: match,
705
+ removeOriginal
706
+ });
707
+ };
708
+
709
+ /**
710
+ * Registers a matcher and target for a host element and attaches an observer if needed.
711
+ *
712
+ * @param {Object} params - The parameters object.
713
+ * @param {HTMLElement} params.host - The host element to observe.
714
+ * @param {HTMLElement} params.target - The target element to receive attributes.
715
+ * @param {Function} params.matcher - Function that determines which attributes to transport.
716
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove original attributes.
717
+ * @returns {Function} Function to detach the specific matcher and target pairing.
718
+ * @private
719
+ */
720
+ const _registerTransport$1 = ({ host, target, matcher, removeOriginal = true }) => {
721
+ // Initialize config for this host if it doesn't exist
722
+ if (!_transportConfig$1.has(host)) {
723
+ _transportConfig$1.set(host, {
724
+ matchers: new Set(),
725
+ targets: new Map()
726
+ });
727
+ }
728
+
729
+ const config = _transportConfig$1.get(host);
730
+
731
+ // Add the matcher to the set of matchers for this host
732
+ config.matchers.add(matcher);
733
+
734
+ // Initialize target entry if it doesn't exist
735
+ if (!config.targets.has(target)) {
736
+ config.targets.set(target, new Map());
737
+ }
738
+
739
+ // Store the matcher with its removeOriginal setting for this target
740
+ config.targets.get(target).set(matcher, {
741
+ removeOriginal,
742
+ currentAttributes: new Map()
743
+ });
744
+
745
+ // Perform initial attribute transport
746
+ _transportAttributes$1({ host, target, matcher, removeOriginal });
747
+
748
+ // Attach observer
749
+ _attachObserver$1(host);
750
+
751
+ // Return cleanup function and utility functions
752
+ return {
753
+ cleanup: () => _cleanupTransport$1(host, target, matcher),
754
+ getObservedAttributes: () => _getObservedAttributes$1(host, target, matcher),
755
+ getObservedAttribute: (attr) => _getObservedAttribute$1(host, target, matcher, attr),
756
+ }
757
+ };
758
+
759
+ /**
760
+ * Cleans up resources associated with a specific matcher and target for a host element.
761
+ *
762
+ * @param {HTMLElement} host - The host element.
763
+ * @param {HTMLElement} target - The target element.
764
+ * @param {Function} matcher - The matcher function.
765
+ * @private
766
+ */
767
+ const _cleanupTransport$1 = (host, target, matcher) => {
768
+ const config = _transportConfig$1.get(host);
769
+ if (!config) return;
770
+
771
+ // Remove this matcher from this target
772
+ const targetMatchers = config.targets.get(target);
773
+ if (targetMatchers) {
774
+ targetMatchers.delete(matcher);
775
+
776
+ // If this target has no more matchers, remove it
777
+ if (targetMatchers.size === 0) {
778
+ config.targets.delete(target);
779
+ }
780
+ }
781
+
782
+ // Check if this matcher is still used by any target
783
+ let matcherStillUsed = false;
784
+ for (const matcherMap of config.targets.values()) {
785
+ if (matcherMap.has(matcher)) {
786
+ matcherStillUsed = true;
787
+ break;
788
+ }
789
+ }
790
+
791
+ // If not used anymore, remove from matchers set
792
+ if (!matcherStillUsed) {
793
+ config.matchers.delete(matcher);
794
+ }
795
+
796
+ // If no more targets or matchers, detach observer
797
+ if (config.targets.size === 0 || config.matchers.size === 0) {
798
+ _detachObserver$1(host);
799
+ }
800
+ };
801
+
802
+ /**
803
+ * Generic function to transport attributes from a host element to a target element.
804
+ *
805
+ * @param {Object} params - The parameters object.
806
+ * @param {HTMLElement} params.host - The host element from which to transport attributes.
807
+ * @param {HTMLElement} params.target - The target element to which attributes will be transported.
808
+ * @param {Function} params.matcher - Function that takes an attribute name and returns true if it should be transported.
809
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove original attributes from host.
810
+ * @returns {void}
811
+ * @private
812
+ */
813
+ const _transportAttributes$1 = ({ host, target, matcher, removeOriginal = true }) => {
814
+ // Get a list of all matching attributes on the host element and their values
815
+ const matchingAttributes = host.getAttributeNames()
816
+ .filter(attr => matcher(attr))
817
+ .reduce((acc, attr) => {
818
+ acc[attr] = host.getAttribute(attr);
819
+ return acc;
820
+ }, {});
821
+
822
+ // Move matching attributes to the target element, removing them from the host if removeOriginal is true
823
+ Object.entries(matchingAttributes).forEach(([key, value]) => {
824
+ _setObservedAttribute$1(host, target, matcher, key, value);
825
+ target.setAttribute(key, value);
826
+ if (removeOriginal) {
827
+ host.removeAttribute(key);
828
+ }
829
+ });
830
+ };
831
+
832
+ /**
833
+ * Attaches a MutationObserver to the host element to monitor attribute changes.
834
+ *
835
+ * @param {HTMLElement} host - The element to observe for attribute changes.
836
+ * @returns {MutationObserver} The observer instance.
837
+ * @private
838
+ */
839
+ const _attachObserver$1 = (host) => {
840
+ // If an observer for this host already exists, return it
841
+ if (_observers$1.has(host)) {
842
+ return _observers$1.get(host);
843
+ }
844
+
845
+ // Create a new MutationObserver
846
+ const observer = new MutationObserver((mutations) => {
847
+ const config = _transportConfig$1.get(host);
848
+ if (!config) return;
849
+
850
+ // For each mutation affecting attributes
851
+ mutations
852
+ .filter(mutation => mutation.type === 'attributes')
853
+ .forEach(mutation => {
854
+ const attributeName = mutation.attributeName;
855
+
856
+ // Find matchers that care about this attribute
857
+ for (const matcher of config.matchers) {
858
+ if (matcher(attributeName)) {
859
+ // For each target that uses this matcher
860
+ for (const [target, matcherConfigs] of config.targets.entries()) {
861
+ if (matcherConfigs.has(matcher)) {
862
+ const { removeOriginal } = matcherConfigs.get(matcher);
863
+ _transportAttributes$1({
864
+ host,
865
+ target,
866
+ matcher,
867
+ removeOriginal
868
+ });
869
+ }
870
+ }
871
+ }
872
+ }
873
+ });
874
+ });
875
+
876
+ // Start observing attribute changes
877
+ observer.observe(host, { attributes: true });
878
+
879
+ // Store the observer
880
+ _observers$1.set(host, observer);
881
+
882
+ return observer;
883
+ };
884
+
885
+ /**
886
+ * Detaches and cleans up the MutationObserver for a given host element.
887
+ *
888
+ * @param {HTMLElement} host - The element whose observer should be detached.
889
+ * @private
890
+ */
891
+ const _detachObserver$1 = (host) => {
892
+ if (_observers$1.has(host)) {
893
+ const observer = _observers$1.get(host);
894
+ observer.disconnect();
895
+ _observers$1.delete(host);
896
+ }
897
+
898
+ // Clean up the transport config as well
899
+ if (_transportConfig$1.has(host)) {
900
+ _transportConfig$1.delete(host);
901
+ }
902
+ };
903
+
904
+ /**
905
+ * Gets the matcher configuration for a specific host, target, and matcher.
906
+ * @param {HTMLElement} host - The host element.
907
+ * @param {HTMLElement} target - The target element.
908
+ * @param {Function} matcher - The matcher function.
909
+ * @returns {Object|undefined} The matcher configuration if found.
910
+ * @private
911
+ */
912
+ const _getMatcherConfig$1 = (host, target, matcher) => {
913
+ const config = _transportConfig$1.get(host);
914
+ if (!config) return undefined;
915
+
916
+ const targetMatchers = config.targets.get(target);
917
+ if (!targetMatchers) return undefined;
918
+
919
+ return targetMatchers.get(matcher);
920
+ };
921
+
922
+ /**
923
+ * Sets an observed attribute value.
924
+ * @param {HTMLElement} host - The host element.
925
+ * @param {HTMLElement} target - The target element.
926
+ * @param {Function} matcher - The matcher function.
927
+ * @param {string} key - The attribute name.
928
+ * @param {string} value - The attribute value.
929
+ * @private
930
+ */
931
+ const _setObservedAttribute$1 = (host, target, matcher, key, value) => {
932
+ const matcherConfig = _getMatcherConfig$1(host, target, matcher);
933
+ if (matcherConfig) {
934
+ matcherConfig.currentAttributes.set(key, value);
935
+ }
936
+ };
937
+
938
+ const _getObservedAttribute$1 = (host, target, matcher, attr) => {
939
+ const matcherConfig = _getMatcherConfig$1(host, target, matcher);
940
+ if (matcherConfig) return matcherConfig.currentAttributes.get(attr);
941
+ return undefined;
942
+ };
943
+
944
+ const _getObservedAttributes$1 = (host, target, matcher) => {
945
+ const matcherConfig = _getMatcherConfig$1(host, target, matcher);
946
+ if (matcherConfig) return Array.from(matcherConfig.currentAttributes.entries());
947
+ return [];
948
+ };
949
+
950
+ const _matchers$1 = {
951
+ 'aria-': attr => attr.startsWith('aria-'),
952
+ 'role': attr => attr.match(/^role$/),
953
+ 'tabindex': attr => attr.match(/^tabindex$/),
954
+ };
955
+
956
+ /**
957
+ * Transfers all accessibility-related attributes (ARIA, role, tabindex) from the host element to the target element.
958
+ * This function allows optional removal of the original attributes and the ability to ignore specific attributes.
959
+ *
960
+ * @param {Object} params - The parameters object.
961
+ * @param {HTMLElement} params.host - The host element to observe.
962
+ * @param {HTMLElement} params.target - The target element to receive attributes.
963
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove original attributes.
964
+ * @param {Array<String>} [params.ignore] - The list of attributes not to transport.
965
+ *
966
+ * @returns {Function} Function to detach the specific matcher and target pairing.} param.
967
+ */
968
+ const transportAllA11yAttributes$1 = ({ host, target, removeOriginal = true, ignore = undefined }) => {
969
+ return transportAttributes$1({
970
+ host,
971
+ target,
972
+ match: attr => {
973
+ if (ignore && ignore.includes(attr)) {
974
+ return false;
975
+ }
976
+ for (const key in _matchers$1) {
977
+ if (_matchers$1[key](attr)) {
978
+ return true;
979
+ }
980
+ }
981
+ return false;
982
+ },
983
+ removeOriginal
984
+ });
985
+ };
986
+
987
+ // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
988
+ // See LICENSE in the project root for license information.
989
+
990
+
991
+ /**
992
+ * @attr {Boolean} hidden - If present, the component will be hidden both visually and from screen readers
993
+ * @attr {Boolean} hiddenVisually - If present, the component will be hidden visually, but still read by screen readers
994
+ * @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
995
+ */
996
+
997
+ let AuroElement$1 = class AuroElement extends i$2 {
998
+
999
+ // function to define props used within the scope of this component
1000
+ static get properties() {
1001
+ return {
1002
+ hidden: { type: Boolean,
1003
+ reflect: true },
1004
+ hiddenVisually: { type: Boolean,
1005
+ reflect: true },
1006
+ hiddenAudible: { type: Boolean,
1007
+ reflect: true },
1008
+ };
1009
+ }
1010
+
1011
+ /**
1012
+ * @private Function that determines state of aria-hidden
1013
+ */
1014
+ hideAudible(value) {
1015
+ if (value) {
1016
+ return 'true'
1017
+ }
1018
+
1019
+ return 'false'
1020
+ }
1021
+ };
1022
+
1023
+ var error = {"role":"img","color":"currentColor","title":"","desc":"Error alert indicator.","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"error","category":"alert","deprecated":true,"svg":"<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>"};
1024
+
1025
+ /* eslint-disable no-underscore-dangle, jsdoc/no-undefined-types, jsdoc/require-param-description */
1026
+
1027
+ const _fetchMap = new Map();
1028
+
1029
+ /**
1030
+ * A callback to parse Response body.
1031
+ *
1032
+ * @callback ResponseParser
1033
+ * @param {Fetch.Response} response
1034
+ * @returns {Promise}
1035
+ */
1036
+
1037
+ /**
1038
+ * A minimal in-memory map to de-duplicate Fetch API media requests.
1039
+ *
1040
+ * @param {String} uri
1041
+ * @param {Object} [options={}]
1042
+ * @param {ResponseParser} [options.responseParser=(response) => response.text()]
1043
+ * @returns {Promise}
1044
+ */
1045
+ const cacheFetch = (uri, options = {}) => {
1046
+ const responseParser = options.responseParser || ((response) => response.text());
1047
+ if (!_fetchMap.has(uri)) {
1048
+ _fetchMap.set(uri, fetch(uri).then(responseParser));
1049
+ }
1050
+ return _fetchMap.get(uri);
1051
+ };
1052
+
1053
+ var styleCss$4 = 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, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;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}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
1054
+
1055
+ // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1056
+ // See LICENSE in the project root for license information.
1057
+
1058
+
1059
+ // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
1060
+ /**
1061
+ * @slot - Hidden from visibility, used for a11y if icon description is needed
1062
+ */
1063
+
1064
+ // build the component class
1065
+ class BaseIcon extends AuroElement$1 {
1066
+ constructor() {
1067
+ super();
1068
+ this.onDark = false;
1069
+ }
1070
+
1071
+ // function to define props used within the scope of this component
1072
+ static get properties() {
1073
+ return {
1074
+ ...super.properties,
1075
+
1076
+ /**
1077
+ * Set value for on-dark version of auro-icon.
1078
+ */
1079
+ onDark: {
1080
+ type: Boolean,
1081
+ reflect: true
1082
+ },
1083
+
1084
+ /**
1085
+ * @private
1086
+ */
1087
+ svg: {
1088
+ attribute: false,
1089
+ reflect: true
1090
+ }
1091
+ };
1092
+ }
1093
+
1094
+ static get styles() {
1095
+ return i$5`
1096
+ ${styleCss$4}
1097
+ `;
1098
+ }
1099
+
1100
+ /**
1101
+ * Async function to fetch requested icon from npm CDN.
1102
+ * @private
1103
+ * @param {string} category - Icon category.
1104
+ * @param {string} name - Icon name.
1105
+ * @returns {SVGElement} DOM - Ready HTML to be appended.
1106
+ */
1107
+ async fetchIcon(category, name) {
1108
+ let iconHTML = '';
1109
+
1110
+ if (category === 'logos') {
1111
+ iconHTML = await cacheFetch(`${this.uri}/${category}/${name}.svg`);
1112
+ } else {
1113
+ iconHTML = await cacheFetch(`${this.uri}/icons/${category}/${name}.svg`);
1114
+ }
1115
+
1116
+ const dom = new DOMParser().parseFromString(iconHTML, 'text/html');
1117
+
1118
+ return dom.body.querySelector('svg');
1119
+ }
1120
+
1121
+ // lifecycle function
1122
+ async firstUpdated() {
1123
+ try {
1124
+ if (!this.customSvg) {
1125
+ const svg = await this.fetchIcon(this.category, this.name);
1126
+
1127
+ if (svg) {
1128
+ this.svg = svg;
1129
+ } else if (!svg) {
1130
+ const penDOM = new DOMParser().parseFromString(error.svg, 'text/html');
1131
+
1132
+ this.svg = penDOM.body.firstChild;
1133
+ }
1134
+ }
1135
+ // eslint-disable-next-line no-unused-vars
1136
+ } catch (err) {
1137
+ this.svg = undefined;
1138
+ }
1139
+ }
1140
+ }
1141
+
1142
+ var tokensCss$4 = 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)}`;
1143
+
1144
+ var colorCss$4 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=tierOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-emerald, #139142)}:host(:not([onDark])[variant=tierOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=tierOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-tier-program-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][variant=statusError]){--ds-auro-icon-color:var(--ds-advanced-color-state-error-inverse, #f9a4a8)}`;
1145
+
1146
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1147
+ // See LICENSE in the project root for license information.
1148
+
1149
+
1150
+ class AuroIcon extends BaseIcon {
1151
+ constructor() {
1152
+ super();
1153
+
1154
+ this.variant = undefined;
1155
+ this.privateDefaults();
1156
+ }
1157
+
1158
+ /**
1159
+ * Internal Defaults.
1160
+ * @private
1161
+ * @returns {void}
1162
+ */
1163
+ privateDefaults() {
1164
+ this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
1165
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
1166
+ }
1167
+
1168
+ // function to define props used within the scope of this component
1169
+ static get properties() {
1170
+ return {
1171
+ ...super.properties,
1172
+
1173
+ /**
1174
+ * Set aria-hidden value. Default is `true`. Option is `false`.
1175
+ */
1176
+ ariaHidden: {
1177
+ type: String,
1178
+ reflect: true
1179
+ },
1180
+
1181
+ /**
1182
+ * The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
1183
+ */
1184
+ category: {
1185
+ type: String,
1186
+ reflect: true
1187
+ },
1188
+
1189
+ /**
1190
+ * Allows custom color to be set.
1191
+ */
1192
+ customColor: {
1193
+ type: Boolean,
1194
+ reflect: true
1195
+ },
1196
+
1197
+ /**
1198
+ * When true, auro-icon will render a custom SVG inside the default slot.
1199
+ */
1200
+ customSvg: {
1201
+ type: Boolean
1202
+ },
1203
+
1204
+ /**
1205
+ * Exposes content in slot as icon label.
1206
+ */
1207
+ label: {
1208
+ type: Boolean,
1209
+ reflect: true
1210
+ },
1211
+
1212
+ /**
1213
+ * The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
1214
+ */
1215
+ name: {
1216
+ type: String,
1217
+ reflect: true
1218
+ },
1219
+
1220
+ /**
1221
+ * The style of the icon. The accepted variants are `accent1`, `disabled`, `muted`, `statusDefault`, `statusInfo`, `statusSuccess`, `statusWarning`, `statusError`, `statusInfoSubtle`, `statusSuccessSubtle`, `statusWarningSubtle`, `statusErrorSubtle`, `fareBasicEconomy`, `fareBusiness`, `fareEconomy`, `fareFirst`, `farePremiumEconomy`, `tierOneWorldEmerald`, `tierOneWorldSapphire`, `tierOneWorldRuby`.
1222
+ */
1223
+ variant: {
1224
+ type: String,
1225
+ reflect: true
1226
+ }
1227
+ };
1228
+ }
1229
+
1230
+ static get styles() {
1231
+ return [
1232
+ super.styles,
1233
+ i$5`${tokensCss$4}`,
1234
+ i$5`${styleCss$4}`,
1235
+ i$5`${colorCss$4}`
1236
+ ];
1237
+ }
1238
+
1239
+ /**
1240
+ * This will register this element with the browser.
1241
+ * @param {string} [name="auro-icon"] - The name of element that you want to register to.
1242
+ *
1243
+ * @example
1244
+ * AuroIcon.register("custom-icon") // this will register this element to <custom-icon/>
1245
+ *
1246
+ */
1247
+ static register(name = "auro-icon") {
1248
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroIcon);
1249
+ }
1250
+
1251
+ connectedCallback() {
1252
+ super.connectedCallback();
1253
+
1254
+ // Add the tag name as an attribute if it is different than the component name
1255
+ this.runtimeUtils.handleComponentTagRename(this, 'auro-icon');
1256
+ }
1257
+
1258
+ /**
1259
+ * @private
1260
+ * @returns {void} Exposes CSS parts for styling from parent components.
1261
+ */
1262
+ exposeCssParts() {
1263
+ this.setAttribute('exportparts', 'svg:iconSvg');
1264
+ }
1265
+
1266
+ async firstUpdated() {
1267
+ await super.firstUpdated();
1268
+
1269
+ /**
1270
+ * icons provide a description for screen readers. Icon only instances Auro-button
1271
+ * depend on this description to provide context for the user using a screen reader.
1272
+ * Removes the SVG description for screen reader if ariaHidden is set to true.
1273
+ */
1274
+ if (this.hasAttribute('ariaHidden') && this.svg) {
1275
+ const svgDesc = this.svg.querySelector('desc');
1276
+
1277
+ if (svgDesc) {
1278
+ svgDesc.remove();
1279
+ this.svg.removeAttribute('aria-labelledby');
1280
+ }
1281
+ }
1282
+ }
1283
+
1284
+ // function that renders the HTML and CSS into the scope of the component
1285
+ render() {
1286
+ const labelClasses = {
1287
+ 'labelWrapper': true,
1288
+ 'util_displayHiddenVisually': !this.label
1289
+ };
1290
+
1291
+ const svgClasses = {
1292
+ 'svgWrapper': true,
1293
+ };
1294
+
1295
+ return x`
1296
+ <div class="componentWrapper">
1297
+ <div
1298
+ class="${e(svgClasses)}"
1299
+ title="${o(this.title || undefined)}">
1300
+ <span aria-hidden="${o(this.ariaHidden || true)}" part="svg">
1301
+ ${this.customSvg ? x`
1302
+ <slot name="svg"></slot>
1303
+ ` : x`
1304
+ ${this.svg}
1305
+ `
1306
+ }
1307
+ </span>
1308
+ </div>
1309
+
1310
+ <div class="${e(labelClasses)}">
1311
+ <slot></slot>
1312
+ </div>
1313
+ </div>
1314
+ `;
1315
+ }
1316
+ }
1317
+
1318
+ var iconVersion = '8.1.4';
1319
+
1320
+ /**
1321
+ * Private module-level WeakMap to hold MutationObservers for each host element.
1322
+ */
1323
+ const _observers = new WeakMap();
1324
+
1325
+ /**
1326
+ * Private module-level WeakMap to hold attribute matchers and targets for each host element.
1327
+ * Structure: {
1328
+ * host: {
1329
+ * matchers: Set<Function>,
1330
+ * targets: Map<HTMLElement, Map<Function, {removeOriginal: boolean, currentAttributes: Map<string, string>}>>
1331
+ * }
1332
+ * }
1333
+ */
1334
+ const _transportConfig = new WeakMap();
1335
+
1336
+ /**
1337
+ * Transfers all matching attributes from a host element to a target element and observes for future changes.
1338
+ *
1339
+ * @param {Object} params - The parameters for the function.
1340
+ * @param {HTMLElement} params.host - The host element from which attributes will be transported.
1341
+ * @param {HTMLElement} params.target - The target element to which attributes will be transported.
1342
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove the attributes from the host element.
1343
+ * @param {boolean} [params.observe=true] - Whether to attach a MutationObserver to the host element.
1344
+ * @returns {Function} A function to detach the observer when no longer needed.
1345
+ * @throws {TypeError} If the host or target parameters are not instances of HTMLElement.
1346
+ */
1347
+ const transportAttributes = ({ host, target, match, removeOriginal = true }) => {
1348
+ // Guard Clause: Ensure host is valid HTMLElement instance
1349
+ if (typeof host !== 'object' || !(host instanceof HTMLElement)) {
1350
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "host" parameter must be an instance of HTMLElement.');
1351
+ }
1352
+
1353
+ // Guard Clause: Ensure target is valid HTMLElement instance
1354
+ if (typeof target !== 'object' || !(target instanceof HTMLElement)) {
1355
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "target" parameter must be an instance of HTMLElement.');
1356
+ }
1357
+
1358
+ // Guard Clause: Ensure match is a function
1359
+ if (typeof match !== 'function') {
1360
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "match" parameter must be a function.');
1361
+ }
1362
+
1363
+ // Guard Clause: Ensure removeOriginal is a boolean
1364
+ if (typeof removeOriginal !== 'boolean') {
1365
+ throw new TypeError('a11yUtilities.js | transportAttributes | The "removeOriginal" parameter must be a boolean.');
1366
+ }
1367
+
1368
+ // Register this transport and get cleanup function
1369
+ return _registerTransport({
1370
+ host,
1371
+ target,
1372
+ matcher: match,
1373
+ removeOriginal
1374
+ });
1375
+ };
1376
+
1377
+ /**
1378
+ * Registers a matcher and target for a host element and attaches an observer if needed.
1379
+ *
1380
+ * @param {Object} params - The parameters object.
1381
+ * @param {HTMLElement} params.host - The host element to observe.
1382
+ * @param {HTMLElement} params.target - The target element to receive attributes.
1383
+ * @param {Function} params.matcher - Function that determines which attributes to transport.
1384
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove original attributes.
1385
+ * @param {boolean} [params.observe=true] - Whether to observe for attribute changes.
1386
+ * @returns {Function} Function to detach the specific matcher and target pairing.
1387
+ * @private
1388
+ */
1389
+ const _registerTransport = ({ host, target, matcher, removeOriginal = true }) => {
1390
+ // Initialize config for this host if it doesn't exist
1391
+ if (!_transportConfig.has(host)) {
1392
+ _transportConfig.set(host, {
1393
+ matchers: new Set(),
1394
+ targets: new Map()
1395
+ });
1396
+ }
1397
+
1398
+ const config = _transportConfig.get(host);
1399
+
1400
+ // Add the matcher to the set of matchers for this host
1401
+ config.matchers.add(matcher);
1402
+
1403
+ // Initialize target entry if it doesn't exist
1404
+ if (!config.targets.has(target)) {
1405
+ config.targets.set(target, new Map());
1406
+ }
1407
+
1408
+ // Store the matcher with its removeOriginal setting for this target
1409
+ config.targets.get(target).set(matcher, {
1410
+ removeOriginal,
1411
+ currentAttributes: new Map()
1412
+ });
1413
+
1414
+ // Perform initial attribute transport
1415
+ _transportAttributes({ host, target, matcher, removeOriginal });
1416
+
1417
+ // Attach observer
1418
+ _attachObserver(host);
1419
+
1420
+ // Return cleanup function and utility functions
1421
+ return {
1422
+ cleanup: () => _cleanupTransport(host, target, matcher),
1423
+ getObservedAttributes: () => _getObservedAttributes(host, target, matcher),
1424
+ getObservedAttribute: (attr) => _getObservedAttribute(host, target, matcher, attr),
1425
+ }
1426
+ };
1427
+
1428
+ /**
1429
+ * Cleans up resources associated with a specific matcher and target for a host element.
1430
+ *
1431
+ * @param {HTMLElement} host - The host element
1432
+ * @param {HTMLElement} target - The target element
1433
+ * @param {Function} matcher - The matcher function
1434
+ * @private
1435
+ */
1436
+ const _cleanupTransport = (host, target, matcher) => {
1437
+ const config = _transportConfig.get(host);
1438
+ if (!config) return;
1439
+
1440
+ // Remove this matcher from this target
1441
+ const targetMatchers = config.targets.get(target);
1442
+ if (targetMatchers) {
1443
+ targetMatchers.delete(matcher);
1444
+
1445
+ // If this target has no more matchers, remove it
1446
+ if (targetMatchers.size === 0) {
1447
+ config.targets.delete(target);
1448
+ }
1449
+ }
1450
+
1451
+ // Check if this matcher is still used by any target
1452
+ let matcherStillUsed = false;
1453
+ for (const matcherMap of config.targets.values()) {
1454
+ if (matcherMap.has(matcher)) {
1455
+ matcherStillUsed = true;
1456
+ break;
1457
+ }
1458
+ }
1459
+
1460
+ // If not used anymore, remove from matchers set
1461
+ if (!matcherStillUsed) {
1462
+ config.matchers.delete(matcher);
1463
+ }
1464
+
1465
+ // If no more targets or matchers, detach observer
1466
+ if (config.targets.size === 0 || config.matchers.size === 0) {
1467
+ _detachObserver(host);
1468
+ }
1469
+ };
1470
+
1471
+ /**
1472
+ * Generic function to transport attributes from a host element to a target element.
1473
+ *
1474
+ * @param {Object} params - The parameters object.
1475
+ * @param {HTMLElement} params.host - The host element from which to transport attributes.
1476
+ * @param {HTMLElement} params.target - The target element to which attributes will be transported.
1477
+ * @param {Function} params.matcher - Function that takes an attribute name and returns true if it should be transported.
1478
+ * @param {boolean} [params.removeOriginal=true] - Whether to remove original attributes from host.
1479
+ * @returns {void}
1480
+ * @private
1481
+ */
1482
+ const _transportAttributes = ({ host, target, matcher, removeOriginal = true }) => {
1483
+ // Get a list of all matching attributes on the host element and their values
1484
+ const matchingAttributes = host.getAttributeNames()
1485
+ .filter(attr => matcher(attr))
1486
+ .reduce((acc, attr) => {
1487
+ acc[attr] = host.getAttribute(attr);
1488
+ return acc;
1489
+ }, {});
1490
+
1491
+ // Move matching attributes to the target element, removing them from the host if removeOriginal is true
1492
+ Object.entries(matchingAttributes).forEach(([key, value]) => {
1493
+ _setObservedAttribute(host, target, matcher, key, value);
1494
+ target.setAttribute(key, value);
1495
+ if (removeOriginal) {
1496
+ host.removeAttribute(key);
1497
+ }
1498
+ });
1499
+ };
1500
+
1501
+ /**
1502
+ * Attaches a MutationObserver to the host element to monitor attribute changes.
1503
+ *
1504
+ * @param {HTMLElement} host - The element to observe for attribute changes.
1505
+ * @returns {MutationObserver} The observer instance.
1506
+ * @private
1507
+ */
1508
+ const _attachObserver = (host) => {
1509
+ // If an observer for this host already exists, return it
1510
+ if (_observers.has(host)) {
1511
+ return _observers.get(host);
1512
+ }
1513
+
1514
+ // Create a new MutationObserver
1515
+ const observer = new MutationObserver((mutations) => {
1516
+ const config = _transportConfig.get(host);
1517
+ if (!config) return;
1518
+
1519
+ // For each mutation affecting attributes
1520
+ mutations
1521
+ .filter(mutation => mutation.type === 'attributes')
1522
+ .forEach(mutation => {
1523
+ const attributeName = mutation.attributeName;
1524
+
1525
+ // Find matchers that care about this attribute
1526
+ for (const matcher of config.matchers) {
1527
+ if (matcher(attributeName)) {
1528
+ // For each target that uses this matcher
1529
+ for (const [target, matcherConfigs] of config.targets.entries()) {
1530
+ if (matcherConfigs.has(matcher)) {
1531
+ const { removeOriginal } = matcherConfigs.get(matcher);
1532
+ _transportAttributes({
1533
+ host,
1534
+ target,
1535
+ matcher,
1536
+ removeOriginal
1537
+ });
1538
+ }
1539
+ }
1540
+ }
1541
+ }
1542
+ });
1543
+ });
1544
+
1545
+ // Start observing attribute changes
1546
+ observer.observe(host, { attributes: true });
1547
+
1548
+ // Store the observer
1549
+ _observers.set(host, observer);
1550
+
1551
+ return observer;
1552
+ };
1553
+
1554
+ /**
1555
+ * Detaches and cleans up the MutationObserver for a given host element.
1556
+ *
1557
+ * @param {HTMLElement} host - The element whose observer should be detached.
1558
+ * @private
1559
+ */
1560
+ const _detachObserver = (host) => {
1561
+ if (_observers.has(host)) {
1562
+ const observer = _observers.get(host);
1563
+ observer.disconnect();
1564
+ _observers.delete(host);
1565
+ }
1566
+
1567
+ // Clean up the transport config as well
1568
+ if (_transportConfig.has(host)) {
1569
+ _transportConfig.delete(host);
1570
+ }
1571
+ };
1572
+
1573
+ /**
1574
+ * Gets the matcher configuration for a specific host, target, and matcher
1575
+ * @param {HTMLElement} host - The host element
1576
+ * @param {HTMLElement} target - The target element
1577
+ * @param {Function} matcher - The matcher function
1578
+ * @returns {Object|undefined} The matcher configuration if found
1579
+ * @private
1580
+ */
1581
+ const _getMatcherConfig = (host, target, matcher) => {
1582
+ const config = _transportConfig.get(host);
1583
+ if (!config) return undefined;
1584
+
1585
+ const targetMatchers = config.targets.get(target);
1586
+ if (!targetMatchers) return undefined;
1587
+
1588
+ return targetMatchers.get(matcher);
1589
+ };
1590
+
1591
+ /**
1592
+ * Sets an observed attribute value
1593
+ * @param {HTMLElement} host - The host element
1594
+ * @param {HTMLElement} target - The target element
1595
+ * @param {Function} matcher - The matcher function
1596
+ * @param {string} key - The attribute name
1597
+ * @param {string} value - The attribute value
1598
+ * @private
1599
+ */
1600
+ const _setObservedAttribute = (host, target, matcher, key, value) => {
1601
+ const matcherConfig = _getMatcherConfig(host, target, matcher);
1602
+ if (matcherConfig) {
1603
+ matcherConfig.currentAttributes.set(key, value);
1604
+ }
1605
+ };
1606
+
1607
+ const _getObservedAttribute = (host, target, matcher, attr) => {
1608
+ const matcherConfig = _getMatcherConfig(host, target, matcher);
1609
+ if (matcherConfig) return matcherConfig.currentAttributes.get(attr);
1610
+ return undefined;
1611
+ };
1612
+
1613
+ const _getObservedAttributes = (host, target, matcher) => {
1614
+ const matcherConfig = _getMatcherConfig(host, target, matcher);
1615
+ if (matcherConfig) return Array.from(matcherConfig.currentAttributes.entries());
1616
+ return [];
1617
+ };
1618
+
1619
+ const _matchers = {
1620
+ 'aria-': attr => attr.startsWith('aria-'),
1621
+ 'role': attr => attr.match(/^role$/)
1622
+ };
1623
+
1624
+ const transportAllA11yAttributes = ({ host, target, removeOriginal = true }) => {
1625
+ return transportAttributes({
1626
+ host,
1627
+ target,
1628
+ match: attr => {
1629
+ for (const key in _matchers) {
1630
+ if (_matchers[key](attr)) return true;
1631
+ }
1632
+ return false;
1633
+ },
1634
+ removeOriginal
1635
+ });
1636
+ };
1637
+
1638
+ class AuroElement extends i$2 {
1639
+
1640
+ /**
1641
+ * @type {Object} return object from transportAttributes via a11yUtilities
1642
+ * @property {Function} cleanup - Function to clean up the attribute watcher.
1643
+ * @property {Function} getCurrentAttributes - Function to get the current attributes being watched and their values.
1644
+ * @property {Function} getObservedAttribute - Function to get the value of a specific observed attribute by name.
1645
+ * @private
1646
+ */
1647
+ attributeWatcher;
1648
+
1649
+ static get properties() {
1650
+ return {
1651
+
1652
+ /**
1653
+ * Defines the layout of an element.
1654
+ * @default {'default'}
1655
+ */
1656
+ layout: {
1657
+ type: String,
1658
+ attribute: "layout",
1659
+ reflect: true
1660
+ },
1661
+
1662
+ /**
1663
+ * Defines the shape of an element.
1664
+ * @property {'default', 'rounded', 'pill', 'circle'}
1665
+ * @default {'default'}
1666
+ */
1667
+ shape: {
1668
+ type: String,
1669
+ attribute: "shape",
1670
+ reflect: true
1671
+ },
1672
+
1673
+ /**
1674
+ * Defines the size of an element.
1675
+ * @property {'xs', 'sm', 'md', 'lg', 'xl'}
1676
+ * @default {'md'}
1677
+ */
1678
+ size: {
1679
+ type: String,
1680
+ attribute: "size",
1681
+ reflect: true
1682
+ },
1683
+
1684
+ /**
1685
+ * This Boolean attribute lets you specify that the element should be rendered in dark mode.
1686
+ * @default {false}
1687
+ */
1688
+ onDark: {
1689
+ type: Boolean,
1690
+ attribute: "ondark",
1691
+ reflect: true
1692
+ },
1693
+
1694
+ /**
1695
+ * A reference to the wrapper element in the shadow DOM.
1696
+ * This is used to apply layout and shape classes dynamically.
1697
+ * @type {HTMLElement|null}
1698
+ * @default {null}
1699
+ * @private
1700
+ */
1701
+ wrapper: {
1702
+ attribute: false,
1703
+ reflect: false
1704
+ }
1705
+ };
1706
+ }
1707
+
1708
+
1709
+
1710
+ resetShapeClasses() {
1711
+ if (this.shape && this.size) {
1712
+
1713
+ if (this.wrapper) {
1714
+ this.wrapper.classList.forEach((className) => {
1715
+ if (className.startsWith('shape-')) {
1716
+ this.wrapper.classList.remove(className);
1717
+ }
1718
+ });
1719
+
1720
+ this.wrapper.classList.add(`shape-${this.shape.toLowerCase()}-${this.size.toLowerCase()}`);
1721
+ }
1722
+ }
1723
+ }
1724
+
1725
+ resetLayoutClasses() {
1726
+ if (this.layout) {
1727
+ if (this.wrapper) {
1728
+ this.wrapper.classList.forEach((className) => {
1729
+ if (className.startsWith('layout-')) {
1730
+ this.wrapper.classList.remove(className);
1731
+ }
1732
+ });
1733
+
1734
+ this.wrapper.classList.add(`layout-${this.layout.toLowerCase()}`);
1735
+ }
1736
+ }
1737
+ }
1738
+
1739
+ updateComponentArchitecture() {
1740
+ this.resetLayoutClasses();
1741
+ this.resetShapeClasses();
1742
+ }
1743
+
1744
+ updated(changedProperties) {
1745
+ if (changedProperties.has('layout') || changedProperties.has('shape') || changedProperties.has('size')) {
1746
+ this.updateComponentArchitecture();
1747
+ }
1748
+ }
1749
+
1750
+ firstUpdated() {
1751
+ super.firstUpdated();
1752
+
1753
+ // Set a reference to the wrapper element in the shadow DOM
1754
+ this.wrapper = this.shadowRoot.querySelector('.wrapper');
1755
+
1756
+ // Initialize the transportation of ARIA attributes to the target element and get the disconnect function for cleanup
1757
+ this.attributeWatcher = transportAllA11yAttributes({ host: this, target: this.shadowRoot.querySelector('.wrapper') });
1758
+ }
1759
+
1760
+ disconnectedCallback() {
1761
+ super.disconnectedCallback();
1762
+
1763
+ // Cleanup the ARIA observer if it exists
1764
+ if (this.attributeWatcher) {
1765
+ this.attributeWatcher.cleanup();
1766
+ this.attributeWatcher = null;
1767
+ }
1768
+ }
1769
+
1770
+ // Try to render the defined `this.layout` layout. If that fails, fall back to the default layout.
1771
+ // This will catch if an invalid layout value is passed in and render the default layout if so.
1772
+ render() {
1773
+ try {
1774
+ return this.renderLayout();
1775
+ } catch (error) {
1776
+ // failed to get the defined layout
1777
+ console.error('Failed to get the defined layout - using the default layout', error); // eslint-disable-line no-console
1778
+
1779
+ // fallback to the default layout
1780
+ return this.getLayout('default');
1781
+ }
1782
+ }
1783
+ }
1784
+
1785
+ var styleCss$3 = 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, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}.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, 0.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, 0.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, 0.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, 0.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, 0.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, 0.5rem)}.contentWrapper{font-size:0}slot{pointer-events:none}: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, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none;transition:padding 300ms ease-out}.auro-button:focus,.auro-button:focus-visible{outline:none}.auro-button:active{transform:scale(0.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}`;
1786
+
1787
+ var colorCss$3 = 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, 0.05));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background, rgba(0, 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, 0.1));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 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, 0.05));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background, rgba(0, 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, 0.05));--ds-auro-button-container-image: var(--ds-advanced-color-button-ghost-background-hover, rgba(0, 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]){--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])){--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){--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused, #01426a)}:host([ondark][disabled]){--ds-auro-button-border-color: var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color: var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image: var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([ondark][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])){--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, 0.1));--ds-auro-button-container-image: var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}:host([ondark][variant=secondary]:focus-within){--ds-auro-button-border-inset-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([ondark][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]){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.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])){--ds-auro-button-container-color: var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image: var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}:host([ondark][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]){--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([ondark][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])){--ds-auro-button-container-color: var(--ds-advanced-color-button-ghost-background-inverse-hover, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image: var(--ds-advanced-color-button-ghost-background-inverse-hover, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color: transparent}:host([ondark][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]){--ds-auro-button-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([ondark][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){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{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){--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)}`;
1788
+
1789
+ var tokensCss$3 = 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)}`;
1790
+
1791
+ var shapeSize = 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}`;
1792
+
1793
+ var styleCss$2 = 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, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}: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}: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:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.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(0deg)}100%{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{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{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%}100%{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}}`;
1794
+
1795
+ var colorCss$2 = 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]){--ds-auro-loader-color:var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]){--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}`;
1796
+
1797
+ var tokensCss$2 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
1798
+
1799
+ // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1800
+ // See LICENSE in the project root for license information.
1801
+
1802
+
1803
+ class AuroLoader extends i$2 {
1804
+ constructor() {
1805
+ super();
1806
+
1807
+ /**
1808
+ * @private
1809
+ */
1810
+ this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
1811
+
1812
+ /**
1813
+ * @private
1814
+ */
1815
+ this.mdCount = 3;
1816
+
1817
+ /**
1818
+ * @private
1819
+ */
1820
+ this.smCount = 2;
1821
+
1822
+ /**
1823
+ * @private
1824
+ */
1825
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
1826
+
1827
+ this.orbit = false;
1828
+ this.ringworm = false;
1829
+ this.laser = false;
1830
+ this.pulse = false;
1831
+ }
1832
+
1833
+ // function to define props used within the scope of this component
1834
+ static get properties() {
1835
+ return {
1836
+
1837
+ /**
1838
+ * Sets loader to laser type.
1839
+ */
1840
+ laser: {
1841
+ type: Boolean,
1842
+ reflect: true
1843
+ },
1844
+
1845
+ /**
1846
+ * Sets loader to orbit type.
1847
+ */
1848
+ orbit: {
1849
+ type: Boolean,
1850
+ reflect: true
1851
+ },
1852
+
1853
+ /**
1854
+ * Sets loader to pulse type.
1855
+ */
1856
+ pulse: {
1857
+ type: Boolean,
1858
+ reflect: true
1859
+ },
1860
+
1861
+ /**
1862
+ * Sets loader to ringworm type.
1863
+ */
1864
+ ringworm: {
1865
+ type: Boolean,
1866
+ reflect: true
1867
+ }
1868
+ };
1869
+ }
1870
+
1871
+ static get styles() {
1872
+ return [
1873
+ i$5`${styleCss$2}`,
1874
+ i$5`${colorCss$2}`,
1875
+ i$5`${tokensCss$2}`
1876
+ ];
1877
+ }
1878
+
1879
+ /**
1880
+ * This will register this element with the browser.
1881
+ * @param {string} [name="auro-loader"] - The name of element that you want to register to.
1882
+ *
1883
+ * @example
1884
+ * AuroLoader.register("custom-loader") // this will register this element to <custom-loader/>
1885
+ *
1886
+ */
1887
+ static register(name = "auro-loader") {
1888
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroLoader);
1889
+ }
1890
+
1891
+ firstUpdated() {
1892
+ // Add the tag name as an attribute if it is different than the component name
1893
+ this.runtimeUtils.handleComponentTagRename(this, 'auro-loader');
1894
+ }
1895
+
1896
+ connectedCallback() {
1897
+ super.connectedCallback();
1898
+ }
1899
+
1900
+ /**
1901
+ * @private
1902
+ * @returns {Array} Numbered array for template map.
1903
+ */
1904
+ defineTemplate() {
1905
+ let nodes = Array.from(Array(this.mdCount).keys());
1906
+
1907
+ if (this.orbit || this.laser) {
1908
+ nodes = Array.from(Array(this.smCount).keys());
1909
+ } else if (this.ringworm) {
1910
+ nodes = Array.from(Array(0).keys());
1911
+ }
1912
+
1913
+ return nodes;
1914
+ }
1915
+
1916
+ // When using auroElement, use the following attribute and function when hiding content from screen readers.
1917
+ // aria-hidden="${this.hideAudible(this.hiddenAudible)}"
1918
+
1919
+ // function that renders the HTML and CSS into the scope of the component
1920
+ render() {
1921
+ return x`
1922
+ ${this.defineTemplate().map((idx) => x`
1923
+ <span part="element" class="loader node-${idx}"></span>
1924
+ `)}
1925
+
1926
+ <div class="no-animation body-default">Loading...</div>
1927
+
1928
+ ${this.ringworm ? x`
1929
+ <svg part="element" class="circular" viewBox="25 25 50 50">
1930
+ <circle class="path" cx="50" cy="50" r="20" fill="none"/>
1931
+ </svg>`
1932
+ : ``
1933
+ }
1934
+ `;
1935
+ }
1936
+ }
1937
+
1938
+ var loaderVersion = '5.1.2';
1939
+
1940
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
1941
+ // See LICENSE in the project root for license information.
1942
+
1943
+
1944
+ /**
1945
+ * @slot - Default slot for the text of the button.
1946
+ * @csspart button - Apply CSS to HTML5 button.
1947
+ * @csspart loader - Apply CSS to auro-loader.
1948
+ * @csspart text - Apply CSS to text slot.
1949
+ * @csspart icon - Apply CSS to icon slot.
1950
+ */
1951
+
1952
+ const ICON_ONLY_SHAPES = ['circle', 'square'];
1953
+
1954
+ /**
1955
+ * AuroButton is a custom element that provides a styled, accessible button with support for various states and form association.
1956
+ * It is designed to be flexible, supporting loading states, icon slots, and integration with HTML5 forms.
1957
+ * @property {'default', 'rounded', 'pill', 'circle', 'square'} shape - Defines the shape of the button.
1958
+ * @property {'xs', 'sm', 'md', 'lg', 'xl'} size - Defines the size of the button.
1959
+ * @property {'primary', 'secondary', 'tertiary', 'ghost', 'flat'} variant - Sets the button variant.
1960
+ * @property {'submit', 'reset', 'button'} type - The type of button. Matches HTML5 Button Spec.
1961
+ * @property {boolean} onDark - Indicates if the button is rendered in dark mode.
1962
+ */
1963
+ class AuroButton extends AuroElement {
1964
+
1965
+ /**
1966
+ * Enables form association for this element.
1967
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals
1968
+ * @returns {boolean} - Returns true to enable form association.
1969
+ */
1970
+ static get formAssociated() {
1971
+ return true;
1972
+ }
1973
+
1974
+ constructor() {
1975
+ super();
1976
+ this.autofocus = false;
1977
+ this.disabled = false;
1978
+ this.loading = false;
1979
+ this.static = false;
1980
+ this.size = "md";
1981
+ this.shape = "rounded";
1982
+ this.onDark = false;
1983
+ this.fluid = false;
1984
+ this.loadingText = this.loadingText || 'Loading...';
1985
+ this.variant = 'primary';
1986
+
1987
+ /**
1988
+ * @private
1989
+ */
1990
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
1991
+
1992
+ // Support for HTML5 forms
1993
+ if (typeof this.attachInternals === 'function') {
1994
+ this.internals = this.attachInternals();
1995
+ } else {
1996
+ this.internals = null;
1997
+
1998
+ // eslint-disable-next-line no-console
1999
+ 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.');
2000
+ }
2001
+
2002
+ /**
2003
+ * Generate unique names for dependency components.
2004
+ */
2005
+ const versioning = new AuroDependencyVersioning();
2006
+
2007
+ /**
2008
+ * @private
2009
+ */
2010
+ this.loaderTag = versioning.generateTag('auro-loader', loaderVersion, AuroLoader);
2011
+
2012
+ /**
2013
+ * @private
2014
+ */
2015
+ this.buttonHref = undefined;
2016
+
2017
+ /**
2018
+ * @private
2019
+ */
2020
+ this.buttonTarget = undefined;
2021
+
2022
+ /**
2023
+ * @private
2024
+ */
2025
+ this.buttonRel = undefined;
2026
+ }
2027
+
2028
+ static get styles() {
2029
+ return [
2030
+ tokensCss$3,
2031
+ styleCss$3,
2032
+ colorCss$3,
2033
+ shapeSize
2034
+ ];
2035
+ }
2036
+
2037
+ static get properties() {
2038
+ return {
2039
+
2040
+ ...super.properties,
2041
+
2042
+ /**
2043
+ * Override layout since it isn't used in this component.
2044
+ * @private
2045
+ */
2046
+ layout: {
2047
+ type: Boolean,
2048
+ attribute: false,
2049
+ reflect: false
2050
+ },
2051
+
2052
+ /**
2053
+ * This Boolean attribute lets you specify that the button should have input focus when the page loads, unless overridden by the user.
2054
+ */
2055
+ autofocus: {
2056
+ type: Boolean,
2057
+ reflect: true
2058
+ },
2059
+
2060
+ /**
2061
+ * If set to true, button will become disabled and not allow for interactions.
2062
+ */
2063
+ disabled: {
2064
+ type: Boolean,
2065
+ reflect: true
2066
+ },
2067
+
2068
+ /**
2069
+ * Alters the shape of the button to be full width of its parent container.
2070
+ */
2071
+ fluid: {
2072
+ type: Boolean,
2073
+ reflect: true
2074
+ },
2075
+
2076
+ /**
2077
+ * If set to true button text will be replaced with `auro-loader` and become disabled.
2078
+ */
2079
+ loading: {
2080
+ type: Boolean,
2081
+ reflect: true
2082
+ },
2083
+
2084
+ /**
2085
+ * Sets custom loading text for the `aria-label` on a button in loading state. If not set, the default value of "Loading..." will be used.
2086
+ */
2087
+ loadingText: {
2088
+ type: String
2089
+ },
2090
+
2091
+ /**
2092
+ * Populates `tabindex` to define the focusable sequence in keyboard navigation.
2093
+ */
2094
+ tIndex: {
2095
+ type: String,
2096
+ reflect: true
2097
+ },
2098
+
2099
+ /**
2100
+ * Populates `tabindex` to define the focusable sequence in keyboard navigation.
2101
+ * Must be used with "." to ensure the host element does not retain a reference to the `tabindex` attribute.
2102
+ * Example: `<auro-button .tabindex="${this.disabled ? '-1' : '0'}"></auro-button>`.
2103
+ */
2104
+ tabindex: {
2105
+ type: String,
2106
+ reflect: false
2107
+ },
2108
+
2109
+ /**
2110
+ * Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
2111
+ */
2112
+ title: {
2113
+ type: String,
2114
+ reflect: true
2115
+ },
2116
+
2117
+ /**
2118
+ * The type of the button. Possible values are: `submit`, `reset`, `button`.
2119
+ */
2120
+ type: {
2121
+ type: String,
2122
+ reflect: true
2123
+ },
2124
+
2125
+ /**
2126
+ * Defines the value associated with the button which is submitted with the form data.
2127
+ */
2128
+ value: {
2129
+ type: String,
2130
+ reflect: true
2131
+ },
2132
+
2133
+ /**
2134
+ * Sets button variant option.
2135
+ * @default primary
2136
+ */
2137
+ variant: {
2138
+ type: String,
2139
+ reflect: true
2140
+ },
2141
+
2142
+ /**
2143
+ * @private
2144
+ */
2145
+ buttonHref: {
2146
+ type: String,
2147
+ },
2148
+
2149
+ /**
2150
+ * @private
2151
+ */
2152
+ buttonTarget: {
2153
+ type: String,
2154
+ },
2155
+
2156
+ /**
2157
+ * @private
2158
+ */
2159
+ buttonRel: {
2160
+ type: String,
2161
+ },
2162
+
2163
+ /**
2164
+ * If true, the button will be static and not respond to user interactions.
2165
+ */
2166
+ static: {
2167
+ type: Boolean,
2168
+ reflect: true
2169
+ },
2170
+
2171
+ /**
2172
+ * @private
2173
+ */
2174
+ onHover: {
2175
+ attribute: 'data-hover',
2176
+ type: Boolean,
2177
+ reflect: true
2178
+ },
2179
+
2180
+ /**
2181
+ * @private
2182
+ */
2183
+ onActive: {
2184
+ attribute: 'data-active',
2185
+ type: Boolean,
2186
+ reflect: true
2187
+ }
2188
+ };
2189
+ }
2190
+
2191
+ /**
2192
+ * This will register this element with the browser.
2193
+ * @param {string} [name="auro-button"] - The name of element that you want to register to.
2194
+ *
2195
+ * @example
2196
+ * AuroButton.register("custom-button") // this will register this element to <custom-button/>
2197
+ *
2198
+ */
2199
+ static register(name = "auro-button") {
2200
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroButton);
2201
+ }
2202
+
2203
+ /**
2204
+ * Internal method to apply focus to the HTML5 button.
2205
+ * @private
2206
+ * @returns {void}
2207
+ */
2208
+ focus() {
2209
+ this.renderRoot.querySelector('button').focus();
2210
+ }
2211
+
2212
+ /**
2213
+ * Submits the form that this button is associated with.
2214
+ * @private
2215
+ * @returns {void}
2216
+ */
2217
+ surfaceSubmitEvent() {
2218
+ if (this.form) {
2219
+ this.form.requestSubmit();
2220
+ }
2221
+ }
2222
+
2223
+ /**
2224
+ * Returns the form element that this button is associated with.
2225
+ * @private
2226
+ * @returns {HTMLFormElement | null}
2227
+ */
2228
+ get form() {
2229
+ return this.internals ? this.internals.form : null;
2230
+ }
2231
+
2232
+ /**
2233
+ * @private
2234
+ * @returns {Boolean}
2235
+ */
2236
+ get showText() {
2237
+ return !ICON_ONLY_SHAPES.includes(this.shape);
2238
+ }
2239
+
2240
+ /**
2241
+ * Returns the current value of the projected `aria-label` attribute or undefined if not set.
2242
+ * @returns {string | undefined}
2243
+ * @private
2244
+ */
2245
+ get currentAriaLabel() {
2246
+ if (!this.attributeWatcher) return undefined;
2247
+
2248
+ const ariaLabel = this.attributeWatcher.getObservedAttribute("aria-label");
2249
+ return ariaLabel || undefined;
2250
+ }
2251
+
2252
+ /**
2253
+ * Returns the current value of the projected `aria-labelledby` attribute or undefined if not set.
2254
+ * @returns {string | undefined}
2255
+ * @private
2256
+ */
2257
+ get currentAriaLabelledBy() {
2258
+ if (!this.attributeWatcher) return undefined;
2259
+
2260
+ const ariaLabelledBy = this.attributeWatcher.getObservedAttribute("aria-labelledby");
2261
+ return ariaLabelledBy || undefined;
2262
+ }
2263
+
2264
+ /**
2265
+ * Whether or not the button is set to an icon-only shape.
2266
+ * @returns {boolean} - True if the button is icon-only, false otherwise.
2267
+ * @private
2268
+ */
2269
+ get iconOnly() {
2270
+ return ICON_ONLY_SHAPES.includes(this.shape);
2271
+ }
2272
+
2273
+ /**
2274
+ * Gets a class name for the font size based on the button's size and shape.
2275
+ * @returns {string} - The font size class name.
2276
+ * @private
2277
+ */
2278
+ getFontSize() {
2279
+
2280
+ // Size map for standard buttons
2281
+ const standardButtonSizeMap = {
2282
+ xs: 'body-xs',
2283
+ sm: 'body-sm',
2284
+ md: 'body-default',
2285
+ lg: 'body-lg',
2286
+ xl: 'body-lg'
2287
+ };
2288
+
2289
+ // Size map for icon-only buttons
2290
+ const iconOnlyButtonSizeMap = {
2291
+ xs: 'heading-xs',
2292
+ sm: 'heading-sm',
2293
+ md: 'heading-sm',
2294
+ lg: 'heading-md',
2295
+ xl: 'heading-lg'
2296
+ };
2297
+
2298
+ // Determine which map to use based on the shape
2299
+ const sizeMap = this.iconOnly ? iconOnlyButtonSizeMap : standardButtonSizeMap;
2300
+
2301
+ // Return the font size based on the button size and shape
2302
+ return sizeMap[this.size] || 'body-default';
2303
+ }
2304
+
2305
+ /**
2306
+ * Renders the tag for the component.
2307
+ * @returns {TemplateResult}
2308
+ * @private
2309
+ */
2310
+ get _renderTag() {
2311
+ if (this.static) return i$1`span`;
2312
+
2313
+ return this.buttonHref ? i$1`a` : i$1`button`;
2314
+ }
2315
+
2316
+ firstUpdated() {
2317
+ super.firstUpdated();
2318
+
2319
+ this.runtimeUtils.handleComponentTagRename(this, 'auro-button');
2320
+ }
2321
+
2322
+ /**
2323
+ * This is to detect pointer events for hover and active states for styling purposes.
2324
+ * :host with :has selector dont work together in Safari and Firefox
2325
+ * @param {PointerEvent} event - The pointer event.
2326
+ * @private
2327
+ */
2328
+ onPointerEvent(event) {
2329
+ switch (event.type) {
2330
+ case 'pointerenter':
2331
+ this.onHover = true;
2332
+ break;
2333
+ case 'pointerleave':
2334
+ this.onHover = false;
2335
+ break;
2336
+ case 'pointerdown':
2337
+ this.onActive = true;
2338
+ break;
2339
+ case 'pointerup':
2340
+ case 'blur':
2341
+ this.onActive = false;
2342
+ break;
2343
+ }
2344
+ }
2345
+
2346
+ /**
2347
+ * Renders the default layout for the button.
2348
+ * @returns {TemplateResult}
2349
+ * @private
2350
+ */
2351
+ renderLayoutDefault() {
2352
+
2353
+ const fontSize = this.getFontSize();
2354
+ const part = this.buttonHref ? 'link' : 'button';
2355
+
2356
+ const classes = {
2357
+ "auro-button": true,
2358
+ "inset": this.showText,
2359
+ wrapper: true,
2360
+ loading: this.loading,
2361
+
2362
+ // These remove the default borders so we can handle focus borders ourselves
2363
+ 'simple': !['secondary'].includes(this.variant),
2364
+ 'thin': ['secondary'].includes(this.variant),
2365
+ };
2366
+
2367
+ const contentClasses = {
2368
+ "contentWrapper": true,
2369
+ "util_displayHiddenVisually": this.loading
2370
+ };
2371
+
2372
+ // Type classes should not be applied to the wrapper to avoid affecting icons
2373
+ const textSlotClasses = {
2374
+ textSlot: true,
2375
+ [fontSize]: this.showText
2376
+ };
2377
+
2378
+ const tabindex = this.tIndex || this.tabindex;
2379
+
2380
+ return u`
2381
+ <${this._renderTag}
2382
+ part="${part}"
2383
+ aria-label="${o(this.loading ? this.loadingText : this.currentAriaLabel || undefined)}"
2384
+ aria-labelledby="${o(this.loading ? undefined : this.currentAriaLabelledBy || undefined)}"
2385
+ tabindex="${o(this.static ? -1 : tabindex)}"
2386
+ ?autofocus="${this.autofocus}"
2387
+ class=${e(classes)}
2388
+ ?disabled="${this.disabled || this.loading}"
2389
+ ?onDark="${this.onDark}"
2390
+ title="${o(this.title ? this.title : undefined)}"
2391
+ name="${o(this.name ? this.name : undefined)}"
2392
+ type="${o(this.type ? this.type : undefined)}"
2393
+ variant="${o(this.variant ? this.variant : undefined)}"
2394
+ .value="${o(this.value ? this.value : undefined)}"
2395
+ @click="${!this.static && this.type === 'submit' ? this.surfaceSubmitEvent : undefined}"
2396
+ @pointerenter="${this.onPointerEvent}"
2397
+ @pointerleave="${this.onPointerEvent}"
2398
+ @pointerdown="${this.onPointerEvent}"
2399
+ @pointerup="${this.onPointerEvent}"
2400
+ @blur="${this.onPointerEvent}"
2401
+ href="${o(this.buttonHref || undefined)}"
2402
+ target="${o(this.buttonTarget || undefined)}"
2403
+ rel="${o(this.buttonRel || undefined)}"
2404
+ >
2405
+ ${o(this.loading ? u`<${this.loaderTag} pulse part="loader"></${this.loaderTag}>` : undefined)}
2406
+
2407
+ <span class="${e(contentClasses)}" part="contentWrapper">
2408
+ <span class="${e(textSlotClasses)}" part="text">
2409
+ <slot></slot>
2410
+ </span>
2411
+ </span>
2412
+ </${this._renderTag}>
2413
+ `;
2414
+ }
2415
+
2416
+ /**
2417
+ * Renders the layout of the button.
2418
+ * @returns {TemplateResult}
2419
+ * @private
2420
+ */
2421
+ renderLayout() {
2422
+ return this.renderLayoutDefault();
2423
+ }
2424
+ }
2425
+
2426
+ var styles = i$5`a.auro-button{text-decoration:none}`;
2427
+
2428
+ // Copyright (c) 2022 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
2429
+ // See LICENSE in the project root for license information.
2430
+
2431
+
2432
+ // build the component class
2433
+ class AuroHyperlinkButton extends AuroButton {
2434
+
2435
+ /**
2436
+ * This will register this element with the browser.
2437
+ * @param {string} [name="auro-hyperlink-button"] - The name of element that you want to register to.
2438
+ *
2439
+ * @example
2440
+ * AuroHyperlinkButton.register("custom-hyperlink-button") // this will register this element to <custom-hyperlink-button/>
2441
+ *
2442
+ */
2443
+ static register(name = "auro-hyperlink-button") {
2444
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroHyperlinkButton);
2445
+ }
2446
+
2447
+ static get styles() {
2448
+ return [
2449
+ ...super.styles,
2450
+ styles,
2451
+ ];
2452
+ }
2453
+
2454
+ }
2455
+
2456
+ /* istanbul ignore else */
2457
+ // define the name of the custom component
2458
+ if (!customElements.get("auro-hyperlink-button")) {
2459
+ customElements.define("auro-hyperlink-button", AuroHyperlinkButton);
2460
+ }
2461
+
2462
+ var styleCss$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, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host(:not([fluid])){display:inline-block}:host([type=nav]) .hyperlink:focus{text-decoration:underline}:host([type=cta]){line-height:0}:host(:not([type=cta]):not([type=nav])) .hyperlink{display:inline-block;border-radius:3px;outline-offset:unset;outline-style:solid;outline-width:1px}:host(:not([type=cta]):not([type=nav])) .hyperlink:focus-visible{outline-offset:var(--ds-size-25, 0.125rem)}.hyperlink{transition:all .15s ease;text-decoration:underline}@media(hover: hover){.hyperlink:hover{text-decoration:none}.hyperlink--nav:hover{text-decoration:underline}}.hyperlink--nav{display:block;text-decoration:none}.hyperlink--nav:focus-visible{outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:unset}.hyperlink--button{cursor:pointer}[auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-left:var(--ds-size-25, 0.125rem)}[fluid]{display:flex}`;
2463
+
2464
+ var colorCss$1 = i$5`:host([type=nav]:not([ondark])) a{color:var(--ds-auro-hyperlink-nav-default-color-default);background-color:var(--ds-auro-hyperlink-nav-default-container-color-default);outline-color:var(--ds-auro-hyperlink-nav-default-outline-color-default);border-color:var(--ds-auro-hyperlink-nav-default-border-color-default)}:host([type=nav]:not([ondark])) a:visited{color:var(--ds-auro-hyperlink-nav-visited-color-default);background-color:var(--ds-auro-hyperlink-nav-visited-container-color-default);outline-color:var(--ds-auro-hyperlink-nav-visited-outline-color-default);border-color:var(--ds-auro-hyperlink-nav-visited-border-color-default)}:host([type=nav]:not([ondark])) a:focus-visible{color:var(--ds-auro-hyperlink-nav-focus-color-default);background-color:var(--ds-auro-hyperlink-nav-focus-container-color-default);outline-color:var(--ds-auro-hyperlink-nav-focus-outline-color-default);border-color:var(--ds-auro-hyperlink-nav-focus-border-color-default)}:host([type=nav]:not([ondark])) a:hover{color:var(--ds-auro-hyperlink-nav-hover-color-default);background-color:var(--ds-auro-hyperlink-nav-hover-container-color-default);outline-color:var(--ds-auro-hyperlink-nav-hover-outline-color-default);border-color:var(--ds-auro-hyperlink-nav-hover-border-color-default)}:host([type=nav]:not([ondark])) a:hover:focus-visible{outline-color:var(--ds-auro-hyperlink-nav-focus-outline-color-default);border-color:var(--ds-auro-hyperlink-nav-focus-border-color-default)}:host([type=nav][ondark]) a{color:var(--ds-auro-hyperlink-nav-default-color-inverse);background-color:var(--ds-auro-hyperlink-nav-default-container-color-inverse);outline-color:var(--ds-auro-hyperlink-nav-default-outline-color-inverse);border-color:var(--ds-auro-hyperlink-nav-default-border-color-inverse)}:host([type=nav][ondark]) a:visited{color:var(--ds-auro-hyperlink-nav-visited-color-inverse);background-color:var(--ds-auro-hyperlink-nav-visited-container-color-inverse);outline-color:var(--ds-auro-hyperlink-nav-visited-outline-color-inverse);border-color:var(--ds-auro-hyperlink-nav-visited-border-color-inverse)}:host([type=nav][ondark]) a:focus-visible{color:var(--ds-auro-hyperlink-nav-focus-color-inverse);background-color:var(--ds-auro-hyperlink-nav-focus-container-color-inverse);outline-color:var(--ds-auro-hyperlink-nav-focus-outline-color-inverse);border-color:var(--ds-auro-hyperlink-nav-focus-border-color-inverse)}:host([type=nav][ondark]) a:hover{color:var(--ds-auro-hyperlink-nav-hover-color-inverse);background-color:var(--ds-auro-hyperlink-nav-hover-container-color-inverse);outline-color:var(--ds-auro-hyperlink-nav-hover-outline-color-inverse);border-color:var(--ds-auro-hyperlink-nav-hover-border-color-inverse)}:host([type=nav][ondark]) a:hover:focus-visible{outline-color:var(--ds-auro-hyperlink-nav-focus-outline-color-inverse);border-color:var(--ds-auro-hyperlink-nav-focus-border-color-inverse)}:host(:not([type=nav]):not([ondark])) a{color:var(--ds-auro-hyperlink-default-color-default);background-color:var(--ds-auro-hyperlink-default-container-color-default);outline-color:var(--ds-auro-hyperlink-default-outline-color-default);border-color:var(--ds-auro-hyperlink-default-border-color-default)}:host(:not([type=nav]):not([ondark])) a:visited{color:var(--ds-auro-hyperlink-visited-color-default);background-color:var(--ds-auro-hyperlink-visited-container-color-default);outline-color:var(--ds-auro-hyperlink-visited-outline-color-default);border-color:var(--ds-auro-hyperlink-visited-border-color-default)}:host(:not([type=nav]):not([ondark])) a:focus-visible{color:var(--ds-auro-hyperlink-focus-color-default);background-color:var(--ds-auro-hyperlink-focus-container-color-default);outline-color:var(--ds-auro-hyperlink-focus-outline-color-default);border-color:var(--ds-auro-hyperlink-focus-border-color-default)}:host(:not([type=nav]):not([ondark])) a:hover{color:var(--ds-auro-hyperlink-hover-color-default);background-color:var(--ds-auro-hyperlink-hover-container-color-default);outline-color:var(--ds-auro-hyperlink-hover-outline-color-default);border-color:var(--ds-auro-hyperlink-hover-border-color-default)}:host(:not([type=nav]):not([ondark])) a:hover:focus-visible{outline-color:var(--ds-auro-hyperlink-focus-outline-color-default);border-color:var(--ds-auro-hyperlink-focus-border-color-default)}:host(:not([type=nav])[ondark]) a{color:var(--ds-auro-hyperlink-default-color-inverse);background-color:var(--ds-auro-hyperlink-default-container-color-inverse);outline-color:var(--ds-auro-hyperlink-default-outline-color-inverse);border-color:var(--ds-auro-hyperlink-default-border-color-inverse)}:host(:not([type=nav])[ondark]) a:visited{color:var(--ds-auro-hyperlink-visited-color-inverse);background-color:var(--ds-auro-hyperlink-visited-container-color-inverse);outline-color:var(--ds-auro-hyperlink-visited-outline-color-inverse);border-color:var(--ds-auro-hyperlink-visited-border-color-inverse)}:host(:not([type=nav])[ondark]) a:focus-visible{color:var(--ds-auro-hyperlink-focus-color-inverse);background-color:var(--ds-auro-hyperlink-focus-container-color-inverse);outline-color:var(--ds-auro-hyperlink-focus-outline-color-inverse);border-color:var(--ds-auro-hyperlink-focus-border-color-inverse)}:host(:not([type=nav])[ondark]) a:hover{color:var(--ds-auro-hyperlink-hover-color-inverse);background-color:var(--ds-auro-hyperlink-hover-container-color-inverse);outline-color:var(--ds-auro-hyperlink-hover-outline-color-inverse);border-color:var(--ds-auro-hyperlink-hover-border-color-inverse)}:host(:not([type=nav])[ondark]) a:hover:focus-visible{outline-color:var(--ds-auro-hyperlink-focus-outline-color-inverse);border-color:var(--ds-auro-hyperlink-focus-border-color-inverse)}`;
2465
+
2466
+ var tokensCss$1 = i$5`:host(:not([type=cta])){--ds-auro-hyperlink-default-color-default: var(--ds-advanced-color-hyperlink-text, #2875b5);--ds-auro-hyperlink-default-container-color-default: transparent;--ds-auro-hyperlink-default-outline-color-default: transparent;--ds-auro-hyperlink-default-border-color-default: transparent;--ds-auro-hyperlink-visited-color-default: var(--ds-advanced-color-hyperlink-text, #2875b5);--ds-auro-hyperlink-visited-container-color-default: transparent;--ds-auro-hyperlink-visited-outline-color-default: transparent;--ds-auro-hyperlink-visited-border-color-default: transparent;--ds-auro-hyperlink-focus-color-default: var(--ds-advanced-color-hyperlink-text, #2875b5);--ds-auro-hyperlink-focus-container-color-default: transparent;--ds-auro-hyperlink-focus-outline-color-default: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-hyperlink-focus-border-color-default: transparent;--ds-auro-hyperlink-hover-color-default: var(--ds-advanced-color-hyperlink-text-hover, #01426a);--ds-auro-hyperlink-hover-container-color-default: transparent;--ds-auro-hyperlink-hover-outline-color-default: transparent;--ds-auro-hyperlink-hover-border-color-default: transparent;--ds-auro-hyperlink-default-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-default-container-color-inverse: transparent;--ds-auro-hyperlink-default-outline-color-inverse: transparent;--ds-auro-hyperlink-default-border-color-inverse: transparent;--ds-auro-hyperlink-visited-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-visited-container-color-inverse: transparent;--ds-auro-hyperlink-visited-outline-color-inverse: transparent;--ds-auro-hyperlink-visited-border-color-inverse: transparent;--ds-auro-hyperlink-focus-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-focus-container-color-inverse: transparent;--ds-auro-hyperlink-focus-outline-color-inverse: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-hyperlink-focus-border-color-inverse: transparent;--ds-auro-hyperlink-hover-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-hover-container-color-inverse: transparent;--ds-auro-hyperlink-hover-outline-color-inverse: transparent;--ds-auro-hyperlink-hover-border-color-inverse: transparent;--ds-auro-hyperlink-nav-default-color-default: var(--ds-advanced-color-hyperlink-text, #2875b5);--ds-auro-hyperlink-nav-default-container-color-default: transparent;--ds-auro-hyperlink-nav-default-outline-color-default: transparent;--ds-auro-hyperlink-nav-default-border-color-default: transparent;--ds-auro-hyperlink-nav-visited-color-default: var(--ds-advanced-color-hyperlink-text, #2875b5);--ds-auro-hyperlink-nav-visited-container-color-default: transparent;--ds-auro-hyperlink-nav-visited-outline-color-default: transparent;--ds-auro-hyperlink-nav-visited-border-color-default: transparent;--ds-auro-hyperlink-nav-focus-color-default: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-nav-focus-container-color-default: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-hyperlink-nav-focus-outline-color-default: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-hyperlink-nav-focus-border-color-default: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-hyperlink-nav-hover-color-default: var(--ds-advanced-color-hyperlink-text-hover, #01426a);--ds-auro-hyperlink-nav-hover-container-color-default: transparent;--ds-auro-hyperlink-nav-hover-outline-color-default: transparent;--ds-auro-hyperlink-nav-hover-border-color-default: transparent;--ds-auro-hyperlink-nav-default-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-nav-default-container-color-inverse: transparent;--ds-auro-hyperlink-nav-default-outline-color-inverse: transparent;--ds-auro-hyperlink-nav-default-border-color-inverse: transparent;--ds-auro-hyperlink-nav-visited-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-nav-visited-container-color-inverse: transparent;--ds-auro-hyperlink-nav-visited-outline-color-inverse: transparent;--ds-auro-hyperlink-nav-visited-border-color-inverse: transparent;--ds-auro-hyperlink-nav-focus-color-inverse: var(--ds-advanced-color-hyperlink-text, #2875b5);--ds-auro-hyperlink-nav-focus-container-color-inverse: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-hyperlink-nav-focus-outline-color-inverse: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-hyperlink-nav-focus-border-color-inverse: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-hyperlink-nav-hover-color-inverse: var(--ds-advanced-color-hyperlink-text-inverse, #ffffff);--ds-auro-hyperlink-nav-hover-container-color-inverse: transparent;--ds-auro-hyperlink-nav-hover-outline-color-inverse: transparent;--ds-auro-hyperlink-nav-hover-border-color-inverse: transparent}`;
2467
+
2468
+ // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
2469
+ // See LICENSE in the project root for license information.
2470
+
2471
+
2472
+ // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
2473
+ /**
2474
+ * `<auro-hyperlink>` is a component that wraps an HTML `<a>` element, providing additional styling and behavior.
2475
+ *
2476
+ * @prop {String} role - Defines ARIA roles; currently supports `button` for extended experiences.
2477
+ * @csspart link - Allows styling to be applied to the `a` element.
2478
+ * @csspart targetIcon - Allows styling to be applied to the icon that appears next to the hyperlink.
2479
+ */
2480
+
2481
+ // build the component class
2482
+ class AuroHyperlink extends ComponentBase {
2483
+ constructor() {
2484
+ super();
2485
+ this._createRefs(); // eslint-disable-line
2486
+
2487
+ const versioning = new AuroDependencyVersioning();
2488
+
2489
+ /**
2490
+ * @private
2491
+ */
2492
+ this.iconTag = versioning.generateTag('auro-icon', iconVersion, AuroIcon);
2493
+ }
2494
+
2495
+ // function to define props used within the scope of this component
2496
+ static get properties() {
2497
+ return {
2498
+ ...super.properties
2499
+ };
2500
+ }
2501
+
2502
+ static get styles() {
2503
+ return [
2504
+ styleCss$1,
2505
+ colorCss$1,
2506
+ tokensCss$1
2507
+ ];
2508
+ }
2509
+
2510
+ static get shadowRootOptions() {
2511
+ return {
2512
+ ...i$2.shadowRootOptions,
2513
+ delegatesFocus: true,
2514
+ };
2515
+ }
2516
+
2517
+ /**
2518
+ * Create usable refs to internal elements
2519
+ * @returns {void}
2520
+ * @private
2521
+ */
2522
+ _createRefs() {
2523
+ this.hyperlinkRef = e$1();
2524
+ }
2525
+
2526
+ connectedCallback() {
2527
+ super.connectedCallback();
2528
+ this.runtimeUtils.handleComponentTagRename(this, 'auro-hyperlink');
2529
+ }
2530
+
2531
+ firstUpdated() {
2532
+ // Initialize the transportation of ARIA attributes to the target element and get the disconnect function for cleanup
2533
+ if (this.hyperlinkRef.value) {
2534
+ this.attributeWatcher = transportAllA11yAttributes$1({
2535
+ host: this,
2536
+ target: this.hyperlinkRef.value
2537
+ });
2538
+ }
2539
+ }
2540
+
2541
+ disconnectedCallback() {
2542
+ if (this.attributeWatcher) {
2543
+ this.attributeWatcher.cleanup();
2544
+ this.attributeWatcher = null;
2545
+ }
2546
+ }
2547
+
2548
+ /**
2549
+ * This will register this element with the browser.
2550
+ * @param {string} [name="auro-hyperlink"] - The name of element that you want to register to.
2551
+ *
2552
+ * @example
2553
+ * AuroHyperlink.register("custom-hyperlink") // this will register this element to <custom-hyperlink/>
2554
+ *
2555
+ */
2556
+ static register(name = "auro-hyperlink") {
2557
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroHyperlink);
2558
+ }
2559
+
2560
+ /**
2561
+ * Renders the default layout for the hyperlink.
2562
+ * @returns {TemplateResult}
2563
+ * @private
2564
+ */
2565
+ renderLayoutDefault() {
2566
+
2567
+ const classes = {
2568
+ 'hyperlink': this.safeUri || this.role,
2569
+ 'hyperlink--nav': this.type === 'nav',
2570
+ 'hyperlink--ondark': this.ondark,
2571
+ 'hyperlink--button': this.role,
2572
+ 'hyperlink--secondary': this.variant === 'secondary',
2573
+ 'hyperlink--tertiary': this.variant === 'tertiary'
2574
+ };
2575
+
2576
+ return u`
2577
+ ${this.safeUri || this.role ? u`
2578
+ <a
2579
+ ${n(this.hyperlinkRef)}
2580
+ part="link"
2581
+ aria-pressed="${o(this.role === 'button' ? this.ariaPressedState(this.ariapressed) : undefined)}"
2582
+ class="${e(classes)}"
2583
+ href="${o(this.role ? undefined : this.safeUri)}"
2584
+ rel="${o(this.target || this.rel ? this.getRelType(this.target, this.rel) : undefined)}"
2585
+ referrerpolicy="${o(this.referrerpolicy ? this.defaultReferrerPolicy : undefined)}"
2586
+ role="${o(this.role === 'button' ? this.role : undefined)}"
2587
+ ?download="${this.download}"
2588
+ target="${o(this.target && this.includesDomain ? this.target : undefined)}"
2589
+ tabindex="${o(this.role === 'button' ? '0' : undefined)}"
2590
+ >
2591
+ <slot></slot>
2592
+ ${this.targetIcon(this.target)}
2593
+ </a>`
2594
+ : u`<slot></slot>`}
2595
+ `;
2596
+ }
2597
+
2598
+ /**
2599
+ * Renders the cta layout for the hyperlink.
2600
+ * @returns {TemplateResult}
2601
+ * @private
2602
+ */
2603
+ renderLayoutCTA() {
2604
+ return u`
2605
+ <auro-hyperlink-button
2606
+ ${n(this.hyperlinkRef)}
2607
+ ?ondark="${this.ondark}"
2608
+ ?fluid="${this.fluid}"
2609
+ variant="${o(this.variant || undefined)}"
2610
+ shape="${o(this.shape || undefined)}"
2611
+ size="${o(this.size || undefined)}"
2612
+ layout="${o(this.layout || undefined)}"
2613
+ buttonHref="${o(this.safeUri || undefined)}"
2614
+ buttonRel="${o(this.rel || undefined)}"
2615
+ buttonTarget="${o(this.target || undefined)}"
2616
+ >
2617
+ <slot></slot>
2618
+ ${this.targetIcon(this.target)}
2619
+ </auro-hyperlink-button>
2620
+ `;
2621
+ }
2622
+
2623
+ /**
2624
+ * Generates an object containing CSS classes based on the properties of the component.
2625
+ *
2626
+ * @example
2627
+ * // Assuming this.safeUri = 'http://example.com', this.role = 'button', this.type = 'cta'
2628
+ * this.getMarkup(); // Returns { 'hyperlink': true, 'hyperlink--nav': false, 'hyperlink--ondark': false, 'hyperlink--button': true, 'hyperlink--cta': true, 'hyperlink--secondary': false }
2629
+ *
2630
+ * @example
2631
+ * // Assuming this.safeUri = '', this.role = '', this.type = 'nav', this.ondark = true, this.variant = 'secondary'
2632
+ * this.getMarkup(); // Returns { 'hyperlink': false, 'hyperlink--nav': true, 'hyperlink--ondark': true, 'hyperlink--button': false, 'hyperlink--cta': false, 'hyperlink--secondary': true }
2633
+ *
2634
+ * @private
2635
+ * @returns {object} An object containing CSS classes.
2636
+ */
2637
+ getMarkup() {
2638
+ switch (this.type) {
2639
+ case 'cta':
2640
+ return this.renderLayoutCTA();
2641
+ default:
2642
+ return this.renderLayoutDefault();
2643
+ }
2644
+ }
2645
+ }
2646
+
2647
+ var hyperlinkVersion = '6.2.0';
2648
+
2649
+ var colorCss = i$5`:host{background-color:var(--ds-auro-card-background-color)}:host([border]){--ds-auro-card-border-color: var(--ds-basic-color-border-subtle, #dddddd);border-color:var(--ds-auro-card-border-color)}:host([border]),:host([href]){--ds-auro-card-background-color: var(--ds-basic-color-surface-default, #ffffff)}:host([href]) [auro-hyperlink]{--ds-auro-hyperlink-focus-outline-color-default: transparent;--ds-auro-hyperlink-hover-outline-color-default: transparent;outline-color:var(--ds-auro-card-border-color)}:host([href]) [auro-hyperlink]:hover,:host([href]) [auro-hyperlink]:focus{--ds-auro-card-border-color: var(--ds-advanced-color-state-focused, #01426a)}
2650
+ `;
2651
+
2652
+ var styleCss = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host{display:inline-flex;flex-direction:column}:host ::slotted(img){display:block;object-fit:cover;width:100%}:host::part(imageWrapper){display:flex;justify-content:center;align-items:center}:host .imageWrapper{display:flex;justify-content:center;align-items:center}:host .content{padding:var(--ds-size-200, 1rem) 0;padding-top:0}:host([center]){text-align:center}:host([variant=inset-content])::part(content),:host([href])::part(content){padding:var(--ds-size-200, 1rem);padding-top:0;overflow:hidden;text-wrap:wrap}:host([variant=inset-container]){padding:var(--ds-size-400, 2rem) var(--ds-size-200, 1rem)}:host([variant=inset-stretch])::part(imageWrapper){margin-top:var(--ds-size-400, 2rem)}:host([variant=inset-stretch])::part(content){margin-bottom:var(--ds-size-400, 2rem);padding-bottom:0}:host([border]){border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, .375rem);overflow:hidden}:host([href]) [auro-hyperlink]{border-radius:var(--ds-border-radius, .375rem);overflow:hidden;box-shadow:var(--ds-elevation-100, 0px 0px 5px rgba(0, 0, 0, .15));position:relative;outline-width:1px;outline-style:solid}:host([href]) [auro-hyperlink]::part(link){text-decoration:none;color:inherit}:host([href]) [auro-hyperlink]::part(targetIcon){position:absolute;top:unset;bottom:var(--ds-size-50, .25rem);right:var(--ds-size-50, .25rem)}:host([href]) [auro-hyperlink]:focus{border-radius:var(--ds-border-radius, .375rem);color:inherit}:host([href]) [auro-hyperlink]:hover{outline-offset:-1px;box-shadow:var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, .15));color:inherit}
2653
+ `;
2654
+
2655
+ var tokensCss = i$5`:host{--ds-auro-card-border-color: transparent;--ds-auro-card-background-color: transparent;--ds-auro-card-texticon-color: inherit}
2656
+ `;
2657
+
2658
+ // Copyright (c) 2021 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
2659
+ // See LICENSE in the project root for license information.
2660
+
2661
+
2662
+ // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
2663
+ /**
2664
+ * The `<auro-card>` element provides users a flexible way to convey a summary of information.
2665
+ *
2666
+ * @attr {String} variant - Sets the variant of the card. Options `inset-content`, `inset-container`, `inset-stretch`.
2667
+ * @attr {Boolean} border - Adds desired UI border to the `auro-card` element.
2668
+ * @attr {Boolean} center - Centers content within the scope of the `auro-card`.
2669
+ * @attr {String} href - Sets the card to function as a hyperlink to the provided href value & disables the default CTA slot.
2670
+ * @attr {String} rel - Sets rel attribute on the [auro-hyperlink](https://auro.alaskaair.com/components/auro/hyperlink/api#rel).
2671
+ * @attr {Boolean} relative - If true, the auto URL re-write feature will be disabled.https://auro.alaskaair.com/components/auro/hyperlink/api#relative
2672
+ * @attr {String} role - Sets role attribute on the [auro-hyperlink](https://auro.alaskaair.com/components/auro/hyperlink/api#role).
2673
+ * @attr {String} target - Sets target attribute on the [auro-hyperlink](https://auro.alaskaair.com/components/auro/hyperlink/api#target).
2674
+ * @slot image - Content slot for image content.
2675
+ * @slot header - Content slot for string text header content.
2676
+ * @slot description - Content slot for string text description content.
2677
+ * @slot cta - Content slot for call-to-action content.
2678
+ * @csspart content - Apply styles to the outer string text container.
2679
+ * @csspart link - Apply styles to the [auro-hyperlink](https://auro.alaskaair.com/components/auro/hyperlink/api#link) element.
2680
+ * @csspart imageWrapper - Apply styles to the outer image slot container.
2681
+ * @csspart image - Apply styles to the named image slot container.
2682
+ * @csspart header - Apply styles to the named header slot container.
2683
+ * @csspart description - Apply styles to the named description slot container.
2684
+ * @csspart cta - Apply styles to the named cta slot container.
2685
+ */
2686
+
2687
+ class AuroCard extends i$2 {
2688
+ constructor() {
2689
+ super();
2690
+
2691
+ /**
2692
+ * @private
2693
+ */
2694
+ this.runtimeUtils = new AuroLibraryRuntimeUtils();
2695
+
2696
+ const versioning = new AuroDependencyVersioning();
2697
+
2698
+ /**
2699
+ * @private
2700
+ */
2701
+ this.hyperlinkTag = versioning.generateTag(
2702
+ "auro-hyperlink",
2703
+ hyperlinkVersion,
2704
+ AuroHyperlink,
2705
+ );
2706
+ }
2707
+
2708
+ static get styles() {
2709
+ return [styleCss, tokensCss, colorCss];
2710
+ }
2711
+
2712
+ static get properties() {
2713
+ return {
2714
+ variant: {
2715
+ type: String,
2716
+ reflect: true,
2717
+ },
2718
+ href: {
2719
+ type: String,
2720
+ reflect: true,
2721
+ },
2722
+ rel: {
2723
+ type: String,
2724
+ reflect: true,
2725
+ },
2726
+ relative: {
2727
+ type: Boolean,
2728
+ reflect: true,
2729
+ },
2730
+ role: {
2731
+ type: String,
2732
+ reflect: true,
2733
+ },
2734
+ target: {
2735
+ type: String,
2736
+ reflect: true,
2737
+ },
2738
+ };
2739
+ }
2740
+
2741
+ /**
2742
+ * This will register this element with the browser.
2743
+ * @param {string} [name="auro-card"] - The name of element that you want to register to.
2744
+ *
2745
+ * @example
2746
+ * AuroCard.register("custom-card") // this will register this element to <custom-card/>
2747
+ *
2748
+ */
2749
+ static register(name = "auro-card") {
2750
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroCard);
2751
+ }
2752
+
2753
+ firstUpdated() {
2754
+ // Add the tag name as an attribute if it is different than the component name
2755
+ this.runtimeUtils.handleComponentTagRename(this, "auro-card");
2756
+
2757
+ this.setRole();
2758
+ }
2759
+
2760
+ /**
2761
+ * Sets the role attribute for the component.
2762
+ * @private
2763
+ * @returns {void}
2764
+ */
2765
+ setRole() {
2766
+ if (this.href) {
2767
+ this.role = this.role || undefined;
2768
+ } else {
2769
+ this.role = "article";
2770
+ }
2771
+ }
2772
+
2773
+ // function that renders the HTML and CSS into the scope of the component
2774
+ render() {
2775
+ const cardContent = u`
2776
+ <div class="imageWrapper" part="imageWrapper">
2777
+ <slot name="image" part="image"></slot>
2778
+ </div>
2779
+ <div id="content-within" class="content" part="content">
2780
+ <slot name="header" part="header"></slot>
2781
+ <slot name="description" part="description"></slot>
2782
+ <slot name="cta" part="cta"></slot>
2783
+ </div>
2784
+ `;
2785
+
2786
+ return u`
2787
+ ${
2788
+ this.href
2789
+ ? u`
2790
+ <${this.hyperlinkTag}
2791
+ aria-labelledby="content-within"
2792
+ href="${o(this.href ? this.href : undefined)}"
2793
+ rel="${o(this.rel ? this.rel : undefined)}"
2794
+ relative="${o(this.relative || undefined)}"
2795
+ role="${o(this.role ? this.role : undefined)}"
2796
+ target="${o(this.target ? this.target : undefined)}"
2797
+ part="link"
2798
+ >
2799
+ ${cardContent}
2800
+ </${this.hyperlinkTag}>`
2801
+ : cardContent
2802
+ }
2803
+ `;
2804
+ }
2805
+ }
2806
+
2807
+ export { AuroCard as A };