@aurodesignsystem/auro-formkit 2.0.2 → 2.1.0-beta.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/CHANGELOG.md +19 -0
- package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
- package/components/bibtemplate/dist/index.js +281 -135
- package/components/bibtemplate/dist/registered.js +281 -135
- package/components/checkbox/README.md +1 -1
- package/components/checkbox/demo/api.min.js +30 -56
- package/components/checkbox/demo/index.min.js +30 -56
- package/components/checkbox/demo/readme.md +1 -1
- package/components/checkbox/dist/index.js +28 -101
- package/components/checkbox/dist/registered.js +28 -101
- package/components/combobox/README.md +1 -1
- package/components/combobox/demo/api.min.js +1289 -734
- package/components/combobox/demo/index.min.js +1289 -734
- package/components/combobox/demo/readme.md +1 -1
- package/components/combobox/dist/index.js +1024 -632
- package/components/combobox/dist/registered.js +1024 -632
- package/components/counter/README.md +1 -1
- package/components/counter/demo/api.min.js +971 -435
- package/components/counter/demo/index.js +1 -0
- package/components/counter/demo/index.min.js +972 -435
- package/components/counter/demo/readme.md +1 -1
- package/components/counter/dist/iconVersion.d.ts +1 -1
- package/components/counter/dist/index.js +972 -483
- package/components/counter/dist/registered.js +972 -483
- package/components/datepicker/README.md +1 -1
- package/components/datepicker/demo/api.md +30 -0
- package/components/datepicker/demo/api.min.js +1818 -735
- package/components/datepicker/demo/index.min.js +1818 -735
- package/components/datepicker/demo/readme.md +1 -1
- package/components/datepicker/dist/auro-calendar.d.ts +5 -1
- package/components/datepicker/dist/auro-datepicker.d.ts +7 -0
- package/components/datepicker/dist/buttonVersion.d.ts +2 -0
- package/components/datepicker/dist/index.js +1830 -817
- package/components/datepicker/dist/popoverVersion.d.ts +1 -1
- package/components/datepicker/dist/registered.js +1830 -817
- package/components/dropdown/README.md +1 -1
- package/components/dropdown/demo/api.min.js +231 -117
- package/components/dropdown/demo/index.min.js +231 -117
- package/components/dropdown/demo/readme.md +1 -1
- package/components/dropdown/dist/index.js +232 -165
- package/components/dropdown/dist/registered.js +232 -165
- package/components/form/README.md +1 -1
- package/components/form/demo/readme.md +1 -1
- package/components/form/dist/index.js +4 -28
- package/components/form/dist/registered.js +4 -28
- package/components/helptext/dist/index.js +6 -30
- package/components/helptext/dist/registered.js +6 -30
- package/components/input/README.md +1 -1
- package/components/input/demo/api.min.js +471 -164
- package/components/input/demo/index.min.js +471 -164
- package/components/input/demo/readme.md +1 -1
- package/components/input/dist/index.js +468 -220
- package/components/input/dist/registered.js +468 -220
- package/components/menu/README.md +1 -1
- package/components/menu/demo/api.min.js +183 -60
- package/components/menu/demo/index.min.js +183 -60
- package/components/menu/demo/readme.md +1 -1
- package/components/menu/dist/iconVersion.d.ts +1 -1
- package/components/menu/dist/index.js +205 -129
- package/components/menu/dist/registered.js +205 -129
- package/components/radio/README.md +1 -1
- package/components/radio/demo/api.min.js +30 -56
- package/components/radio/demo/index.min.js +30 -56
- package/components/radio/demo/readme.md +1 -1
- package/components/radio/dist/index.js +28 -101
- package/components/radio/dist/registered.js +28 -101
- package/components/select/README.md +1 -1
- package/components/select/demo/api.min.js +736 -436
- package/components/select/demo/index.min.js +736 -436
- package/components/select/demo/readme.md +1 -1
- package/components/select/dist/index.js +538 -402
- package/components/select/dist/registered.js +538 -402
- package/package.json +4 -2
|
@@ -1,41 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
*/
|
|
6
|
-
const t$2=globalThis,e$4=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$2=Symbol(),o$4=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$2)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$4&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$4.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$4.set(s,t));}return t}toString(){return this.cssText}};const r$3=t=>new n$3("string"==typeof t?t:t+"",void 0,s$2),i$5=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(true===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$3(o,t,s$2)},S$1=(s,o)=>{if(e$4)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$4?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$3(e)})(t):t;
|
|
1
|
+
import { css, LitElement, html } from 'lit';
|
|
2
|
+
import { unsafeStatic, literal, html as html$1 } from 'lit/static-html.js';
|
|
3
|
+
import { classMap } from 'lit/directives/class-map.js';
|
|
4
|
+
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
7
5
|
|
|
8
|
-
|
|
9
|
-
* @license
|
|
10
|
-
* Copyright 2017 Google LLC
|
|
11
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
12
|
-
*/const{is:i$4,defineProperty:e$3,getOwnPropertyDescriptor:r$2,getOwnPropertyNames:h$1,getOwnPropertySymbols:o$3,getPrototypeOf:n$2}=Object,a$2=globalThis,c$1=a$2.trustedTypes,l$2=c$1?c$1.emptyScript:"",p$1=a$2.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$2={toAttribute(t,s){switch(s){case Boolean:t=t?l$2:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$4(t,s),y$1={attribute:true,type:String,converter:u$2,reflect:false,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$2.litPropertyMetadata??=new WeakMap;class b 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=y$1){if(s.state&&(s.attribute=false),this._$Ei(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),r=this.getPropertyDescriptor(t,i,s);void 0!==r&&e$3(this.prototype,t,r);}}static getPropertyDescriptor(t,s,i){const{get:e,set:h}=r$2(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get(){return e?.call(this)},set(s){const r=e?.call(this);h.call(this,s),this.requestUpdate(t,r,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??y$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...h$1(t),...o$3(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$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$EC(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:u$2).toAttribute(s,i.type);this._$Em=t,null==r?this.removeAttribute(e):this.setAttribute(e,r),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),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$2;this._$Em=e,this[e]=r.fromAttribute(s,t.type),this._$Em=null;}}requestUpdate(t,s,i){if(void 0!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??f$1)(this[t],s))return;this.P(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$ET());}P(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),true===i.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t);}async _$ET(){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) true!==i.wrapped||this._$AL.has(s)||void 0===this[s]||this.P(s,this[s],i);}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._$EU();}catch(s){throw t=false,this._$EU(),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);}_$EU(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU();}updated(t){}firstUpdated(t){}}b.elementStyles=[],b.shadowRootOptions={mode:"open"},b[d$1("elementProperties")]=new Map,b[d$1("finalized")]=new Map,p$1?.({ReactiveElement:b}),(a$2.reactiveElementVersions??=[]).push("2.0.4");
|
|
6
|
+
var colorCss$1 = css`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
|
|
13
7
|
|
|
14
|
-
|
|
15
|
-
* @license
|
|
16
|
-
* Copyright 2017 Google LLC
|
|
17
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
18
|
-
*/
|
|
19
|
-
const t$1=globalThis,i$3=t$1.trustedTypes,s$1=i$3?i$3.createPolicy("lit-html",{createHTML:t=>t}):void 0,e$2="$lit$",h=`lit$${Math.random().toFixed(9).slice(2)}$`,o$2="?"+h,n$1=`<${o$2}>`,r$1=document,l$1=()=>r$1.createComment(""),c=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a$1=Array.isArray,u$1=t=>a$1(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),T=Symbol.for("lit-noChange"),E=Symbol.for("lit-nothing"),A=new WeakMap,C=r$1.createTreeWalker(r$1,129);function P(t,i){if(!a$1(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==s$1?s$1.createHTML(i):i}const V=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":3===i?"<math>":"",c=f;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f?"!--"===u[1]?c=v:void 0!==u[1]?c=_:void 0!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):void 0!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f:(c=m,r=void 0);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f?s+n$1:d>=0?(o.push(a),s.slice(0,d)+e$2+s.slice(d)+h+x):s+h+(-2===d?i:x);}return [P(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),o]};class N{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=V(t,s);if(this.el=N.createElement(f,n),C.currentNode=this.el.content,2===s||3===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=C.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$2)){const i=v[a++],s=r.getAttribute(t).split(h),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?H:"?"===e[1]?I:"@"===e[1]?L:k}),r.removeAttribute(t);}else t.startsWith(h)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h),s=t.length-1;if(s>0){r.textContent=i$3?i$3.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l$1()),C.nextNode(),d.push({type:2,index:++c});r.append(t[s],l$1());}}}else if(8===r.nodeType)if(r.data===o$2)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h,t+1));)d.push({type:7,index:c}),t+=h.length-1;}c++;}}static createElement(t,i){const s=r$1.createElement("template");return s.innerHTML=t,s}}function S(t,i,s=t,e){if(i===T)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=c(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=S(t,h._$AS(t,i.values),h,e)),i}class M{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$1).importNode(i,true);C.currentNode=e;let h=C.nextNode(),o=0,n=0,l=s[0];for(;void 0!==l;){if(o===l.index){let i;2===l.type?i=new R(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new z(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=C.nextNode(),o++);}return C.currentNode=r$1,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class R{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=E,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=S(this,t,i),c(t)?t===E||null==t||""===t?(this._$AH!==E&&this._$AR(),this._$AH=E):t!==this._$AH&&t!==T&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):u$1(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==E&&c(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$1.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=N.createElement(P(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new M(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return void 0===i&&A.set(t.strings,i=new N(t)),i}k(t){a$1(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new R(this.O(l$1()),this.O(l$1()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(false,true,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class k{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=E,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=E;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=S(this,t,i,0),o=!c(t)||t!==this._$AH&&t!==T,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=S(this,e[s+n],i,n),r===T&&(r=this._$AH[n]),o||=!c(r)||r!==this._$AH[n],r===E?t=E:t!==E&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===E?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class H extends k{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===E?void 0:t;}}class I extends k{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==E);}}class L extends k{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=S(this,t,i,0)??E)===T)return;const s=this._$AH,e=t===E&&s!==E||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==E&&(s===E||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t);}}const j=t$1.litHtmlPolyfillSupport;j?.(N,R),(t$1.litHtmlVersions??=[]).push("3.2.1");const B=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new R(i.insertBefore(l$1(),t),t,void 0,s??{});}return h._$AI(t),h};
|
|
8
|
+
var styleCss$2 = css`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, $ds-size-500)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
|
|
20
9
|
|
|
21
|
-
|
|
22
|
-
* @license
|
|
23
|
-
* Copyright 2017 Google LLC
|
|
24
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
25
|
-
*/class r extends b{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 s=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=B(s,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return T}}r._$litElement$=true,r["finalized"]=true,globalThis.litElementHydrateSupport?.({LitElement:r});const i$2=globalThis.litElementPolyfillSupport;i$2?.({LitElement:r});(globalThis.litElementVersions??=[]).push("4.1.1");
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* @license
|
|
29
|
-
* Copyright 2020 Google LLC
|
|
30
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
31
|
-
*/
|
|
32
|
-
const a=Symbol.for(""),o$1=t=>{if(t?.r===a)return t?._$litStatic$},s=t=>({_$litStatic$:t,r:a}),i$1=(t,...r)=>({_$litStatic$:r.reduce(((r,e,a)=>r+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1]),t[0]),r:a}),l=new Map,n=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$1(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l.get(t))&&(n.raw=n,l.set(t,r=n)),e=u;}return t(r,...e)},u=n(x);
|
|
33
|
-
|
|
34
|
-
var colorCss$1 = i$5`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
|
|
35
|
-
|
|
36
|
-
var styleCss$2 = i$5`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, $ds-size-500)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
|
|
37
|
-
|
|
38
|
-
var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-color-container-primary-default, #ffffff)}`;
|
|
10
|
+
var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-color-container-primary-default, #ffffff)}`;
|
|
39
11
|
|
|
40
12
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
41
13
|
// See LICENSE in the project root for license information.
|
|
@@ -44,7 +16,7 @@ var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
|
|
|
44
16
|
|
|
45
17
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
46
18
|
|
|
47
|
-
class AuroLibraryRuntimeUtils {
|
|
19
|
+
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
48
20
|
|
|
49
21
|
/* eslint-disable jsdoc/require-param */
|
|
50
22
|
|
|
@@ -105,7 +77,7 @@ class AuroLibraryRuntimeUtils {
|
|
|
105
77
|
|
|
106
78
|
return elemTag === tag || elem.hasAttribute(tag);
|
|
107
79
|
}
|
|
108
|
-
}
|
|
80
|
+
};
|
|
109
81
|
|
|
110
82
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
111
83
|
// See LICENSE in the project root for license information.
|
|
@@ -137,7 +109,7 @@ class AuroDependencyVersioning {
|
|
|
137
109
|
*/
|
|
138
110
|
generateTag(baseName, version, tagClass) {
|
|
139
111
|
const elementName = this.generateElementName(baseName, version);
|
|
140
|
-
const tag =
|
|
112
|
+
const tag = literal`${unsafeStatic(elementName)}`;
|
|
141
113
|
|
|
142
114
|
if (!customElements.get(elementName)) {
|
|
143
115
|
customElements.define(elementName, class extends tagClass {});
|
|
@@ -147,25 +119,6 @@ class AuroDependencyVersioning {
|
|
|
147
119
|
}
|
|
148
120
|
}
|
|
149
121
|
|
|
150
|
-
/**
|
|
151
|
-
* @license
|
|
152
|
-
* Copyright 2017 Google LLC
|
|
153
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
154
|
-
*/
|
|
155
|
-
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)}}
|
|
156
|
-
|
|
157
|
-
/**
|
|
158
|
-
* @license
|
|
159
|
-
* Copyright 2018 Google LLC
|
|
160
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
161
|
-
*/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}});
|
|
162
|
-
|
|
163
|
-
/**
|
|
164
|
-
* @license
|
|
165
|
-
* Copyright 2018 Google LLC
|
|
166
|
-
* SPDX-License-Identifier: BSD-3-Clause
|
|
167
|
-
*/const o=o=>o??E;
|
|
168
|
-
|
|
169
122
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
170
123
|
// See LICENSE in the project root for license information.
|
|
171
124
|
|
|
@@ -176,7 +129,7 @@ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{cons
|
|
|
176
129
|
* @attr {Boolean} hiddenAudible - If present, the component will be hidden from screen readers, but seen visually
|
|
177
130
|
*/
|
|
178
131
|
|
|
179
|
-
class AuroElement extends
|
|
132
|
+
class AuroElement extends LitElement {
|
|
180
133
|
|
|
181
134
|
// function to define props used within the scope of this component
|
|
182
135
|
static get properties() {
|
|
@@ -232,7 +185,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
232
185
|
return _fetchMap.get(uri);
|
|
233
186
|
};
|
|
234
187
|
|
|
235
|
-
var styleCss$1 =
|
|
188
|
+
var styleCss$1 = css`: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}:host .logo{color:var(--ds-color-brand-midnight-400, #01426a)}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}`;
|
|
236
189
|
|
|
237
190
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
238
191
|
// See LICENSE in the project root for license information.
|
|
@@ -271,7 +224,7 @@ class BaseIcon extends AuroElement {
|
|
|
271
224
|
}
|
|
272
225
|
|
|
273
226
|
static get styles() {
|
|
274
|
-
return
|
|
227
|
+
return css`
|
|
275
228
|
${styleCss$1}
|
|
276
229
|
`;
|
|
277
230
|
}
|
|
@@ -313,47 +266,88 @@ class BaseIcon extends AuroElement {
|
|
|
313
266
|
}
|
|
314
267
|
}
|
|
315
268
|
|
|
316
|
-
var tokensCss =
|
|
269
|
+
var tokensCss = css`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
317
270
|
|
|
318
|
-
var colorCss =
|
|
271
|
+
var colorCss = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color:var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color:var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color:var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color:var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color:var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color:var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color:var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
319
272
|
|
|
320
|
-
// Copyright (c)
|
|
273
|
+
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
321
274
|
// See LICENSE in the project root for license information.
|
|
322
275
|
|
|
276
|
+
// ---------------------------------------------------------------------
|
|
277
|
+
|
|
278
|
+
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
279
|
+
|
|
280
|
+
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
281
|
+
|
|
282
|
+
/* eslint-disable jsdoc/require-param */
|
|
283
|
+
|
|
284
|
+
/**
|
|
285
|
+
* This will register a new custom element with the browser.
|
|
286
|
+
* @param {String} name - The name of the custom element.
|
|
287
|
+
* @param {Object} componentClass - The class to register as a custom element.
|
|
288
|
+
* @returns {void}
|
|
289
|
+
*/
|
|
290
|
+
registerComponent(name, componentClass) {
|
|
291
|
+
if (!customElements.get(name)) {
|
|
292
|
+
customElements.define(name, class extends componentClass {});
|
|
293
|
+
}
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
/**
|
|
297
|
+
* Finds and returns the closest HTML Element based on a selector.
|
|
298
|
+
* @returns {void}
|
|
299
|
+
*/
|
|
300
|
+
closestElement(
|
|
301
|
+
selector, // selector like in .closest()
|
|
302
|
+
base = this, // extra functionality to skip a parent
|
|
303
|
+
__Closest = (el, found = el && el.closest(selector)) =>
|
|
304
|
+
!el || el === document || el === window
|
|
305
|
+
? null // standard .closest() returns null for non-found selectors also
|
|
306
|
+
: found
|
|
307
|
+
? found // found a selector INside this element
|
|
308
|
+
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
309
|
+
) {
|
|
310
|
+
return __Closest(base);
|
|
311
|
+
}
|
|
312
|
+
/* eslint-enable jsdoc/require-param */
|
|
313
|
+
|
|
314
|
+
/**
|
|
315
|
+
* If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
|
|
316
|
+
* @param {Object} elem - The element to check.
|
|
317
|
+
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
318
|
+
* @returns {void}
|
|
319
|
+
*/
|
|
320
|
+
handleComponentTagRename(elem, tagName) {
|
|
321
|
+
const tag = tagName.toLowerCase();
|
|
322
|
+
const elemTag = elem.tagName.toLowerCase();
|
|
323
|
+
|
|
324
|
+
if (elemTag !== tag) {
|
|
325
|
+
elem.setAttribute(tag, true);
|
|
326
|
+
}
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
/**
|
|
330
|
+
* Validates if an element is a specific Auro component.
|
|
331
|
+
* @param {Object} elem - The element to validate.
|
|
332
|
+
* @param {String} tagName - The name of the Auro component to check against.
|
|
333
|
+
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
334
|
+
*/
|
|
335
|
+
elementMatch(elem, tagName) {
|
|
336
|
+
const tag = tagName.toLowerCase();
|
|
337
|
+
const elemTag = elem.tagName.toLowerCase();
|
|
338
|
+
|
|
339
|
+
return elemTag === tag || elem.hasAttribute(tag);
|
|
340
|
+
}
|
|
341
|
+
};
|
|
342
|
+
|
|
343
|
+
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
344
|
+
// See LICENSE in the project root for license information.
|
|
323
345
|
|
|
324
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
325
|
-
/**
|
|
326
|
-
* auro-icon provides users a way to use the Auro Icons by simply passing in the category and name.
|
|
327
|
-
*
|
|
328
|
-
* @attr {String} category - The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
|
|
329
|
-
* @attr {String} name - The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage
|
|
330
|
-
* @attr {Boolean} customColor - Removes primary selector.
|
|
331
|
-
* @attr {Boolean} customSvg - When true, auro-icon will render a custom SVG inside the default slot.
|
|
332
|
-
* @attr {Boolean} label - Exposes content in slot as icon label.
|
|
333
|
-
* @attr {Boolean} primary - DEPRECATED: Sets the icon to use the baseline primary icon style.
|
|
334
|
-
* @attr {Boolean} accent - Sets the icon to use the accent style.
|
|
335
|
-
* @attr {Boolean} emphasis - Sets the icon to use the emphasis style.
|
|
336
|
-
* @attr {Boolean} disabled - Sets the icon to use the disabled style.
|
|
337
|
-
* @attr {Boolean} error - Sets the icon to use the error style.
|
|
338
|
-
* @attr {Boolean} info - Sets the icon to use the info style.
|
|
339
|
-
* @attr {Boolean} secondary - Sets the icon to use the secondary style.
|
|
340
|
-
* @attr {Boolean} tertiary - Sets the icon to use the tertiary style.
|
|
341
|
-
* @attr {Boolean} subtle - Sets the icon to use the subtle style.
|
|
342
|
-
* @attr {Boolean} success - Sets the icon to use the success style.
|
|
343
|
-
* @attr {Boolean} warning - Sets the icon to use the warning style.
|
|
344
|
-
* @attr {String} ariaHidden - Set aria-hidden value. Default is `true`. Option is `false`.
|
|
345
|
-
* @attr {String} uri - Set the uri for CDN used when fetching icons
|
|
346
|
-
* @slot - Hidden from visibility, used for a11y if icon description is needed.
|
|
347
|
-
* @slot svg - Used for custom SVG content.
|
|
348
|
-
*/
|
|
349
346
|
|
|
350
|
-
// build the component class
|
|
351
347
|
class AuroIcon extends BaseIcon {
|
|
352
348
|
constructor() {
|
|
353
349
|
super();
|
|
354
350
|
|
|
355
|
-
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
356
|
-
|
|
357
351
|
this.privateDefaults();
|
|
358
352
|
}
|
|
359
353
|
|
|
@@ -377,78 +371,144 @@ class AuroIcon extends BaseIcon {
|
|
|
377
371
|
this.success = false;
|
|
378
372
|
this.tertiary = false;
|
|
379
373
|
this.warning = false;
|
|
380
|
-
this.
|
|
374
|
+
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
375
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
381
376
|
}
|
|
382
377
|
|
|
383
378
|
// function to define props used within the scope of this component
|
|
384
379
|
static get properties() {
|
|
385
380
|
return {
|
|
386
381
|
...super.properties,
|
|
382
|
+
|
|
383
|
+
/**
|
|
384
|
+
* Sets the icon to use the accent style.
|
|
385
|
+
*/
|
|
387
386
|
accent: {
|
|
388
387
|
type: Boolean,
|
|
389
388
|
reflect: true
|
|
390
389
|
},
|
|
390
|
+
|
|
391
|
+
/**
|
|
392
|
+
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
393
|
+
*/
|
|
391
394
|
ariaHidden: {
|
|
392
395
|
type: String,
|
|
393
396
|
reflect: true
|
|
394
397
|
},
|
|
398
|
+
|
|
399
|
+
/**
|
|
400
|
+
* The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
|
|
401
|
+
*/
|
|
395
402
|
category: {
|
|
396
403
|
type: String,
|
|
397
404
|
reflect: true
|
|
398
405
|
},
|
|
406
|
+
|
|
407
|
+
/**
|
|
408
|
+
* Allows custom color to be set.
|
|
409
|
+
*/
|
|
399
410
|
customColor: {
|
|
400
411
|
type: Boolean
|
|
401
412
|
},
|
|
413
|
+
|
|
414
|
+
/**
|
|
415
|
+
* When true, auro-icon will render a custom SVG inside the default slot.
|
|
416
|
+
*/
|
|
402
417
|
customSvg: {
|
|
403
418
|
type: Boolean
|
|
404
419
|
},
|
|
420
|
+
|
|
421
|
+
/**
|
|
422
|
+
* Sets the icon to use the disabled style.
|
|
423
|
+
*/
|
|
405
424
|
disabled: {
|
|
406
425
|
type: Boolean,
|
|
407
426
|
reflect: true
|
|
408
427
|
},
|
|
428
|
+
|
|
429
|
+
/**
|
|
430
|
+
* Sets the icon to use the emphasis style.
|
|
431
|
+
*/
|
|
409
432
|
emphasis: {
|
|
410
433
|
type: Boolean,
|
|
411
434
|
reflect: true
|
|
412
435
|
},
|
|
436
|
+
|
|
437
|
+
/**
|
|
438
|
+
* Sets the icon to use the error style.
|
|
439
|
+
*/
|
|
413
440
|
error: {
|
|
414
441
|
type: Boolean,
|
|
415
442
|
reflect: true
|
|
416
443
|
},
|
|
444
|
+
|
|
445
|
+
/**
|
|
446
|
+
* Sets the icon to use the info style.
|
|
447
|
+
*/
|
|
417
448
|
info: {
|
|
418
449
|
type: Boolean,
|
|
419
450
|
reflect: true
|
|
420
451
|
},
|
|
452
|
+
|
|
453
|
+
/**
|
|
454
|
+
* Exposes content in slot as icon label.
|
|
455
|
+
*/
|
|
421
456
|
label: {
|
|
422
457
|
type: Boolean,
|
|
423
458
|
reflect: true
|
|
424
459
|
},
|
|
460
|
+
|
|
461
|
+
/**
|
|
462
|
+
* The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
|
|
463
|
+
*/
|
|
425
464
|
name: {
|
|
426
465
|
type: String,
|
|
427
466
|
reflect: true
|
|
428
467
|
},
|
|
468
|
+
|
|
469
|
+
/**
|
|
470
|
+
* DEPRECATED: Sets the icon to use the baseline primary icon style.
|
|
471
|
+
*/
|
|
429
472
|
primary: {
|
|
430
473
|
type: Boolean,
|
|
431
474
|
reflect: true
|
|
432
475
|
},
|
|
476
|
+
|
|
477
|
+
/**
|
|
478
|
+
* Sets the icon to use the secondary style.
|
|
479
|
+
*/
|
|
433
480
|
secondary: {
|
|
434
481
|
type: Boolean,
|
|
435
482
|
reflect: true
|
|
436
483
|
},
|
|
484
|
+
|
|
485
|
+
/**
|
|
486
|
+
* Sets the icon to use the subtle style.
|
|
487
|
+
*/
|
|
437
488
|
subtle: {
|
|
438
489
|
type: Boolean,
|
|
439
490
|
reflect: true
|
|
440
491
|
},
|
|
492
|
+
|
|
493
|
+
/**
|
|
494
|
+
* Sets the icon to use the success style.
|
|
495
|
+
*/
|
|
441
496
|
success: {
|
|
442
497
|
type: Boolean,
|
|
443
498
|
reflect: true
|
|
444
499
|
},
|
|
500
|
+
|
|
501
|
+
/**
|
|
502
|
+
* Sets the icon to use the tertiary style.
|
|
503
|
+
*/
|
|
445
504
|
tertiary: {
|
|
446
505
|
type: Boolean,
|
|
447
506
|
reflect: true
|
|
448
507
|
},
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
508
|
+
|
|
509
|
+
/**
|
|
510
|
+
* Sets the icon to use the warning style.
|
|
511
|
+
*/
|
|
452
512
|
warning: {
|
|
453
513
|
type: Boolean,
|
|
454
514
|
reflect: true
|
|
@@ -459,9 +519,9 @@ class AuroIcon extends BaseIcon {
|
|
|
459
519
|
static get styles() {
|
|
460
520
|
return [
|
|
461
521
|
super.styles,
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
522
|
+
css`${tokensCss}`,
|
|
523
|
+
css`${styleCss$1}`,
|
|
524
|
+
css`${colorCss}`
|
|
465
525
|
];
|
|
466
526
|
}
|
|
467
527
|
|
|
@@ -474,7 +534,7 @@ class AuroIcon extends BaseIcon {
|
|
|
474
534
|
*
|
|
475
535
|
*/
|
|
476
536
|
static register(name = "auro-icon") {
|
|
477
|
-
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroIcon);
|
|
537
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroIcon);
|
|
478
538
|
}
|
|
479
539
|
|
|
480
540
|
connectedCallback() {
|
|
@@ -485,38 +545,54 @@ class AuroIcon extends BaseIcon {
|
|
|
485
545
|
}
|
|
486
546
|
|
|
487
547
|
/**
|
|
548
|
+
* @private
|
|
488
549
|
* @returns {void} Exposes CSS parts for styling from parent components.
|
|
489
550
|
*/
|
|
490
551
|
exposeCssParts() {
|
|
491
552
|
this.setAttribute('exportparts', 'svg:iconSvg');
|
|
492
553
|
}
|
|
493
554
|
|
|
555
|
+
async firstUpdated() {
|
|
556
|
+
await super.firstUpdated();
|
|
557
|
+
|
|
558
|
+
// Removes the SVG description for screenreader if ariaHidden is set to true
|
|
559
|
+
if (!this.hasAttribute('ariaHidden') && this.svg) {
|
|
560
|
+
const svgDesc = this.svg.querySelector('desc');
|
|
561
|
+
|
|
562
|
+
if (svgDesc) {
|
|
563
|
+
svgDesc.remove();
|
|
564
|
+
this.svg.removeAttribute('aria-labelledby');
|
|
565
|
+
}
|
|
566
|
+
}
|
|
567
|
+
}
|
|
568
|
+
|
|
494
569
|
// function that renders the HTML and CSS into the scope of the component
|
|
495
570
|
render() {
|
|
496
|
-
const
|
|
497
|
-
'
|
|
571
|
+
const labelClasses = {
|
|
572
|
+
'labelWrapper': true,
|
|
498
573
|
'util_displayHiddenVisually': !this.label
|
|
499
574
|
};
|
|
500
575
|
|
|
501
|
-
const
|
|
502
|
-
'
|
|
503
|
-
'wrapper': true,
|
|
576
|
+
const svgClasses = {
|
|
577
|
+
'svgWrapper': true,
|
|
504
578
|
};
|
|
505
579
|
|
|
506
|
-
return
|
|
507
|
-
<div
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
${this.
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
580
|
+
return html`
|
|
581
|
+
<div class="componentWrapper">
|
|
582
|
+
<div
|
|
583
|
+
class="${classMap(svgClasses)}"
|
|
584
|
+
title="${ifDefined(this.title || undefined)}">
|
|
585
|
+
<span aria-hidden="${ifDefined(this.ariaHidden || true)}" part="svg">
|
|
586
|
+
${this.customSvg ? html`
|
|
587
|
+
<slot name="svg"></slot>
|
|
588
|
+
` : html`
|
|
589
|
+
${this.svg}
|
|
590
|
+
`
|
|
591
|
+
}
|
|
592
|
+
</span>
|
|
593
|
+
</div>
|
|
594
|
+
|
|
595
|
+
<div class="${classMap(labelClasses)}">
|
|
520
596
|
<slot></slot>
|
|
521
597
|
</div>
|
|
522
598
|
</div>
|
|
@@ -524,9 +600,79 @@ class AuroIcon extends BaseIcon {
|
|
|
524
600
|
}
|
|
525
601
|
}
|
|
526
602
|
|
|
527
|
-
var iconVersion = '
|
|
603
|
+
var iconVersion = '7.0.1';
|
|
604
|
+
|
|
605
|
+
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
606
|
+
// See LICENSE in the project root for license information.
|
|
607
|
+
|
|
608
|
+
// ---------------------------------------------------------------------
|
|
609
|
+
|
|
610
|
+
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
611
|
+
|
|
612
|
+
class AuroLibraryRuntimeUtils {
|
|
613
|
+
|
|
614
|
+
/* eslint-disable jsdoc/require-param */
|
|
615
|
+
|
|
616
|
+
/**
|
|
617
|
+
* This will register a new custom element with the browser.
|
|
618
|
+
* @param {String} name - The name of the custom element.
|
|
619
|
+
* @param {Object} componentClass - The class to register as a custom element.
|
|
620
|
+
* @returns {void}
|
|
621
|
+
*/
|
|
622
|
+
registerComponent(name, componentClass) {
|
|
623
|
+
if (!customElements.get(name)) {
|
|
624
|
+
customElements.define(name, class extends componentClass {});
|
|
625
|
+
}
|
|
626
|
+
}
|
|
627
|
+
|
|
628
|
+
/**
|
|
629
|
+
* Finds and returns the closest HTML Element based on a selector.
|
|
630
|
+
* @returns {void}
|
|
631
|
+
*/
|
|
632
|
+
closestElement(
|
|
633
|
+
selector, // selector like in .closest()
|
|
634
|
+
base = this, // extra functionality to skip a parent
|
|
635
|
+
__Closest = (el, found = el && el.closest(selector)) =>
|
|
636
|
+
!el || el === document || el === window
|
|
637
|
+
? null // standard .closest() returns null for non-found selectors also
|
|
638
|
+
: found
|
|
639
|
+
? found // found a selector INside this element
|
|
640
|
+
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
641
|
+
) {
|
|
642
|
+
return __Closest(base);
|
|
643
|
+
}
|
|
644
|
+
/* eslint-enable jsdoc/require-param */
|
|
645
|
+
|
|
646
|
+
/**
|
|
647
|
+
* If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
|
|
648
|
+
* @param {Object} elem - The element to check.
|
|
649
|
+
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
650
|
+
* @returns {void}
|
|
651
|
+
*/
|
|
652
|
+
handleComponentTagRename(elem, tagName) {
|
|
653
|
+
const tag = tagName.toLowerCase();
|
|
654
|
+
const elemTag = elem.tagName.toLowerCase();
|
|
655
|
+
|
|
656
|
+
if (elemTag !== tag) {
|
|
657
|
+
elem.setAttribute(tag, true);
|
|
658
|
+
}
|
|
659
|
+
}
|
|
660
|
+
|
|
661
|
+
/**
|
|
662
|
+
* Validates if an element is a specific Auro component.
|
|
663
|
+
* @param {Object} elem - The element to validate.
|
|
664
|
+
* @param {String} tagName - The name of the Auro component to check against.
|
|
665
|
+
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
666
|
+
*/
|
|
667
|
+
elementMatch(elem, tagName) {
|
|
668
|
+
const tag = tagName.toLowerCase();
|
|
669
|
+
const elemTag = elem.tagName.toLowerCase();
|
|
670
|
+
|
|
671
|
+
return elemTag === tag || elem.hasAttribute(tag);
|
|
672
|
+
}
|
|
673
|
+
}
|
|
528
674
|
|
|
529
|
-
var styleCss =
|
|
675
|
+
var styleCss = css`.heading{margin:1.75rem 0;letter-spacing:var(--ds-text-heading-default-spacing, -0.2px);font-weight:var(--ds-text-heading-default-weight, 500)}.heading--display{margin-top:0;font-size:var(--ds-text-heading-display-size-breakpoint-sm, 2.75rem);font-weight:var(--ds-text-heading-display-weight, 100);line-height:var(--ds-text-heading-display-height-breakpoint-sm, 3.375rem)}@media screen and (min-width: 768px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-md, 3rem);line-height:var(--ds-text-heading-display-height-breakpoint-md, 3.75rem)}}@media screen and (min-width: 1024px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-lg, 3.5rem);line-height:var(--ds-text-heading-display-height-breakpoint-lg, 4.25rem)}}.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-sm, 2rem);font-weight:var(--ds-text-heading-800-weight, 500);line-height:var(--ds-text-heading-800-height-breakpoint-sm, 2.375rem)}@media screen and (min-width: 768px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-md, 2.25rem);line-height:var(--ds-text-heading-800-height-breakpoint-md, 2.625rem)}}@media screen and (min-width: 1024px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-lg, 2.5rem);line-height:var(--ds-text-heading-800-height-breakpoint-lg, 3rem)}}.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-sm, 1.75rem);font-weight:var(--ds-text-heading-700-weight, 500);line-height:var(--ds-text-heading-700-height-breakpoint-sm, 2.125rem)}@media screen and (min-width: 768px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-md, 2rem);line-height:var(--ds-text-heading-700-height-breakpoint-md, 2.375rem)}}@media screen and (min-width: 1024px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-lg, 2.25rem);line-height:var(--ds-text-heading-700-height-breakpoint-lg, 2.75rem)}}.heading--600{margin:1rem 0;font-size:var(--ds-text-heading-600-size-breakpoint-sm, 1.625rem);font-weight:var(--ds-text-heading-600-weight, 300);line-height:var(--ds-text-heading-600-height-breakpoint-sm, 1.875rem)}@media screen and (min-width: 768px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-md, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-md, 2.125rem)}}@media screen and (min-width: 1024px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-lg, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-lg, 2.25rem)}}.heading--500{margin:1rem 0;font-size:var(--ds-text-heading-500-size-breakpoint-sm, 1.375rem);font-weight:var(--ds-text-heading-500-weight, 300);line-height:var(--ds-text-heading-500-height-breakpoint-sm, 1.625rem)}@media screen and (min-width: 768px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-md, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-md, 1.875rem)}}@media screen and (min-width: 1024px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-lg, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-lg, 2rem)}}.heading--400{margin:.75rem 0;font-size:var(--ds-text-heading-400-size, 1.25rem);font-weight:var(--ds-text-heading-400-weight, 300);line-height:var(--ds-text-heading-400-height, 1.625rem)}.heading--300{margin:.75rem 0;font-size:var(--ds-text-heading-300-size, 1.125rem);font-weight:var(--ds-text-heading-300-weight, 300);line-height:var(--ds-text-heading-300-height, 1.625rem)}:host([no-margin-block]) .heading{margin-block:0}.util_stackMarginnone--bottom{margin-bottom:0}.util_stackMargin25--bottom{margin-bottom:var(--ds-size-25, 0.125rem)}.util_stackMargin50--bottom{margin-bottom:var(--ds-size-50, 0.25rem)}.util_stackMargin100--bottom{margin-bottom:var(--ds-size-100, 0.5rem)}.util_stackMargin150--bottom{margin-bottom:var(--ds-size-150, 0.75rem)}.util_stackMargin200--bottom{margin-bottom:var(--ds-size-200, 1rem)}.util_stackMargin300--bottom{margin-bottom:var(--ds-size-300, 1.5rem)}.util_stackMargin400--bottom{margin-bottom:var(--ds-size-400, 2rem)}.util_stackMargin600--bottom{margin-bottom:var(--ds-size-600, 3rem)}.util_stackMargin800--bottom{margin-bottom:var(--ds-size-800, 4rem)}.util_stackMarginnone--top{margin-top:0}.util_stackMargin25--top{margin-top:var(--ds-size-25, 0.125rem)}.util_stackMargin50--top{margin-top:var(--ds-size-50, 0.25rem)}.util_stackMargin100--top{margin-top:var(--ds-size-100, 0.5rem)}.util_stackMargin150--top{margin-top:var(--ds-size-150, 0.75rem)}.util_stackMargin200--top{margin-top:var(--ds-size-200, 1rem)}.util_stackMargin300--top{margin-top:var(--ds-size-300, 1.5rem)}.util_stackMargin400--top{margin-top:var(--ds-size-400, 2rem)}.util_stackMargin600--top{margin-top:var(--ds-size-600, 3rem)}.util_stackMargin800--top{margin-top:var(--ds-size-800, 4rem)}`;
|
|
530
676
|
|
|
531
677
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
532
678
|
// See LICENSE in the project root for license information.
|
|
@@ -546,7 +692,7 @@ var styleCss = i$5`.heading{margin:1.75rem 0;letter-spacing:var(--ds-text-headin
|
|
|
546
692
|
/* eslint complexity: ["error", 21] */
|
|
547
693
|
|
|
548
694
|
// build the component class
|
|
549
|
-
class AuroHeader extends
|
|
695
|
+
class AuroHeader extends LitElement {
|
|
550
696
|
constructor() {
|
|
551
697
|
super();
|
|
552
698
|
|
|
@@ -653,12 +799,12 @@ class AuroHeader extends r {
|
|
|
653
799
|
}
|
|
654
800
|
|
|
655
801
|
switch (level) {
|
|
656
|
-
case '2': return
|
|
657
|
-
case '3': return
|
|
658
|
-
case '4': return
|
|
659
|
-
case '5': return
|
|
660
|
-
case '6': return
|
|
661
|
-
default: return
|
|
802
|
+
case '2': return html`<h2 class="heading heading--${this.display} ${this.spacingDecision(this.size)}" style="color: ${ifDefined(this.color ? this.color : undefined)}"><slot></slot></h2>`;
|
|
803
|
+
case '3': return html`<h3 class="heading heading--${this.display} ${this.spacingDecision(this.size)}" style="color: ${ifDefined(this.color ? this.color : undefined)}"><slot></slot></h3>`;
|
|
804
|
+
case '4': return html`<h4 class="heading heading--${this.display} ${this.spacingDecision(this.size)}" style="color: ${ifDefined(this.color ? this.color : undefined)}"><slot></slot></h4>`;
|
|
805
|
+
case '5': return html`<h5 class="heading heading--${this.display} ${this.spacingDecision(this.size)}" style="color: ${ifDefined(this.color ? this.color : undefined)}"><slot></slot></h5>`;
|
|
806
|
+
case '6': return html`<h6 class="heading heading--${this.display} ${this.spacingDecision(this.size)}" style="color: ${ifDefined(this.color ? this.color : undefined)}"><slot></slot></h6>`;
|
|
807
|
+
default: return html`<h1 class="heading heading--${this.display} ${this.spacingDecision(this.size)}" style="color: ${ifDefined(this.color ? this.color : undefined)}"><slot></slot></h1>`;
|
|
662
808
|
}
|
|
663
809
|
}
|
|
664
810
|
// function that renders the HTML and CSS into the scope of the component
|
|
@@ -674,16 +820,16 @@ var headerVersion = '4.0.0';
|
|
|
674
820
|
// See LICENSE in the project root for license information.
|
|
675
821
|
|
|
676
822
|
|
|
677
|
-
class AuroBibtemplate extends
|
|
823
|
+
class AuroBibtemplate extends LitElement {
|
|
678
824
|
|
|
679
825
|
constructor() {
|
|
680
826
|
super();
|
|
681
827
|
|
|
682
|
-
AuroLibraryRuntimeUtils.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
|
|
828
|
+
AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
|
|
683
829
|
|
|
684
830
|
const versioning = new AuroDependencyVersioning();
|
|
685
|
-
this.iconTag = versioning.generateTag('auro-icon', iconVersion, AuroIcon);
|
|
686
|
-
this.headerTag = versioning.generateTag('auro-header', headerVersion, AuroHeader);
|
|
831
|
+
this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion, AuroIcon);
|
|
832
|
+
this.headerTag = versioning.generateTag('auro-formkit-bibtemplate-header', headerVersion, AuroHeader);
|
|
687
833
|
}
|
|
688
834
|
|
|
689
835
|
static get styles() {
|
|
@@ -718,7 +864,7 @@ class AuroBibtemplate extends r {
|
|
|
718
864
|
*
|
|
719
865
|
*/
|
|
720
866
|
static register(name = "auro-bibtemplate") {
|
|
721
|
-
AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroBibtemplate);
|
|
867
|
+
AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroBibtemplate);
|
|
722
868
|
}
|
|
723
869
|
|
|
724
870
|
/**
|
|
@@ -760,9 +906,9 @@ class AuroBibtemplate extends r {
|
|
|
760
906
|
|
|
761
907
|
// function that renders the HTML and CSS into the scope of the component
|
|
762
908
|
render() {
|
|
763
|
-
return
|
|
909
|
+
return html$1`
|
|
764
910
|
<div id="bibTemplate" part="bibtemplate">
|
|
765
|
-
${this.isFullscreen ?
|
|
911
|
+
${this.isFullscreen ? html$1`
|
|
766
912
|
<div id="headerContainer">
|
|
767
913
|
<button id="closeButton" @click="${this.onCloseButtonClick}">
|
|
768
914
|
<${this.iconTag} category="interface" name="x-lg"></${this.iconTag}>
|
|
@@ -779,7 +925,7 @@ class AuroBibtemplate extends r {
|
|
|
779
925
|
<slot></slot>
|
|
780
926
|
</div>
|
|
781
927
|
|
|
782
|
-
${this.isFullscreen ?
|
|
928
|
+
${this.isFullscreen ? html$1`
|
|
783
929
|
<div id="footerContainer">
|
|
784
930
|
<slot name="footer"></slot>
|
|
785
931
|
</div>` : null}
|