scu-web-components 0.0.16 → 0.0.19

package/dist/chunks/chunk.TCZKT5R7.js

@@ -1,248 +0,0 @@
-import{a as n,b as i}from"./chunk.RGGLFZST.js";import{a as g}from"./chunk.RWTLTBM6.js";import{c}from"./chunk.VSIKGAIE.js";import{a as r,b as a,c as s,e as l}from"./chunk.NUBCUBHW.js";import{a as d}from"./chunk.UM2EZXNH.js";import{g as o}from"./chunk.5YJY6NT6.js";var h=r`
-:host {
-  /* scw element */
-  position: relative;
-  box-sizing: border-box;
-  --margin-right: initial;
-  --margin-bottom: initial;
-  --gap-h-int: initial;
-  --gap-v-int: initial;
-  margin-right: var(--margin-right, var(--gap-h-int, initial));
-  margin-bottom: var(--margin-bottom, var(--gap-v-int, initial));
-  display: block;
-}
-
-:host([warning]) {
-  outline: 2px solid red !important;
-}
-
-:host([size=medium]) {
-  display: block;
-  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;
-  /*.image-box {
-    width: 100%;
-    padding-bottom: 38.8888888889%;
-    position: relative;
-  }*/
-  /*.image {
-    @include size-medium-image-mixins.box;
-
-    position: absolute;
-    inset: 0;
-    background-position: center;
-    background-size: cover;
-  }*/
-  /*.action {
-    @include size-medium-action-mixins.box;
-    @include size-medium-action-mixins.sizing;
-  }*/
-}
-:host([size=medium]) > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host([size=medium]) .description {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-02);
-  align-self: stretch;
-}
-
-:host([size=small]) {
-  display: block;
-  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;
-  /*.image-box {
-    width: 100%;
-    padding-bottom: 88.9473684211%;
-    position: relative;
-  }*/
-  /*.image {
-    @include size-small-image-mixins.box;
-
-    position: absolute;
-    inset: 0;
-    background-position: center;
-    background-size: cover;
-  }*/
-}
-:host([size=small]) > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host([size=small]) .description {
-  display: none;
-}
-:host([size=small]) .action {
-  display: none;
-}
-
-:host .super-heading.mortgage {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-mortgage-04));
-  align-self: stretch;
-}
-:host .super-heading.savings {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-savings-04));
-  align-self: stretch;
-}
-:host .super-heading.student {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-student-04));
-  align-self: stretch;
-}
-:host .super-heading.investments {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-investments-04));
-  align-self: stretch;
-}
-:host .super-heading.checking {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-checking-04));
-  align-self: stretch;
-}
-:host .super-heading.credit-cards {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-credit-cards-04));
-  align-self: stretch;
-}
-
-:host {
-  display: block;
-  background-color: var(--scw-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;
-  /*.image {
-    @include default-image-mixins.box;
-
-    position: absolute;
-    inset: 0;
-    background-position: center;
-    background-size: cover;
-  }*/
-}
-:host > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host .image-box {
-  background-color: var(--scw-color-09, var(--scw-color-grey-09));
-  border-radius: 10px 10px 10px 10px;
-  align-self: stretch;
-  flex: 1;
-}
-:host .heading {
-  background-color: var(--scw-color, rgba(0, 0, 0, 0));
-  align-self: stretch;
-}
-:host .super-heading {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-03, var(--scw-color-primary-03));
-  align-self: stretch;
-}
-:host .description {
-  text-align: LEFT;
-  font: var(--scw-type-text-06-font);
-  color: var(--scw-color-02, var(--scw-color-grey-02));
-  align-self: stretch;
-}
-:host .action {
-  width: 83px;
-  height: 32px;
-}
-
-:host([action=none]) {
-  pointer-events: none;
-}
-
-:host([action=whole]) {
-  pointer-events: all;
-}
-
-:host([action=whole]:hover) {
-  cursor: pointer;
-}
-
-:host([action=whole]:focus-visible) {
-  outline: none;
-  box-shadow: var(--scw-effect-focus-shadow);
-  border-radius: 10px 10px 4px 4px;
-}
-
-:host([action=link]) {
-  pointer-events: none;
-}
-:host([action=link]) scw-link {
-  pointer-events: all;
-}`;var e=class extends c{constructor(){super();this.size="large";this.action="none";this.element="card",this.clickHandler=this.clickHandler.bind(this);let t=g();this.headerNodeName=n(`scw-${"heading"}${t}`),this.imageNodeName=n(`scw-${"image"}${t}`),this.linkNodeName=n(`scw-${"link"}${t}`)}static get styles(){return[super.styles,h]}parseAndValidateLightDom(){d(this),super.parseAndValidateLightDom()}clickHandler(t){t.stopPropagation(),this.click()}warn(t){this._heading=`error: ${t}`,l.prototype.warn.call(this,t)}renderImage(){if((this.src||this.srcset)&&this.alt){let t="636:350";return this.size==="medium"?t="414:163":this.size==="small"&&(t="1:1"),i`
-        <${this.imageNodeName}
-            class="image-box"
-            src="${this.src}"
-            srcset="${this.srcset}"
-            aria-label="${this.alt}"
-            aspect-ratio="${t}"
-            object-fit="cover">
-        </${this.imageNodeName}>
-      `}}renderHeading(){return i`
-            <${this.headerNodeName}
-              dynamic class="heading">
-              <h1>${this._heading}</h1>
-            </${this.headerNodeName}>`}renderButton(){return this.action==="link"?i`
-        <${this.linkNodeName}
-          color="${this.color}"
-          aria-label="${this._linkLabel?this._linkLabel:"no label"}" 
-          @click="${this.clickHandler}">
-        </${this.linkNodeName}>`:null}renderBody(){return i`
-       ${this.renderImage()}
-       ${this._superHeading?i`
-          <div class="super-heading ${this.color}">
-            ${this._superHeading}
-          </div>`:""}
-       <${this.headerNodeName}
-          dynamic class="heading">
-          ${this.size==="large"?i`
-            <h1>${this._heading}</h1>
-          `:""}
-          ${this.size==="medium"?i`
-            <h2>${this._heading}</h2>
-          `:""}
-          ${this.size==="small"?i`
-            <h3>${this._heading}</h3>
-          `:""}
-        </${this.headerNodeName}>
-       ${this._description?i`
-          <div class="description">
-            ${this._description}
-          </div>`:""}`}render(){return this.action==="whole"?this.renderBody():i`
-        ${this.renderBody()}
-        ${this.renderButton()}`}};o([s()],e.prototype,"src",2),o([s()],e.prototype,"srcset",2),o([s()],e.prototype,"alt",2),o([s()],e.prototype,"_heading",2),o([s()],e.prototype,"_superHeading",2),o([s()],e.prototype,"_description",2),o([s()],e.prototype,"_linkLabel",2),o([a({type:String,reflect:!0})],e.prototype,"size",2),o([a({type:String,reflect:!0})],e.prototype,"action",2);export{e as a};
-//# sourceMappingURL=chunk.TCZKT5R7.js.map

package/dist/chunks/chunk.TXY4KKCK.js

@@ -1,248 +0,0 @@
-import{a as n,b as i}from"./chunk.RGGLFZST.js";import{a as g}from"./chunk.BJKRRAIV.js";import{c}from"./chunk.VSIKGAIE.js";import{a as r,b as a,c as s,e as l}from"./chunk.NUBCUBHW.js";import{a as d}from"./chunk.UM2EZXNH.js";import{g as o}from"./chunk.5YJY6NT6.js";var h=r`
-:host {
-  /* scw element */
-  position: relative;
-  box-sizing: border-box;
-  --margin-right: initial;
-  --margin-bottom: initial;
-  --gap-h-int: initial;
-  --gap-v-int: initial;
-  margin-right: var(--margin-right, var(--gap-h-int, initial));
-  margin-bottom: var(--margin-bottom, var(--gap-v-int, initial));
-  display: block;
-}
-
-:host([warning]) {
-  outline: 2px solid red !important;
-}
-
-:host([size=medium]) {
-  display: block;
-  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;
-  /*.image-box {
-    width: 100%;
-    padding-bottom: 38.8888888889%;
-    position: relative;
-  }*/
-  /*.image {
-    @include size-medium-image-mixins.box;
-
-    position: absolute;
-    inset: 0;
-    background-position: center;
-    background-size: cover;
-  }*/
-  /*.action {
-    @include size-medium-action-mixins.box;
-    @include size-medium-action-mixins.sizing;
-  }*/
-}
-:host([size=medium]) > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host([size=medium]) .description {
-  text-align: LEFT;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-02);
-  align-self: stretch;
-}
-
-:host([size=small]) {
-  display: block;
-  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;
-  /*.image-box {
-    width: 100%;
-    padding-bottom: 88.9473684211%;
-    position: relative;
-  }*/
-  /*.image {
-    @include size-small-image-mixins.box;
-
-    position: absolute;
-    inset: 0;
-    background-position: center;
-    background-size: cover;
-  }*/
-}
-:host([size=small]) > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host([size=small]) .description {
-  display: none;
-}
-:host([size=small]) .action {
-  display: none;
-}
-
-:host .super-heading.mortgage {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-mortgage-04));
-  align-self: stretch;
-}
-:host .super-heading.savings {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-savings-04));
-  align-self: stretch;
-}
-:host .super-heading.student {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-student-04));
-  align-self: stretch;
-}
-:host .super-heading.investments {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-investments-04));
-  align-self: stretch;
-}
-:host .super-heading.checking {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-checking-04));
-  align-self: stretch;
-}
-:host .super-heading.credit-cards {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-04, var(--scw-color-credit-cards-04));
-  align-self: stretch;
-}
-
-:host {
-  display: block;
-  background-color: var(--scw-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;
-  /*.image {
-    @include default-image-mixins.box;
-
-    position: absolute;
-    inset: 0;
-    background-position: center;
-    background-size: cover;
-  }*/
-}
-:host > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.8);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.8 );
-}
-:host .image-box {
-  background-color: var(--scw-color-09, var(--scw-color-grey-09));
-  border-radius: 10px 10px 10px 10px;
-  align-self: stretch;
-  flex: 1;
-}
-:host .heading {
-  background-color: var(--scw-color, rgba(0, 0, 0, 0));
-  align-self: stretch;
-}
-:host .super-heading {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-font);
-  color: var(--scw-color-03, var(--scw-color-primary-03));
-  align-self: stretch;
-}
-:host .description {
-  text-align: LEFT;
-  font: var(--scw-type-text-06-font);
-  color: var(--scw-color-02, var(--scw-color-grey-02));
-  align-self: stretch;
-}
-:host .action {
-  width: 83px;
-  height: 32px;
-}
-
-:host([action=none]) {
-  pointer-events: none;
-}
-
-:host([action=whole]) {
-  pointer-events: all;
-}
-
-:host([action=whole]:hover) {
-  cursor: pointer;
-}
-
-:host([action=whole]:focus-visible) {
-  outline: none;
-  box-shadow: var(--scw-effect-focus-shadow);
-  border-radius: 10px 10px 4px 4px;
-}
-
-:host([action=link]) {
-  pointer-events: none;
-}
-:host([action=link]) scw-link {
-  pointer-events: all;
-}`;var e=class extends c{constructor(){super();this.size="large";this.action="none";this.element="card",this.clickHandler=this.clickHandler.bind(this);let t=g();this.headerNodeName=n(`scw-${"heading"}${t}`),this.imageNodeName=n(`scw-${"image"}${t}`),this.linkNodeName=n(`scw-${"link"}${t}`)}static get styles(){return[super.styles,h]}parseAndValidateLightDom(){d(this),super.parseAndValidateLightDom()}clickHandler(t){t.stopPropagation(),this.click()}warn(t){this._heading=`error: ${t}`,l.prototype.warn.call(this,t)}renderImage(){if((this.src||this.srcset)&&this.alt){let t="636:350";return this.size==="medium"?t="414:163":this.size==="small"&&(t="1:1"),i`
-        <${this.imageNodeName}
-            class="image-box"
-            src="${this.src}"
-            srcset="${this.srcset}"
-            aria-label="${this.alt}"
-            aspect-ratio="${t}"
-            object-fit="cover">
-        </${this.imageNodeName}>
-      `}}renderHeading(){return i`
-            <${this.headerNodeName}
-              dynamic class="heading">
-              <h1>${this._heading}</h1>
-            </${this.headerNodeName}>`}renderButton(){return this.action==="link"?i`
-        <${this.linkNodeName}
-          color="${this.color}"
-          aria-label="${this._linkLabel?this._linkLabel:"no label"}" 
-          @click="${this.clickHandler}">
-        </${this.linkNodeName}>`:null}renderBody(){return i`
-       ${this.renderImage()}
-       ${this._superHeading?i`
-          <div class="super-heading ${this.color}">
-            ${this._superHeading}
-          </div>`:""}
-       <${this.headerNodeName}
-          dynamic class="heading">
-          ${this.size==="large"?i`
-            <h1>${this._heading}</h1>
-          `:""}
-          ${this.size==="medium"?i`
-            <h2>${this._heading}</h2>
-          `:""}
-          ${this.size==="small"?i`
-            <h3>${this._heading}</h3>
-          `:""}
-        </${this.headerNodeName}>
-       ${this._description?i`
-          <div class="description">
-            ${this._description}
-          </div>`:""}`}render(){return this.action==="whole"?this.renderBody():i`
-        ${this.renderBody()}
-        ${this.renderButton()}`}};o([s()],e.prototype,"src",2),o([s()],e.prototype,"srcset",2),o([s()],e.prototype,"alt",2),o([s()],e.prototype,"_heading",2),o([s()],e.prototype,"_superHeading",2),o([s()],e.prototype,"_description",2),o([s()],e.prototype,"_linkLabel",2),o([a({type:String,reflect:!0})],e.prototype,"size",2),o([a({type:String,reflect:!0})],e.prototype,"action",2);export{e as a};
-//# sourceMappingURL=chunk.TXY4KKCK.js.map

package/dist/chunks/chunk.U5YAJDOO.js

@@ -1,2 +0,0 @@
-import{a as c}from"./chunk.HQVBB74W.js";customElements.define("scw-card",c);
-//# sourceMappingURL=chunk.U5YAJDOO.js.map