scu-web-components 0.0.112 → 0.0.113

package/dist/chunks/chunk.KFIIX3RY.js

@@ -1,259 +0,0 @@
-import{a as g}from"./chunk.II65LBBV.js";import{a as n}from"./chunk.YBPGY7E7.js";import{a as p}from"./chunk.U7IZRGJV.js";import{a as i,b as l,c as d}from"./chunk.CONKFFEA.js";import{a as t}from"./chunk.G2G2TPJK.js";import{f as o}from"./chunk.PE5ZEEQ2.js";var w=i`
-:host .label {
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-}`;var h=i`
-:host([design=text]) {
-  display: inline-block;
-}
-
-:host([design=text]) .scw-link-base {
-  outline: none;
-  display: inline;
-}
-:host([design=text]) .scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-06-font);
-  color: var(--scw-color-primary-04);
-  text-decoration: underline;
-}
-
-:host([design=text]:hover) a.scw-link-base .label,
-:host([design=text][hover]) a.scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-06-font);
-  color: var(--scw-color-primary-01);
-}
-
-:host([design=text][aria-disabled=true]) .scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-06-font);
-  color: var(--scw-color-grey-07);
-}`;var f=i`
-:host([design=solid]) .scw-link-base {
-  outline: none;
-  user-select: none;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.6);
-  padding-right: calc(var(--scw-spacing-1) * 1.6);
-  padding-top: calc(var(--scw-spacing-1) * 0.6);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.6);
-  background-color: var(--scw-theme-color, var(--scw-color-primary));
-  border-radius: 6px 6px 6px 6px;
-  display: inline-flex;
-}
-:host([design=solid]) .scw-link-base > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-:host([design=solid]) .scw-link-base .label {
-  font: var(--scw-type-text-bold-condensed-06-font);
-  color: var(--scw-theme-color-inv, var(--scw-color-grey-10));
-  min-height: 27px;
-}
-:host([design=solid]) .scw-link-base .icon {
-  width: 24px;
-  height: 24px;
-}
-:host([design=solid]) .scw-link-base .icon svg {
-  box-sizing: border-box;
-  vertical-align: top;
-  width: 100%;
-  height: 100%;
-  fill: var(--scw-theme-color-inv, var(--scw-color-grey-10));
-}
-:host([design=solid]) .scw-link-base .icon svg * {
-  fill: var(--scw-theme-color-inv, var(--scw-color-grey-10));
-}
-
-:host([design=solid][icon][icon-side=left]) .scw-link-base {
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.2);
-  padding-right: calc(var(--scw-spacing-1) * 1.6);
-  padding-top: calc(var(--scw-spacing-1) * 0.6);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.6);
-  display: inline-flex;
-}
-:host([design=solid][icon][icon-side=left]) .scw-link-base > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-
-:host([design=solid][icon][icon-side=right]) .scw-link-base {
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.6);
-  padding-right: calc(var(--scw-spacing-1) * 1.2);
-  padding-top: calc(var(--scw-spacing-1) * 0.6);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.6);
-  display: inline-flex;
-}
-:host([design=solid][icon][icon-side=right]) .scw-link-base > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-
-:host([design=solid]:hover) a.scw-link-base,
-:host([design=solid][hover]) a.scw-link-base {
-  background-color: var(--scw-theme-color-hover, var(--scw-color-primary-01));
-}
-:host([design=solid]:hover) a.scw-link-base .label,
-:host([design=solid][hover]) a.scw-link-base .label {
-  font: var(--scw-type-text-bold-condensed-06-font);
-  color: var(--scw-theme-color-hover-inv, var(--scw-color-grey-10));
-}
-
-:host([design=solid][aria-disabled=true]) .scw-link-base {
-  background-color: var(--scw-color-grey-095);
-  border-radius: 6px 6px 6px 6px;
-  border-width: 2px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-095);
-}
-:host([design=solid][aria-disabled=true]) .scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-06-font);
-  color: var(--scw-color-grey-07);
-}
-:host([design=solid][aria-disabled=true]) .scw-link-base .icon svg {
-  fill: var(--scw-color-grey-07);
-}
-:host([design=solid][aria-disabled=true]) .scw-link-base .icon svg * {
-  fill: var(--scw-color-grey-07);
-}`;var v=i`
-:host([design=outlined]) .scw-link-base {
-  outline: none;
-  user-select: none;
-  background-color: var(--scw-color-grey-10);
-  border-radius: 6px 6px 6px 6px;
-  border-width: 2px;
-  border-style: solid;
-  border-color: var(--scw-color-primary);
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.6);
-  padding-right: calc(var(--scw-spacing-1) * 1.6);
-  padding-top: calc(var(--scw-spacing-1) * 0.6);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.6);
-  display: inline-flex;
-}
-:host([design=outlined]) .scw-link-base > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-:host([design=outlined]) .scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-06-font);
-  color: var(--scw-color-primary);
-  min-height: 27px;
-}
-:host([design=outlined]) .scw-link-base .icon {
-  width: 24px;
-  height: 24px;
-}
-:host([design=outlined]) .scw-link-base .icon svg {
-  box-sizing: border-box;
-  vertical-align: top;
-  width: 100%;
-  height: 100%;
-  fill: var(--scw-color-primary);
-}
-:host([design=outlined]) .scw-link-base .icon svg * {
-  fill: var(--scw-color-primary);
-}
-
-:host([design=outlined][icon][icon-side=left]) .scw-link-base {
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.2);
-  padding-right: calc(var(--scw-spacing-1) * 1.6);
-  padding-top: calc(var(--scw-spacing-1) * 0.6);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.6);
-  display: inline-flex;
-}
-:host([design=outlined][icon][icon-side=left]) .scw-link-base > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-
-:host([design=outlined][icon][icon-side=right]) .scw-link-base {
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.6);
-  padding-right: calc(var(--scw-spacing-1) * 1.2);
-  padding-top: calc(var(--scw-spacing-1) * 0.6);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.6);
-  display: inline-flex;
-}
-:host([design=outlined][icon][icon-side=right]) .scw-link-base > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-
-:host([design=outlined]:hover) a.scw-link-base,
-:host([design=outlined][hover]) a.scw-link-base {
-  background-color: var(--scw-color-grey-10);
-  border-radius: 6px 6px 6px 6px;
-  border-width: 2px;
-  border-style: solid;
-  border-color: var(--scw-color-primary-01);
-}
-:host([design=outlined]:hover) a.scw-link-base .label,
-:host([design=outlined][hover]) a.scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-06-font);
-  color: var(--scw-color-primary-01);
-}
-
-:host([design=outlined][aria-disabled=true]) .scw-link-base {
-  background-color: var(--scw-color-grey-10);
-  border-radius: 6px 6px 6px 6px;
-  border-width: 2px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-09);
-}
-:host([design=outlined][aria-disabled=true]) .scw-link-base .label {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-condensed-06-font);
-  color: var(--scw-color-grey-07);
-}
-:host([design=outlined][aria-disabled=true]) .scw-link-base .icon svg {
-  fill: var(--scw-color-grey-07);
-}
-:host([design=outlined][aria-disabled=true]) .scw-link-base .icon svg * {
-  fill: var(--scw-color-grey-07);
-}`;var b=i`
-:host([design=plain]) .scw-link-base {
-  outline: none;
-  display: inline-block;
-}`;var a=(c=>(c.solid="solid",c.outlined="outlined",c.text="text",c.plain="plain",c))(a||{});var e=class extends p{constructor(){super();this.iconSide="left";this.design="solid";this._svgInfo="";this.element="link-old"}static get styles(){return[super.styles,w]}set icon(s){let r=this._icon;this._icon=s,this.requestUpdate("icon",r),this.refreshIcon()}get icon(){return this._icon}refreshIcon(){this.clearWarnings(),g(this.icon,s=>{s===!1?this.warn(`scw-icon could not find ${this.icon}`):this._svgInfo=s})}validDesigns(){return a}doShowIcon(){return!!(this.icon&&this.design!=="plain"&&this.design!=="text")}renderContent(){let s=this.doShowIcon(),r=`<style>${this.findStyle().cssText}</style>`;return this.design==="plain"?t`
-        ${n(r)}
-        <slot></slot>
-      `:t`
-      ${s&&this.iconSide==="left"?t`
-        <div class="icon">
-          ${n(this._svgInfo)}
-        </div>`:""}
-        ${n(r)}
-        <div class="label">
-          ${this.ariaLabel}
-        </div>
-      ${s&&this.iconSide==="right"?t`
-        <div class="icon">
-          ${n(this._svgInfo)}
-        </div>`:""}`}findStyle(){switch(this.design){case"solid":return f;case"outlined":return v;case"text":return h;case"plain":default:return b}}render(){return this.renderLink(this.renderContent())}};o([l({type:String,reflect:!0})],e.prototype,"icon",1),o([l({type:String,reflect:!0,attribute:"icon-side"})],e.prototype,"iconSide",2),o([l({type:String,reflect:!0})],e.prototype,"design",2),o([d()],e.prototype,"_svgInfo",2);export{e as a};

package/dist/chunks/chunk.KILRDKGP.js

@@ -1 +0,0 @@
-function a(u,o,s={},t){let e=new CustomEvent(u,{bubbles:!0,cancelable:!1,composed:!0,detail:s,...t});return o.dispatchEvent(e),e}export{a};

package/dist/chunks/chunk.KYGZS2SV.js

@@ -1,58 +0,0 @@
-import{a as g}from"./chunk.YBPGY7E7.js";import{c as _}from"./chunk.BQW2V66J.js";import{a as p,b as m,c as v}from"./chunk.NBAHMDHF.js";import{a as y,b as c,c as x,d as b,f as C}from"./chunk.CONKFFEA.js";import{a as f,d as u}from"./chunk.G2G2TPJK.js";import{f as l}from"./chunk.PE5ZEEQ2.js";var d=(s,e)=>{var t,i;let r=s._$AN;if(r===void 0)return!1;for(let n of r)(i=(t=n)._$AO)===null||i===void 0||i.call(t,e,!1),d(n,e);return!0},a=s=>{let e,t;do{if((e=s._$AM)===void 0)break;t=e._$AN,t.delete(s),s=e}while((t==null?void 0:t.size)===0)},Y=s=>{for(let e;e=s._$AM;s=e){let t=e._$AN;if(t===void 0)e._$AN=t=new Set;else if(t.has(s))break;t.add(s),R(e)}};function I(s){this._$AN!==void 0?(a(this),this._$AM=s,Y(this)):this._$AM=s}function M(s,e=!1,t=0){let i=this._$AH,r=this._$AN;if(r!==void 0&&r.size!==0)if(e)if(Array.isArray(i))for(let n=t;n<i.length;n++)d(i[n],!1),a(i[n]);else i!=null&&(d(i,!1),a(i));else d(this,s)}var R=s=>{var e,t,i,r;s.type==p.CHILD&&((e=(i=s)._$AP)!==null&&e!==void 0||(i._$AP=M),(t=(r=s)._$AQ)!==null&&t!==void 0||(r._$AQ=I))},h=class extends v{constructor(){super(...arguments),this._$AN=void 0}_$AT(e,t,i){super._$AT(e,t,i),Y(this),this.isConnected=e._$AU}_$AO(e,t=!0){var i,r;e!==this.isConnected&&(this.isConnected=e,e?(i=this.reconnected)===null||i===void 0||i.call(this):(r=this.disconnected)===null||r===void 0||r.call(this)),t&&(d(this,e),a(this))}setValue(e){if(_(this._$Ct))this._$Ct._$AI(e,this);else{let t=[...this._$Ct._$AH];t[this._$Ci]=e,this._$Ct._$AI(t,this,0)}}disconnected(){}reconnected(){}};var N=()=>new A,A=class{},$=new WeakMap,T=m(class extends h{render(s){return u}update(s,[e]){var t;let i=e!==this.Y;return i&&this.Y!==void 0&&this.rt(void 0),(i||this.lt!==this.ct)&&(this.Y=e,this.dt=(t=s.options)===null||t===void 0?void 0:t.host,this.rt(this.ct=s.element)),u}rt(s){var e;if(typeof this.Y=="function"){let t=(e=this.dt)!==null&&e!==void 0?e:globalThis,i=$.get(t);i===void 0&&(i=new WeakMap,$.set(t,i)),i.get(this.Y)!==void 0&&this.Y.call(this.dt,void 0),i.set(this.Y,s),s!==void 0&&this.Y.call(this.dt,s)}else this.Y.value=s}get lt(){var s,e,t;return typeof this.Y=="function"?(e=$.get((s=this.dt)!==null&&s!==void 0?s:globalThis))===null||e===void 0?void 0:e.get(this.Y):(t=this.Y)===null||t===void 0?void 0:t.value}disconnected(){this.lt===this.ct&&this.rt(void 0)}reconnected(){this.rt(this.ct)}});var H=y`
-:host {
-  display: block;
-}
-
-.container {
-  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;
-}
-.container > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 3.8);
-  --margin-right: calc( var( --scw-spacing-1 ) * 3.8 );
-}
-
-.circle {
-  background-color: var(--scw-color-grey-092);
-  border-radius: 50% 50% 50% 50%;
-  width: 10px;
-  height: 10px;
-}
-.circle.focused {
-  background-color: var(--scw-color-grey-07);
-  border-radius: 50% 50% 50% 50%;
-}
-
-.body p {
-  font-size: 42px;
-}`;var o=class extends C{constructor(){super();this.test="test";this.testState=0;this.contentRef=N();this.example="hello there";this.element="stepper"}static get styles(){return[super.styles,H]}firstUpdated(){this.attachContent()}attachContent(){let t=this.querySelector("#content");this.contentRef.value&&t&&this.contentRef.value.appendChild(t.content.cloneNode(!0))}renderStepItem(t=!1){return f`
-      <div class="circle ${t?"focused":""}"></div>
-    `}render(){let t;try{this.testJson&&(t=JSON.parse(decodeURIComponent(this.testJson)))}catch(r){console.error(r)}return f`
-      <div class="container" @click=${()=>console.log("hi")}>
-        ${this.renderStepItem()}
-        ${this.renderStepItem(!0)}
-        ${this.renderStepItem()}
-        ${g(t?JSON.stringify(t):"")}
-        ${g(this.testHtml?decodeURIComponent(this.testHtml):"")}
-        <div
-          class="body"
-          ${T(this.contentRef)}>
-        </div>
-      </div>
-    `}};l([c({type:String,attribute:"test-json",reflect:!0})],o.prototype,"testJson",2),l([c({type:String,attribute:"test-html",reflect:!0})],o.prototype,"testHtml",2),l([c({type:String,attribute:"test-attr",reflect:!0})],o.prototype,"testAttr",2),l([x()],o.prototype,"testState",2),l([b("#myBtn")],o.prototype,"first",2);export{o as a};
-/**
- * @license
- * Copyright 2017 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-/**
- * @license
- * Copyright 2020 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */

package/dist/chunks/chunk.LKFOJKKJ.js

@@ -1,142 +0,0 @@
-import{a as l,b as a,f as o}from"./chunk.CONKFFEA.js";import{a as e}from"./chunk.G2G2TPJK.js";import{f as t}from"./chunk.PE5ZEEQ2.js";var s=l`
-:host {
-  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;
-  min-width: 100px;
-  background-color: var(--cell-color);
-  transition: 300ms ease;
-}
-:host > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-:host .cell {
-  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;
-  text-align: LEFT;
-  font: var(--scw-type-text-04-font);
-  color: var(--scw-color-grey-03);
-  text-align: left;
-}
-:host .cell > *:not(:last-child) {
-  margin-bottom: var(--scw-spacing-1);
-  --margin-bottom: var( --scw-spacing-1 );
-}
-
-:host([label-cell]) {
-  background-color: var(--scw-color-grey-10);
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-08);
-  align-self: stretch;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: calc(var(--scw-spacing-1) * 2.5);
-  padding-right: var(--scw-spacing-2);
-  padding-top: var(--scw-spacing-2);
-  padding-bottom: var(--scw-spacing-2);
-  border-bottom: none;
-  background-color: var(--cell-color);
-}
-:host([label-cell]) > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-:host([label-cell]) .cell {
-  text-align: LEFT;
-  font: var(--scw-type-text-bold-04-font);
-  color: var(--scw-color-grey-02);
-  text-align: left;
-}
-
-:host([header]) {
-  background-color: var(--scw-color-grey-03);
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-04);
-  align-self: stretch;
-  flex: 1;
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: var(--scw-spacing-2);
-  padding-right: var(--scw-spacing-2);
-  padding-top: var(--scw-spacing-3);
-  padding-bottom: var(--scw-spacing-3);
-  gap: var(--scw-spacing-1);
-  justify-content: space-between;
-}
-:host([header]) > *:not(:last-child) {
-  margin-bottom: var(--scw-spacing-1);
-  --margin-bottom: var( --scw-spacing-1 );
-}
-:host([header]) .cell {
-  text-align: CENTER;
-  font: 700 1.25rem/1.688rem "Proxima Nova";
-  color: var(--scw-color-grey-10);
-  align-self: stretch;
-  margin: 0;
-}
-
-:host([header][label-cell]) {
-  background-color: rgba(0, 0, 0, 0);
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-10);
-  align-self: stretch;
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: flex-start;
-  align-items: flex-start;
-  padding-left: calc(var(--scw-spacing-1) * 2.5);
-  padding-right: var(--scw-spacing-2);
-  padding-top: var(--scw-spacing-3);
-  padding-bottom: var(--scw-spacing-3);
-}
-:host([header][label-cell]) > *:not(:last-child) {
-  margin-right: var(--scw-spacing-1);
-  --margin-right: var( --scw-spacing-1 );
-}
-
-@media (max-width: 768px) {
-  :host([header][label-cell]) {
-    display: none;
-  }
-  :host([label-cell]) {
-    border-left: 0;
-    background-color: var(--scw-color-grey-095);
-    height: var(--scw-spacing-4);
-  }
-}`;var r=class extends o{constructor(){super();this.header=!1;this.labelCell=!1;this.linkLabel="";this.link="";this.element="comparison-cell"}static get styles(){return[super.styles,s]}render(){return e`
-    
-    <div class="cell">
-    <slot></slot>
-  </div>
-  ${this.linkLabel&&this.link?e`
-    <scw-link size="small" aria-label="${this.linkLabel}" 
-    href="${this.link}"></scw-link>
-    `:""}`}};t([a({type:Boolean,attribute:"header",reflect:!0})],r.prototype,"header",2),t([a({type:Boolean,attribute:"label-cell",reflect:!0})],r.prototype,"labelCell",2),t([a({type:String,attribute:"cta-label",reflect:!1})],r.prototype,"linkLabel",2),t([a({type:String,attribute:"cta-link",reflect:!1})],r.prototype,"link",2);export{r as a};

package/dist/chunks/chunk.LTVTK2TD.js

@@ -1,220 +0,0 @@
-import{a as s}from"./chunk.QHUZYUAT.js";import{a as n,b as o,d as i,f as c}from"./chunk.CONKFFEA.js";import{a as r}from"./chunk.G2G2TPJK.js";import{f as e}from"./chunk.PE5ZEEQ2.js";var l=n`
-:host([type=button]) {
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: var(--scw-spacing-1);
-  padding-right: var(--scw-spacing-1);
-  padding-top: var(--scw-spacing-2);
-  padding-bottom: var(--scw-spacing-2);
-}
-:host([type=button]) > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-:host([type=button]) .container {
-  z-index: 2;
-  background-color: rgba(0, 0, 0, 0);
-  border-width: 1px;
-  border-style: solid;
-  border-color: rgba(0, 0, 0, 0);
-  align-self: stretch;
-}
-:host([type=button]) .container .wrapper {
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-:host([type=button]) .container .wrapper > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-:host([type=button]) .container .label {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.8);
-  padding-right: calc(var(--scw-spacing-1) * 1.8);
-  padding-top: var(--scw-spacing-1);
-  padding-bottom: var(--scw-spacing-1);
-  text-align: CENTER;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-02);
-}
-:host([type=button]) .container .label > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.4);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-:host([type=button]) .container .image {
-  --scw-icon-color: var(--scw-color-grey-02);
-}
-:host([type=button]) .container:focus,
-:host([type=button]) .container:focus-visible {
-  background-color: var(--scw-color-grey-095);
-  border-radius: 8px 8px 8px 8px;
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-095);
-}
-
-:host([type=button][size=small]) {
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 0.5);
-  padding-right: calc(var(--scw-spacing-1) * 0.5);
-  padding-top: var(--scw-spacing-2);
-  padding-bottom: var(--scw-spacing-2);
-}
-:host([type=button][size=small]) > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-:host([type=button][size=small]) .container {
-  background-color: rgba(0, 0, 0, 0);
-}
-:host([type=button][size=small]) .container .label {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: row nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: calc(var(--scw-spacing-1) * 1.4);
-  padding-right: calc(var(--scw-spacing-1) * 1.4);
-  padding-top: calc(var(--scw-spacing-1) * 0.8);
-  padding-bottom: calc(var(--scw-spacing-1) * 0.8);
-  text-align: CENTER;
-  font: var(--scw-type-text-03-font);
-  color: var(--scw-color-grey-02);
-}
-:host([type=button][size=small]) .container .label > *:not(:last-child) {
-  margin-right: calc(var(--scw-spacing-1) * 0.4);
-  --margin-right: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-
-:host([type=button][active]) .container {
-  background-color: var(--scw-color-grey-03);
-  border-radius: 8px 8px 8px 8px;
-  border-width: 1px;
-  border-style: solid;
-  border-color: var(--scw-color-grey-03);
-}
-:host([type=button][active]) .container .label {
-  color: var(--scw-color-grey-10);
-}
-:host([type=button][active]) .container .image {
-  --scw-icon-color: var(--scw-color-grey-092);
-}
-
-:host([type=tab]) {
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-  padding: 2px 0;
-}
-:host([type=tab]) > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-:host([type=tab]) .container {
-  background-color: rgba(0, 0, 0, 0);
-}
-:host([type=tab]) .container .wrapper {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0px;
-  padding-bottom: 0px;
-}
-:host([type=tab]) .container .wrapper > *:not(:last-child) {
-  margin-bottom: 0px;
-  --margin-bottom: 0px;
-}
-:host([type=tab]) .container .label {
-  background-color: rgba(0, 0, 0, 0);
-  display: flex;
-  flex-flow: column nowrap;
-  justify-content: center;
-  align-items: center;
-  padding-left: var(--scw-spacing-3);
-  padding-right: var(--scw-spacing-3);
-  padding-top: 0px;
-  padding-bottom: 0px;
-  text-align: CENTER;
-  font: var(--scw-type-text-font);
-  color: var(--scw-color-grey-02);
-}
-:host([type=tab]) .container .label > *:not(:last-child) {
-  margin-bottom: calc(var(--scw-spacing-1) * 0.4);
-  --margin-bottom: calc( var( --scw-spacing-1 ) * 0.4 );
-}
-:host([type=tab]) .container .image {
-  --scw-icon-color: var(--scw-color-grey-02);
-}
-:host([type=tab]) .container:focus,
-:host([type=tab]) .container:focus-visible {
-  background-color: var(--scw-color-grey-095);
-  box-shadow: var(--scw-effect-focus-shadow);
-}
-
-:host([type=tab][active]) .container .label {
-  text-align: CENTER;
-  font: var(--scw-type-text-bold-font);
-  color: var(--scw-color-grey-02);
-}
-
-:host([type=tab][size=small]) .container .label {
-  text-align: CENTER;
-  font: var(--scw-type-text-03-font);
-  color: var(--scw-color-grey-02);
-}
-
-:host([type=tab][active][size=small]) .container .label {
-  text-align: CENTER;
-  font: var(--scw-type-text-semibold-03-font);
-  color: var(--scw-color-grey-02);
-}
-
-:host([image]) .container {
-  height: auto;
-}
-:host([image]) .container .wrapper .label {
-  font: inherit;
-  color: var(--scw-color-grey-03);
-}
-:host([image]) .container .wrapper .image {
-  display: block;
-}
-
-.label {
-  white-space: nowrap;
-}`;var d=0,t=class extends c{constructor(){super();this.attrId=++d;this.componentId=`scw-horizontal-nav-item-${this.attrId}`;this.href="";this.type="button";this.size="medium";this.tab=!1;this.active=!1;this.panel="";this.element="horizontal-nav-item"}static get styles(){return[super.styles,l]}connectedCallback(){super.connectedCallback(),this.tab&&this.setAttribute("role","tab")}firstUpdated(){this.href.includes(window.location.pathname)&&(this.active=!0)}handleActiveChange(){this.setAttribute("aria-selected",this.active?"true":"false")}focus(a){this.link.focus(a)}blur(){this.link.blur()}handleClick(a){this.tab&&a.preventDefault()}render(){!1||(this.id=this.id.length>0?this.id:this.componentId);let a=r` <div class="label">${this.ariaLabel}</div>`;return r`
-            <scw-link
-              @click=${this.handleClick}
-              class="container"
-              design="plain"
-              href="${this.href}">
-              <div class="wrapper">
-                <slot class="image"></slot>
-                ${a}
-                </div>
-            </scw-link>
-          `}};e([o({type:String,attribute:"href",reflect:!0})],t.prototype,"href",2),e([o({type:String,attribute:"type",reflect:!0})],t.prototype,"type",2),e([o({type:String,attribute:"size",reflect:!0})],t.prototype,"size",2),e([o({type:Boolean,attribute:"tab",reflect:!0})],t.prototype,"tab",2),e([o({type:Boolean,attribute:"active",reflect:!0})],t.prototype,"active",2),e([o({reflect:!0})],t.prototype,"panel",2),e([i("scw-link")],t.prototype,"link",2),e([s("active")],t.prototype,"handleActiveChange",1);export{t as a};