@aurodesignsystem-dev/auro-table 0.0.0-pr134.1 → 0.0.0-pr139.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +267 -43
- package/custom-elements.json +563 -0
- package/demo/api.html +1 -1
- package/demo/api.md +43 -31
- package/demo/auro-table.min.js +532 -59
- package/demo/index.html +1 -1
- package/demo/index.md +26 -120
- package/dist/auro-table-C52RNUva.js +12 -0
- package/dist/index.d.ts +185 -15
- package/dist/index.js +1 -1
- package/dist/registered.js +1 -1
- package/package.json +20 -11
- package/dist/auro-table-CifFJTj6.js +0 -11
package/demo/auro-table.min.js
CHANGED
|
@@ -3,26 +3,51 @@
|
|
|
3
3
|
* Copyright 2019 Google LLC
|
|
4
4
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
5
5
|
*/
|
|
6
|
-
const t$
|
|
6
|
+
const t$2=globalThis,e$5=t$2.ShadowRoot&&(void 0===t$2.ShadyCSS||t$2.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$3=Symbol(),o$5=new WeakMap;let n$4 = class n{constructor(t,e,o){if(this._$cssResult$=true,o!==s$3)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$5&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$5.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$5.set(s,t));}return t}toString(){return this.cssText}};const r$3=t=>new n$4("string"==typeof t?t:t+"",void 0,s$3),i$4=(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$4(o,t,s$3)},S$1=(s,o)=>{if(e$5)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$2.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$3=e$5?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$3(e)})(t):t;
|
|
7
7
|
|
|
8
8
|
/**
|
|
9
9
|
* @license
|
|
10
10
|
* Copyright 2017 Google LLC
|
|
11
11
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
12
|
-
*/const{is:i$
|
|
12
|
+
*/const{is:i$3,defineProperty:e$4,getOwnPropertyDescriptor:h$3,getOwnPropertyNames:r$2,getOwnPropertySymbols:o$4,getPrototypeOf:n$3}=Object,a$1=globalThis,c$2=a$1.trustedTypes,l$1=c$2?c$2.emptyScript:"",p$1=a$1.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$3=(t,s)=>!i$3(t,s),b={attribute:true,type:String,converter:u$1,reflect:false,useDefault:false,hasChanged:f$3};Symbol.metadata??=Symbol("metadata"),a$1.litPropertyMetadata??=new WeakMap;let y$1 = class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b){if(s.state&&(s.attribute=false),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=true),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e$4(this.prototype,t,h);}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h$3(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i);},configurable:true,enumerable:true}}static getPropertyOptions(t){return this.elementProperties.get(t)??b}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$3(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=true,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...r$2(t),...o$4(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$3(s));}else void 0!==s&&i.push(c$3(s));return i}static _$Eu(t,s){const i=s.attribute;return false===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=false,this.hasUpdated=false,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(true),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&true===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u$1).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$1;this._$Em=e,this[e]=h.fromAttribute(s,t.type)??this._$Ej?.get(e)??null,this._$Em=null;}}requestUpdate(t,s,i){if(void 0!==t){const e=this.constructor,h=this[t];if(i??=e.getPropertyOptions(t),!((i.hasChanged??f$3)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(e._$Eu(t,i))))return;this.C(t,s,i);} false===this.isUpdatePending&&(this._$ES=this._$EP());}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),true!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),true===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t));}async _$EP(){this.isUpdatePending=true;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];true!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e);}}let t=false;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EM();}catch(s){throw t=false,this._$EM(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=true,this.firstUpdated(t)),this.updated(t);}_$EM(){this._$AL=new Map,this.isUpdatePending=false;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return true}update(t){this._$Eq&&=this._$Eq.forEach((t=>this._$ET(t,this[t]))),this._$EM();}updated(t){}firstUpdated(t){}};y$1.elementStyles=[],y$1.shadowRootOptions={mode:"open"},y$1[d$1("elementProperties")]=new Map,y$1[d$1("finalized")]=new Map,p$1?.({ReactiveElement:y$1}),(a$1.reactiveElementVersions??=[]).push("2.1.0");
|
|
13
13
|
|
|
14
14
|
/**
|
|
15
15
|
* @license
|
|
16
16
|
* Copyright 2017 Google LLC
|
|
17
17
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
18
18
|
*/
|
|
19
|
-
const t=globalThis,i$
|
|
19
|
+
const t$1=globalThis,i$2=t$1.trustedTypes,s$2=i$2?i$2.createPolicy("lit-html",{createHTML:t=>t}):void 0,e$3="$lit$",h$2=`lit$${Math.random().toFixed(9).slice(2)}$`,o$3="?"+h$2,n$2=`<${o$3}>`,r$1=document,l=()=>r$1.createComment(""),c$1=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a=Array.isArray,u=t=>a(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f$2=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),T=Symbol.for("lit-noChange"),E=Symbol.for("lit-nothing"),A=new WeakMap,C=r$1.createTreeWalker(r$1,129);function P(t,i){if(!a(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==s$2?s$2.createHTML(i):i}const V=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":3===i?"<math>":"",c=f$2;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f$2?"!--"===u[1]?c=v:void 0!==u[1]?c=_:void 0!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):void 0!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f$2,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f$2:(c=m,r=void 0);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f$2?s+n$2:d>=0?(o.push(a),s.slice(0,d)+e$3+s.slice(d)+h$2+x):s+h$2+(-2===d?i:x);}return [P(t,l+(t[s]||"<?>")+(2===i?"</svg>":3===i?"</math>":"")),o]};class N{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=V(t,s);if(this.el=N.createElement(f,n),C.currentNode=this.el.content,2===s||3===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=C.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$3)){const i=v[a++],s=r.getAttribute(t).split(h$2),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?H:"?"===e[1]?I:"@"===e[1]?L:k}),r.removeAttribute(t);}else t.startsWith(h$2)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h$2),s=t.length-1;if(s>0){r.textContent=i$2?i$2.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l()),C.nextNode(),d.push({type:2,index:++c});r.append(t[s],l());}}}else if(8===r.nodeType)if(r.data===o$3)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h$2,t+1));)d.push({type:7,index:c}),t+=h$2.length-1;}c++;}}static createElement(t,i){const s=r$1.createElement("template");return s.innerHTML=t,s}}function S(t,i,s=t,e){if(i===T)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=c$1(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(false),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=S(t,h._$AS(t,i.values),h,e)),i}class M{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$1).importNode(i,true);C.currentNode=e;let h=C.nextNode(),o=0,n=0,l=s[0];for(;void 0!==l;){if(o===l.index){let i;2===l.type?i=new R(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new z(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=C.nextNode(),o++);}return C.currentNode=r$1,e}p(t){let i=0;for(const s of this._$AV) void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class R{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=E,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??true;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=S(this,t,i),c$1(t)?t===E||null==t||""===t?(this._$AH!==E&&this._$AR(),this._$AH=E):t!==this._$AH&&t!==T&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):u(t)?this.k(t):this._(t);}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t));}_(t){this._$AH!==E&&c$1(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$1.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=N.createElement(P(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new M(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return void 0===i&&A.set(t.strings,i=new N(t)),i}k(t){a(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()),this.O(l()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(false,true,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){ void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class k{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=E,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=E;}_$AI(t,i=this,s,e){const h=this.strings;let o=false;if(void 0===h)t=S(this,t,i,0),o=!c$1(t)||t!==this._$AH&&t!==T,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=S(this,e[s+n],i,n),r===T&&(r=this._$AH[n]),o||=!c$1(r)||r!==this._$AH[n],r===E?t=E:t!==E&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===E?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class H extends k{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===E?void 0:t;}}class I extends k{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==E);}}class L extends k{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=S(this,t,i,0)??E)===T)return;const s=this._$AH,e=t===E&&s!==E||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==E&&(s===E||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class z{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){S(this,t);}}const j=t$1.litHtmlPolyfillSupport;j?.(N,R),(t$1.litHtmlVersions??=[]).push("3.3.0");const B=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new R(i.insertBefore(l(),t),t,void 0,s??{});}return h._$AI(t),h};
|
|
20
20
|
|
|
21
21
|
/**
|
|
22
22
|
* @license
|
|
23
23
|
* Copyright 2017 Google LLC
|
|
24
24
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
25
|
-
*/const s=globalThis;class i extends y$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=B(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return T}}i._$litElement$=true,i["finalized"]=true,s.litElementHydrateSupport?.({LitElement:i});const o=s.litElementPolyfillSupport;o?.({LitElement:i});(s.litElementVersions??=[]).push("4.2.0");
|
|
25
|
+
*/const s$1=globalThis;let i$1 = class i extends y$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=B(r,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(true);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(false);}render(){return T}};i$1._$litElement$=true,i$1["finalized"]=true,s$1.litElementHydrateSupport?.({LitElement:i$1});const o$2=s$1.litElementPolyfillSupport;o$2?.({LitElement:i$1});(s$1.litElementVersions??=[]).push("4.2.0");
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* @license
|
|
29
|
+
* Copyright 2020 Google LLC
|
|
30
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
31
|
+
*/const f$1=o=>void 0===o.strings;
|
|
32
|
+
|
|
33
|
+
/**
|
|
34
|
+
* @license
|
|
35
|
+
* Copyright 2017 Google LLC
|
|
36
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
37
|
+
*/
|
|
38
|
+
const t={ATTRIBUTE:1,CHILD:2},e$2=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
|
|
39
|
+
|
|
40
|
+
/**
|
|
41
|
+
* @license
|
|
42
|
+
* Copyright 2017 Google LLC
|
|
43
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
44
|
+
*/const s=(i,t)=>{const e=i._$AN;if(void 0===e)return false;for(const i of e)i._$AO?.(t,false),s(i,t);return true},o$1=i=>{let t,e;do{if(void 0===(t=i._$AM))break;e=t._$AN,e.delete(i),i=t;}while(0===e?.size)},r=i=>{for(let t;t=i._$AM;i=t){let e=t._$AN;if(void 0===e)t._$AN=e=new Set;else if(e.has(i))break;e.add(i),c(t);}};function h$1(i){ void 0!==this._$AN?(o$1(this),this._$AM=i,r(this)):this._$AM=i;}function n$1(i,t=false,e=0){const r=this._$AH,h=this._$AN;if(void 0!==h&&0!==h.size)if(t)if(Array.isArray(r))for(let i=e;i<r.length;i++)s(r[i],false),o$1(r[i]);else null!=r&&(s(r,false),o$1(r));else s(this,i);}const c=i=>{i.type==t.CHILD&&(i._$AP??=n$1,i._$AQ??=h$1);};class f extends i{constructor(){super(...arguments),this._$AN=void 0;}_$AT(i,t,e){super._$AT(i,t,e),r(this),this.isConnected=i._$AU;}_$AO(i,t=true){i!==this.isConnected&&(this.isConnected=i,i?this.reconnected?.():this.disconnected?.()),t&&(s(this,i),o$1(this));}setValue(t){if(f$1(this._$Ct))this._$Ct._$AI(t,this);else {const i=[...this._$Ct._$AH];i[this._$Ci]=t,this._$Ct._$AI(i,this,0);}}disconnected(){}reconnected(){}}
|
|
45
|
+
|
|
46
|
+
/**
|
|
47
|
+
* @license
|
|
48
|
+
* Copyright 2020 Google LLC
|
|
49
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
50
|
+
*/const e$1=()=>new h;class h{}const o=new WeakMap,n=e$2(class extends f{render(i){return E}update(i,[s]){const e=s!==this.G;return e&&void 0!==this.G&&this.rt(void 0),(e||this.lt!==this.ct)&&(this.G=s,this.ht=i.options?.host,this.rt(this.ct=i.element)),E}rt(t){if(this.isConnected||(t=void 0),"function"==typeof this.G){const i=this.ht??globalThis;let s=o.get(i);void 0===s&&(s=new WeakMap,o.set(i,s)),void 0!==s.get(this.G)&&this.G.call(this.ht,void 0),s.set(this.G,t),void 0!==t&&this.G.call(this.ht,t);}else this.G.value=t;}get lt(){return "function"==typeof this.G?o.get(this.ht??globalThis)?.get(this.G):this.G?.value}disconnected(){this.lt===this.ct&&this.rt(void 0);}reconnected(){this.rt(this.ct);}});
|
|
26
51
|
|
|
27
52
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
28
53
|
// See LICENSE in the project root for license information.
|
|
@@ -92,45 +117,395 @@ class AuroLibraryRuntimeUtils {
|
|
|
92
117
|
|
|
93
118
|
return elemTag === tag || elem.hasAttribute(tag);
|
|
94
119
|
}
|
|
120
|
+
|
|
121
|
+
/**
|
|
122
|
+
* Gets the text content of a named slot.
|
|
123
|
+
* @returns {String}
|
|
124
|
+
* @private
|
|
125
|
+
*/
|
|
126
|
+
getSlotText(elem, name) {
|
|
127
|
+
const slot = elem.shadowRoot?.querySelector(`slot[name="${name}"]`);
|
|
128
|
+
const nodes = slot?.assignedNodes({ flatten: true }) || [];
|
|
129
|
+
const text = nodes.map(n => n.textContent?.trim()).join(' ').trim();
|
|
130
|
+
|
|
131
|
+
return text || null;
|
|
132
|
+
}
|
|
95
133
|
}
|
|
96
134
|
|
|
97
|
-
var styleCss = i$3`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host{display:block;overflow:scroll}@media screen and (min-width: 576px){:host{overflow:initial}}table{overflow:scroll;width:100%;margin-bottom:var(--ds-size-400, 2rem);border-collapse:collapse;border-spacing:var(--ds-size-100, .5rem)}thead{border-bottom:1px solid var(--ds-auro-table-border-color);border-collapse:collapse}tr:nth-child(2n){background-color:var(--ds-auro-table-alt-row-container-color)}th,td{padding:var(--ds-size-200, 1rem)}th{text-align:left}:host([nowrap]){white-space:nowrap}
|
|
135
|
+
var styleCss = i$4`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px,1px,1px,1px);width:1px;height:1px;padding:0;border:0}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}:host,auro-table,[auro-table]{display:block;overflow:auto}:host([nowrap]),auro-table[nowrap],[auro-table][nowrap]{white-space:nowrap}:host table,auro-table table,[auro-table] table{overflow:scroll;width:100%;margin-bottom:var(--ds-size-400, 2rem);border-collapse:collapse;border-spacing:var(--ds-size-100, .5rem)}:host table thead,auro-table table thead,[auro-table] table thead{border-bottom:1px solid var(--ds-auro-table-border-color);border-collapse:collapse}:host table tr:nth-child(2n),auro-table table tr:nth-child(2n),[auro-table] table tr:nth-child(2n){background-color:var(--ds-auro-table-alt-row-container-color)}:host table th,:host table td,auro-table table th,auro-table table td,[auro-table] table th,[auro-table] table td{padding:var(--ds-size-200, 1rem)}:host table th,auro-table table th,[auro-table] table th{text-align:left}
|
|
98
136
|
`;
|
|
99
137
|
|
|
100
|
-
var tokensCss = i$
|
|
138
|
+
var tokensCss = i$4`:host{--ds-auro-table-alt-row-container-color: var(--ds-basic-color-surface-neutral-subtle, #f7f7f7);--ds-auro-table-border-color: var(--ds-basic-color-border-subtle, #dddddd)}
|
|
101
139
|
`;
|
|
102
140
|
|
|
141
|
+
/**
|
|
142
|
+
* @class ChildItemService
|
|
143
|
+
* @description Service class that manages child items and exposes methods to add, remove, and subscribe to changes in the items array.
|
|
144
|
+
* This service allows components to:
|
|
145
|
+
* - Add and remove themselves/items from the service
|
|
146
|
+
* - Subscribe to notifications when items change
|
|
147
|
+
* - Track previous state of items for comparison
|
|
148
|
+
* The service implements a simple pub/sub pattern to notify components when the items collection changes.
|
|
149
|
+
*/
|
|
150
|
+
class ChildItemService {
|
|
151
|
+
/**
|
|
152
|
+
* @property {Array} items - An array to hold the auro-scrolleritems in the scroller.
|
|
153
|
+
* @private
|
|
154
|
+
*/
|
|
155
|
+
#items = [];
|
|
156
|
+
|
|
157
|
+
/**
|
|
158
|
+
* @property {Array} previousItems - An array to hold the previous items in the scroller.
|
|
159
|
+
* @private
|
|
160
|
+
*/
|
|
161
|
+
#previousItems = [];
|
|
162
|
+
|
|
163
|
+
/**
|
|
164
|
+
* @property {Array} subscribers - An array to hold the subscribers for item changes.
|
|
165
|
+
* @private
|
|
166
|
+
*/
|
|
167
|
+
#subscribers = [];
|
|
168
|
+
|
|
169
|
+
/**
|
|
170
|
+
* @property {Object[]} current - A getter to access the current items in the scroller.
|
|
171
|
+
*/
|
|
172
|
+
get current() {
|
|
173
|
+
return this.#items;
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
constructor({callback} = {}) {
|
|
177
|
+
if (typeof callback === "function") {
|
|
178
|
+
this.subscribe(callback);
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
/**
|
|
183
|
+
* @param {Function} callback - A callback function that will be called when the items change.
|
|
184
|
+
* @description This method allows you to subscribe to changes in the items array.
|
|
185
|
+
* @returns {Function} - A function to unsubscribe from the changes.
|
|
186
|
+
* @throws {Error} - Throws an error if the callback is not a function.
|
|
187
|
+
*/
|
|
188
|
+
subscribe(callback) {
|
|
189
|
+
if (typeof callback !== "function")
|
|
190
|
+
throw new Error(
|
|
191
|
+
"ChildItemService | subscribe: Callback must be a function",
|
|
192
|
+
);
|
|
193
|
+
this.#subscribers.push(callback);
|
|
194
|
+
|
|
195
|
+
return () => this.unsubscribe(callback);
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
/**
|
|
199
|
+
* @param {Function} callback - A callback function that will be called when the items change.
|
|
200
|
+
* @description This method allows you to unsubscribe from changes in the items array.
|
|
201
|
+
* @returns {Boolean} - Whether or not you were successfully unsubscribed.
|
|
202
|
+
* @throws {Error} - Throws an error if the callback is not a function.
|
|
203
|
+
*/
|
|
204
|
+
unsubscribe(callback) {
|
|
205
|
+
if (typeof callback !== "function")
|
|
206
|
+
throw new Error(
|
|
207
|
+
"ChildItemService | unsubscribe: Callback must be a function",
|
|
208
|
+
);
|
|
209
|
+
this.#subscribers = this.#subscribers.filter(
|
|
210
|
+
(subscriber) => subscriber !== callback,
|
|
211
|
+
);
|
|
212
|
+
|
|
213
|
+
return true;
|
|
214
|
+
}
|
|
215
|
+
|
|
216
|
+
/**
|
|
217
|
+
* Notify all subscribers of changes in the items array.
|
|
218
|
+
*/
|
|
219
|
+
#notifySubscribers() {
|
|
220
|
+
for (const callback of this.#subscribers)
|
|
221
|
+
callback({
|
|
222
|
+
items: this.#items,
|
|
223
|
+
previousItems: this.#previousItems,
|
|
224
|
+
addedItems: this.#items.filter(item => !this.#previousItems.includes(item)),
|
|
225
|
+
removedItems: this.#previousItems.filter(item => !this.#items.includes(item))
|
|
226
|
+
});
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
/**
|
|
230
|
+
* @param {Object} item - An item to add to the scroller.
|
|
231
|
+
* @description This method adds an item to the scroller and notifies subscribers.
|
|
232
|
+
* @returns {void}
|
|
233
|
+
* @throws {Error} - Throws an error if the item is not an object.
|
|
234
|
+
*/
|
|
235
|
+
add(item) {
|
|
236
|
+
if (typeof item !== "object" || item === null)
|
|
237
|
+
throw new Error("ChildItemService | addItem: Item must be an object");
|
|
238
|
+
|
|
239
|
+
this.#previousItems = this.#getPreviousItems();
|
|
240
|
+
this.#items.push(item);
|
|
241
|
+
this.#notifySubscribers();
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
/**
|
|
245
|
+
* @description This method adds multiple items to the service and notifies subscribers.
|
|
246
|
+
* @param {ArrayLike<any>} items
|
|
247
|
+
* @returns {void}
|
|
248
|
+
* @throws {Error} - Throws an error if the items are not iterable.
|
|
249
|
+
*/
|
|
250
|
+
addMany(items) {
|
|
251
|
+
if (
|
|
252
|
+
!items ||
|
|
253
|
+
typeof items[Symbol.iterator] !== "function" || // otherwise, check if it's iterable
|
|
254
|
+
typeof items === "string" // technically string is iterable ;)
|
|
255
|
+
) {
|
|
256
|
+
throw new Error(
|
|
257
|
+
"ChildItemService | addMany: Items must be iterable (array, etc.)",
|
|
258
|
+
);
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
this.#previousItems = this.#getPreviousItems();
|
|
262
|
+
this.#items.push(...items);
|
|
263
|
+
this.#notifySubscribers();
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
/**
|
|
267
|
+
* @param {Object} item - An item to remove from the scroller.
|
|
268
|
+
* @description This method removes an item from the scroller and notifies subscribers.
|
|
269
|
+
* @returns {void}
|
|
270
|
+
* @throws {Error} - Throws an error if the item is not an object or not found in the items array.
|
|
271
|
+
*/
|
|
272
|
+
remove(item) {
|
|
273
|
+
if (typeof item !== "object" || item === null)
|
|
274
|
+
throw new Error("ChildItemService | removeItem: Item must be an object");
|
|
275
|
+
|
|
276
|
+
this.#previousItems = this.#getPreviousItems();
|
|
277
|
+
this.#items = this.#items.filter((i) => i !== item);
|
|
278
|
+
this.#notifySubscribers();
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
clear() {
|
|
282
|
+
this.#previousItems = this.#getPreviousItems();
|
|
283
|
+
this.#items = [];
|
|
284
|
+
this.#notifySubscribers();
|
|
285
|
+
}
|
|
286
|
+
|
|
287
|
+
/**
|
|
288
|
+
* Gets an item by its index in the items array.
|
|
289
|
+
* @param {Number} index
|
|
290
|
+
* @returns {HTMLElement}
|
|
291
|
+
*/
|
|
292
|
+
getItemByIndex(index) {
|
|
293
|
+
return this.#items[index];
|
|
294
|
+
}
|
|
295
|
+
|
|
296
|
+
/**
|
|
297
|
+
* Gets an item by its number (1-based index).
|
|
298
|
+
* @param {Number} number
|
|
299
|
+
* @returns {HTMLElement}
|
|
300
|
+
*/
|
|
301
|
+
getItemByNumber(number) {
|
|
302
|
+
if (
|
|
303
|
+
this.#items.length === 0 ||
|
|
304
|
+
typeof number !== "number" ||
|
|
305
|
+
number < 0 ||
|
|
306
|
+
number > this.#items.length
|
|
307
|
+
) {
|
|
308
|
+
throw new Error(
|
|
309
|
+
"ChildItemService | getItemByNumber: Number must be a valid index within the range of items.",
|
|
310
|
+
);
|
|
311
|
+
}
|
|
312
|
+
return this.#items[number - 1];
|
|
313
|
+
}
|
|
314
|
+
|
|
315
|
+
getPreviousItem(currentNumber) {
|
|
316
|
+
if (
|
|
317
|
+
typeof currentNumber !== "number" ||
|
|
318
|
+
currentNumber < 1 ||
|
|
319
|
+
currentNumber > this.#items.length
|
|
320
|
+
) {
|
|
321
|
+
throw new Error(
|
|
322
|
+
"ChildItemService | getPreviousItem: Index must be a valid number within the range of previous items.",
|
|
323
|
+
);
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
let index = currentNumber - 2; // Convert to 0-based index
|
|
327
|
+
index = index < 0 ? this.#items.length - 1 : index;
|
|
328
|
+
|
|
329
|
+
return this.#items[index];
|
|
330
|
+
}
|
|
331
|
+
|
|
332
|
+
getNextItem(currentNumber) {
|
|
333
|
+
if (
|
|
334
|
+
typeof currentNumber !== "number" ||
|
|
335
|
+
currentNumber < 1 ||
|
|
336
|
+
currentNumber > this.#items.length
|
|
337
|
+
) {
|
|
338
|
+
throw new Error(
|
|
339
|
+
"ChildItemService | getNextItem: Index must be a valid number within the range of previous items.",
|
|
340
|
+
);
|
|
341
|
+
}
|
|
342
|
+
|
|
343
|
+
let index = currentNumber; // Convert to 0-based index
|
|
344
|
+
index = index >= this.#items.length ? 0 : index;
|
|
345
|
+
|
|
346
|
+
return this.#items[index];
|
|
347
|
+
}
|
|
348
|
+
|
|
349
|
+
#getPreviousItems() {
|
|
350
|
+
return [...this.#items];
|
|
351
|
+
}
|
|
352
|
+
}
|
|
353
|
+
|
|
354
|
+
/**
|
|
355
|
+
* @license
|
|
356
|
+
* Copyright 2018 Google LLC
|
|
357
|
+
* SPDX-License-Identifier: BSD-3-Clause
|
|
358
|
+
*/const e=e$2(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return T}});
|
|
359
|
+
|
|
103
360
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
104
361
|
// See LICENSE in the project root for license information.
|
|
105
362
|
|
|
106
363
|
|
|
107
|
-
|
|
108
|
-
|
|
364
|
+
|
|
365
|
+
/**
|
|
366
|
+
*
|
|
367
|
+
* The `auro-table` element supports two types of tables, either a generated table created by providing data for columns and rows via attributes, or by projecting your own custom table into the default slot of the component to be styled.
|
|
368
|
+
* @customElement auro-table
|
|
369
|
+
*
|
|
370
|
+
* The AuroTable component provides two distinct functionalities for rendering and managing HTML tables:
|
|
371
|
+
* 1. **Data-driven Table Rendering**:
|
|
372
|
+
* - When the `columnHeaders` and `componentData` properties are set, the component generates a table structure internally.
|
|
373
|
+
* - Table headers are created from `columnHeaders`, and rows are populated from `componentData`.
|
|
374
|
+
*
|
|
375
|
+
* 2. **Slotted Table**:
|
|
376
|
+
* - When a native `<table>` element is projected into the component's default slot, AuroTable enhances it by:
|
|
377
|
+
* - Injecting design system styles directly into the table.
|
|
378
|
+
* - Tracking and managing child elements (TH, TD, TR, THEAD, TBODY, TABLE) using internal collections.
|
|
379
|
+
* - Observing DOM mutations to dynamically update collections and apply appropriate classes.
|
|
380
|
+
* - This mode allows developers to use their own table markup while benefiting from AuroTable's styling and child management features.
|
|
381
|
+
* @slot - Default slot for projecting a native `<table>` element. Only available when `columnHeaders` and `componentData` are not set.
|
|
382
|
+
*/
|
|
383
|
+
class AuroTable extends i$1 {
|
|
384
|
+
|
|
385
|
+
/**
|
|
386
|
+
* @property {string} tableStylesTextContent - Combined CSS text content for table styles and design tokens.
|
|
387
|
+
* @static
|
|
388
|
+
* @readonly
|
|
389
|
+
* @private
|
|
390
|
+
*/
|
|
391
|
+
static #tableStylesTextContent = `${styleCss.cssText} ${tokensCss.cssText}`;
|
|
392
|
+
|
|
393
|
+
/**
|
|
394
|
+
* @private
|
|
395
|
+
*/
|
|
396
|
+
#runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
397
|
+
|
|
398
|
+
/**
|
|
399
|
+
* @property {MutationObserver} #tableObserver - Observer to watch for mutations in the table element.
|
|
400
|
+
*/
|
|
401
|
+
#tableObserver = null;
|
|
402
|
+
|
|
403
|
+
/**
|
|
404
|
+
* @property {Ref} #tableTagRef - Reference to the table element.
|
|
405
|
+
*/
|
|
406
|
+
#tableTagRef = e$1();
|
|
407
|
+
get #tableTag() { return this.#tableTagRef.value; }
|
|
408
|
+
|
|
409
|
+
/**
|
|
410
|
+
* @property {Ref} #tableHeaderRef - Reference to the table header element.
|
|
411
|
+
*/
|
|
412
|
+
#tableHeaderRef = e$1();
|
|
413
|
+
get #tableHeader() { return this.#tableHeaderRef.value; }
|
|
414
|
+
|
|
415
|
+
/**
|
|
416
|
+
* @property {Ref} #tableBodyRef - Reference to the table body element.
|
|
417
|
+
*/
|
|
418
|
+
#tableBodyRef = e$1();
|
|
419
|
+
get #tableBody() { return this.#tableBodyRef.value; }
|
|
420
|
+
|
|
421
|
+
/**
|
|
422
|
+
* @property {Object} #elementClasses - Classes to be applied to different table elements referenced by tag name.
|
|
423
|
+
*/
|
|
424
|
+
#elementClasses = {
|
|
425
|
+
'TABLE': ['body-default'],
|
|
426
|
+
'TH': ['heading-2xs'],
|
|
427
|
+
// 'TD': [], // No specific classes for TD as per current requirements
|
|
428
|
+
// 'TR': [], // No specific classes for TR as per current requirements
|
|
429
|
+
// 'THEAD': [], // No specific classes for THEAD as per current requirements
|
|
430
|
+
// 'TBODY': [] // No specific classes for TBODY as per current requirements
|
|
431
|
+
}
|
|
432
|
+
|
|
433
|
+
/**
|
|
434
|
+
* Handles the addition of new elements to the table.
|
|
435
|
+
* Callback function for ChildItemService subscriptions contained in tagCollections.
|
|
436
|
+
* @param {NodeList} addedNodes
|
|
437
|
+
* @private
|
|
438
|
+
*/
|
|
439
|
+
collectionUpdated = ({addedItems}) => {
|
|
440
|
+
if (addedItems?.length) {
|
|
441
|
+
const itemType = addedItems[0].tagName;
|
|
442
|
+
if (!itemType) return;
|
|
443
|
+
const itemClasses = this.#elementClasses[itemType];
|
|
444
|
+
if (itemClasses) addedItems.forEach((item) => item.classList.add(...itemClasses));
|
|
445
|
+
}
|
|
446
|
+
};
|
|
447
|
+
|
|
448
|
+
/**
|
|
449
|
+
* Creates a ChildItemService for each relevant table tag to manage collections of those elements.
|
|
450
|
+
* To create a collection for a new tag, add it to the tagCollections array.
|
|
451
|
+
* @type {Object<string, ChildItemService>}
|
|
452
|
+
* @private
|
|
453
|
+
*/
|
|
454
|
+
#tagCollections = ['TH', 'TD', 'TR', 'THEAD', 'TBODY', 'TABLE']
|
|
455
|
+
.reduce((collections, tag) => {
|
|
456
|
+
collections[tag] = new ChildItemService({ callback: this.collectionUpdated });
|
|
457
|
+
return collections;
|
|
458
|
+
}, {});
|
|
459
|
+
|
|
460
|
+
/**
|
|
461
|
+
* Gets the class map based on this.#elementClasses for a given tag.
|
|
462
|
+
* @param {HTMLElement.tagName} tag
|
|
463
|
+
* @returns {Object} - Class map for use with lit's classMap directive.
|
|
464
|
+
* @private
|
|
465
|
+
*/
|
|
466
|
+
#classMapFor(tag) {
|
|
467
|
+
const normalizedTag = tag?.toUpperCase();
|
|
468
|
+
return this.#elementClasses[normalizedTag]?.reduce((acc, className) => {
|
|
469
|
+
acc[className] = true;
|
|
470
|
+
return acc;
|
|
471
|
+
}, {}) || {};
|
|
472
|
+
}
|
|
473
|
+
|
|
109
474
|
constructor() {
|
|
110
475
|
super();
|
|
111
476
|
|
|
112
|
-
this.
|
|
477
|
+
this._initializeDefaults();
|
|
478
|
+
}
|
|
113
479
|
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
*/
|
|
117
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils();
|
|
480
|
+
_initializeDefaults() {
|
|
481
|
+
this.nowrap = false;
|
|
118
482
|
}
|
|
119
483
|
|
|
120
|
-
// function to define props used within the scope of this component
|
|
121
484
|
static get properties() {
|
|
122
485
|
return {
|
|
486
|
+
|
|
487
|
+
/**
|
|
488
|
+
* An array of strings representing the table's column headers.
|
|
489
|
+
*/
|
|
123
490
|
columnHeaders: {
|
|
124
491
|
type: Array,
|
|
125
|
-
reflect: true
|
|
492
|
+
reflect: true
|
|
126
493
|
},
|
|
494
|
+
|
|
495
|
+
/**
|
|
496
|
+
* An array of objects representing the table's data rows.
|
|
497
|
+
*/
|
|
127
498
|
componentData: {
|
|
128
499
|
type: Array,
|
|
129
|
-
reflect: true
|
|
500
|
+
reflect: true
|
|
130
501
|
},
|
|
502
|
+
|
|
503
|
+
/**
|
|
504
|
+
* When true, prevents the table from wrapping its content.
|
|
505
|
+
*/
|
|
131
506
|
nowrap: {
|
|
132
507
|
type: Boolean,
|
|
133
|
-
reflect: true
|
|
508
|
+
reflect: true
|
|
134
509
|
},
|
|
135
510
|
};
|
|
136
511
|
}
|
|
@@ -141,7 +516,7 @@ class AuroTable extends i {
|
|
|
141
516
|
|
|
142
517
|
/**
|
|
143
518
|
* This will register this element with the browser.
|
|
144
|
-
* @param {string} [name="auro-table"] - The name of element that you want to register
|
|
519
|
+
* @param {string} [name="auro-table"] - The name of the element that you want to register.
|
|
145
520
|
*
|
|
146
521
|
* @example
|
|
147
522
|
* AuroTable.register("custom-table") // this will register this element to <custom-table/>
|
|
@@ -153,48 +528,79 @@ class AuroTable extends i {
|
|
|
153
528
|
|
|
154
529
|
updated(changedProperties) {
|
|
155
530
|
if (changedProperties.has("columnHeaders")) {
|
|
156
|
-
this
|
|
531
|
+
this.#extractHeaders();
|
|
157
532
|
}
|
|
158
533
|
|
|
159
534
|
if (changedProperties.has("componentData")) {
|
|
160
|
-
this
|
|
535
|
+
this.#extractRows();
|
|
161
536
|
}
|
|
162
537
|
}
|
|
163
538
|
|
|
164
539
|
firstUpdated() {
|
|
165
540
|
// Add the tag name as an attribute if it is different than the component name
|
|
166
|
-
this
|
|
541
|
+
this.#runtimeUtils.handleComponentTagRename(this, "auro-table");
|
|
542
|
+
}
|
|
543
|
+
|
|
544
|
+
disconnectedCallback() {
|
|
545
|
+
super.disconnectedCallback();
|
|
546
|
+
|
|
547
|
+
if (this.#tableObserver) {
|
|
548
|
+
this.#tableObserver.disconnect();
|
|
549
|
+
}
|
|
167
550
|
}
|
|
168
551
|
|
|
169
552
|
/**
|
|
170
|
-
*
|
|
553
|
+
* ATTRIBUTE TABLE RENDERING LOGIC
|
|
554
|
+
*/
|
|
555
|
+
|
|
556
|
+
/**
|
|
557
|
+
* Extracts headers from the columnHeaders property and populates the table header.
|
|
171
558
|
* @returns { void }
|
|
559
|
+
* @private
|
|
172
560
|
*/
|
|
173
|
-
extractHeaders() {
|
|
561
|
+
#extractHeaders() {
|
|
174
562
|
if (this.columnHeaders) {
|
|
175
|
-
const headerRow = this.shadowRoot.querySelector("thead tr");
|
|
176
563
|
|
|
177
|
-
|
|
564
|
+
if (!this.#tableHeader) {
|
|
565
|
+
console.warn("auro-table: #tableHeader is null or undefined in #extractHeaders(). This may indicate a rendering or initialization issue.");
|
|
566
|
+
return;
|
|
567
|
+
}
|
|
568
|
+
|
|
569
|
+
this.#tableHeader.innerHTML = "";
|
|
570
|
+
|
|
571
|
+
const tableHeaderRow = document.createElement("tr");
|
|
572
|
+
this.#tableHeader.appendChild(tableHeaderRow);
|
|
178
573
|
|
|
179
574
|
this.columnHeaders.forEach((header) => {
|
|
180
575
|
const th = document.createElement("th");
|
|
181
|
-
th.
|
|
576
|
+
th.classList.add(...this.#elementClasses.TH);
|
|
182
577
|
|
|
183
578
|
th.innerHTML = header;
|
|
184
|
-
|
|
579
|
+
tableHeaderRow.appendChild(th);
|
|
185
580
|
});
|
|
186
581
|
}
|
|
187
582
|
}
|
|
188
583
|
|
|
189
584
|
/**
|
|
190
|
-
*
|
|
585
|
+
* Extracts rows from the componentData property and populates the table body.
|
|
191
586
|
* @returns { void }
|
|
587
|
+
* @private
|
|
192
588
|
*/
|
|
193
|
-
extractRows() {
|
|
194
|
-
|
|
195
|
-
|
|
589
|
+
#extractRows() {
|
|
590
|
+
if (!this.#tableBody) {
|
|
591
|
+
console.error("auro-table: #tableBody is missing. Unable to extract rows.");
|
|
592
|
+
return;
|
|
593
|
+
}
|
|
594
|
+
|
|
595
|
+
// Clear existing table body content
|
|
596
|
+
this.#tableBody.innerHTML = "";
|
|
196
597
|
|
|
197
598
|
if (this.componentData && this.columnHeaders) {
|
|
599
|
+
|
|
600
|
+
// Use DocumentFragment for better performance
|
|
601
|
+
const fragment = document.createDocumentFragment();
|
|
602
|
+
|
|
603
|
+
// Create rows and cells
|
|
198
604
|
this.componentData.forEach((row) => {
|
|
199
605
|
const tr = document.createElement("tr");
|
|
200
606
|
|
|
@@ -205,61 +611,128 @@ class AuroTable extends i {
|
|
|
205
611
|
tr.appendChild(td);
|
|
206
612
|
});
|
|
207
613
|
|
|
208
|
-
|
|
614
|
+
// Append the row to the fragment
|
|
615
|
+
fragment.appendChild(tr);
|
|
209
616
|
});
|
|
617
|
+
|
|
618
|
+
// Single DOM insertion via fragment
|
|
619
|
+
this.#tableBody.appendChild(fragment);
|
|
210
620
|
}
|
|
211
621
|
}
|
|
212
622
|
|
|
213
623
|
/**
|
|
214
|
-
*
|
|
624
|
+
* SLOTTED TABLE LOGIC
|
|
625
|
+
*/
|
|
626
|
+
|
|
627
|
+
/**
|
|
628
|
+
* Observes mutations to the table element and adds or removes elements from collections accordingly.
|
|
629
|
+
* @param {HTMLTableElement} table
|
|
215
630
|
* @private
|
|
216
|
-
* @returns { void }
|
|
217
631
|
*/
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
632
|
+
#observeTableMutations(table) {
|
|
633
|
+
if (this.#tableObserver) {
|
|
634
|
+
this.#tableObserver.disconnect();
|
|
635
|
+
}
|
|
636
|
+
|
|
637
|
+
this.#tableObserver = new MutationObserver((mutationsList) => {
|
|
638
|
+
for (const mutation of mutationsList) {
|
|
639
|
+
mutation.addedNodes.forEach(node => {
|
|
640
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
641
|
+
this.#tagCollections[node.tagName]?.add(node);
|
|
642
|
+
}
|
|
643
|
+
});
|
|
644
|
+
mutation.removedNodes.forEach(node => {
|
|
645
|
+
if (node.nodeType === Node.ELEMENT_NODE) {
|
|
646
|
+
this.#tagCollections[node.tagName]?.remove(node);
|
|
647
|
+
}
|
|
648
|
+
});
|
|
649
|
+
}
|
|
650
|
+
});
|
|
221
651
|
|
|
222
|
-
|
|
223
|
-
|
|
652
|
+
this.#tableObserver.observe(table, { childList: true, subtree: true });
|
|
653
|
+
};
|
|
224
654
|
|
|
225
|
-
|
|
226
|
-
|
|
655
|
+
/**
|
|
656
|
+
* Extracts relevant elements from a slotted table and adds them to collections for tracking.
|
|
657
|
+
* @param {HTMLTableElement} table
|
|
658
|
+
* @private
|
|
659
|
+
*/
|
|
660
|
+
#extractElementsFromSlottedTable(table) {
|
|
661
|
+
const headers = table.querySelectorAll("th");
|
|
662
|
+
const dataCells = table.querySelectorAll("td");
|
|
663
|
+
const rows = table.querySelectorAll("tr");
|
|
664
|
+
const theads = table.querySelectorAll("thead");
|
|
665
|
+
const tbodys = table.querySelectorAll("tbody");
|
|
227
666
|
|
|
228
|
-
|
|
229
|
-
|
|
667
|
+
[...headers, ...dataCells, ...rows, ...theads, ...tbodys, table].forEach((item) => this.#tagCollections[item.tagName]?.add(item));
|
|
668
|
+
}
|
|
230
669
|
|
|
231
|
-
|
|
232
|
-
|
|
670
|
+
/**
|
|
671
|
+
* Binds the component to a slotted table element.
|
|
672
|
+
* This includes extracting existing elements and observing for mutations.
|
|
673
|
+
* @param {HTMLTableElement} table
|
|
674
|
+
* @private
|
|
675
|
+
*/
|
|
676
|
+
#bindToSlottedTable(table) {
|
|
233
677
|
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
headers.forEach((header) => {
|
|
237
|
-
header.classList.add("heading-2xs");
|
|
238
|
-
});
|
|
678
|
+
this.#extractElementsFromSlottedTable(table);
|
|
679
|
+
this.#observeTableMutations(table);
|
|
239
680
|
}
|
|
240
681
|
|
|
241
682
|
/**
|
|
242
|
-
*
|
|
683
|
+
* Injects styles into the slotted table.
|
|
684
|
+
* @param {HTMLTableElement} table
|
|
685
|
+
* @returns { void }
|
|
243
686
|
* @private
|
|
687
|
+
*/
|
|
688
|
+
#injectStylesIntoSlottedTable(table) {
|
|
689
|
+
|
|
690
|
+
// Remove existing style tag to prevent duplicates
|
|
691
|
+
const existingStyleTag = table.querySelector(".auro-table--injected-styles");
|
|
692
|
+
if (existingStyleTag) return;
|
|
693
|
+
|
|
694
|
+
// Create a new style tag with the desired styles
|
|
695
|
+
const styleTag = document.createElement("style");
|
|
696
|
+
styleTag.classList.add("auro-table--injected-styles");
|
|
697
|
+
styleTag.textContent = AuroTable.#tableStylesTextContent;
|
|
698
|
+
table.prepend(styleTag);
|
|
699
|
+
}
|
|
700
|
+
|
|
701
|
+
/**
|
|
702
|
+
* Handles when elements are projected into the default slot
|
|
244
703
|
* @returns { void }
|
|
704
|
+
* @private
|
|
245
705
|
*/
|
|
246
|
-
|
|
247
|
-
|
|
706
|
+
#handleExternalTableSlotChange() {
|
|
707
|
+
|
|
708
|
+
// Get the slotted table element
|
|
709
|
+
const slot = this.shadowRoot.querySelector("slot");
|
|
710
|
+
const assignedNodes = slot.assignedNodes({ flatten: true });
|
|
711
|
+
const slottedTable = assignedNodes
|
|
712
|
+
.filter(node => node.nodeType === Node.ELEMENT_NODE)
|
|
713
|
+
.find(node => node.nodeName === "TABLE");
|
|
714
|
+
|
|
715
|
+
if (slottedTable) {
|
|
716
|
+
this.#bindToSlottedTable(slottedTable);
|
|
717
|
+
this.#injectStylesIntoSlottedTable(slottedTable);
|
|
718
|
+
}
|
|
248
719
|
}
|
|
249
720
|
|
|
250
721
|
// function that renders the HTML and CSS into the scope of the component
|
|
251
722
|
render() {
|
|
252
|
-
return this.columnHeaders && this.componentData
|
|
723
|
+
return this.columnHeaders?.length && this.componentData?.length
|
|
724
|
+
|
|
253
725
|
? x`
|
|
254
|
-
<table class
|
|
255
|
-
<thead
|
|
256
|
-
|
|
726
|
+
<table ${n(this.#tableTagRef)} class=${e(this.#classMapFor('TABLE'))}>
|
|
727
|
+
<thead ${n(this.#tableHeaderRef)}>
|
|
728
|
+
</thead>
|
|
729
|
+
<tbody ${n(this.#tableBodyRef)}>
|
|
257
730
|
</tbody>
|
|
258
731
|
</table>
|
|
259
732
|
`
|
|
260
733
|
: x`
|
|
261
|
-
|
|
262
|
-
|
|
734
|
+
<slot @slotchange=${this.#handleExternalTableSlotChange}></slot>
|
|
735
|
+
`;
|
|
263
736
|
}
|
|
264
737
|
}
|
|
265
738
|
|