scb-wc-test 0.1.364 → 0.1.365

package/mvc/components/scb-calendar-card/scb-calendar-card.js

@@ -1,5 +1,5 @@
 const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["../../vendor/vendor-material.js","../../vendor/vendor.js","../../vendor/vendor-lit.js"])))=>i.map(i=>d[i]);
-import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as l}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as i}from"../../vendor/decorate.js";import{n as _,t as m}from"../../vendor/assertClassBrand.js";import{t as v}from"../../vendor/preload-helper.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(r,c,s){try{customElements.get(r)||e(r,c,s)}catch(g){var h=String(g||"");if(h.indexOf("already been used")===-1&&h.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var d,o,p,a=(d=new WeakSet,o=class extends z{constructor(...e){super(...e),_(this,d),this.variant="default",this.size="medium",this.date=null,this.direction="horizontal",this.title="",this.calendarCardTitle="",this.subtitle="",this.supportingText="",this.cardHref="",this.cardHrefNav="",this.showMedia=null,this.mediaWidth="",this.mediaHeight="",this.mediaAspect="",this.width="",this.maxWidth="",this.minWidth="",this.height="",this.maxHeight="",this.minHeight="",this.sizing="stretch",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}async firstUpdated(){p.__iconLoaded||(await v(()=>import("../../vendor/vendor-material.js").then(e=>e.p),__vite__mapDeps([0,1,2]),import.meta.url),p.__iconLoaded=!0),p.__rippleLoaded||(await v(()=>import("../../vendor/vendor-material.js").then(e=>e.f),__vite__mapDeps([0,1,2]),import.meta.url),p.__rippleLoaded=!0),this.__applyInnerSizing(),m(d,this,u).call(this)}render(){const e=this.variant?`${this.variant.toLowerCase()}`:"",r=this.direction?`${this.direction.toLowerCase()}`:"",c=this.cardHref?"clickable":"",{day:s,month:h}=m(d,this,S).call(this),g=this.mediaWidth&&this.mediaWidth.trim()!==""?this.mediaWidth:"",b=this.mediaHeight&&this.mediaHeight.trim()!==""?this.mediaHeight:"",y=this.mediaAspect&&this.mediaAspect.trim()!==""?this.mediaAspect:"",x=`${g?`inline-size:${g};`:""}${b?`block-size:${b};`:""}${y?`aspect-ratio:${y};`:""}`;return l`
+import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as l}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as i}from"../../vendor/decorate.js";import{n as _,t as m}from"../../vendor/assertClassBrand.js";import{t as y}from"../../vendor/preload-helper.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(r,c,s){try{customElements.get(r)||e(r,c,s)}catch(g){var h=String(g||"");if(h.indexOf("already been used")===-1&&h.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var d,o,p,a=(d=new WeakSet,o=class extends z{constructor(...e){super(...e),_(this,d),this.variant="default",this.size="medium",this.date=null,this.direction="horizontal",this.title="",this.calendarCardTitle="",this.subtitle="",this.supportingText="",this.cardHref="",this.cardHrefNav="",this.showMedia=null,this.mediaWidth="",this.mediaHeight="",this.mediaAspect="",this.width="",this.maxWidth="",this.minWidth="",this.height="",this.maxHeight="",this.minHeight="",this.sizing="stretch",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}async firstUpdated(){p.__iconLoaded||(await y(()=>import("../../vendor/vendor-material.js").then(e=>e.p),__vite__mapDeps([0,1,2]),import.meta.url),p.__iconLoaded=!0),p.__rippleLoaded||(await y(()=>import("../../vendor/vendor-material.js").then(e=>e.f),__vite__mapDeps([0,1,2]),import.meta.url),p.__rippleLoaded=!0),this.__applyInnerSizing(),m(d,this,u).call(this)}render(){const e=this.variant?`${this.variant.toLowerCase()}`:"",r=this.direction?`${this.direction.toLowerCase()}`:"",c=this.cardHref?"clickable":"",{day:s,month:h}=m(d,this,S).call(this),g=this.mediaWidth&&this.mediaWidth.trim()!==""?this.mediaWidth:"",b=this.mediaHeight&&this.mediaHeight.trim()!==""?this.mediaHeight:"",v=this.mediaAspect&&this.mediaAspect.trim()!==""?this.mediaAspect:"",x=`${g?`inline-size:${g};`:""}${b?`block-size:${b};`:""}${v?`aspect-ratio:${v};`:""}`;return l`
       <div
         class="calendar-card ${r} ${c} ${e}"
         role="${this.cardHref?"link":"group"}"
@@ -165,7 +165,7 @@ import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as
       position: relative;
       display: flex;
       color: var(--md-sys-color-on-surface, #0f0865);
-      font-family: var(--brand, Inter);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-style: normal;
       flex-direction: column;
       align-items: flex-start;
@@ -287,6 +287,7 @@ import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as
     }
 
     .title {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-size: var(--scb-calendar-card-title-font-size);
       font-weight: var(--weight-bold, 700);
       line-height: var(--scb-calendar-card-title-line-height);
@@ -316,6 +317,7 @@ import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as
     }
 
     .subtitle {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-size: var(--scb-calendar-card-subtitle-font-size);
       font-weight: var(--weight-semibold, 600);
       line-height: var(--scb-calendar-card-subtitle-line-height);
@@ -329,6 +331,7 @@ import"../../vendor/vendor-material.js";import{_ as z,b as w,g as k,h as t,y as
     }
 
     .supporting-text {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-size: var(--scb-calendar-card-supporting-font-size);
       font-weight: var(--weight-regular, 400);
       line-height: var(--scb-calendar-card-supporting-line-height);

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

@@ -424,7 +424,7 @@ import"../../vendor/vendor-material.js";import{_ as M,b as V,g as j,h as a,v,y a
 
     .scb-card {
       color: var(--md-sys-color-on-surface, #0F0865);
-      font-family: var(--brand-font, "Inter", sans-serif);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       display: flex;
       position: relative;
       border-radius: var(--md-sys-shape-corner-large, 16px);

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

@@ -1,10 +1,10 @@
-import{_ as k,b as x,g,h as b,v as h,y as S}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as n}from"../../vendor/decorate.js";import{n as w,t as c}from"../../vendor/assertClassBrand.js";import{n as m,r as f,t as d}from"../../vendor/classPrivateFieldGet2.js";(function(){try{var i=typeof globalThis<"u"?globalThis:window;if(!i.__scb_ce_guard_installed__){i.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(e,l,_){try{customElements.get(e)||t(e,l,_)}catch(v){var u=String(v||"");if(u.indexOf("already been used")===-1&&u.indexOf("NotSupportedError")===-1)throw v}}}}catch{}})();var s,o,a,p,r=(s=new WeakSet,o=new WeakMap,a=new WeakMap,p=class extends k{constructor(...t){super(...t),w(this,s),f(this,o,void 0),f(this,a,void 0),this.open=!1,this.isStatic=!1,this.ariaLabel="",m(o,this,e=>{this.isStatic||c(s,this,E).call(this,e)||c(s,this,y).call(this)}),m(a,this,e=>{this.open&&e.key==="Escape"&&c(s,this,y).call(this)})}render(){return this.open?S`
-      <div class="scrim" @click=${d(o,this)}>
-        <div class="content" role="dialog" aria-modal="true" aria-label="${this.ariaLabel||h}">
+import{_ as L,b as w,g as z,h as f,v as g,y as A}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as u}from"../../vendor/decorate.js";import{n as C,t as r}from"../../vendor/assertClassBrand.js";import{n as k,r as S,t as y}from"../../vendor/classPrivateFieldGet2.js";(function(){try{var i=typeof globalThis<"u"?globalThis:window;if(!i.__scb_ce_guard_installed__){i.__scb_ce_guard_installed__=!0;var s=customElements.define.bind(customElements);customElements.define=function(t,a,h){try{customElements.get(t)||s(t,a,h)}catch(p){var d=String(p||"");if(d.indexOf("already been used")===-1&&d.indexOf("NotSupportedError")===-1)throw p}}}}catch{}})();var n,v,_,c,e,l=(n=new WeakSet,v=new WeakMap,_=new WeakMap,c=class extends L{constructor(...s){super(...s),C(this,n),S(this,v,void 0),S(this,_,void 0),this.open=!1,this.variant="scrim",this.isStatic=!1,this.ariaLabel="",this.__lastTriggerEl=null,k(v,this,t=>{this.isStatic||r(n,this,O).call(this,t)||r(n,this,x).call(this)}),k(_,this,t=>{this.open&&t.key==="Escape"&&r(n,this,x).call(this)})}static __handleDocClick(s){const t=s.composedPath();for(const a of t){if(!(a instanceof Element))continue;const h=a.getAttribute("data-overlay-open"),d=a.getAttribute("data-overlay-close"),p=a.getAttribute("data-overlay-toggle"),E=a.getAttribute("aria-controls"),m=h||d||p||E;if(!m)continue;const o=e.__instances.get(m);if(!o){e.__instances.delete(m);continue}o.__lastTriggerEl=a,h?r(n,o,b).call(o,!0):d?r(n,o,b).call(o,!1):r(n,o,b).call(o,!o.open);break}}static __ensureDocListener(){e.__docListenerAttached||(document.addEventListener("click",e.__handleDocClick,!0),e.__docListenerAttached=!0)}static __maybeRemoveDocListener(){!e.__docListenerAttached||e.__instances.size>0||(document.removeEventListener("click",e.__handleDocClick,!0),e.__docListenerAttached=!1)}render(){return this.open?A`
+      <div class="scrim" @click=${y(v,this)}>
+        <div class="content" role="dialog" aria-modal="true" aria-label="${this.ariaLabel||g}">
           <slot></slot>
         </div>
       </div>
-    `:h}connectedCallback(){super.connectedCallback(),window.addEventListener("keydown",d(a,this))}disconnectedCallback(){window.removeEventListener("keydown",d(a,this)),super.disconnectedCallback()}},p.styles=x`
+    `:g}connectedCallback(){super.connectedCallback(),this.id&&e.__instances.set(this.id,this),e.__ensureDocListener(),window.addEventListener("keydown",y(_,this))}updated(s){s.has("open")&&r(n,this,D).call(this)}disconnectedCallback(){this.id&&e.__instances.delete(this.id),e.__maybeRemoveDocListener(),window.removeEventListener("keydown",y(_,this)),super.disconnectedCallback()}},e=c,c.__instances=new Map,c.__docListenerAttached=!1,c.styles=w`
     :host {
       position: fixed;
       inset: 0;
@@ -23,10 +23,17 @@ import{_ as k,b as x,g,h as b,v as h,y as S}from"../../vendor/vendor.js";import"
       inline-size: 100%;
       block-size: 100%;
       padding: var(--scb-overlay-padding, var(--spacing-6, 24px));
-      background: var(--scb-overlay-backdrop, color-mix(in srgb, var(--md-sys-color-scrim) 32%, transparent));
+      background: var(
+        --scb-overlay-backdrop,
+        color-mix(in srgb, var(--md-sys-color-scrim) 32%, transparent)
+      );
       box-sizing: border-box;
     }
 
+    :host([variant='solid']) .scrim {
+      background: var(--md-sys-color-surface);
+    }
+
     .content {
       position: relative;
       max-inline-size: 100%;
@@ -39,4 +46,4 @@ import{_ as k,b as x,g,h as b,v as h,y as S}from"../../vendor/vendor.js";import"
       max-inline-size: 100%;
       max-block-size: 100%;
     }
-  `,p);function y(){this.open&&(this.isStatic||(this.open=!1,this.dispatchEvent(new CustomEvent("scb-overlay-dismiss",{bubbles:!0,composed:!0}))))}function E(i){const t=this.renderRoot.querySelector("slot");if(!(t instanceof HTMLSlotElement))return!1;const e=i.composedPath();return t.assignedNodes({flatten:!0}).some(l=>e.includes(l))}n([b({type:Boolean,reflect:!0})],r.prototype,"open",void 0);n([b({type:Boolean,reflect:!0,attribute:"static"})],r.prototype,"isStatic",void 0);n([b({type:String,attribute:"aria-label"})],r.prototype,"ariaLabel",void 0);r=n([g("scb-overlay")],r);
+  `,c);function b(i){this.open=i}function x(){this.open&&(this.isStatic||(r(n,this,b).call(this,!1),this.dispatchEvent(new CustomEvent("scb-overlay-dismiss",{bubbles:!0,composed:!0}))))}function O(i){const s=this.renderRoot.querySelector("slot");if(!(s instanceof HTMLSlotElement))return!1;const t=i.composedPath();return s.assignedNodes({flatten:!0}).some(a=>t.includes(a))}function D(){this.id&&document.querySelectorAll(`[aria-controls="${this.id}"], [data-overlay-toggle="${this.id}"], [data-overlay-open="${this.id}"], [data-overlay-close="${this.id}"]`).forEach(i=>{i.hasAttribute("aria-controls")&&i.setAttribute("aria-expanded",String(this.open))})}u([f({type:Boolean,reflect:!0})],l.prototype,"open",void 0);u([f({type:String,reflect:!0})],l.prototype,"variant",void 0);u([f({type:Boolean,reflect:!0,attribute:"static"})],l.prototype,"isStatic",void 0);u([f({type:String,attribute:"aria-label"})],l.prototype,"ariaLabel",void 0);l=e=u([z("scb-overlay")],l);

package/mvc/components/scb-segmented-button/scb-segmented-button.js

@@ -7,7 +7,7 @@ import{_ as p,b as g,g as b,h as r,y as f}from"../../vendor/vendor.js";import"..
       display: grid;
       grid-auto-flow: column;
       grid-auto-columns: 1fr;
-      font-family: var(--brand, Inter);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       margin-block-start: var(--scb-segmented-button-spacing-block-start, 0);
       margin-block-end: var(--scb-segmented-button-spacing-block-end, 0);
       margin-inline-start: var(--scb-segmented-button-spacing-inline-start, 0);

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

@@ -192,10 +192,19 @@ import"../../vendor/vendor-material.js";import{_ as b,b as p,g as h,h as a,y as
     }
     :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;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name":  "scb-wc-test",
-    "version":  "0.1.364",
+    "version":  "0.1.365",
     "type":  "module",
     "main":  "index.js",
     "module":  "index.js",
@@ -436,5 +436,5 @@
                                    },
                     "./mvc/*":  "./mvc/*"
                 },
-    "buildHash":  "9B06C41D95FD470ACCFF9872E98D40991916AB38ADCE62E188C91C9CC59999CA"
+    "buildHash":  "CBF20978D8D9EA53F0C3E271A1C6924C07CDA2350D240BE2D3538221C2BB13B2"
 }

package/scb-calendar-card/scb-calendar-card.js

@@ -161,7 +161,7 @@ var o, s = class extends t {
       position: relative;
       display: flex;
       color: var(--md-sys-color-on-surface, #0f0865);
-      font-family: var(--brand, Inter);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-style: normal;
       flex-direction: column;
       align-items: flex-start;
@@ -283,6 +283,7 @@ var o, s = class extends t {
     }
 
     .title {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-size: var(--scb-calendar-card-title-font-size);
       font-weight: var(--weight-bold, 700);
       line-height: var(--scb-calendar-card-title-line-height);
@@ -312,6 +313,7 @@ var o, s = class extends t {
     }
 
     .subtitle {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-size: var(--scb-calendar-card-subtitle-font-size);
       font-weight: var(--weight-semibold, 600);
       line-height: var(--scb-calendar-card-subtitle-line-height);
@@ -325,6 +327,7 @@ var o, s = class extends t {
     }
 
     .supporting-text {
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       font-size: var(--scb-calendar-card-supporting-font-size);
       font-weight: var(--weight-regular, 400);
       line-height: var(--scb-calendar-card-supporting-line-height);

package/scb-card/scb-card.js

@@ -245,7 +245,7 @@ var s, c = {
 
     .scb-card {
       color: var(--md-sys-color-on-surface, #0F0865);
-      font-family: var(--brand-font, "Inter", sans-serif);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       display: flex;
       position: relative;
       border-radius: var(--md-sys-shape-corner-large, 16px);

package/scb-overlay/scb-overlay.d.ts

@@ -1,12 +1,20 @@
 import { LitElement, nothing } from 'lit';
 export declare class ScbOverlay extends LitElement {
     #private;
+    private static __instances;
+    private static __docListenerAttached;
+    private static __handleDocClick;
+    private static __ensureDocListener;
+    private static __maybeRemoveDocListener;
     open: boolean;
+    variant: 'scrim' | 'solid';
     isStatic: boolean;
     ariaLabel: string;
+    __lastTriggerEl: HTMLElement | null;
     static styles: import('lit').CSSResult;
     render(): import('lit-html').TemplateResult<1> | typeof nothing;
     connectedCallback(): void;
+    updated(changedProperties: Map<PropertyKey, unknown>): void;
     disconnectedCallback(): void;
 }
 declare global {

package/scb-overlay/scb-overlay.js

@@ -2,14 +2,44 @@ import { __decorate as e } from "../_virtual/_@oxc-project_runtime@0.126.0/helpe
 import { LitElement as t, css as n, html as r, nothing as i } from "lit";
 import { customElement as a, property as o } from "lit/decorators.js";
 //#region src/scb-test-components/scb-overlay/scb-overlay.ts
-var s = class extends t {
+var s, c = class extends t {
+	static {
+		s = this;
+	}
 	constructor(...e) {
-		super(...e), this.open = !1, this.isStatic = !1, this.ariaLabel = "", this.#n = (e) => {
-			this.isStatic || this.#t(e) || this.#e();
-		}, this.#r = (e) => {
-			this.open && e.key === "Escape" && this.#e();
+		super(...e), this.open = !1, this.variant = "scrim", this.isStatic = !1, this.ariaLabel = "", this.__lastTriggerEl = null, this.#r = (e) => {
+			this.isStatic || this.#n(e) || this.#t();
+		}, this.#i = (e) => {
+			this.open && e.key === "Escape" && this.#t();
 		};
 	}
+	static {
+		this.__instances = /* @__PURE__ */ new Map();
+	}
+	static {
+		this.__docListenerAttached = !1;
+	}
+	static __handleDocClick(e) {
+		let t = e.composedPath();
+		for (let e of t) {
+			if (!(e instanceof Element)) continue;
+			let t = e.getAttribute("data-overlay-open"), n = e.getAttribute("data-overlay-close"), r = e.getAttribute("data-overlay-toggle"), i = e.getAttribute("aria-controls"), a = t || n || r || i;
+			if (!a) continue;
+			let o = s.__instances.get(a);
+			if (!o) {
+				s.__instances.delete(a);
+				continue;
+			}
+			o.__lastTriggerEl = e, t ? o.#e(!0) : n ? o.#e(!1) : o.#e(!o.open);
+			break;
+		}
+	}
+	static __ensureDocListener() {
+		s.__docListenerAttached || (document.addEventListener("click", s.__handleDocClick, !0), s.__docListenerAttached = !0);
+	}
+	static __maybeRemoveDocListener() {
+		!s.__docListenerAttached || s.__instances.size > 0 || (document.removeEventListener("click", s.__handleDocClick, !0), s.__docListenerAttached = !1);
+	}
 	static {
 		this.styles = n`
     :host {
@@ -30,10 +60,17 @@ var s = class extends t {
       inline-size: 100%;
       block-size: 100%;
       padding: var(--scb-overlay-padding, var(--spacing-6, 24px));
-      background: var(--scb-overlay-backdrop, color-mix(in srgb, var(--md-sys-color-scrim) 32%, transparent));
+      background: var(
+        --scb-overlay-backdrop,
+        color-mix(in srgb, var(--md-sys-color-scrim) 32%, transparent)
+      );
       box-sizing: border-box;
     }
 
+    :host([variant='solid']) .scrim {
+      background: var(--md-sys-color-surface);
+    }
+
     .content {
       position: relative;
       max-inline-size: 100%;
@@ -48,23 +85,31 @@ var s = class extends t {
     }
   `;
 	}
-	#e() {
-		this.open && (this.isStatic || (this.open = !1, this.dispatchEvent(new CustomEvent("scb-overlay-dismiss", {
+	#e(e) {
+		this.open = e;
+	}
+	#t() {
+		this.open && (this.isStatic || (this.#e(!1), this.dispatchEvent(new CustomEvent("scb-overlay-dismiss", {
 			bubbles: !0,
 			composed: !0
 		}))));
 	}
-	#t(e) {
+	#n(e) {
 		let t = this.renderRoot.querySelector("slot");
 		if (!(t instanceof HTMLSlotElement)) return !1;
 		let n = e.composedPath();
 		return t.assignedNodes({ flatten: !0 }).some((e) => n.includes(e));
 	}
-	#n;
 	#r;
+	#i;
+	#a() {
+		this.id && document.querySelectorAll(`[aria-controls="${this.id}"], [data-overlay-toggle="${this.id}"], [data-overlay-open="${this.id}"], [data-overlay-close="${this.id}"]`).forEach((e) => {
+			e.hasAttribute("aria-controls") && e.setAttribute("aria-expanded", String(this.open));
+		});
+	}
 	render() {
 		return this.open ? r`
-      <div class="scrim" @click=${this.#n}>
+      <div class="scrim" @click=${this.#r}>
         <div class="content" role="dialog" aria-modal="true" aria-label="${this.ariaLabel || i}">
           <slot></slot>
         </div>
@@ -72,22 +117,28 @@ var s = class extends t {
     ` : i;
 	}
 	connectedCallback() {
-		super.connectedCallback(), window.addEventListener("keydown", this.#r);
+		super.connectedCallback(), this.id && s.__instances.set(this.id, this), s.__ensureDocListener(), window.addEventListener("keydown", this.#i);
+	}
+	updated(e) {
+		e.has("open") && this.#a();
 	}
 	disconnectedCallback() {
-		window.removeEventListener("keydown", this.#r), super.disconnectedCallback();
+		this.id && s.__instances.delete(this.id), s.__maybeRemoveDocListener(), window.removeEventListener("keydown", this.#i), super.disconnectedCallback();
 	}
 };
 e([o({
 	type: Boolean,
 	reflect: !0
-})], s.prototype, "open", void 0), e([o({
+})], c.prototype, "open", void 0), e([o({
+	type: String,
+	reflect: !0
+})], c.prototype, "variant", void 0), e([o({
 	type: Boolean,
 	reflect: !0,
 	attribute: "static"
-})], s.prototype, "isStatic", void 0), e([o({
+})], c.prototype, "isStatic", void 0), e([o({
 	type: String,
 	attribute: "aria-label"
-})], s.prototype, "ariaLabel", void 0), s = e([a("scb-overlay")], s);
+})], c.prototype, "ariaLabel", void 0), c = s = e([a("scb-overlay")], c);
 //#endregion
-export { s as ScbOverlay };
+export { c as ScbOverlay };

package/scb-segmented-button/scb-segmented-button.js

@@ -20,7 +20,7 @@ var o = class extends t {
       display: grid;
       grid-auto-flow: column;
       grid-auto-columns: 1fr;
-      font-family: var(--brand, Inter);
+      font-family: var(--brand-font, var(--brand, "Inter"), sans-serif);
       margin-block-start: var(--scb-segmented-button-spacing-block-start, 0);
       margin-block-end: var(--scb-segmented-button-spacing-block-end, 0);
       margin-inline-start: var(--scb-segmented-button-spacing-inline-start, 0);

package/scb-stepper/scb-step.js

@@ -147,10 +147,19 @@ var o = class extends t {
     }
     :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;