@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
|
@@ -12,24 +12,37 @@ const t$2=globalThis,i$5=t$2.trustedTypes,s$3=i$5?i$5.createPolicy("lit-html",{c
|
|
|
12
12
|
*/
|
|
13
13
|
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);
|
|
14
14
|
|
|
15
|
+
/**
|
|
16
|
+
* @license
|
|
17
|
+
* Copyright 2017 Google LLC
|
|
18
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
19
|
+
*/
|
|
20
|
+
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)}};
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* @license
|
|
24
|
+
* Copyright 2018 Google LLC
|
|
25
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
26
|
+
*/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}});
|
|
27
|
+
|
|
15
28
|
/**
|
|
16
29
|
* @license
|
|
17
30
|
* Copyright 2019 Google LLC
|
|
18
31
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
19
32
|
*/
|
|
20
|
-
const t
|
|
33
|
+
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;
|
|
21
34
|
|
|
22
35
|
/**
|
|
23
36
|
* @license
|
|
24
37
|
* Copyright 2017 Google LLC
|
|
25
38
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
26
|
-
*/const{is:i$
|
|
39
|
+
*/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");
|
|
27
40
|
|
|
28
41
|
/**
|
|
29
42
|
* @license
|
|
30
43
|
* Copyright 2017 Google LLC
|
|
31
44
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
32
|
-
*/const s=globalThis;
|
|
45
|
+
*/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");
|
|
33
46
|
|
|
34
47
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
35
48
|
// See LICENSE in the project root for license information.
|
|
@@ -621,16 +634,21 @@ const flip$1 = function (options) {
|
|
|
621
634
|
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
622
635
|
const nextPlacement = placements[nextIndex];
|
|
623
636
|
if (nextPlacement) {
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
637
|
+
var _overflowsData$;
|
|
638
|
+
const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
639
|
+
const hasInitialMainAxisOverflow = ((_overflowsData$ = overflowsData[0]) == null ? void 0 : _overflowsData$.overflows[0]) > 0;
|
|
640
|
+
if (!ignoreCrossAxisOverflow || hasInitialMainAxisOverflow) {
|
|
641
|
+
// Try next placement and re-run the lifecycle.
|
|
642
|
+
return {
|
|
643
|
+
data: {
|
|
644
|
+
index: nextIndex,
|
|
645
|
+
overflows: overflowsData
|
|
646
|
+
},
|
|
647
|
+
reset: {
|
|
648
|
+
placement: nextPlacement
|
|
649
|
+
}
|
|
650
|
+
};
|
|
651
|
+
}
|
|
634
652
|
}
|
|
635
653
|
|
|
636
654
|
// First, find the candidates that fit on the mainAxis side of overflow,
|
|
@@ -1282,6 +1300,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
|
1282
1300
|
scrollTop: 0
|
|
1283
1301
|
};
|
|
1284
1302
|
const offsets = createCoords(0);
|
|
1303
|
+
|
|
1304
|
+
// If the <body> scrollbar appears on the left (e.g. RTL systems). Use
|
|
1305
|
+
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
1306
|
+
function setLeftRTLScrollbarOffset() {
|
|
1307
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
1308
|
+
}
|
|
1285
1309
|
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1286
1310
|
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1287
1311
|
scroll = getNodeScroll(offsetParent);
|
|
@@ -1291,11 +1315,12 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
|
1291
1315
|
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1292
1316
|
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1293
1317
|
} else if (documentElement) {
|
|
1294
|
-
|
|
1295
|
-
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
1296
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
1318
|
+
setLeftRTLScrollbarOffset();
|
|
1297
1319
|
}
|
|
1298
1320
|
}
|
|
1321
|
+
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
1322
|
+
setLeftRTLScrollbarOffset();
|
|
1323
|
+
}
|
|
1299
1324
|
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1300
1325
|
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
1301
1326
|
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
@@ -1472,7 +1497,7 @@ function observeMove(element, onMove) {
|
|
|
1472
1497
|
// Handle <iframe>s
|
|
1473
1498
|
root: root.ownerDocument
|
|
1474
1499
|
});
|
|
1475
|
-
} catch (
|
|
1500
|
+
} catch (_e) {
|
|
1476
1501
|
io = new IntersectionObserver(handleObserve, options);
|
|
1477
1502
|
}
|
|
1478
1503
|
io.observe(element);
|
|
@@ -2275,19 +2300,6 @@ class AuroDependencyVersioning {
|
|
|
2275
2300
|
}
|
|
2276
2301
|
}
|
|
2277
2302
|
|
|
2278
|
-
/**
|
|
2279
|
-
* @license
|
|
2280
|
-
* Copyright 2017 Google LLC
|
|
2281
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
2282
|
-
*/
|
|
2283
|
-
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)}}
|
|
2284
|
-
|
|
2285
|
-
/**
|
|
2286
|
-
* @license
|
|
2287
|
-
* Copyright 2018 Google LLC
|
|
2288
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
2289
|
-
*/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}});
|
|
2290
|
-
|
|
2291
2303
|
/**
|
|
2292
2304
|
* @license
|
|
2293
2305
|
* Copyright 2018 Google LLC
|
|
@@ -2304,7 +2316,7 @@ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{cons
|
|
|
2304
2316
|
* @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
|
|
2305
2317
|
*/
|
|
2306
2318
|
|
|
2307
|
-
class AuroElement extends i
|
|
2319
|
+
let AuroElement$1 = class AuroElement extends i {
|
|
2308
2320
|
|
|
2309
2321
|
// function to define props used within the scope of this component
|
|
2310
2322
|
static get properties() {
|
|
@@ -2328,7 +2340,7 @@ class AuroElement extends i$1 {
|
|
|
2328
2340
|
|
|
2329
2341
|
return 'false'
|
|
2330
2342
|
}
|
|
2331
|
-
}
|
|
2343
|
+
};
|
|
2332
2344
|
|
|
2333
2345
|
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>"};
|
|
2334
2346
|
|
|
@@ -2360,7 +2372,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
2360
2372
|
return _fetchMap.get(uri);
|
|
2361
2373
|
};
|
|
2362
2374
|
|
|
2363
|
-
var styleCss$3 = i$
|
|
2375
|
+
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}`;
|
|
2364
2376
|
|
|
2365
2377
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2366
2378
|
// See LICENSE in the project root for license information.
|
|
@@ -2372,7 +2384,7 @@ var styleCss$3 = i$3`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
2372
2384
|
*/
|
|
2373
2385
|
|
|
2374
2386
|
// build the component class
|
|
2375
|
-
class BaseIcon extends AuroElement {
|
|
2387
|
+
class BaseIcon extends AuroElement$1 {
|
|
2376
2388
|
constructor() {
|
|
2377
2389
|
super();
|
|
2378
2390
|
this.onDark = false;
|
|
@@ -2402,7 +2414,7 @@ class BaseIcon extends AuroElement {
|
|
|
2402
2414
|
}
|
|
2403
2415
|
|
|
2404
2416
|
static get styles() {
|
|
2405
|
-
return i$
|
|
2417
|
+
return i$2`
|
|
2406
2418
|
${styleCss$3}
|
|
2407
2419
|
`;
|
|
2408
2420
|
}
|
|
@@ -2444,9 +2456,9 @@ class BaseIcon extends AuroElement {
|
|
|
2444
2456
|
}
|
|
2445
2457
|
}
|
|
2446
2458
|
|
|
2447
|
-
var tokensCss$2 = i$
|
|
2459
|
+
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)}`;
|
|
2448
2460
|
|
|
2449
|
-
var colorCss$3 = i$
|
|
2461
|
+
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)}`;
|
|
2450
2462
|
|
|
2451
2463
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2452
2464
|
// See LICENSE in the project root for license information.
|
|
@@ -2534,9 +2546,9 @@ class AuroIcon extends BaseIcon {
|
|
|
2534
2546
|
static get styles() {
|
|
2535
2547
|
return [
|
|
2536
2548
|
super.styles,
|
|
2537
|
-
i$
|
|
2538
|
-
i$
|
|
2539
|
-
i$
|
|
2549
|
+
i$2`${tokensCss$2}`,
|
|
2550
|
+
i$2`${styleCss$3}`,
|
|
2551
|
+
i$2`${colorCss$3}`
|
|
2540
2552
|
];
|
|
2541
2553
|
}
|
|
2542
2554
|
|
|
@@ -2595,7 +2607,7 @@ class AuroIcon extends BaseIcon {
|
|
|
2595
2607
|
return x`
|
|
2596
2608
|
<div class="componentWrapper">
|
|
2597
2609
|
<div
|
|
2598
|
-
class="${e(svgClasses)}"
|
|
2610
|
+
class="${e$2(svgClasses)}"
|
|
2599
2611
|
title="${o(this.title || undefined)}">
|
|
2600
2612
|
<span aria-hidden="${o(this.ariaHidden || true)}" part="svg">
|
|
2601
2613
|
${this.customSvg ? x`
|
|
@@ -2607,7 +2619,7 @@ class AuroIcon extends BaseIcon {
|
|
|
2607
2619
|
</span>
|
|
2608
2620
|
</div>
|
|
2609
2621
|
|
|
2610
|
-
<div class="${e(labelClasses)}">
|
|
2622
|
+
<div class="${e$2(labelClasses)}">
|
|
2611
2623
|
<slot></slot>
|
|
2612
2624
|
</div>
|
|
2613
2625
|
</div>
|
|
@@ -2617,11 +2629,11 @@ class AuroIcon extends BaseIcon {
|
|
|
2617
2629
|
|
|
2618
2630
|
var iconVersion = '6.1.2';
|
|
2619
2631
|
|
|
2620
|
-
var styleCss$2 = i$
|
|
2632
|
+
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}`;
|
|
2621
2633
|
|
|
2622
|
-
var colorCss$2 = i$
|
|
2634
|
+
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)}`;
|
|
2623
2635
|
|
|
2624
|
-
var tokensCss$1 = i$
|
|
2636
|
+
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)}`;
|
|
2625
2637
|
|
|
2626
2638
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2627
2639
|
// See LICENSE in the project root for license information.
|
|
@@ -2642,7 +2654,7 @@ const DESIGN_TOKEN_BREAKPOINT_OPTIONS = [
|
|
|
2642
2654
|
* @csspart bibContainer - Apply css to the bib container.
|
|
2643
2655
|
*/
|
|
2644
2656
|
|
|
2645
|
-
class AuroDropdownBib extends i
|
|
2657
|
+
class AuroDropdownBib extends i {
|
|
2646
2658
|
|
|
2647
2659
|
constructor() {
|
|
2648
2660
|
super();
|
|
@@ -2744,15 +2756,21 @@ class AuroDropdownBib extends i$1 {
|
|
|
2744
2756
|
|
|
2745
2757
|
var dropdownVersion = '3.0.0';
|
|
2746
2758
|
|
|
2747
|
-
var
|
|
2759
|
+
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}`;
|
|
2760
|
+
|
|
2761
|
+
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)}`;
|
|
2762
|
+
|
|
2763
|
+
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)}`;
|
|
2748
2764
|
|
|
2749
|
-
var
|
|
2765
|
+
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)}`;
|
|
2750
2766
|
|
|
2751
|
-
var
|
|
2767
|
+
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)}`;
|
|
2752
2768
|
|
|
2753
|
-
var
|
|
2769
|
+
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)}`;
|
|
2754
2770
|
|
|
2755
|
-
var
|
|
2771
|
+
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}`;
|
|
2772
|
+
|
|
2773
|
+
var tokensCss = i$2`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
2756
2774
|
|
|
2757
2775
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
2758
2776
|
// See LICENSE in the project root for license information.
|
|
@@ -2833,7 +2851,7 @@ class AuroLibraryRuntimeUtils {
|
|
|
2833
2851
|
*
|
|
2834
2852
|
* @attr { Boolean } large - If declared, make font-size to 1rem(16px).
|
|
2835
2853
|
*/
|
|
2836
|
-
class AuroHelpText extends i
|
|
2854
|
+
class AuroHelpText extends i {
|
|
2837
2855
|
|
|
2838
2856
|
constructor() {
|
|
2839
2857
|
super();
|
|
@@ -2956,6 +2974,98 @@ class AuroHelpText extends i$1 {
|
|
|
2956
2974
|
|
|
2957
2975
|
var helpTextVersion = '1.0.0';
|
|
2958
2976
|
|
|
2977
|
+
class AuroElement extends i {
|
|
2978
|
+
static get properties() {
|
|
2979
|
+
return {
|
|
2980
|
+
|
|
2981
|
+
/**
|
|
2982
|
+
* Defines the language of an element.
|
|
2983
|
+
* @default {'default'}
|
|
2984
|
+
*/
|
|
2985
|
+
layout: {
|
|
2986
|
+
type: String,
|
|
2987
|
+
attribute: "layout",
|
|
2988
|
+
reflect: true
|
|
2989
|
+
},
|
|
2990
|
+
|
|
2991
|
+
shape: {
|
|
2992
|
+
type: String,
|
|
2993
|
+
attribute: "shape",
|
|
2994
|
+
reflect: true
|
|
2995
|
+
},
|
|
2996
|
+
|
|
2997
|
+
size: {
|
|
2998
|
+
type: String,
|
|
2999
|
+
attribute: "size",
|
|
3000
|
+
reflect: true
|
|
3001
|
+
},
|
|
3002
|
+
|
|
3003
|
+
onDark: {
|
|
3004
|
+
type: Boolean,
|
|
3005
|
+
attribute: "ondark",
|
|
3006
|
+
reflect: true
|
|
3007
|
+
}
|
|
3008
|
+
};
|
|
3009
|
+
}
|
|
3010
|
+
|
|
3011
|
+
resetShapeClasses() {
|
|
3012
|
+
if (this.shape && this.size) {
|
|
3013
|
+
const wrapper = this.shadowRoot.querySelector('.wrapper');
|
|
3014
|
+
|
|
3015
|
+
if (wrapper) {
|
|
3016
|
+
wrapper.classList.forEach((className) => {
|
|
3017
|
+
if (className.startsWith('shape-')) {
|
|
3018
|
+
wrapper.classList.remove(className);
|
|
3019
|
+
}
|
|
3020
|
+
});
|
|
3021
|
+
|
|
3022
|
+
wrapper.classList.add(`shape-${this.shape.toLowerCase()}-${this.size.toLowerCase()}`);
|
|
3023
|
+
}
|
|
3024
|
+
}
|
|
3025
|
+
}
|
|
3026
|
+
|
|
3027
|
+
resetLayoutClasses() {
|
|
3028
|
+
if (this.layout) {
|
|
3029
|
+
const wrapper = this.shadowRoot.querySelector('.wrapper');
|
|
3030
|
+
|
|
3031
|
+
if (wrapper) {
|
|
3032
|
+
wrapper.classList.forEach((className) => {
|
|
3033
|
+
if (className.startsWith('layout-')) {
|
|
3034
|
+
wrapper.classList.remove(className);
|
|
3035
|
+
}
|
|
3036
|
+
});
|
|
3037
|
+
|
|
3038
|
+
wrapper.classList.add(`layout-${this.layout.toLowerCase()}`);
|
|
3039
|
+
}
|
|
3040
|
+
}
|
|
3041
|
+
}
|
|
3042
|
+
|
|
3043
|
+
updateComponentArchitecture() {
|
|
3044
|
+
this.resetLayoutClasses();
|
|
3045
|
+
this.resetShapeClasses();
|
|
3046
|
+
}
|
|
3047
|
+
|
|
3048
|
+
updated(changedProperties) {
|
|
3049
|
+
if (changedProperties.has('layout') || changedProperties.has('shape') || changedProperties.has('size')) {
|
|
3050
|
+
this.updateComponentArchitecture();
|
|
3051
|
+
}
|
|
3052
|
+
}
|
|
3053
|
+
|
|
3054
|
+
// Try to render the defined `this.layout` layout. If that fails, fall back to the default layout.
|
|
3055
|
+
// This will catch if an invalid layout value is passed in and render the default layout if so.
|
|
3056
|
+
render() {
|
|
3057
|
+
try {
|
|
3058
|
+
return this.renderLayout();
|
|
3059
|
+
} catch (error) {
|
|
3060
|
+
// failed to get the defined layout
|
|
3061
|
+
console.error('Failed to get the defined layout - using the default layout', error); // eslint-disable-line no-console
|
|
3062
|
+
|
|
3063
|
+
// fallback to the default layout
|
|
3064
|
+
return this.getLayout('default');
|
|
3065
|
+
}
|
|
3066
|
+
}
|
|
3067
|
+
}
|
|
3068
|
+
|
|
2959
3069
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
2960
3070
|
// See LICENSE in the project root for license information.
|
|
2961
3071
|
|
|
@@ -2973,7 +3083,7 @@ var helpTextVersion = '1.0.0';
|
|
|
2973
3083
|
* @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
|
|
2974
3084
|
* @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
|
|
2975
3085
|
*/
|
|
2976
|
-
class AuroDropdown extends
|
|
3086
|
+
class AuroDropdown extends AuroElement {
|
|
2977
3087
|
constructor() {
|
|
2978
3088
|
super();
|
|
2979
3089
|
|
|
@@ -2982,26 +3092,29 @@ class AuroDropdown extends i$1 {
|
|
|
2982
3092
|
this.matchWidth = false;
|
|
2983
3093
|
this.noHideOnThisFocusLoss = false;
|
|
2984
3094
|
|
|
3095
|
+
this.errorMessage = ''; // TODO!
|
|
3096
|
+
|
|
3097
|
+
// Layout Config
|
|
3098
|
+
this.layout = 'default';
|
|
3099
|
+
this.shape = 'rounded';
|
|
3100
|
+
this.size = 'xl';
|
|
3101
|
+
|
|
2985
3102
|
this.privateDefaults();
|
|
3103
|
+
}
|
|
2986
3104
|
|
|
2987
|
-
|
|
2988
|
-
|
|
2989
|
-
|
|
2990
|
-
*/
|
|
2991
|
-
this.constructor.shadowRootOptions = {
|
|
2992
|
-
...i$1.shadowRootOptions,
|
|
2993
|
-
delegatesFocus: true,
|
|
3105
|
+
get commonLabelClasses() {
|
|
3106
|
+
return {
|
|
3107
|
+
// 'withValue': this.value && this.value.length > 0
|
|
2994
3108
|
};
|
|
3109
|
+
}
|
|
2995
3110
|
|
|
2996
|
-
|
|
2997
|
-
|
|
2998
|
-
|
|
2999
|
-
|
|
3000
|
-
|
|
3001
|
-
|
|
3002
|
-
|
|
3003
|
-
*/
|
|
3004
|
-
this.showTriggerBorders = true;
|
|
3111
|
+
get commonWrapperClasses() {
|
|
3112
|
+
return {
|
|
3113
|
+
'trigger': true,
|
|
3114
|
+
'wrapper': true,
|
|
3115
|
+
'hasFocus': this.hasFocus,
|
|
3116
|
+
'simple': this.simple
|
|
3117
|
+
};
|
|
3005
3118
|
}
|
|
3006
3119
|
|
|
3007
3120
|
/**
|
|
@@ -3009,7 +3122,6 @@ class AuroDropdown extends i$1 {
|
|
|
3009
3122
|
* @returns {void} Internal defaults.
|
|
3010
3123
|
*/
|
|
3011
3124
|
privateDefaults() {
|
|
3012
|
-
this.bordered = false;
|
|
3013
3125
|
this.chevron = false;
|
|
3014
3126
|
this.disabled = false;
|
|
3015
3127
|
this.error = false;
|
|
@@ -3019,8 +3131,11 @@ class AuroDropdown extends i$1 {
|
|
|
3019
3131
|
this.noToggle = false;
|
|
3020
3132
|
this.a11yAutocomplete = 'none';
|
|
3021
3133
|
this.labeled = true;
|
|
3022
|
-
this.a11yRole = '
|
|
3134
|
+
this.a11yRole = 'button';
|
|
3023
3135
|
this.onDark = false;
|
|
3136
|
+
this.showTriggerBorders = true;
|
|
3137
|
+
this.triggerContentFocusable = false;
|
|
3138
|
+
this.simple = false;
|
|
3024
3139
|
|
|
3025
3140
|
// floaterConfig
|
|
3026
3141
|
this.placement = 'bottom-start';
|
|
@@ -3028,6 +3143,15 @@ class AuroDropdown extends i$1 {
|
|
|
3028
3143
|
this.noFlip = false;
|
|
3029
3144
|
this.autoPlacement = false;
|
|
3030
3145
|
|
|
3146
|
+
/**
|
|
3147
|
+
* @private
|
|
3148
|
+
* @property {boolean} delegatesFocus - Whether the shadow root delegates focus.
|
|
3149
|
+
*/
|
|
3150
|
+
this.constructor.shadowRootOptions = {
|
|
3151
|
+
...i.shadowRootOptions,
|
|
3152
|
+
delegatesFocus: true,
|
|
3153
|
+
};
|
|
3154
|
+
|
|
3031
3155
|
/**
|
|
3032
3156
|
* @private
|
|
3033
3157
|
*/
|
|
@@ -3118,7 +3242,7 @@ class AuroDropdown extends i$1 {
|
|
|
3118
3242
|
/**
|
|
3119
3243
|
* If declared, applies a border around the trigger slot.
|
|
3120
3244
|
*/
|
|
3121
|
-
|
|
3245
|
+
simple: {
|
|
3122
3246
|
type: Boolean,
|
|
3123
3247
|
reflect: true
|
|
3124
3248
|
},
|
|
@@ -3166,13 +3290,20 @@ class AuroDropdown extends i$1 {
|
|
|
3166
3290
|
},
|
|
3167
3291
|
|
|
3168
3292
|
/**
|
|
3169
|
-
* If declared in combination with `
|
|
3293
|
+
* If declared in combination with not using the `simple` property or `helpText` slot content, will apply red color to both.
|
|
3170
3294
|
*/
|
|
3171
3295
|
error: {
|
|
3172
3296
|
type: Boolean,
|
|
3173
3297
|
reflect: true
|
|
3174
3298
|
},
|
|
3175
3299
|
|
|
3300
|
+
/**
|
|
3301
|
+
* Contains the help text message for the current validity error.
|
|
3302
|
+
*/
|
|
3303
|
+
errorMessage: {
|
|
3304
|
+
type: String
|
|
3305
|
+
},
|
|
3306
|
+
|
|
3176
3307
|
/**
|
|
3177
3308
|
* If declared, the bib will display when focus is applied to the trigger.
|
|
3178
3309
|
*/
|
|
@@ -3307,11 +3438,6 @@ class AuroDropdown extends i$1 {
|
|
|
3307
3438
|
|
|
3308
3439
|
/**
|
|
3309
3440
|
* Position where the bib should appear relative to the trigger.
|
|
3310
|
-
* Accepted values:
|
|
3311
|
-
* "top" | "right" | "bottom" | "left" |
|
|
3312
|
-
* "bottom-start" | "top-start" | "top-end" |
|
|
3313
|
-
* "right-start" | "right-end" | "bottom-end" |
|
|
3314
|
-
* "left-start" | "left-end"
|
|
3315
3441
|
* @default bottom-start
|
|
3316
3442
|
*/
|
|
3317
3443
|
placement: {
|
|
@@ -3357,7 +3483,10 @@ class AuroDropdown extends i$1 {
|
|
|
3357
3483
|
return [
|
|
3358
3484
|
colorCss$1,
|
|
3359
3485
|
styleCss$1,
|
|
3360
|
-
tokensCss$1
|
|
3486
|
+
tokensCss$1,
|
|
3487
|
+
styleEmphasizedCss,
|
|
3488
|
+
styleSnowflakeCss,
|
|
3489
|
+
shapeSizeCss
|
|
3361
3490
|
];
|
|
3362
3491
|
}
|
|
3363
3492
|
|
|
@@ -3393,6 +3522,7 @@ class AuroDropdown extends i$1 {
|
|
|
3393
3522
|
}
|
|
3394
3523
|
|
|
3395
3524
|
updated(changedProperties) {
|
|
3525
|
+
super.updated(changedProperties);
|
|
3396
3526
|
this.floater.handleUpdate(changedProperties);
|
|
3397
3527
|
|
|
3398
3528
|
// Note: `disabled` is not a breakpoint (it is not a screen size),
|
|
@@ -3402,7 +3532,7 @@ class AuroDropdown extends i$1 {
|
|
|
3402
3532
|
}
|
|
3403
3533
|
|
|
3404
3534
|
// when trigger's content is changed without any attribute or node change,
|
|
3405
|
-
// `requestUpdate` needs to be called to update
|
|
3535
|
+
// `requestUpdate` needs to be called to update hasTriggerContent
|
|
3406
3536
|
if (changedProperties.size === 0 || changedProperties.has('isPopoverVisible')) {
|
|
3407
3537
|
this.handleTriggerContentSlotChange();
|
|
3408
3538
|
}
|
|
@@ -3463,6 +3593,24 @@ class AuroDropdown extends i$1 {
|
|
|
3463
3593
|
return inCustomSlot;
|
|
3464
3594
|
}
|
|
3465
3595
|
|
|
3596
|
+
/**
|
|
3597
|
+
* Function to support @focusin event.
|
|
3598
|
+
* @private
|
|
3599
|
+
* @return {void}
|
|
3600
|
+
*/
|
|
3601
|
+
handleFocusin() {
|
|
3602
|
+
this.hasFocus = true;
|
|
3603
|
+
}
|
|
3604
|
+
|
|
3605
|
+
/**
|
|
3606
|
+
* Function to support @focusout event.
|
|
3607
|
+
* @private
|
|
3608
|
+
* @return {void}
|
|
3609
|
+
*/
|
|
3610
|
+
handleFocusout() {
|
|
3611
|
+
this.hasFocus = false;
|
|
3612
|
+
}
|
|
3613
|
+
|
|
3466
3614
|
/**
|
|
3467
3615
|
* Determines if the element or any children are focusable.
|
|
3468
3616
|
* @private
|
|
@@ -3522,8 +3670,8 @@ class AuroDropdown extends i$1 {
|
|
|
3522
3670
|
}
|
|
3523
3671
|
|
|
3524
3672
|
/**
|
|
3525
|
-
* @private
|
|
3526
3673
|
* Creates and dispatches a duplicate focus event on the trigger element.
|
|
3674
|
+
* @private
|
|
3527
3675
|
* @param {Event} event - The original focus event.
|
|
3528
3676
|
*/
|
|
3529
3677
|
bindFocusEventToTrigger(event) {
|
|
@@ -3536,9 +3684,9 @@ class AuroDropdown extends i$1 {
|
|
|
3536
3684
|
}
|
|
3537
3685
|
|
|
3538
3686
|
/**
|
|
3539
|
-
* @private
|
|
3540
3687
|
* Sets up event listeners to deliver focus and blur events from nested Auro components within the trigger slot to trigger.
|
|
3541
3688
|
* This ensures that focus/blur events originating from within these components are propagated to the trigger element itself.
|
|
3689
|
+
* @private
|
|
3542
3690
|
*/
|
|
3543
3691
|
setupTriggerFocusEventBinding() {
|
|
3544
3692
|
if (!this.triggerContentSlot || this.triggerContentSlot.length === 0) {
|
|
@@ -3632,7 +3780,7 @@ class AuroDropdown extends i$1 {
|
|
|
3632
3780
|
// If there are children
|
|
3633
3781
|
if (triggerContentNodes) {
|
|
3634
3782
|
|
|
3635
|
-
// See if any of them are focusable
|
|
3783
|
+
// See if any of them are focusable elements
|
|
3636
3784
|
this.triggerContentFocusable = triggerContentNodes.some((node) => this.containsFocusableElement(node));
|
|
3637
3785
|
|
|
3638
3786
|
// If any of them are focusable elements
|
|
@@ -3718,8 +3866,75 @@ class AuroDropdown extends i$1 {
|
|
|
3718
3866
|
this.labeled = nodesArr.length > 0;
|
|
3719
3867
|
}
|
|
3720
3868
|
|
|
3721
|
-
|
|
3722
|
-
|
|
3869
|
+
/**
|
|
3870
|
+
* Returns HTML for the common portion of the layouts.
|
|
3871
|
+
* @private
|
|
3872
|
+
* @param {Object} helpTextClasses - Classes to apply to the help text container.
|
|
3873
|
+
* @returns {html} - Returns HTML.
|
|
3874
|
+
*/
|
|
3875
|
+
renderBasicHtml(helpTextClasses) {
|
|
3876
|
+
return u$1`
|
|
3877
|
+
<div>
|
|
3878
|
+
<div
|
|
3879
|
+
id="trigger"
|
|
3880
|
+
class="${e$2(this.commonWrapperClasses)}" part="wrapper"
|
|
3881
|
+
tabindex="${this.tabIndex}"
|
|
3882
|
+
?showBorder="${this.showTriggerBorders}"
|
|
3883
|
+
role="${o(this.triggerContentFocusable ? undefined : this.a11yRole)}"
|
|
3884
|
+
aria-expanded="${o(this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
|
|
3885
|
+
aria-controls="${o(this.triggerContentFocusable ? undefined : this.dropdownId)}"
|
|
3886
|
+
aria-labelledby="${o(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
|
|
3887
|
+
@focusin="${this.handleFocusin}"
|
|
3888
|
+
@blur="${this.handleFocusOut}">
|
|
3889
|
+
<div class="triggerContentWrapper">
|
|
3890
|
+
<label class="label" id="triggerLabel" hasTrigger=${this.hasTriggerContent}>
|
|
3891
|
+
<slot name="label" @slotchange="${this.handleLabelSlotChange}"></slot>
|
|
3892
|
+
</label>
|
|
3893
|
+
<div class="triggerContent">
|
|
3894
|
+
<slot
|
|
3895
|
+
name="trigger"
|
|
3896
|
+
@slotchange="${this.handleTriggerContentSlotChange}"></slot>
|
|
3897
|
+
</div>
|
|
3898
|
+
</div>
|
|
3899
|
+
${this.chevron || this.common ? u$1`
|
|
3900
|
+
<div
|
|
3901
|
+
id="showStateIcon"
|
|
3902
|
+
part="chevron">
|
|
3903
|
+
<${this.iconTag}
|
|
3904
|
+
category="interface"
|
|
3905
|
+
name="chevron-down"
|
|
3906
|
+
?onDark="${this.onDark}"
|
|
3907
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
3908
|
+
>
|
|
3909
|
+
</${this.iconTag}>
|
|
3910
|
+
</div>
|
|
3911
|
+
` : undefined }
|
|
3912
|
+
</div>
|
|
3913
|
+
<div class="${e$2(helpTextClasses)}">
|
|
3914
|
+
<slot name="helpText"></slot>
|
|
3915
|
+
</div>
|
|
3916
|
+
<div class="slotContent">
|
|
3917
|
+
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
3918
|
+
</div>
|
|
3919
|
+
<div id="bibSizer" part="size"></div>
|
|
3920
|
+
<${this.dropdownBibTag}
|
|
3921
|
+
id="bib"
|
|
3922
|
+
?data-show="${this.isPopoverVisible}"
|
|
3923
|
+
?isfullscreen="${this.isBibFullscreen}"
|
|
3924
|
+
?common="${this.common}"
|
|
3925
|
+
?rounded="${this.common || this.rounded}"
|
|
3926
|
+
?inset="${this.common || this.inset}">
|
|
3927
|
+
</${this.dropdownBibTag}>
|
|
3928
|
+
</div>
|
|
3929
|
+
`;
|
|
3930
|
+
}
|
|
3931
|
+
|
|
3932
|
+
/**
|
|
3933
|
+
* Returns HTML for the classic layout. Does not support type="*".
|
|
3934
|
+
* @private
|
|
3935
|
+
* @returns {html} - Returns HTML for the classic layout.
|
|
3936
|
+
*/
|
|
3937
|
+
renderLayoutClassic() {
|
|
3723
3938
|
return u$1`
|
|
3724
3939
|
<div>
|
|
3725
3940
|
<div
|
|
@@ -3757,9 +3972,6 @@ class AuroDropdown extends i$1 {
|
|
|
3757
3972
|
</div>
|
|
3758
3973
|
` : undefined }
|
|
3759
3974
|
</div>
|
|
3760
|
-
<${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
|
|
3761
|
-
<slot name="helpText"></slot>
|
|
3762
|
-
</${this.helpTextTag}>
|
|
3763
3975
|
<div class="slotContent">
|
|
3764
3976
|
<slot @slotchange="${this.handleDefaultSlot}"></slot>
|
|
3765
3977
|
</div>
|
|
@@ -3776,6 +3988,67 @@ class AuroDropdown extends i$1 {
|
|
|
3776
3988
|
</div>
|
|
3777
3989
|
`;
|
|
3778
3990
|
}
|
|
3991
|
+
|
|
3992
|
+
/**
|
|
3993
|
+
* Returns HTML for the snowflake layout. Does not support type="*".
|
|
3994
|
+
* @private
|
|
3995
|
+
* @returns {html} - Returns HTML for the snowflake layout.
|
|
3996
|
+
*/
|
|
3997
|
+
renderLayoutSnowflake() {
|
|
3998
|
+
const helpTextClasses = {
|
|
3999
|
+
'helpText': true,
|
|
4000
|
+
'leftIndent': true,
|
|
4001
|
+
'rightIndent': true
|
|
4002
|
+
};
|
|
4003
|
+
|
|
4004
|
+
return u$1`
|
|
4005
|
+
${this.renderBasicHtml(helpTextClasses)}
|
|
4006
|
+
`;
|
|
4007
|
+
}
|
|
4008
|
+
|
|
4009
|
+
/**
|
|
4010
|
+
* Returns HTML for the emphasized layout. Does not support type="*".
|
|
4011
|
+
* @private
|
|
4012
|
+
* @returns {html} - Returns HTML for the emphasized layout.
|
|
4013
|
+
*/
|
|
4014
|
+
renderLayoutEmphasized() {
|
|
4015
|
+
const helpTextClasses = {
|
|
4016
|
+
'helpText': true,
|
|
4017
|
+
'leftIndent': this.shape.toLowerCase().includes('pill') && !this.shape.toLowerCase().includes('right'),
|
|
4018
|
+
'rightIndent': this.shape.toLowerCase().includes('pill') && !this.shape.toLowerCase().includes('left')
|
|
4019
|
+
};
|
|
4020
|
+
|
|
4021
|
+
return u$1`
|
|
4022
|
+
${this.renderBasicHtml(helpTextClasses)}
|
|
4023
|
+
`;
|
|
4024
|
+
}
|
|
4025
|
+
|
|
4026
|
+
/**
|
|
4027
|
+
* Logic to determine the layout of the component.
|
|
4028
|
+
* @private
|
|
4029
|
+
* @param {string} [ForcedLayout] - Used to force a specific layout, pass in the layout name to use.
|
|
4030
|
+
* @returns {HTMLCollection} - Returns the HTML for the layout.
|
|
4031
|
+
*/
|
|
4032
|
+
renderLayout(ForcedLayout) {
|
|
4033
|
+
const layout = ForcedLayout || this.layout;
|
|
4034
|
+
|
|
4035
|
+
switch (layout) {
|
|
4036
|
+
case 'emphasized':
|
|
4037
|
+
return this.renderLayoutEmphasized();
|
|
4038
|
+
case 'emphasized-left':
|
|
4039
|
+
return this.renderLayoutEmphasized();
|
|
4040
|
+
case 'emphasized-right':
|
|
4041
|
+
return this.renderLayoutEmphasized();
|
|
4042
|
+
case 'snowflake':
|
|
4043
|
+
return this.renderLayoutSnowflake();
|
|
4044
|
+
case 'snowflake-left':
|
|
4045
|
+
return this.renderLayoutSnowflake();
|
|
4046
|
+
case 'snowflake-right':
|
|
4047
|
+
return this.renderLayoutSnowflake();
|
|
4048
|
+
default:
|
|
4049
|
+
return this.renderLayoutClassic();
|
|
4050
|
+
}
|
|
4051
|
+
}
|
|
3779
4052
|
}
|
|
3780
4053
|
|
|
3781
4054
|
/* eslint-disable jsdoc/require-jsdoc, no-magic-numbers, no-param-reassign */
|