scb-wc 0.1.78 → 0.1.80

package/mvc/components/scb-snackbar/scb-snackbar.js

@@ -1,4 +1,4 @@
-import{_ as d,b as h,g as m,h as i,y as n}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as o}from"../../vendor/decorate.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(e,a,c){try{customElements.get(e)||t(e,a,c)}catch(b){var r=String(b||"");if(r.indexOf("already been used")===-1&&r.indexOf("NotSupportedError")===-1)throw b}}}}catch{}})();var p,s=(p=class extends d{constructor(...t){super(...t),this.message="",this.open=!1,this.actionText="",this.showClose=!1,this.fixed=!1,this.fadeout=!1,this.withLongerAction=!1,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}mapSpacingToken(t){if(!t)return;const e=String(t).trim();if(e)return/^\d+$/.test(e)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(e,10)))})`:e}applySpacing(){const t=this.mapSpacingToken(this.spacing),e=this.mapSpacingToken(this.spacingTop)??t,a=this.mapSpacingToken(this.spacingBottom)??t,c=this.mapSpacingToken(this.spacingLeft),r=this.mapSpacingToken(this.spacingRight);e?this.style.setProperty("--scb-snackbar-spacing-block-start",e):this.style.removeProperty("--scb-snackbar-spacing-block-start"),a?this.style.setProperty("--scb-snackbar-spacing-block-end",a):this.style.removeProperty("--scb-snackbar-spacing-block-end"),c?this.style.setProperty("--scb-snackbar-spacing-inline-start",c):this.style.removeProperty("--scb-snackbar-spacing-inline-start"),r?this.style.setProperty("--scb-snackbar-spacing-inline-end",r):this.style.removeProperty("--scb-snackbar-spacing-inline-end")}connectedCallback(){super.connectedCallback(),this.applySpacing()}handleAction(){this.dispatchEvent(new CustomEvent("snackbar-action",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("snackbaraction",{bubbles:!0,composed:!0})),this.open=!1}handleClose(){this.open=!1}updated(t){super.updated(t),t.has("open")&&(this.open?(this.dispatchEvent(new CustomEvent("snackbar-open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("snackbaropen",{bubbles:!0,composed:!0}))):(this.dispatchEvent(new CustomEvent("snackbar-close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("snackbarclose",{bubbles:!0,composed:!0})))),(t.has("open")||t.has("fadeout"))&&(this.open&&this.fadeout?(window.clearTimeout(this._fadeoutTimer),this._fadeoutTimer=window.setTimeout(()=>{this.open=!1},5e3)):window.clearTimeout(this._fadeoutTimer)),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.applySpacing()}render(){const t=!!this.actionText,e=!!this.showClose;let a="snackbar";return!t&&!e&&(a+=" no-actions"),this.withLongerAction&&(a+=" longer-action"),n`
+import{h as d,m as h,p as i,v as n,y as u}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as o}from"../../vendor/decorate.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(e,a,c){try{customElements.get(e)||t(e,a,c)}catch(b){var r=String(b||"");if(r.indexOf("already been used")===-1&&r.indexOf("NotSupportedError")===-1)throw b}}}}catch{}})();var p,s=(p=class extends d{constructor(...t){super(...t),this.message="",this.open=!1,this.actionText="",this.showClose=!1,this.fixed=!1,this.fadeout=!1,this.withLongerAction=!1,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}mapSpacingToken(t){if(!t)return;const e=String(t).trim();if(e)return/^\d+$/.test(e)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(e,10)))})`:e}applySpacing(){const t=this.mapSpacingToken(this.spacing),e=this.mapSpacingToken(this.spacingTop)??t,a=this.mapSpacingToken(this.spacingBottom)??t,c=this.mapSpacingToken(this.spacingLeft),r=this.mapSpacingToken(this.spacingRight);e?this.style.setProperty("--scb-snackbar-spacing-block-start",e):this.style.removeProperty("--scb-snackbar-spacing-block-start"),a?this.style.setProperty("--scb-snackbar-spacing-block-end",a):this.style.removeProperty("--scb-snackbar-spacing-block-end"),c?this.style.setProperty("--scb-snackbar-spacing-inline-start",c):this.style.removeProperty("--scb-snackbar-spacing-inline-start"),r?this.style.setProperty("--scb-snackbar-spacing-inline-end",r):this.style.removeProperty("--scb-snackbar-spacing-inline-end")}connectedCallback(){super.connectedCallback(),this.applySpacing()}handleAction(){this.dispatchEvent(new CustomEvent("snackbar-action",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("snackbaraction",{bubbles:!0,composed:!0})),this.open=!1}handleClose(){this.open=!1}updated(t){super.updated(t),t.has("open")&&(this.open?(this.dispatchEvent(new CustomEvent("snackbar-open",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("snackbaropen",{bubbles:!0,composed:!0}))):(this.dispatchEvent(new CustomEvent("snackbar-close",{bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("snackbarclose",{bubbles:!0,composed:!0})))),(t.has("open")||t.has("fadeout"))&&(this.open&&this.fadeout?(window.clearTimeout(this._fadeoutTimer),this._fadeoutTimer=window.setTimeout(()=>{this.open=!1},5e3)):window.clearTimeout(this._fadeoutTimer)),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.applySpacing()}render(){const t=!!this.actionText,e=!!this.showClose;let a="snackbar";return!t&&!e&&(a+=" no-actions"),this.withLongerAction&&(a+=" longer-action"),n`
       <div class="${a}" ?hidden=${!this.open}>
         ${this.withLongerAction?n`
               <div class="message">${this.message}</div>
@@ -36,93 +36,18 @@ import{_ as d,b as h,g as m,h as i,y as n}from"../../vendor/vendor.js";import"..
                   `:""}
             `}
       </div>
-    `}},p.styles=h`
-    :host {
-      position: relative;
-      display: block;
-      min-width: 312px;
-      max-width: 560px;
-      font-family: var(--brand-font, 'Inter', sans-serif);
-
-      margin-block-start: var(--scb-snackbar-spacing-block-start, 0);
-      margin-block-end: var(--scb-snackbar-spacing-block-end, 0);
-      margin-inline-start: var(--scb-snackbar-spacing-inline-start, 0);
-      margin-inline-end: var(--scb-snackbar-spacing-inline-end, 0);
-    }
-    :host([fixed]) {
-      position: fixed;
-      z-index: 9999;
-      left: 50%;
-      bottom: 24px;
-      transform: translateX(-50%);
-    }
-    .snackbar {
-      background: var(--md-sys-color-inverse-surface);
-      color: var(--md-sys-color-inverse-on-surface);
-      border-radius: var(--md-sys-shape-corner-extra-small);
-      box-shadow:
-        0 4px 8px 3px rgba(0, 0, 0, 0.15),
-        0 1px 3px 0 rgba(0, 0, 0, 0.3);
-      display: flex;
-      align-items: center;
-      padding: 14px var(--spacing-5);
-      opacity: 0;
-      transition: opacity 0.3s, bottom 0.3s;
-      pointer-events: auto;
-      position: relative;
-    }
-    .snackbar.longer-action {
-      flex-direction: column;
-      align-items: flex-start;
-    }
-    .snackbar .actions {
-      display: flex;
-      margin-top: 10px;
-      width: 100%;
-      justify-content: flex-end;
-    }
-    .message.no-actions {
-      margin-right: 0;
-    }
-    :host([open]) .snackbar {
-      opacity: 1;
-      pointer-events: auto;
-    }
-    .message {
-      flex: 1 1 auto;
-      margin-right: var(--spacing-2);
-      font-size: var(--md-sys-typescale-body-medium-size);
-      line-height: var(--md-sys-typescale-body-medium-line-height);
-      letter-spacing: var(--md-sys-typescale-body-medium-tracking);
-    }
-    .snackbar scb-icon-button {
-      --md-icon-button-icon-color: var(--md-sys-color-inverse-on-surface);
-      --md-icon-button-hover-icon-color: var(--md-sys-color-inverse-on-surface);
-      --md-icon-button-hover-state-layer-color: var(
+    `}},p.styles=u`:host{position:relative;display:block;min-width:312px;max-width:560px;font-family:var(--brand-font, 'Inter', sans-serif);margin-block-start:var(--scb-snackbar-spacing-block-start, 0);margin-block-end:var(--scb-snackbar-spacing-block-end, 0);margin-inline-start:var(--scb-snackbar-spacing-inline-start, 0);margin-inline-end:var(--scb-snackbar-spacing-inline-end, 0)}:host([fixed]){position:fixed;z-index:9999;left:50%;bottom:24px;transform:translateX(-50%)}.snackbar{background:var(--md-sys-color-inverse-surface);color:var(--md-sys-color-inverse-on-surface);border-radius:var(--md-sys-shape-corner-extra-small);box-shadow:0 4px 8px 3px rgba(0,0,0,.15),0 1px 3px 0 rgba(0,0,0,.3);display:flex;align-items:center;padding:14px var(--spacing-5);opacity:0;transition:opacity .3s,bottom .3s;pointer-events:auto;position:relative}.snackbar.longer-action{flex-direction:column;align-items:flex-start}.snackbar .actions{display:flex;margin-top:10px;width:100%;justify-content:flex-end}.message.no-actions{margin-right:0}:host([open]) .snackbar{opacity:1;pointer-events:auto}.message{flex:1 1 auto;margin-right:var(--spacing-2);font-size:var(--md-sys-typescale-body-medium-size);line-height:var(--md-sys-typescale-body-medium-line-height);letter-spacing:var(--md-sys-typescale-body-medium-tracking)}.snackbar scb-button,.snackbar scb-icon-button{--md-focus-ring-color:var(--md-sys-color-inverse-on-surface)}.snackbar scb-icon-button{--md-icon-button-icon-color:var(--md-sys-color-inverse-on-surface);--md-icon-button-hover-icon-color:var(--md-sys-color-inverse-on-surface);--md-icon-button-hover-state-layer-color:var(
         --md-sys-color-surface-container
-      );
-      --md-icon-button-focus-icon-color: var(
+      );--md-icon-button-focus-icon-color:var(
         --md-sys-color-inverse-on-surface
-      );
-      --md-icon-button-pressed-icon-color: var(
+      );--md-icon-button-pressed-icon-color:var(
         --md-sys-color-inverse-on-surface
-      );
-      --md-focus-ring-color: var(--md-sys-color-inverse-on-surface);
-    }
-    .snackbar scb-button {
-      --md-text-button-label-text-color: var(--md-sys-color-inverse-primary);
-      --md-text-button-hover-label-text-color: var(
+      )}.snackbar scb-button{--md-text-button-label-text-color:var(--md-sys-color-inverse-primary);--md-text-button-hover-label-text-color:var(
         --md-sys-color-inverse-primary
-      );
-      --md-text-button-hover-state-layer-color: var(
+      );--md-text-button-hover-state-layer-color:var(
         --md-sys-color-surface-container
-      );
-      --md-text-button-focus-label-text-color: var(
+      );--md-text-button-focus-label-text-color:var(
         --md-sys-color-inverse-primary
-      );
-      --md-text-button-pressed-label-text-color: var(
+      );--md-text-button-pressed-label-text-color:var(
         --md-sys-color-inverse-primary
-      );
-      --md-focus-ring-color: var(--md-sys-color-inverse-on-surface);
-    }
-  `,p);o([i({type:String})],s.prototype,"message",void 0);o([i({type:Boolean,reflect:!0})],s.prototype,"open",void 0);o([i({type:String,attribute:"action-text"})],s.prototype,"actionText",void 0);o([i({type:Boolean,attribute:"show-close"})],s.prototype,"showClose",void 0);o([i({type:Boolean,reflect:!0})],s.prototype,"fixed",void 0);o([i({type:Boolean})],s.prototype,"fadeout",void 0);o([i({type:Boolean,attribute:"with-longer-action"})],s.prototype,"withLongerAction",void 0);o([i({type:String,reflect:!0})],s.prototype,"spacing",void 0);o([i({type:String,attribute:"spacing-top",reflect:!0})],s.prototype,"spacingTop",void 0);o([i({type:String,attribute:"spacing-bottom",reflect:!0})],s.prototype,"spacingBottom",void 0);o([i({type:String,attribute:"spacing-left",reflect:!0})],s.prototype,"spacingLeft",void 0);o([i({type:String,attribute:"spacing-right",reflect:!0})],s.prototype,"spacingRight",void 0);s=o([m("scb-snackbar")],s);
+      )}`,p);o([i({type:String})],s.prototype,"message",void 0);o([i({type:Boolean,reflect:!0})],s.prototype,"open",void 0);o([i({type:String,attribute:"action-text"})],s.prototype,"actionText",void 0);o([i({type:Boolean,attribute:"show-close"})],s.prototype,"showClose",void 0);o([i({type:Boolean,reflect:!0})],s.prototype,"fixed",void 0);o([i({type:Boolean})],s.prototype,"fadeout",void 0);o([i({type:Boolean,attribute:"with-longer-action"})],s.prototype,"withLongerAction",void 0);o([i({type:String,reflect:!0})],s.prototype,"spacing",void 0);o([i({type:String,attribute:"spacing-top",reflect:!0})],s.prototype,"spacingTop",void 0);o([i({type:String,attribute:"spacing-bottom",reflect:!0})],s.prototype,"spacingBottom",void 0);o([i({type:String,attribute:"spacing-left",reflect:!0})],s.prototype,"spacingLeft",void 0);o([i({type:String,attribute:"spacing-right",reflect:!0})],s.prototype,"spacingRight",void 0);s=o([h("scb-snackbar")],s);

package/mvc/components/scb-status-pill/scb-status-pill.js

@@ -1,45 +1,4 @@
-import{_ as d,b as u,g as h,h as a,y as c}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/icon.js";import{t as e}from"../../vendor/decorate.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(s,r,o){try{customElements.get(s)||t(s,r,o)}catch(g){var n=String(g||"");if(n.indexOf("already been used")===-1&&n.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var p,i=(p=class extends d{constructor(...t){super(...t),this.status="",this.label="",this.showIcon=!1,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}mapSpacingToken(t){if(!t)return;const s=String(t).trim();if(s)return/^\d+$/.test(s)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(s,10)))})`:s}applySpacing(){const t=this.mapSpacingToken(this.spacing),s=this.mapSpacingToken(this.spacingTop)??t,r=this.mapSpacingToken(this.spacingBottom)??t,o=this.mapSpacingToken(this.spacingLeft),n=this.mapSpacingToken(this.spacingRight);s?this.style.setProperty("--scb-status-pill-spacing-block-start",s):this.style.removeProperty("--scb-status-pill-spacing-block-start"),r?this.style.setProperty("--scb-status-pill-spacing-block-end",r):this.style.removeProperty("--scb-status-pill-spacing-block-end"),o?this.style.setProperty("--scb-status-pill-spacing-inline-start",o):this.style.removeProperty("--scb-status-pill-spacing-inline-start"),n?this.style.setProperty("--scb-status-pill-spacing-inline-end",n):this.style.removeProperty("--scb-status-pill-spacing-inline-end")}connectedCallback(){super.connectedCallback(),this.applySpacing()}updated(t){super.updated(t),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.applySpacing()}render(){return c`
+import{h as d,m as u,p as a,v as c,y as h}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/icon.js";import{t as e}from"../../vendor/decorate.js";(function(){try{var p=typeof globalThis<"u"?globalThis:window;if(!p.__scb_ce_guard_installed__){p.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(s,r,o){try{customElements.get(s)||t(s,r,o)}catch(g){var n=String(g||"");if(n.indexOf("already been used")===-1&&n.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var l,i=(l=class extends d{constructor(...t){super(...t),this.status="",this.label="",this.showIcon=!1,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}mapSpacingToken(t){if(!t)return;const s=String(t).trim();if(s)return/^\d+$/.test(s)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(s,10)))})`:s}applySpacing(){const t=this.mapSpacingToken(this.spacing),s=this.mapSpacingToken(this.spacingTop)??t,r=this.mapSpacingToken(this.spacingBottom)??t,o=this.mapSpacingToken(this.spacingLeft),n=this.mapSpacingToken(this.spacingRight);s?this.style.setProperty("--scb-status-pill-spacing-block-start",s):this.style.removeProperty("--scb-status-pill-spacing-block-start"),r?this.style.setProperty("--scb-status-pill-spacing-block-end",r):this.style.removeProperty("--scb-status-pill-spacing-block-end"),o?this.style.setProperty("--scb-status-pill-spacing-inline-start",o):this.style.removeProperty("--scb-status-pill-spacing-inline-start"),n?this.style.setProperty("--scb-status-pill-spacing-inline-end",n):this.style.removeProperty("--scb-status-pill-spacing-inline-end")}connectedCallback(){super.connectedCallback(),this.applySpacing()}updated(t){super.updated(t),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.applySpacing()}render(){return c`
       ${this.showIcon?this.status==="success"?c`<md-icon>check_circle</md-icon>`:this.status==="warning"?c`<md-icon>warning</md-icon>`:this.status==="error"?c`<md-icon>error</md-icon>`:"":""}
       <span class="label">${this.label}</span>
-    `}},p.styles=u`
-    :host {
-      display: inline-block;
-      border-radius: var(--md-sys-shape-corner-full);
-      padding: 6px var(--spacing-5);
-      border: none;
-      box-sizing: border-box;
-      user-select: none;
-      display: flex;
-      align-items: center;
-      gap: var(--spacing-3);
-      width: fit-content;
-      font-family: var(--brand-font);
-
-      margin-block-start: var(--scb-status-pill-spacing-block-start, 0);
-      margin-block-end: var(--scb-status-pill-spacing-block-end, 0);
-      margin-inline-start: var(--scb-status-pill-spacing-inline-start, 0);
-      margin-inline-end: var(--scb-status-pill-spacing-inline-end, 0);
-    }
-
-    .label {
-      font-size: var(--md-sys-typescale-label-medium-size);
-      line-height: var(--md-sys-typescale-label-medium-line-height);
-      font-weight: var(--md-sys-typescale-label-medium-weight);
-      letter-spacing: var(--md-sys-typescale-label-medium-tracking);
-    }
-
-    :host([status='success']) {
-      background: var(--md-sys-color-success-container);
-      color: var(--md-sys-color-on-success-container);
-    }
-
-    :host([status='warning']) {
-      background: var(--md-sys-color-warning-container);
-      color: var(--md-sys-color-on-warning-container);
-    }
-
-    :host([status='error']) {
-      background: var(--md-sys-color-error-container);
-      color: var(--md-sys-color-on-error-container);
-    }
-  `,p);e([a({type:String})],i.prototype,"status",void 0);e([a({type:String})],i.prototype,"label",void 0);e([a({type:Boolean,attribute:"show-icon"})],i.prototype,"showIcon",void 0);e([a({type:String,reflect:!0})],i.prototype,"spacing",void 0);e([a({type:String,attribute:"spacing-top",reflect:!0})],i.prototype,"spacingTop",void 0);e([a({type:String,attribute:"spacing-bottom",reflect:!0})],i.prototype,"spacingBottom",void 0);e([a({type:String,attribute:"spacing-left",reflect:!0})],i.prototype,"spacingLeft",void 0);e([a({type:String,attribute:"spacing-right",reflect:!0})],i.prototype,"spacingRight",void 0);i=e([h("scb-status-pill")],i);
+    `}},l.styles=h`:host{display:inline-block;border-radius:var(--md-sys-shape-corner-full);padding:6px var(--spacing-5);border:0;box-sizing:border-box;user-select:none;display:flex;align-items:center;gap:var(--spacing-3);width:fit-content;font-family:var(--brand-font);margin-block-start:var(--scb-status-pill-spacing-block-start, 0);margin-block-end:var(--scb-status-pill-spacing-block-end, 0);margin-inline-start:var(--scb-status-pill-spacing-inline-start, 0);margin-inline-end:var(--scb-status-pill-spacing-inline-end, 0)}.label{font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);font-weight:var(--md-sys-typescale-label-medium-weight);letter-spacing:var(--md-sys-typescale-label-medium-tracking)}:host([status='success']){background:var(--md-sys-color-success-container);color:var(--md-sys-color-on-success-container)}:host([status='warning']){background:var(--md-sys-color-warning-container);color:var(--md-sys-color-on-warning-container)}:host([status='error']){background:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}`,l);e([a({type:String})],i.prototype,"status",void 0);e([a({type:String})],i.prototype,"label",void 0);e([a({type:Boolean,attribute:"show-icon"})],i.prototype,"showIcon",void 0);e([a({type:String,reflect:!0})],i.prototype,"spacing",void 0);e([a({type:String,attribute:"spacing-top",reflect:!0})],i.prototype,"spacingTop",void 0);e([a({type:String,attribute:"spacing-bottom",reflect:!0})],i.prototype,"spacingBottom",void 0);e([a({type:String,attribute:"spacing-left",reflect:!0})],i.prototype,"spacingLeft",void 0);e([a({type:String,attribute:"spacing-right",reflect:!0})],i.prototype,"spacingRight",void 0);i=e([u("scb-status-pill")],i);

package/mvc/components/scb-stepper/scb-step.js

@@ -1,11 +1,12 @@
-import{_ as b,b as p,g as h,h as a,y as s}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/md-focus-ring.js";import"../../vendor/icon.js";import"../../vendor/ripple.js";import{t as i}from"../../vendor/decorate.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(o,d,m){try{customElements.get(o)||e(o,d,m)}catch(c){var r=String(c||"");if(r.indexOf("already been used")===-1&&r.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var l,t=(l=class extends b{constructor(...e){super(...e),this.label="",this.subLabel="",this.symbolVariant="number",this.number=0,this.active=!1,this.completed=!1,this.changeOnCompleted=!1,this.islast=!1,this.variant="horizontal",this.widthWeight=1,this.icon=""}updated(){!this.subLabel||this.subLabel.trim()===""?this.setAttribute("no-content",""):this.removeAttribute("no-content"),this.widthWeight>0?this.style.setProperty("--scb-step-width-weight",String(this.widthWeight)):this.style.removeProperty("--scb-step-width-weight")}handleKeyDown(e){e.key==="Enter"||e.key===" "?(e.preventDefault(),this.dispatchEvent(new MouseEvent("click",{bubbles:!0,composed:!0}))):(e.key==="ArrowRight"||e.key==="ArrowLeft")&&(this.dispatchEvent(new CustomEvent("scb-stepper-keynav",{detail:{key:e.key},bubbles:!0,composed:!0})),e.preventDefault())}render(){const e=this.active?"step":void 0,o=this.label?`${this.label}${this.subLabel?": "+this.subLabel:""}`:void 0;switch(this.symbolVariant){case"icon":return s`
+import{h as p,m as h,p as a,v as s,y as u}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/icon.js";import"../../vendor/ripple.js";import{n}from"../../vendor/lazy-focus-ring.js";import{t as i}from"../../vendor/decorate.js";(function(){try{var o=typeof globalThis<"u"?globalThis:window;if(!o.__scb_ce_guard_installed__){o.__scb_ce_guard_installed__=!0;var e=customElements.define.bind(customElements);customElements.define=function(l,m,b){try{customElements.get(l)||e(l,m,b)}catch(d){var c=String(d||"");if(c.indexOf("already been used")===-1&&c.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var r,t=(r=class extends p{constructor(...e){super(...e),this.label="",this.subLabel="",this.symbolVariant="number",this.number=0,this.active=!1,this.completed=!1,this.changeOnCompleted=!1,this.islast=!1,this.variant="horizontal",this.widthWeight=1,this.icon=""}updated(){!this.subLabel||this.subLabel.trim()===""?this.setAttribute("no-content",""):this.removeAttribute("no-content"),this.widthWeight>0?this.style.setProperty("--scb-step-width-weight",String(this.widthWeight)):this.style.removeProperty("--scb-step-width-weight")}handleKeyDown(e){e.key==="Enter"||e.key===" "?(e.preventDefault(),this.dispatchEvent(new MouseEvent("click",{bubbles:!0,composed:!0}))):(e.key==="ArrowRight"||e.key==="ArrowLeft")&&(this.dispatchEvent(new CustomEvent("scb-stepper-keynav",{detail:{key:e.key},bubbles:!0,composed:!0})),e.preventDefault())}render(){const e=this.active?"step":void 0,l=this.label?`${this.label}${this.subLabel?": "+this.subLabel:""}`:void 0;switch(this.symbolVariant){case"icon":return s`
                     <div
                         class="scb-step-content"
                         tabindex="0"
                         role="listitem"
                         aria-current=${e}
-                        aria-label=${o}
+                        aria-label=${l}
                         @keydown=${this.handleKeyDown}
+                        @focusin=${n}
                     >
                         <md-ripple></md-ripple>
                         <div class="symbol">
@@ -23,8 +24,9 @@ import{_ as b,b as p,g as h,h as a,y as s}from"../../vendor/vendor.js";import"..
                         tabindex="0"
                         role="listitem"
                         aria-current=${e}
-                        aria-label=${o}
+                        aria-label=${l}
                         @keydown=${this.handleKeyDown}
+                        @focusin=${n}
                     >
                         <md-ripple></md-ripple>
                         <div class="symbol">
@@ -42,8 +44,9 @@ import{_ as b,b as p,g as h,h as a,y as s}from"../../vendor/vendor.js";import"..
                         tabindex="0"
                         role="listitem"
                         aria-current=${e}
-                        aria-label=${o}
+                        aria-label=${l}
                         @keydown=${this.handleKeyDown}
+                        @focusin=${n}
                     >
                         <md-ripple></md-ripple>
                         <div class="symbol">
@@ -55,185 +58,4 @@ import{_ as b,b as p,g as h,h as a,y as s}from"../../vendor/vendor.js";import"..
                         </div>
                         <md-focus-ring></md-focus-ring>
                     </div>
-                `}}},l.styles=p`
-    :host {
-        font-family: var(--brand-font);
-        --scb-step-slide-from-x: 0px;
-        --scb-step-slide-from-y: 0px;
-        --scb-step-label-active-weight: 600;
-    }
-    .scb-step-content {
-        width: fit-content;
-        max-width: 100%;
-        min-width: 0;
-        min-height: 100%;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        position: relative;
-        margin-inline: auto;
-        cursor: pointer;
-        background: none;
-        box-sizing: border-box;
-        user-select: none;
-        padding-block: var(--spacing-1);
-        padding-inline: var(--spacing-4);
-    }
-    .scb-step-content:focus,
-    .scb-step-content:focus-visible {
-        outline: none ;
-        box-shadow: none ;
-    }
-    .symbol {
-        background-color: var(--md-sys-color-outline-variant);
-        color: var(--md-sys-color-on-primary);
-        border-radius: var(--md-sys-shape-corner-full);
-        min-width: var(--icon-size-medium);
-        height: var(--icon-size-medium);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-weight: var(--md-sys-typescale-label-small-weight);
-        font-size: var(--md-sys-typescale-label-small-size);
-        line-height: var(--md-sys-typescale-label-small-line-height);
-        letter-spacing: var(--md-sys-typescale-label-small-tracking);
-        position: relative;
-        z-index: 1;
-            will-change: transform, opacity;
-        transition:
-          background-color var(--motion-duration-short) var(--motion-easing-standard),
-          color var(--motion-duration-short) var(--motion-easing-standard),
-          transform var(--motion-duration-short) var(--motion-easing-emphasized);
-        padding: var(--spacing-3);  
-    }
-    md-focus-ring {
-        border-radius: var(--md-sys-shape-corner-small);
-    }
-    md-icon {
-      font-size: 20px;
-    }
-    :host([active]) .symbol {
-      background-color: var(--md-sys-color-primary);
-      color: var(--md-sys-color-on-primary);
-    }
-    :host([completed]) .symbol {
-      background-color: var(--md-sys-color-primary);
-      color: var(--md-sys-color-on-primary);
-    }
-    .label {
-      margin-top: var(--spacing-3);
-      text-align: center;
-      font-size: var(--md-sys-typescale-label-medium-size);
-      line-height: var(--md-sys-typescale-label-medium-line-height);
-      letter-spacing: var(--md-sys-typescale-label-medium-tracking);
-      color: var(--md-sys-color-on-surface);
-      max-width: 90px;
-      word-break: break-word;
-      margin-bottom: var(--spacing-3);
-      display: grid;
-      justify-items: center;
-    }
-    .label::before {
-      content: attr(data-label);
-      font-weight: var(--scb-step-label-active-weight);
-      grid-area: 1 / 1;
-      height: 0;
-      overflow: hidden;
-      visibility: hidden;
-      white-space: inherit;
-    }
-    .label-text {
-      grid-area: 1 / 1;
-    }
-    .sub-label {
-      text-align: center;
-      display: grid;
-      justify-items: center;
-    }
-    .sub-label::before {
-      content: attr(data-label);
-      font-weight: var(--scb-step-label-active-weight);
-      grid-area: 1 / 1;
-      height: 0;
-      overflow: hidden;
-      visibility: hidden;
-      white-space: inherit;
-    }
-    .sub-label-text {
-      grid-area: 1 / 1;
-    }
-    :host([active]) .label, :host([active]) .sub-label {
-      font-weight: var(--scb-step-label-active-weight);
-    }
-    .content{
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        min-width: 0;
-        will-change: transform, opacity;
-    }
-    :host([variant="vertical"]) {
-        .scb-step-content {
-            width: 100%;
-            flex-direction: row;
-            align-items: flex-start;
-            gap: var(--spacing-5);
-            margin-inline: 0;
-            padding: var(--spacing-4);
-        }
-    }
-    :host([no-content]) {
-      .scb-step-content {
-        align-items: center;
-        .label {
-            margin-bottom: 0px;
-        }
-    }
-    }
-    :host([variant="vertical"]) .label{
-        margin-top: 0;
-        max-width: none;
-        text-align: left;
-        justify-items: start;
-        word-break: normal;
-    }
-    :host([variant="vertical"]) .sub-label{
-        text-align: left;
-        justify-items: start;
-        word-break: normal;
-    }
-    :host([variant="vertical"]) .content{
-        align-items: flex-start;
-        min-width: 0;
-    }
-    :host([symbol-variant="marker"]) .symbol {
-        min-width: 16px;
-        height: 16px;
-    }
-    :host([symbol-variant="marker"][completed][change-on-completed]) .symbol {
-        background-color: transparent;
-        color: var(--md-sys-color-primary);
-        md-icon{
-            font-size: var(--icon-size-small);
-        }
-    }
-
-    :host([active]) .symbol {
-      --scb-kf-pulse-scale: 1.08;
-      animation-duration: var(--motion-duration-medium);
-      animation-timing-function: var(--motion-easing-emphasized);
-      animation-iteration-count: 1;
-      animation-fill-mode: both;
-      animation-name: var(--motion-keyframe-pulse, scb-kf-pulse);
-    }
-
-    :host([completed]:not([active])) .symbol {
-      --scb-kf-pulse-scale: 1.04;
-      animation-duration: var(--motion-duration-short);
-      animation-timing-function: var(--motion-easing-standard);
-      animation-iteration-count: 1;
-      animation-fill-mode: both;
-      animation-name: var(--motion-keyframe-pulse, scb-kf-pulse);
-    }
-
-  `,l);i([a({type:String,reflect:!0})],t.prototype,"label",void 0);i([a({type:String,reflect:!0,attribute:"sub-label"})],t.prototype,"subLabel",void 0);i([a({type:String,reflect:!0,attribute:"symbol-variant"})],t.prototype,"symbolVariant",void 0);i([a({type:Number,reflect:!0})],t.prototype,"number",void 0);i([a({type:Boolean,reflect:!0})],t.prototype,"active",void 0);i([a({type:Boolean,reflect:!0})],t.prototype,"completed",void 0);i([a({type:Boolean,reflect:!0,attribute:"change-on-completed"})],t.prototype,"changeOnCompleted",void 0);i([a({type:Boolean,reflect:!0})],t.prototype,"islast",void 0);i([a({type:String,reflect:!0})],t.prototype,"variant",void 0);i([a({type:Number,reflect:!0,attribute:"width-weight"})],t.prototype,"widthWeight",void 0);i([a({type:String})],t.prototype,"icon",void 0);t=i([h("scb-step")],t);
+                `}}},r.styles=u`:host{font-family:var(--brand-font);--scb-step-slide-from-x:0px;--scb-step-slide-from-y:0px;--scb-step-label-active-weight:600}.scb-step-content{width:fit-content;max-width:100%;min-width:0;min-height:100%;display:flex;flex-direction:column;align-items:center;position:relative;margin-inline:auto;cursor:pointer;background:0 0;box-sizing:border-box;user-select:none;padding-block:var(--spacing-1);padding-inline:var(--spacing-4)}.scb-step-content:focus,.scb-step-content:focus-visible{outline:0;box-shadow:none}.symbol{background-color:var(--md-sys-color-outline-variant);color:var(--md-sys-color-on-primary);border-radius:var(--md-sys-shape-corner-full);min-width:var(--icon-size-medium);height:var(--icon-size-medium);display:flex;align-items:center;justify-content:center;font-weight:var(--md-sys-typescale-label-small-weight);font-size:var(--md-sys-typescale-label-small-size);line-height:var(--md-sys-typescale-label-small-line-height);letter-spacing:var(--md-sys-typescale-label-small-tracking);position:relative;z-index:1;will-change:transform,opacity;transition:background-color var(--motion-duration-short) var(--motion-easing-standard),color var(--motion-duration-short) var(--motion-easing-standard),transform var(--motion-duration-short) var(--motion-easing-emphasized);padding:var(--spacing-3)}md-focus-ring{border-radius:var(--md-sys-shape-corner-small)}md-icon{font-size:20px}:host([active]) .symbol,:host([completed]) .symbol{background-color:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary)}.label{margin-top:var(--spacing-3);text-align:center;font-size:var(--md-sys-typescale-label-medium-size);line-height:var(--md-sys-typescale-label-medium-line-height);letter-spacing:var(--md-sys-typescale-label-medium-tracking);color:var(--md-sys-color-on-surface);max-width:90px;word-break:break-word;margin-bottom:var(--spacing-3);display:grid;justify-items:center}.label::before,.sub-label::before{content:attr(data-label);font-weight:var(--scb-step-label-active-weight);grid-area:1/1;height:0;overflow:hidden;visibility:hidden;white-space:inherit}.label-text{grid-area:1/1}.sub-label{text-align:center;display:grid;justify-items:center}.sub-label-text{grid-area:1/1}:host([active]) .label,:host([active]) .sub-label{font-weight:var(--scb-step-label-active-weight)}.content{display:flex;flex-direction:column;align-items:center;min-width:0;will-change:transform,opacity}:host([variant="vertical"]) .label{margin-top:0;max-width:none}:host([variant="vertical"]) .label,:host([variant="vertical"]) .sub-label{text-align:left;justify-items:start;word-break:normal}:host([variant="vertical"]) .content{align-items:flex-start;min-width:0}:host([symbol-variant="marker"]) .symbol{min-width:16px;height:16px}:host([symbol-variant="marker"][completed][change-on-completed]) .symbol{background-color:transparent;color:var(--md-sys-color-primary)}:host([active]) .symbol,:host([completed]:not([active])) .symbol{animation-iteration-count:1;animation-fill-mode:both;animation-name:var(--motion-keyframe-pulse, scb-kf-pulse)}:host([active]) .symbol{--scb-kf-pulse-scale:1.08;animation-duration:var(--motion-duration-medium);animation-timing-function:var(--motion-easing-emphasized)}:host([completed]:not([active])) .symbol{--scb-kf-pulse-scale:1.04;animation-duration:var(--motion-duration-short);animation-timing-function:var(--motion-easing-standard)}`,r);i([a({type:String,reflect:!0})],t.prototype,"label",void 0);i([a({type:String,reflect:!0,attribute:"sub-label"})],t.prototype,"subLabel",void 0);i([a({type:String,reflect:!0,attribute:"symbol-variant"})],t.prototype,"symbolVariant",void 0);i([a({type:Number,reflect:!0})],t.prototype,"number",void 0);i([a({type:Boolean,reflect:!0})],t.prototype,"active",void 0);i([a({type:Boolean,reflect:!0})],t.prototype,"completed",void 0);i([a({type:Boolean,reflect:!0,attribute:"change-on-completed"})],t.prototype,"changeOnCompleted",void 0);i([a({type:Boolean,reflect:!0})],t.prototype,"islast",void 0);i([a({type:String,reflect:!0})],t.prototype,"variant",void 0);i([a({type:Number,reflect:!0,attribute:"width-weight"})],t.prototype,"widthWeight",void 0);i([a({type:String})],t.prototype,"icon",void 0);t=i([h("scb-step")],t);

package/mvc/components/scb-stepper/scb-stepper.js

@@ -1,4 +1,4 @@
-import{_,b as x,g as k,h as l,y as w}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as p}from"../../vendor/decorate.js";import{n as I,t as c}from"../../vendor/assertClassBrand.js";import{n as g,r as y,t as b}from"../../vendor/classPrivateFieldGet2.js";import"./scb-step.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(e,s,r){try{customElements.get(e)||t(e,s,r)}catch(h){var i=String(h||"");if(i.indexOf("already been used")===-1&&i.indexOf("NotSupportedError")===-1)throw h}}}}catch{}})();var v,d,a,u,o=(v=new WeakMap,d=new WeakMap,a=new WeakSet,u=class extends _{constructor(...t){super(...t),I(this,a),y(this,v,void 0),y(this,d,void 0),this.type="",this.label="",this.changeOnCompleted=!1,this.variant="horizontal",this.symbolVariant="number",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.activeIndex=0,g(d,this,0),this._onKeyNav=e=>{const s=this._getSteps(),r=this.activeIndex;let i=r;e.detail.key==="ArrowRight"?r<s.length-1?i=r+1:i=0:e.detail.key==="ArrowLeft"&&(r>0?i=r-1:i=s.length-1),i!==r&&(this._onStepClick(i),setTimeout(()=>{const h=s[i].shadowRoot?.querySelector(".scb-step-content");h&&"focus"in h&&typeof h.focus=="function"&&h.focus()},0))},this._onStepContainerClick=e=>{const s=this._getSteps(),r=e.composedPath(),i=s.findIndex(h=>r.includes(h));i!==-1&&this._onStepClick(i)},this._onSlotChange=()=>{const e=this._getSteps();if(e.length===0){this.activeIndex=0;return}this.activeIndex>e.length-1?this.activeIndex=e.length-1:this.activeIndex<0&&(this.activeIndex=0),this._updateSteps(),c(a,this,f).call(this)}}_onStepClick(t){const e=this.activeIndex;this.activeIndex=t,this._updateSteps(),this.dispatchEvent(new CustomEvent("step-change",{detail:{index:this.activeIndex,step:this._getSteps()[this.activeIndex]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepchange",{detail:{index:this.activeIndex,step:this._getSteps()[this.activeIndex]},bubbles:!0,composed:!0})),t>e?(this.dispatchEvent(new CustomEvent("step-next",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepnext",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0}))):t<e&&(this.dispatchEvent(new CustomEvent("step-prev",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepprev",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})))}nextStep(){const t=this._getSteps();this.activeIndex<t.length-1&&this._onStepClick(this.activeIndex+1)}prevStep(){this.activeIndex>0&&this._onStepClick(this.activeIndex-1)}getActiveIndex(){return this.activeIndex}_updateSteps(){const t=this._getSteps();this.style.setProperty("--scb-stepper-step-count",String(Math.max(1,t.length))),t.forEach((e,s)=>{e.active=s===this.activeIndex,e.completed=s<this.activeIndex,e.islast=!1,e.changeOnCompleted=this.changeOnCompleted,e.number=s+1,e.variant=this.variant,e.symbolVariant=this.symbolVariant}),t.length>0&&(t[t.length-1].islast=!0)}_getSteps(){return Array.from(this.querySelectorAll("scb-step"))}firstUpdated(t){this._updateSteps(),c(a,this,S).call(this),c(a,this,f).call(this)}updated(t){this._updateSteps(),(t.has("variant")||t.has("symbolVariant"))&&c(a,this,f).call(this),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&c(a,this,S).call(this)}render(){return w`
+import{h as _,m as x,p as l,v as k,y as w}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as p}from"../../vendor/decorate.js";import{n as I,t as c}from"../../vendor/assertClassBrand.js";import{n as g,r as y,t as b}from"../../vendor/classPrivateFieldGet2.js";import"./scb-step.js";(function(){try{var n=typeof globalThis<"u"?globalThis:window;if(!n.__scb_ce_guard_installed__){n.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(e,s,r){try{customElements.get(e)||t(e,s,r)}catch(h){var i=String(h||"");if(i.indexOf("already been used")===-1&&i.indexOf("NotSupportedError")===-1)throw h}}}}catch{}})();var v,d,a,u,o=(v=new WeakMap,d=new WeakMap,a=new WeakSet,u=class extends _{constructor(...t){super(...t),I(this,a),y(this,v,void 0),y(this,d,void 0),this.type="",this.label="",this.changeOnCompleted=!1,this.variant="horizontal",this.symbolVariant="number",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this.activeIndex=0,g(d,this,0),this._onKeyNav=e=>{const s=this._getSteps(),r=this.activeIndex;let i=r;e.detail.key==="ArrowRight"?r<s.length-1?i=r+1:i=0:e.detail.key==="ArrowLeft"&&(r>0?i=r-1:i=s.length-1),i!==r&&(this._onStepClick(i),setTimeout(()=>{const h=s[i].shadowRoot?.querySelector(".scb-step-content");h&&"focus"in h&&typeof h.focus=="function"&&h.focus()},0))},this._onStepContainerClick=e=>{const s=this._getSteps(),r=e.composedPath(),i=s.findIndex(h=>r.includes(h));i!==-1&&this._onStepClick(i)},this._onSlotChange=()=>{const e=this._getSteps();if(e.length===0){this.activeIndex=0;return}this.activeIndex>e.length-1?this.activeIndex=e.length-1:this.activeIndex<0&&(this.activeIndex=0),this._updateSteps(),c(a,this,m).call(this)}}_onStepClick(t){const e=this.activeIndex;this.activeIndex=t,this._updateSteps(),this.dispatchEvent(new CustomEvent("step-change",{detail:{index:this.activeIndex,step:this._getSteps()[this.activeIndex]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepchange",{detail:{index:this.activeIndex,step:this._getSteps()[this.activeIndex]},bubbles:!0,composed:!0})),t>e?(this.dispatchEvent(new CustomEvent("step-next",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepnext",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0}))):t<e&&(this.dispatchEvent(new CustomEvent("step-prev",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepprev",{detail:{from:e,to:t,step:this._getSteps()[t]},bubbles:!0,composed:!0})))}nextStep(){const t=this._getSteps();this.activeIndex<t.length-1&&this._onStepClick(this.activeIndex+1)}prevStep(){this.activeIndex>0&&this._onStepClick(this.activeIndex-1)}getActiveIndex(){return this.activeIndex}_updateSteps(){const t=this._getSteps();this.style.setProperty("--scb-stepper-step-count",String(Math.max(1,t.length))),t.forEach((e,s)=>{e.active=s===this.activeIndex,e.completed=s<this.activeIndex,e.islast=!1,e.changeOnCompleted=this.changeOnCompleted,e.number=s+1,e.variant=this.variant,e.symbolVariant=this.symbolVariant}),t.length>0&&(t[t.length-1].islast=!0)}_getSteps(){return Array.from(this.querySelectorAll("scb-step"))}firstUpdated(t){this._updateSteps(),c(a,this,S).call(this),c(a,this,m).call(this)}updated(t){this._updateSteps(),(t.has("variant")||t.has("symbolVariant"))&&c(a,this,m).call(this),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&c(a,this,S).call(this)}render(){return k`
       <div
         class="steps"
         role="list"
@@ -8,132 +8,4 @@ import{_,b as x,g as k,h as l,y as w}from"../../vendor/vendor.js";import"../../v
       >
         <slot @slotchange=${this._onSlotChange}></slot>
       </div>
-    `}connectedCallback(){super.connectedCallback(),typeof ResizeObserver<"u"&&(g(v,this,new ResizeObserver(()=>{c(a,this,f).call(this)})),b(v,this).observe(this))}disconnectedCallback(){b(v,this)&&(b(v,this).disconnect(),g(v,this,void 0)),b(d,this)&&(cancelAnimationFrame(b(d,this)),g(d,this,0)),super.disconnectedCallback()}},u.styles=x`
-    :host {
-      --scb-stepper-width: 100%;
-      --scb-stepper-height: 100%;
-      --scb-stepper-step-count: 1;
-      --scb-stepper-connector-gap: var(--spacing-2);
-      --scb-stepper-symbol-size: var(--icon-size-medium);
-      display: block;
-      padding: var(--spacing-5) 0;
-      width: 100%;
-      color: var(--md-sys-color-on-surface);
-      font-family: var(--brand-font);
-      max-width: var(--scb-stepper-width);
-      height: var(--scb-stepper-height);
-
-      margin-block-start: var(--scb-stepper-spacing-block-start, 0);
-      margin-block-end: var(--scb-stepper-spacing-block-end, 0);
-      margin-inline-start: var(--scb-stepper-spacing-inline-start, 0);
-      margin-inline-end: var(--scb-stepper-spacing-inline-end, 0);
-    }
-    .steps {
-      display: flex;
-      flex-direction: row;
-      align-items: stretch;
-      justify-content: center;
-      position: relative;
-      width: 100%;
-      gap: 0;
-      height: 100%;
-    }
-    :host([variant='vertical']) .steps {
-      flex-direction: column;
-      gap: var(--spacing-8);
-    }
-
-    :host([symbol-variant='marker']) {
-      --scb-stepper-symbol-size: 16px;
-    }
-    ::slotted(scb-step) {
-      position: relative;
-      z-index: 1;
-      width: 100%;
-      min-width: 0;
-    }
-
-    :host([variant='horizontal']) ::slotted(scb-step) {
-      flex: var(--scb-step-width-weight, 1) 1 0;
-    }
-
-    /* Horisontell connector
-       Bygger upp en linje per steg, med glapp både före och efter varje symbol.
-       Första steget ritar bara sin högra del och sista steget ritar bara sin vänstra del.
-    */
-    :host([variant='horizontal']) ::slotted(scb-step)::before,
-    :host([variant='horizontal']) ::slotted(scb-step)::after {
-      content: '';
-      position: absolute;
-      top: calc(var(--spacing-4) + (var(--scb-stepper-symbol-size) / 2));
-      height: 1px;
-      background-color: var(--n-70);
-      transition: background-color var(--motion-duration-medium) var(--motion-easing-standard);
-      z-index: 0;
-      pointer-events: none;
-    }
-
-    :host([variant='horizontal']) ::slotted(scb-step)::before {
-      left: 0;
-      right: calc(50% + (var(--scb-stepper-symbol-size) / 2) + var(--scb-stepper-connector-gap));
-    }
-
-    :host([variant='horizontal']) ::slotted(scb-step)::after {
-      left: calc(50% + (var(--scb-stepper-symbol-size) / 2) + var(--scb-stepper-connector-gap));
-      right: 0;
-    }
-
-    :host([variant='horizontal']) ::slotted(scb-step:first-child)::before {
-      display: none;
-    }
-
-    :host([variant='horizontal']) ::slotted(scb-step:last-child)::after {
-      display: none;
-    }
-
-    :host([variant='horizontal']) ::slotted(scb-step[completed])::before,
-    :host([variant='horizontal']) ::slotted(scb-step[completed])::after {
-      background-color: var(--md-sys-color-primary);
-    }
-    :host([variant='horizontal']) ::slotted(scb-step[active])::before {
-      background-color: var(--md-sys-color-primary);
-    }
-    /* Vertikal connector */
-    ::slotted(scb-step[variant='vertical'][completed]:not(:last-child))::after {
-      background-color: var(--md-sys-color-primary);
-    }
-    ::slotted(scb-step[variant='vertical'][symbol-variant='marker'][completed]:not(:last-child))::after {
-      background-color: var(--md-sys-color-primary);
-    }
-
-    ::slotted(scb-step[variant='vertical']:not(:first-child))::before {
-      display: none;
-    }
-    ::slotted(scb-step[variant='vertical']:not(:last-child))::after {
-      content: '';
-      position: absolute;
-      left: 28px;
-      top: 52px;
-      width: 1px;
-      height: calc(100% - 16px);
-      background-color: var(--n-70);
-      transition: background-color var(--motion-duration-medium) var(--motion-easing-standard);
-      z-index: 0;
-      transform: translateX(-50%);
-    }
-    ::slotted(scb-step[variant='vertical'][symbol-variant='marker']:not(:last-child))::after {
-      content: '';
-      position: absolute;
-      left: 20px;
-      top: 38px;
-      width: 1px;
-      height: calc(100% - 2px);
-      background-color: var(--n-70);
-      transition: background-color var(--motion-duration-medium) var(--motion-easing-standard);
-      z-index: 0;
-      transform: translateX(-50%);
-    }
-    ::slotted(scb-step[symbol-variant='marker']:not(:first-child))::before {
-      top: 20px;
-    }
-  `,u);function S(){const n=c(a,this,m).call(this,this.spacing),t=c(a,this,m).call(this,this.spacingTop)??n,e=c(a,this,m).call(this,this.spacingBottom)??n,s=c(a,this,m).call(this,this.spacingLeft),r=c(a,this,m).call(this,this.spacingRight);t?this.style.setProperty("--scb-stepper-spacing-block-start",t):this.style.removeProperty("--scb-stepper-spacing-block-start"),e?this.style.setProperty("--scb-stepper-spacing-block-end",e):this.style.removeProperty("--scb-stepper-spacing-block-end"),s?this.style.setProperty("--scb-stepper-spacing-inline-start",s):this.style.removeProperty("--scb-stepper-spacing-inline-start"),r?this.style.setProperty("--scb-stepper-spacing-inline-end",r):this.style.removeProperty("--scb-stepper-spacing-inline-end")}function m(n){if(!n)return;const t=String(n).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}function f(){b(d,this)||g(d,this,requestAnimationFrame(()=>{g(d,this,0),c(a,this,C).call(this)}))}function C(){const n=this._getSteps();n.length!==0&&n.forEach(t=>{const e=t.shadowRoot;if(!e)return;const s=e.querySelector(".label"),r=e.querySelector(".scb-step-content");if(!s)return;if(this.variant!=="horizontal"){s.style.removeProperty("max-width"),s.style.removeProperty("white-space"),s.style.removeProperty("word-break"),s.style.removeProperty("overflow-wrap");return}s.style.maxWidth="none",s.style.whiteSpace="nowrap",s.style.wordBreak="normal",s.style.overflowWrap="normal";const i=r?.clientWidth??t.clientWidth;i>0&&s.scrollWidth>i&&(s.style.maxWidth="100%",s.style.whiteSpace="normal",s.style.wordBreak="break-word",s.style.overflowWrap="anywhere")})}p([l({type:String,reflect:!0})],o.prototype,"type",void 0);p([l({type:String,reflect:!0})],o.prototype,"label",void 0);p([l({type:Boolean,reflect:!0,attribute:"change-on-completed"})],o.prototype,"changeOnCompleted",void 0);p([l({type:String})],o.prototype,"variant",void 0);p([l({type:String,reflect:!0,attribute:"symbol-variant"})],o.prototype,"symbolVariant",void 0);p([l({type:String,reflect:!0})],o.prototype,"spacing",void 0);p([l({type:String,attribute:"spacing-top",reflect:!0})],o.prototype,"spacingTop",void 0);p([l({type:String,attribute:"spacing-bottom",reflect:!0})],o.prototype,"spacingBottom",void 0);p([l({type:String,attribute:"spacing-left",reflect:!0})],o.prototype,"spacingLeft",void 0);p([l({type:String,attribute:"spacing-right",reflect:!0})],o.prototype,"spacingRight",void 0);p([l({type:Number,reflect:!0,attribute:"active-index"})],o.prototype,"activeIndex",void 0);o=p([k("scb-stepper")],o);
+    `}connectedCallback(){super.connectedCallback(),typeof ResizeObserver<"u"&&(g(v,this,new ResizeObserver(()=>{c(a,this,m).call(this)})),b(v,this).observe(this))}disconnectedCallback(){b(v,this)&&(b(v,this).disconnect(),g(v,this,void 0)),b(d,this)&&(cancelAnimationFrame(b(d,this)),g(d,this,0)),super.disconnectedCallback()}},u.styles=w`:host{--scb-stepper-width:100%;--scb-stepper-height:100%;--scb-stepper-step-count:1;--scb-stepper-connector-gap:var(--spacing-2);--scb-stepper-symbol-size:var(--icon-size-medium);display:block;padding:var(--spacing-5)0;width:100%;color:var(--md-sys-color-on-surface);font-family:var(--brand-font);max-width:var(--scb-stepper-width);height:var(--scb-stepper-height);margin-block-start:var(--scb-stepper-spacing-block-start, 0);margin-block-end:var(--scb-stepper-spacing-block-end, 0);margin-inline-start:var(--scb-stepper-spacing-inline-start, 0);margin-inline-end:var(--scb-stepper-spacing-inline-end, 0)}.steps{display:flex;flex-direction:row;align-items:stretch;justify-content:center;position:relative;width:100%;gap:0;height:100%}:host([variant='vertical']) .steps{flex-direction:column;gap:var(--spacing-8)}:host([symbol-variant='marker']){--scb-stepper-symbol-size:16px}::slotted(scb-step){position:relative;z-index:1;width:100%;min-width:0}:host([variant='horizontal']) ::slotted(scb-step){flex:var(--scb-step-width-weight, 1)1 0}:host([variant='horizontal']) ::slotted(scb-step)::after,:host([variant='horizontal']) ::slotted(scb-step)::before{content:"";position:absolute;top:calc(var(--spacing-4) + (var(--scb-stepper-symbol-size)/2));height:1px;background-color:var(--n-70);transition:background-color var(--motion-duration-medium) var(--motion-easing-standard);z-index:0;pointer-events:none}:host([variant='horizontal']) ::slotted(scb-step)::before{left:0;right:calc(50% + (var(--scb-stepper-symbol-size)/2) + var(--scb-stepper-connector-gap))}:host([variant='horizontal']) ::slotted(scb-step)::after{left:calc(50% + (var(--scb-stepper-symbol-size)/2) + var(--scb-stepper-connector-gap));right:0}:host([variant='horizontal']) ::slotted(scb-step:first-child)::before,:host([variant='horizontal']) ::slotted(scb-step:last-child)::after{display:none}:host([variant='horizontal']) ::slotted(scb-step[active])::before,:host([variant='horizontal']) ::slotted(scb-step[completed])::after,:host([variant='horizontal']) ::slotted(scb-step[completed])::before{background-color:var(--md-sys-color-primary)}::slotted(scb-step[variant=vertical][completed]:not(:last-child))::after,::slotted(scb-step[variant=vertical][symbol-variant=marker][completed]:not(:last-child))::after{background-color:var(--md-sys-color-primary)}::slotted(scb-step[variant=vertical]:not(:first-child))::before{display:none}::slotted(scb-step[variant=vertical]:not(:last-child))::after,::slotted(scb-step[variant=vertical][symbol-variant=marker]:not(:last-child))::after{content:"";position:absolute;left:28px;top:52px;width:1px;height:calc(100% - 16px);background-color:var(--n-70);transition:background-color var(--motion-duration-medium) var(--motion-easing-standard);z-index:0;transform:translateX(-50%)}::slotted(scb-step[variant=vertical][symbol-variant=marker]:not(:last-child))::after{left:20px;top:38px;height:calc(100% - 2px)}::slotted(scb-step[symbol-variant=marker]:not(:first-child))::before{top:20px}`,u);function S(){const n=c(a,this,f).call(this,this.spacing),t=c(a,this,f).call(this,this.spacingTop)??n,e=c(a,this,f).call(this,this.spacingBottom)??n,s=c(a,this,f).call(this,this.spacingLeft),r=c(a,this,f).call(this,this.spacingRight);t?this.style.setProperty("--scb-stepper-spacing-block-start",t):this.style.removeProperty("--scb-stepper-spacing-block-start"),e?this.style.setProperty("--scb-stepper-spacing-block-end",e):this.style.removeProperty("--scb-stepper-spacing-block-end"),s?this.style.setProperty("--scb-stepper-spacing-inline-start",s):this.style.removeProperty("--scb-stepper-spacing-inline-start"),r?this.style.setProperty("--scb-stepper-spacing-inline-end",r):this.style.removeProperty("--scb-stepper-spacing-inline-end")}function f(n){if(!n)return;const t=String(n).trim();if(t)return/^\d+$/.test(t)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(t,10)))})`:t}function m(){b(d,this)||g(d,this,requestAnimationFrame(()=>{g(d,this,0),c(a,this,C).call(this)}))}function C(){const n=this._getSteps();n.length!==0&&n.forEach(t=>{const e=t.shadowRoot;if(!e)return;const s=e.querySelector(".label"),r=e.querySelector(".scb-step-content");if(!s)return;if(this.variant!=="horizontal"){s.style.removeProperty("max-width"),s.style.removeProperty("white-space"),s.style.removeProperty("word-break"),s.style.removeProperty("overflow-wrap");return}s.style.maxWidth="none",s.style.whiteSpace="nowrap",s.style.wordBreak="normal",s.style.overflowWrap="normal";const i=r?.clientWidth??t.clientWidth;i>0&&s.scrollWidth>i&&(s.style.maxWidth="100%",s.style.whiteSpace="normal",s.style.wordBreak="break-word",s.style.overflowWrap="anywhere")})}p([l({type:String,reflect:!0})],o.prototype,"type",void 0);p([l({type:String,reflect:!0})],o.prototype,"label",void 0);p([l({type:Boolean,reflect:!0,attribute:"change-on-completed"})],o.prototype,"changeOnCompleted",void 0);p([l({type:String})],o.prototype,"variant",void 0);p([l({type:String,reflect:!0,attribute:"symbol-variant"})],o.prototype,"symbolVariant",void 0);p([l({type:String,reflect:!0})],o.prototype,"spacing",void 0);p([l({type:String,attribute:"spacing-top",reflect:!0})],o.prototype,"spacingTop",void 0);p([l({type:String,attribute:"spacing-bottom",reflect:!0})],o.prototype,"spacingBottom",void 0);p([l({type:String,attribute:"spacing-left",reflect:!0})],o.prototype,"spacingLeft",void 0);p([l({type:String,attribute:"spacing-right",reflect:!0})],o.prototype,"spacingRight",void 0);p([l({type:Number,reflect:!0,attribute:"active-index"})],o.prototype,"activeIndex",void 0);o=p([x("scb-stepper")],o);