@saasbase-io/core-elements 1.18.0 → 1.19.0

package/dist/index.mjs

@@ -56,7 +56,7 @@ class li {
   }
 }
 const oe = li.Instance;
-class _t extends Error {
+class xt extends Error {
   constructor(e, r, i) {
     super(r), this.name = "LoginflowError", this.code = e, this.details = i;
   }
@@ -74,11 +74,11 @@ class Qe {
         const b = yield fetch(o, Object.assign(Object.assign({}, i), { signal: h.signal, headers: Object.assign(Object.assign(Object.assign({ "Content-Type": "application/json" }, s.apiKey && { Authorization: `Bearer ${s.apiKey}` }), s.headers), i.headers) }));
         if (clearTimeout(p), !b.ok) {
           const y = yield b.json().catch(() => ({}));
-          throw new _t(y.code || "API_ERROR", y.message || `HTTP ${b.status}: ${b.statusText}`, y.details);
+          throw new xt(y.code || "API_ERROR", y.message || `HTTP ${b.status}: ${b.statusText}`, y.details);
         }
         return yield b.json();
       } catch (b) {
-        throw clearTimeout(p), b instanceof _t ? b : b instanceof Error ? b.name === "AbortError" ? new _t("TIMEOUT", "Request timeout") : new _t("NETWORK_ERROR", b.message) : new _t("UNKNOWN_ERROR", "An unknown error occurred");
+        throw clearTimeout(p), b instanceof xt ? b : b instanceof Error ? b.name === "AbortError" ? new xt("TIMEOUT", "Request timeout") : new xt("NETWORK_ERROR", b.message) : new xt("UNKNOWN_ERROR", "An unknown error occurred");
       }
     });
   }
@@ -191,7 +191,7 @@ class Bt {
           expires_at: Date.now() + r.expires_in * 1e3
         };
       } catch (r) {
-        return r instanceof _t ? console.error("Token refresh failed:", r.message, r.details) : console.error("Token refresh failed:", r), this.clearSession(), null;
+        return r instanceof xt ? console.error("Token refresh failed:", r.message, r.details) : console.error("Token refresh failed:", r), this.clearSession(), null;
       }
     });
   }
@@ -343,11 +343,11 @@ class sa {
     ]);
     const n = oe.getConfig();
     if (!n.domain)
-      throw new _t("CONFIG_ERROR", "Domain is required");
+      throw new xt("CONFIG_ERROR", "Domain is required");
     if (!n.appId)
-      throw new _t("CONFIG_ERROR", "App ID is required");
+      throw new xt("CONFIG_ERROR", "App ID is required");
     if (!n.clientSecret)
-      throw new _t("CONFIG_ERROR", "Client Secret is required");
+      throw new xt("CONFIG_ERROR", "Client Secret is required");
     this.flowId = e, this.location = i, this.flowStateManager = s || new fc(), this.flowEventBus = r || new vc(), this.navigationTypeDetector = o || new vh(), Bt.Instance.cleanExpiredSession(), Bt.Instance.scheduleTokenRefresh();
   }
   static init(e, r, i, s, o) {
@@ -369,7 +369,7 @@ class sa {
   startFlow(e, r) {
     return K(this, void 0, void 0, function* () {
       if (!r.app_id)
-        throw new _t("VALIDATION_ERROR", "Client ID is required");
+        throw new xt("VALIDATION_ERROR", "Client ID is required");
       const i = `/v1/auth-flow/${e}/start`;
       return this.executeFlowRequest(() => this.httpClient.post(i, r), "START_FLOW_ERROR", "Failed to start flow");
     });
@@ -389,7 +389,7 @@ class sa {
   processEvent(e, r) {
     return K(this, void 0, void 0, function* () {
       if (!e.event)
-        throw new _t("VALIDATION_ERROR", "Event type is required");
+        throw new xt("VALIDATION_ERROR", "Event type is required");
       const i = this.eventHandlers.get(e.event);
       return i ? yield i() : yield this.processServerEvent(e, r);
     });
@@ -403,7 +403,7 @@ class sa {
         const o = yield e();
         return s && (yield s(o)), this.processAuthResult(o.auth_result), o.redirection && this.redirect(o.redirection), o;
       } catch (o) {
-        throw o instanceof _t ? o : new _t(r, i, o instanceof Error ? { originalError: o.message, stack: o.stack } : o);
+        throw o instanceof xt ? o : new xt(r, i, o instanceof Error ? { originalError: o.message, stack: o.stack } : o);
       }
     });
   }
@@ -414,7 +414,7 @@ class sa {
     return K(this, void 0, void 0, function* () {
       let i = this.flowStateManager.getFlowState();
       if (!i && (console.warn("Flow state expired, restarting flow before processing event"), yield this.initializeFlowInternal(), i = this.flowStateManager.getFlowState(), !i))
-        throw new _t("FLOW_RESTART_ERROR", "Failed to restart flow - no flow state after initialization");
+        throw new xt("FLOW_RESTART_ERROR", "Failed to restart flow - no flow state after initialization");
       const s = i.state, o = `/v1/auth-flow/${i.flowType}/events`, n = yield this.executeFlowRequest(() => this.httpClient.post(o, e), "PROCESS_EVENT_ERROR", "Failed to process event", r);
       if (!n.auth_result) {
         this.flowStateManager.saveFlowState(i.flowType, i.flow_id, n);
@@ -461,7 +461,7 @@ class sa {
    */
   validateFlowType(e) {
     if (e === "custom" && !this.flowId)
-      throw new _t("FLOW_ID_ERROR", "Flow ID is required for custom flows");
+      throw new xt("FLOW_ID_ERROR", "Flow ID is required for custom flows");
   }
   /**
    * Check if we should resume an existing flow.
@@ -547,7 +547,7 @@ class sa {
         return this.flowId || "signup-flow";
       case "custom":
         if (!this.flowId)
-          throw new _t("FLOW_ID_ERROR", "Flow ID is required for custom flows");
+          throw new xt("FLOW_ID_ERROR", "Flow ID is required for custom flows");
         return this.flowId;
     }
   }
@@ -1128,11 +1128,11 @@ class di {
   }
   ensureConfigured() {
     if (!this.configured)
-      throw new _t("NOT_CONFIGURED", "Auth.configure() must be called before using Auth methods");
+      throw new xt("NOT_CONFIGURED", "Auth.configure() must be called before using Auth methods");
   }
   ensureLoginflowInitialized() {
     if (!this.loginflow)
-      throw new _t("LOGINFLOW_NOT_INITIALIZED", "Call Auth.startLoginflow() first");
+      throw new xt("LOGINFLOW_NOT_INITIALIZED", "Call Auth.startLoginflow() first");
   }
   startLoginflowInternal(e) {
     return K(this, arguments, void 0, function* (r, i = !1) {
@@ -1160,7 +1160,7 @@ class di {
   }
   configure(e) {
     if (!e.domain || !e.appId || !e.clientSecret)
-      throw new _t("CONFIG_ERROR", "domain, appId, and clientSecret are required");
+      throw new xt("CONFIG_ERROR", "domain, appId, and clientSecret are required");
     oe.setConfig(e), this.configured = !0;
   }
   isAuthenticated() {
@@ -1579,7 +1579,7 @@ ai.elementStyles = [], ai.shadowRootOptions = { mode: "open" }, ai[Di("elementPr
  */
 const Ui = globalThis, Ma = (t) => t, Js = Ui.trustedTypes, Ba = Js ? Js.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, _c = "$lit$", Je = `lit$${Math.random().toFixed(9).slice(2)}$`, xc = "?" + Je, Lh = `<${xc}>`, Mr = document, Gi = () => Mr.createComment(""), Ki = (t) => t === null || typeof t != "object" && typeof t != "function", la = Array.isArray, Ph = (t) => la(t) || typeof (t == null ? void 0 : t[Symbol.iterator]) == "function", Xo = `[ 	
 \f\r]`, Ei = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, qa = /-->/g, Va = />/g, gr = RegExp(`>|${Xo}(?:([^\\s"'>=/]+)(${Xo}*=${Xo}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), Ha = /'/g, Ga = /"/g, $c = /^(?:script|style|textarea|title)$/i, Sc = (t) => (e, ...r) => ({ _$litType$: t, strings: e, values: r }), d = Sc(1), fe = Sc(2), Br = Symbol.for("lit-noChange"), m = Symbol.for("lit-nothing"), Ka = /* @__PURE__ */ new WeakMap(), Cr = Mr.createTreeWalker(Mr, 129);
+\f\r"'\`<>=]|("|')|))|$)`, "g"), Ha = /'/g, Ga = /"/g, $c = /^(?:script|style|textarea|title)$/i, Sc = (t) => (e, ...r) => ({ _$litType$: t, strings: e, values: r }), d = Sc(1), fe = Sc(2), Br = Symbol.for("lit-noChange"), g = Symbol.for("lit-nothing"), Ka = /* @__PURE__ */ new WeakMap(), Cr = Mr.createTreeWalker(Mr, 129);
 function Cc(t, e) {
   if (!la(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
   return Ba !== void 0 ? Ba.createHTML(e) : e;
@@ -1673,7 +1673,7 @@ let zh = class {
     return ((e = this._$AM) == null ? void 0 : e._$AU) ?? this._$Cv;
   }
   constructor(e, r, i, s) {
-    this.type = 2, this._$AH = m, this._$AN = void 0, this._$AA = e, this._$AB = r, this._$AM = i, this.options = s, this._$Cv = (s == null ? void 0 : s.isConnected) ?? !0;
+    this.type = 2, this._$AH = g, this._$AN = void 0, this._$AA = e, this._$AB = r, this._$AM = i, this.options = s, this._$Cv = (s == null ? void 0 : s.isConnected) ?? !0;
   }
   get parentNode() {
     let e = this._$AA.parentNode;
@@ -1687,7 +1687,7 @@ let zh = class {
     return this._$AB;
   }
   _$AI(e, r = this) {
-    e = bi(this, e, r), Ki(e) ? e === m || e == null || e === "" ? (this._$AH !== m && this._$AR(), this._$AH = m) : e !== this._$AH && e !== Br && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Ph(e) ? this.k(e) : this._(e);
+    e = bi(this, e, r), Ki(e) ? e === g || e == null || e === "" ? (this._$AH !== g && this._$AR(), this._$AH = g) : e !== this._$AH && e !== Br && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Ph(e) ? this.k(e) : this._(e);
   }
   O(e) {
     return this._$AA.parentNode.insertBefore(e, this._$AB);
@@ -1696,7 +1696,7 @@ let zh = class {
     this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
   }
   _(e) {
-    this._$AH !== m && Ki(this._$AH) ? this._$AA.nextSibling.data = e : this.T(Mr.createTextNode(e)), this._$AH = e;
+    this._$AH !== g && Ki(this._$AH) ? this._$AA.nextSibling.data = e : this.T(Mr.createTextNode(e)), this._$AH = e;
   }
   $(e) {
     var o;
@@ -1737,7 +1737,7 @@ let zh = class {
     return this._$AM._$AU;
   }
   constructor(e, r, i, s, o) {
-    this.type = 1, this._$AH = m, this._$AN = void 0, this.element = e, this.name = r, this._$AM = s, this.options = o, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = m;
+    this.type = 1, this._$AH = g, this._$AN = void 0, this.element = e, this.name = r, this._$AM = s, this.options = o, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = g;
   }
   _$AI(e, r = this, i, s) {
     const o = this.strings;
@@ -1746,34 +1746,34 @@ let zh = class {
     else {
       const h = e;
       let p, b;
-      for (e = o[0], p = 0; p < o.length - 1; p++) b = bi(this, h[i + p], r, p), b === Br && (b = this._$AH[p]), n || (n = !Ki(b) || b !== this._$AH[p]), b === m ? e = m : e !== m && (e += (b ?? "") + o[p + 1]), this._$AH[p] = b;
+      for (e = o[0], p = 0; p < o.length - 1; p++) b = bi(this, h[i + p], r, p), b === Br && (b = this._$AH[p]), n || (n = !Ki(b) || b !== this._$AH[p]), b === g ? e = g : e !== g && (e += (b ?? "") + o[p + 1]), this._$AH[p] = b;
     }
     n && !s && this.j(e);
   }
   j(e) {
-    e === m ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
+    e === g ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
   }
 }, jh = class extends wo {
   constructor() {
     super(...arguments), this.type = 3;
   }
   j(e) {
-    this.element[this.name] = e === m ? void 0 : e;
+    this.element[this.name] = e === g ? void 0 : e;
   }
 }, Dh = class extends wo {
   constructor() {
     super(...arguments), this.type = 4;
   }
   j(e) {
-    this.element.toggleAttribute(this.name, !!e && e !== m);
+    this.element.toggleAttribute(this.name, !!e && e !== g);
   }
 }, Uh = class extends wo {
   constructor(e, r, i, s, o) {
     super(e, r, i, s, o), this.type = 5;
   }
   _$AI(e, r = this) {
-    if ((e = bi(this, e, r, 0) ?? m) === Br) return;
-    const i = this._$AH, s = e === m && i !== m || e.capture !== i.capture || e.once !== i.once || e.passive !== i.passive, o = e !== m && (i === m || s);
+    if ((e = bi(this, e, r, 0) ?? g) === Br) return;
+    const i = this._$AH, s = e === g && i !== g || e.capture !== i.capture || e.once !== i.once || e.passive !== i.passive, o = e !== g && (i === g || s);
     s && this.element.removeEventListener(this.name, this, i), o && this.element.addEventListener(this.name, this, e), this._$AH = e;
   }
   handleEvent(e) {
@@ -2119,10 +2119,10 @@ class Ac extends Oc {
  */
 let to = class extends Oc {
   constructor(e) {
-    if (super(e), this.it = m, e.type !== Rc.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
+    if (super(e), this.it = g, e.type !== Rc.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
   }
   render(e) {
-    if (e === m || e == null) return this._t = void 0, this.it = e;
+    if (e === g || e == null) return this._t = void 0, this.it = e;
     if (e === Br) return e;
     if (typeof e != "string") throw Error(this.constructor.directiveName + "() called with a non-string value");
     if (e === this.it) return this._t;
@@ -2295,12 +2295,12 @@ function Jt({ context: t, subscribe: e }) {
 }
 const Qo = /* @__PURE__ */ new WeakMap(), Qh = _o(class extends Ac {
   render(t) {
-    return m;
+    return g;
   }
   update(t, [e]) {
     var i;
     const r = e !== this.G;
-    return r && this.G !== void 0 && this.rt(void 0), (r || this.lt !== this.ct) && (this.G = e, this.ht = (i = t.options) == null ? void 0 : i.host, this.rt(this.ct = t.element)), m;
+    return r && this.G !== void 0 && this.rt(void 0), (r || this.lt !== this.ct) && (this.G = e, this.ht = (i = t.options) == null ? void 0 : i.host, this.rt(this.ct = t.element)), g;
   }
   rt(t) {
     if (this.isConnected || (t = void 0), typeof this.G == "function") {
@@ -5542,7 +5542,7 @@ var it = (t) => {
   let i = Fc.exec(t);
   return i ? i[1] ? typeof e == "string" ? i[1] === e : e.has(i[1]) : r(i[2]) : !1;
 }, zp = (t) => Cp.test(t) && !Ep.test(t), Mc = () => !1, jp = (t) => kp.test(t), Dp = (t) => Rp.test(t), Up = /* @__PURE__ */ _p(() => {
-  let t = it("colors"), e = it("spacing"), r = it("blur"), i = it("brightness"), s = it("borderColor"), o = it("borderRadius"), n = it("borderSpacing"), h = it("borderWidth"), p = it("contrast"), b = it("grayscale"), y = it("hueRotate"), w = it("invert"), E = it("gap"), C = it("gradientColorStops"), S = it("gradientColorStopPositions"), k = it("inset"), T = it("margin"), I = it("opacity"), N = it("padding"), J = it("saturate"), Y = it("scale"), nt = it("sepia"), ut = it("skew"), jt = it("space"), H = it("translate"), Yt = () => [
+  let t = it("colors"), e = it("spacing"), r = it("blur"), i = it("brightness"), s = it("borderColor"), o = it("borderRadius"), n = it("borderSpacing"), h = it("borderWidth"), p = it("contrast"), b = it("grayscale"), y = it("hueRotate"), w = it("invert"), E = it("gap"), C = it("gradientColorStops"), S = it("gradientColorStopPositions"), k = it("inset"), T = it("margin"), I = it("opacity"), N = it("padding"), J = it("saturate"), Y = it("scale"), nt = it("sepia"), gt = it("skew"), jt = it("space"), H = it("translate"), Yt = () => [
     "auto",
     "contain",
     "none"
@@ -5618,7 +5618,7 @@ var it = (t) => {
     "left",
     "right",
     "column"
-  ], gt = () => [ci, q];
+  ], mt = () => [ci, q];
   return {
     cacheSize: 500,
     separator: ":",
@@ -5631,7 +5631,7 @@ var it = (t) => {
         Me,
         q
       ],
-      brightness: gt(),
+      brightness: mt(),
       borderColor: [t],
       borderRadius: [
         "none",
@@ -5642,21 +5642,21 @@ var it = (t) => {
       ],
       borderSpacing: L(),
       borderWidth: hr(),
-      contrast: gt(),
+      contrast: mt(),
       grayscale: Xt(),
-      hueRotate: gt(),
+      hueRotate: mt(),
       invert: Xt(),
       gap: L(),
       gradientColorStops: [t],
       gradientColorStopPositions: [Op, Fe],
       inset: Oe(),
       margin: Oe(),
-      opacity: gt(),
+      opacity: mt(),
       padding: L(),
-      saturate: gt(),
-      scale: gt(),
+      saturate: mt(),
+      scale: mt(),
       sepia: Xt(),
-      skew: gt(),
+      skew: mt(),
       space: L(),
       translate: L()
     },
@@ -6268,7 +6268,7 @@ var it = (t) => {
         "transform",
         q
       ] }],
-      duration: [{ duration: gt() }],
+      duration: [{ duration: mt() }],
       ease: [{ ease: [
         "linear",
         "in",
@@ -6276,7 +6276,7 @@ var it = (t) => {
         "in-out",
         q
       ] }],
-      delay: [{ delay: gt() }],
+      delay: [{ delay: mt() }],
       animate: [{ animate: [
         "none",
         "spin",
@@ -6296,8 +6296,8 @@ var it = (t) => {
       rotate: [{ rotate: [ki, q] }],
       "translate-x": [{ "translate-x": [H] }],
       "translate-y": [{ "translate-y": [H] }],
-      "skew-x": [{ "skew-x": [ut] }],
-      "skew-y": [{ "skew-y": [ut] }],
+      "skew-x": [{ "skew-x": [gt] }],
+      "skew-y": [{ "skew-y": [gt] }],
       "transform-origin": [{ origin: [
         "center",
         "top",
@@ -6570,7 +6570,7 @@ var it = (t) => {
     conflictingClassGroupModifiers: { "font-size": ["leading"] }
   };
 });
-function g(...t) {
+function m(...t) {
   return Up(zc(t));
 }
 var Fp = class extends Ac {
@@ -6578,7 +6578,7 @@ var Fp = class extends Ac {
     super(...arguments), this.prevData = {};
   }
   render(t) {
-    return m;
+    return g;
   }
   update(t, [e]) {
     var r;
@@ -6757,7 +6757,7 @@ var Fp = class extends Ac {
         role="region"
         data-state=${this.hasActiveState() ? "open" : "closed"}
         data-orientation="vertical"
-        class=${g(Wi.content, this.className)}
+        class=${m(Wi.content, this.className)}
         @click=${(e) => e.stopPropagation()}
       >
         <div>${ca(((t = this.textContent) == null ? void 0 : t.trim()) || "")}</div>
@@ -6808,7 +6808,7 @@ var Se = class extends _ {
     return d`
       <div
         data-state=${t ? "open" : "closed"}
-        class="${g(Wi.item, this.className)}"
+        class="${m(Wi.item, this.className)}"
         value=${this.value}
         role="tablist"
         data-orientation="vertical"
@@ -6856,7 +6856,7 @@ var Yn = class extends _ {
         aria-selected=${t}
         aria-expanded=${t}
         data-state=${t ? "open" : "closed"}
-        class="${g(Wi.trigger, this.className)}"
+        class="${m(Wi.trigger, this.className)}"
         tabindex="-1"
         data-orientation="horizontal"
         data-radix-collection-item
@@ -6871,7 +6871,7 @@ var Yn = class extends _ {
           stroke-width="2"
           stroke-linecap="round"
           stroke-linejoin="round"
-          class=${g(Wi.chevron, "lucide lucide-chevron-down-icon lucide-chevron-down")}
+          class=${m(Wi.chevron, "lucide lucide-chevron-down-icon lucide-chevron-down")}
         >
           <path d="m6 9 6 6 6-6" />
         </svg>
@@ -6928,7 +6928,7 @@ var Ze = /* @__PURE__ */ (function(t) {
         data-orientation="vertical"
         ${Pt(this.getFilteredAttributes())}
         part="accordion"
-        class="${g(Wi.base, this.className)}"
+        class="${m(Wi.base, this.className)}"
       >
         ${t}
       </div>
@@ -7022,7 +7022,7 @@ var il = {
     return this;
   }
   connectedCallback() {
-    super.connectedCallback(), this._userClass = this.getAttribute("class") ?? "", this._userStyle = this.getAttribute("style") ?? "", this._userClass && this.removeAttribute("class"), this._userStyle && this.removeAttribute("style"), this.className = g(this.className, il.host);
+    super.connectedCallback(), this._userClass = this.getAttribute("class") ?? "", this._userStyle = this.getAttribute("style") ?? "", this._userClass && this.removeAttribute("class"), this._userStyle && this.removeAttribute("style"), this.className = m(this.className, il.host);
   }
   updated(t) {
     t.has("ratio") && (this.style.paddingBottom = this.ratio > 0 ? `${100 / this.ratio}%` : "0%");
@@ -7032,7 +7032,7 @@ var il = {
     this.style.paddingBottom = this.ratio > 0 ? `${100 / this.ratio}%` : "0%";
     let t = this.querySelector(".aspect-ratio");
     if (t) {
-      if (this._userClass && (t.className = g(t.className, this._userClass)), this._userStyle) {
+      if (this._userClass && (t.className = m(t.className, this._userClass)), this._userStyle) {
         let r = (e = t.getAttribute("style")) == null ? void 0 : e.trim(), i = this._userStyle.trim();
         t.setAttribute("style", [r, i].filter(Boolean).join("; "));
       }
@@ -7043,7 +7043,7 @@ var il = {
   }
   render() {
     return d`
-      <div class="${g("aspect-ratio", il.self)}"></div>
+      <div class="${m("aspect-ratio", il.self)}"></div>
     `;
   }
 };
@@ -7215,16 +7215,16 @@ var ei = class extends v {
           data-slot="badge"
           data-variant=${this.variant}
           href=${this.href}
-          target=${this.target ?? m}
-          aria-label=${this.ariaLabel ?? m}
-          aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
+          target=${this.target ?? g}
+          aria-label=${this.ariaLabel ?? g}
+          aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
         ></a>
       ` : d`
       <span
         data-slot="badge"
         data-variant=${this.variant}
-        aria-label=${this.ariaLabel ?? m}
-        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
+        aria-label=${this.ariaLabel ?? g}
+        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
       ></span>
     `;
   }
@@ -7255,7 +7255,7 @@ var wi = {
         id="rtg-bread-crumb-ellipsis"
         role="presentation"
         aria-hidden="true"
-        class="${g(wi.ellipsis, this.className)}"
+        class="${m(wi.ellipsis, this.className)}"
         part="breadcrumb-ellipsis"
       >
         <svg
@@ -7295,7 +7295,7 @@ var dl = class extends _ {
       <li
         ${Pt(this.getFilteredAttributes())}
         id="rtg-bread-crumb-item"
-        class="${g(wi.item, this.className)}"
+        class="${m(wi.item, this.className)}"
         part="breadcrumb-item"
       ></li>
     `;
@@ -7323,7 +7323,7 @@ var sn = class extends _ {
       <a
         ${Pt(this.getFilteredAttributes())}
         id="rtg-bread-crumb-link"
-        class="${g(wi.link, this.className)}"
+        class="${m(wi.link, this.className)}"
         href="${this.href}"
         part="breadcrumb-link"
       >
@@ -7350,7 +7350,7 @@ var cl = class extends _ {
       <ol
         ${Pt(this.getFilteredAttributes())}
         id="rtg-bread-crumb-list"
-        class="${g(wi.list, this.className)}"
+        class="${m(wi.list, this.className)}"
         part="breadcrumb-list"
       ></ol>
     `;
@@ -7371,7 +7371,7 @@ var hl = class extends _ {
         id="rtg-bread-crumb-separator"
         role="presentation"
         aria-hidden="true"
-        class="${g(wi.separator, this.className)}"
+        class="${m(wi.separator, this.className)}"
         part="breadcrumb-separator"
       >
         <svg
@@ -7411,7 +7411,7 @@ var pl = class extends _ {
         id="rtg-bread-crumb-text"
         aria-disabled="true"
         aria-current="page"
-        class="${g(wi.page, this.className)}"
+        class="${m(wi.page, this.className)}"
         part="breadcrumb-text"
       >
       </span>
@@ -7437,7 +7437,7 @@ var ul = class extends _ {
       <nav
         ${Pt(this.getFilteredAttributes())}
         part="breadcrumb"
-        class="${g(this.className)}"
+        class="${m(this.className)}"
         aria-label="breadcrumb"
       ></nav>
     `;
@@ -7470,10 +7470,10 @@ var he = class extends v {
           data-variant=${this.variant}
           data-size=${this.size}
           href=${this.href}
-          target=${this.target ?? m}
+          target=${this.target ?? g}
           ?disabled=${this.disabled}
-          aria-label=${this.ariaLabel ?? m}
-          aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
+          aria-label=${this.ariaLabel ?? g}
+          aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
           @click=${this._handleClick}
         ></a>
       ` : d`
@@ -7483,8 +7483,8 @@ var he = class extends v {
         data-size=${this.size}
         type=${this.type}
         ?disabled=${this.disabled}
-        aria-label=${this.ariaLabel ?? m}
-        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
+        aria-label=${this.ariaLabel ?? g}
+        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
         @click=${this._handleClick}
       ></button>
     `;
@@ -7637,7 +7637,7 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
     "rtg-w-full"
   ],
   buttonPrevious: [
-    g(Mi({
+    m(Mi({
       variant: "ghost",
       size: "icon-sm"
     })),
@@ -7645,7 +7645,7 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
     "aria-disabled:rtg-opacity-calendar-button-previous-opacity-disabled"
   ],
   buttonNext: [
-    g(Mi({
+    m(Mi({
       variant: "ghost",
       size: "icon-sm"
     })),
@@ -7754,12 +7754,12 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
   }
   connectedCallback() {
     var t;
-    super.connectedCallback(), this._userClass = ((t = this.getAttribute("class")) == null ? void 0 : t.replace(g(X.host), "")) ?? "", this._userStyle = this.getAttribute("style") ?? "", this._userClass && this.removeAttribute("class"), this._userStyle && this.removeAttribute("style"), this.className = g(X.host);
+    super.connectedCallback(), this._userClass = ((t = this.getAttribute("class")) == null ? void 0 : t.replace(m(X.host), "")) ?? "", this._userStyle = this.getAttribute("style") ?? "", this._userClass && this.removeAttribute("class"), this._userStyle && this.removeAttribute("style"), this.className = m(X.host);
   }
   firstUpdated(t) {
     var r;
     let e = this.querySelector(".calendar");
-    if (e && (this._userClass && (e.className = g("calendar", X.root, this._userClass)), this._userStyle)) {
+    if (e && (this._userClass && (e.className = m("calendar", X.root, this._userClass)), this._userStyle)) {
       let i = (r = e.getAttribute("style")) == null ? void 0 : r.trim(), s = this._userStyle.trim();
       e.setAttribute("style", [i, s].filter(Boolean).join("; "));
     }
@@ -7794,16 +7794,16 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
     });
     return d`
       <div
-        class=${g("calendar", X.root, this._userClass)}
+        class=${m("calendar", X.root, this._userClass)}
         data-slot="calendar"
         data-mode=${this.mode}
         part="calendar"
         style=${this._userStyle}
       >
-        <div class=${g("calendar-months", X.months)}>
-          <nav class=${g("calendar-nav", X.nav)}>
+        <div class=${m("calendar-months", X.months)}>
+          <nav class=${m("calendar-nav", X.nav)}>
             <button
-              class=${g("calendar-button-previous", X.buttonPrevious)}
+              class=${m("calendar-button-previous", X.buttonPrevious)}
               aria-label="Go to the Previous Month"
               @click="${this.previousMonth}"
             >
@@ -7817,14 +7817,14 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
                 stroke-width="2"
                 stroke-linecap="round"
                 stroke-linejoin="round"
-                class=${g("calendar-chevron", X.chevron, "lucide lucide-chevron-left-icon lucide-chevron-left")}
+                class=${m("calendar-chevron", X.chevron, "lucide lucide-chevron-left-icon lucide-chevron-left")}
               >
                 <path d="m15 18-6-6 6-6" />
               </svg>
             </button>
 
             <button
-              class=${g("calendar-button-next", X.buttonNext)}
+              class=${m("calendar-button-next", X.buttonNext)}
               aria-label="Go to the Next Month"
               @click="${this.nextMonth}"
             >
@@ -7838,19 +7838,19 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
                 stroke-width="2"
                 stroke-linecap="round"
                 stroke-linejoin="round"
-                class=${g("calendar-chevron", X.chevron, "lucide lucide-chevron-right-icon lucide-chevron-right")}
+                class=${m("calendar-chevron", X.chevron, "lucide lucide-chevron-right-icon lucide-chevron-right")}
               >
                 <path d="m9 18 6-6-6-6" />
               </svg>
             </button>
           </nav>
 
-          <div class=${g("calendar-month", X.month)}>
+          <div class=${m("calendar-month", X.month)}>
             <div
-              class=${g("calendar-month-caption", X.monthCaption)}
+              class=${m("calendar-month-caption", X.monthCaption)}
             >
               <span
-                class=${g("calendar-caption-label", X.captionLabel)}
+                class=${m("calendar-caption-label", X.captionLabel)}
                 role="status"
                 aria-live="polite"
               >
@@ -7859,16 +7859,16 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
             </div>
 
             <table
-              class=${g("calendar-month-grid", X.monthGrid)}
+              class=${m("calendar-month-grid", X.monthGrid)}
               role="grid"
               aria-label=${p}
               aria-multiselectable=${this.mode === "range" ? "true" : "false"}
             >
               <thead aria-hidden="true">
-                <tr class=${g("calendar-weekdays", X.weekdays)}>
+                <tr class=${m("calendar-weekdays", X.weekdays)}>
                   ${Bp.map((b) => d`
                       <th
-                        class=${g("calendar-weekday", X.weekday)}
+                        class=${m("calendar-weekday", X.weekday)}
                         scope="col"
                         aria-label=${b}
                       >
@@ -7878,15 +7878,15 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
                 </tr>
               </thead>
 
-              <tbody class=${g("calendar-weeks", X.weeks)}>
+              <tbody class=${m("calendar-weeks", X.weeks)}>
                 ${Array.from({ length: Math.ceil(o.length / 7) }, (b, y) => d`
-                    <tr class=${g("calendar-week", X.week)}>
+                    <tr class=${m("calendar-week", X.week)}>
                       ${o.slice(y * 7, (y + 1) * 7).map((w, E) => {
       var jt, H, Yt;
-      let C = new Date(this.currentDate.getFullYear(), w.month, Number(w.day)), S = C.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), k = this.mode === "range" && C.toDateString() === ((jt = this.selectedStartDate) == null ? void 0 : jt.toDateString()), T = this.mode === "range" && this.isDayInRange(C, !0), I = this.mode === "range" && C.toDateString() === ((H = this.selectedEndDate) == null ? void 0 : H.toDateString()), N = this.mode === "single" && C.toDateString() === ((Yt = this.selectedStartDate) == null ? void 0 : Yt.toDateString()), J = N || k || T || I, Y = E === 0, nt = E === 6, ut = S ? "Today, " : "";
-      return ut += Vp(C), ut += J ? ", selected" : "", d`
+      let C = new Date(this.currentDate.getFullYear(), w.month, Number(w.day)), S = C.toDateString() === (/* @__PURE__ */ new Date()).toDateString(), k = this.mode === "range" && C.toDateString() === ((jt = this.selectedStartDate) == null ? void 0 : jt.toDateString()), T = this.mode === "range" && this.isDayInRange(C, !0), I = this.mode === "range" && C.toDateString() === ((H = this.selectedEndDate) == null ? void 0 : H.toDateString()), N = this.mode === "single" && C.toDateString() === ((Yt = this.selectedStartDate) == null ? void 0 : Yt.toDateString()), J = N || k || T || I, Y = E === 0, nt = E === 6, gt = S ? "Today, " : "";
+      return gt += Vp(C), gt += J ? ", selected" : "", d`
                             <td
-                              class=${g("calendar-day", X.day.base, S && !J && X.day.today, J && X.day.selected.common, N && X.day.selected.single, k && X.day.selected.range.start, T && X.day.selected.range.middle, I && X.day.selected.range.end, Y && X.day.index.first, nt && X.day.index.last, !1)}
+                              class=${m("calendar-day", X.day.base, S && !J && X.day.today, J && X.day.selected.common, N && X.day.selected.single, k && X.day.selected.range.start, T && X.day.selected.range.middle, I && X.day.selected.range.end, Y && X.day.index.first, nt && X.day.index.last, !1)}
                               role="gridcell"
                               data-day=${C.toISOString().slice(0, 10)}
                               ?data-disabled=${void 0}
@@ -7900,7 +7900,7 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
                               ?aria-selected=${J ? "true" : void 0}
                             >
                               <button
-                                class=${g("calendar-day-button", X.dayButton.base, w.isOutside && X.dayButton.outside, S && X.dayButton.today)}
+                                class=${m("calendar-day-button", X.dayButton.base, w.isOutside && X.dayButton.outside, S && X.dayButton.today)}
                                 ?disabled=${void 0}
                                 data-variant="ghost"
                                 data-size="icon"
@@ -7910,7 +7910,7 @@ var gl = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, ml = zc, ua
                                 data-range-end=${I.toString()}
                                 tabindex=${N || I ? "0" : "-1"}
                                 type="button"
-                                aria-label=${ut}
+                                aria-label=${gt}
                                 @click="${() => this.selectDate(Number(w.day), w.isOutside)}"
                               >
                                 ${w.day}
@@ -8130,7 +8130,7 @@ function Wp(t) {
       stroke-width="2"
       stroke-linecap="round"
       stroke-linejoin="round"
-      class=${g("lucide lucide-check-icon lucide-check", "")}
+      class=${m("lucide lucide-check-icon lucide-check", "")}
     >
       <path d="M20 6 9 17l-5-5"/>
     </svg>
@@ -8148,7 +8148,7 @@ function Yp(t) {
       stroke-width="2"
       stroke-linecap="round"
       stroke-linejoin="round"
-      class=${g("lucide lucide-minus-icon lucide-minus", "")}
+      class=${m("lucide lucide-minus-icon lucide-minus", "")}
     >
       <path d="M5 12h14"/>
     </svg>
@@ -8166,7 +8166,7 @@ function Xp(t) {
       stroke-width="2"
       stroke-linecap="round"
       stroke-linejoin="round"
-      class=${g("lucide lucide-search-icon lucide-search", "")}
+      class=${m("lucide lucide-search-icon lucide-search", "")}
     >
       <path d="m21 21-4.34-4.34"/>
       <circle cx="11" cy="11" r="8"/>
@@ -8247,7 +8247,7 @@ var Zt = {
     }
   }
   getSlideClasses() {
-    return g(Zt.slide.base, this.size ? Zt.slide.size.true : Zt.slide.size.false);
+    return m(Zt.slide.base, this.size ? Zt.slide.size.true : Zt.slide.size.false);
   }
   nextSlide() {
     this.currentIndex < this.items.length - 1 && (this.currentIndex += 1, this.updateSlides());
@@ -8268,15 +8268,15 @@ var Zt = {
     super.disconnectedCallback(), window.removeEventListener("resize", this.handleResize);
   }
   render() {
-    let t = this.currentIndex === 0, e = this.size ? window.innerWidth >= 1024 ? 3 : window.innerWidth >= 768 ? 2 : 1 : 1, r = this.currentIndex >= this.items.length - e, i = g(Zt.slidesWrapper.base, Zt.slidesWrapper.orientation[this.orientation]), s = g(Zt.controls.base, Zt.controls.orientation[this.orientation]), o = g(Zt.controlButton.base, this.orientation === "vertical" && Zt.controlButton.orientation.verticalPrev), n = g(Zt.controlButton.base, this.orientation === "vertical" && Zt.controlButton.orientation.verticalNext);
+    let t = this.currentIndex === 0, e = this.size ? window.innerWidth >= 1024 ? 3 : window.innerWidth >= 768 ? 2 : 1 : 1, r = this.currentIndex >= this.items.length - e, i = m(Zt.slidesWrapper.base, Zt.slidesWrapper.orientation[this.orientation]), s = m(Zt.controls.base, Zt.controls.orientation[this.orientation]), o = m(Zt.controlButton.base, this.orientation === "vertical" && Zt.controlButton.orientation.verticalPrev), n = m(Zt.controlButton.base, this.orientation === "vertical" && Zt.controlButton.orientation.verticalNext);
     return d`
       <div
         part="rtg-carousel"
-        class="${g(Zt.root, this.className)}"
+        class="${m(Zt.root, this.className)}"
         size="${this.size}"
         orientation="${this.orientation}"
       >
-        <div class="${g(Zt.viewport, this.className)}">
+        <div class="${m(Zt.viewport, this.className)}">
           <div class="slides ${i}"></div>
 
           <div class="${s}">
@@ -8367,8 +8367,8 @@ var ie = class extends v {
         ?disabled=${this.disabled}
         value=${this.value}
         aria-checked=${this._checked ? "true" : "false"}
-        aria-required=${this.required ? "true" : m}
-        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
+        aria-required=${this.required ? "true" : g}
+        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
         @click=${this._handleClick}
       >
         ${this._renderIndicator()}
@@ -8457,7 +8457,7 @@ var $l = class extends _ {
     return d`
       <div
         ${Pt(this.getFilteredAttributes())}
-        class="${g("", this.className)}"
+        class="${m("", this.className)}"
         style="display: none;--radix-collapsible-content-height: 100px; --radix-collapsible-content-width: 350px;"
         part="collapsible-content"
       ></div>
@@ -8494,7 +8494,7 @@ var js = class extends _ {
     return d`
       <div
         ${Pt(this.getFilteredAttributes())}
-        class="${g("", this.className)}"
+        class="${m("", this.className)}"
         part="collapsible"
       ></div>
     `;
@@ -8620,7 +8620,7 @@ var _i = {
         type="button"
         part="combo-box-trigger-button"
         role="tab"
-        class="${g(_i.trigger.base, this.className)}"
+        class="${m(_i.trigger.base, this.className)}"
         tabindex="-1"
         data-orientation="horizontal"
         data-radix-collection-item=""
@@ -8663,7 +8663,7 @@ var dn = class extends v {
     return d`
       <span
         part="combo-box-value"
-        class="${g(_i.value, this.className)}"
+        class="${m(_i.value, this.className)}"
         @click=${this.handleClick}
         >${this.renderLabel()}</span
       >
@@ -8684,7 +8684,7 @@ var us = class extends v {
         data-slot="separator"
         data-orientation=${this.orientation}
         role=${this.decorative ? "none" : "separator"}
-        aria-orientation=${this.decorative ? m : this.orientation}
+        aria-orientation=${this.decorative ? g : this.orientation}
       ></div>
     `;
   }
@@ -8820,7 +8820,7 @@ var $r = class extends _ {
     return d`
       <div
         part="select-group"
-        class="${g(_i.group.base, this.className)}"
+        class="${m(_i.group.base, this.className)}"
         data-hs-combo-box-output=""
         data-testId="select-group"
       >
@@ -8873,7 +8873,7 @@ var Cl, re = class extends _ {
       <div
         ${Pt(this.getFilteredAttributes())}
         @click=${this.handleClick}
-        class="${g(_i.item.base, this.className)}"
+        class="${m(_i.item.base, this.className)}"
         data-hs-combo-box-value=${this.value}
         aria-selected="${this.isSelected}"
         data-selected="${this.isSelected}"
@@ -8914,7 +8914,7 @@ var gs = class extends v {
         <input
           part="combo-box-input"
           type="text"
-          class="${g(_i.input, this.className)}"
+          class="${m(_i.input, this.className)}"
           placeholder=${this.placeholder}
           autocomplete="off"
           autocorrect="off"
@@ -8943,7 +8943,7 @@ var El = class extends _ {
   render() {
     return d`
       <div
-        class="${g(_i.empty, this.className)}"
+        class="${m(_i.empty, this.className)}"
         role="presentation"
       >
         ${Array.from(this.childNodes)[0].textContent}
@@ -9000,7 +9000,7 @@ var kl, Mt = class extends _ {
   render() {
     return d`
       <div
-        class="${g("rtg-relative", this.className)}"
+        class="${m("rtg-relative", this.className)}"
         data-hs-combo-box=""
         data-combo-box-uuid=${this.uuid}
         part="combo-box"
@@ -9100,7 +9100,7 @@ var Ce = {
         id="${this.identifier}"
         part="command-empty"
         role="presentation"
-        class=${g(Ce.empty, this._hidden === "true" && "rtg-hidden", this.className)}
+        class=${m(Ce.empty, this._hidden === "true" && "rtg-hidden", this.className)}
       ></div>
     `;
   }
@@ -9141,13 +9141,13 @@ var Us, Rr, Ii = (Rr = class extends _ {
         id="${this.identifier}"
         part="command-group"
         role="presentation"
-        class=${g(Ce.group, this._hidden === "true" && "rtg-hidden", this.className)}
+        class=${m(Ce.group, this._hidden === "true" && "rtg-hidden", this.className)}
       >
         <div
           rtgcmd-group-heading
           aria-hidden="true"
           id="${this.identifier}h"
-          class=${g(Ce.heading)}
+          class=${m(Ce.heading)}
         >
           ${this.heading}
         </div>
@@ -9204,7 +9204,7 @@ var bs = class extends v {
     return d`
       <div
         part="command-input"
-        class=${g(Ce.input.wrapper, this.className)}
+        class=${m(Ce.input.wrapper, this.className)}
         name="rtgcmd-input-container"
         data-slot="rtg-command-input-wrapper"
       >
@@ -9218,7 +9218,7 @@ var bs = class extends v {
           stroke-width="2"
           stroke-linecap="round"
           stroke-linejoin="round"
-          class=${g(Ce.input.icon, "lucide lucide-search-icon lucide-search")}
+          class=${m(Ce.input.icon, "lucide lucide-search-icon lucide-search")}
         >
           <path d="m21 21-4.34-4.34" />
           <circle cx="11" cy="11" r="8" />
@@ -9239,7 +9239,7 @@ var bs = class extends v {
           aria-controls=":r1oe:"
           aria-labelledby=":r1of:"
           @input="${this.handleChange}"
-          class=${g(Ce.input.input)}
+          class=${m(Ce.input.input)}
         />
       </div>
     `;
@@ -9296,7 +9296,7 @@ var Fs, Or, br = (Or = class extends _ {
         @mouseleave="${this.handleMouseEvent}"
         @focus="${this.handleMouseEvent}"
         @click="${this.onSelect}"
-        class=${g(Ce.item, this._hidden === "true" && "rtg-hidden", this.className)}
+        class=${m(Ce.item, this._hidden === "true" && "rtg-hidden", this.className)}
       ></div>
     `;
   }
@@ -9340,7 +9340,7 @@ var Rl = class extends _ {
         id="${this.identifier}"
         part="command-list"
         role="listbox"
-        class=${g(Ce.list, this.className)}
+        class=${m(Ce.list, this.className)}
       >
         <div></div>
       </div>
@@ -9361,13 +9361,13 @@ var Ms, Ir, fs = (Ir = class extends v {
     return this;
   }
   render() {
-    return d`${this._hidden === "true" ? m : d`
+    return d`${this._hidden === "true" ? g : d`
           <div
             rtgcmd-separator
             id="${this.identifier}"
             part="command-separator"
             role="separator"
-            class=${g(Ce.separator, this.className)}
+            class=${m(Ce.separator, this.className)}
           ></div>
         `}`;
   }
@@ -9397,7 +9397,7 @@ var Ol = class extends _ {
     return d`
       <div
         part="command"
-        class="${g(Ce.root, t)}"
+        class="${m(Ce.root, t)}"
         style="${e}"
         id="rtgcmdr1"
         rtgcmd-root
@@ -9531,9 +9531,9 @@ var Vt = {
         @mouseover="${this.handleMouseEvent}"
         @mouseleave="${this.handleMouseEvent}"
         @focus="${this.handleMouseEvent}"
-        class=${g(Vt.checkboxItem.base, this.className)}
+        class=${m(Vt.checkboxItem.base, this.className)}
       >
-        <span class=${g(Vt.checkboxItem.span)}>
+        <span class=${m(Vt.checkboxItem.span)}>
           ${this.checked ? d`
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
@@ -9545,11 +9545,11 @@ var Vt = {
                   stroke-width="2"
                   stroke-linecap="round"
                   stroke-linejoin="round"
-                  class=${g(Vt.checkboxItem.icon, "lucide lucide-check-icon lucide-check")}
+                  class=${m(Vt.checkboxItem.icon, "lucide lucide-check-icon lucide-check")}
                 >
                   <path d="M20 6 9 17l-5-5" />
                 </svg>
-              ` : m}
+              ` : g}
         </span>
         <div part="context-menu-checkbox-item-container"></div>
       </div>
@@ -9599,7 +9599,7 @@ var cn = class extends _ {
     return d`
       <div
         part="context-menu-content"
-        class=${g(Vt.content, this.className)}
+        class=${m(Vt.content, this.className)}
       ></div>
     `;
   }
@@ -9627,9 +9627,9 @@ var hn = class extends _ {
         rtgcmd-group
         part="context-menu-group"
         role="presentation"
-        class=${g(Vt.group, this.className)}
+        class=${m(Vt.group, this.className)}
       >
-        <div rtgcmd-group-heading class=${g(Vt.label)}>
+        <div rtgcmd-group-heading class=${m(Vt.label)}>
           ${this.heading}
         </div>
 
@@ -9681,7 +9681,7 @@ var vs = class extends _ {
         role="option"
         data-value="${this.value}"
         ?data-disabled=${this.disabled}
-        class=${g(Vt.item, this.className)}
+        class=${m(Vt.item, this.className)}
       ></div>
     `;
   }
@@ -9740,9 +9740,9 @@ var vr = class extends _ {
         @mouseover="${this.handleMouseEvent}"
         @mouseleave="${this.handleMouseEvent}"
         @focus="${this.handleMouseEvent}"
-        class=${g(Vt.radioItem.base, this.className)}
+        class=${m(Vt.radioItem.base, this.className)}
       >
-        <span class=${g(Vt.radioItem.span)}>
+        <span class=${m(Vt.radioItem.span)}>
           ${this.checked ? d`<svg
                 xmlns="http://www.w3.org/2000/svg"
                 width="24"
@@ -9753,10 +9753,10 @@ var vr = class extends _ {
                 stroke-width="2"
                 stroke-linecap="round"
                 stroke-linejoin="round"
-                class=${g(Vt.radioItem.icon, "lucide lucide-circle-icon lucide-circle")}
+                class=${m(Vt.radioItem.icon, "lucide lucide-circle-icon lucide-circle")}
               >
                 <circle cx="12" cy="12" r="10" />
-              </svg>` : m}
+              </svg>` : g}
         </span>
         <div part="context-menu-radio-item-container"></div>
       </div>
@@ -9787,7 +9787,7 @@ var pn = class extends v {
         rtgcmd-separator
         part="context-menu-separator"
         role="separator"
-        class=${g(Vt.separator, this.className)}
+        class=${m(Vt.separator, this.className)}
       ></div>
     `;
   }
@@ -9801,7 +9801,7 @@ var Il = class extends _ {
     return [];
   }
   createRenderRoot() {
-    return this.classList = g(Vt.shortcut), this;
+    return this.classList = m(Vt.shortcut), this;
   }
   firstUpdated(t) {
     this.moveLightDomChildrenInto(this._containerElement);
@@ -9810,7 +9810,7 @@ var Il = class extends _ {
     return d`
       <span
         part="context-menu-shortcut"
-        class=${g(Vt.shortcut, this.className)}
+        class=${m(Vt.shortcut, this.className)}
       >
       </span>
     `;
@@ -9887,7 +9887,7 @@ var un = class extends _ {
     return d`
       <div
         part="context-menu"
-        class=${g(Vt.root, this.className)}
+        class=${m(Vt.root, this.className)}
       ></div>
     `;
   }
@@ -9946,7 +9946,7 @@ var ga = {
       <div
         part="popover-content"
         data-state=${this.state}
-        class=${g(ga.content, this.className)}
+        class=${m(ga.content, this.className)}
         @click="${this.preventClickPropagation}"
       ></div>
     `;
@@ -9986,7 +9986,7 @@ var Tl = class extends _ {
     return d`
       <div
         part="popover-trigger"
-        class=${g(ga.trigger, this.className)}
+        class=${m(ga.trigger, this.className)}
       ></div>
     `;
   }
@@ -10013,7 +10013,7 @@ var Bi = class extends _ {
   }
   render() {
     return d`
-      <div part="popover" class=${g(ga.root, this.className)}></div>
+      <div part="popover" class=${m(ga.root, this.className)}></div>
     `;
   }
 };
@@ -10042,18 +10042,18 @@ var ys = {
   render() {
     return d`
       <rtg-popover
-        class=${g("date-picker", ys.root, this.className)}
+        class=${m("date-picker", ys.root, this.className)}
         @date-selected=${this.handleDateSelected}
       >
         <rtg-popover-trigger
           as-child
-          class=${g("date-picker-trigger", ys.trigger)}
+          class=${m("date-picker-trigger", ys.trigger)}
         >
           <button
             data-variant="outline"
             data-size="default"
             data-empty=${this.selectedDate ? "false" : "true"}
-            class=${g("date-picker-trigger-button", ys.triggerButton)}
+            class=${m("date-picker-trigger-button", ys.triggerButton)}
           >
             <svg
               xmlns="http://www.w3.org/2000/svg"
@@ -10089,7 +10089,7 @@ var ys = {
         </rtg-popover-trigger>
 
         <rtg-popover-content
-          class=${g("date-picker-content", ys.content)}
+          class=${m("date-picker-content", ys.content)}
         >
           <rtg-calendar mode="single"></rtg-calendar>
         </rtg-popover-content>
@@ -10175,7 +10175,7 @@ var ue = {
     return d`
       <div
         part="dialog-close"
-        class=${g(ue.close, this.className)}
+        class=${m(ue.close, this.className)}
       ></div>
     `;
   }
@@ -10221,7 +10221,7 @@ var mn = "closed", ws = class extends _ {
       <div
         rtgdlg-content
         part="dialog-content"
-        class=${g(ue.content.base, this.className)}
+        class=${m(ue.content.base, this.className)}
       >
         <div part="dialog-content-slot"></div>
 
@@ -10230,7 +10230,7 @@ var mn = "closed", ws = class extends _ {
                 data-slot="dialog-content-close"
                 type="button"
                 @click=${this.handleCloseButtonClick}
-                class=${g(ue.content.close.base)}
+                class=${m(ue.content.close.base)}
               >
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
@@ -10242,7 +10242,7 @@ var mn = "closed", ws = class extends _ {
                   stroke-width="2"
                   stroke-linecap="round"
                   stroke-linejoin="round"
-                  class=${g(ue.content.close.icon, "lucide lucide-x-icon lucide-x")}
+                  class=${m(ue.content.close.icon, "lucide lucide-x-icon lucide-x")}
                 >
                   <path d="M18 6 6 18" />
                   <path d="m6 6 12 12" />
@@ -10279,7 +10279,7 @@ var Pl = class extends _ {
     return d`
       <div
         part="dialog-footer"
-        class=${g(ue.footer, this.className)}
+        class=${m(ue.footer, this.className)}
       ></div>
     `;
   }
@@ -10296,11 +10296,11 @@ var _s = class extends v {
     return d`
       <div
         part="dialog-header"
-        class=${g(ue.header, this.className)}
+        class=${m(ue.header, this.className)}
       >
-        <h2 class=${g(ue.title, this.className)}>${this._title}</h2>
+        <h2 class=${m(ue.title, this.className)}>${this._title}</h2>
 
-        <p class=${g(ue.description, this.className)}>
+        <p class=${m(ue.description, this.className)}>
           ${this.description}
         </p>
       </div>
@@ -10319,7 +10319,7 @@ var Nl = class extends v {
     return d`
       <div
         part="dialog-overly"
-        class=${g(ue.overlay, this.className)}
+        class=${m(ue.overlay, this.className)}
       ></div>
     `;
   }
@@ -10358,7 +10358,7 @@ var Qp = "open", zl = class extends _ {
     return d`
       <div
         part="dialog-trigger"
-        class=${g(ue.trigger, this.className)}
+        class=${m(ue.trigger, this.className)}
       ></div>
     `;
   }
@@ -10393,9 +10393,9 @@ var tu = "open", eu = "closed", pi = class extends _ {
       <div
         rtgdlg-root
         part="dialog"
-        class=${g(ue.root, this.className)}
+        class=${m(ue.root, this.className)}
       >
-        ${this.state === tu ? d` <rtg-dialog-overlay></rtg-dialog-overlay>` : m}
+        ${this.state === tu ? d` <rtg-dialog-overlay></rtg-dialog-overlay>` : g}
       </div>
     `;
   }
@@ -10477,7 +10477,7 @@ var $e = {
     return d`
       <div
         part="drawer-close"
-        class=${g(Ee.close, this.className)}
+        class=${m(Ee.close, this.className)}
       ></div>
     `;
   }
@@ -10537,9 +10537,9 @@ var bn = class extends _ {
       <div
         rtgdlg-content
         part="drawer-content"
-        class=${g(Ee.content.base, this.state === $e.open ? "drawer-open" : "drawer-closed", this.className)}
+        class=${m(Ee.content.base, this.state === $e.open ? "drawer-open" : "drawer-closed", this.className)}
       >
-        <div part="drawer-thumb" class=${g(Ee.content.thumb)}></div>
+        <div part="drawer-thumb" class=${m(Ee.content.thumb)}></div>
         <div part="drawer-content-slot"></div>
       </div>
     `;
@@ -10566,7 +10566,7 @@ var Dl = class extends _ {
     return d`
       <p
         part="drawer-description"
-        class=${g(Ee.description, this.className)}
+        class=${m(Ee.description, this.className)}
       ></p>
     `;
   }
@@ -10589,7 +10589,7 @@ var Ul = class extends _ {
     return d`
       <div
         part="drawer-footer"
-        class=${g(Ee.footer, this.className)}
+        class=${m(Ee.footer, this.className)}
       ></div>
     `;
   }
@@ -10609,7 +10609,7 @@ var Fl = class extends _ {
     return d`
       <div
         part="drawer-header"
-        class=${g(Ee.header, this.className)}
+        class=${m(Ee.header, this.className)}
       ></div>
     `;
   }
@@ -10623,7 +10623,7 @@ var Ml = class extends v {
     return d`
       <div
         part="drawer-overly"
-        class=${g(Ee.overlay, this.className)}
+        class=${m(Ee.overlay, this.className)}
       ></div>
     `;
   }
@@ -10646,7 +10646,7 @@ var Bl = class extends _ {
     return d`
       <h2
         part="drawer-title"
-        class=${g(Ee.title, this.className)}
+        class=${m(Ee.title, this.className)}
       ></h2>
     `;
   }
@@ -10685,7 +10685,7 @@ var ql = class extends _ {
     return d`
       <div
         part="drawer-trigger"
-        class=${g(Ee.trigger, this.className)}
+        class=${m(Ee.trigger, this.className)}
       ></div>
     `;
   }
@@ -10735,9 +10735,9 @@ var qi = class extends _ {
       <div
         rtgdlg-root
         part="drawer"
-        class=${g(Ee.root, this.className)}
+        class=${m(Ee.root, this.className)}
       >
-        ${this.state === $e.open ? d` <rtg-drawer-overlay></rtg-drawer-overlay>` : m}
+        ${this.state === $e.open ? d` <rtg-drawer-overlay></rtg-drawer-overlay>` : g}
       </div>
     `;
   }
@@ -10875,9 +10875,9 @@ var Ht = {
         @mouseover="${this.handleMouseEvent}"
         @mouseleave="${this.handleMouseEvent}"
         @focus="${this.handleMouseEvent}"
-        class=${g(Ht.checkboxItem.base, this.className)}
+        class=${m(Ht.checkboxItem.base, this.className)}
       >
-        <span class=${g(Ht.checkboxItem.span)}>
+        <span class=${m(Ht.checkboxItem.span)}>
           ${this.checked ? d`
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
@@ -10889,11 +10889,11 @@ var Ht = {
                   stroke-width="2"
                   stroke-linecap="round"
                   stroke-linejoin="round"
-                  class=${g(Ht.checkboxItem.icon, "lucide lucide-check-icon lucide-check")}
+                  class=${m(Ht.checkboxItem.icon, "lucide lucide-check-icon lucide-check")}
                 >
                   <path d="M20 6 9 17l-5-5" />
                 </svg>
-              ` : m}
+              ` : g}
         </span>
         <div part="dropdown-menu-checkbox-item-container"></div>
       </div>
@@ -10938,7 +10938,7 @@ var ma = "closed", xs = class extends _ {
         data-slot="dropdown-menu-content"
         part="dropdown-menu-content"
         style="display: ${this.isOpen ? "block" : "none"};"
-        class=${g(Ht.content, this.className)}
+        class=${m(Ht.content, this.className)}
       ></div>
     `;
   }
@@ -10961,14 +10961,14 @@ var Ai = class extends _ {
     this.moveLightDomChildrenInto(this._containerElement);
   }
   render() {
-    return d`${this._hidden === "true" ? m : d`
+    return d`${this._hidden === "true" ? g : d`
           <div
             rtgcmd-group
             part="dropdown-menu-group"
             role="presentation"
-            class=${g(Ht.group, this.className)}
+            class=${m(Ht.group, this.className)}
           >
-            <div rtgcmd-group-heading class=${g(Ht.label)}>
+            <div rtgcmd-group-heading class=${m(Ht.label)}>
               ${this.heading}
             </div>
 
@@ -11013,7 +11013,7 @@ var wr = class extends _ {
     this.moveLightDomChildrenInto(this._containerElement);
   }
   render() {
-    return d` ${this._hidden === "true" ? m : d`
+    return d` ${this._hidden === "true" ? g : d`
           <div
             rtgcmd-item
             part="dropdown-menu-item"
@@ -11027,7 +11027,7 @@ var wr = class extends _ {
             @mouseleave="${this.handleMouseEvent}"
             @focus="${this.handleMouseEvent}"
             @click="${this.handleClickDefault}"
-            class=${g(Ht.item, this.className)}
+            class=${m(Ht.item, this.className)}
           ></div>
         `}`;
   }
@@ -11088,9 +11088,9 @@ var Be = class extends _ {
         @mouseover="${this.handleMouseEvent}"
         @mouseleave="${this.handleMouseEvent}"
         @focus="${this.handleMouseEvent}"
-        class=${g(Ht.radioItem.base, this.className)}
+        class=${m(Ht.radioItem.base, this.className)}
       >
-        <span class=${g(Ht.radioItem.span)}>
+        <span class=${m(Ht.radioItem.span)}>
           ${this.checked ? d`<svg
                 xmlns="http://www.w3.org/2000/svg"
                 width="24"
@@ -11101,10 +11101,10 @@ var Be = class extends _ {
                 stroke-width="2"
                 stroke-linecap="round"
                 stroke-linejoin="round"
-                class=${g(Ht.radioItem.icon, "lucide lucide-circle-icon lucide-circle")}
+                class=${m(Ht.radioItem.icon, "lucide lucide-circle-icon lucide-circle")}
               >
                 <circle cx="12" cy="12" r="10" />
-              </svg>` : m}
+              </svg>` : g}
         </span>
         <div part="dropdown-menu-radio-item-container"></div>
       </div>
@@ -11140,7 +11140,7 @@ var Vl = class extends _ {
       rtgcmd-separator
       part="dropdown-menu-seperator"
       role="separator"
-      class=${g(Ht.separator, this.className)}
+      class=${m(Ht.separator, this.className)}
     ></div>`;
   }
 };
@@ -11153,13 +11153,13 @@ var Hl = class extends _ {
     this.moveLightDomChildrenInto(this._containerElement);
   }
   createRenderRoot() {
-    return this.classList = g(Ht.shortcut), this;
+    return this.classList = m(Ht.shortcut), this;
   }
   render() {
     return d`
       <span
         part="dropdown-menu-shortcut"
-        class=${g(Ht.shortcut, this.className)}
+        class=${m(Ht.shortcut, this.className)}
       >
       </span>
     `;
@@ -11224,7 +11224,7 @@ var se, Ar, ui = (Ar = class extends _ {
     return d`
       <div
         part="dropdown-menu"
-        class=${g(Ht.root, this.className)}
+        class=${m(Ht.root, this.className)}
       ></div>
     `;
   }
@@ -11406,8 +11406,8 @@ var Ti = class extends v {
       <div
         data-slot="field"
         data-orientation=${this.orientation}
-        data-disabled=${this.disabled ? "true" : m}
-        data-invalid=${this.invalid ? "true" : m}
+        data-disabled=${this.disabled ? "true" : g}
+        data-invalid=${this.invalid ? "true" : g}
         role="group"
       ></div>
     `;
@@ -11444,7 +11444,7 @@ var _n = class extends v {
     return this;
   }
   render() {
-    return d`<label data-slot="label" for=${this.for ?? m}></label>`;
+    return d`<label data-slot="label" for=${this.for ?? g}></label>`;
   }
 };
 l([a({ type: String }), c("design:type", String)], _n.prototype, "for", void 0), _n = l([u("rtg-label")], _n);
@@ -11461,7 +11461,7 @@ var xn = class extends v {
   }
   render() {
     return d`
-      <rtg-label data-slot="field-label" for=${this.for ?? m}></rtg-label>
+      <rtg-label data-slot="field-label" for=${this.for ?? g}></rtg-label>
     `;
   }
 };
@@ -11565,13 +11565,13 @@ var $n = class extends v {
     let t = [...new Map(this.errors.map((i) => [i == null ? void 0 : i.message, i])).values()];
     return t.length === 1 ? (r = t[0]) != null && r.message ? t[0].message : null : d`
       <ul data-slot="field-error-content">
-        ${t.map((i, s) => i != null && i.message ? d`<li key=${s}>${i.message}</li>` : m)}
+        ${t.map((i, s) => i != null && i.message ? d`<li key=${s}>${i.message}</li>` : g)}
       </ul>
     `;
   }
   render() {
     let t = this._hasUserContent, e = this._renderContent();
-    return t ? d` <div data-slot="field-error" role="alert">${Array.from(this.childNodes)}</div>` : e ? d` <div data-slot="field-error" role="alert">${e}</div>` : (this.style.display = "none", m);
+    return t ? d` <div data-slot="field-error" role="alert">${Array.from(this.childNodes)}</div>` : e ? d` <div data-slot="field-error" role="alert">${e}</div>` : (this.style.display = "none", g);
   }
 };
 l([a({ type: Array }), c("design:type", Array)], $n.prototype, "errors", void 0), $n = l([u("rtg-field-error")], $n);
@@ -11644,7 +11644,7 @@ var rr = class {
     return d`
       <form
         part="form-controller"
-        class="${g("", this.className)}"
+        class="${m("", this.className)}"
         @submit=${this.handleSubmit}
         ${Qh((t) => this.formElement = t)}
       ></form>
@@ -11671,7 +11671,7 @@ var Bc = "rtg-form-item-context", ru = "rtg-space-form-space-y", iu = "rtg-text-
       <p
         id="${this.itemContext.id}-description"
         part="form-description"
-        class="${g(iu, this.className)}"
+        class="${m(iu, this.className)}"
       ></p>
     `;
   }
@@ -11713,7 +11713,7 @@ var lu = "rtg-form-field-context", rd, ze = class extends _ {
   render() {
     return d`<div
       part="form-field"
-      class="${g(su, this.className)}"
+      class="${m(su, this.className)}"
     ></div>`;
   }
 };
@@ -11734,7 +11734,7 @@ var En = class extends _ {
   render() {
     return d`<div
       part="form-item"
-      class="${g(ou, this.className)}"
+      class="${m(ou, this.className)}"
     ></div>`;
   }
 };
@@ -11772,7 +11772,7 @@ var id, $s = class extends _ {
       <label
         part="form-label"
         for="${this._field.name}"
-        class="${g(nu, this.hasError && "rtg-text-form-label-color-text-error", this.className)}"
+        class="${m(nu, this.hasError && "rtg-text-form-label-color-text-error", this.className)}"
       ></label>
     `;
   }
@@ -11801,7 +11801,7 @@ var sd, Ss = class extends v {
   render() {
     return this.error ? d`<p
       id="${this._field.name}-message"
-      class="${g(au, this.className)}"
+      class="${m(au, this.className)}"
     >
       ${this.error}
     </p>` : null;
@@ -11830,7 +11830,7 @@ var Cs = class extends _ {
         part="form-root"
         id="rtg-form"
         @submit=${this.handleSubmit}
-        class="${g(ru, this.className)}"
+        class="${m(ru, this.className)}"
       ></form>
     `;
   }
@@ -11882,7 +11882,7 @@ var ba = {
       <div
         id="rtg-hover-card-content"
         part="hover-card-content"
-        class=${g(ba.content, this.className)}
+        class=${m(ba.content, this.className)}
         style="display: ${this.isOpen ? "block" : "none"};"
       ></div>
     `;
@@ -11907,7 +11907,7 @@ var od = class extends _ {
       <div
         id="rtg-hover-card-trigger"
         part="rtg-hover-card-trigger"
-        class=${g(ba.trigger, this.className)}
+        class=${m(ba.trigger, this.className)}
       >
         ${Array.from(this.children)}
       </div>
@@ -11965,7 +11965,7 @@ var kn = class extends _ {
       <div
         id="rtg-hover-card-container"
         part="hover-card"
-        class=${g(ba.root, this.className)}
+        class=${m(ba.root, this.className)}
       ></div>
     `;
   }
@@ -12082,27 +12082,27 @@ var tt = class extends v {
     return d`
       <input
         data-slot="input"
-        accept=${this.type === "file" && this.accept ? this.accept : m}
-        autocomplete=${this.autocomplete ?? m}
+        accept=${this.type === "file" && this.accept ? this.accept : g}
+        autocomplete=${this.autocomplete ?? g}
         ?disabled=${this.disabled}
-        form=${this.form ?? m}
-        id=${this._inputId && this._inputId !== "" ? this._inputId : m}
-        max=${this.max ?? m}
-        maxlength=${this.maxlength ?? m}
-        min=${this.min ?? m}
-        minlength=${this.minlength ?? m}
-        multiple=${this.multiple ?? m}
-        name=${this.name ?? m}
-        pattern=${this.max ?? m}
-        placeholder=${this.placeholder ?? m}
+        form=${this.form ?? g}
+        id=${this._inputId && this._inputId !== "" ? this._inputId : g}
+        max=${this.max ?? g}
+        maxlength=${this.maxlength ?? g}
+        min=${this.min ?? g}
+        minlength=${this.minlength ?? g}
+        multiple=${this.multiple ?? g}
+        name=${this.name ?? g}
+        pattern=${this.max ?? g}
+        placeholder=${this.placeholder ?? g}
         ?readonly=${this.readonly}
         ?required=${this.required}
-        step=${this.step ?? m}
+        step=${this.step ?? g}
         type=${this.type}
-        value=${this.value ?? m}
-        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
-        aria-label=${this.ariaLabel ?? m}
-        aria-required=${this.required ? "true" : m}
+        value=${this.value ?? g}
+        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
+        aria-label=${this.ariaLabel ?? g}
+        aria-required=${this.required ? "true" : g}
         @click=${this._onClick}
         @input=${this._onInput}
         @change=${this._onChange}
@@ -12134,7 +12134,7 @@ var et = class extends v {
         .autocomplete=${this.autocomplete}
         ?disabled=${this.disabled}
         .form=${this.form}
-        id=${this._inputId && this._inputId !== "" ? this._inputId : m}
+        id=${this._inputId && this._inputId !== "" ? this._inputId : g}
         ?invalid=${this.invalid}
         .max=${this.max}
         .maxlength=${this.maxlength}
@@ -12175,7 +12175,7 @@ var ad = class extends v {
   }
 };
 ad = l([u("rtg-input-group-text")], ad);
-var mt = class extends v {
+var bt = class extends v {
   constructor(...t) {
     super(...t), this.id = "", this._onInput = (e) => {
       this.value = e.target.value, this.onInput && this.onInput(e);
@@ -12208,27 +12208,27 @@ var mt = class extends v {
     return d`
       <textarea
         data-slot="textarea"
-        autocapitalize=${this.autocapitalize ? this.autocapitalize : m}
-        autocomplete=${this.autocomplete ?? m}
-        autocorrect=${this.autocorrect ?? m}
-        autofocus=${this.autofocus ?? m}
-        cols=${this.cols ?? m}
+        autocapitalize=${this.autocapitalize ? this.autocapitalize : g}
+        autocomplete=${this.autocomplete ?? g}
+        autocorrect=${this.autocorrect ?? g}
+        autofocus=${this.autofocus ?? g}
+        cols=${this.cols ?? g}
         ?disabled=${this.disabled}
-        form=${this.form ?? m}
-        id=${this._textareaId && this._textareaId !== "" ? this._textareaId : m}
-        maxlength=${this.maxlength ?? m}
-        minlength=${this.minlength ?? m}
-        name=${this.name ?? m}
-        placeholder=${this.placeholder ?? m}
+        form=${this.form ?? g}
+        id=${this._textareaId && this._textareaId !== "" ? this._textareaId : g}
+        maxlength=${this.maxlength ?? g}
+        minlength=${this.minlength ?? g}
+        name=${this.name ?? g}
+        placeholder=${this.placeholder ?? g}
         ?readonly=${this.readonly}
         ?required=${this.required}
-        rows=${this.rows ?? m}
-        spellcheck=${this.spellcheck ?? m}
-        wrap=${this.wrap ?? m}
-        value=${this.value ? this.value : m}
-        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
-        aria-label=${this.ariaLabel ?? m}
-        aria-required=${this.required ? "true" : m}
+        rows=${this.rows ?? g}
+        spellcheck=${this.spellcheck ?? g}
+        wrap=${this.wrap ?? g}
+        value=${this.value ? this.value : g}
+        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
+        aria-label=${this.ariaLabel ?? g}
+        aria-required=${this.required ? "true" : g}
         @input=${this._onInput}
         @change=${this._onChange}
         @focus=${this._onFocus}
@@ -12237,8 +12237,8 @@ var mt = class extends v {
     `;
   }
 };
-l([a({ type: String }), c("design:type", Object)], mt.prototype, "autocomplete", void 0), l([a({ type: Number }), c("design:type", Number)], mt.prototype, "cols", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], mt.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], mt.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], mt.prototype, "id", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], mt.prototype, "invalid", void 0), l([a({ type: Number }), c("design:type", Number)], mt.prototype, "maxlength", void 0), l([a({ type: Number }), c("design:type", Number)], mt.prototype, "minlength", void 0), l([a({ type: String }), c("design:type", String)], mt.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], mt.prototype, "placeholder", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], mt.prototype, "readonly", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], mt.prototype, "required", void 0), l([a({ type: Number }), c("design:type", Number)], mt.prototype, "rows", void 0), l([a({ type: String }), c("design:type", Object)], mt.prototype, "wrap", void 0), l([a({ type: String }), c("design:type", String)], mt.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], mt.prototype, "onInput", void 0), l([a({ attribute: !1 }), c("design:type", Function)], mt.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], mt.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], mt.prototype, "onBlur", void 0), mt = l([u("rtg-textarea")], mt);
-var bt = class extends v {
+l([a({ type: String }), c("design:type", Object)], bt.prototype, "autocomplete", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "cols", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], bt.prototype, "id", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "invalid", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "maxlength", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "minlength", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "placeholder", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "readonly", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "required", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "rows", void 0), l([a({ type: String }), c("design:type", Object)], bt.prototype, "wrap", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onInput", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onBlur", void 0), bt = l([u("rtg-textarea")], bt);
+var ft = class extends v {
   constructor(...t) {
     super(...t), this.id = "";
   }
@@ -12255,25 +12255,25 @@ var bt = class extends v {
     return d`
       <rtg-textarea
         data-slot="input-group-textarea"
-        autocapitalize=${this.autocapitalize ? this.autocapitalize : m}
-        autocomplete=${this.autocomplete ?? m}
-        autocorrect=${this.autocorrect ?? m}
-        autofocus=${this.autofocus ?? m}
-        cols=${this.cols ?? m}
+        autocapitalize=${this.autocapitalize ? this.autocapitalize : g}
+        autocomplete=${this.autocomplete ?? g}
+        autocorrect=${this.autocorrect ?? g}
+        autofocus=${this.autofocus ?? g}
+        cols=${this.cols ?? g}
         ?disabled=${this.disabled}
-        form=${this.form ?? m}
-        id=${this._textareaId && this._textareaId !== "" ? this._textareaId : m}
+        form=${this.form ?? g}
+        id=${this._textareaId && this._textareaId !== "" ? this._textareaId : g}
         ?invalid=${this.invalid}
-        maxlength=${this.maxlength ?? m}
-        minlength=${this.minlength ?? m}
-        name=${this.name ?? m}
-        placeholder=${this.placeholder ?? m}
+        maxlength=${this.maxlength ?? g}
+        minlength=${this.minlength ?? g}
+        name=${this.name ?? g}
+        placeholder=${this.placeholder ?? g}
         ?readonly=${this.readonly}
         ?required=${this.required}
-        rows=${this.rows ?? m}
-        spellcheck=${this.spellcheck ?? m}
-        wrap=${this.wrap ?? m}
-        value=${this.value ? this.value : m}
+        rows=${this.rows ?? g}
+        spellcheck=${this.spellcheck ?? g}
+        wrap=${this.wrap ?? g}
+        value=${this.value ? this.value : g}
         .oninput=${this.onInput}
         .onchange=${this.onChange}
         .onfocus=${this.onFocus}
@@ -12282,8 +12282,8 @@ var bt = class extends v {
     `;
   }
 };
-l([a({ type: String }), c("design:type", Object)], bt.prototype, "autocomplete", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "cols", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], bt.prototype, "id", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "invalid", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "maxlength", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "minlength", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "placeholder", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "readonly", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], bt.prototype, "required", void 0), l([a({ type: Number }), c("design:type", Number)], bt.prototype, "rows", void 0), l([a({ type: String }), c("design:type", Object)], bt.prototype, "wrap", void 0), l([a({ type: String }), c("design:type", String)], bt.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onInput", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], bt.prototype, "onBlur", void 0), bt = l([u("rtg-input-group-textarea")], bt);
-var ht = class extends v {
+l([a({ type: String }), c("design:type", Object)], ft.prototype, "autocomplete", void 0), l([a({ type: Number }), c("design:type", Number)], ft.prototype, "cols", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], ft.prototype, "id", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "invalid", void 0), l([a({ type: Number }), c("design:type", Number)], ft.prototype, "maxlength", void 0), l([a({ type: Number }), c("design:type", Number)], ft.prototype, "minlength", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "placeholder", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "readonly", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "required", void 0), l([a({ type: Number }), c("design:type", Number)], ft.prototype, "rows", void 0), l([a({ type: String }), c("design:type", Object)], ft.prototype, "wrap", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onInput", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onBlur", void 0), ft = l([u("rtg-input-group-textarea")], ft);
+var pt = class extends v {
   constructor() {
     super(), this.autocomplete = "one-time-code", this.id = "", this.inputmode = "numeric", this._activeSlot = null, this._hasFocus = !1, this._value = "", this._children = [], this._handleBlur = (t) => {
       var e;
@@ -12411,15 +12411,15 @@ var ht = class extends v {
             data-slot="input-otp"
             autocomplete=${this.autocomplete}
             ?disabled=${this.disabled}
-            form=${this.form ?? m}
-            id=${this._inputId && this._inputId !== "" ? this._inputId : m}
+            form=${this.form ?? g}
+            id=${this._inputId && this._inputId !== "" ? this._inputId : g}
             inputmode=${this.inputmode}
             maxlength=${this.maxlength}
-            name=${this.name ?? m}
-            pattern=${this.pattern ?? m}
+            name=${this.name ?? g}
+            pattern=${this.pattern ?? g}
             ?required=${this.required}
             spellcheck="false"
-            value=${this._currentValue ?? m}
+            value=${this._currentValue ?? g}
             @blur=${this._handleBlur}
             @focus=${this._handleFocus}
             @keydown=${this._handleKeyDown}
@@ -12430,10 +12430,10 @@ var ht = class extends v {
     `;
   }
 };
-l([a({ type: String }), c("design:type", Object)], ht.prototype, "autocomplete", void 0), l([a({
+l([a({ type: String }), c("design:type", Object)], pt.prototype, "autocomplete", void 0), l([a({
   attribute: "default-value",
   type: String
-}), c("design:type", String)], ht.prototype, "defaultValue", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ht.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], ht.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], ht.prototype, "id", void 0), l([a({ type: String }), c("design:type", Object)], ht.prototype, "inputmode", void 0), l([a({ type: Number }), c("design:type", Number)], ht.prototype, "maxlength", void 0), l([a({ type: String }), c("design:type", String)], ht.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], ht.prototype, "pattern", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ht.prototype, "required", void 0), l([a({ type: String }), c("design:type", String)], ht.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ht.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ht.prototype, "onComplete", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ht.prototype, "onBlur", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ht.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ht.prototype, "onPaste", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ht.prototype, "pasteTransformer", void 0), l([x(), c("design:type", Object)], ht.prototype, "_activeSlot", void 0), l([x(), c("design:type", Object)], ht.prototype, "_hasFocus", void 0), l([x(), c("design:type", Object)], ht.prototype, "_value", void 0), ht = l([u("rtg-input-otp"), c("design:paramtypes", [])], ht);
+}), c("design:type", String)], pt.prototype, "defaultValue", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], pt.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], pt.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], pt.prototype, "id", void 0), l([a({ type: String }), c("design:type", Object)], pt.prototype, "inputmode", void 0), l([a({ type: Number }), c("design:type", Number)], pt.prototype, "maxlength", void 0), l([a({ type: String }), c("design:type", String)], pt.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], pt.prototype, "pattern", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], pt.prototype, "required", void 0), l([a({ type: String }), c("design:type", String)], pt.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], pt.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], pt.prototype, "onComplete", void 0), l([a({ attribute: !1 }), c("design:type", Function)], pt.prototype, "onBlur", void 0), l([a({ attribute: !1 }), c("design:type", Function)], pt.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], pt.prototype, "onPaste", void 0), l([a({ attribute: !1 }), c("design:type", Function)], pt.prototype, "pasteTransformer", void 0), l([x(), c("design:type", Object)], pt.prototype, "_activeSlot", void 0), l([x(), c("design:type", Object)], pt.prototype, "_hasFocus", void 0), l([x(), c("design:type", Object)], pt.prototype, "_value", void 0), pt = l([u("rtg-input-otp"), c("design:paramtypes", [])], pt);
 var ld = class extends v {
   createRenderRoot() {
     return this;
@@ -12469,7 +12469,7 @@ var Rs = class extends v {
     return d`
       <div
         data-slot="input-otp-slot"
-        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : m}
+        aria-invalid=${this.invalid || this.ariaInvalid === "true" ? "true" : g}
         @click=${this._handleClick}
       ></div>
     `;
@@ -12510,7 +12510,7 @@ var si = class extends v {
           data-variant="${this.variant}"
           data-size="${this.size}"
           href="${this.href}"
-          target="${this.target ?? m}"
+          target="${this.target ?? g}"
         ></a>
       ` : d`
       <div
@@ -12843,7 +12843,7 @@ var Lt = {
     return d`
       <div
         part="menubar-checkbox-item"
-        class=${g(Lt.checkboxItem.base, this.disabled && "rtg-opacity-menubar-item-opacity-disabled rtg-pointer-events-none", this.className)}
+        class=${m(Lt.checkboxItem.base, this.disabled && "rtg-opacity-menubar-item-opacity-disabled rtg-pointer-events-none", this.className)}
         @click=${this.toggleChecked}
         @mouseover="${this.handleMouseEvent}"
         @mouseleave="${this.handleMouseEvent}"
@@ -12856,7 +12856,7 @@ var Lt = {
         id="${this.identifier}"
         aria-hidden="${this.hidden}"
       >
-        <span class=${g(Lt.checkboxItem.indicator)}>
+        <span class=${m(Lt.checkboxItem.indicator)}>
           ${this.checked ? d`
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
@@ -12868,11 +12868,11 @@ var Lt = {
                   stroke-width="2"
                   stroke-linecap="round"
                   stroke-linejoin="round"
-                  class=${g(Lt.checkboxItem.icon, "lucide lucide-check-icon lucide-check")}
+                  class=${m(Lt.checkboxItem.icon, "lucide lucide-check-icon lucide-check")}
                 >
                   <path d="M20 6 9 17l-5-5" />
                 </svg>
-              ` : m}
+              ` : g}
         </span>
       </div>
     `;
@@ -12982,7 +12982,7 @@ var Ye = class extends _ {
   }
   render() {
     return d`
-      <div class=${g(Lt.menu, this.className)}>
+      <div class=${m(Lt.menu, this.className)}>
         <div
           id="${this.id}"
           data-state="${this.isOpen}"
@@ -13043,7 +13043,7 @@ var oi = class extends _ {
   render() {
     return d`
       <div
-        class=${g(Lt.content, this.className)}
+        class=${m(Lt.content, this.className)}
         id="${this.id}"
         data-side="${this.side}"
         data-align="start"
@@ -13085,15 +13085,15 @@ var qs, Lr, Li = (Lr = class extends _ {
     return e ? this._id = `${e.getAttribute("id")}g${qs._counter++}` : this._id = `rtgcmdrxlxg${qs._counter++}`, this._id;
   }
   render() {
-    return d`${this._hidden === "true" ? m : d`
+    return d`${this._hidden === "true" ? g : d`
           <div
-            class=${g(Lt.group, this.className)}
+            class=${m(Lt.group, this.className)}
             id="${this.identifier}"
             role="presentation"
             part="menubar-group"
           >
             <div
-              class=${g(Lt.label)}
+              class=${m(Lt.label)}
               id="${this.identifier}h"
               aria-hidden="true"
             >
@@ -13146,10 +13146,10 @@ var Vs, Pr, _r = (Pr = class extends _ {
     (e.type === "mouseover" || e.type === "focus") && (this.selected = !0), e.type === "mouseleave" && (this.selected = !1);
   }
   render() {
-    return d` ${this._hidden === "true" ? m : d`
+    return d` ${this._hidden === "true" ? g : d`
           <div
             part="menubar-item"
-            class=${g(Lt.item, this.disabled && "rtg-opacity-menubar-item-opacity-disabled rtg-pointer-events-none", this.className)}
+            class=${m(Lt.item, this.disabled && "rtg-opacity-menubar-item-opacity-disabled rtg-pointer-events-none", this.className)}
             @mouseover="${this.handleMouseEvent}"
             @mouseleave="${this.handleMouseEvent}"
             @focus="${this.handleMouseEvent}"
@@ -13213,7 +13213,7 @@ var Hs, Nr, Ve = (Nr = class extends _ {
     return d`
       <div
         part="menubar-radio-item"
-        class=${g(Lt.radioItem.base, this.disabled && "rtg-opacity-menubar-item-opacity-disabled rtg-pointer-events-none", this.className)}
+        class=${m(Lt.radioItem.base, this.disabled && "rtg-opacity-menubar-item-opacity-disabled rtg-pointer-events-none", this.className)}
         @click=${this.toggleChecked}
         @mouseover="${this.handleMouseEvent}"
         @mouseleave="${this.handleMouseEvent}"
@@ -13226,7 +13226,7 @@ var Hs, Nr, Ve = (Nr = class extends _ {
         id="${this.identifier}"
         aria-hidden="${this.hidden}"
       >
-        <span class=${g(Lt.radioItem.indicator)}>
+        <span class=${m(Lt.radioItem.indicator)}>
           ${this.checked ? d`<svg
                 xmlns="http://www.w3.org/2000/svg"
                 width="24"
@@ -13237,10 +13237,10 @@ var Hs, Nr, Ve = (Nr = class extends _ {
                 stroke-width="2"
                 stroke-linecap="round"
                 stroke-linejoin="round"
-                class=${g(Lt.radioItem.icon, "lucide lucide-circle-icon lucide-circle")}
+                class=${m(Lt.radioItem.icon, "lucide lucide-circle-icon lucide-circle")}
               >
                 <circle cx="12" cy="12" r="10" />
-              </svg>` : m}
+              </svg>` : g}
         </span>
       </div>
     `;
@@ -13280,9 +13280,9 @@ var Gs, zr, Os = (zr = class extends _ {
     this.moveLightDomChildrenInto(this._containerElement);
   }
   render() {
-    return d`${this._hidden === "true" ? m : d`
+    return d`${this._hidden === "true" ? g : d`
           <div
-            class=${g(Lt.separator, this.className)}
+            class=${m(Lt.separator, this.className)}
             id="${this.identifier}"
             role="separator"
             part="menubar-separator"
@@ -13303,7 +13303,7 @@ var wd = class extends _ {
     return ["date-testid"];
   }
   createRenderRoot() {
-    return this.classList = g(Lt.shortcut), this;
+    return this.classList = m(Lt.shortcut), this;
   }
   firstUpdated(t) {
     this.moveLightDomChildrenInto(this._containerElement);
@@ -13311,7 +13311,7 @@ var wd = class extends _ {
   render() {
     return d`
       <span
-        class=${g(Lt.shortcut, this.className)}
+        class=${m(Lt.shortcut, this.className)}
         part="menubar-shortcut"
       >
       </span>
@@ -13335,7 +13335,7 @@ var _d = class extends _ {
   render() {
     return d`
       <button
-        class=${g(Lt.trigger, this.className)}
+        class=${m(Lt.trigger, this.className)}
         type="button"
         role="menuitem"
         part="menubar-trigger"
@@ -13362,7 +13362,7 @@ var xd = class extends _ {
       <div
         role="menubar"
         part="menubar"
-        class=${g(Lt.root, this.className)}
+        class=${m(Lt.root, this.className)}
         tabindex="0"
         data-orientation="horizontal"
       ></div>
@@ -13454,11 +13454,11 @@ var qr = {
   }
   render() {
     return d`
-      <div class="${g("relative", this.className)}">
+      <div class="${m("relative", this.className)}">
         <ul
           part="navigation-menu-list"
           data-orientation="horizontal"
-          class=${g(qr.menuList)}
+          class=${m(qr.menuList)}
           dir="ltr"
         ></ul>
         <div></div>
@@ -13527,10 +13527,10 @@ var Xe = class extends _ {
         @mouseenter="${this.handleHover}"
         @mouseleave="${this.handleMouseLeave}"
         part="navigation-menu-item"
-        class="${g("rtg-relative", this.className)}"
+        class="${m("rtg-relative", this.className)}"
       >
         ${this.navigationLink ? d`<div
-                class=${g(qr.menuItem)}
+                class=${m(qr.menuItem)}
                 @click="${this.toggleMenubar}"
               >
                 <div part="button-slot"></div>
@@ -13544,11 +13544,11 @@ var Xe = class extends _ {
                       stroke-width="2"
                       stroke-linecap="round"
                       stroke-linejoin="round"
-                      class=${g(qr.menuItemIcon, this.isOpen ? "rtg-rotate-180" : "")}
+                      class=${m(qr.menuItemIcon, this.isOpen ? "rtg-rotate-180" : "")}
                       aria-hidden="true"
                     >
                       <path d="m6 9 6 6 6-6"></path>
-                    </svg>` : m}
+                    </svg>` : g}
               </div>
               <div part="content-slot" style="position:absolute"></div>` : ""}
       </li>
@@ -13595,14 +13595,14 @@ var ni = class extends _ {
   render() {
     return d`
       <div
-        class="${g(qr.content, this.className)}"
+        class="${m(qr.content, this.className)}"
         style="display: ${this.isOpen ? "block" : "none"};top:0px;left:0px;"
         part="navigation-menu-content"
       >
         <div
           data-state="${this.isOpen}"
           data-orientation="horizontal"
-          class="${g(qr.contentContainer, this.className)}"
+          class="${m(qr.contentContainer, this.className)}"
         >
           <div
             id="${this.id}"
@@ -13637,7 +13637,7 @@ var On = class extends _ {
     return d`
       <a
         part="navigation-menu-link"
-        class="${g(qr.link, this.className)}"
+        class="${m(qr.link, this.className)}"
         href="${this.href}"
         data-radix-collection-item=""
         data-tabindex=""
@@ -13663,7 +13663,7 @@ var Sd = class extends _ {
   }
   render() {
     return d`
-      <div part="navigation-menu-trigger" class="${g(this.className)}"></div>
+      <div part="navigation-menu-trigger" class="${m(this.className)}"></div>
     `;
   }
 };
@@ -13684,7 +13684,7 @@ var Cd = class extends _ {
         aria-label="Main"
         data-orientation="horizontal"
         dir="ltr"
-        class="${g(qr.menu, this.className)}"
+        class="${m(qr.menu, this.className)}"
       ></nav>
     `;
   }
@@ -13728,7 +13728,7 @@ var ge = {
       <ul
         data-slot="pagination-content"
         part="pagination-content"
-        class=${g(ge.content, this.className)}
+        class=${m(ge.content, this.className)}
       ></ul>
     `;
   }
@@ -13750,7 +13750,7 @@ var kd = class extends _ {
         aria-hidden
         data-slot="pagination-ellipsis"
         part="pagination-ellipsis"
-        class=${g(ge.ellipsis.base, this.className)}
+        class=${m(ge.ellipsis.base, this.className)}
       >
         <svg
           xmlns="http://www.w3.org/2000/svg"
@@ -13762,14 +13762,14 @@ var kd = class extends _ {
           stroke-width="2"
           stroke-linecap="round"
           stroke-linejoin="round"
-          class=${g(ge.ellipsis.icon, "lucide lucide-ellipsis-icon lucide-ellipsis")}
+          class=${m(ge.ellipsis.icon, "lucide lucide-ellipsis-icon lucide-ellipsis")}
         >
           <circle cx="12" cy="12" r="1" />
           <circle cx="19" cy="12" r="1" />
           <circle cx="5" cy="12" r="1" />
         </svg>
 
-        <span class=${g(ge.ellipsis.span)}>More pages</span>
+        <span class=${m(ge.ellipsis.span)}>More pages</span>
       </span>
     `;
   }
@@ -13800,7 +13800,7 @@ var Rd, Sr = class extends _ {
         part="pagination-link"
         id="${this.id}"
         href="${this.href}"
-        class=${g(ge.link({
+        class=${m(ge.link({
       variant: this.isActive ? "outline" : "ghost",
       size: this.size
     }), this.className)}
@@ -13866,7 +13866,7 @@ var Is = class extends _ {
       <li
         data-slot="pagination-item"
         part="pagination-item"
-        class=${g(ge.item, this.className)}
+        class=${m(ge.item, this.className)}
         @click="${this.handleClick}"
       ></li>
     `;
@@ -13892,9 +13892,9 @@ var In = class extends _ {
         aria-label="Go to next page"
         size="default"
         href=${this.href}
-        class=${g(ge.next.base, this.className)}
+        class=${m(ge.next.base, this.className)}
       >
-        <span class=${g(ge.next.span)}>Next</span>
+        <span class=${m(ge.next.span)}>Next</span>
 
         <svg
           xmlns="http://www.w3.org/2000/svg"
@@ -13936,7 +13936,7 @@ var An = class extends _ {
         aria-label="Go to previous page"
         size="default"
         href=${this.href}
-        class=${g(ge.previous.base, this.className)}
+        class=${m(ge.previous.base, this.className)}
       >
         <svg
           xmlns="http://www.w3.org/2000/svg"
@@ -13953,7 +13953,7 @@ var An = class extends _ {
           <path d="m15 18-6-6 6-6" />
         </svg>
 
-        <span class=${g(ge.previous.span)}>Previous</span>
+        <span class=${m(ge.previous.span)}>Previous</span>
 
         <div part="pagination-previous"></div>
       </rtg-pagination-link>
@@ -13978,13 +13978,13 @@ var Od = class extends _ {
         aria-label="pagination"
         data-slot="pagination"
         part="pagination"
-        class=${g(ge.root, this.className)}
+        class=${m(ge.root, this.className)}
       ></nav>
     `;
   }
 };
 Od = l([u("rtg-pagination")], Od);
-var ft = class extends v {
+var vt = class extends v {
   constructor(...t) {
     super(...t), this.id = "", this._showPassword = !1, this._handleToggle = () => {
       this._showPassword = !this._showPassword;
@@ -14055,7 +14055,7 @@ var ft = class extends v {
           .autocomplete=${this.autocomplete}
           ?disabled=${this.disabled}
           .form=${this.form}
-          id=${this._inputId && this._inputId !== "" ? this._inputId : m}
+          id=${this._inputId && this._inputId !== "" ? this._inputId : g}
           ?invalid=${this.invalid}
           .maxlength=${this.maxlength}
           .minlength=${this.minlength}
@@ -14092,7 +14092,7 @@ var ft = class extends v {
     `;
   }
 };
-l([a({ type: String }), c("design:type", Object)], ft.prototype, "autocomplete", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], ft.prototype, "id", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "invalid", void 0), l([a({ type: Number }), c("design:type", Number)], ft.prototype, "maxlength", void 0), l([a({ type: Number }), c("design:type", Number)], ft.prototype, "minlength", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "pattern", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "placeholder", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "readonly", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], ft.prototype, "required", void 0), l([a({ type: String }), c("design:type", String)], ft.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onClick", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onInput", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], ft.prototype, "onBlur", void 0), l([x(), c("design:type", Object)], ft.prototype, "_showPassword", void 0), ft = l([u("rtg-password-input")], ft);
+l([a({ type: String }), c("design:type", Object)], vt.prototype, "autocomplete", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], vt.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", String)], vt.prototype, "form", void 0), l([a({ type: String }), c("design:type", Object)], vt.prototype, "id", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], vt.prototype, "invalid", void 0), l([a({ type: Number }), c("design:type", Number)], vt.prototype, "maxlength", void 0), l([a({ type: Number }), c("design:type", Number)], vt.prototype, "minlength", void 0), l([a({ type: String }), c("design:type", String)], vt.prototype, "name", void 0), l([a({ type: String }), c("design:type", String)], vt.prototype, "pattern", void 0), l([a({ type: String }), c("design:type", String)], vt.prototype, "placeholder", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], vt.prototype, "readonly", void 0), l([a({ type: Boolean }), c("design:type", Boolean)], vt.prototype, "required", void 0), l([a({ type: String }), c("design:type", String)], vt.prototype, "value", void 0), l([a({ attribute: !1 }), c("design:type", Function)], vt.prototype, "onClick", void 0), l([a({ attribute: !1 }), c("design:type", Function)], vt.prototype, "onInput", void 0), l([a({ attribute: !1 }), c("design:type", Function)], vt.prototype, "onChange", void 0), l([a({ attribute: !1 }), c("design:type", Function)], vt.prototype, "onFocus", void 0), l([a({ attribute: !1 }), c("design:type", Function)], vt.prototype, "onBlur", void 0), l([x(), c("design:type", Object)], vt.prototype, "_showPassword", void 0), vt = l([u("rtg-password-input")], vt);
 var Id = {
   root: [
     "rtg-relative rtg-overflow-hidden",
@@ -14123,12 +14123,12 @@ var Id = {
         role="progressbar"
         data-state="indeterminate"
         data-max="100"
-        class="${g(Id.root, this.className)}"
+        class="${m(Id.root, this.className)}"
       >
         <div
           data-state="indeterminate"
           data-max="100"
-          class="${g(Id.indicator, this.className)}"
+          class="${m(Id.indicator, this.className)}"
           style="transform: translateX(-${100 - (this.value || 0)}%);"
         ></div>
       </div>
@@ -14177,7 +14177,7 @@ var ji = {
     })));
   }
   createRenderRoot() {
-    return this.classList = g(ji.item.wrapper), this;
+    return this.classList = m(ji.item.wrapper), this;
   }
   firstUpdated(t) {
     this.moveLightDomChildrenInto(this._containerElement);
@@ -14194,14 +14194,14 @@ var ji = {
         value="${this.value}"
         ?disabled=${this.disabled}
         @click="${this._onClick}"
-        class=${g(ji.item.item, this.className)}
+        class=${m(ji.item.item, this.className)}
         id="${this.id}"
         tabindex="${this.tabindex}"
       >
         ${this.checked ? d`<span
               data-slot="radio-group-indicator"
               part="radio-group-indicator"
-              class=${g(ji.item.indicator)}
+              class=${m(ji.item.indicator)}
             >
               <svg
                 xmlns="http://www.w3.org/2000/svg"
@@ -14213,11 +14213,11 @@ var ji = {
                 stroke-width="2"
                 stroke-linecap="round"
                 stroke-linejoin="round"
-                class=${g(ji.item.icon, "lucide lucide-circle-icon lucide-circle")}
+                class=${m(ji.item.icon, "lucide lucide-circle-icon lucide-circle")}
               >
                 <circle cx="12" cy="12" r="10" />
               </svg>
-            </span>` : m}
+            </span>` : g}
       </button>
     `;
   }
@@ -14259,7 +14259,7 @@ var Ln = class extends _ {
     }), d`
       <div
         part="radio-group"
-        class=${g(ji.root, this.className)}
+        class=${m(ji.root, this.className)}
       ></div>
     `;
   }
@@ -14281,7 +14281,7 @@ var cu = [
       <div
         dir="ltr"
         data-slot="scroll-area"
-        class=${g(cu, this.className)}
+        class=${m(cu, this.className)}
       >
         <style>
           [data-radix-scroll-area-viewport] {
@@ -14517,12 +14517,12 @@ var hu = class {
       <div
         part="select-group"
         data-slot="select-content"
-        class="${g(me.content.content, this.className)}"
+        class="${m(me.content.content, this.className)}"
         style=${"min-width: 128px; display: none;"}
       >
         <div
           part="select-viewport"
-          class=${g(me.content.viewport)}
+          class=${m(me.content.viewport)}
         ></div>
       </div>
     `;
@@ -14578,7 +14578,7 @@ var He = class extends _ {
         ${Pt(this.getFilteredAttributes())}
         part="select-item"
         @click=${this.handleClick}
-        class=${g(me.item.item, this.className)}
+        class=${m(me.item.item, this.className)}
         data-hs-select-value=${this.value}
         aria-selected="${this.isSelected}"
         data-selected="${this.isSelected}"
@@ -14586,7 +14586,7 @@ var He = class extends _ {
         ${this.isSelected ? d`
               <span
                 part="select-item-indicator"
-                class=${g(me.item.indicator)}
+                class=${m(me.item.indicator)}
               >
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
@@ -14598,7 +14598,7 @@ var He = class extends _ {
                   stroke-width="2"
                   stroke-linecap="round"
                   stroke-linejoin="round"
-                  class=${g(me.item.icon, "lucide lucide-check-icon lucide-check")}
+                  class=${m(me.item.icon, "lucide lucide-check-icon lucide-check")}
                 >
                   <path d="M20 6 9 17l-5-5" />
                 </svg>
@@ -14625,7 +14625,7 @@ var Td = class extends _ {
     return d`
       <div
         part="select-label"
-        class=${g(me.label, this.className)}
+        class=${m(me.label, this.className)}
       ></div>
     `;
   }
@@ -14648,7 +14648,7 @@ var As = class extends _ {
     return d`
       <div
         part="select-list"
-        class="${g("rtg-absolute rtg-z-50 rtg-max-h-72 rtg-w-full rtg-overflow-hidden rtg-overflow-y-auto rtg-rounded-lg rtg-border rtg-border-input rtg-bg-background p-1 [&::-webkit-scrollbar-thumb]:rtg-rounded-full [&::-webkit-scrollbar-thumb]:rtg-bg-accent [&::-webkit-scrollbar-track]:rtg-bg-gray-100 [&::-webkit-scrollbar]:rtg-w-2", this.className)}"
+        class="${m("rtg-absolute rtg-z-50 rtg-max-h-72 rtg-w-full rtg-overflow-hidden rtg-overflow-y-auto rtg-rounded-lg rtg-border rtg-border-input rtg-bg-background p-1 [&::-webkit-scrollbar-thumb]:rtg-rounded-full [&::-webkit-scrollbar-thumb]:rtg-bg-accent [&::-webkit-scrollbar-track]:rtg-bg-gray-100 [&::-webkit-scrollbar]:rtg-w-2", this.className)}"
         data-hs-combo-box-output=""
         data-state="${this.state}"
         style="display: ${this.isOpen ? "block" : "none"}; top:115%"
@@ -14673,7 +14673,7 @@ var Ts = class extends v {
         rtgcmd-separator
         part="select-separator"
         role="separator"
-        class=${g(me.separator, this.className)}
+        class=${m(me.separator, this.className)}
       ></div>
     `;
   }
@@ -14735,7 +14735,7 @@ var Ld = class extends _ {
         type="button"
         part="select-trigger"
         role="tab"
-        class=${g(...this.filterConflictingWidthClasses(me.trigger.trigger, t), t)}
+        class=${m(...this.filterConflictingWidthClasses(me.trigger.trigger, t), t)}
         tabindex="-1"
         data-orientation="horizontal"
         data-radix-collection-item=""
@@ -14754,7 +14754,7 @@ var Ld = class extends _ {
           stroke-width="2"
           stroke-linecap="round"
           stroke-linejoin="round"
-          class=${g(me.trigger.icon, "lucide lucide-chevron-down-icon lucide-chevron-down")}
+          class=${m(me.trigger.icon, "lucide lucide-chevron-down-icon lucide-chevron-down")}
         >
           <path d="m6 9 6 6 6-6" />
         </svg>
@@ -14796,7 +14796,7 @@ var zn = class extends _ {
   }
   render() {
     return d`
-      <span part="select-value" class=${g(me.value, this.className)}>
+      <span part="select-value" class=${m(me.value, this.className)}>
         ${this.renderLabel()}
       </span>
     `;
@@ -14828,7 +14828,7 @@ var fi = class extends _ {
       <div
         part="select"
         data-select-uuid=${this.uuid}
-        class=${g(me.root, this.className)}
+        class=${m(me.root, this.className)}
       ></div>
     `;
   }
@@ -14839,7 +14839,7 @@ var pu = "rtg-bg-skeleton-color-bg rtg-animate-skeleton-animate rtg-rounded-skel
     return this;
   }
   render() {
-    return d` <div class=${g(pu, this.className)}></div> `;
+    return d` <div class=${m(pu, this.className)}></div> `;
   }
 };
 Pd = l([u("rtg-skeleton")], Pd);
@@ -14962,12 +14962,12 @@ var Nd = {
         data-disabled=${this.disabled}
         data-state=${this.state}
         @click="${this._toggleChecked}"
-        class=${g(Nd.root, this.className)}
+        class=${m(Nd.root, this.className)}
       >
         <div
           part="switch-thumb"
           data-state=${this.state}
-          class=${g(Nd.thumb)}
+          class=${m(Nd.thumb)}
         ></div>
       </div>
     `;
@@ -15043,22 +15043,22 @@ var It = {
   render() {
     let t = this.columnKeys;
     return d`
-      <div class=${g(It.preview)}>
-        <div class=${g(It.container)}>
-          <table part="table" class=${g(It.table)}>
+      <div class=${m(It.preview)}>
+        <div class=${m(It.container)}>
+          <table part="table" class=${m(It.table)}>
             ${this.captionText ? d`
-                  <caption class=${g(It.caption)}>
+                  <caption class=${m(It.caption)}>
                     ${this.captionText}
                   </caption>
                 ` : null}
 
-            <thead class=${g(It.head.root)}>
-              <tr class=${g(It.head.row)}>
+            <thead class=${m(It.head.root)}>
+              <tr class=${m(It.head.row)}>
                 ${t.map((e, r, i) => {
       let s = r === i.length - 1;
       return d`
                     <th
-                      class=${g(It.head.cell.base, s ? It.head.cell.align.right : It.head.cell.align.left)}
+                      class=${m(It.head.cell.base, s ? It.head.cell.align.right : It.head.cell.align.left)}
                     >
                       ${this.capitalizeLabel(e)}
                     </th>
@@ -15067,17 +15067,17 @@ var It = {
               </tr>
             </thead>
 
-            <tbody class=${g(It.body.root)}>
+            <tbody class=${m(It.body.root)}>
               ${this.dataTable.map((e) => d`
                   <tr
                     data-id=${e.id ?? ""}
-                    class=${g(It.body.row)}
+                    class=${m(It.body.row)}
                   >
                     ${t.map((r, i, s) => {
       let o = i === s.length - 1;
       return d`
                         <td
-                          class=${g(It.body.cell.base, o && It.body.cell.align.right)}
+                          class=${m(It.body.cell.base, o && It.body.cell.align.right)}
                         >
                           ${e[r] ?? ""}
                         </td>
@@ -15088,13 +15088,13 @@ var It = {
             </tbody>
 
             ${this.footerData.length ? d`
-                  <tfoot class=${g(It.footer.root)}>
-                    <tr class=${g(It.footer.row)}>
+                  <tfoot class=${m(It.footer.root)}>
+                    <tr class=${m(It.footer.row)}>
                       ${t.map((e, r, i) => {
       let s = r === i.length - 1, o = this.footerData.find((n) => n.key === e);
       return d`
                           <td
-                            class=${g(It.footer.cell.base, s && It.footer.cell.align.right)}
+                            class=${m(It.footer.cell.base, s && It.footer.cell.align.right)}
                           >
                             ${(o == null ? void 0 : o.value) ?? ""}
                           </td>
@@ -15347,7 +15347,7 @@ var Yi = {
       part="toast-view-port"
       tabindex="-1"
       @click="${(e) => e.stopPropagation()}"
-      class="${g(Yi.viewportRoot, this.className, `${this.state === Ud ? "hidden" : "block"}  `)}"
+      class="${m(Yi.viewportRoot, this.className, `${this.state === Ud ? "hidden" : "block"}  `)}"
     >
       <li
         part="toast-view-port-li"
@@ -15357,7 +15357,7 @@ var Yi = {
         tabindex="0"
         data-state="${this.state}"
         data-swipe-direction="right"
-        class="${g(Ks.toastVariants.base, Ks.toastVariants.variants[this.variant], this.className)}"
+        class="${m(Ks.toastVariants.base, Ks.toastVariants.variants[this.variant], this.className)}"
         data-radix-collection-item=""
         style="user-select: none; touch-action: none;"
       ></li>
@@ -15399,7 +15399,7 @@ var Fd, Ws, Dr, Fn = (Dr = class extends _ {
         ${Pt(this.getFilteredAttributes())}
         part="toast-action"
         type="button"
-        class="${g(Ws.toastVariants.base, Ws.toastVariants.variants[this.variant], this.className, "rtg-w-max")}"
+        class="${m(Ws.toastVariants.base, Ws.toastVariants.variants[this.variant], this.className, "rtg-w-max")}"
       ></button>
     `;
   }
@@ -15418,7 +15418,7 @@ var Md = class extends _ {
   render() {
     return d`
       <div
-        class="${g(Yi.description, this.className)}"
+        class="${m(Yi.description, this.className)}"
         part="toast-description"
       >
         <slot></slot>
@@ -15441,7 +15441,7 @@ var Bd = class extends _ {
     return d`
       <div
         part="toast-title"
-        class="${g(Yi.title, this.className)}"
+        class="${m(Yi.title, this.className)}"
       ></div>
     `;
   }
@@ -15473,7 +15473,7 @@ var qd = class extends _ {
       <div
         @click=${this.handleClick}
         part="toast-trigger"
-        class="${g(this.className)}"
+        class="${m(this.className)}"
       ></div>
     `;
   }
@@ -15511,7 +15511,7 @@ var Ys = class extends _ {
     return this;
   }
   render() {
-    return d` <div class="${g("", this.className)}" part="toast"></div> `;
+    return d` <div class="${m("", this.className)}" part="toast"></div> `;
   }
 };
 l([x(), c("design:type", Object)], Ys.prototype, "isOpen", void 0), Ys = l([u("rtg-toast")], Ys);
@@ -15584,7 +15584,7 @@ var Vr = /* @__PURE__ */ (function(t) {
         part="toggle-group-item"
         id=${this.id}
         type="button"
-        class="${g(Xn.toggleGroupVariants({
+        class="${m(Xn.toggleGroupVariants({
       variant: this.variant,
       size: this.size,
       className: this.className
@@ -15645,7 +15645,7 @@ var Kd, Wd, Yd, Ne = class extends _ {
         part="toggle-group"
         role="group"
         ${Pt(t)}
-        class="${g(fu, this.className)}"
+        class="${m(fu, this.className)}"
         ?disable="${this.disabled}"
       ></div>
     `;
@@ -15705,7 +15705,7 @@ var Vi = /* @__PURE__ */ (function(t) {
       <button
         type="button"
         part="toggle"
-        class="${g(Zn.toggleVariants({
+        class="${m(Zn.toggleVariants({
       variant: this.variant,
       size: this.size,
       className: this.className
@@ -16224,7 +16224,7 @@ var xu = /* @__PURE__ */ Lc(((t) => {
   }
   var nt = Y.prototype = new J();
   nt.constructor = Y, T(nt, N.prototype), nt.isPureReactComponent = !0;
-  var ut = Array.isArray;
+  var gt = Array.isArray;
   function jt() {
   }
   var H = {
@@ -16303,12 +16303,12 @@ var xu = /* @__PURE__ */ Lc(((t) => {
             return rt = f._init, te(rt(f._payload), $, B, M, W);
         }
     }
-    if (rt) return W = W(f), rt = M === "" ? "." + Ie(f, 0) : M, ut(W) ? (B = "", rt != null && (B = rt.replace(Qt, "$&/") + "/"), te(W, $, B, "", function(fh) {
+    if (rt) return W = W(f), rt = M === "" ? "." + Ie(f, 0) : M, gt(W) ? (B = "", rt != null && (B = rt.replace(Qt, "$&/") + "/"), te(W, $, B, "", function(fh) {
       return fh;
     })) : W != null && (L(W) && (W = Oe(W, B + (W.key == null || f && f.key === W.key ? "" : ("" + W.key).replace(Qt, "$&/") + "/") + rt)), $.push(W)), 1;
     rt = 0;
     var _e = M === "" ? "." : M + ":";
-    if (ut(f)) for (var Ft = 0; Ft < f.length; Ft++) M = f[Ft], Q = _e + Ie(M, Ft), rt += te(M, $, B, Q, W);
+    if (gt(f)) for (var Ft = 0; Ft < f.length; Ft++) M = f[Ft], Q = _e + Ie(M, Ft), rt += te(M, $, B, Q, W);
     else if (Ft = S(f), typeof Ft == "function") for (f = Ft.call(f), Ft = 0; !(M = f.next()).done; ) M = M.value, Q = _e + Ie(M, Ft++), rt += te(M, $, B, Q, W);
     else if (Q === "object") {
       if (typeof f.then == "function") return te(ce(f), $, B, M, W);
@@ -16349,7 +16349,7 @@ var xu = /* @__PURE__ */ Lc(((t) => {
       return;
     }
     console.error(f);
-  }, gt = {
+  }, mt = {
     map: ee,
     forEach: function(f, $, B) {
       ee(f, function() {
@@ -16372,7 +16372,7 @@ var xu = /* @__PURE__ */ Lc(((t) => {
       return f;
     }
   };
-  t.Activity = E, t.Children = gt, t.Component = N, t.Fragment = i, t.Profiler = o, t.PureComponent = Y, t.StrictMode = s, t.Suspense = b, t.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE = H, t.__COMPILER_RUNTIME = {
+  t.Activity = E, t.Children = mt, t.Component = N, t.Fragment = i, t.Profiler = o, t.PureComponent = Y, t.StrictMode = s, t.Suspense = b, t.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE = H, t.__COMPILER_RUNTIME = {
     __proto__: null,
     c: function(f) {
       return H.H.useMemoCache(f);
@@ -16855,7 +16855,7 @@ const st = (t) => {
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
   tg.test(t) && !eg.test(t)
 ), ah = () => !1, pg = (t) => rg.test(t), ug = (t) => ig.test(t), gg = () => {
-  const t = st("colors"), e = st("spacing"), r = st("blur"), i = st("brightness"), s = st("borderColor"), o = st("borderRadius"), n = st("borderSpacing"), h = st("borderWidth"), p = st("contrast"), b = st("grayscale"), y = st("hueRotate"), w = st("invert"), E = st("gap"), C = st("gradientColorStops"), S = st("gradientColorStopPositions"), k = st("inset"), T = st("margin"), I = st("opacity"), N = st("padding"), J = st("saturate"), Y = st("scale"), nt = st("sepia"), ut = st("skew"), jt = st("space"), H = st("translate"), Yt = () => ["auto", "contain", "none"], de = () => ["auto", "hidden", "clip", "visible", "scroll"], Oe = () => ["auto", V, e], L = () => [V, e], hr = () => ["", Pe, Ke], Qt = () => ["auto", gi, V], Ie = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], ce = () => ["solid", "dashed", "dotted", "double", "none"], te = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], ee = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], Xt = () => ["", "0", V], Ue = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], gt = () => [gi, V];
+  const t = st("colors"), e = st("spacing"), r = st("blur"), i = st("brightness"), s = st("borderColor"), o = st("borderRadius"), n = st("borderSpacing"), h = st("borderWidth"), p = st("contrast"), b = st("grayscale"), y = st("hueRotate"), w = st("invert"), E = st("gap"), C = st("gradientColorStops"), S = st("gradientColorStopPositions"), k = st("inset"), T = st("margin"), I = st("opacity"), N = st("padding"), J = st("saturate"), Y = st("scale"), nt = st("sepia"), gt = st("skew"), jt = st("space"), H = st("translate"), Yt = () => ["auto", "contain", "none"], de = () => ["auto", "hidden", "clip", "visible", "scroll"], Oe = () => ["auto", V, e], L = () => [V, e], hr = () => ["", Pe, Ke], Qt = () => ["auto", gi, V], Ie = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], ce = () => ["solid", "dashed", "dotted", "double", "none"], te = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], ee = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], Xt = () => ["", "0", V], Ue = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], mt = () => [gi, V];
   return {
     cacheSize: 500,
     separator: ":",
@@ -16863,26 +16863,26 @@ const st = (t) => {
       colors: [zi],
       spacing: [Pe, Ke],
       blur: ["none", "", We, V],
-      brightness: gt(),
+      brightness: mt(),
       borderColor: [t],
       borderRadius: ["none", "", "full", We, V],
       borderSpacing: L(),
       borderWidth: hr(),
-      contrast: gt(),
+      contrast: mt(),
       grayscale: Xt(),
-      hueRotate: gt(),
+      hueRotate: mt(),
       invert: Xt(),
       gap: L(),
       gradientColorStops: [t],
       gradientColorStopPositions: [sg, Ke],
       inset: Oe(),
       margin: Oe(),
-      opacity: gt(),
+      opacity: mt(),
       padding: L(),
-      saturate: gt(),
-      scale: gt(),
+      saturate: mt(),
+      scale: mt(),
       sepia: Xt(),
-      skew: gt(),
+      skew: mt(),
       space: L(),
       translate: L()
     },
@@ -18457,7 +18457,7 @@ const st = (t) => {
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: gt()
+        duration: mt()
       }],
       /**
        * Transition Timing Function
@@ -18471,7 +18471,7 @@ const st = (t) => {
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: gt()
+        delay: mt()
       }],
       /**
        * Animation
@@ -18535,14 +18535,14 @@ const st = (t) => {
        * @see https://tailwindcss.com/docs/skew
        */
       "skew-x": [{
-        "skew-x": [ut]
+        "skew-x": [gt]
       }],
       /**
        * Skew Y
        * @see https://tailwindcss.com/docs/skew
        */
       "skew-y": [{
-        "skew-y": [ut]
+        "skew-y": [gt]
       }],
       /**
        * Transform Origin
@@ -19163,19 +19163,19 @@ let Zi = class extends v {
     ), d`
       <rtg-button
         variant=${t}
-        size=${e ?? m}
+        size=${e ?? g}
         type=${this.element.properties.submit ? "submit" : "button"}
         ?disabled=${this._disabled || this._loading}
         ?invalid=${r}
-        href=${i ?? m}
-        target=${s ?? m}
+        href=${i ?? g}
+        target=${s ?? g}
         class=${p}
         style=${R(y)}
         .onclick=${this._onClick}
       >
-        ${n === "start" ? this._renderIcon() : m}
+        ${n === "start" ? this._renderIcon() : g}
         ${o}
-        ${n !== "start" ? this._renderIcon() : m}
+        ${n !== "start" ? this._renderIcon() : g}
       </rtg-button>
     `;
   }
@@ -19624,10 +19624,10 @@ let ao = class extends v {
     const s = this.element.properties.variant || "digits_only";
     return io`
       <rtg-input-otp
-        id=${this.element.data_key ?? this.element.id ?? m}
-        name=${this.element.data_key ?? this.element.id ?? m}
+        id=${this.element.data_key ?? this.element.id ?? g}
+        name=${this.element.data_key ?? this.element.id ?? g}
         maxlength=${this.element.properties.length ?? 6}
-        pattern=${s === "digits_only" ? "\\d+" : m}
+        pattern=${s === "digits_only" ? "\\d+" : g}
         .value=${this.element.data_key && this.component.formData[this.element.data_key] || ""}
         data-key=${this.element.data_key || ""}
         class=${t}
@@ -19694,8 +19694,8 @@ let lo = class extends v {
     ), d`
       <rtg-alert
         variant=${this.element.properties.variant ?? "destructive"}
-        class=${t ?? m}
-        style=${R(r) ?? m}
+        class=${t ?? g}
+        style=${R(r) ?? g}
       >
         ${this._renderIcon()}
         ${this._renderTitle()}
@@ -20072,7 +20072,7 @@ let uo = class extends v {
   renderChildren() {
     return this.element.properties.children ? this.element.properties.children.map(
       (t) => hh(this.component, t)
-    ) : m;
+    ) : g;
   }
   render() {
     var s, o, n, h;
@@ -20427,8 +20427,8 @@ let mo = class extends v {
           id=${this._key}
           name=${this._key}
           type=${this.element.properties.type}
-          autocomplete=${this.element.properties.autocomplete ?? m}
-          placeholder=${this.element.properties.placeholder ?? m}
+          autocomplete=${this.element.properties.autocomplete ?? g}
+          placeholder=${this.element.properties.placeholder ?? g}
           value=${n}
           ?invalid=${this._invalid}
           data-key=${this.element.data_key || ""}
@@ -20480,9 +20480,9 @@ let bo = class extends v {
       ((p = (h = this.component.customizations) == null ? void 0 : h.config) == null ? void 0 : p.breakpoints) ?? kt
     ), d`
       <rtg-label
-        for=${this.element.properties.for ?? m}
-        class=${t ?? m}
-        style=${R(r) ?? m}
+        for=${this.element.properties.for ?? g}
+        class=${t ?? g}
+        style=${R(r) ?? g}
       >
         ${this.element.properties.content}
       </rtg-label>
@@ -20627,7 +20627,7 @@ var bm = Object.defineProperty, fm = Object.getOwnPropertyDescriptor, Si = (t, e
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && bm(e, r, s), s;
 };
-let xt = class extends v {
+let $t = class extends v {
   constructor() {
     super(...arguments), this.seed = Nt(), this.variant = "default", this.content = { description: "Something went wrong." };
   }
@@ -20649,28 +20649,28 @@ let xt = class extends v {
    * derived from the component's part name and `seed`.
    */
   get rootId() {
-    return this.childId ?? `sb-${xt.parts.root}-${this.seed}`;
+    return this.childId ?? `sb-${$t.parts.root}-${this.seed}`;
   }
   /**
    * The `id` of the spinner element, derived from `rootId` with the icon part
    * name appended.
    */
   get iconId() {
-    return `${this.rootId}-${xt._ICON}`;
+    return `${this.rootId}-${$t._ICON}`;
   }
   /**
    * The `id` of the spinner element, derived from `rootId` with the title part
    * name appended.
    */
   get titleId() {
-    return `${this.rootId}-${xt._TITLE}`;
+    return `${this.rootId}-${$t._TITLE}`;
   }
   /**
    * The `id` of the spinner element, derived from `rootId` with the description
    * part name appended.
    */
   get descriptionId() {
-    return `${this.rootId}-${xt._DESCRIPTION}`;
+    return `${this.rootId}-${$t._DESCRIPTION}`;
   }
   /**
    * Uses the `variant` prop to derive the `variant` prop passed to `rtg-alert`.
@@ -20686,52 +20686,52 @@ let xt = class extends v {
     return d`
       <rtg-alert
         id="${this.rootId}"
-        part="${xt.parts.root}"
+        part="${$t.parts.root}"
         variant="${this._variant}"
       >
-        ${t ? t(this.iconId, xt.parts.icon) : m}
+        ${t ? t(this.iconId, $t.parts.icon) : g}
         ${e ? d`
               <rtg-alert-title
                 id="${this.titleId}"
-                part="${xt.parts.title}"
+                part="${$t.parts.title}"
               >
                 ${e}
               </rtg-alert-title>
-            ` : m}
+            ` : g}
         ${r ? d`
               <rtg-alert-description
                 id="${this.descriptionId}"
-                part="${xt.parts.description}"
+                part="${$t.parts.description}"
               >
                 ${r}
               </rtg-alert-description>
-            ` : m}
+            ` : g}
       </rtg-alert>
     `;
   }
 };
-xt._ROOT = "error";
-xt._ICON = "icon";
-xt._TITLE = "title";
-xt._DESCRIPTION = "description";
+$t._ROOT = "error";
+$t._ICON = "icon";
+$t._TITLE = "title";
+$t._DESCRIPTION = "description";
 Si([
   a({ type: String })
-], xt.prototype, "seed", 2);
+], $t.prototype, "seed", 2);
 Si([
   a({ attribute: "child-id", type: String })
-], xt.prototype, "childId", 2);
+], $t.prototype, "childId", 2);
 Si([
   a({ type: String })
-], xt.prototype, "variant", 2);
+], $t.prototype, "variant", 2);
 Si([
   a({ type: Object })
-], xt.prototype, "content", 2);
+], $t.prototype, "content", 2);
 Si([
   a({ type: String })
-], xt.prototype, "icon", 2);
-xt = Si([
+], $t.prototype, "icon", 2);
+$t = Si([
   u("sb-error")
-], xt);
+], $t);
 var vm = Object.defineProperty, ym = Object.getOwnPropertyDescriptor, lt = (t, e, r, i) => {
   for (var s = i > 1 ? void 0 : i ? ym(e, r) : e, o = t.length - 1, n; o >= 0; o--)
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
@@ -20936,7 +20936,7 @@ let A = class extends v {
    * mark will be prioritised and rendered instead of the asterisk.
    */
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${A.parts.mark}"
@@ -20971,14 +20971,14 @@ let A = class extends v {
       >
         ${this.description}
       </rtg-field-description>
-    ` : m;
+    ` : g;
   }
   /**
    * Returns the field error template with the `_errors` messages if the
    * `_invalid` state is `true`.
    */
   _renderError() {
-    if (!this._invalid) return m;
+    if (!this._invalid) return g;
     const t = this._errors.map((e) => ({ message: e }));
     return d`
       <rtg-field-error
@@ -21012,9 +21012,9 @@ let A = class extends v {
                 id="${this.inputId}"
                 part="${A.parts.input}"
                 name="${this.name}"
-                placeholder="${this.placeholder ?? m}"
-                minlength="${t ?? m}"
-                maxlength="${e ?? m}"
+                placeholder="${this.placeholder ?? g}"
+                minlength="${t ?? g}"
+                maxlength="${e ?? g}"
                 ?disabled="${this.disabled}"
                 ?invalid=${this._invalid}
                 ?required=${this.required}
@@ -21025,16 +21025,16 @@ let A = class extends v {
                 part="${A.parts.input}"
                 type="password"
                 name="${this.name}"
-                placeholder="${this.placeholder ?? m}"
-                minlength="${t ?? m}"
-                maxlength="${e ?? m}"
+                placeholder="${this.placeholder ?? g}"
+                minlength="${t ?? g}"
+                maxlength="${e ?? g}"
                 ?disabled="${this.disabled}"
                 ?invalid=${this._invalid}
                 ?required=${this.required}
               ></rtg-input>
             `}
         ${this._renderError()}
-        ${this.content === "split" && !this._invalid ? this._renderDescription() : m}
+        ${this.content === "split" && !this._invalid ? this._renderDescription() : g}
       </rtg-field>
     `;
   }
@@ -21125,7 +21125,7 @@ lt([
 A = lt([
   u("sb-password-field")
 ], A);
-var wm = Object.defineProperty, _m = Object.getOwnPropertyDescriptor, wt = (t, e, r, i) => {
+var wm = Object.defineProperty, _m = Object.getOwnPropertyDescriptor, _t = (t, e, r, i) => {
   for (var s = i > 1 ? void 0 : i ? _m(e, r) : e, o = t.length - 1, n; o >= 0; o--)
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && wm(e, r, s), s;
@@ -21312,7 +21312,7 @@ let z = class extends v {
    * mark will be prioritised and rendered instead of the asterisk.
    */
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${z.parts.mark}"
@@ -21347,7 +21347,7 @@ let z = class extends v {
       >
         ${this.description}
       </rtg-field-description>
-    ` : m;
+    ` : g;
   }
   /**
    * Returns the field error template with the `_error` message if the
@@ -21360,7 +21360,7 @@ let z = class extends v {
         part="${z.parts.error}"
         .errors="${[{ message: this._error }]}"
       ></rtg-field-error>
-    ` : m;
+    ` : g;
   }
   render() {
     return d`
@@ -21385,7 +21385,7 @@ let z = class extends v {
                 id="${this.inputId}"
                 part="${z.parts.input}"
                 name="${this.name}"
-                placeholder="${this.placeholder ?? m}"
+                placeholder="${this.placeholder ?? g}"
                 ?disabled="${this.disabled}"
                 ?invalid=${this._invalid}
                 ?required=${this.required}
@@ -21396,14 +21396,14 @@ let z = class extends v {
                 part="${z.parts.input}"
                 type="password"
                 name="${this.name}"
-                placeholder="${this.placeholder ?? m}"
+                placeholder="${this.placeholder ?? g}"
                 ?disabled="${this.disabled}"
                 ?invalid=${this._invalid}
                 ?required=${this.required}
               ></rtg-input>
             `}
         ${this._renderError()}
-        ${this.content === "split" && !this._invalid ? this._renderDescription() : m}
+        ${this.content === "split" && !this._invalid ? this._renderDescription() : g}
       </rtg-field>
     `;
   }
@@ -21416,64 +21416,64 @@ z._DESCRIPTION = "description";
 z._INPUT = "input";
 z._ERROR = "error";
 z.TAG = `sb-${z._ROOT}`;
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "seed", 2);
-wt([
+_t([
   a({ attribute: "child-id", type: String })
 ], z.prototype, "childId", 2);
-wt([
+_t([
   a({ attribute: "field-id", type: String })
 ], z.prototype, "fieldId", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "name", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "variant", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "content", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "pair", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "label", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "placeholder", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "description", 2);
-wt([
+_t([
   a({ type: String })
 ], z.prototype, "mark", 2);
-wt([
+_t([
   a({ type: Boolean })
 ], z.prototype, "caret", 2);
-wt([
+_t([
   a({ type: Boolean })
 ], z.prototype, "disabled", 2);
-wt([
+_t([
   a({ type: Boolean })
 ], z.prototype, "required", 2);
-wt([
+_t([
   a({ attribute: "required-error", type: String })
 ], z.prototype, "requiredError", 2);
-wt([
+_t([
   a({ attribute: "match-error", type: String })
 ], z.prototype, "matchError", 2);
-wt([
+_t([
   x()
 ], z.prototype, "_invalid", 2);
-wt([
+_t([
   x()
 ], z.prototype, "_error", 2);
-wt([
+_t([
   x()
 ], z.prototype, "_value", 2);
-z = wt([
+z = _t([
   u("sb-confirm-field")
 ], z);
 var xm = Object.defineProperty, $m = Object.getOwnPropertyDescriptor, Rt = (t, e, r, i) => {
@@ -21642,7 +21642,7 @@ let j = class extends v {
    * mark will be prioritised and rendered instead of the asterisk.
    */
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${j.parts.mark}"
@@ -21677,7 +21677,7 @@ let j = class extends v {
       >
         ${this.description}
       </rtg-field-description>
-    ` : m;
+    ` : g;
   }
   /**
    * Returns the field error template with the `_error` message if the
@@ -21690,7 +21690,7 @@ let j = class extends v {
         part="${j.parts.error}"
         .errors=${[{ message: this._error }]}
       ></rtg-field-error>
-    ` : m;
+    ` : g;
   }
   render() {
     return d`
@@ -21715,14 +21715,14 @@ let j = class extends v {
           part="${j.parts.input}"
           type="email"
           name="${this.name}"
-          placeholder="${this.placeholder ?? m}"
+          placeholder="${this.placeholder ?? g}"
           ?disabled="${this.disabled}"
           ?invalid=${this._invalid}
           ?required=${this.required}
         ></rtg-input>
 
         ${this._renderError()}
-        ${this.content === "split" && !this._invalid ? this._renderDescription() : m}
+        ${this.content === "split" && !this._invalid ? this._renderDescription() : g}
       </rtg-field>
     `;
   }
@@ -21965,7 +21965,7 @@ let U = class extends v {
    * mark will be prioritised and rendered instead of the asterisk.
    */
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${U.parts.mark}"
@@ -22000,7 +22000,7 @@ let U = class extends v {
       >
         ${this.description}
       </rtg-field-description>
-    ` : m;
+    ` : g;
   }
   /**
    * Returns the field error template with the `_error` message if the
@@ -22013,7 +22013,7 @@ let U = class extends v {
         part="${U.parts.error}"
         .errors=${[{ message: this._error }]}
       ></rtg-field-error>
-    ` : m;
+    ` : g;
   }
   render() {
     return d`
@@ -22038,15 +22038,15 @@ let U = class extends v {
           part="${U.parts.input}"
           type="${this._type}"
           name="${this.name}"
-          placeholder="${this.placeholder ?? m}"
+          placeholder="${this.placeholder ?? g}"
           ?disabled="${this.disabled}"
           ?invalid=${this._invalid}
-          autocomplete="${this.autocomplete ?? m}"
+          autocomplete="${this.autocomplete ?? g}"
           ?required=${this.required}
         ></rtg-input>
 
         ${this._renderError()}
-        ${this.content === "split" && !this._invalid ? this._renderDescription() : m}
+        ${this.content === "split" && !this._invalid ? this._renderDescription() : g}
       </rtg-field>
     `;
   }
@@ -22116,7 +22116,7 @@ Ct([
 U = Ct([
   u("sb-identifier-field")
 ], U);
-var Em = Object.defineProperty, km = Object.getOwnPropertyDescriptor, pt = (t, e, r, i) => {
+var Em = Object.defineProperty, km = Object.getOwnPropertyDescriptor, ut = (t, e, r, i) => {
   for (var s = i > 1 ? void 0 : i ? km(e, r) : e, o = t.length - 1, n; o >= 0; o--)
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && Em(e, r, s), s;
@@ -22154,7 +22154,7 @@ let G = class extends v {
   // MARK
   // -------------------------
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${G.parts.mark}"
@@ -22249,7 +22249,7 @@ let G = class extends v {
               <rtg-field-error part="${G.parts.error}">
                 ${this._firstError}
               </rtg-field-error>
-            ` : m}
+            ` : g}
       </rtg-field>
     `;
   }
@@ -22282,7 +22282,7 @@ let G = class extends v {
               <rtg-field-error part="${G.parts.error}">
                 ${this._lastError}
               </rtg-field-error>
-            ` : m}
+            ` : g}
       </rtg-field>
     `;
   }
@@ -22297,70 +22297,70 @@ let G = class extends v {
 G._ROOT = "name-field";
 G._FIRST = "first";
 G._LAST = "last";
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "firstLabel", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "lastLabel", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "seed", 2);
-pt([
+ut([
   a({ attribute: "child-id" })
 ], G.prototype, "childId", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "name", 2);
-pt([
+ut([
   a({ type: Boolean })
 ], G.prototype, "required", 2);
-pt([
+ut([
   a({ type: Boolean })
 ], G.prototype, "disabled", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "firstName", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "lastName", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "firstPlaceholder", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "lastPlaceholder", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "requiredError", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "formatError", 2);
-pt([
+ut([
   a({ type: String })
 ], G.prototype, "mark", 2);
-pt([
+ut([
   a({ type: Boolean })
 ], G.prototype, "caret", 2);
-pt([
+ut([
   x()
 ], G.prototype, "_first", 2);
-pt([
+ut([
   x()
 ], G.prototype, "_firstInvalid", 2);
-pt([
+ut([
   x()
 ], G.prototype, "_firstError", 2);
-pt([
+ut([
   x()
 ], G.prototype, "_last", 2);
-pt([
+ut([
   x()
 ], G.prototype, "_lastInvalid", 2);
-pt([
+ut([
   x()
 ], G.prototype, "_lastError", 2);
-G = pt([
+G = ut([
   u("sb-name-field")
 ], G);
 var Rm = Object.defineProperty, Om = Object.getOwnPropertyDescriptor, Ot = (t, e, r, i) => {
@@ -22528,7 +22528,7 @@ let D = class extends v {
    * mark will be prioritised and rendered instead of the asterisk.
    */
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${D.parts.mark}"
@@ -22563,7 +22563,7 @@ let D = class extends v {
       >
         ${this.description}
       </rtg-field-description>
-    ` : m;
+    ` : g;
   }
   /**
    * Returns the field error template with the `_error` message if the
@@ -22576,7 +22576,7 @@ let D = class extends v {
         part="${D.parts.error}"
         .errors=${[{ message: this._error }]}
       ></rtg-field-error>
-    ` : m;
+    ` : g;
   }
   render() {
     return d`
@@ -22601,14 +22601,14 @@ let D = class extends v {
           part="${D.parts.input}"
           type="tel"
           name="${this.name}"
-          placeholder="${this.placeholder ?? m}"
+          placeholder="${this.placeholder ?? g}"
           ?disabled="${this.disabled}"
           ?invalid=${this._invalid}
           ?required=${this.required}
         ></rtg-input>
 
         ${this._renderError()}
-        ${this.content === "split" && !this._invalid ? this._renderDescription() : m}
+        ${this.content === "split" && !this._invalid ? this._renderDescription() : g}
       </rtg-field>
     `;
   }
@@ -22676,7 +22676,7 @@ Ot([
 D = Ot([
   u("sb-phone-field")
 ], D);
-var Im = Object.defineProperty, Am = Object.getOwnPropertyDescriptor, ct = (t, e, r, i) => {
+var Im = Object.defineProperty, Am = Object.getOwnPropertyDescriptor, ht = (t, e, r, i) => {
   for (var s = i > 1 ? void 0 : i ? Am(e, r) : e, o = t.length - 1, n; o >= 0; o--)
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && Im(e, r, s), s;
@@ -22886,7 +22886,7 @@ let P = class extends v {
    * mark will be prioritised and rendered instead of the asterisk.
    */
   _renderMark() {
-    return !this.mark && (!this.caret || !this.required) ? m : d`
+    return !this.mark && (!this.caret || !this.required) ? g : d`
       <span
         id="${this.markId}"
         part="${P.parts.mark}"
@@ -22921,7 +22921,7 @@ let P = class extends v {
       >
         ${this.description}
       </rtg-field-description>
-    ` : m;
+    ` : g;
   }
   /**
    * Returns the field error template with the `_error` message if the
@@ -22934,7 +22934,7 @@ let P = class extends v {
         part="${P.parts.error}"
         .errors=${[{ message: this._error }]}
       ></rtg-field-error>
-    ` : m;
+    ` : g;
   }
   render() {
     const { minlength: t, maxlength: e } = this._lengths;
@@ -22960,17 +22960,17 @@ let P = class extends v {
           part="${P.parts.input}"
           type="text"
           name="${this.name}"
-          placeholder="${this.placeholder ?? m}"
+          placeholder="${this.placeholder ?? g}"
           pattern="${this._pattern.source}"
-          minlength="${t ?? m}"
-          maxlength="${e ?? m}"
+          minlength="${t ?? g}"
+          maxlength="${e ?? g}"
           ?disabled="${this.disabled}"
           ?invalid=${this._invalid}
           ?required=${this.required}
         ></rtg-input>
 
         ${this._renderError()}
-        ${this.content === "split" && !this._invalid ? this._renderDescription() : m}
+        ${this.content === "split" && !this._invalid ? this._renderDescription() : g}
       </rtg-field>
     `;
   }
@@ -22984,73 +22984,73 @@ P._INPUT = "input";
 P._ERROR = "error";
 P.TAG = `sb-${P._ROOT}`;
 P._PATTERN = /^[a-z0-9_]*$/;
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "seed", 2);
-ct([
+ht([
   a({ attribute: "child-id", type: String })
 ], P.prototype, "childId", 2);
-ct([
+ht([
   a({ attribute: "field-id", type: String })
 ], P.prototype, "fieldId", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "name", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "content", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "label", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "placeholder", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "description", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "mark", 2);
-ct([
+ht([
   a({ type: Boolean })
 ], P.prototype, "caret", 2);
-ct([
+ht([
   a({ type: Boolean })
 ], P.prototype, "disabled", 2);
-ct([
+ht([
   a({ type: Boolean })
 ], P.prototype, "required", 2);
-ct([
+ht([
   a({ type: Number })
 ], P.prototype, "minlength", 2);
-ct([
+ht([
   a({ type: Number })
 ], P.prototype, "maxlength", 2);
-ct([
+ht([
   a({ type: String })
 ], P.prototype, "pattern", 2);
-ct([
+ht([
   a({ attribute: "required-error", type: String })
 ], P.prototype, "requiredError", 2);
-ct([
+ht([
   a({ attribute: "minlength-error", type: String })
 ], P.prototype, "minlengthError", 2);
-ct([
+ht([
   a({ attribute: "maxlength-error", type: String })
 ], P.prototype, "maxlengthError", 2);
-ct([
+ht([
   a({ attribute: "format-error", type: String })
 ], P.prototype, "formatError", 2);
-ct([
+ht([
   x()
 ], P.prototype, "_invalid", 2);
-ct([
+ht([
   x()
 ], P.prototype, "_error", 2);
-ct([
+ht([
   x()
 ], P.prototype, "_value", 2);
-P = ct([
+P = ht([
   u("sb-username-field")
 ], P);
 var Tm = Object.defineProperty, Lm = Object.getOwnPropertyDescriptor, ve = (t, e, r, i) => {
@@ -23131,7 +23131,7 @@ let at = class extends v {
         part="${at.parts.spinner}"
         class="rtg-icon-inline-${this.spinnerAlign}"
       ></rtg-spinner>
-    ` : m;
+    ` : g;
   }
   render() {
     return d`
@@ -23145,9 +23145,9 @@ let at = class extends v {
         type="submit"
         ?disabled=${this.disabled || this.isLoading}
       >
-        ${this.spinnerAlign === "start" ? this._renderSpinner() : m}
+        ${this.spinnerAlign === "start" ? this._renderSpinner() : g}
         ${this.label}
-        ${this.spinnerAlign === "end" ? this._renderSpinner() : m}
+        ${this.spinnerAlign === "end" ? this._renderSpinner() : g}
       </rtg-button>
     `;
   }
@@ -23201,7 +23201,7 @@ var Nm = Object.defineProperty, zm = Object.getOwnPropertyDescriptor, cs = (t, e
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && Nm(e, r, s), s;
 };
-let vt = class extends v {
+let yt = class extends v {
   constructor() {
     super(...arguments), this.seed = Nt(), this._loading = !1, this._handleSubmitClick = (t) => {
       var e;
@@ -23229,10 +23229,10 @@ let vt = class extends v {
         await St.processLoginflowEvent({
           event: n,
           ...Object.keys(r).length ? { data: r } : {}
-        }), this._dispatch(vt.SUCCESS_EVENT, { id: this.rootId, data: r, event: n });
+        }), this._dispatch(yt.SUCCESS_EVENT, { id: this.rootId, data: r, event: n });
       } catch (p) {
         const b = p instanceof Error ? p.message : String(p);
-        this._dispatch(vt.ERROR_EVENT, {
+        this._dispatch(yt.ERROR_EVENT, {
           id: this.rootId,
           data: r,
           event: n,
@@ -23242,7 +23242,7 @@ let vt = class extends v {
         this._setLoading(!1, e, h), this._pendingEvent = void 0;
       }
     }, this._handleReset = (t) => {
-      this._pendingEvent = void 0, this.onReset && this.onReset(t), this._dispatch(vt.RESET_EVENT, { id: this.rootId });
+      this._pendingEvent = void 0, this.onReset && this.onReset(t), this._dispatch(yt.RESET_EVENT, { id: this.rootId });
     };
   }
   /**
@@ -23262,14 +23262,14 @@ let vt = class extends v {
    * derived from the component's part name and `seed`.
    */
   get rootId() {
-    return this.childId ?? `sb-${vt.parts.root}-${this.seed}`;
+    return this.childId ?? `sb-${yt.parts.root}-${this.seed}`;
   }
   /**
    * The native `<form>` element rendered as the root part.
    */
   get _form() {
     return this.querySelector(
-      `form[part="${vt.parts.root}"]`
+      `form[part="${yt.parts.root}"]`
     );
   }
   /**
@@ -23337,33 +23337,33 @@ let vt = class extends v {
     return d`
       <form
         id="${this.rootId}"
-        part="${vt.parts.root}"
+        part="${yt.parts.root}"
         @submit=${this._handleSubmit}
         @reset=${this._handleReset}
       ></form>
     `;
   }
 };
-vt._ROOT = "form";
-vt.TAG = `sb-${vt._ROOT}`;
-vt.SUCCESS_EVENT = `${vt.TAG}:success`;
-vt.ERROR_EVENT = `${vt.TAG}:error`;
-vt.RESET_EVENT = `${vt.TAG}:reset`;
+yt._ROOT = "form";
+yt.TAG = `sb-${yt._ROOT}`;
+yt.SUCCESS_EVENT = `${yt.TAG}:success`;
+yt.ERROR_EVENT = `${yt.TAG}:error`;
+yt.RESET_EVENT = `${yt.TAG}:reset`;
 cs([
   a({ type: String })
-], vt.prototype, "seed", 2);
+], yt.prototype, "seed", 2);
 cs([
   a({ attribute: "child-id", type: String })
-], vt.prototype, "childId", 2);
+], yt.prototype, "childId", 2);
 cs([
   a({ attribute: !1 })
-], vt.prototype, "onSubmit", 2);
+], yt.prototype, "onSubmit", 2);
 cs([
   a({ attribute: !1 })
-], vt.prototype, "onReset", 2);
-vt = cs([
+], yt.prototype, "onReset", 2);
+yt = cs([
   u("sb-form")
-], vt);
+], yt);
 var jm = Object.defineProperty, Dm = Object.getOwnPropertyDescriptor, Io = (t, e, r, i) => {
   for (var s = i > 1 ? void 0 : i ? Dm(e, r) : e, o = t.length - 1, n; o >= 0; o--)
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
@@ -23399,7 +23399,7 @@ let ir = class extends v {
         part="${ir.parts.root}"
         data-content="${this.content ? "true" : "false"}"
       >
-        ${this.content ?? m}
+        ${this.content ?? g}
       </rtg-field-separator>
     `;
   }
@@ -23501,7 +23501,7 @@ let Z = class extends v {
    * Returns the prompt paragraph template for `"default"` form switches.
    */
   _renderPrompt() {
-    return this.type === "button" || !this.prompt ? m : d`
+    return this.type === "button" || !this.prompt ? g : d`
       <p id="${this.promptId}" part="${Z.parts.prompt}">
         ${this.prompt}
       </p>
@@ -23517,7 +23517,7 @@ let Z = class extends v {
         part="${Z.parts.spinner}"
         class="rtg-icon-inline-end"
       ></rtg-spinner>
-    ` : m;
+    ` : g;
   }
   render() {
     const t = this.type === "button" ? this.variant : "link", e = this.type === "button" ? this.size : "default";
@@ -23528,8 +23528,8 @@ let Z = class extends v {
           id="${this.rootId}"
           part="${Z.parts.root}"
           data-type="${this.type}"
-          data-event="${this.event ?? m}"
-          data-loading="${this.isLoading ? "true" : m}"
+          data-event="${this.event ?? g}"
+          data-loading="${this.isLoading ? "true" : g}"
           variant="${t}"
           size="${e}"
           ?disabled="${this.disabled || this.isLoading}"
@@ -23587,10 +23587,23 @@ var Mm = Object.defineProperty, Bm = Object.getOwnPropertyDescriptor, ye = (t, e
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && Mm(e, r, s), s;
 };
-let $t = class extends v {
+let ct = class extends v {
   constructor() {
-    super(...arguments), this.seed = Nt(), this.variant = "secondary", this.size = "default", this.label = "Use Passkey", this.spinnerAlign = "start", this._loading = !1, this._handleClick = () => {
-      this.disabled || this.isLoading || (this._loading = !0, this._dispatchClick(), this._emitClickEvent());
+    super(...arguments), this.seed = Nt(), this.variant = "secondary", this.size = "default", this.label = "Use Passkey", this.spinnerAlign = "start", this._loading = !1, this._handleClick = async () => {
+      if (!(this.disabled || this.isLoading)) {
+        this._loading = !0, this.dispatchEvent(
+          new CustomEvent(ct.CLICK_EVENT, {
+            detail: { id: this.rootId, event: this.event },
+            bubbles: !0,
+            composed: !0
+          })
+        );
+        try {
+          this.event && await St.processLoginflowEvent({ event: this.event });
+        } finally {
+          this._loading = !1;
+        }
+      }
     };
   }
   /**
@@ -23600,12 +23613,6 @@ let $t = class extends v {
     const t = this._ROOT, e = `${t}-${this._SPINNER}`;
     return { root: t, spinner: e };
   }
-  /**
-   * The name of the custom event fired on click.
-   */
-  static get clickEventName() {
-    return `sb-${this._ROOT}:click`;
-  }
   /**
    * Overrides default behavior to render into light DOM.
    */
@@ -23617,14 +23624,13 @@ let $t = class extends v {
    * derived from the component's part name and `seed`.
    */
   get rootId() {
-    return this.childId ?? `sb-${$t.parts.root}-${this.seed}`;
+    return this.childId ?? `sb-${ct.parts.root}-${this.seed}`;
   }
   /**
-   * The `id` of the spinner element, derived from `rootId` with the spinner
-   * part name appended.
+   * The `id` of the spinner element, derived from `rootId` and the part name.
    */
   get spinnerId() {
-    return `${this.rootId}-${$t._SPINNER}`;
+    return `${this.rootId}-${ct._SPINNER}`;
   }
   /**
    * The loading state, derived from the private `_loading` and `loading` prop.
@@ -23644,30 +23650,6 @@ let $t = class extends v {
   disconnectedCallback() {
     super.disconnectedCallback(), this.removeEventListener("click", this._handleClick);
   }
-  /**
-   * Defines and dispatches the click event.
-   */
-  _dispatchClick() {
-    const t = new CustomEvent($t.clickEventName, {
-      detail: { id: this.rootId, event: this.event },
-      bubbles: !0,
-      composed: !0
-    });
-    this.dispatchEvent(t);
-  }
-  /**
-   * Emits the provided `event` to the auth service to process.
-   */
-  async _emitClickEvent() {
-    if (this.event) {
-      this._loading || (this._loading = !0);
-      try {
-        await St.processLoginflowEvent({ event: this.event });
-      } finally {
-        this._loading = !1;
-      }
-    }
-  }
   /**
    * Returns the loading spinner template.
    */
@@ -23675,65 +23657,66 @@ let $t = class extends v {
     return this.isLoading ? d`
       <rtg-spinner
         id="${this.spinnerId}"
-        part="${$t.parts.spinner}"
+        part="${ct.parts.spinner}"
         class="rtg-icon-inline-${this.spinnerAlign}"
       ></rtg-spinner>
-    ` : m;
+    ` : g;
   }
   render() {
     return d`
       <rtg-button
         id="${this.rootId}"
-        part="${$t.parts.root}"
-        data-event="${this.event}"
-        ?data-disabled=${this.disabled || this.isLoading}
-        ?data-loading=${this.isLoading}
+        part="${ct.parts.root}"
+        data-event="${this.event ?? g}"
+        data-loading="${this.isLoading ? "true" : g}"
         variant="${this.variant}"
         size="${this.size}"
         ?disabled=${this.disabled || this.isLoading}
       >
-        ${this.spinnerAlign === "start" ? this._renderSpinner() : m}
+        ${this.spinnerAlign === "start" ? this._renderSpinner() : g}
         ${this.label}
-        ${this.spinnerAlign === "end" ? this._renderSpinner() : m}
+        ${this.spinnerAlign === "end" ? this._renderSpinner() : g}
       </rtg-button>
     `;
   }
 };
-$t._ROOT = "passkey-button";
-$t._SPINNER = "spinner";
+ct._ROOT = "passkey-button";
+ct._SPINNER = "spinner";
+ct.TAG = `sb-${ct._ROOT}`;
+ct.CLICK_EVENT = `${ct.TAG}:click`;
 ye([
   a({ type: String })
-], $t.prototype, "seed", 2);
+], ct.prototype, "seed", 2);
 ye([
   a({ attribute: "child-id", type: String })
-], $t.prototype, "childId", 2);
+], ct.prototype, "childId", 2);
 ye([
   a({ type: String })
-], $t.prototype, "variant", 2);
+], ct.prototype, "variant", 2);
 ye([
   a({ type: String })
-], $t.prototype, "size", 2);
+], ct.prototype, "size", 2);
 ye([
   a({ type: String })
-], $t.prototype, "label", 2);
+], ct.prototype, "label", 2);
 ye([
   a({ attribute: "spinner-align", type: String })
-], $t.prototype, "spinnerAlign", 2);
+], ct.prototype, "spinnerAlign", 2);
 ye([
   a({ type: Boolean })
-], $t.prototype, "disabled", 2);
+], ct.prototype, "disabled", 2);
 ye([
   a({ type: Boolean })
-], $t.prototype, "loading", 2);
+], ct.prototype, "loading", 2);
 ye([
   a({ type: String })
-], $t.prototype, "event", 2);
+], ct.prototype, "event", 2);
 ye([
   x()
-], $t.prototype, "_loading", 2);
-$t = ye([
+], ct.prototype, "_loading", 2);
+ct = ye([
   u("sb-passkey-button")
-], $t);
+], ct);
 const qm = {
   apple: "Apple",
   discord: "Discord",
@@ -23884,7 +23867,7 @@ let dt = class extends v {
    * `content` prop requires the icon part.
    */
   _renderIcon() {
-    return this.isLoading ? this._renderSpinner() : this.content.includes("icon") ? this._renderLogo() : m;
+    return this.isLoading ? this._renderSpinner() : this.content.includes("icon") ? this._renderLogo() : g;
   }
   render() {
     const t = qm[this.provider], e = this.label ?? `${this.prompt} ${t}`;
@@ -23901,9 +23884,9 @@ let dt = class extends v {
         size="${this.size}"
         ?disabled=${this.disabled || this.isLoading}
       >
-        ${this.iconAlign === "start" ? this._renderIcon() : m}
-        ${this.content.includes("label") ? e : m}
-        ${this.iconAlign === "end" ? this._renderIcon() : m}
+        ${this.iconAlign === "start" ? this._renderIcon() : g}
+        ${this.content.includes("label") ? e : g}
+        ${this.iconAlign === "end" ? this._renderIcon() : g}
       </rtg-button>
     `;
   }
@@ -23957,7 +23940,7 @@ var Km = Object.defineProperty, Wm = Object.getOwnPropertyDescriptor, Wt = (t, e
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
   return i && s && Km(e, r, s), s;
 };
-let yt = class extends v {
+let wt = class extends v {
   constructor() {
     super(...arguments), this.seed = Nt(), this.providers = [], this.overrides = [];
   }
@@ -23979,14 +23962,14 @@ let yt = class extends v {
    * derived from the component's part name and `seed`.
    */
   get rootId() {
-    return this.childId ?? `sb-${yt.parts.root}-${this.seed}`;
+    return this.childId ?? `sb-${wt.parts.root}-${this.seed}`;
   }
   /**
    * The `id` of the provider button element, derived from `rootId` with the
    * button part name appended.
    */
   get buttonId() {
-    return `${this.rootId}-${yt._BUTTON}`;
+    return `${this.rootId}-${wt._BUTTON}`;
   }
   /**
    * The number of columns within the field, given to the root element via its
@@ -24022,19 +24005,19 @@ let yt = class extends v {
     return d`
       <sb-provider-button
         id="${this.buttonId}"
-        part="${yt.parts.button}"
+        part="${wt.parts.button}"
         seed="${t.seed ?? this.seed}"
-        child-id="${t.childId ?? m}"
+        child-id="${t.childId ?? g}"
         provider="${t.provider}"
-        content="${t.content ?? this.content ?? (this._providers.length > 2 ? "icon" : m)}"
-        variant="${t.variant ?? this.variant ?? m}"
-        size="${t.size ?? this.size ?? m}"
-        prompt="${t.prompt ?? this.prompt ?? m}"
-        icon-align="${t.iconAlign ?? this.iconAlign ?? m}"
-        label="${t.label ?? this.label ?? m}"
+        content="${t.content ?? this.content ?? (this._providers.length > 2 ? "icon" : g)}"
+        variant="${t.variant ?? this.variant ?? g}"
+        size="${t.size ?? this.size ?? g}"
+        prompt="${t.prompt ?? this.prompt ?? g}"
+        icon-align="${t.iconAlign ?? this.iconAlign ?? g}"
+        label="${t.label ?? this.label ?? g}"
         ?disabled="${t.disabled || this.disabled}"
         ?loading="${t.loading || this.loading}"
-        event="${t.event ?? this.event ?? m}"
+        event="${t.event ?? this.event ?? g}"
       ></sb-provider-button>
     `;
   }
@@ -24043,7 +24026,7 @@ let yt = class extends v {
     return d`
       <rtg-field
         id="${this.rootId}"
-        part="${yt.parts.root}"
+        part="${wt.parts.root}"
         data-columns="${this.columns}"
       >
         ${this._providers.map(
@@ -24055,50 +24038,50 @@ let yt = class extends v {
     `;
   }
 };
-yt._ROOT = "provider-field";
-yt._BUTTON = "button";
+wt._ROOT = "provider-field";
+wt._BUTTON = "button";
 Wt([
   a({ type: String })
-], yt.prototype, "seed", 2);
+], wt.prototype, "seed", 2);
 Wt([
   a({ attribute: "child-id", type: String })
-], yt.prototype, "childId", 2);
+], wt.prototype, "childId", 2);
 Wt([
   a({ type: Array })
-], yt.prototype, "providers", 2);
+], wt.prototype, "providers", 2);
 Wt([
   a({ type: String })
-], yt.prototype, "content", 2);
+], wt.prototype, "content", 2);
 Wt([
   a({ type: String })
-], yt.prototype, "variant", 2);
+], wt.prototype, "variant", 2);
 Wt([
   a({ type: String })
-], yt.prototype, "size", 2);
+], wt.prototype, "size", 2);
 Wt([
   a({ type: String })
-], yt.prototype, "prompt", 2);
+], wt.prototype, "prompt", 2);
 Wt([
   a({ attribute: "icon-align", type: String })
-], yt.prototype, "iconAlign", 2);
+], wt.prototype, "iconAlign", 2);
 Wt([
   a({ type: String })
-], yt.prototype, "label", 2);
+], wt.prototype, "label", 2);
 Wt([
   a({ type: Boolean })
-], yt.prototype, "disabled", 2);
+], wt.prototype, "disabled", 2);
 Wt([
   a({ type: Boolean })
-], yt.prototype, "loading", 2);
+], wt.prototype, "loading", 2);
 Wt([
   a({ type: String })
-], yt.prototype, "event", 2);
+], wt.prototype, "event", 2);
 Wt([
   a({ type: Array })
-], yt.prototype, "overrides", 2);
-yt = Wt([
+], wt.prototype, "overrides", 2);
+wt = Wt([
   u("sb-provider-field")
-], yt);
+], wt);
 var Ym = Object.defineProperty, Xm = Object.getOwnPropertyDescriptor, Ao = (t, e, r, i) => {
   for (var s = i > 1 ? void 0 : i ? Xm(e, r) : e, o = t.length - 1, n; o >= 0; o--)
     (n = t[o]) && (s = (i ? n(e, r, s) : n(s)) || s);
@@ -24307,10 +24290,10 @@ let be = class extends De {
     return io`
       <rtg-input-otp
         part=${this.id ? this.id : "otp"}
-        id=${this.dataKey ?? this.id ?? m}
-        name=${this.dataKey ?? this.id ?? m}
+        id=${this.dataKey ?? this.id ?? g}
+        name=${this.dataKey ?? this.id ?? g}
         maxlength=${this.length}
-        pattern=${t === "digits_only" ? "\\d+" : m}
+        pattern=${t === "digits_only" ? "\\d+" : g}
         data-key=${this.dataKey || ""}
         .onComplete=${this.handleComplete}
         .onFocus=${this.handleFocus}
@@ -24327,7 +24310,7 @@ let be = class extends De {
                 ${this.resendButtonText}
               </rtg-button>
             </div>
-          ` : m}
+          ` : g}
     `;
   }
 };
@@ -24560,8 +24543,8 @@ let qt = class extends v {
         data-badge="${this.badge}"
         variant="${this.badge}"
       >
-        ${this.logoAlign === "start" ? this._renderLogo() : m}
-        ${this.label} ${this.logoAlign === "end" ? this._renderLogo() : m}
+        ${this.logoAlign === "start" ? this._renderLogo() : g}
+        ${this.label} ${this.logoAlign === "end" ? this._renderLogo() : g}
       </rtg-badge>
     `;
   }
@@ -25295,7 +25278,7 @@ let sr = class extends v {
     `;
   }
   render() {
-    var y, w, E, C, S, k, T, I, N, J, Y, nt, ut, jt;
+    var y, w, E, C, S, k, T, I, N, J, Y, nt, gt, jt;
     const t = [
       { label: "Username", value: this.personal.username },
       { label: "First name", value: this.personal.first },
@@ -25334,7 +25317,7 @@ let sr = class extends v {
             ${(Y = this.content) != null && Y.icon ? (nt = this.content) == null ? void 0 : nt.icon : gb()}
 
             <span>
-              ${(ut = this.content) != null && ut.title ? (jt = this.content) == null ? void 0 : jt.title : "Personal Info"}
+              ${(gt = this.content) != null && gt.title ? (jt = this.content) == null ? void 0 : jt.title : "Personal Info"}
             </span>
           </rtg-card-title>
           ${this.isEditing ? null : d`
@@ -25569,15 +25552,15 @@ let or = class extends v {
         <rtg-card-content>
           <div class="sb-flex sb-flex-col sb-gap-3 sb-m-4">
             ${t.map(
-      (ut) => d`
+      (gt) => d`
                 <div
                   class="sb-flex ${this.layout === Gt.ROW ? "sb-flex-row sb-items-center sb-gap-2" : "sb-flex-col sb-gap-1"}"
                 >
                   <div class=${p.class} style=${R(p.style)}>
-                    ${ut.label}
+                    ${gt.label}
                   </div>
                   <div class="sb-flex-1 sb-min-w-0 sb-mr-4">
-                    ${this.renderInput(ut.value)}
+                    ${this.renderInput(gt.value)}
                   </div>
                 </div>
               `
@@ -25781,15 +25764,15 @@ let nr = class extends v {
         <rtg-card-content>
           <div class="sb-flex sb-flex-col sb-gap-3 sb-p-4">
             ${t.map(
-      (ut) => d`
+      (gt) => d`
                 <div
                   class="sb-flex ${this.layout === Gt.ROW ? "sb-flex-row sb-items-center" : "sb-flex-col sb-gap-1"}"
                 >
                   <div class=${p.class} style=${R(p.style)}>
-                    ${ut.label}
+                    ${gt.label}
                   </div>
                   <div class="sb-flex-1 sb-min-w-0 sb-mr-4">
-                    ${this.renderInput(ut.value)}
+                    ${this.renderInput(gt.value)}
                   </div>
                 </div>
               `
@@ -26197,10 +26180,10 @@ class we extends v {
       >
         ${fb()}
       </button>
-    ` : m;
+    ` : g;
   }
   renderWatermark() {
-    return this.orientation !== pe.VERTICAL ? m : d`
+    return this.orientation !== pe.VERTICAL ? g : d`
       <div
         class="sb-fixed sb-bottom-0 sb-w-[-webkit-fill-available] sb-py-4 sb-bg-background"
       >
@@ -26276,7 +26259,7 @@ class we extends v {
         <div class=${Eu}>
           <div class=${ku}>${this.renderProfileContent()}</div>
         </div>
-      ` : this.renderProfileContent() : m;
+      ` : this.renderProfileContent() : g;
   }
   // Use shadow DOM? No — matches original behavior
   createRenderRoot() {
@@ -26642,7 +26625,7 @@ let je = class extends v {
                   customClass=${t}
                   .customStyle=${e}
                 ></linear-loader>
-              ` : m}
+              ` : g}
           ${this._wrapSubmitButtons(
       hh(this, this.renderSpec.root_container, this.theme)
     )}
@@ -26934,7 +26917,7 @@ let ra = class extends v {
   render() {
     return this.auth ? d`
       <div ?hidden=${this.auth.isAuthenticated}>${this._cachedChildren}</div>
-    ` : m;
+    ` : g;
   }
 };
 mh([
@@ -26962,7 +26945,7 @@ let ia = class extends v {
   render() {
     return this.auth ? d`
       <div ?hidden=${!this.auth.isAuthenticated}>${this._cachedChildren}</div>
-    ` : m;
+    ` : g;
   }
 };
 bh([
@@ -26989,7 +26972,7 @@ let as = class extends v {
   }
   render() {
     var t;
-    return this.auth ? this.auth.isAuthenticated ? d`${this._cachedChildren}` : (window.location.href = this.redirectUrl || ((t = this.env) == null ? void 0 : t.signinUrl), m) : m;
+    return this.auth ? this.auth.isAuthenticated ? d`${this._cachedChildren}` : (window.location.href = this.redirectUrl || ((t = this.env) == null ? void 0 : t.signinUrl), g) : g;
   }
 };
 Ko([
@@ -27026,9 +27009,9 @@ export {
   Ji as SbCountdownRenderer,
   so as SbDividerRenderer,
   j as SbEmailField,
-  xt as SbError,
+  $t as SbError,
   lo as SbErrorRenderer,
-  vt as SbForm,
+  yt as SbForm,
   ir as SbFormSeparator,
   at as SbFormSubmit,
   Z as SbFormSwitch,
@@ -27047,13 +27030,13 @@ export {
   G as SbNameField,
   be as SbOtp,
   ao as SbOtpRenderer,
-  $t as SbPasskeyButton,
+  ct as SbPasskeyButton,
   A as SbPasswordField,
   sr as SbPersonalInfo,
   D as SbPhoneField,
   lr as SbProvider,
   dt as SbProviderButton,
-  yt as SbProviderField,
+  wt as SbProviderField,
   os as SbSignIn,
   ns as SbSignUp,
   Kr as SbSpinner,