scu-web-components 0.0.112 → 0.0.113

package/dist/chunks/chunk.5IBSH2I2.js

@@ -1,501 +0,0 @@
-import{c as D}from"./chunk.UHCRII5U.js";import{a as v}from"./chunk.KILRDKGP.js";import{a as w}from"./chunk.QHUZYUAT.js";import{a as L,b as d,e as j,f as F}from"./chunk.CONKFFEA.js";import{a as r}from"./chunk.G2G2TPJK.js";import{f as n}from"./chunk.PE5ZEEQ2.js";var E=L`
-:host {
-  background-color: rgba(0, 0, 0, 0);
-  border-radius: 16px 16px 16px 16px;
-  align-self: stretch;
-  flex: 1;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-:host > *:not(:last-child) {
-  margin-bottom: var(--scw-spacing-1);
-  --margin-bottom: var( --scw-spacing-1 );
-}
-:host scw-disclosure-mediator {
-  background-color: rgba(0, 0, 0, 0);
-  border-radius: 16px 16px 16px 16px;
-  align-self: stretch;
-  flex: 1;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  min-width: min-content;
-}
-:host scw-disclosure-mediator > *:not(:last-child) {
-  margin-bottom: var(--scw-spacing-1);
-  --margin-bottom: var( --scw-spacing-1 );
-}
-
-:host([hide]) {
-  display: none;
-}
-
-.table {
-  background-color: rgba(0, 0, 0, 0);
-  border-radius: 8px 8px 8px 8px;
-  align-self: stretch;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-.table > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-.table .header-row {
-  background-color: rgba(0, 0, 0, 0);
-  align-self: stretch;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: var(--scw-spacing-1);
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-.table .header-row > *:not(:last-child) {
-  margin-right: 0px;
-  --margin-right: 0px;
-}
-.table .header-row .cell {
-  background-color: var(--scw-color-grey-03);
-  border-radius: 8px 0px 0px 0px;
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-04);
-  align-self: stretch;
-  flex: 1;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: var(--scw-spacing-2);
-  padding-right: var(--scw-spacing-2);
-  padding-top: calc(var(--scw-spacing-1) * 1.3);
-  padding-bottom: calc(var(--scw-spacing-1) * 1.3);
-  border-radius: 0;
-  box-sizing: border-box;
-  min-width: calc(100% / var(--column-shown));
-}
-.table .header-row .cell > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-.table .header-row .cell:first-child {
-  border-top-left-radius: 8px;
-}
-.table .header-row .cell:last-child {
-  border-top-right-radius: 8px;
-}
-.table .header-row .cell .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-04-font);
-  color: var(--scw-color-grey-10);
-  flex: 1;
-}
-.table .rate-row {
-  --cell-color: var(--scw-color-grey-10);
-}
-.table .rate-row:nth-of-type(even) {
-  --cell-color: var(--scw-color-grey-095);
-}
-.table .rate-row:last-child .cell {
-  border-bottom-width: 1px;
-  border-bottom-color: var(--scw-color-grey-08);
-  border-bottom-style: solid;
-}
-.table .rate-row:last-child .cell:first-child {
-  border-bottom-left-radius: 8px;
-}
-.table .rate-row:last-child .cell:last-child {
-  border-bottom-right-radius: 8px;
-}
-.table .row {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  padding-left: var(--scw-spacing-1);
-  align-self: stretch;
-}
-.table .row > *:not(:last-child) {
-  margin-right: 0px;
-  --margin-right: 0px;
-}
-.table .row .cell {
-  background-color: var(--scw-color-grey-10);
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-08);
-  align-self: stretch;
-  flex: 1;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: var(--scw-spacing-2);
-  padding-right: var(--scw-spacing-2);
-  padding-top: var(--scw-spacing-2);
-  padding-bottom: var(--scw-spacing-2);
-  border-left: none;
-  border-bottom: none;
-  box-sizing: border-box;
-  min-width: calc(100% / var(--column-shown));
-  background-color: var(--cell-color);
-  justify-content: flex-start;
-}
-.table .row .cell > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-.table .row .cell .cell-data {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-.table .row .cell .cell-data > *:not(:last-child) {
-  margin-bottom: var(--scw-spacing-1);
-  --margin-bottom: var( --scw-spacing-1 );
-}
-.table .row .cell .cell-data .text {
-  text-align: LEFT;
-  font: var(--scw-type-text-04-font);
-  color: var(--scw-color-grey-03);
-  text-align: left;
-}
-.table .row .cell:first-child {
-  border-left-width: 1px;
-  border-left-color: var(--scw-color-grey-08);
-  border-left-style: solid;
-}
-.table .featured {
-  background-color: rgba(0, 0, 0, 0);
-  border-radius: 3px 0px 0px 3px;
-  align-self: stretch;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  background-color: var(--scw-color-primary-07);
-  padding-top: 6px;
-  padding-bottom: 2px;
-  padding-right: 2px;
-  border-top-left-radius: 3px;
-  border-bottom-left-radius: 3px;
-}
-.table .featured > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.4);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-.table .featured:last-child {
-  border-bottom-right-radius: 3px;
-}
-.table .featured:last-child .cell:first-child {
-  border-bottom-left-radius: 0;
-}
-.table .featured:last-child .cell:last-child {
-  border-bottom-right-radius: 3px;
-}
-.table .featured .label {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: center;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-02-font);
-  color: var(--scw-color-grey-02);
-  padding-left: var(--scw-spacing-1);
-  --scw-icon-color: var(--scw-color-grey-02);
-}
-.table .featured .label > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.3);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.3 );
-}
-.table .featured .label scw-icon {
-  width: 11px;
-  height: 11px;
-}
-
-.heading {
-  background-color: rgba(0, 0, 0, 0);
-  align-self: stretch;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: center;
-  padding-left: var(--scw-spacing-1);
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-.heading > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-.heading .text {
-  text-align: LEFT;
-  font: var(--scw-type-text-extrabold-font);
-  color: var(--scw-color-grey-02);
-  flex: 1;
-}
-.heading .tools {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-end;
-  align-items: center;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-.heading .tools > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-
-.footer {
-  background-color: rgba(0, 0, 0, 0);
-  align-self: stretch;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: center;
-  padding-left: var(--scw-spacing-1);
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  text-align: LEFT;
-  font: var(--scw-type-text-02-font);
-  color: var(--scw-color-grey-04);
-  flex-wrap: wrap;
-}
-.footer > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.2);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.2 );
-}
-
-.disclosures {
-  background-color: rgba(0, 0, 0, 0);
-  align-self: stretch;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: var(--scw-spacing-1);
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-.disclosures > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-.disclosures .global {
-  text-align: LEFT;
-  font: var(--scw-type-text-02-font);
-  color: var(--scw-color-grey-03);
-  flex: 1;
-  margin-bottom: var(--scw-spacing-1);
-}
-
-@media (max-width: 768px) {
-  .table .header-row .cell {
-    padding-left: var(--scw-spacing-1);
-    padding-right: var(--scw-spacing-1);
-    padding-top: var(--scw-spacing-1);
-    padding-bottom: var(--scw-spacing-1);
-  }
-  .table .header-row .cell .label {
-    text-align: LEFT;
-    font: var(--scw-type-text-bold-02-font);
-    color: var(--scw-color-grey-10);
-    flex: 1;
-  }
-  .table .row .cell {
-    padding-left: var(--scw-spacing-1);
-    padding-right: var(--scw-spacing-1);
-    padding-top: var(--scw-spacing-1);
-    padding-bottom: var(--scw-spacing-1);
-  }
-  .table .row .cell .cell-data .text {
-    text-align: LEFT;
-    font: var(--scw-type-text-02-font);
-    color: var(--scw-color-grey-03);
-    text-align: left;
-  }
-  .heading {
-    background-color: rgba(0, 0, 0, 0);
-    align-self: stretch;
-    display: flex;
-    flex-flow: column nowrap;
-    justify-content: center;
-    align-items: flex-start;
-    padding-left: var(--scw-spacing-1);
-    padding-right: 0px;
-    padding-top: 0px;
-    padding-bottom: 0px;
-  }
-  .heading > *:not(:last-child) {
-    margin-bottom: var(--scw-spacing-1);
-    --margin-bottom: var( --scw-spacing-1 );
-  }
-  .heading .text {
-    text-align: LEFT;
-    font: var(--scw-type-text-extrabold-03-font);
-    color: var(--scw-color-grey-02);
-    flex: 1;
-  }
-  .heading .tools {
-    background-color: rgba(0, 0, 0, 0);
-    align-self: stretch;
-    display: flex;
-    flex-flow: row nowrap;
-    justify-content: center;
-    align-items: center;
-    padding-left: 0px;
-    padding-right: 0px;
-    padding-top: 0px;
-    padding-bottom: 0px;
-    align-items: stretch;
-  }
-  .heading .tools > *:not(:last-child) {
-    margin-right: var(--scw-spacing-1);
-    --margin-right: var( --scw-spacing-1 );
-  }
-  .heading .tools scw-link {
-    width: 100%;
-  }
-}`;function M(y,k=1e3,e,t="Month"){if(y!==void 0&&e!==void 0&&t!==void 0&&e>0){let s=t==="Month"?e:e*12,a=y/1200,o=k/((Math.pow(1+a,s)-1)/(a*Math.pow(1+a,s)));return Math.round(o*100)/100}}var i=class extends F{constructor(){super();this.rateData="";this.name="";this.amount="";this.disclosuresLink="";this.disclosuresLocation="";this.rateTableId="";this.headerRow=[];this.rateRows=[];this.effectiveDate="";this.disclosures=[];this.element="rateTable"}static get styles(){return[super.styles,E]}firstUpdated(){this.parseRateData()}getCurrencyString(e){return`$${parseFloat(`${e}`).toLocaleString("en-US",{maximumFractionDigits:2,minimumFractionDigits:2})}`}matchDisclosures(e=[]){return this.disclosuresLink&&!this.disclosuresLocation?[]:e.map(({id:t})=>{let s=this.disclosures.find(a=>a.id===t);return s?(Object.assign(s,{global:!1}),s):null}).filter(t=>t)}renderDisclosures(e){return e.map(t=>r`
-      <scw-disclosure-item
-        location="${this.disclosuresLocation||this.rateTableId}"
-        symbol="${t.displaySymbol||""}"
-        disclosure="${t.value}"
-        identifier="${t.id}"></scw-disclosure-item>
-    `)}renderRow(e){return this.headerRow.map(({name:t})=>r`
-      <div class="cell">
-        <div class="cell-data">
-          <div class="text">
-            ${e[t].value}
-            ${this.renderDisclosures(e[t].disclosures)}
-          </div>
-        </div>
-      </div>
-    `)}renderLink(e,t,s="solid"){return e&&t?r`
-        <scw-link
-          href="${t}"
-          aria-label="${e}"
-          design="${s}"
-          size="small">
-        </scw-link>
-      `:r``}handleClick(e,t,s,a){e.stopPropagation(),v("scw-action",this,{action:"calculator",rate:t,term:s,amount:a})}getFieldName(e){switch(e){case"Term (up to)":case"Term and Type":return"Term";case"Rate":case"Dividend Rate":return"Rate";case"Annual Percentage Rate":case"APR (As Low As)":return"APR";case"Monthly Payment":case"Estimated Monthly Payment":return"Monthly Payment";case"Annual Percentage Yield":case"Minimum Balance to Earn APY":default:return e}}parseRateData(){let e=JSON.parse(this.rateData);this.rateTableId=e.id,this.effectiveDate=D(new Date),this.disclosures=(e.disclosures||[]).map(a=>Object.assign(a,{global:!0}));let{headerRow:t,rows:s}=(e.fields||[]).sort((a,o)=>a.order-o.order).reduce((a,o)=>{let p=this.getFieldName(o.title);return a.headerRow.push({name:p,title:o.title,disclosures:this.matchDisclosures(o.disclosures)}),o.values.forEach(l=>{let g={value:l.value,disclosures:this.matchDisclosures(l.disclosures)},f=a.rows.find(m=>m.rateId===l.rateId);f?f[p]=g:a.rows.push({rateId:l.rateId,featured:l.isFeatured,[p]:g})}),a},{headerRow:[],rows:[]});this.headerRow=t,this.rateRows=s.map(a=>{var g,f,m;let[o,...p]=t.map(({name:h})=>h);a[o].disclosures.forEach(h=>{p.every(c=>a[c].disclosures.find(u=>u.id===h.id))&&p.forEach(c=>{a[c].disclosures=a[c].disclosures.filter(u=>u.id!==h.id)})});let l=parseFloat((g=a["Monthly Payment"])==null?void 0:g.value);if(!isNaN(l)){let h=this.amount?parseFloat(this.amount):1e3,x=parseFloat((f=a.APR)==null?void 0:f.value),c=(m=a.Term)==null?void 0:m.value.match(/(\d+) (Year|Month)/),u=parseFloat(c==null?void 0:c[1]),R=c==null?void 0:c[2],b=!isNaN(x)&&!isNaN(u)?M(x,h,u,R):void 0,$=this.getCurrencyString(b!=null?b:l);a["Monthly Payment"].value=this.amount&&b?r`
-          <scw-link
-            aria-label="${$}"
-            design="text"
-            @click=${P=>this.handleClick(P,x,u,h)}></scw-link>
-        `:$}return a}),this.sort&&this.rateRows.sort((a,o)=>{let p=t[0].name,[l,g]=[a,o].map(f=>{let m=f[p].value.replace("$","");return parseFloat(m)});return this.sort==="ascending"?l-g:g-l}),this.rateRows.sort((a,o)=>a.featured?-1:o.featured?1:0),this.requestUpdate(),this.disclosuresLocation&&this.updateComplete.then(()=>{v("scw-disclosure-update",this,{location:this.disclosuresLocation})})}render(){let e=r`
-    
-    ${!this.disclosuresLink&&this.name?r`
-      <div class="heading">
-        <div class="text">${this.name}</div>
-        ${this.primaryLink||this.secondaryLink?r`
-          <div class="tools">
-            ${this.renderLink(this.secondaryLabel,this.secondaryLink,"light")}
-            ${this.renderLink(this.primaryLabel,this.primaryLink)}
-          </div>`:""}
-      </div>
-    `:""}
-    <div class="table"
-      style="--column-shown: ${this.headerRow.length};">
-      <div class="header-row">
-      ${this.headerRow.map(({title:t,disclosures:s})=>r`
-        <div class="cell">
-          <div class="label">
-            ${t}
-            ${this.renderDisclosures(s)}
-          </div>
-        </div>
-      `)}
-      </div>
-      ${this.rateRows.map(t=>t.featured?r`
-        <div class="featured rate-row">
-          <div class="label">
-            <scw-icon
-              size="10"
-              icon="star"></scw-icon>
-            <div class="cell-label">Featured Rate</div>
-          </div>
-          <div class="row">
-            ${this.renderRow(t)}
-          </div>
-        </div>
-      `:r`
-        <div class="row rate-row">
-          ${this.renderRow(t)}
-        </div>
-      `)}
-    </div>
-    <div class="footer">
-      <div class="text">
-        Rates accurate ${this.effectiveDate}.
-      </div>
-      ${this.disclosuresLink?r`
-        <scw-link
-        href="${this.disclosuresLink}"
-        design="text"
-        aria-label="View all rates & disclosures">
-      </scw-link>`:""}
-    </div>
-    ${this.disclosuresLink?"":r`
-      <div class="disclosures">
-        ${this.disclosures.map(t=>t.global&&t.value?r`
-            <div class="global">${t.value}</div>
-          `:"")}
-        ${this.disclosuresLocation?"":r`
-          <scw-disclosure location="${this.rateTableId}"></scw-disclosure>
-        `}
-      </div>
-    `}`;return r`
-    ${this.disclosuresLocation?e:r`
-      <scw-disclosure-mediator location="${this.rateTableId}">
-        ${e}
-      </scw-disclosure-mediator>
-    `}
-    `}};n([d({type:String,attribute:"rate-data"})],i.prototype,"rateData",2),n([d({type:String,attribute:"name"})],i.prototype,"name",2),n([d({type:String,attribute:"amount"})],i.prototype,"amount",2),n([d({type:String,attribute:"sort"})],i.prototype,"sort",2),n([d({type:String,attribute:"primary-cta-link"})],i.prototype,"primaryLink",2),n([d({type:String,attribute:"primary-cta-label"})],i.prototype,"primaryLabel",2),n([d({type:String,attribute:"secondary-cta-link"})],i.prototype,"secondaryLink",2),n([d({type:String,attribute:"secondary-cta-label"})],i.prototype,"secondaryLabel",2),n([d({type:String,attribute:"disclosures-link"})],i.prototype,"disclosuresLink",2),n([d({type:String,attribute:"disclosures-location"})],i.prototype,"disclosuresLocation",2),n([j("scw-disclosure-item")],i.prototype,"disclosure",2),n([w("rateData"),w("amount"),w("disclosuresLocation")],i.prototype,"parseRateData",1);export{i as a};

package/dist/chunks/chunk.633HRFGN.js

@@ -1,13 +0,0 @@
-import{a as f}from"./chunk.KILRDKGP.js";import{a as u,b as c,f as d}from"./chunk.CONKFFEA.js";import{a as l}from"./chunk.G2G2TPJK.js";import{f as p}from"./chunk.PE5ZEEQ2.js";var h=u`
-:host {
-  display: block;
-  --gap: initial;
-  --gap-h: var( --scw-spacing-2 );
-  --gap-v: var( --scw-spacing-1 );
-}
-
-:host(.read-only) {
-  --gap-v: var( --scw-spacing-3 );
-}`;function v(a,r,e){r=r||"post";let o=document.createElement("form");o.setAttribute("method",r),o.setAttribute("action",a),o.setAttribute("enctype","multipart/form-data"),o.style.display="none",e.forEach(n=>{var t,s;if(!!(n.name&&n.value))if(((t=n.input)==null?void 0:t.files)&&((s=n.input)==null?void 0:s.files[0]))o.appendChild(n.input);else{let i=document.createElement("input");i.setAttribute("type","hidden"),i.setAttribute("name",n.name),i.setAttribute("value",n.value),o.appendChild(i)}}),document.body.appendChild(o),o.submit()}async function b(a,r,e){return await fetch(a,{method:r||"post",body:e,headers:{Accept:"application/json"}})}var m=class extends d{constructor(){super();this.method="get";this.ajax=!1;this.element="form",this.setAttribute("scw-stack-initial","")}static get styles(){return[super.styles,h]}connectedCallback(){super.connectedCallback(),this.addEventListener("scw-submit-intent",()=>{this.submit()})}findFormElements(){let e=this.querySelectorAll("[form-type]");return Array.from(e)}processData(e){let o=e||this.findFormElements(),n=new FormData;return o.map(t=>{var s,i;t.name&&t.value&&((s=t.input)==null?void 0:s.files)&&((i=t.input)==null?void 0:i.files[0])?n.append(t.name,t.input.files[0]):t.name&&t.value&&n.append(t.name,t.value)}),n}validate(e){let o=e||this.findFormElements(),n=[];return o.map(t=>{t.validate&&(n=[...n,...t.validate()])}),n}findInvalidElements(e){let o=e||this.findFormElements(),n=[];return o.map(t=>{t.invalid&&n.push(t)}),n}async submit(){let e=this.findFormElements(),o=this.validate(e),n=this.processData(e),t=this.findInvalidElements(e),s={validation:o,invalidElements:t,data:Array.from(n.entries()).reduce((i,[y,F])=>(i[y]=F,i),{})};this.action&&t.length===0&&(this.ajax?b(this.action,this.method,n).then(i=>Object.assign(s,{response:i})):v(this.action,this.method,e)),f("scw-submit",this,s)}render(){return l`
-      <slot></slot>
-    `}};p([c({type:String})],m.prototype,"action",2),p([c({type:String})],m.prototype,"method",2),p([c({type:Boolean})],m.prototype,"ajax",2);export{m as a};

package/dist/chunks/chunk.7KHIHTLS.js

@@ -1,32 +0,0 @@
-import{a,b as l,f as c}from"./chunk.CONKFFEA.js";import{a as h}from"./chunk.G2G2TPJK.js";import{f as o}from"./chunk.PE5ZEEQ2.js";var f=a`
-:host {
-  background-color: rgba(0, 0, 0, 0);
-  align-self: stretch;
-  flex: 1;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: flex-start;
-  align-items: flex-end;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  --cell-color: var(--scw-color-grey-10);
-  overflow: hidden;
-}
-:host > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-:host ::slotted(:nth-child(odd)) {
-  --cell-color: var(--scw-color-grey-095);
-}
-
-.contents {
-  width: 100%;
-  overflow-x: auto;
-}`;var r=class extends c{constructor(){var i;super();this.align="left";this.columnWidths="";this.columnShown=0;this.element="table",!1||(this.rows=this.getElementsByTagName("scw-table-row"),(i=this.rows)!=null&&i.length&&(this.rows[0].hasAttribute("header")&&this.rows[1]?this.rows[1].setAttribute("start","true"):this.rows[0].setAttribute("start","true"),this.rows[this.rows.length-1].setAttribute("end","true")))}static get styles(){return[super.styles,f]}connectedCallback(){var i;if(super.connectedCallback(),!!1&&((i=this.rows)==null?void 0:i.length)){this.columnShown=this.rows[0].children.length;let t=this.processColWidths();Array.from(this.rows).forEach(s=>{Array.from(s.children).forEach((e,n)=>{t[n]&&Object.assign(e.style,t[n]),e.hasAttribute("align")||e.setAttribute("align",this.align)})})}}processColWidths(){return this.columnWidths?this.columnWidths.split(",").map(i=>{let t=i.trim();return t.startsWith("col")?{width:`var(--scw-${t})`,minWidth:"initial",flex:"initial"}:t.startsWith("fill-")?{flex:`${t.split("-")[1]}`}:t.startsWith("fill")?{flex:"1"}:t.endsWith("px")?{width:`${parseInt(t.replace("px",""))/16}rem`,minWidth:"initial",flex:"initial"}:t!==""?{width:`${t}`,minWidth:"initial",flex:"initial"}:{}}):[]}render(){return h`
-      <div class="contents"
-        ${this.columnShown?`style="--column-shown: ${this.columnShown}"`:""}>
-        <slot></slot></div>
-    `}};o([l({type:String,attribute:"align"})],r.prototype,"align",2),o([l({type:String,attribute:"column-widths"})],r.prototype,"columnWidths",2);export{r as a};