@aurodesignsystem-dev/auro-formkit 0.0.0-pr622.1 → 0.0.0-pr624.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
- package/components/bibtemplate/dist/index.js +2 -2
- package/components/bibtemplate/dist/registered.js +2 -2
- package/components/checkbox/README.md +1 -1
- package/components/checkbox/demo/api.min.js +14 -3
- package/components/checkbox/demo/index.min.js +14 -3
- package/components/checkbox/demo/readme.md +1 -1
- package/components/checkbox/dist/auro-checkbox-group.d.ts +1 -1
- package/components/checkbox/dist/auro-checkbox.d.ts +5 -1
- package/components/checkbox/dist/index.js +14 -3
- package/components/checkbox/dist/registered.js +14 -3
- package/components/combobox/README.md +1 -1
- package/components/combobox/demo/api.md +3 -0
- package/components/combobox/demo/api.min.js +1479 -395
- package/components/combobox/demo/index.html +2 -0
- package/components/combobox/demo/index.md +75 -0
- package/components/combobox/demo/index.min.js +1479 -395
- package/components/combobox/demo/readme.md +1 -1
- package/components/combobox/dist/auro-combobox.d.ts +19 -9
- package/components/combobox/dist/index.js +1471 -387
- package/components/combobox/dist/registered.js +1471 -387
- package/components/counter/README.md +1 -1
- package/components/counter/demo/api.min.js +433 -104
- package/components/counter/demo/index.min.js +433 -104
- package/components/counter/demo/readme.md +1 -1
- package/components/counter/dist/iconVersion.d.ts +1 -1
- package/components/counter/dist/index.js +433 -104
- package/components/counter/dist/registered.js +433 -104
- package/components/datepicker/README.md +1 -1
- package/components/datepicker/demo/api.min.js +1157 -376
- package/components/datepicker/demo/index.min.js +1157 -376
- package/components/datepicker/demo/readme.md +1 -1
- package/components/datepicker/dist/index.js +1156 -375
- package/components/datepicker/dist/registered.js +1156 -375
- package/components/dropdown/README.md +1 -1
- package/components/dropdown/demo/api.md +59 -35
- package/components/dropdown/demo/api.min.js +361 -88
- package/components/dropdown/demo/index.md +52 -0
- package/components/dropdown/demo/index.min.js +361 -88
- package/components/dropdown/demo/readme.md +1 -1
- package/components/dropdown/dist/auro-dropdown.d.ts +70 -21
- package/components/dropdown/dist/index.js +331 -58
- package/components/dropdown/dist/registered.js +331 -58
- package/components/dropdown/dist/styles/default/style-css.d.ts +2 -0
- package/components/dropdown/dist/styles/emphasized/style-css.d.ts +2 -0
- package/components/dropdown/dist/styles/shapeSize-css.d.ts +2 -0
- package/components/dropdown/dist/styles/snowflake/style-css.d.ts +2 -0
- package/components/form/README.md +1 -1
- package/components/form/demo/readme.md +1 -1
- package/components/input/README.md +2 -2
- package/components/input/demo/api.md +76 -64
- package/components/input/demo/api.min.js +747 -295
- package/components/input/demo/index.html +1 -1
- package/components/input/demo/index.md +49 -4
- package/components/input/demo/index.min.js +747 -295
- package/components/input/demo/readme.md +2 -2
- package/components/input/dist/auro-input.d.ts +97 -3
- package/components/input/dist/base-input.d.ts +36 -18
- package/components/input/dist/index.js +681 -229
- package/components/input/dist/registered.js +681 -229
- package/components/input/dist/styles/classic/color-css.d.ts +2 -0
- package/components/input/dist/styles/classic/style-css.d.ts +2 -0
- package/components/input/dist/styles/default/borders-css.d.ts +2 -0
- package/components/input/dist/styles/default/color-css.d.ts +2 -0
- package/components/input/dist/styles/default/input-css.d.ts +2 -0
- package/components/input/dist/styles/default/label-css.d.ts +2 -0
- package/components/input/dist/styles/default/mixins-css.d.ts +2 -0
- package/components/input/dist/styles/default/notificationIcons-css.d.ts +2 -0
- package/components/input/dist/styles/default/style-css.d.ts +2 -0
- package/components/input/dist/styles/emphasized/color-css.d.ts +2 -0
- package/components/input/dist/styles/emphasized/style-css.d.ts +2 -0
- package/components/input/dist/styles/shapeSize-css.d.ts +2 -0
- package/components/input/dist/styles/snowflake/style-css.d.ts +2 -0
- package/components/layoutElement/dist/auroElement.d.ts +34 -0
- package/components/layoutElement/dist/index.d.ts +1 -0
- package/components/layoutElement/dist/index.js +1 -0
- package/components/layoutElement/dist/registered.js +1 -0
- package/components/menu/README.md +1 -1
- package/components/menu/demo/api.min.js +2 -2
- package/components/menu/demo/index.min.js +2 -2
- package/components/menu/demo/readme.md +1 -1
- package/components/menu/dist/iconVersion.d.ts +1 -1
- package/components/menu/dist/index.js +2 -2
- package/components/menu/dist/registered.js +2 -2
- package/components/radio/README.md +1 -1
- package/components/radio/demo/api.md +8 -0
- package/components/radio/demo/api.min.js +13 -5
- package/components/radio/demo/index.min.js +13 -5
- package/components/radio/demo/readme.md +1 -1
- package/components/radio/dist/auro-radio.d.ts +4 -0
- package/components/radio/dist/index.js +13 -5
- package/components/radio/dist/registered.js +13 -5
- package/components/select/README.md +1 -1
- package/components/select/demo/api.html +15 -0
- package/components/select/demo/api.md +178 -0
- package/components/select/demo/api.min.js +403 -62
- package/components/select/demo/index.html +15 -0
- package/components/select/demo/index.md +177 -0
- package/components/select/demo/index.min.js +403 -62
- package/components/select/demo/readme.md +1 -1
- package/components/select/dist/auro-select.d.ts +27 -0
- package/components/select/dist/index.js +400 -58
- package/components/select/dist/registered.js +400 -58
- package/package.json +2 -2
- /package/components/{dropdown/dist/styles/bibColors-css.d.ts → combobox/dist/styles/emphasized/style-css.d.ts} +0 -0
- /package/components/{dropdown/dist/styles/bibStyles-css.d.ts → combobox/dist/styles/snowflake/style-css.d.ts} +0 -0
- /package/components/{input/dist/styles/borders-css.d.ts → dropdown/dist/styles/default/bibColors-css.d.ts} +0 -0
- /package/components/{input/dist/styles/label-css.d.ts → dropdown/dist/styles/default/bibStyles-css.d.ts} +0 -0
- /package/components/{input/dist/styles/notificationIcons-css.d.ts → dropdown/dist/styles/default/color-css.d.ts} +0 -0
|
@@ -37,24 +37,37 @@ const t$2=globalThis,i$5=t$2.trustedTypes,s$3=i$5?i$5.createPolicy("lit-html",{c
|
|
|
37
37
|
*/
|
|
38
38
|
const a$1=Symbol.for(""),o$4=t=>{if(t?.r===a$1)return t?._$litStatic$},s$2=t=>({_$litStatic$:t,r:a$1}),i$4=(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$1}),l$1=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$4(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l$1.get(t))&&(n.raw=n,l$1.set(t,r=n)),e=u;}return t(r,...e)},u$1=n$2(x);
|
|
39
39
|
|
|
40
|
+
/**
|
|
41
|
+
* @license
|
|
42
|
+
* Copyright 2017 Google LLC
|
|
43
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
|
+
*/
|
|
45
|
+
const t$1={ATTRIBUTE:1},e$3=t=>(...e)=>({_$litDirective$:t,values:e});let i$3 = class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};
|
|
46
|
+
|
|
47
|
+
/**
|
|
48
|
+
* @license
|
|
49
|
+
* Copyright 2018 Google LLC
|
|
50
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
51
|
+
*/const e$2=e$3(class extends i$3{constructor(t){if(super(t),t.type!==t$1.ATTRIBUTE||"class"!==t.name||t.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return T}});
|
|
52
|
+
|
|
40
53
|
/**
|
|
41
54
|
* @license
|
|
42
55
|
* Copyright 2019 Google LLC
|
|
43
56
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
57
|
*/
|
|
45
|
-
const t
|
|
58
|
+
const t=globalThis,e$1=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$1=Symbol(),o$3=new WeakMap;let n$1 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$1)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$1&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$3.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$3.set(s,t));}return t}toString(){return this.cssText}};const r$1=t=>new n$1("string"==typeof t?t:t+"",void 0,s$1),i$2=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$1(o,t,s$1)},S=(s,o)=>{if(e$1)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$1=e$1?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$1(e)})(t):t;
|
|
46
59
|
|
|
47
60
|
/**
|
|
48
61
|
* @license
|
|
49
62
|
* Copyright 2017 Google LLC
|
|
50
63
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
51
|
-
*/const{is:i$
|
|
64
|
+
*/const{is:i$1,defineProperty:e,getOwnPropertyDescriptor:h,getOwnPropertyNames:r,getOwnPropertySymbols:o$2,getPrototypeOf:n}=Object,a=globalThis,c=a.trustedTypes,l=c?c.emptyScript:"",p=a.reactiveElementPolyfillSupport,d=(t,s)=>t,u={toAttribute(t,s){switch(s){case Boolean:t=t?l:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f=(t,s)=>!i$1(t,s),b={attribute:true,type:String,converter:u,reflect:false,useDefault:false,hasChanged:f};Symbol.metadata??=Symbol("metadata"),a.litPropertyMetadata??=new WeakMap;class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b}static _$Ei(){if(this.hasOwnProperty(d("elementProperties")))return;const t=n(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d("properties"))){const t=this.properties,s=[...r(t),...o$2(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$1(s));}else void 0!==s&&i.push(c$1(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u).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;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)(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.elementStyles=[],y.shadowRootOptions={mode:"open"},y[d("elementProperties")]=new Map,y[d("finalized")]=new Map,p?.({ReactiveElement:y}),(a.reactiveElementVersions??=[]).push("2.1.0");
|
|
52
65
|
|
|
53
66
|
/**
|
|
54
67
|
* @license
|
|
55
68
|
* Copyright 2017 Google LLC
|
|
56
69
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
57
|
-
*/const s=globalThis;
|
|
70
|
+
*/const s=globalThis;class i extends y{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._$litElement$=true,i["finalized"]=true,s.litElementHydrateSupport?.({LitElement:i});const o$1=s.litElementPolyfillSupport;o$1?.({LitElement:i});(s.litElementVersions??=[]).push("4.2.0");
|
|
58
71
|
|
|
59
72
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
60
73
|
// See LICENSE in the project root for license information.
|
|
@@ -646,16 +659,21 @@ const flip$1 = function (options) {
|
|
|
646
659
|
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
647
660
|
const nextPlacement = placements[nextIndex];
|
|
648
661
|
if (nextPlacement) {
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
662
|
+
var _overflowsData$;
|
|
663
|
+
const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
664
|
+
const hasInitialMainAxisOverflow = ((_overflowsData$ = overflowsData[0]) == null ? void 0 : _overflowsData$.overflows[0]) > 0;
|
|
665
|
+
if (!ignoreCrossAxisOverflow || hasInitialMainAxisOverflow) {
|
|
666
|
+
// Try next placement and re-run the lifecycle.
|
|
667
|
+
return {
|
|
668
|
+
data: {
|
|
669
|
+
index: nextIndex,
|
|
670
|
+
overflows: overflowsData
|
|
671
|
+
},
|
|
672
|
+
reset: {
|
|
673
|
+
placement: nextPlacement
|
|
674
|
+
}
|
|
675
|
+
};
|
|
676
|
+
}
|
|
659
677
|
}
|
|
660
678
|
|
|
661
679
|
// First, find the candidates that fit on the mainAxis side of overflow,
|
|
@@ -1307,6 +1325,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
|
1307
1325
|
scrollTop: 0
|
|
1308
1326
|
};
|
|
1309
1327
|
const offsets = createCoords(0);
|
|
1328
|
+
|
|
1329
|
+
// If the <body> scrollbar appears on the left (e.g. RTL systems). Use
|
|
1330
|
+
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
1331
|
+
function setLeftRTLScrollbarOffset() {
|
|
1332
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
1333
|
+
}
|
|
1310
1334
|
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1311
1335
|
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1312
1336
|
scroll = getNodeScroll(offsetParent);
|
|
@@ -1316,11 +1340,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
|
1316
1340
|
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1317
1341
|
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1318
1342
|
} else if (documentElement) {
|
|
1319
|
-
|
|
1320
|
-
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
1321
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
1343
|
+
setLeftRTLScrollbarOffset();
|
|
1322
1344
|
}
|
|
1323
1345
|
}
|
|
1346
|
+
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
1347
|
+
setLeftRTLScrollbarOffset();
|
|
1348
|
+
}
|
|
1324
1349
|
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1325
1350
|
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
1326
1351
|
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
@@ -1497,7 +1522,7 @@ function observeMove(element, onMove) {
|
|
|
1497
1522
|
// Handle <iframe>s
|
|
1498
1523
|
root: root.ownerDocument
|
|
1499
1524
|
});
|
|
1500
|
-
} catch (
|
|
1525
|
+
} catch (_e) {
|
|
1501
1526
|
io = new IntersectionObserver(handleObserve, options);
|
|
1502
1527
|
}
|
|
1503
1528
|
io.observe(element);
|
|
@@ -2300,19 +2325,6 @@ class AuroDependencyVersioning {
|
|
|
2300
2325
|
}
|
|
2301
2326
|
}
|
|
2302
2327
|
|
|
2303
|
-
/**
|
|
2304
|
-
* @license
|
|
2305
|
-
* Copyright 2017 Google LLC
|
|
2306
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
2307
|
-
*/
|
|
2308
|
-
const t={ATTRIBUTE:1},e$1=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)}}
|
|
2309
|
-
|
|
2310
|
-
/**
|
|
2311
|
-
* @license
|
|
2312
|
-
* Copyright 2018 Google LLC
|
|
2313
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
2314
|
-
*/const e=e$1(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}});
|
|
2315
|
-
|
|
2316
2328
|
/**
|
|
2317
2329
|
* @license
|
|
2318
2330
|
* Copyright 2018 Google LLC
|
|
@@ -2329,7 +2341,7 @@ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{cons
|
|
|
2329
2341
|
* @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
|
|
2330
2342
|
*/
|
|
2331
2343
|
|
|
2332
|
-
class AuroElement extends i
|
|
2344
|
+
let AuroElement$1 = class AuroElement extends i {
|
|
2333
2345
|
|
|
2334
2346
|
// function to define props used within the scope of this component
|
|
2335
2347
|
static get properties() {
|
|
@@ -2353,7 +2365,7 @@ class AuroElement extends i$1 {
|
|
|
2353
2365
|
|
|
2354
2366
|
return 'false'
|
|
2355
2367
|
}
|
|
2356
|
-
}
|
|
2368
|
+
};
|
|
2357
2369
|
|
|
2358
2370
|
var error = {"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>"};
|
|
2359
2371
|
|
|
@@ -2385,7 +2397,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
2385
2397
|
return _fetchMap.get(uri);
|
|
2386
2398
|
};
|
|
2387
2399
|
|
|
2388
|
-
var styleCss$3 = i$
|
|
2400
|
+
var styleCss$3 = i$2`: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}`;
|
|
2389
2401
|
|
|
2390
2402
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2391
2403
|
// See LICENSE in the project root for license information.
|
|
@@ -2397,7 +2409,7 @@ var styleCss$3 = i$3`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
2397
2409
|
*/
|
|
2398
2410
|
|
|
2399
2411
|
// build the component class
|
|
2400
|
-
class BaseIcon extends AuroElement {
|
|
2412
|
+
class BaseIcon extends AuroElement$1 {
|
|
2401
2413
|
constructor() {
|
|
2402
2414
|
super();
|
|
2403
2415
|
this.onDark = false;
|
|
@@ -2427,7 +2439,7 @@ class BaseIcon extends AuroElement {
|
|
|
2427
2439
|
}
|
|
2428
2440
|
|
|
2429
2441
|
static get styles() {
|
|
2430
|
-
return i$
|
|
2442
|
+
return i$2`
|
|
2431
2443
|
${styleCss$3}
|
|
2432
2444
|
`;
|
|
2433
2445
|
}
|
|
@@ -2469,9 +2481,9 @@ class BaseIcon extends AuroElement {
|
|
|
2469
2481
|
}
|
|
2470
2482
|
}
|
|
2471
2483
|
|
|
2472
|
-
var tokensCss$2 = i$
|
|
2484
|
+
var tokensCss$2 = i$2`: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)}`;
|
|
2473
2485
|
|
|
2474
|
-
var colorCss$3 = i$
|
|
2486
|
+
var colorCss$3 = i$2`: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)}`;
|
|
2475
2487
|
|
|
2476
2488
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2477
2489
|
// See LICENSE in the project root for license information.
|
|
@@ -2559,9 +2571,9 @@ class AuroIcon extends BaseIcon {
|
|
|
2559
2571
|
static get styles() {
|
|
2560
2572
|
return [
|
|
2561
2573
|
super.styles,
|
|
2562
|
-
i$
|
|
2563
|
-
i$
|
|
2564
|
-
i$
|
|
2574
|
+
i$2`${tokensCss$2}`,
|
|
2575
|
+
i$2`${styleCss$3}`,
|
|
2576
|
+
i$2`${colorCss$3}`
|
|
2565
2577
|
];
|
|
2566
2578
|
}
|
|
2567
2579
|
|
|
@@ -2620,7 +2632,7 @@ class AuroIcon extends BaseIcon {
|
|
|
2620
2632
|
return x`
|
|
2621
2633
|
<div class="componentWrapper">
|
|
2622
2634
|
<div
|
|
2623
|
-
class="${e(svgClasses)}"
|
|
2635
|
+
class="${e$2(svgClasses)}"
|
|
2624
2636
|
title="${o(this.title || undefined)}">
|
|
2625
2637
|
<span aria-hidden="${o(this.ariaHidden || true)}" part="svg">
|
|
2626
2638
|
${this.customSvg ? x`
|
|
@@ -2632,7 +2644,7 @@ class AuroIcon extends BaseIcon {
|
|
|
2632
2644
|
</span>
|
|
2633
2645
|
</div>
|
|
2634
2646
|
|
|
2635
|
-
<div class="${e(labelClasses)}">
|
|
2647
|
+
<div class="${e$2(labelClasses)}">
|
|
2636
2648
|
<slot></slot>
|
|
2637
2649
|
</div>
|
|
2638
2650
|
</div>
|
|
@@ -2642,11 +2654,11 @@ class AuroIcon extends BaseIcon {
|
|
|
2642
2654
|
|
|
2643
2655
|
var iconVersion = '6.1.2';
|
|
2644
2656
|
|
|
2645
|
-
var styleCss$2 = i$
|
|
2657
|
+
var styleCss$2 = i$2`:host{position:absolute;z-index:var(--depth-tooltip, 400);display:none}.container{display:inline-block;overflow:auto;box-sizing:border-box;margin:var(--ds-size-50, 0.25rem) 0}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}`;
|
|
2646
2658
|
|
|
2647
|
-
var colorCss$2 = i$
|
|
2659
|
+
var colorCss$2 = i$2`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
2648
2660
|
|
|
2649
|
-
var tokensCss$1 = i$
|
|
2661
|
+
var tokensCss$1 = i$2`:host(:not([ondark])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
2650
2662
|
|
|
2651
2663
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2652
2664
|
// See LICENSE in the project root for license information.
|
|
@@ -2667,7 +2679,7 @@ const DESIGN_TOKEN_BREAKPOINT_OPTIONS = [
|
|
|
2667
2679
|
* @csspart bibContainer - Apply css to the bib container.
|
|
2668
2680
|
*/
|
|
2669
2681
|
|
|
2670
|
-
class AuroDropdownBib extends i
|
|
2682
|
+
class AuroDropdownBib extends i {
|
|
2671
2683
|
|
|
2672
2684
|
constructor() {
|
|
2673
2685
|
super();
|
|
@@ -2769,15 +2781,21 @@ class AuroDropdownBib extends i$1 {
|
|
|
2769
2781
|
|
|
2770
2782
|
var dropdownVersion = '3.0.0';
|
|
2771
2783
|
|
|
2772
|
-
var
|
|
2784
|
+
var shapeSizeCss = i$2`.shape-snowflake-xl,.shape-snowflake-lg,.shape-snowflake-md,.shape-snowflake-sm,.shape-snowflake-xs{min-height:56px;max-height:56px;border-style:solid;border-width:2px;border-color:transparent;border-radius:30px}.shape-snowflake-xl.simple,.shape-snowflake-lg.simple,.shape-snowflake-md.simple,.shape-snowflake-sm.simple,.shape-snowflake-xs.simple{border-width:0;min-height:60px;max-height:60px;background-color:unset}.shape-box-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent}.shape-box-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-rounded-lg{min-height:52px;max-height:52px;border-style:solid;border-width:2px;border-color:transparent;border-radius:6px}.shape-rounded-lg.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px}.shape-pill-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-left-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px 0 0 34px}.shape-pill-left-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-right-xl{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 34px 34px 0}.shape-pill-right-xl.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-md{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px}.shape-pill-md.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-left-md{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:34px 0 0 34px}.shape-pill-left-md.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}.shape-pill-right-md{min-height:68px;max-height:68px;border-style:solid;border-width:2px;border-color:transparent;border-radius:0 34px 34px 0}.shape-pill-right-md.simple{border-width:0;min-height:72px;max-height:72px;background-color:unset}`;
|
|
2785
|
+
|
|
2786
|
+
var styleCss$1 = i$2`:host([layout*=classic]){position:relative;display:inline-block;max-width:100%}:host([layout*=classic]) #bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}:host([layout*=classic]) .label{font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem);transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}:host([layout*=classic]) .label[hasTrigger=false]{font-size:var(--ds-text-body-size-default, 1rem)}:host([layout*=classic]) .trigger{position:relative;display:flex;align-items:center}:host([layout*=classic]) .trigger[showBorder]{border-width:1px;border-style:solid;cursor:pointer;outline-style:solid;outline-width:1px}@media(hover: hover){:host([layout*=classic]) .trigger:hover{cursor:pointer}}:host([layout*=classic]) .triggerContentWrapper{overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) #showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;margin-left:var(--ds-size-100, 0.5rem)}:host([layout*=classic]) #showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);line-height:var(--ds-size-300, 1.5rem)}:host([layout*=classic]) #showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}:host([layout*=classic][fluid]){display:block}:host([layout*=classic][matchwidth]) #bibSizer{width:100%}:host([layout*=classic][disabled]){pointer-events:none}:host([layout*=classic][inset]) .trigger{padding:var(--ds-size-150, 0.75rem) var(--ds-size-200, 1rem)}:host([layout*=classic][common]) .trigger,:host([layout*=classic][inset][bordered]) .trigger{padding:var(--ds-size-200, 1rem) var(--ds-size-150, 0.75rem)}:host([layout*=classic][inset][bordered][labeled]) .trigger{padding:var(--ds-size-100, 0.5rem) var(--ds-size-150, 0.75rem)}:host([layout*=classic][common]) .trigger,:host([layout*=classic][rounded]) .trigger{border-radius:var(--ds-border-radius, 0.375rem)}`;
|
|
2787
|
+
|
|
2788
|
+
var colorCss$1 = i$2`:host .wrapper{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-background-color);color:var(--ds-auro-dropdown-trigger-text-color)}:host(:not([ondark])) .wrapper:focus,:host(:not([ondark])) .wrapper:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-brand, #00274a)}:host([ondark]) .wrapper:focus,:host([ondark]) .wrapper:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host([error]:not([ondark])){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([error][ondark]){--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helpText{color:var(--ds-auro-dropdown-helptext-text-color)}`;
|
|
2773
2789
|
|
|
2774
|
-
var
|
|
2790
|
+
var styleEmphasizedCss = i$2`:host{display:block}.wrapper{display:flex;flex-direction:column}.trigger{flex:1;display:flex;align-items:center;justify-content:center;outline:none}.triggerContentWrapper{flex:1;display:flex;align-items:center;justify-content:center;width:100%}.triggerContent{overflow:hidden;flex:1;display:flex;align-items:center;justify-content:center;text-overflow:ellipsis;white-space:nowrap;width:100%}:host([layout*=emphasized][shape*=pill]:not([layout*=right])) .leftIndent{margin-left:24px;width:calc(100% - 24px)}:host([layout*=emphasized][shape*=pill]:not([layout*=left])) .rightIndent{margin-right:24px;width:calc(100% - 24px)}:host([layout*=emphasized][shape*=pill]:not([layout*=left]):not([layout*=right])) .rightIndent{margin-right:24px;width:calc(100% - 48px)}`;
|
|
2775
2791
|
|
|
2776
|
-
var
|
|
2792
|
+
var styleSnowflakeCss = i$2`:host{display:block}.wrapper{display:flex;flex-direction:column}.trigger{flex:1;display:flex;align-items:center;justify-content:center;outline:none}.triggerContentWrapper{flex:1;display:flex;align-items:center;justify-content:center;width:100%}.triggerContent{overflow:hidden;flex:1;display:flex;align-items:center;justify-content:center;text-overflow:ellipsis;white-space:nowrap;width:100%}:host([layout*=snowflake]) .leftIndent{margin-left:24px;width:calc(100% - 48px)}:host([layout*=snowflake]) .rightIndent{margin-right:24px;width:calc(100% - 48px)}`;
|
|
2777
2793
|
|
|
2778
|
-
var
|
|
2794
|
+
var colorCss = i$2`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
2779
2795
|
|
|
2780
|
-
var
|
|
2796
|
+
var styleCss = i$2`.helptext-wrapper{display:none;font-size:var(--ds-basic-text-body-xs-font-size, 12px);font-weight:var(--ds-basic-text-body-xs-font-weight, 450);letter-spacing:var(--ds-basic-text-body-xs-letter-spacing, 0);line-height:var(--ds-basic-text-body-xs-line-height, 16px)}:host([large]) .helptext-wrapper{font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, 450);letter-spacing:var(--ds-basic-text-body-default-letter-spacing, 0);line-height:var(--ds-basic-text-body-default-line-height, 24px)}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
2797
|
+
|
|
2798
|
+
var tokensCss = i$2`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
2781
2799
|
|
|
2782
2800
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
2783
2801
|
// See LICENSE in the project root for license information.
|
|
@@ -2858,7 +2876,7 @@ class AuroLibraryRuntimeUtils {
|
|
|
2858
2876
|
*
|
|
2859
2877
|
* @attr { Boolean } large - If declared, make font-size to 1rem(16px).
|
|
2860
2878
|
*/
|
|
2861
|
-
class AuroHelpText extends i
|
|
2879
|
+
class AuroHelpText extends i {
|
|
2862
2880
|
|
|
2863
2881
|
constructor() {
|
|
2864
2882
|
super();
|
|
@@ -2981,6 +2999,98 @@ class AuroHelpText extends i$1 {
|
|
|
2981
2999
|
|
|
2982
3000
|
var helpTextVersion = '1.0.0';
|
|
2983
3001
|
|
|
3002
|
+
class AuroElement extends i {
|
|
3003
|
+
static get properties() {
|
|
3004
|
+
return {
|
|
3005
|
+
|
|
3006
|
+
/**
|
|
3007
|
+
* Defines the language of an element.
|
|
3008
|
+
* @default {'default'}
|
|
3009
|
+
*/
|
|
3010
|
+
layout: {
|
|
3011
|
+
type: String,
|
|
3012
|
+
attribute: "layout",
|
|
3013
|
+
reflect: true
|
|
3014
|
+
},
|
|
3015
|
+
|
|
3016
|
+
shape: {
|
|
3017
|
+
type: String,
|
|
3018
|
+
attribute: "shape",
|
|
3019
|
+
reflect: true
|
|
3020
|
+
},
|
|
3021
|
+
|
|
3022
|
+
size: {
|
|
3023
|
+
type: String,
|
|
3024
|
+
attribute: "size",
|
|
3025
|
+
reflect: true
|
|
3026
|
+
},
|
|
3027
|
+
|
|
3028
|
+
onDark: {
|
|
3029
|
+
type: Boolean,
|
|
3030
|
+
attribute: "ondark",
|
|
3031
|
+
reflect: true
|
|
3032
|
+
}
|
|
3033
|
+
};
|
|
3034
|
+
}
|
|
3035
|
+
|
|
3036
|
+
resetShapeClasses() {
|
|
3037
|
+
if (this.shape && this.size) {
|
|
3038
|
+
const wrapper = this.shadowRoot.querySelector('.wrapper');
|
|
3039
|
+
|
|
3040
|
+
if (wrapper) {
|
|
3041
|
+
wrapper.classList.forEach((className) => {
|
|
3042
|
+
if (className.startsWith('shape-')) {
|
|
3043
|
+
wrapper.classList.remove(className);
|
|
3044
|
+
}
|
|
3045
|
+
});
|
|
3046
|
+
|
|
3047
|
+
wrapper.classList.add(`shape-${this.shape.toLowerCase()}-${this.size.toLowerCase()}`);
|
|
3048
|
+
}
|
|
3049
|
+
}
|
|
3050
|
+
}
|
|
3051
|
+
|
|
3052
|
+
resetLayoutClasses() {
|
|
3053
|
+
if (this.layout) {
|
|
3054
|
+
const wrapper = this.shadowRoot.querySelector('.wrapper');
|
|
3055
|
+
|
|
3056
|
+
if (wrapper) {
|
|
3057
|
+
wrapper.classList.forEach((className) => {
|
|
3058
|
+
if (className.startsWith('layout-')) {
|
|
3059
|
+
wrapper.classList.remove(className);
|
|
3060
|
+
}
|
|
3061
|
+
});
|
|
3062
|
+
|
|
3063
|
+
wrapper.classList.add(`layout-${this.layout.toLowerCase()}`);
|
|
3064
|
+
}
|
|
3065
|
+
}
|
|
3066
|
+
}
|
|
3067
|
+
|
|
3068
|
+
updateComponentArchitecture() {
|
|
3069
|
+
this.resetLayoutClasses();
|
|
3070
|
+
this.resetShapeClasses();
|
|
3071
|
+
}
|
|
3072
|
+
|
|
3073
|
+
updated(changedProperties) {
|
|
3074
|
+
if (changedProperties.has('layout') || changedProperties.has('shape') || changedProperties.has('size')) {
|
|
3075
|
+
this.updateComponentArchitecture();
|
|
3076
|
+
}
|
|
3077
|
+
}
|
|
3078
|
+
|
|
3079
|
+
// Try to render the defined `this.layout` layout. If that fails, fall back to the default layout.
|
|
3080
|
+
// This will catch if an invalid layout value is passed in and render the default layout if so.
|
|
3081
|
+
render() {
|
|
3082
|
+
try {
|
|
3083
|
+
return this.renderLayout();
|
|
3084
|
+
} catch (error) {
|
|
3085
|
+
// failed to get the defined layout
|
|
3086
|
+
console.error('Failed to get the defined layout - using the default layout', error); // eslint-disable-line no-console
|
|
3087
|
+
|
|
3088
|
+
// fallback to the default layout
|
|
3089
|
+
return this.getLayout('default');
|
|
3090
|
+
}
|
|
3091
|
+
}
|
|
3092
|
+
}
|
|
3093
|
+
|
|
2984
3094
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2985
3095
|
// See LICENSE in the project root for license information.
|
|
2986
3096
|
|
|
@@ -2998,7 +3108,7 @@ var helpTextVersion = '1.0.0';
|
|
|
2998
3108
|
* @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
|
|
2999
3109
|
* @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
|
|
3000
3110
|
*/
|
|
3001
|
-
class AuroDropdown extends
|
|
3111
|
+
class AuroDropdown extends AuroElement {
|
|
3002
3112
|
constructor() {
|
|
3003
3113
|
super();
|
|
3004
3114
|
|
|
@@ -3007,26 +3117,29 @@ class AuroDropdown extends i$1 {
|
|
|
3007
3117
|
this.matchWidth = false;
|
|
3008
3118
|
this.noHideOnThisFocusLoss = false;
|
|
3009
3119
|
|
|
3120
|
+
this.errorMessage = ''; // TODO!
|
|
3121
|
+
|
|
3122
|
+
// Layout Config
|
|
3123
|
+
this.layout = 'default';
|
|
3124
|
+
this.shape = 'rounded';
|
|
3125
|
+
this.size = 'xl';
|
|
3126
|
+
|
|
3010
3127
|
this.privateDefaults();
|
|
3128
|
+
}
|
|
3011
3129
|
|
|
3012
|
-
|
|
3013
|
-
|
|
3014
|
-
|
|
3015
|
-
*/
|
|
3016
|
-
this.constructor.shadowRootOptions = {
|
|
3017
|
-
...i$1.shadowRootOptions,
|
|
3018
|
-
delegatesFocus: true,
|
|
3130
|
+
get commonLabelClasses() {
|
|
3131
|
+
return {
|
|
3132
|
+
// 'withValue': this.value && this.value.length > 0
|
|
3019
3133
|
};
|
|
3134
|
+
}
|
|
3020
3135
|
|
|
3021
|
-
|
|
3022
|
-
|
|
3023
|
-
|
|
3024
|
-
|
|
3025
|
-
|
|
3026
|
-
|
|
3027
|
-
|
|
3028
|
-
*/
|
|
3029
|
-
this.showTriggerBorders = true;
|
|
3136
|
+
get commonWrapperClasses() {
|
|
3137
|
+
return {
|
|
3138
|
+
'trigger': true,
|
|
3139
|
+
'wrapper': true,
|
|
3140
|
+
'hasFocus': this.hasFocus,
|
|
3141
|
+
'simple': this.simple
|
|
3142
|
+
};
|
|
3030
3143
|
}
|
|
3031
3144
|
|
|
3032
3145
|
/**
|
|
@@ -3034,7 +3147,6 @@ class AuroDropdown extends i$1 {
|
|
|
3034
3147
|
* @returns {void} Internal defaults.
|
|
3035
3148
|
*/
|
|
3036
3149
|
privateDefaults() {
|
|
3037
|
-
this.bordered = false;
|
|
3038
3150
|
this.chevron = false;
|
|
3039
3151
|
this.disabled = false;
|
|
3040
3152
|
this.error = false;
|
|
@@ -3044,8 +3156,11 @@ class AuroDropdown extends i$1 {
|
|
|
3044
3156
|
this.noToggle = false;
|
|
3045
3157
|
this.a11yAutocomplete = 'none';
|
|
3046
3158
|
this.labeled = true;
|
|
3047
|
-
this.a11yRole = '
|
|
3159
|
+
this.a11yRole = 'button';
|
|
3048
3160
|
this.onDark = false;
|
|
3161
|
+
this.showTriggerBorders = true;
|
|
3162
|
+
this.triggerContentFocusable = false;
|
|
3163
|
+
this.simple = false;
|
|
3049
3164
|
|
|
3050
3165
|
// floaterConfig
|
|
3051
3166
|
this.placement = 'bottom-start';
|
|
@@ -3053,6 +3168,15 @@ class AuroDropdown extends i$1 {
|
|
|
3053
3168
|
this.noFlip = false;
|
|
3054
3169
|
this.autoPlacement = false;
|
|
3055
3170
|
|
|
3171
|
+
/**
|
|
3172
|
+
* @private
|
|
3173
|
+
* @property {boolean} delegatesFocus - Whether the shadow root delegates focus.
|
|
3174
|
+
*/
|
|
3175
|
+
this.constructor.shadowRootOptions = {
|
|
3176
|
+
...i.shadowRootOptions,
|
|
3177
|
+
delegatesFocus: true,
|
|
3178
|
+
};
|
|
3179
|
+
|
|
3056
3180
|
/**
|
|
3057
3181
|
* @private
|
|
3058
3182
|
*/
|
|
@@ -3143,7 +3267,7 @@ class AuroDropdown extends i$1 {
|
|
|
3143
3267
|
/**
|
|
3144
3268
|
* If declared, applies a border around the trigger slot.
|
|
3145
3269
|
*/
|
|
3146
|
-
|
|
3270
|
+
simple: {
|
|
3147
3271
|
type: Boolean,
|
|
3148
3272
|
reflect: true
|
|
3149
3273
|
},
|
|
@@ -3191,13 +3315,20 @@ class AuroDropdown extends i$1 {
|
|
|
3191
3315
|
},
|
|
3192
3316
|
|
|
3193
3317
|
/**
|
|
3194
|
-
* If declared in combination with `
|
|
3318
|
+
* If declared in combination with not using the `simple` property or `helpText` slot content, will apply red color to both.
|
|
3195
3319
|
*/
|
|
3196
3320
|
error: {
|
|
3197
3321
|
type: Boolean,
|
|
3198
3322
|
reflect: true
|
|
3199
3323
|
},
|
|
3200
3324
|
|
|
3325
|
+
/**
|
|
3326
|
+
* Contains the help text message for the current validity error.
|
|
3327
|
+
*/
|
|
3328
|
+
errorMessage: {
|
|
3329
|
+
type: String
|
|
3330
|
+
},
|
|
3331
|
+
|
|
3201
3332
|
/**
|
|
3202
3333
|
* If declared, the bib will display when focus is applied to the trigger.
|
|
3203
3334
|
*/
|
|
@@ -3332,11 +3463,6 @@ class AuroDropdown extends i$1 {
|
|
|
3332
3463
|
|
|
3333
3464
|
/**
|
|
3334
3465
|
* Position where the bib should appear relative to the trigger.
|
|
3335
|
-
* Accepted values:
|
|
3336
|
-
* "top" | "right" | "bottom" | "left" |
|
|
3337
|
-
* "bottom-start" | "top-start" | "top-end" |
|
|
3338
|
-
* "right-start" | "right-end" | "bottom-end" |
|
|
3339
|
-
* "left-start" | "left-end"
|
|
3340
3466
|
* @default bottom-start
|
|
3341
3467
|
*/
|
|
3342
3468
|
placement: {
|
|
@@ -3382,7 +3508,10 @@ class AuroDropdown extends i$1 {
|
|
|
3382
3508
|
return [
|
|
3383
3509
|
colorCss$1,
|
|
3384
3510
|
styleCss$1,
|
|
3385
|
-
tokensCss$1
|
|
3511
|
+
tokensCss$1,
|
|
3512
|
+
styleEmphasizedCss,
|
|
3513
|
+
styleSnowflakeCss,
|
|
3514
|
+
shapeSizeCss
|
|
3386
3515
|
];
|
|
3387
3516
|
}
|
|
3388
3517
|
|
|
@@ -3418,6 +3547,7 @@ class AuroDropdown extends i$1 {
|
|
|
3418
3547
|
}
|
|
3419
3548
|
|
|
3420
3549
|
updated(changedProperties) {
|
|
3550
|
+
super.updated(changedProperties);
|
|
3421
3551
|
this.floater.handleUpdate(changedProperties);
|
|
3422
3552
|
|
|
3423
3553
|
// Note: `disabled` is not a breakpoint (it is not a screen size),
|
|
@@ -3427,7 +3557,7 @@ class AuroDropdown extends i$1 {
|
|
|
3427
3557
|
}
|
|
3428
3558
|
|
|
3429
3559
|
// when trigger's content is changed without any attribute or node change,
|
|
3430
|
-
// `requestUpdate` needs to be called to update
|
|
3560
|
+
// `requestUpdate` needs to be called to update hasTriggerContent
|
|
3431
3561
|
if (changedProperties.size === 0 || changedProperties.has('isPopoverVisible')) {
|
|
3432
3562
|
this.handleTriggerContentSlotChange();
|
|
3433
3563
|
}
|
|
@@ -3488,6 +3618,24 @@ class AuroDropdown extends i$1 {
|
|
|
3488
3618
|
return inCustomSlot;
|
|
3489
3619
|
}
|
|
3490
3620
|
|
|
3621
|
+
/**
|
|
3622
|
+
* Function to support @focusin event.
|
|
3623
|
+
* @private
|
|
3624
|
+
* @return {void}
|
|
3625
|
+
*/
|
|
3626
|
+
handleFocusin() {
|
|
3627
|
+
this.hasFocus = true;
|
|
3628
|
+
}
|
|
3629
|
+
|
|
3630
|
+
/**
|
|
3631
|
+
* Function to support @focusout event.
|
|
3632
|
+
* @private
|
|
3633
|
+
* @return {void}
|
|
3634
|
+
*/
|
|
3635
|
+
handleFocusout() {
|
|
3636
|
+
this.hasFocus = false;
|
|
3637
|
+
}
|
|
3638
|
+
|
|
3491
3639
|
/**
|
|
3492
3640
|
* Determines if the element or any children are focusable.
|
|
3493
3641
|
* @private
|
|
@@ -3547,8 +3695,8 @@ class AuroDropdown extends i$1 {
|
|
|
3547
3695
|
}
|
|
3548
3696
|
|
|
3549
3697
|
/**
|
|
3550
|
-
* @private
|
|
3551
3698
|
* Creates and dispatches a duplicate focus event on the trigger element.
|
|
3699
|
+
* @private
|
|
3552
3700
|
* @param {Event} event - The original focus event.
|
|
3553
3701
|
*/
|
|
3554
3702
|
bindFocusEventToTrigger(event) {
|
|
@@ -3561,9 +3709,9 @@ class AuroDropdown extends i$1 {
|
|
|
3561
3709
|
}
|
|
3562
3710
|
|
|
3563
3711
|
/**
|
|
3564
|
-
* @private
|
|
3565
3712
|
* Sets up event listeners to deliver focus and blur events from nested Auro components within the trigger slot to trigger.
|
|
3566
3713
|
* This ensures that focus/blur events originating from within these components are propagated to the trigger element itself.
|
|
3714
|
+
* @private
|
|
3567
3715
|
*/
|
|
3568
3716
|
setupTriggerFocusEventBinding() {
|
|
3569
3717
|
if (!this.triggerContentSlot || this.triggerContentSlot.length === 0) {
|
|
@@ -3657,7 +3805,7 @@ class AuroDropdown extends i$1 {
|
|
|
3657
3805
|
// If there are children
|
|
3658
3806
|
if (triggerContentNodes) {
|
|
3659
3807
|
|
|
3660
|
-
// See if any of them are focusable
|
|
3808
|
+
// See if any of them are focusable elements
|
|
3661
3809
|
this.triggerContentFocusable = triggerContentNodes.some((node) => this.containsFocusableElement(node));
|
|
3662
3810
|
|
|
3663
3811
|
// If any of them are focusable elements
|
|
@@ -3743,8 +3891,75 @@ class AuroDropdown extends i$1 {
|
|
|
3743
3891
|
this.labeled = nodesArr.length > 0;
|
|
3744
3892
|
}
|
|
3745
3893
|
|
|
3746
|
-
|
|
3747
|
-
|
|
3894
|
+
/**
|
|
3895
|
+
* Returns HTML for the common portion of the layouts.
|
|
3896
|
+
* @private
|
|
3897
|
+
* @param {Object} helpTextClasses - Classes to apply to the help text container.
|
|
3898
|
+
* @returns {html} - Returns HTML.
|
|
3899
|
+
*/
|
|
3900
|
+
renderBasicHtml(helpTextClasses) {
|
|
3901
|
+
return u$1`
|
|
3902
|
+
<div>
|
|
3903
|
+
<div
|
|
3904
|
+
id="trigger"
|
|
3905
|
+
class="${e$2(this.commonWrapperClasses)}" part="wrapper"
|
|
3906
|
+
tabindex="${this.tabIndex}"
|
|
3907
|
+
?showBorder="${this.showTriggerBorders}"
|
|
3908
|
+
role="${o(this.triggerContentFocusable ? undefined : this.a11yRole)}"
|
|
3909
|
+
aria-expanded="${o(this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
|
|
3910
|
+
aria-controls="${o(this.triggerContentFocusable ? undefined : this.dropdownId)}"
|
|
3911
|
+
aria-labelledby="${o(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
|
|
3912
|
+
@focusin="${this.handleFocusin}"
|
|
3913
|
+
@blur="${this.handleFocusOut}">
|
|
3914
|
+
<div class="triggerContentWrapper">
|
|
3915
|
+
<label class="label" id="triggerLabel" hasTrigger=${this.hasTriggerContent}>
|
|
3916
|
+
<slot name="label" @slotchange="${this.handleLabelSlotChange}"></slot>
|
|
3917
|
+
</label>
|
|
3918
|
+
<div class="triggerContent">
|
|
3919
|
+
<slot
|
|
3920
|
+
name="trigger"
|
|
3921
|
+
@slotchange="${this.handleTriggerContentSlotChange}"></slot>
|
|
3922
|
+
</div>
|
|
3923
|
+
</div>
|
|
3924
|
+
${this.chevron || this.common ? u$1`
|
|
3925
|
+
<div
|
|
3926
|
+
id="showStateIcon"
|
|
3927
|
+
part="chevron">
|
|
3928
|
+
<${this.iconTag}
|
|
3929
|
+
category="interface"
|
|
3930
|
+
name="chevron-down"
|
|
3931
|
+
?onDark="${this.onDark}"
|
|
3932
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
3933
|
+
>
|
|
3934
|
+
</${this.iconTag}>
|
|
3935
|
+
</div>
|
|
3936
|
+
` : undefined }
|
|
3937
|
+
</div>
|
|
3938
|
+
<div class="${e$2(helpTextClasses)}">
|
|
3939
|
+
<slot name="helpText"></slot>
|
|
3940
|
+
</div>
|
|
3941
|
+
<div class="slotContent">
|
|
3942
|
+
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
3943
|
+
</div>
|
|
3944
|
+
<div id="bibSizer" part="size"></div>
|
|
3945
|
+
<${this.dropdownBibTag}
|
|
3946
|
+
id="bib"
|
|
3947
|
+
?data-show="${this.isPopoverVisible}"
|
|
3948
|
+
?isfullscreen="${this.isBibFullscreen}"
|
|
3949
|
+
?common="${this.common}"
|
|
3950
|
+
?rounded="${this.common || this.rounded}"
|
|
3951
|
+
?inset="${this.common || this.inset}">
|
|
3952
|
+
</${this.dropdownBibTag}>
|
|
3953
|
+
</div>
|
|
3954
|
+
`;
|
|
3955
|
+
}
|
|
3956
|
+
|
|
3957
|
+
/**
|
|
3958
|
+
* Returns HTML for the classic layout. Does not support type="*".
|
|
3959
|
+
* @private
|
|
3960
|
+
* @returns {html} - Returns HTML for the classic layout.
|
|
3961
|
+
*/
|
|
3962
|
+
renderLayoutClassic() {
|
|
3748
3963
|
return u$1`
|
|
3749
3964
|
<div>
|
|
3750
3965
|
<div
|
|
@@ -3782,9 +3997,6 @@ class AuroDropdown extends i$1 {
|
|
|
3782
3997
|
</div>
|
|
3783
3998
|
` : undefined }
|
|
3784
3999
|
</div>
|
|
3785
|
-
<${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
|
|
3786
|
-
<slot name="helpText"></slot>
|
|
3787
|
-
</${this.helpTextTag}>
|
|
3788
4000
|
<div class="slotContent">
|
|
3789
4001
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
3790
4002
|
</div>
|
|
@@ -3801,6 +4013,67 @@ class AuroDropdown extends i$1 {
|
|
|
3801
4013
|
</div>
|
|
3802
4014
|
`;
|
|
3803
4015
|
}
|
|
4016
|
+
|
|
4017
|
+
/**
|
|
4018
|
+
* Returns HTML for the snowflake layout. Does not support type="*".
|
|
4019
|
+
* @private
|
|
4020
|
+
* @returns {html} - Returns HTML for the snowflake layout.
|
|
4021
|
+
*/
|
|
4022
|
+
renderLayoutSnowflake() {
|
|
4023
|
+
const helpTextClasses = {
|
|
4024
|
+
'helpText': true,
|
|
4025
|
+
'leftIndent': true,
|
|
4026
|
+
'rightIndent': true
|
|
4027
|
+
};
|
|
4028
|
+
|
|
4029
|
+
return u$1`
|
|
4030
|
+
${this.renderBasicHtml(helpTextClasses)}
|
|
4031
|
+
`;
|
|
4032
|
+
}
|
|
4033
|
+
|
|
4034
|
+
/**
|
|
4035
|
+
* Returns HTML for the emphasized layout. Does not support type="*".
|
|
4036
|
+
* @private
|
|
4037
|
+
* @returns {html} - Returns HTML for the emphasized layout.
|
|
4038
|
+
*/
|
|
4039
|
+
renderLayoutEmphasized() {
|
|
4040
|
+
const helpTextClasses = {
|
|
4041
|
+
'helpText': true,
|
|
4042
|
+
'leftIndent': this.shape.toLowerCase().includes('pill') && !this.shape.toLowerCase().includes('right'),
|
|
4043
|
+
'rightIndent': this.shape.toLowerCase().includes('pill') && !this.shape.toLowerCase().includes('left')
|
|
4044
|
+
};
|
|
4045
|
+
|
|
4046
|
+
return u$1`
|
|
4047
|
+
${this.renderBasicHtml(helpTextClasses)}
|
|
4048
|
+
`;
|
|
4049
|
+
}
|
|
4050
|
+
|
|
4051
|
+
/**
|
|
4052
|
+
* Logic to determine the layout of the component.
|
|
4053
|
+
* @private
|
|
4054
|
+
* @param {string} [ForcedLayout] - Used to force a specific layout, pass in the layout name to use.
|
|
4055
|
+
* @returns {HTMLCollection} - Returns the HTML for the layout.
|
|
4056
|
+
*/
|
|
4057
|
+
renderLayout(ForcedLayout) {
|
|
4058
|
+
const layout = ForcedLayout || this.layout;
|
|
4059
|
+
|
|
4060
|
+
switch (layout) {
|
|
4061
|
+
case 'emphasized':
|
|
4062
|
+
return this.renderLayoutEmphasized();
|
|
4063
|
+
case 'emphasized-left':
|
|
4064
|
+
return this.renderLayoutEmphasized();
|
|
4065
|
+
case 'emphasized-right':
|
|
4066
|
+
return this.renderLayoutEmphasized();
|
|
4067
|
+
case 'snowflake':
|
|
4068
|
+
return this.renderLayoutSnowflake();
|
|
4069
|
+
case 'snowflake-left':
|
|
4070
|
+
return this.renderLayoutSnowflake();
|
|
4071
|
+
case 'snowflake-right':
|
|
4072
|
+
return this.renderLayoutSnowflake();
|
|
4073
|
+
default:
|
|
4074
|
+
return this.renderLayoutClassic();
|
|
4075
|
+
}
|
|
4076
|
+
}
|
|
3804
4077
|
}
|
|
3805
4078
|
|
|
3806
4079
|
AuroDropdown.register();
|