@fiction/sdk 1.0.87 → 1.0.88

package/dist/{SelfWrap.vue_vue_type_script_setup_true_lang-DcjZRnSG.js → SelfWrap.vue_vue_type_script_setup_true_lang-Dy16trSb.js}

@@ -1,8 +1,8 @@
 var dt = Object.defineProperty;
-var Kt = (e, a, t) => a in e ? dt(e, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[a] = t;
-var r = (e, a) => dt(e, "name", { value: a, configurable: !0 });
-var B = (e, a, t) => Kt(e, typeof a != "symbol" ? a + "" : a, t);
-import { defineComponent as O, createElementBlock as b, openBlock as f, createElementVNode as c, normalizeClass as E, ref as N, watch as ae, createBlock as ne, TransitionGroup as Ct, withCtx as ee, renderSlot as $e, computed as L, createCommentVNode as P, onMounted as Ee, Fragment as ke, renderList as Be, withDirectives as St, vModelText as Mt, toDisplayString as U, createVNode as G, withKeys as _t, createTextVNode as ze, unref as K, resolveDynamicComponent as Zt, nextTick as We, Transition as ut, withModifiers as At, normalizeStyle as tt, onUnmounted as It, createPropsRestProxy as Yt, mergeProps as Jt, shallowRef as Qt } from "vue";
+var Kt = (e, n, t) => n in e ? dt(e, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[n] = t;
+var r = (e, n) => dt(e, "name", { value: n, configurable: !0 });
+var F = (e, n, t) => Kt(e, typeof n != "symbol" ? n + "" : n, t);
+import { defineComponent as H, createElementBlock as b, openBlock as f, createElementVNode as c, normalizeClass as E, ref as R, watch as de, createBlock as ce, TransitionGroup as Ct, withCtx as re, renderSlot as $e, computed as z, createCommentVNode as L, onMounted as Ee, Fragment as ke, renderList as Be, withDirectives as St, vModelText as Mt, toDisplayString as q, createVNode as O, withKeys as Zt, createTextVNode as ze, unref as Y, resolveDynamicComponent as _t, nextTick as We, Transition as ut, withModifiers as At, normalizeStyle as tt, onUnmounted as It, createPropsRestProxy as Yt, mergeProps as Jt, shallowRef as Qt } from "vue";
 import { S as Ie } from "./socialPlatforms-CuH51wxS.js";
 import { Conversation as ht } from "@elevenlabs/client";
 import { objectId as Xt } from "@fiction/utils";
@@ -10,14 +10,14 @@ import { S as $t, c as eo, F as to } from "./sdkClient-DcYRzx1G.js";
 const oo = { class: "spinner max-w-sm" }, ro = {
   class: "ring-circular h-full w-full origin-center",
   viewBox: "25 25 50 50"
-}, ot = /* @__PURE__ */ O({
+}, ot = /* @__PURE__ */ H({
   __name: "FSpinner",
   props: {
     width: { type: String, default: "" },
     colorMode: { type: String, default: "primary" }
   },
   setup(e) {
-    return (a, t) => (f(), b("div", oo, [
+    return (n, t) => (f(), b("div", oo, [
       (f(), b("svg", ro, [
         c("circle", {
           class: E([e.colorMode, "ring-path"]),
@@ -189,7 +189,7 @@ const zt = [
     label: "About",
     icon: "i-tabler-user-circle"
   }
-], no = 256, ao = 0.8, io = 50, Os = {
+], no = 256, ao = 0.8, io = 50, Hs = {
   bars: 64,
   barWidth: 3,
   barSpacing: 1,
@@ -202,7 +202,7 @@ const zt = [
   // ms to hold peaks
   PEAK_DECAY_STIFFNESS: 0.12,
   PEAK_DECAY_DAMPING: 0.15
-}, Hs = [
+}, Us = [
   // Low fundamentals
   85,
   100,
@@ -279,21 +279,21 @@ const zt = [
 ], at = class at extends $t {
   constructor(t) {
     super("ClientAudio", t);
-    B(this, "audioContext");
-    B(this, "analyser");
-    B(this, "microphone");
-    B(this, "audioLevelInterval");
-    B(this, "stream");
-    B(this, "visibilityChangeHandler");
-    B(this, "vadTimeout");
-    B(this, "lastSpeechTime", 0);
+    F(this, "audioContext");
+    F(this, "analyser");
+    F(this, "microphone");
+    F(this, "audioLevelInterval");
+    F(this, "stream");
+    F(this, "visibilityChangeHandler");
+    F(this, "vadTimeout");
+    F(this, "lastSpeechTime", 0);
     // VAD configuration - tuned for voice isolation (ignores background music)
-    B(this, "VAD_SILENCE_THRESHOLD", 0.03);
+    F(this, "VAD_SILENCE_THRESHOLD", 0.03);
     // 3% audio level = silence (filters out quiet background noise)
-    B(this, "VAD_SILENCE_DURATION", 1200);
+    F(this, "VAD_SILENCE_DURATION", 1200);
     // 1.2 seconds of silence before considering "stopped speaking"
     // Public reactive state
-    B(this, "audioLevels", N({ inputLevel: 0, outputLevel: 0 }));
+    F(this, "audioLevels", R({ inputLevel: 0, outputLevel: 0 }));
     this.setupVisibilityHandler();
   }
   /**
@@ -330,14 +330,14 @@ const zt = [
         noiseSuppression: o = !0,
         echoCancellation: s = !0,
         autoGainControl: i = !0,
-        voiceIsolation: n = !0
+        voiceIsolation: a = !0
       } = t, l = {
         audio: {
           noiseSuppression: { ideal: o, exact: o },
           echoCancellation: { ideal: s, exact: s },
           autoGainControl: { ideal: i, exact: i },
           // Chrome-specific voice isolation (degrades gracefully in other browsers)
-          voiceIsolation: { ideal: n, exact: n },
+          voiceIsolation: { ideal: a, exact: a },
           advanced: [
             // Prioritize speech frequencies (300-3400 Hz) - Chrome-specific goog* properties
             // @ts-expect-error - Chrome-specific constraint
@@ -437,12 +437,12 @@ const zt = [
       } catch (l) {
         this.logger.error("Error in audio level monitoring:", l), this.stopAudioLevelMonitoring();
       }
-    }, "updateLevels"), n = /* @__PURE__ */ r(() => {
+    }, "updateLevels"), a = /* @__PURE__ */ r(() => {
       i().catch((l) => {
         this.logger.error("Async error in audio level monitoring:", l);
       });
     }, "intervalWrapper");
-    this.audioLevelInterval = window.setInterval(n, io);
+    this.audioLevelInterval = window.setInterval(a, io);
   }
   /**
    * Stop monitoring audio levels
@@ -490,7 +490,7 @@ const zt = [
   }
 };
 r(at, "ClientAudio");
-let Ze = at;
+let _e = at;
 function gt(e) {
   return e ? typeof e == "string" ? e : e.src || "" : "";
 }
@@ -504,63 +504,68 @@ function qe() {
 }
 r(qe, "getFallbackAvatarDataUrl");
 function Ue(e) {
-  const a = e.target;
-  a.dataset.fallbackUsed || (a.dataset.fallbackUsed = "true", a.src = qe());
+  const n = e.target;
+  n.dataset.fallbackUsed || (n.dataset.fallbackUsed = "true", n.src = qe());
 }
 r(Ue, "handleImageError");
 function lo(e) {
-  const { message: a, source: t } = e;
-  if (!a)
+  const { message: n, source: t } = e;
+  if (!n)
     return null;
   const o = {
     user: "user",
     ai: "agent",
     agent: "agent"
   }, s = o[t] || "agent";
-  if (typeof a == "string")
-    return a.trim() ? { text: a.trim(), sender: s } : null;
-  if (typeof a != "object")
+  if (typeof n == "string")
+    return n.trim() ? { text: n.trim(), sender: s } : null;
+  if (typeof n != "object")
     return null;
   const i = [
-    (n) => {
-      if (!("source" in n))
+    (a) => {
+      if (!("source" in a))
         return null;
-      const l = o[n.source];
-      return l ? { text: n.message || "", sender: l } : null;
+      const l = o[a.source];
+      return l ? { text: a.message || "", sender: l } : null;
     }
   ];
-  for (const n of i) {
-    const l = n(a);
+  for (const a of i) {
+    const l = a(n);
     if (l && l.text.trim())
       return { text: l.text.trim(), sender: l.sender };
   }
   return null;
 }
 r(lo, "parseVoiceMessage");
-function Us(e) {
-  const { name: a, context: t } = e;
-  return t === "welcome" ? `Welcome to Fiction! I'm ${a}, your digital self. I'm here to help you understand how I can represent you and assist with your daily tasks. What would you like to know about how I work?` : t === "onboarding" ? `Hi! I'm ${a}, your newly created digital self. I can handle conversations, answer questions about your expertise, and represent you professionally. Ready to see what I can do?` : `Hello! I'm ${a}. How can I help you today?`;
+function qs(e) {
+  const { name: n, context: t } = e;
+  return t === "welcome" ? `Welcome to Fiction! I'm ${n}, your digital self. I'm here to help you understand how I can represent you and assist with your daily tasks. What would you like to know about how I work?` : t === "onboarding" ? `Hi! I'm ${n}, your newly created digital self. I can handle conversations, answer questions about your expertise, and represent you professionally. Ready to see what I can do?` : `Hello! I'm ${n}. How can I help you today?`;
 }
-r(Us, "generateFirstMessage");
+r(qs, "generateFirstMessage");
+function co(e) {
+  const { template: n, self: t } = e;
+  return n.replace(/{name}/g, t.name || "Digital Self").replace(/{title}/g, t.title || "").replace(/{handle}/g, t.handle || "").replace(/{orgName}/g, t.org?.name || "");
+}
+r(co, "parseButtonTemplate");
 const it = class it extends $t {
   constructor(t) {
     super("SelfController", t);
-    B(this, "conversation");
-    B(this, "isTextMode", !1);
-    B(this, "lastMessage", { hash: "", time: 0 });
-    B(this, "clientAudio");
-    B(this, "unwatchAudio");
-    B(this, "isConnecting", !1);
+    F(this, "conversation");
+    F(this, "isTextMode", !1);
+    F(this, "lastMessage", { hash: "", time: 0 });
+    F(this, "clientAudio");
+    F(this, "unwatchAudio");
+    F(this, "isConnecting", !1);
     // Simple usage tracking
-    B(this, "sessionId");
-    B(this, "conversationStartTime");
-    B(this, "chatCharacterCount", 0);
+    F(this, "sessionId");
+    F(this, "conversationStartTime");
+    F(this, "chatCharacterCount", 0);
     // Participant IDs for message attribution
-    B(this, "hostParticipantId");
+    F(this, "hostParticipantId");
     // The digital self
-    B(this, "visitorParticipantId");
+    F(this, "visitorParticipantId");
     // The user/anon
-    B(this, "voiceState", N({
+    F(this, "voiceState", R({
       isActive: !1,
       isConnected: !1,
       isSpeaking: !1,
@@ -569,17 +574,17 @@ const it = class it extends $t {
       transcript: "Tap to begin voice conversation",
       connectionStatus: "disconnected"
     }));
-    B(this, "textState", N({
+    F(this, "textState", R({
       isActive: !1,
       isConnected: !1,
       isThinking: !1,
       connectionStatus: "disconnected"
     }));
-    B(this, "agentMode", N("self"));
-    B(this, "sharedMessages", N([]));
+    F(this, "agentMode", R("self"));
+    F(this, "sharedMessages", R([]));
     if (!t.self.elevenlabsAgentId || t.self.elevenlabsAgentId.trim() === "")
       throw new Error(`Agent ID is required for SelfController. Self "${t.self.name}" (${t.self.selfId}) does not have a valid elevenlabsAgentId.`);
-    this.clientAudio = new Ze(t), this.setupModeWatcher();
+    this.clientAudio = new _e(t), this.setupModeWatcher();
   }
   get audioLevels() {
     return this.clientAudio.audioLevels;
@@ -625,8 +630,8 @@ const it = class it extends $t {
     return null;
   }
   isDuplicateMessage(t, o) {
-    const s = `${o}:${t.toLowerCase().trim()}`, i = Date.now(), n = s === this.lastMessage.hash && i - this.lastMessage.time < 500;
-    return n || (this.lastMessage = { hash: s, time: i }), n;
+    const s = `${o}:${t.toLowerCase().trim()}`, i = Date.now(), a = s === this.lastMessage.hash && i - this.lastMessage.time < 500;
+    return a || (this.lastMessage = { hash: s, time: i }), a;
   }
   addMessage(t, o) {
     this.isDuplicateMessage(t, o) || (this.sharedMessages.value = [
@@ -635,7 +640,7 @@ const it = class it extends $t {
     ]);
   }
   getDynamicSettings() {
-    const { sdk: t } = this.settings, o = t.activeUser.value, s = o?.selves?.find((n) => n.selfId === o.primarySelfId), i = o ? `
+    const { sdk: t } = this.settings, o = t.activeUser.value, s = o?.selves?.find((a) => a.selfId === o.primarySelfId), i = o ? `
 
 Current User:
 - Name: ${s?.name || "Anonymous"}
@@ -675,15 +680,15 @@ Current User:
     }), this.clientAudio.resetAudioLevels());
   }
   setupModeWatcher() {
-    ae(this.agentMode, async (t, o) => {
+    de(this.agentMode, async (t, o) => {
       this.logger.info(`Mode changed from ${o} to ${t}`), this.conversation && (o === "talk" || o === "chat") && await this.endConversation();
     });
   }
   handleMessage(t, o) {
     const s = lo(t);
     if (s && (o && s.sender === "user" && this.logger.info("User transcription received", { text: s.text }), this.addMessage(s.text, s.sender), !o && s.sender === "agent" && this.updateState(this.textState, { isThinking: !1 }), this.sessionId && this.hostParticipantId && this.visitorParticipantId)) {
-      const i = s.sender === "agent" ? this.hostParticipantId : this.visitorParticipantId, { sdk: n } = this.settings;
-      n.saveMessage({
+      const i = s.sender === "agent" ? this.hostParticipantId : this.visitorParticipantId, { sdk: a } = this.settings;
+      a.saveMessage({
         conversationId: this.sessionId,
         participantId: i,
         content: s.text,
@@ -737,7 +742,7 @@ Current User:
             () => {
               this.logger.info("Client-side VAD: User has stopped speaking"), this.conversation && (this.conversation.sendUserActivity(), this.logger.info("Sent user activity signal to ElevenLabs"));
             }
-          ), this.unwatchAudio = ae(this.audioLevels, (i) => {
+          ), this.unwatchAudio = de(this.audioLevels, (i) => {
             t.onAudioLevel?.(i);
           }, { immediate: !0 }), this.updateState(this.voiceState, {
             isConnected: !0,
@@ -754,20 +759,20 @@ Current User:
           this.logger.info("Voice conversation disconnected"), this.conversation = void 0, this.clientAudio.stopAudioLevelMonitoring(), this.endSession().catch((i) => console.error("Failed to end session:", i)), this.resetState(!1), t.onDisconnect?.();
         }, "onDisconnect"),
         onError: /* @__PURE__ */ r((i) => {
-          let n = i;
-          i.includes("does not exist") ? n = `Agent not found: ${this.settings.self.elevenlabsAgentId}. Check ElevenLabs configuration.` : i.includes("limit") || i.includes("quota") ? n = "ElevenLabs account limit reached. Check your subscription and usage." : (i.includes("unauthorized") || i.includes("invalid")) && (n = "ElevenLabs API authentication failed. Check ELEVENLABS_API_KEY."), this.endSession().catch((l) => console.error("Failed to end session:", l)), this.handleError(new Error(n), !0), t.onError?.(new Error(n));
+          let a = i;
+          i.includes("does not exist") ? a = `Agent not found: ${this.settings.self.elevenlabsAgentId}. Check ElevenLabs configuration.` : i.includes("limit") || i.includes("quota") ? a = "ElevenLabs account limit reached. Check your subscription and usage." : (i.includes("unauthorized") || i.includes("invalid")) && (a = "ElevenLabs API authentication failed. Check ELEVENLABS_API_KEY."), this.endSession().catch((l) => console.error("Failed to end session:", l)), this.handleError(new Error(a), !0), t.onError?.(new Error(a));
         }, "onError"),
         onModeChange: /* @__PURE__ */ r((i) => {
-          const n = i.mode === "speaking", l = !n, d = n ? "Speaking..." : "Listening...";
+          const a = i.mode === "speaking", l = !a, d = a ? "Speaking..." : "Listening...";
           this.updateState(this.voiceState, {
-            isSpeaking: n,
+            isSpeaking: a,
             isListening: l,
             isProcessing: !1,
             // Removed - ElevenLabs doesn't provide accurate processing state
             transcript: d
           }), this.logger.info("Voice mode changed", {
             mode: i.mode,
-            isSpeaking: n,
+            isSpeaking: a,
             isListening: l
           }), t.onModeChange?.(i.mode);
         }, "onModeChange"),
@@ -776,7 +781,7 @@ Current User:
         }, "onMessage")
       });
     } catch (i) {
-      throw this.isConnecting = !1, this.endSession().catch((n) => console.error("Failed to end session:", n)), this.handleError(i, !0), i;
+      throw this.isConnecting = !1, this.endSession().catch((a) => console.error("Failed to end session:", a)), this.handleError(i, !0), i;
     }
   }
   async startTextConversation(t = {}) {
@@ -849,13 +854,13 @@ Current User:
   async startSession(t) {
     const { self: o, sdk: s } = this.settings;
     if (this.conversationStartTime = /* @__PURE__ */ new Date(), this.chatCharacterCount = 0, o.selfId && o.orgId) {
-      const i = s.activeUser.value?.userId ? void 0 : s.generateAnonId(), n = await s.startConversation({
+      const i = s.activeUser.value?.userId ? void 0 : s.generateAnonId(), a = await s.startConversation({
         selfId: o.selfId,
         userId: s.activeUser.value?.userId,
         anonId: i
       });
-      if (n) {
-        this.sessionId = n.conversationId, this.hostParticipantId = n.hostParticipantId, this.visitorParticipantId = n.visitorParticipantId, this.logger.info("Started conversation session", {
+      if (a) {
+        this.sessionId = a.conversationId, this.hostParticipantId = a.hostParticipantId, this.visitorParticipantId = a.visitorParticipantId, this.logger.info("Started conversation session", {
           sessionId: this.sessionId,
           type: t,
           userId: s.activeUser.value?.userId,
@@ -884,26 +889,26 @@ Current User:
 };
 r(it, "SelfController");
 let Je = it;
-const co = /* @__PURE__ */ O({
+const uo = /* @__PURE__ */ H({
   __name: "EffectTransitionList",
   props: {
     disabled: { type: Boolean, default: !1 },
     mode: { default: "block" }
   },
   setup(e) {
-    return (a, t) => (f(), ne(Ct, {
+    return (n, t) => (f(), ce(Ct, {
       name: e.disabled ? "" : "nlist"
     }, {
-      default: ee(() => [
-        $e(a.$slots, "default")
+      default: re(() => [
+        $e(n.$slots, "default")
       ]),
       _: 3
     }, 8, ["name"]));
   }
-}), uo = {
+}), ho = {
   key: 0,
   class: "absolute inset-0 flex items-center justify-center"
-}, rt = /* @__PURE__ */ O({
+}, rt = /* @__PURE__ */ H({
   __name: "ElSelfButton",
   props: {
     theme: { default: "primary" },
@@ -913,49 +918,49 @@ const co = /* @__PURE__ */ O({
     iconAfter: {}
   },
   setup(e) {
-    const a = L(() => ({
+    const n = z(() => ({
       primary: "bg-primary-600 border-primary-400 hover:border-primary-300 hover:bg-primary-500",
       green: "bg-green-600 border-green-400 hover:border-green-300 hover:bg-green-500",
       red: "bg-red-600 border-red-400 hover:border-red-300 hover:bg-red-500",
       default: "bg-white/10 border-white/20 hover:border-white/40 hover:bg-white/20"
-    })[e.theme]), t = L(() => ({
+    })[e.theme]), t = z(() => ({
       sm: "px-4 py-2 text-sm",
       md: "px-6 py-3 text-base",
       lg: "px-8 py-4 text-base"
-    })[e.size]), o = L(() => ({
+    })[e.size]), o = z(() => ({
       sm: "size-4",
       md: "size-4",
       lg: "size-5"
     })[e.size]);
     return (s, i) => (f(), b("button", {
-      class: E(["relative inline-flex items-center justify-center gap-2 font-medium rounded-full backdrop-blur-sm border-2 text-white transition-all duration-200 focus:outline-none active:opacity-80 disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer", [a.value, t.value]])
+      class: E(["relative inline-flex items-center justify-center gap-2 font-medium rounded-full backdrop-blur-sm border-2 text-white transition-all duration-200 focus:outline-none active:opacity-80 disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer", [n.value, t.value]])
     }, [
-      e.loading ? (f(), b("div", uo, [...i[0] || (i[0] = [
+      e.loading ? (f(), b("div", ho, [...i[0] || (i[0] = [
         c("i", { class: "i-svg-spinners-90-ring-with-bg size-5" }, null, -1)
-      ])])) : P("", !0),
+      ])])) : L("", !0),
       c("span", {
         class: E(["flex items-center gap-2 transition-opacity duration-200", e.loading ? "opacity-0" : "opacity-100"])
       }, [
         e.icon ? (f(), b("i", {
           key: 0,
           class: E([e.icon, o.value])
-        }, null, 2)) : P("", !0),
+        }, null, 2)) : L("", !0),
         $e(s.$slots, "default"),
         e.iconAfter ? (f(), b("i", {
           key: 1,
           class: E([e.iconAfter, o.value])
-        }, null, 2)) : P("", !0)
+        }, null, 2)) : L("", !0)
       ], 2)
     ], 2));
   }
-}), ho = ["value"], fo = /* @__PURE__ */ O({
+}), fo = ["value"], go = /* @__PURE__ */ H({
   __name: "SelfInputEmail",
   props: {
     modelValue: { default: "" }
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: a }) {
-    const t = a;
+  setup(e, { emit: n }) {
+    const t = n;
     return (o, s) => (f(), b("input", {
       type: "email",
       autocomplete: "email",
@@ -964,9 +969,9 @@ const co = /* @__PURE__ */ O({
       class: "w-full px-6 py-3 text-theme-900 placeholder-theme-500 bg-white border border-white rounded-full focus:outline-none transition-all",
       style: { "font-size": "16px" },
       onInput: s[0] || (s[0] = (i) => t("update:modelValue", i.target.value))
-    }, null, 40, ho));
+    }, null, 40, fo));
   }
-}), go = { class: "flex gap-1.5 justify-center" }, mo = ["onUpdate:modelValue", "onInput", "onKeydown", "onPaste", "onFocus"], bo = /* @__PURE__ */ O({
+}), mo = { class: "flex gap-1.5 justify-center" }, bo = ["onUpdate:modelValue", "onInput", "onKeydown", "onPaste", "onFocus"], po = /* @__PURE__ */ H({
   __name: "SelfInputOneTimeCode",
   props: {
     modelValue: {},
@@ -974,38 +979,38 @@ const co = /* @__PURE__ */ O({
     focusFirst: { type: Boolean }
   },
   emits: ["update:modelValue", "autoSubmit"],
-  setup(e, { emit: a }) {
-    const t = e, o = a, s = N([]), i = N(Array.from({ length: t.length }).fill("")), n = N(!1);
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = R([]), i = R(Array.from({ length: t.length }).fill("")), a = R(!1);
     Ee(() => {
       t.modelValue && (i.value = t.modelValue.split("").slice(0, t.length)), t.focusFirst && !("ontouchstart" in window) && s.value[0]?.focus();
-    }), ae(() => t.modelValue, (h) => {
+    }), de(() => t.modelValue, (h) => {
       i.value = h ? h.split("").slice(0, t.length) : Array.from({ length: t.length }).fill("");
-    }), ae(i, () => {
+    }), de(i, () => {
       const h = i.value.filter(Boolean).join("");
       o("update:modelValue", h), h.length === t.length && o("autoSubmit", h);
     }, { deep: !0 });
     function l(h, x) {
-      x.preventDefault(), n.value = !0;
-      const z = (x.clipboardData?.getData("text") || "").replace(/\D/g, "");
-      if (z.length === t.length)
-        i.value = z.split(""), setTimeout(() => {
-          s.value[t.length - 1]?.focus(), n.value = !1;
+      x.preventDefault(), a.value = !0;
+      const $ = (x.clipboardData?.getData("text") || "").replace(/\D/g, "");
+      if ($.length === t.length)
+        i.value = $.split(""), setTimeout(() => {
+          s.value[t.length - 1]?.focus(), a.value = !1;
         }, 10);
       else {
-        const A = [...i.value];
-        z.split("").slice(0, t.length - h).forEach((y, T) => {
-          A[h + T] = y;
-        }), i.value = A;
-        const M = Math.min(h + z.length, t.length - 1);
+        const M = [...i.value];
+        $.split("").slice(0, t.length - h).forEach((W, Z) => {
+          M[h + Z] = W;
+        }), i.value = M;
+        const j = Math.min(h + $.length, t.length - 1);
         setTimeout(() => {
-          s.value[M]?.focus(), n.value = !1;
+          s.value[j]?.focus(), a.value = !1;
         }, 10);
       }
     }
     r(l, "onPaste");
     function d(h, x) {
-      const z = x.target.value.slice(-1).replace(/\D/g, "");
-      i.value[h] = z, z && h < t.length - 1 && s.value[h + 1]?.focus();
+      const $ = x.target.value.slice(-1).replace(/\D/g, "");
+      i.value[h] = $, $ && h < t.length - 1 && s.value[h + 1]?.focus();
     }
     r(d, "onInput");
     function C(h, x) {
@@ -1013,55 +1018,55 @@ const co = /* @__PURE__ */ O({
     }
     r(C, "onKeydown");
     function m(h) {
-      if (s.value[h]?.select(), !n.value && i.value[h])
+      if (s.value[h]?.select(), !a.value && i.value[h])
         for (let x = h; x < t.length; x++)
           i.value[x] = "";
     }
-    return r(m, "onFocus"), (h, x) => (f(), b("div", go, [
-      (f(!0), b(ke, null, Be(e.length, (z) => St((f(), b("input", {
-        key: z,
+    return r(m, "onFocus"), (h, x) => (f(), b("div", mo, [
+      (f(!0), b(ke, null, Be(e.length, ($) => St((f(), b("input", {
+        key: $,
         ref_for: !0,
-        ref: /* @__PURE__ */ r((A) => s.value[z - 1] = A, "ref"),
-        "onUpdate:modelValue": /* @__PURE__ */ r((A) => i.value[z - 1] = A, "onUpdate:modelValue"),
+        ref: /* @__PURE__ */ r((M) => s.value[$ - 1] = M, "ref"),
+        "onUpdate:modelValue": /* @__PURE__ */ r((M) => i.value[$ - 1] = M, "onUpdate:modelValue"),
         type: "text",
         inputmode: "numeric",
         autocomplete: "one-time-code",
         class: "size-11 text-center font-mono text-theme-900 bg-white border border-white rounded-lg focus:outline-none transition-all",
         style: { "font-size": "16px" },
         maxlength: "1",
-        onInput: /* @__PURE__ */ r((A) => d(z - 1, A), "onInput"),
-        onKeydown: /* @__PURE__ */ r((A) => C(z - 1, A), "onKeydown"),
-        onPaste: /* @__PURE__ */ r((A) => l(z - 1, A), "onPaste"),
-        onFocus: /* @__PURE__ */ r((A) => m(z - 1), "onFocus")
-      }, null, 40, mo)), [
-        [Mt, i.value[z - 1]]
+        onInput: /* @__PURE__ */ r((M) => d($ - 1, M), "onInput"),
+        onKeydown: /* @__PURE__ */ r((M) => C($ - 1, M), "onKeydown"),
+        onPaste: /* @__PURE__ */ r((M) => l($ - 1, M), "onPaste"),
+        onFocus: /* @__PURE__ */ r((M) => m($ - 1), "onFocus")
+      }, null, 40, bo)), [
+        [Mt, i.value[$ - 1]]
       ])), 128))
     ]));
   }
-}), po = { class: "flex flex-col items-center justify-center h-full p-6" }, vo = { class: "w-full max-w-xs space-y-12" }, xo = {
+}), vo = { class: "flex flex-col items-center justify-center h-full p-6" }, xo = { class: "w-full max-w-xs space-y-12" }, yo = {
   key: 0,
   class: "text-xs text-theme-400 text-center"
-}, yo = { class: "text-base font-light text-white text-center" }, ko = { class: "space-y-6 relative" }, wo = {
+}, ko = { class: "text-base font-light text-white text-center" }, wo = { class: "space-y-6 relative" }, Co = {
   key: "email-field",
   class: "w-full"
-}, Co = {
+}, So = {
   key: "code-field",
   class: "w-full"
-}, mt = /* @__PURE__ */ O({
+}, mt = /* @__PURE__ */ H({
   __name: "ElAuthGate",
   props: {
     sdk: {}
   },
   setup(e) {
-    const a = N({ email: "", code: "" }), t = N("email"), o = N(!1), s = {
+    const n = R({ email: "", code: "" }), t = R("email"), o = R(!1), s = {
       email: {
         title: "Enter Your Email",
-        button: { label: "Continue", disabled: /* @__PURE__ */ r(() => !a.value.email || o.value, "disabled") },
+        button: { label: "Continue", disabled: /* @__PURE__ */ r(() => !n.value.email || o.value, "disabled") },
         action: /* @__PURE__ */ r(async () => {
           if (!o.value) {
             o.value = !0;
             try {
-              await e.sdk.requestAuthCode({ email: a.value.email }) && (t.value = "code");
+              await e.sdk.requestAuthCode({ email: n.value.email }) && (t.value = "code");
             } finally {
               o.value = !1;
             }
@@ -1070,36 +1075,36 @@ const co = /* @__PURE__ */ O({
       },
       code: {
         title: "Enter Verification Code",
-        button: { label: "Verify", disabled: /* @__PURE__ */ r(() => a.value.code.length !== 6 || o.value, "disabled") },
+        button: { label: "Verify", disabled: /* @__PURE__ */ r(() => n.value.code.length !== 6 || o.value, "disabled") },
         action: /* @__PURE__ */ r(async () => {
           if (!o.value) {
             o.value = !0;
             try {
-              await e.sdk.loginWithCode({ email: a.value.email, code: a.value.code });
+              await e.sdk.loginWithCode({ email: n.value.email, code: n.value.code });
             } finally {
               o.value = !1;
             }
           }
         }, "action")
       }
-    }, i = L(() => s[t.value]);
-    return (n, l) => (f(), b("div", po, [
-      c("div", vo, [
-        e.sdk.error.value ? (f(), b("p", xo, U(e.sdk.error.value), 1)) : P("", !0),
-        c("h3", yo, U(i.value.title), 1),
-        c("div", ko, [
-          G(co, null, {
-            default: ee(() => [
-              t.value === "email" ? (f(), b("div", wo, [
-                G(fo, {
-                  modelValue: a.value.email,
-                  "onUpdate:modelValue": l[0] || (l[0] = (d) => a.value.email = d),
-                  onKeyup: _t(i.value.action, ["enter"])
+    }, i = z(() => s[t.value]);
+    return (a, l) => (f(), b("div", vo, [
+      c("div", xo, [
+        e.sdk.error.value ? (f(), b("p", yo, q(e.sdk.error.value), 1)) : L("", !0),
+        c("h3", ko, q(i.value.title), 1),
+        c("div", wo, [
+          O(uo, null, {
+            default: re(() => [
+              t.value === "email" ? (f(), b("div", Co, [
+                O(go, {
+                  modelValue: n.value.email,
+                  "onUpdate:modelValue": l[0] || (l[0] = (d) => n.value.email = d),
+                  onKeyup: Zt(i.value.action, ["enter"])
                 }, null, 8, ["modelValue", "onKeyup"])
-              ])) : (f(), b("div", Co, [
-                G(bo, {
-                  modelValue: a.value.code,
-                  "onUpdate:modelValue": l[1] || (l[1] = (d) => a.value.code = d),
+              ])) : (f(), b("div", So, [
+                O(po, {
+                  modelValue: n.value.code,
+                  "onUpdate:modelValue": l[1] || (l[1] = (d) => n.value.code = d),
                   length: 6,
                   "focus-first": !0,
                   onAutoSubmit: i.value.action
@@ -1109,7 +1114,7 @@ const co = /* @__PURE__ */ O({
                 key: i.value.button.label,
                 class: "space-y-4 w-full"
               }, [
-                G(rt, {
+                O(rt, {
                   theme: "primary",
                   size: "md",
                   class: "w-full",
@@ -1117,8 +1122,8 @@ const co = /* @__PURE__ */ O({
                   disabled: i.value.button.disabled() || e.sdk.loading.value,
                   onClick: i.value.action
                 }, {
-                  default: ee(() => [
-                    ze(U(i.value.button.label), 1)
+                  default: re(() => [
+                    ze(q(i.value.button.label), 1)
                   ]),
                   _: 1
                 }, 8, ["loading", "disabled", "onClick"]),
@@ -1126,7 +1131,7 @@ const co = /* @__PURE__ */ O({
                   key: 0,
                   class: "w-full text-xs text-white/50 hover:text-white/70 transition-colors py-2",
                   onClick: l[2] || (l[2] = (d) => t.value = "email")
-                }, " Change Email ")) : P("", !0)
+                }, " Change Email ")) : L("", !0)
               ]))
             ]),
             _: 1
@@ -1135,10 +1140,10 @@ const co = /* @__PURE__ */ O({
       ])
     ]));
   }
-}), So = { class: "relative flex-shrink-0" }, Mo = ["src", "alt"], Ao = {
+}), Mo = { class: "relative flex-shrink-0" }, Ao = ["src", "alt"], Io = {
   key: 0,
   class: "absolute top-1 right-1"
-}, Io = { class: "min-w-0" }, st = /* @__PURE__ */ O({
+}, $o = { class: "min-w-0" }, st = /* @__PURE__ */ H({
   __name: "ElModeHeader",
   props: {
     self: {},
@@ -1147,125 +1152,125 @@ const co = /* @__PURE__ */ O({
     layout: { default: "centered" }
   },
   setup(e) {
-    function a() {
+    function n() {
       return e.self.avatar?.src ? e.self.avatar.src : qe();
     }
-    return r(a, "getAvatarSrc"), (t, o) => (f(), b("div", {
+    return r(n, "getAvatarSrc"), (t, o) => (f(), b("div", {
       class: E(["flex gap-4", [
         e.layout === "centered" ? "flex-col items-center text-center" : "flex-row items-center justify-center"
       ]])
     }, [
-      c("div", So, [
+      c("div", Mo, [
         c("div", {
           class: E(["rounded-full overflow-hidden border-white", e.size === "lg" ? "w-20 h-20 sm:w-24 sm:h-24 border-4" : "w-16 sm:size-16 border-2"])
         }, [
           c("img", {
-            src: a(),
+            src: n(),
             alt: e.self.name,
             class: "w-full h-full object-cover",
             onError: o[0] || (o[0] = //@ts-ignore
-            (...s) => K(Ue) && K(Ue)(...s))
-          }, null, 40, Mo)
+            (...s) => Y(Ue) && Y(Ue)(...s))
+          }, null, 40, Ao)
         ], 2),
-        e.showOnlineIndicator ? (f(), b("div", Ao, [...o[1] || (o[1] = [
+        e.showOnlineIndicator ? (f(), b("div", Io, [...o[1] || (o[1] = [
           c("div", {
             class: "size-3 bg-green-500 rounded-full ring-2 ring-white absolute animate-ping",
             style: { "animation-duration": "3s" }
           }, null, -1),
           c("div", { class: "size-3 bg-green-500 rounded-full ring-2 ring-white" }, null, -1)
-        ])])) : P("", !0)
+        ])])) : L("", !0)
       ]),
-      c("div", Io, [
+      c("div", $o, [
         c("h1", {
           class: E(["font-light text-white mb-1 truncate", [
             e.size === "lg" ? "text-3xl mb-2" : "text-xl sm:text-2xl tracking-wide leading-tight",
             e.layout === "horizontal" ? "text-white/95" : ""
           ]])
-        }, U(e.self.name), 3),
+        }, q(e.self.name), 3),
         c("p", {
           class: E(["font-light line-clamp-1", [
             e.size === "lg" ? "text-base text-white/60" : "text-sm sm:text-base",
             e.layout === "horizontal" ? "text-white/70 truncate" : "text-white/60"
           ]])
-        }, U(e.layout === "horizontal" ? e.self.title || "Digital Self" : e.self.title), 3)
+        }, q(e.layout === "horizontal" ? e.self.title || "Digital Self" : e.self.title), 3)
       ])
     ], 2));
   }
-}), nt = "-", $o = /* @__PURE__ */ r((e) => {
-  const a = Eo(e), {
+}), nt = "-", zo = /* @__PURE__ */ r((e) => {
+  const n = To(e), {
     conflictingClassGroups: t,
     conflictingClassGroupModifiers: o
   } = e;
   return {
-    getClassGroupId: /* @__PURE__ */ r((n) => {
-      const l = n.split(nt);
-      return l[0] === "" && l.length !== 1 && l.shift(), Et(l, a) || zo(n);
+    getClassGroupId: /* @__PURE__ */ r((a) => {
+      const l = a.split(nt);
+      return l[0] === "" && l.length !== 1 && l.shift(), Et(l, n) || Eo(a);
     }, "getClassGroupId"),
-    getConflictingClassGroupIds: /* @__PURE__ */ r((n, l) => {
-      const d = t[n] || [];
-      return l && o[n] ? [...d, ...o[n]] : d;
+    getConflictingClassGroupIds: /* @__PURE__ */ r((a, l) => {
+      const d = t[a] || [];
+      return l && o[a] ? [...d, ...o[a]] : d;
     }, "getConflictingClassGroupIds")
   };
-}, "createClassGroupUtils"), Et = /* @__PURE__ */ r((e, a) => {
+}, "createClassGroupUtils"), Et = /* @__PURE__ */ r((e, n) => {
   if (e.length === 0)
-    return a.classGroupId;
-  const t = e[0], o = a.nextPart.get(t), s = o ? Et(e.slice(1), o) : void 0;
+    return n.classGroupId;
+  const t = e[0], o = n.nextPart.get(t), s = o ? Et(e.slice(1), o) : void 0;
   if (s)
     return s;
-  if (a.validators.length === 0)
+  if (n.validators.length === 0)
     return;
   const i = e.join(nt);
-  return a.validators.find(({
-    validator: n
-  }) => n(i))?.classGroupId;
-}, "getGroupRecursive"), bt = /^\[(.+)\]$/, zo = /* @__PURE__ */ r((e) => {
+  return n.validators.find(({
+    validator: a
+  }) => a(i))?.classGroupId;
+}, "getGroupRecursive"), bt = /^\[(.+)\]$/, Eo = /* @__PURE__ */ r((e) => {
   if (bt.test(e)) {
-    const a = bt.exec(e)[1], t = a?.substring(0, a.indexOf(":"));
+    const n = bt.exec(e)[1], t = n?.substring(0, n.indexOf(":"));
     if (t)
       return "arbitrary.." + t;
   }
-}, "getGroupIdForArbitraryProperty"), Eo = /* @__PURE__ */ r((e) => {
+}, "getGroupIdForArbitraryProperty"), To = /* @__PURE__ */ r((e) => {
   const {
-    theme: a,
+    theme: n,
     classGroups: t
   } = e, o = {
     nextPart: /* @__PURE__ */ new Map(),
     validators: []
   };
   for (const s in t)
-    Qe(t[s], o, s, a);
+    Qe(t[s], o, s, n);
   return o;
-}, "createClassMap"), Qe = /* @__PURE__ */ r((e, a, t, o) => {
+}, "createClassMap"), Qe = /* @__PURE__ */ r((e, n, t, o) => {
   e.forEach((s) => {
     if (typeof s == "string") {
-      const i = s === "" ? a : pt(a, s);
+      const i = s === "" ? n : pt(n, s);
       i.classGroupId = t;
       return;
     }
     if (typeof s == "function") {
-      if (To(s)) {
-        Qe(s(o), a, t, o);
+      if (Lo(s)) {
+        Qe(s(o), n, t, o);
         return;
       }
-      a.validators.push({
+      n.validators.push({
         validator: s,
         classGroupId: t
       });
       return;
     }
-    Object.entries(s).forEach(([i, n]) => {
-      Qe(n, pt(a, i), t, o);
+    Object.entries(s).forEach(([i, a]) => {
+      Qe(a, pt(n, i), t, o);
     });
   });
-}, "processClassesRecursively"), pt = /* @__PURE__ */ r((e, a) => {
+}, "processClassesRecursively"), pt = /* @__PURE__ */ r((e, n) => {
   let t = e;
-  return a.split(nt).forEach((o) => {
+  return n.split(nt).forEach((o) => {
     t.nextPart.has(o) || t.nextPart.set(o, {
       nextPart: /* @__PURE__ */ new Map(),
       validators: []
     }), t = t.nextPart.get(o);
   }), t;
-}, "getPart"), To = /* @__PURE__ */ r((e) => e.isThemeGetter, "isThemeGetter"), Lo = /* @__PURE__ */ r((e) => {
+}, "getPart"), Lo = /* @__PURE__ */ r((e) => e.isThemeGetter, "isThemeGetter"), Do = /* @__PURE__ */ r((e) => {
   if (e < 1)
     return {
       get: /* @__PURE__ */ r(() => {
@@ -1273,59 +1278,59 @@ const co = /* @__PURE__ */ O({
       set: /* @__PURE__ */ r(() => {
       }, "set")
     };
-  let a = 0, t = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map();
-  const s = /* @__PURE__ */ r((i, n) => {
-    t.set(i, n), a++, a > e && (a = 0, o = t, t = /* @__PURE__ */ new Map());
+  let n = 0, t = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map();
+  const s = /* @__PURE__ */ r((i, a) => {
+    t.set(i, a), n++, n > e && (n = 0, o = t, t = /* @__PURE__ */ new Map());
   }, "update");
   return {
     get(i) {
-      let n = t.get(i);
-      if (n !== void 0)
-        return n;
-      if ((n = o.get(i)) !== void 0)
-        return s(i, n), n;
+      let a = t.get(i);
+      if (a !== void 0)
+        return a;
+      if ((a = o.get(i)) !== void 0)
+        return s(i, a), a;
     },
-    set(i, n) {
-      t.has(i) ? t.set(i, n) : s(i, n);
+    set(i, a) {
+      t.has(i) ? t.set(i, a) : s(i, a);
     }
   };
-}, "createLruCache"), Xe = "!", et = ":", Do = et.length, Po = /* @__PURE__ */ r((e) => {
+}, "createLruCache"), Xe = "!", et = ":", Po = et.length, Vo = /* @__PURE__ */ r((e) => {
   const {
-    prefix: a,
+    prefix: n,
     experimentalParseClassName: t
   } = e;
   let o = /* @__PURE__ */ r((s) => {
     const i = [];
-    let n = 0, l = 0, d = 0, C;
-    for (let A = 0; A < s.length; A++) {
-      let M = s[A];
-      if (n === 0 && l === 0) {
-        if (M === et) {
-          i.push(s.slice(d, A)), d = A + Do;
+    let a = 0, l = 0, d = 0, C;
+    for (let M = 0; M < s.length; M++) {
+      let j = s[M];
+      if (a === 0 && l === 0) {
+        if (j === et) {
+          i.push(s.slice(d, M)), d = M + Po;
           continue;
         }
-        if (M === "/") {
-          C = A;
+        if (j === "/") {
+          C = M;
           continue;
         }
       }
-      M === "[" ? n++ : M === "]" ? n-- : M === "(" ? l++ : M === ")" && l--;
+      j === "[" ? a++ : j === "]" ? a-- : j === "(" ? l++ : j === ")" && l--;
     }
-    const m = i.length === 0 ? s : s.substring(d), h = Vo(m), x = h !== m, z = C && C > d ? C - d : void 0;
+    const m = i.length === 0 ? s : s.substring(d), h = Fo(m), x = h !== m, $ = C && C > d ? C - d : void 0;
     return {
       modifiers: i,
       hasImportantModifier: x,
       baseClassName: h,
-      maybePostfixModifierPosition: z
+      maybePostfixModifierPosition: $
     };
   }, "parseClassName");
-  if (a) {
-    const s = a + et, i = o;
-    o = /* @__PURE__ */ r((n) => n.startsWith(s) ? i(n.substring(s.length)) : {
+  if (n) {
+    const s = n + et, i = o;
+    o = /* @__PURE__ */ r((a) => a.startsWith(s) ? i(a.substring(s.length)) : {
       isExternal: !0,
       modifiers: [],
       hasImportantModifier: !1,
-      baseClassName: n,
+      baseClassName: a,
       maybePostfixModifierPosition: void 0
     }, "parseClassName");
   }
@@ -1337,117 +1342,117 @@ const co = /* @__PURE__ */ O({
     }), "parseClassName");
   }
   return o;
-}, "createParseClassName"), Vo = /* @__PURE__ */ r((e) => e.endsWith(Xe) ? e.substring(0, e.length - 1) : e.startsWith(Xe) ? e.substring(1) : e, "stripImportantModifier"), Fo = /* @__PURE__ */ r((e) => {
-  const a = Object.fromEntries(e.orderSensitiveModifiers.map((o) => [o, !0]));
+}, "createParseClassName"), Fo = /* @__PURE__ */ r((e) => e.endsWith(Xe) ? e.substring(0, e.length - 1) : e.startsWith(Xe) ? e.substring(1) : e, "stripImportantModifier"), Bo = /* @__PURE__ */ r((e) => {
+  const n = Object.fromEntries(e.orderSensitiveModifiers.map((o) => [o, !0]));
   return /* @__PURE__ */ r((o) => {
     if (o.length <= 1)
       return o;
     const s = [];
     let i = [];
-    return o.forEach((n) => {
-      n[0] === "[" || a[n] ? (s.push(...i.sort(), n), i = []) : i.push(n);
+    return o.forEach((a) => {
+      a[0] === "[" || n[a] ? (s.push(...i.sort(), a), i = []) : i.push(a);
     }), s.push(...i.sort()), s;
   }, "sortModifiers");
-}, "createSortModifiers"), Bo = /* @__PURE__ */ r((e) => ({
-  cache: Lo(e.cacheSize),
-  parseClassName: Po(e),
-  sortModifiers: Fo(e),
-  ...$o(e)
-}), "createConfigUtils"), jo = /\s+/, No = /* @__PURE__ */ r((e, a) => {
+}, "createSortModifiers"), jo = /* @__PURE__ */ r((e) => ({
+  cache: Do(e.cacheSize),
+  parseClassName: Vo(e),
+  sortModifiers: Bo(e),
+  ...zo(e)
+}), "createConfigUtils"), No = /\s+/, Ro = /* @__PURE__ */ r((e, n) => {
   const {
     parseClassName: t,
     getClassGroupId: o,
     getConflictingClassGroupIds: s,
     sortModifiers: i
-  } = a, n = [], l = e.trim().split(jo);
+  } = n, a = [], l = e.trim().split(No);
   let d = "";
   for (let C = l.length - 1; C >= 0; C -= 1) {
     const m = l[C], {
       isExternal: h,
       modifiers: x,
-      hasImportantModifier: z,
-      baseClassName: A,
-      maybePostfixModifierPosition: M
+      hasImportantModifier: $,
+      baseClassName: M,
+      maybePostfixModifierPosition: j
     } = t(m);
     if (h) {
       d = m + (d.length > 0 ? " " + d : d);
       continue;
     }
-    let y = !!M, T = o(y ? A.substring(0, M) : A);
-    if (!T) {
-      if (!y) {
+    let W = !!j, Z = o(W ? M.substring(0, j) : M);
+    if (!Z) {
+      if (!W) {
         d = m + (d.length > 0 ? " " + d : d);
         continue;
       }
-      if (T = o(A), !T) {
+      if (Z = o(M), !Z) {
         d = m + (d.length > 0 ? " " + d : d);
         continue;
       }
-      y = !1;
+      W = !1;
     }
-    const ie = i(x).join(":"), le = z ? ie + Xe : ie, ce = le + T;
-    if (n.includes(ce))
+    const B = i(x).join(":"), k = $ ? B + Xe : B, D = k + Z;
+    if (a.includes(D))
       continue;
-    n.push(ce);
-    const be = s(T, y);
-    for (let W = 0; W < be.length; ++W) {
-      const te = be[W];
-      n.push(le + te);
+    a.push(D);
+    const se = s(Z, W);
+    for (let _ = 0; _ < se.length; ++_) {
+      const ne = se[_];
+      a.push(k + ne);
     }
     d = m + (d.length > 0 ? " " + d : d);
   }
   return d;
 }, "mergeClassList");
-function Ro() {
-  let e = 0, a, t, o = "";
+function Go() {
+  let e = 0, n, t, o = "";
   for (; e < arguments.length; )
-    (a = arguments[e++]) && (t = Tt(a)) && (o && (o += " "), o += t);
+    (n = arguments[e++]) && (t = Tt(n)) && (o && (o += " "), o += t);
   return o;
 }
-r(Ro, "twJoin");
+r(Go, "twJoin");
 const Tt = /* @__PURE__ */ r((e) => {
   if (typeof e == "string")
     return e;
-  let a, t = "";
+  let n, t = "";
   for (let o = 0; o < e.length; o++)
-    e[o] && (a = Tt(e[o])) && (t && (t += " "), t += a);
+    e[o] && (n = Tt(e[o])) && (t && (t += " "), t += n);
   return t;
 }, "toValue");
-function Go(e, ...a) {
-  let t, o, s, i = n;
-  function n(d) {
-    const C = a.reduce((m, h) => h(m), e());
-    return t = Bo(C), o = t.cache.get, s = t.cache.set, i = l, l(d);
+function Oo(e, ...n) {
+  let t, o, s, i = a;
+  function a(d) {
+    const C = n.reduce((m, h) => h(m), e());
+    return t = jo(C), o = t.cache.get, s = t.cache.set, i = l, l(d);
   }
-  r(n, "initTailwindMerge");
+  r(a, "initTailwindMerge");
   function l(d) {
     const C = o(d);
     if (C)
       return C;
-    const m = No(d, t);
+    const m = Ro(d, t);
     return s(d, m), m;
   }
   return r(l, "tailwindMerge"), /* @__PURE__ */ r(function() {
-    return i(Ro.apply(null, arguments));
+    return i(Go.apply(null, arguments));
   }, "callTailwindMerge");
 }
-r(Go, "createTailwindMerge");
-const H = /* @__PURE__ */ r((e) => {
-  const a = /* @__PURE__ */ r((t) => t[e] || [], "themeGetter");
-  return a.isThemeGetter = !0, a;
-}, "fromTheme"), Lt = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, Dt = /^\((?:(\w[\w-]*):)?(.+)\)$/i, Oo = /^\d+\/\d+$/, Ho = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, Uo = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, qo = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Wo = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Ko = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, Ae = /* @__PURE__ */ r((e) => Oo.test(e), "isFraction"), $ = /* @__PURE__ */ r((e) => !!e && !Number.isNaN(Number(e)), "isNumber"), ye = /* @__PURE__ */ r((e) => !!e && Number.isInteger(Number(e)), "isInteger"), Ke = /* @__PURE__ */ r((e) => e.endsWith("%") && $(e.slice(0, -1)), "isPercent"), me = /* @__PURE__ */ r((e) => Ho.test(e), "isTshirtSize"), _o = /* @__PURE__ */ r(() => !0, "isAny"), Zo = /* @__PURE__ */ r((e) => (
+r(Oo, "createTailwindMerge");
+const U = /* @__PURE__ */ r((e) => {
+  const n = /* @__PURE__ */ r((t) => t[e] || [], "themeGetter");
+  return n.isThemeGetter = !0, n;
+}, "fromTheme"), Lt = /^\[(?:(\w[\w-]*):)?(.+)\]$/i, Dt = /^\((?:(\w[\w-]*):)?(.+)\)$/i, Ho = /^\d+\/\d+$/, Uo = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, qo = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, Wo = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/, Ko = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, Zo = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, Ae = /* @__PURE__ */ r((e) => Ho.test(e), "isFraction"), I = /* @__PURE__ */ r((e) => !!e && !Number.isNaN(Number(e)), "isNumber"), ye = /* @__PURE__ */ r((e) => !!e && Number.isInteger(Number(e)), "isInteger"), Ke = /* @__PURE__ */ r((e) => e.endsWith("%") && I(e.slice(0, -1)), "isPercent"), be = /* @__PURE__ */ r((e) => Uo.test(e), "isTshirtSize"), _o = /* @__PURE__ */ r(() => !0, "isAny"), Yo = /* @__PURE__ */ r((e) => (
   // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
   // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
-  Uo.test(e) && !qo.test(e)
-), "isLengthOnly"), Pt = /* @__PURE__ */ r(() => !1, "isNever"), Yo = /* @__PURE__ */ r((e) => Wo.test(e), "isShadow"), Jo = /* @__PURE__ */ r((e) => Ko.test(e), "isImage"), Qo = /* @__PURE__ */ r((e) => !p(e) && !v(e), "isAnyNonArbitrary"), Xo = /* @__PURE__ */ r((e) => Te(e, Bt, Pt), "isArbitrarySize"), p = /* @__PURE__ */ r((e) => Lt.test(e), "isArbitraryValue"), Ce = /* @__PURE__ */ r((e) => Te(e, jt, Zo), "isArbitraryLength"), _e = /* @__PURE__ */ r((e) => Te(e, sr, $), "isArbitraryNumber"), vt = /* @__PURE__ */ r((e) => Te(e, Vt, Pt), "isArbitraryPosition"), er = /* @__PURE__ */ r((e) => Te(e, Ft, Jo), "isArbitraryImage"), Oe = /* @__PURE__ */ r((e) => Te(e, Nt, Yo), "isArbitraryShadow"), v = /* @__PURE__ */ r((e) => Dt.test(e), "isArbitraryVariable"), Fe = /* @__PURE__ */ r((e) => Le(e, jt), "isArbitraryVariableLength"), tr = /* @__PURE__ */ r((e) => Le(e, nr), "isArbitraryVariableFamilyName"), xt = /* @__PURE__ */ r((e) => Le(e, Vt), "isArbitraryVariablePosition"), or = /* @__PURE__ */ r((e) => Le(e, Bt), "isArbitraryVariableSize"), rr = /* @__PURE__ */ r((e) => Le(e, Ft), "isArbitraryVariableImage"), He = /* @__PURE__ */ r((e) => Le(e, Nt, !0), "isArbitraryVariableShadow"), Te = /* @__PURE__ */ r((e, a, t) => {
+  qo.test(e) && !Wo.test(e)
+), "isLengthOnly"), Pt = /* @__PURE__ */ r(() => !1, "isNever"), Jo = /* @__PURE__ */ r((e) => Ko.test(e), "isShadow"), Qo = /* @__PURE__ */ r((e) => Zo.test(e), "isImage"), Xo = /* @__PURE__ */ r((e) => !p(e) && !v(e), "isAnyNonArbitrary"), er = /* @__PURE__ */ r((e) => Te(e, Bt, Pt), "isArbitrarySize"), p = /* @__PURE__ */ r((e) => Lt.test(e), "isArbitraryValue"), Ce = /* @__PURE__ */ r((e) => Te(e, jt, Yo), "isArbitraryLength"), Ze = /* @__PURE__ */ r((e) => Te(e, nr, I), "isArbitraryNumber"), vt = /* @__PURE__ */ r((e) => Te(e, Vt, Pt), "isArbitraryPosition"), tr = /* @__PURE__ */ r((e) => Te(e, Ft, Qo), "isArbitraryImage"), Oe = /* @__PURE__ */ r((e) => Te(e, Nt, Jo), "isArbitraryShadow"), v = /* @__PURE__ */ r((e) => Dt.test(e), "isArbitraryVariable"), Fe = /* @__PURE__ */ r((e) => Le(e, jt), "isArbitraryVariableLength"), or = /* @__PURE__ */ r((e) => Le(e, ar), "isArbitraryVariableFamilyName"), xt = /* @__PURE__ */ r((e) => Le(e, Vt), "isArbitraryVariablePosition"), rr = /* @__PURE__ */ r((e) => Le(e, Bt), "isArbitraryVariableSize"), sr = /* @__PURE__ */ r((e) => Le(e, Ft), "isArbitraryVariableImage"), He = /* @__PURE__ */ r((e) => Le(e, Nt, !0), "isArbitraryVariableShadow"), Te = /* @__PURE__ */ r((e, n, t) => {
   const o = Lt.exec(e);
-  return o ? o[1] ? a(o[1]) : t(o[2]) : !1;
-}, "getIsArbitraryValue"), Le = /* @__PURE__ */ r((e, a, t = !1) => {
+  return o ? o[1] ? n(o[1]) : t(o[2]) : !1;
+}, "getIsArbitraryValue"), Le = /* @__PURE__ */ r((e, n, t = !1) => {
   const o = Dt.exec(e);
-  return o ? o[1] ? a(o[1]) : t : !1;
-}, "getIsArbitraryVariable"), Vt = /* @__PURE__ */ r((e) => e === "position" || e === "percentage", "isLabelPosition"), Ft = /* @__PURE__ */ r((e) => e === "image" || e === "url", "isLabelImage"), Bt = /* @__PURE__ */ r((e) => e === "length" || e === "size" || e === "bg-size", "isLabelSize"), jt = /* @__PURE__ */ r((e) => e === "length", "isLabelLength"), sr = /* @__PURE__ */ r((e) => e === "number", "isLabelNumber"), nr = /* @__PURE__ */ r((e) => e === "family-name", "isLabelFamilyName"), Nt = /* @__PURE__ */ r((e) => e === "shadow", "isLabelShadow"), ar = /* @__PURE__ */ r(() => {
-  const e = H("color"), a = H("font"), t = H("text"), o = H("font-weight"), s = H("tracking"), i = H("leading"), n = H("breakpoint"), l = H("container"), d = H("spacing"), C = H("radius"), m = H("shadow"), h = H("inset-shadow"), x = H("text-shadow"), z = H("drop-shadow"), A = H("blur"), M = H("perspective"), y = H("aspect"), T = H("ease"), ie = H("animate"), le = /* @__PURE__ */ r(() => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], "scaleBreak"), ce = /* @__PURE__ */ r(() => [
+  return o ? o[1] ? n(o[1]) : t : !1;
+}, "getIsArbitraryVariable"), Vt = /* @__PURE__ */ r((e) => e === "position" || e === "percentage", "isLabelPosition"), Ft = /* @__PURE__ */ r((e) => e === "image" || e === "url", "isLabelImage"), Bt = /* @__PURE__ */ r((e) => e === "length" || e === "size" || e === "bg-size", "isLabelSize"), jt = /* @__PURE__ */ r((e) => e === "length", "isLabelLength"), nr = /* @__PURE__ */ r((e) => e === "number", "isLabelNumber"), ar = /* @__PURE__ */ r((e) => e === "family-name", "isLabelFamilyName"), Nt = /* @__PURE__ */ r((e) => e === "shadow", "isLabelShadow"), ir = /* @__PURE__ */ r(() => {
+  const e = U("color"), n = U("font"), t = U("text"), o = U("font-weight"), s = U("tracking"), i = U("leading"), a = U("breakpoint"), l = U("container"), d = U("spacing"), C = U("radius"), m = U("shadow"), h = U("inset-shadow"), x = U("text-shadow"), $ = U("drop-shadow"), M = U("blur"), j = U("perspective"), W = U("aspect"), Z = U("ease"), B = U("animate"), k = /* @__PURE__ */ r(() => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], "scaleBreak"), D = /* @__PURE__ */ r(() => [
     "center",
     "top",
     "bottom",
@@ -1465,15 +1470,15 @@ const H = /* @__PURE__ */ r((e) => {
     "bottom-left",
     // Deprecated since Tailwind CSS v4.1.0, see https://github.com/tailwindlabs/tailwindcss/pull/17378
     "left-bottom"
-  ], "scalePosition"), be = /* @__PURE__ */ r(() => [...ce(), v, p], "scalePositionWithArbitrary"), W = /* @__PURE__ */ r(() => ["auto", "hidden", "clip", "visible", "scroll"], "scaleOverflow"), te = /* @__PURE__ */ r(() => ["auto", "contain", "none"], "scaleOverscroll"), w = /* @__PURE__ */ r(() => [v, p, d], "scaleUnambiguousSpacing"), J = /* @__PURE__ */ r(() => [Ae, "full", "auto", ...w()], "scaleInset"), je = /* @__PURE__ */ r(() => [ye, "none", "subgrid", v, p], "scaleGridTemplateColsRows"), Ne = /* @__PURE__ */ r(() => ["auto", {
+  ], "scalePosition"), se = /* @__PURE__ */ r(() => [...D(), v, p], "scalePositionWithArbitrary"), _ = /* @__PURE__ */ r(() => ["auto", "hidden", "clip", "visible", "scroll"], "scaleOverflow"), ne = /* @__PURE__ */ r(() => ["auto", "contain", "none"], "scaleOverscroll"), w = /* @__PURE__ */ r(() => [v, p, d], "scaleUnambiguousSpacing"), ee = /* @__PURE__ */ r(() => [Ae, "full", "auto", ...w()], "scaleInset"), je = /* @__PURE__ */ r(() => [ye, "none", "subgrid", v, p], "scaleGridTemplateColsRows"), Ne = /* @__PURE__ */ r(() => ["auto", {
     span: ["full", ye, v, p]
-  }, ye, v, p], "scaleGridColRowStartAndEnd"), Se = /* @__PURE__ */ r(() => [ye, "auto", v, p], "scaleGridColRowStartOrEnd"), Re = /* @__PURE__ */ r(() => ["auto", "min", "max", "fr", v, p], "scaleGridAutoColsRows"), De = /* @__PURE__ */ r(() => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], "scaleAlignPrimaryAxis"), oe = /* @__PURE__ */ r(() => ["start", "end", "center", "stretch", "center-safe", "end-safe"], "scaleAlignSecondaryAxis"), Y = /* @__PURE__ */ r(() => ["auto", ...w()], "scaleMargin"), g = /* @__PURE__ */ r(() => [Ae, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...w()], "scaleSizing"), u = /* @__PURE__ */ r(() => [e, v, p], "scaleColor"), j = /* @__PURE__ */ r(() => [...ce(), xt, vt, {
+  }, ye, v, p], "scaleGridColRowStartAndEnd"), Se = /* @__PURE__ */ r(() => [ye, "auto", v, p], "scaleGridColRowStartOrEnd"), Re = /* @__PURE__ */ r(() => ["auto", "min", "max", "fr", v, p], "scaleGridAutoColsRows"), De = /* @__PURE__ */ r(() => ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe"], "scaleAlignPrimaryAxis"), ae = /* @__PURE__ */ r(() => ["start", "end", "center", "stretch", "center-safe", "end-safe"], "scaleAlignSecondaryAxis"), X = /* @__PURE__ */ r(() => ["auto", ...w()], "scaleMargin"), g = /* @__PURE__ */ r(() => [Ae, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...w()], "scaleSizing"), u = /* @__PURE__ */ r(() => [e, v, p], "scaleColor"), N = /* @__PURE__ */ r(() => [...D(), xt, vt, {
     position: [v, p]
   }], "scaleBgPosition"), S = /* @__PURE__ */ r(() => ["no-repeat", {
     repeat: ["", "x", "y", "space", "round"]
-  }], "scaleBgRepeat"), I = /* @__PURE__ */ r(() => ["auto", "cover", "contain", or, Xo, {
+  }], "scaleBgRepeat"), A = /* @__PURE__ */ r(() => ["auto", "cover", "contain", rr, er, {
     size: [v, p]
-  }], "scaleBgSize"), q = /* @__PURE__ */ r(() => [Ke, Fe, Ce], "scaleGradientStopPosition"), V = /* @__PURE__ */ r(() => [
+  }], "scaleBgSize"), K = /* @__PURE__ */ r(() => [Ke, Fe, Ce], "scaleGradientStopPosition"), P = /* @__PURE__ */ r(() => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
@@ -1481,35 +1486,35 @@ const H = /* @__PURE__ */ r((e) => {
     C,
     v,
     p
-  ], "scaleRadius"), F = /* @__PURE__ */ r(() => ["", $, Fe, Ce], "scaleBorderWidth"), _ = /* @__PURE__ */ r(() => ["solid", "dashed", "dotted", "double"], "scaleLineStyle"), R = /* @__PURE__ */ r(() => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], "scaleBlendMode"), D = /* @__PURE__ */ r(() => [$, Ke, xt, vt], "scaleMaskImagePosition"), de = /* @__PURE__ */ r(() => [
+  ], "scaleRadius"), V = /* @__PURE__ */ r(() => ["", I, Fe, Ce], "scaleBorderWidth"), J = /* @__PURE__ */ r(() => ["solid", "dashed", "dotted", "double"], "scaleLineStyle"), G = /* @__PURE__ */ r(() => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], "scaleBlendMode"), T = /* @__PURE__ */ r(() => [I, Ke, xt, vt], "scaleMaskImagePosition"), ue = /* @__PURE__ */ r(() => [
     // Deprecated since Tailwind CSS v4.0.0
     "",
     "none",
-    A,
+    M,
     v,
     p
-  ], "scaleBlur"), pe = /* @__PURE__ */ r(() => ["none", $, v, p], "scaleRotate"), Q = /* @__PURE__ */ r(() => ["none", $, v, p], "scaleScale"), ve = /* @__PURE__ */ r(() => [$, v, p], "scaleSkew"), we = /* @__PURE__ */ r(() => [Ae, "full", ...w()], "scaleTranslate");
+  ], "scaleBlur"), pe = /* @__PURE__ */ r(() => ["none", I, v, p], "scaleRotate"), te = /* @__PURE__ */ r(() => ["none", I, v, p], "scaleScale"), ve = /* @__PURE__ */ r(() => [I, v, p], "scaleSkew"), we = /* @__PURE__ */ r(() => [Ae, "full", ...w()], "scaleTranslate");
   return {
     cacheSize: 500,
     theme: {
       animate: ["spin", "ping", "pulse", "bounce"],
       aspect: ["video"],
-      blur: [me],
-      breakpoint: [me],
+      blur: [be],
+      breakpoint: [be],
       color: [_o],
-      container: [me],
-      "drop-shadow": [me],
+      container: [be],
+      "drop-shadow": [be],
       ease: ["in", "out", "in-out"],
-      font: [Qo],
+      font: [Xo],
       "font-weight": ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black"],
-      "inset-shadow": [me],
+      "inset-shadow": [be],
       leading: ["none", "tight", "snug", "normal", "relaxed", "loose"],
       perspective: ["dramatic", "near", "normal", "midrange", "distant", "none"],
-      radius: [me],
-      shadow: [me],
-      spacing: ["px", $],
-      text: [me],
-      "text-shadow": [me],
+      radius: [be],
+      shadow: [be],
+      spacing: ["px", I],
+      text: [be],
+      "text-shadow": [be],
       tracking: ["tighter", "tight", "normal", "wide", "wider", "widest"]
     },
     classGroups: {
@@ -1521,7 +1526,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/aspect-ratio
        */
       aspect: [{
-        aspect: ["auto", "square", Ae, p, v, y]
+        aspect: ["auto", "square", Ae, p, v, W]
       }],
       /**
        * Container
@@ -1534,21 +1539,21 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/columns
        */
       columns: [{
-        columns: [$, p, v, l]
+        columns: [I, p, v, l]
       }],
       /**
        * Break After
        * @see https://tailwindcss.com/docs/break-after
        */
       "break-after": [{
-        "break-after": le()
+        "break-after": k()
       }],
       /**
        * Break Before
        * @see https://tailwindcss.com/docs/break-before
        */
       "break-before": [{
-        "break-before": le()
+        "break-before": k()
       }],
       /**
        * Break Inside
@@ -1612,49 +1617,49 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/object-position
        */
       "object-position": [{
-        object: be()
+        object: se()
       }],
       /**
        * Overflow
        * @see https://tailwindcss.com/docs/overflow
        */
       overflow: [{
-        overflow: W()
+        overflow: _()
       }],
       /**
        * Overflow X
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-x": [{
-        "overflow-x": W()
+        "overflow-x": _()
       }],
       /**
        * Overflow Y
        * @see https://tailwindcss.com/docs/overflow
        */
       "overflow-y": [{
-        "overflow-y": W()
+        "overflow-y": _()
       }],
       /**
        * Overscroll Behavior
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       overscroll: [{
-        overscroll: te()
+        overscroll: ne()
       }],
       /**
        * Overscroll Behavior X
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-x": [{
-        "overscroll-x": te()
+        "overscroll-x": ne()
       }],
       /**
        * Overscroll Behavior Y
        * @see https://tailwindcss.com/docs/overscroll-behavior
        */
       "overscroll-y": [{
-        "overscroll-y": te()
+        "overscroll-y": ne()
       }],
       /**
        * Position
@@ -1666,63 +1671,63 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       inset: [{
-        inset: J()
+        inset: ee()
       }],
       /**
        * Right / Left
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-x": [{
-        "inset-x": J()
+        "inset-x": ee()
       }],
       /**
        * Top / Bottom
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       "inset-y": [{
-        "inset-y": J()
+        "inset-y": ee()
       }],
       /**
        * Start
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       start: [{
-        start: J()
+        start: ee()
       }],
       /**
        * End
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       end: [{
-        end: J()
+        end: ee()
       }],
       /**
        * Top
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       top: [{
-        top: J()
+        top: ee()
       }],
       /**
        * Right
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       right: [{
-        right: J()
+        right: ee()
       }],
       /**
        * Bottom
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       bottom: [{
-        bottom: J()
+        bottom: ee()
       }],
       /**
        * Left
        * @see https://tailwindcss.com/docs/top-right-bottom-left
        */
       left: [{
-        left: J()
+        left: ee()
       }],
       /**
        * Visibility
@@ -1765,21 +1770,21 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/flex
        */
       flex: [{
-        flex: [$, Ae, "auto", "initial", "none", p]
+        flex: [I, Ae, "auto", "initial", "none", p]
       }],
       /**
        * Flex Grow
        * @see https://tailwindcss.com/docs/flex-grow
        */
       grow: [{
-        grow: ["", $, v, p]
+        grow: ["", I, v, p]
       }],
       /**
        * Flex Shrink
        * @see https://tailwindcss.com/docs/flex-shrink
        */
       shrink: [{
-        shrink: ["", $, v, p]
+        shrink: ["", I, v, p]
       }],
       /**
        * Order
@@ -1898,14 +1903,14 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/justify-items
        */
       "justify-items": [{
-        "justify-items": [...oe(), "normal"]
+        "justify-items": [...ae(), "normal"]
       }],
       /**
        * Justify Self
        * @see https://tailwindcss.com/docs/justify-self
        */
       "justify-self": [{
-        "justify-self": ["auto", ...oe()]
+        "justify-self": ["auto", ...ae()]
       }],
       /**
        * Align Content
@@ -1919,7 +1924,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/align-items
        */
       "align-items": [{
-        items: [...oe(), {
+        items: [...ae(), {
           baseline: ["", "last"]
         }]
       }],
@@ -1928,7 +1933,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/align-self
        */
       "align-self": [{
-        self: ["auto", ...oe(), {
+        self: ["auto", ...ae(), {
           baseline: ["", "last"]
         }]
       }],
@@ -1944,14 +1949,14 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/place-items
        */
       "place-items": [{
-        "place-items": [...oe(), "baseline"]
+        "place-items": [...ae(), "baseline"]
       }],
       /**
        * Place Self
        * @see https://tailwindcss.com/docs/place-self
        */
       "place-self": [{
-        "place-self": ["auto", ...oe()]
+        "place-self": ["auto", ...ae()]
       }],
       // Spacing
       /**
@@ -2022,63 +2027,63 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/margin
        */
       m: [{
-        m: Y()
+        m: X()
       }],
       /**
        * Margin X
        * @see https://tailwindcss.com/docs/margin
        */
       mx: [{
-        mx: Y()
+        mx: X()
       }],
       /**
        * Margin Y
        * @see https://tailwindcss.com/docs/margin
        */
       my: [{
-        my: Y()
+        my: X()
       }],
       /**
        * Margin Start
        * @see https://tailwindcss.com/docs/margin
        */
       ms: [{
-        ms: Y()
+        ms: X()
       }],
       /**
        * Margin End
        * @see https://tailwindcss.com/docs/margin
        */
       me: [{
-        me: Y()
+        me: X()
       }],
       /**
        * Margin Top
        * @see https://tailwindcss.com/docs/margin
        */
       mt: [{
-        mt: Y()
+        mt: X()
       }],
       /**
        * Margin Right
        * @see https://tailwindcss.com/docs/margin
        */
       mr: [{
-        mr: Y()
+        mr: X()
       }],
       /**
        * Margin Bottom
        * @see https://tailwindcss.com/docs/margin
        */
       mb: [{
-        mb: Y()
+        mb: X()
       }],
       /**
        * Margin Left
        * @see https://tailwindcss.com/docs/margin
        */
       ml: [{
-        ml: Y()
+        ml: X()
       }],
       /**
        * Space Between X
@@ -2147,7 +2152,7 @@ const H = /* @__PURE__ */ r((e) => {
           "prose",
           /** Deprecated since Tailwind CSS v4.0.0. @see https://github.com/tailwindlabs/tailwindcss.com/issues/2027#issuecomment-2620152757 */
           {
-            screen: [n]
+            screen: [a]
           },
           ...g()
         ]
@@ -2198,7 +2203,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/font-weight
        */
       "font-weight": [{
-        font: [o, v, _e]
+        font: [o, v, Ze]
       }],
       /**
        * Font Stretch
@@ -2212,7 +2217,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/font-family
        */
       "font-family": [{
-        font: [tr, p, a]
+        font: [or, p, n]
       }],
       /**
        * Font Variant Numeric
@@ -2256,7 +2261,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/line-clamp
        */
       "line-clamp": [{
-        "line-clamp": [$, "none", v, _e]
+        "line-clamp": [I, "none", v, Ze]
       }],
       /**
        * Line Height
@@ -2322,14 +2327,14 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/text-decoration-style
        */
       "text-decoration-style": [{
-        decoration: [..._(), "wavy"]
+        decoration: [...J(), "wavy"]
       }],
       /**
        * Text Decoration Thickness
        * @see https://tailwindcss.com/docs/text-decoration-thickness
        */
       "text-decoration-thickness": [{
-        decoration: [$, "from-font", "auto", v, Ce]
+        decoration: [I, "from-font", "auto", v, Ce]
       }],
       /**
        * Text Decoration Color
@@ -2343,7 +2348,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/text-underline-offset
        */
       "underline-offset": [{
-        "underline-offset": [$, "auto", v, p]
+        "underline-offset": [I, "auto", v, p]
       }],
       /**
        * Text Transform
@@ -2440,7 +2445,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/background-position
        */
       "bg-position": [{
-        bg: j()
+        bg: N()
       }],
       /**
        * Background Repeat
@@ -2454,7 +2459,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/background-size
        */
       "bg-size": [{
-        bg: I()
+        bg: A()
       }],
       /**
        * Background Image
@@ -2467,7 +2472,7 @@ const H = /* @__PURE__ */ r((e) => {
           }, ye, v, p],
           radial: ["", v, p],
           conic: [ye, v, p]
-        }, rr, er]
+        }, sr, tr]
       }],
       /**
        * Background Color
@@ -2481,21 +2486,21 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-from-pos": [{
-        from: q()
+        from: K()
       }],
       /**
        * Gradient Color Stops Via Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-via-pos": [{
-        via: q()
+        via: K()
       }],
       /**
        * Gradient Color Stops To Position
        * @see https://tailwindcss.com/docs/gradient-color-stops
        */
       "gradient-to-pos": [{
-        to: q()
+        to: K()
       }],
       /**
        * Gradient Color Stops From
@@ -2526,175 +2531,175 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/border-radius
        */
       rounded: [{
-        rounded: V()
+        rounded: P()
       }],
       /**
        * Border Radius Start
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-s": [{
-        "rounded-s": V()
+        "rounded-s": P()
       }],
       /**
        * Border Radius End
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-e": [{
-        "rounded-e": V()
+        "rounded-e": P()
       }],
       /**
        * Border Radius Top
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-t": [{
-        "rounded-t": V()
+        "rounded-t": P()
       }],
       /**
        * Border Radius Right
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-r": [{
-        "rounded-r": V()
+        "rounded-r": P()
       }],
       /**
        * Border Radius Bottom
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-b": [{
-        "rounded-b": V()
+        "rounded-b": P()
       }],
       /**
        * Border Radius Left
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-l": [{
-        "rounded-l": V()
+        "rounded-l": P()
       }],
       /**
        * Border Radius Start Start
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-ss": [{
-        "rounded-ss": V()
+        "rounded-ss": P()
       }],
       /**
        * Border Radius Start End
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-se": [{
-        "rounded-se": V()
+        "rounded-se": P()
       }],
       /**
        * Border Radius End End
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-ee": [{
-        "rounded-ee": V()
+        "rounded-ee": P()
       }],
       /**
        * Border Radius End Start
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-es": [{
-        "rounded-es": V()
+        "rounded-es": P()
       }],
       /**
        * Border Radius Top Left
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-tl": [{
-        "rounded-tl": V()
+        "rounded-tl": P()
       }],
       /**
        * Border Radius Top Right
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-tr": [{
-        "rounded-tr": V()
+        "rounded-tr": P()
       }],
       /**
        * Border Radius Bottom Right
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-br": [{
-        "rounded-br": V()
+        "rounded-br": P()
       }],
       /**
        * Border Radius Bottom Left
        * @see https://tailwindcss.com/docs/border-radius
        */
       "rounded-bl": [{
-        "rounded-bl": V()
+        "rounded-bl": P()
       }],
       /**
        * Border Width
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w": [{
-        border: F()
+        border: V()
       }],
       /**
        * Border Width X
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-x": [{
-        "border-x": F()
+        "border-x": V()
       }],
       /**
        * Border Width Y
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-y": [{
-        "border-y": F()
+        "border-y": V()
       }],
       /**
        * Border Width Start
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-s": [{
-        "border-s": F()
+        "border-s": V()
       }],
       /**
        * Border Width End
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-e": [{
-        "border-e": F()
+        "border-e": V()
       }],
       /**
        * Border Width Top
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-t": [{
-        "border-t": F()
+        "border-t": V()
       }],
       /**
        * Border Width Right
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-r": [{
-        "border-r": F()
+        "border-r": V()
       }],
       /**
        * Border Width Bottom
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-b": [{
-        "border-b": F()
+        "border-b": V()
       }],
       /**
        * Border Width Left
        * @see https://tailwindcss.com/docs/border-width
        */
       "border-w-l": [{
-        "border-l": F()
+        "border-l": V()
       }],
       /**
        * Divide Width X
        * @see https://tailwindcss.com/docs/border-width#between-children
        */
       "divide-x": [{
-        "divide-x": F()
+        "divide-x": V()
       }],
       /**
        * Divide Width X Reverse
@@ -2706,7 +2711,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/border-width#between-children
        */
       "divide-y": [{
-        "divide-y": F()
+        "divide-y": V()
       }],
       /**
        * Divide Width Y Reverse
@@ -2718,14 +2723,14 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/border-style
        */
       "border-style": [{
-        border: [..._(), "hidden", "none"]
+        border: [...J(), "hidden", "none"]
       }],
       /**
        * Divide Style
        * @see https://tailwindcss.com/docs/border-style#setting-the-divider-style
        */
       "divide-style": [{
-        divide: [..._(), "hidden", "none"]
+        divide: [...J(), "hidden", "none"]
       }],
       /**
        * Border Color
@@ -2802,21 +2807,21 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/outline-style
        */
       "outline-style": [{
-        outline: [..._(), "none", "hidden"]
+        outline: [...J(), "none", "hidden"]
       }],
       /**
        * Outline Offset
        * @see https://tailwindcss.com/docs/outline-offset
        */
       "outline-offset": [{
-        "outline-offset": [$, v, p]
+        "outline-offset": [I, v, p]
       }],
       /**
        * Outline Width
        * @see https://tailwindcss.com/docs/outline-width
        */
       "outline-w": [{
-        outline: ["", $, Fe, Ce]
+        outline: ["", I, Fe, Ce]
       }],
       /**
        * Outline Color
@@ -2868,7 +2873,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-a-ring
        */
       "ring-w": [{
-        ring: F()
+        ring: V()
       }],
       /**
        * Ring Width Inset
@@ -2891,7 +2896,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://github.com/tailwindlabs/tailwindcss/blob/v4.0.0/packages/tailwindcss/src/utilities.ts#L4158
        */
       "ring-offset-w": [{
-        "ring-offset": [$, Ce]
+        "ring-offset": [I, Ce]
       }],
       /**
        * Ring Offset Color
@@ -2907,7 +2912,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/box-shadow#adding-an-inset-ring
        */
       "inset-ring-w": [{
-        "inset-ring": F()
+        "inset-ring": V()
       }],
       /**
        * Inset Ring Color
@@ -2935,21 +2940,21 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/opacity
        */
       opacity: [{
-        opacity: [$, v, p]
+        opacity: [I, v, p]
       }],
       /**
        * Mix Blend Mode
        * @see https://tailwindcss.com/docs/mix-blend-mode
        */
       "mix-blend": [{
-        "mix-blend": [...R(), "plus-darker", "plus-lighter"]
+        "mix-blend": [...G(), "plus-darker", "plus-lighter"]
       }],
       /**
        * Background Blend Mode
        * @see https://tailwindcss.com/docs/background-blend-mode
        */
       "bg-blend": [{
-        "bg-blend": R()
+        "bg-blend": G()
       }],
       /**
        * Mask Clip
@@ -2970,13 +2975,13 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/mask-image
        */
       "mask-image-linear-pos": [{
-        "mask-linear": [$]
+        "mask-linear": [I]
       }],
       "mask-image-linear-from-pos": [{
-        "mask-linear-from": D()
+        "mask-linear-from": T()
       }],
       "mask-image-linear-to-pos": [{
-        "mask-linear-to": D()
+        "mask-linear-to": T()
       }],
       "mask-image-linear-from-color": [{
         "mask-linear-from": u()
@@ -2985,10 +2990,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-linear-to": u()
       }],
       "mask-image-t-from-pos": [{
-        "mask-t-from": D()
+        "mask-t-from": T()
       }],
       "mask-image-t-to-pos": [{
-        "mask-t-to": D()
+        "mask-t-to": T()
       }],
       "mask-image-t-from-color": [{
         "mask-t-from": u()
@@ -2997,10 +3002,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-t-to": u()
       }],
       "mask-image-r-from-pos": [{
-        "mask-r-from": D()
+        "mask-r-from": T()
       }],
       "mask-image-r-to-pos": [{
-        "mask-r-to": D()
+        "mask-r-to": T()
       }],
       "mask-image-r-from-color": [{
         "mask-r-from": u()
@@ -3009,10 +3014,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-r-to": u()
       }],
       "mask-image-b-from-pos": [{
-        "mask-b-from": D()
+        "mask-b-from": T()
       }],
       "mask-image-b-to-pos": [{
-        "mask-b-to": D()
+        "mask-b-to": T()
       }],
       "mask-image-b-from-color": [{
         "mask-b-from": u()
@@ -3021,10 +3026,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-b-to": u()
       }],
       "mask-image-l-from-pos": [{
-        "mask-l-from": D()
+        "mask-l-from": T()
       }],
       "mask-image-l-to-pos": [{
-        "mask-l-to": D()
+        "mask-l-to": T()
       }],
       "mask-image-l-from-color": [{
         "mask-l-from": u()
@@ -3033,10 +3038,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-l-to": u()
       }],
       "mask-image-x-from-pos": [{
-        "mask-x-from": D()
+        "mask-x-from": T()
       }],
       "mask-image-x-to-pos": [{
-        "mask-x-to": D()
+        "mask-x-to": T()
       }],
       "mask-image-x-from-color": [{
         "mask-x-from": u()
@@ -3045,10 +3050,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-x-to": u()
       }],
       "mask-image-y-from-pos": [{
-        "mask-y-from": D()
+        "mask-y-from": T()
       }],
       "mask-image-y-to-pos": [{
-        "mask-y-to": D()
+        "mask-y-to": T()
       }],
       "mask-image-y-from-color": [{
         "mask-y-from": u()
@@ -3060,10 +3065,10 @@ const H = /* @__PURE__ */ r((e) => {
         "mask-radial": [v, p]
       }],
       "mask-image-radial-from-pos": [{
-        "mask-radial-from": D()
+        "mask-radial-from": T()
       }],
       "mask-image-radial-to-pos": [{
-        "mask-radial-to": D()
+        "mask-radial-to": T()
       }],
       "mask-image-radial-from-color": [{
         "mask-radial-from": u()
@@ -3081,16 +3086,16 @@ const H = /* @__PURE__ */ r((e) => {
         }]
       }],
       "mask-image-radial-pos": [{
-        "mask-radial-at": ce()
+        "mask-radial-at": D()
       }],
       "mask-image-conic-pos": [{
-        "mask-conic": [$]
+        "mask-conic": [I]
       }],
       "mask-image-conic-from-pos": [{
-        "mask-conic-from": D()
+        "mask-conic-from": T()
       }],
       "mask-image-conic-to-pos": [{
-        "mask-conic-to": D()
+        "mask-conic-to": T()
       }],
       "mask-image-conic-from-color": [{
         "mask-conic-from": u()
@@ -3117,7 +3122,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/mask-position
        */
       "mask-position": [{
-        mask: j()
+        mask: N()
       }],
       /**
        * Mask Repeat
@@ -3131,7 +3136,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/mask-size
        */
       "mask-size": [{
-        mask: I()
+        mask: A()
       }],
       /**
        * Mask Type
@@ -3168,21 +3173,21 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/blur
        */
       blur: [{
-        blur: de()
+        blur: ue()
       }],
       /**
        * Brightness
        * @see https://tailwindcss.com/docs/brightness
        */
       brightness: [{
-        brightness: [$, v, p]
+        brightness: [I, v, p]
       }],
       /**
        * Contrast
        * @see https://tailwindcss.com/docs/contrast
        */
       contrast: [{
-        contrast: [$, v, p]
+        contrast: [I, v, p]
       }],
       /**
        * Drop Shadow
@@ -3193,7 +3198,7 @@ const H = /* @__PURE__ */ r((e) => {
           // Deprecated since Tailwind CSS v4.0.0
           "",
           "none",
-          z,
+          $,
           He,
           Oe
         ]
@@ -3210,35 +3215,35 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/grayscale
        */
       grayscale: [{
-        grayscale: ["", $, v, p]
+        grayscale: ["", I, v, p]
       }],
       /**
        * Hue Rotate
        * @see https://tailwindcss.com/docs/hue-rotate
        */
       "hue-rotate": [{
-        "hue-rotate": [$, v, p]
+        "hue-rotate": [I, v, p]
       }],
       /**
        * Invert
        * @see https://tailwindcss.com/docs/invert
        */
       invert: [{
-        invert: ["", $, v, p]
+        invert: ["", I, v, p]
       }],
       /**
        * Saturate
        * @see https://tailwindcss.com/docs/saturate
        */
       saturate: [{
-        saturate: [$, v, p]
+        saturate: [I, v, p]
       }],
       /**
        * Sepia
        * @see https://tailwindcss.com/docs/sepia
        */
       sepia: [{
-        sepia: ["", $, v, p]
+        sepia: ["", I, v, p]
       }],
       /**
        * Backdrop Filter
@@ -3258,63 +3263,63 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/backdrop-blur
        */
       "backdrop-blur": [{
-        "backdrop-blur": de()
+        "backdrop-blur": ue()
       }],
       /**
        * Backdrop Brightness
        * @see https://tailwindcss.com/docs/backdrop-brightness
        */
       "backdrop-brightness": [{
-        "backdrop-brightness": [$, v, p]
+        "backdrop-brightness": [I, v, p]
       }],
       /**
        * Backdrop Contrast
        * @see https://tailwindcss.com/docs/backdrop-contrast
        */
       "backdrop-contrast": [{
-        "backdrop-contrast": [$, v, p]
+        "backdrop-contrast": [I, v, p]
       }],
       /**
        * Backdrop Grayscale
        * @see https://tailwindcss.com/docs/backdrop-grayscale
        */
       "backdrop-grayscale": [{
-        "backdrop-grayscale": ["", $, v, p]
+        "backdrop-grayscale": ["", I, v, p]
       }],
       /**
        * Backdrop Hue Rotate
        * @see https://tailwindcss.com/docs/backdrop-hue-rotate
        */
       "backdrop-hue-rotate": [{
-        "backdrop-hue-rotate": [$, v, p]
+        "backdrop-hue-rotate": [I, v, p]
       }],
       /**
        * Backdrop Invert
        * @see https://tailwindcss.com/docs/backdrop-invert
        */
       "backdrop-invert": [{
-        "backdrop-invert": ["", $, v, p]
+        "backdrop-invert": ["", I, v, p]
       }],
       /**
        * Backdrop Opacity
        * @see https://tailwindcss.com/docs/backdrop-opacity
        */
       "backdrop-opacity": [{
-        "backdrop-opacity": [$, v, p]
+        "backdrop-opacity": [I, v, p]
       }],
       /**
        * Backdrop Saturate
        * @see https://tailwindcss.com/docs/backdrop-saturate
        */
       "backdrop-saturate": [{
-        "backdrop-saturate": [$, v, p]
+        "backdrop-saturate": [I, v, p]
       }],
       /**
        * Backdrop Sepia
        * @see https://tailwindcss.com/docs/backdrop-sepia
        */
       "backdrop-sepia": [{
-        "backdrop-sepia": ["", $, v, p]
+        "backdrop-sepia": ["", I, v, p]
       }],
       // --------------
       // --- Tables ---
@@ -3383,28 +3388,28 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/transition-duration
        */
       duration: [{
-        duration: [$, "initial", v, p]
+        duration: [I, "initial", v, p]
       }],
       /**
        * Transition Timing Function
        * @see https://tailwindcss.com/docs/transition-timing-function
        */
       ease: [{
-        ease: ["linear", "initial", T, v, p]
+        ease: ["linear", "initial", Z, v, p]
       }],
       /**
        * Transition Delay
        * @see https://tailwindcss.com/docs/transition-delay
        */
       delay: [{
-        delay: [$, v, p]
+        delay: [I, v, p]
       }],
       /**
        * Animation
        * @see https://tailwindcss.com/docs/animation
        */
       animate: [{
-        animate: ["none", ie, v, p]
+        animate: ["none", B, v, p]
       }],
       // ------------------
       // --- Transforms ---
@@ -3421,14 +3426,14 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/perspective
        */
       perspective: [{
-        perspective: [M, v, p]
+        perspective: [j, v, p]
       }],
       /**
        * Perspective Origin
        * @see https://tailwindcss.com/docs/perspective-origin
        */
       "perspective-origin": [{
-        "perspective-origin": be()
+        "perspective-origin": se()
       }],
       /**
        * Rotate
@@ -3463,28 +3468,28 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/scale
        */
       scale: [{
-        scale: Q()
+        scale: te()
       }],
       /**
        * Scale X
        * @see https://tailwindcss.com/docs/scale
        */
       "scale-x": [{
-        "scale-x": Q()
+        "scale-x": te()
       }],
       /**
        * Scale Y
        * @see https://tailwindcss.com/docs/scale
        */
       "scale-y": [{
-        "scale-y": Q()
+        "scale-y": te()
       }],
       /**
        * Scale Z
        * @see https://tailwindcss.com/docs/scale
        */
       "scale-z": [{
-        "scale-z": Q()
+        "scale-z": te()
       }],
       /**
        * Scale 3D
@@ -3524,7 +3529,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/transform-origin
        */
       "transform-origin": [{
-        origin: be()
+        origin: se()
       }],
       /**
        * Transform Style
@@ -3841,7 +3846,7 @@ const H = /* @__PURE__ */ r((e) => {
        * @see https://tailwindcss.com/docs/stroke-width
        */
       "stroke-w": [{
-        stroke: [$, Fe, Ce, _e]
+        stroke: [I, Fe, Ce, Ze]
       }],
       /**
        * Stroke
@@ -3916,7 +3921,7 @@ const H = /* @__PURE__ */ r((e) => {
     },
     orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
   };
-}, "getDefaultConfig"), ir = /* @__PURE__ */ Go(ar), yt = {
+}, "getDefaultConfig"), lr = /* @__PURE__ */ Oo(ir), yt = {
   default: {
     solid: {
       base: "bg-theme-0 dark:bg-theme-700/40 text-theme-600 dark:text-theme-50",
@@ -4202,10 +4207,10 @@ const H = /* @__PURE__ */ r((e) => {
       icon: "text-red-600 dark:text-red-400"
     }
   }
-}, lr = {
+}, cr = {
   key: 0,
   class: "absolute inset-0 flex items-center justify-center"
-}, kt = /* @__PURE__ */ O({
+}, kt = /* @__PURE__ */ H({
   __name: "FButton",
   props: {
     theme: { default: "default" },
@@ -4220,20 +4225,20 @@ const H = /* @__PURE__ */ r((e) => {
     class: { default: "" }
   },
   setup(e) {
-    const a = L(() => ({
+    const n = z(() => ({
       icon: typeof e.icon == "string" ? e.icon : e.icon?.className,
       iconAfter: typeof e.iconAfter == "string" ? e.iconAfter : e.iconAfter?.className
-    })), t = L(() => e.href ? "a" : e.tag), o = L(() => ({
+    })), t = z(() => e.href ? "a" : e.tag), o = z(() => ({
       xxs: "size-2.5",
       xs: "size-3",
       sm: "size-3.5",
       md: "size-4",
       lg: "size-5",
       xl: "size-6"
-    })[e.size]), s = L(() => {
+    })[e.size]), s = z(() => {
       const l = yt[e.theme]?.[e.design] || yt.default[e.design];
       return l || console.warn(`FButton: No theme configuration found for theme "${e.theme}" and design "${e.design}". Falling back to default solid theme.`), l || { base: "", border: "", hover: "", icon: "" };
-    }), i = L(() => {
+    }), i = z(() => {
       const l = "relative inline-flex items-center justify-center gap-2 font-medium transition-all duration-200 focus:outline-none active:opacity-80 cursor-pointer", d = {
         xxs: "px-2 py-0.5 text-[10px]",
         xs: "px-3 py-1 text-[11px]",
@@ -4254,73 +4259,73 @@ const H = /* @__PURE__ */ r((e) => {
         `border ${h.border}`,
         h.hover
       ].filter(Boolean).join(" ");
-      return ir(x, e.class);
-    }), n = L(() => ({
+      return lr(x, e.class);
+    }), a = z(() => ({
       design: s.value.icon || ""
     }));
-    return (l, d) => (f(), ne(Zt(t.value), {
+    return (l, d) => (f(), ce(_t(t.value), {
       href: e.href,
       class: E(i.value)
     }, {
-      default: ee(() => [
-        e.loading ? (f(), b("div", lr, [
-          G(ot, {
+      default: re(() => [
+        e.loading ? (f(), b("div", cr, [
+          O(ot, {
             class: E(o.value)
           }, null, 8, ["class"])
-        ])) : P("", !0),
+        ])) : L("", !0),
         c("span", {
           class: E(["flex items-center gap-2 transition-opacity duration-200 whitespace-nowrap", e.loading ? "opacity-0" : "opacity-100"])
         }, [
-          a.value.icon ? (f(), b("span", {
+          n.value.icon ? (f(), b("span", {
             key: 0,
-            class: E(["flex items-center size-[1.1em] mt-[-.07em]", [a.value.icon, n.value]])
-          }, null, 2)) : P("", !0),
+            class: E(["flex items-center size-[1.1em] mt-[-.07em]", [n.value.icon, a.value]])
+          }, null, 2)) : L("", !0),
           $e(l.$slots, "default"),
-          a.value.iconAfter ? (f(), b("span", {
+          n.value.iconAfter ? (f(), b("span", {
             key: 1,
-            class: E(["flex items-center size-[1.1em] mt-[-.07em]", [a.value.iconAfter, n.value]])
-          }, null, 2)) : P("", !0)
+            class: E(["flex items-center size-[1.1em] mt-[-.07em]", [n.value.iconAfter, a.value]])
+          }, null, 2)) : L("", !0)
         ], 2)
       ]),
       _: 3
     }, 8, ["href", "class"]));
   }
-}), cr = { class: "flex-1 flex flex-col min-h-0 py-6 space-y-6 h-full overflow-scroll [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden relative" }, dr = { class: "flex-1 space-y-6 pb-12" }, ur = {
+}), dr = { class: "flex-1 flex flex-col min-h-0 py-6 space-y-6 h-full overflow-scroll [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden relative" }, ur = { class: "flex-1 space-y-6 pb-12" }, hr = {
   key: 0,
   class: "text-sm bg-white/10 backdrop-blur-sm rounded-2xl p-4 border border-white/20 space-y-3"
-}, hr = { class: "font-light text-white/80 italic leading-relaxed font-serif" }, fr = ["innerHTML"], gr = {
+}, fr = { class: "font-light text-white/80 italic leading-relaxed font-serif" }, gr = ["innerHTML"], mr = {
   key: 1,
   class: "bg-white/5 backdrop-blur-sm rounded-2xl p-4 border border-white/10"
-}, mr = { class: "text-sm text-white/70 leading-relaxed" }, br = {
+}, br = { class: "text-sm text-white/70 leading-relaxed" }, pr = {
   key: 2,
   class: "space-y-3"
-}, pr = {
+}, vr = {
   key: 3,
   class: "space-y-3"
-}, vr = { class: "grid grid-cols-2 gap-3" }, xr = /* @__PURE__ */ O({
+}, xr = { class: "grid grid-cols-2 gap-3" }, yr = /* @__PURE__ */ H({
   __name: "ElSelfAbout",
   props: {
     self: {}
   },
   setup(e) {
-    return (a, t) => (f(), b("div", cr, [
-      G(st, { self: e.self }, null, 8, ["self"]),
-      c("div", dr, [
-        e.self.summary ? (f(), b("div", ur, [
+    return (n, t) => (f(), b("div", dr, [
+      O(st, { self: e.self }, null, 8, ["self"]),
+      c("div", ur, [
+        e.self.summary ? (f(), b("div", hr, [
           t[0] || (t[0] = c("h3", { class: "font-medium text-white/50" }, " About ", -1)),
-          c("p", hr, ' "' + U(e.self.headline) + '" ', 1),
+          c("p", fr, ' "' + q(e.self.headline) + '" ', 1),
           c("div", {
             class: "text-white/70 leading-relaxed",
             innerHTML: e.self.summary
-          }, null, 8, fr)
-        ])) : P("", !0),
-        e.self.entityType === "company" ? (f(), b("div", gr, [
+          }, null, 8, gr)
+        ])) : L("", !0),
+        e.self.entityType === "company" ? (f(), b("div", mr, [
           t[1] || (t[1] = c("h3", { class: "text-sm font-medium text-white/90 mb-2" }, " Company Info ", -1)),
-          c("p", mr, " This is a company digital self representing " + U(e.self.name) + ". ", 1)
-        ])) : P("", !0),
-        e.self.email ? (f(), b("div", br, [
+          c("p", br, " This is a company digital self representing " + q(e.self.name) + ". ", 1)
+        ])) : L("", !0),
+        e.self.email ? (f(), b("div", pr, [
           t[3] || (t[3] = c("h3", { class: "text-sm font-medium text-white/90" }, " Contact ", -1)),
-          G(kt, {
+          O(kt, {
             design: "ghost",
             theme: "default",
             size: "sm",
@@ -4329,55 +4334,55 @@ const H = /* @__PURE__ */ r((e) => {
             href: `mailto:${e.self.email}`,
             target: "_blank"
           }, {
-            default: ee(() => [...t[2] || (t[2] = [
+            default: re(() => [...t[2] || (t[2] = [
               ze(" Email ", -1)
             ])]),
             _: 1
           }, 8, ["href"])
-        ])) : P("", !0),
-        e.self.accounts && e.self.accounts.length > 0 ? (f(), b("div", pr, [
+        ])) : L("", !0),
+        e.self.accounts && e.self.accounts.length > 0 ? (f(), b("div", vr, [
           t[4] || (t[4] = c("h3", { class: "text-sm font-medium text-white/90" }, " Links ", -1)),
-          c("div", vr, [
-            (f(!0), b(ke, null, Be(e.self.accounts, (o) => (f(), ne(kt, {
+          c("div", xr, [
+            (f(!0), b(ke, null, Be(e.self.accounts, (o) => (f(), ce(kt, {
               key: `${o.platform}-${o.handle}`,
               design: "ghost",
               theme: "default",
               size: "md",
               class: "bg-white/10 hover:bg-white/20 border border-white/20 text-white/80",
-              icon: K(Ie)[o.platform].icon,
-              href: K(Ie)[o.platform].getUrl(o.handle),
+              icon: Y(Ie)[o.platform].icon,
+              href: Y(Ie)[o.platform].getUrl(o.handle),
               target: "_blank"
             }, {
-              default: ee(() => [
-                ze(U(K(Ie)[o.platform].label), 1)
+              default: re(() => [
+                ze(q(Y(Ie)[o.platform].label), 1)
               ]),
               _: 2
             }, 1032, ["icon", "href"]))), 128))
           ])
-        ])) : P("", !0)
+        ])) : L("", !0)
       ])
     ]));
   }
-}), yr = { class: "flex flex-col h-full relative" }, kr = { class: "pb-4" }, wr = {
+}), kr = { class: "flex flex-col h-full relative" }, wr = { class: "pb-4" }, Cr = {
   key: 0,
   class: "text-theme-600 py-16 flex flex-col items-center justify-center gap-2 text-sm"
-}, Cr = {
+}, Sr = {
   key: 0,
   class: "flex-shrink-0 size-8"
-}, Sr = ["src", "alt"], Mr = { class: "max-w-[70%]" }, Ar = { class: "text-sm leading-[1.5] whitespace-pre-wrap break-words" }, Ir = {
+}, Mr = ["src", "alt"], Ar = { class: "max-w-[70%]" }, Ir = { class: "text-sm leading-[1.5] whitespace-pre-wrap break-words" }, $r = {
   key: 0,
   class: "flex gap-2 justify-start items-end mb-4"
-}, $r = { class: "flex-shrink-0" }, zr = ["src", "alt"], Er = { class: "flex-shrink-0 pt-6 pb-2" }, Tr = ["placeholder", "disabled"], Lr = /* @__PURE__ */ O({
+}, zr = { class: "flex-shrink-0" }, Er = ["src", "alt"], Tr = { class: "flex-shrink-0 pt-6 pb-2" }, Lr = ["placeholder", "disabled"], Dr = /* @__PURE__ */ H({
   __name: "ElSelfChat",
   props: {
     selfController: {},
     self: {}
   },
   setup(e) {
-    const a = N(""), t = N(), o = N(), s = L(() => Ye(e.self));
+    const n = R(""), t = R(), o = R(), s = z(() => Ye(e.self));
     function i(m, h) {
-      const x = m[h], z = m[h + 1];
-      return !z || z.sender !== x.sender;
+      const x = m[h], $ = m[h + 1];
+      return !$ || $.sender !== x.sender;
     }
     r(i, "shouldShowAvatar"), Ee(async () => {
       if (e.selfController && !e.selfController.textState.value.isConnected)
@@ -4387,20 +4392,20 @@ const H = /* @__PURE__ */ r((e) => {
           console.error("Failed to start text conversation:", m);
         }
     });
-    async function n() {
-      if (!a.value.trim() || !e.selfController || !e.selfController.textState.value.isConnected)
+    async function a() {
+      if (!n.value.trim() || !e.selfController || !e.selfController.textState.value.isConnected)
         return;
-      const m = a.value;
-      a.value = "", o.value && (o.value.style.height = "auto", o.value.focus());
+      const m = n.value;
+      n.value = "", o.value && (o.value.style.height = "auto", o.value.focus());
       try {
         await e.selfController.sendChatMessage(m), d();
       } catch (h) {
         console.error("Error sending message:", h);
       }
     }
-    r(n, "sendMessage");
+    r(a, "sendMessage");
     function l(m) {
-      m.key === "Enter" && !m.shiftKey && (m.preventDefault(), n());
+      m.key === "Enter" && !m.shiftKey && (m.preventDefault(), a());
     }
     r(l, "handleKeydown");
     function d() {
@@ -4417,96 +4422,96 @@ const H = /* @__PURE__ */ r((e) => {
       const m = Math.min(o.value.scrollHeight, 150);
       o.value.style.height = `${m}px`;
     }
-    return r(C, "adjustTextareaHeight"), ae(a, () => {
+    return r(C, "adjustTextareaHeight"), de(n, () => {
       We(() => C());
-    }), ae(() => e.selfController?.sharedMessages.value, (m) => {
+    }), de(() => e.selfController?.sharedMessages.value, (m) => {
       m && m.length > 0 && We(() => d());
-    }, { immediate: !0, deep: !0 }), (m, h) => (f(), b("div", yr, [
-      c("div", kr, [
-        G(st, { self: e.self }, null, 8, ["self"])
+    }, { immediate: !0, deep: !0 }), (m, h) => (f(), b("div", kr, [
+      c("div", wr, [
+        O(st, { self: e.self }, null, 8, ["self"])
       ]),
-      e.selfController?.textState.value.connectionStatus !== "connected" ? (f(), b("div", wr, [
-        G(ot, { class: "size-4" })
-      ])) : P("", !0),
+      e.selfController?.textState.value.connectionStatus !== "connected" ? (f(), b("div", Cr, [
+        O(ot, { class: "size-4" })
+      ])) : L("", !0),
       c("div", {
         ref_key: "messagesContainer",
         ref: t,
         class: "flex-1 overflow-y-auto overflow-x-hidden py-8 space-y-1 min-h-0 [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden"
       }, [
-        (f(!0), b(ke, null, Be(e.selfController?.sharedMessages.value.filter((x) => x.sender !== "system") ?? [], (x, z) => (f(), b("div", {
+        (f(!0), b(ke, null, Be(e.selfController?.sharedMessages.value.filter((x) => x.sender !== "system") ?? [], (x, $) => (f(), b("div", {
           key: x.id,
           class: E(["flex gap-2 items-end", {
             "justify-end": x.sender === "user",
             "justify-start": x.sender === "agent",
-            "mb-4": i(e.selfController?.sharedMessages.value.filter((A) => A.sender !== "system") ?? [], z)
+            "mb-4": i(e.selfController?.sharedMessages.value.filter((M) => M.sender !== "system") ?? [], $)
           }])
         }, [
-          x.sender === "agent" ? (f(), b("div", Cr, [
-            i(e.selfController?.sharedMessages.value.filter((A) => A.sender !== "system") ?? [], z) ? (f(), b("img", {
+          x.sender === "agent" ? (f(), b("div", Sr, [
+            i(e.selfController?.sharedMessages.value.filter((M) => M.sender !== "system") ?? [], $) ? (f(), b("img", {
               key: 0,
               src: s.value,
               alt: e.self.name,
               class: "size-7 rounded-full object-cover"
-            }, null, 8, Sr)) : P("", !0)
-          ])) : P("", !0),
-          c("div", Mr, [
+            }, null, 8, Mr)) : L("", !0)
+          ])) : L("", !0),
+          c("div", Ar, [
             c("div", {
               class: E(["rounded-2xl px-3.5 py-1.5 backdrop-blur-sm", x.sender === "user" ? "bg-primary-500/80 text-white" : "bg-white/15 text-white/95"])
             }, [
-              c("p", Ar, U(x.text), 1)
+              c("p", Ir, q(x.text), 1)
             ], 2)
           ])
         ], 2))), 128)),
-        e.selfController?.textState.value.isThinking ? (f(), b("div", Ir, [
-          c("div", $r, [
+        e.selfController?.textState.value.isThinking ? (f(), b("div", $r, [
+          c("div", zr, [
             c("img", {
               src: s.value,
               alt: e.self.name,
               class: "size-8 rounded-full object-cover"
-            }, null, 8, zr)
+            }, null, 8, Er)
           ]),
           h[1] || (h[1] = c("div", { class: "rounded-2xl px-4 py-2.5 bg-white/15 backdrop-blur-sm flex items-center" }, [
             c("i", { class: "i-svg-spinners-3-dots-fade size-6 text-white/70" })
           ], -1))
-        ])) : P("", !0)
+        ])) : L("", !0)
       ], 512),
-      c("div", Er, [
+      c("div", Tr, [
         St(c("textarea", {
           ref_key: "textarea",
           ref: o,
-          "onUpdate:modelValue": h[0] || (h[0] = (x) => a.value = x),
+          "onUpdate:modelValue": h[0] || (h[0] = (x) => n.value = x),
           rows: "1",
           placeholder: e.selfController?.textState.value.isConnected ? "Message" : "Connecting...",
           disabled: !e.selfController?.textState.value.isConnected,
           style: { "font-size": "16px", resize: "none" },
           class: "w-full bg-white/10 backdrop-blur-sm border border-white/20 rounded-3xl px-5 py-3 text-white placeholder-white/50 focus:outline-none focus:border-white/40 disabled:opacity-50 overflow-y-auto [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden",
           onKeydown: l
-        }, null, 40, Tr), [
-          [Mt, a.value]
+        }, null, 40, Lr), [
+          [Mt, n.value]
         ]),
         h[2] || (h[2] = c("div", { class: "text-[10px] text-white/40 text-center mt-2" }, " Press Enter to send, Shift+Enter for new line ", -1))
       ])
     ]));
   }
-}), Dr = { class: "flex flex-col items-center text-center gap-4" }, Pr = { class: "relative flex-shrink-0" }, Vr = { class: "w-20 h-20 sm:w-24 sm:h-24 rounded-full overflow-hidden border-4 border-white" }, Fr = ["src", "alt"], Br = { class: "min-w-0" }, jr = { class: "text-3xl font-light text-white mb-2 truncate" }, Nr = { class: "text-base font-light text-white/60 line-clamp-1" }, Rr = /* @__PURE__ */ O({
+}), Pr = { class: "flex flex-col items-center text-center gap-4" }, Vr = { class: "relative flex-shrink-0" }, Fr = { class: "w-20 h-20 sm:w-24 sm:h-24 rounded-full overflow-hidden border-4 border-white" }, Br = ["src", "alt"], jr = { class: "min-w-0" }, Nr = { class: "text-3xl font-light text-white mb-2 truncate" }, Rr = { class: "text-base font-light text-white/60 line-clamp-1" }, Gr = /* @__PURE__ */ H({
   __name: "ElSelfHeader",
   props: {
     self: {}
   },
   setup(e) {
-    function a() {
+    function n() {
       return e.self.avatar?.src ? e.self.avatar.src : qe();
     }
-    return r(a, "getAvatarSrc"), (t, o) => (f(), b("div", Dr, [
-      c("div", Pr, [
-        c("div", Vr, [
+    return r(n, "getAvatarSrc"), (t, o) => (f(), b("div", Pr, [
+      c("div", Vr, [
+        c("div", Fr, [
           c("img", {
-            src: a(),
+            src: n(),
             alt: e.self.name,
             class: "w-full h-full object-cover",
             onError: o[0] || (o[0] = //@ts-ignore
-            (...s) => K(Ue) && K(Ue)(...s))
-          }, null, 40, Fr)
+            (...s) => Y(Ue) && Y(Ue)(...s))
+          }, null, 40, Br)
         ]),
         o[1] || (o[1] = c("div", { class: "absolute top-1.5 right-1.5" }, [
           c("div", {
@@ -4516,49 +4521,49 @@ const H = /* @__PURE__ */ r((e) => {
           c("div", { class: "size-4 bg-green-500 rounded-full ring-2 ring-white" })
         ], -1))
       ]),
-      c("div", Br, [
-        c("h1", jr, U(e.self.name), 1),
-        c("p", Nr, U(e.self.title), 1)
+      c("div", jr, [
+        c("h1", Nr, q(e.self.name), 1),
+        c("p", Rr, q(e.self.title), 1)
       ])
     ]));
   }
-}), Gr = { class: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[28px] h-[28px] overflow-hidden" }, Or = /* @__PURE__ */ O({
+}), Or = { class: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[28px] h-[28px] overflow-hidden" }, Hr = /* @__PURE__ */ H({
   name: "SelfSidebarClose",
   __name: "SelfSidebarClose",
   emits: ["click"],
   setup(e) {
-    const a = N(!1);
+    const n = R(!1);
     return Ee(() => {
       setTimeout(() => {
-        a.value = !0;
+        n.value = !0;
       }, 100);
     }), (t, o) => (f(), b("a", {
       class: "close block cursor-pointer w-[60px] h-[60px] rounded-full transition-all duration-1000 ease-[cubic-bezier(0.25,1,0.33,1)] hover:scale-110 active:scale-90 hover:rotate-90",
       onClick: o[0] || (o[0] = (s) => t.$emit("click", s))
     }, [
       o[1] || (o[1] = c("span", { class: "absolute inset-0 rounded-full transition-all" }, null, -1)),
-      c("span", Gr, [
+      c("span", Or, [
         c("span", {
-          class: E(["absolute h-full w-[3px] rounded-[5px] left-[13px] transition-all duration-[400ms] ease-[cubic-bezier(0.52,0.01,0.16,1)]", a.value ? "translate-y-0 translate-x-0 rotate-45" : "translate-y-[30px] -translate-x-[30px] rotate-0"]),
+          class: E(["absolute h-full w-[3px] rounded-[5px] left-[13px] transition-all duration-[400ms] ease-[cubic-bezier(0.52,0.01,0.16,1)]", n.value ? "translate-y-0 translate-x-0 rotate-45" : "translate-y-[30px] -translate-x-[30px] rotate-0"]),
           style: { "background-color": "currentColor", "transition-delay": "0.15s" }
         }, null, 2),
         c("span", {
-          class: E(["absolute h-full w-[3px] rounded-[5px] left-[13px] transition-all duration-[400ms] ease-[cubic-bezier(0.52,0.01,0.16,1)]", a.value ? "translate-y-0 translate-x-0 -rotate-45" : "-translate-y-[30px] -translate-x-[30px] rotate-0"]),
+          class: E(["absolute h-full w-[3px] rounded-[5px] left-[13px] transition-all duration-[400ms] ease-[cubic-bezier(0.52,0.01,0.16,1)]", n.value ? "translate-y-0 translate-x-0 -rotate-45" : "-translate-y-[30px] -translate-x-[30px] rotate-0"]),
           style: { "background-color": "currentColor", "transition-delay": "0.45s" }
         }, null, 2)
       ])
     ]));
   }
-}), Hr = {
+}), Ur = {
   key: 0,
   class: "px-9 pt-12 pb-4"
-}, Ur = { class: "text-base font-medium text-theme-400" }, qr = {
+}, qr = { class: "text-base font-medium text-theme-400" }, Wr = {
   key: 1,
   class: "px-4 pb-8 border-b border-white/10"
-}, Wr = ["disabled", "onClick"], Kr = { class: "flex items-center gap-3" }, _r = { class: "flex-1" }, Zr = {
+}, Kr = ["disabled", "onClick"], Zr = { class: "flex items-center gap-3" }, _r = { class: "flex-1" }, Yr = {
   key: 0,
   class: "text-xs text-white/50 mt-0.5"
-}, Yr = { class: "p-6" }, Rt = /* @__PURE__ */ O({
+}, Jr = { class: "p-6" }, Rt = /* @__PURE__ */ H({
   name: "ElSidebar",
   __name: "ElSidebar",
   props: {
@@ -4569,16 +4574,16 @@ const H = /* @__PURE__ */ r((e) => {
     widthClasses: {}
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: a }) {
-    const t = e, o = a, s = t.position || "left", i = t.widthClasses || "w-[80%] max-w-[300px]", n = L({
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = t.position || "left", i = t.widthClasses || "w-[80%] max-w-[300px]", a = z({
       get: /* @__PURE__ */ r(() => t.modelValue, "get"),
       set: /* @__PURE__ */ r((m) => o("update:modelValue", m), "set")
-    }), l = L(() => t.items.filter((m) => !m.isHidden));
+    }), l = z(() => t.items.filter((m) => !m.isHidden));
     function d(m) {
-      m.isDisabled || (m.onClick ? m.onClick({ item: m, event: new MouseEvent("click") }) : m.href && (m.href.includes("http") ? window.open(m.href, m.target || "_self")?.focus() : window.location.href = m.href), n.value = !1);
+      m.isDisabled || (m.onClick ? m.onClick({ item: m, event: new MouseEvent("click") }) : m.href && (m.href.includes("http") ? window.open(m.href, m.target || "_self")?.focus() : window.location.href = m.href), a.value = !1);
     }
     r(d, "handleItemClick");
-    const C = L(() => s === "left" ? {
+    const C = z(() => s === "left" ? {
       enter: "-translate-x-full",
       leave: "-translate-x-full",
       position: "justify-start",
@@ -4590,7 +4595,7 @@ const H = /* @__PURE__ */ r((e) => {
       closeButton: "-left-16"
     });
     return (m, h) => (f(), b(ke, null, [
-      G(ut, {
+      O(ut, {
         "enter-active-class": "transition-opacity duration-300 ease-out",
         "leave-active-class": "transition-opacity duration-200 ease-in",
         "enter-from-class": "opacity-0",
@@ -4598,16 +4603,16 @@ const H = /* @__PURE__ */ r((e) => {
         "leave-from-class": "opacity-100",
         "leave-to-class": "opacity-0"
       }, {
-        default: ee(() => [
-          n.value ? (f(), b("div", {
+        default: re(() => [
+          a.value ? (f(), b("div", {
             key: 0,
             class: "absolute inset-0 z-40 bg-black/50 backdrop-blur-sm",
-            onClick: h[0] || (h[0] = (x) => n.value = !1)
-          })) : P("", !0)
+            onClick: h[0] || (h[0] = (x) => a.value = !1)
+          })) : L("", !0)
         ]),
         _: 1
       }),
-      G(ut, {
+      O(ut, {
         "enter-active-class": "transition-all duration-500 ease-[cubic-bezier(0.25,1,0.33,1)]",
         "leave-active-class": "transition-all duration-400 ease-[cubic-bezier(0.25,1,0.33,1)]",
         "enter-from-class": C.value.enter,
@@ -4615,70 +4620,70 @@ const H = /* @__PURE__ */ r((e) => {
         "leave-from-class": "translate-x-0",
         "leave-to-class": C.value.leave
       }, {
-        default: ee(() => [
-          n.value ? (f(), b("div", {
+        default: re(() => [
+          a.value ? (f(), b("div", {
             key: 0,
             class: E(["absolute inset-0 z-50 flex", C.value.position]),
-            onClick: h[3] || (h[3] = (x) => n.value = !1)
+            onClick: h[3] || (h[3] = (x) => a.value = !1)
           }, [
             c("div", {
-              class: E(["relative h-full shadow-2xl bg-black/30 backdrop-blur-xl flex flex-col justify-center", K(i)]),
+              class: E(["relative h-full shadow-2xl bg-black/30 backdrop-blur-xl flex flex-col justify-center", Y(i)]),
               onClick: h[2] || (h[2] = At(() => {
               }, ["stop"]))
             }, [
-              G(Or, {
+              O(Hr, {
                 class: E(["absolute top-4 z-10 text-white", C.value.closeButton]),
-                onClick: h[1] || (h[1] = (x) => n.value = !1)
+                onClick: h[1] || (h[1] = (x) => a.value = !1)
               }, null, 8, ["class"]),
-              e.title ? (f(), b("div", Hr, [
-                c("h3", Ur, U(e.title), 1)
-              ])) : P("", !0),
-              m.$slots.header ? (f(), b("div", qr, [
+              e.title ? (f(), b("div", Ur, [
+                c("h3", qr, q(e.title), 1)
+              ])) : L("", !0),
+              m.$slots.header ? (f(), b("div", Wr, [
                 $e(m.$slots, "header")
-              ])) : P("", !0),
+              ])) : L("", !0),
               c("div", {
                 class: E(["flex-1 p-6 space-y-2 overflow-y-auto", { "pt-6": !e.title && !m.$slots.header, "pt-4": e.title || m.$slots.header }])
               }, [
-                G(Ct, {
+                O(Ct, {
                   "enter-active-class": "transition-all duration-400 ease-[cubic-bezier(0.25,1,0.33,1)]",
                   "leave-active-class": "transition-all duration-200 ease-[cubic-bezier(0.25,1,0.33,1)]",
-                  "enter-from-class": K(s) === "left" ? "-translate-x-4 opacity-0" : "translate-x-4 opacity-0",
+                  "enter-from-class": Y(s) === "left" ? "-translate-x-4 opacity-0" : "translate-x-4 opacity-0",
                   "enter-to-class": "translate-x-0 opacity-100",
                   "leave-from-class": "translate-x-0 opacity-100",
-                  "leave-to-class": K(s) === "left" ? "-translate-x-4 opacity-0" : "translate-x-4 opacity-0"
+                  "leave-to-class": Y(s) === "left" ? "-translate-x-4 opacity-0" : "translate-x-4 opacity-0"
                 }, {
-                  default: ee(() => [
-                    (f(!0), b(ke, null, Be(l.value, (x, z) => (f(), b("button", {
-                      key: x.key || x.label || z,
-                      style: tt({ transitionDelay: `${z * 40}ms` }),
+                  default: re(() => [
+                    (f(!0), b(ke, null, Be(l.value, (x, $) => (f(), b("button", {
+                      key: x.key || x.label || $,
+                      style: tt({ transitionDelay: `${$ * 40}ms` }),
                       class: E(["cursor-pointer w-full text-left p-3 rounded-xl transition-all duration-200 ease-[cubic-bezier(0.25,1,0.33,1)] group", [
                         x.isActive ? "bg-primary-500/20 border border-primary-500/40" : "hover:bg-white/10",
                         x.isDisabled && "opacity-50 cursor-not-allowed"
                       ]]),
                       disabled: x.isDisabled,
-                      onClick: /* @__PURE__ */ r((A) => d(x), "onClick")
+                      onClick: /* @__PURE__ */ r((M) => d(x), "onClick")
                     }, [
-                      c("div", Kr, [
+                      c("div", Zr, [
                         x.icon?.src ? (f(), b("i", {
                           key: 0,
                           class: E(["size-5 flex-shrink-0 transition-transform duration-200 ease-[cubic-bezier(0.25,1,0.33,1)] group-hover:scale-110", [
                             x.icon.src,
                             x.isActive ? "text-primary-400" : "text-white/70 group-hover:text-white"
                           ]])
-                        }, null, 2)) : P("", !0),
+                        }, null, 2)) : L("", !0),
                         c("div", _r, [
                           c("div", {
                             class: E(["font-medium text-sm", x.isActive ? "text-primary-300" : "text-white"])
-                          }, U(x.label), 3),
-                          x.subLabel ? (f(), b("div", Zr, U(x.subLabel), 1)) : P("", !0)
+                          }, q(x.label), 3),
+                          x.subLabel ? (f(), b("div", Yr, q(x.subLabel), 1)) : L("", !0)
                         ])
                       ])
-                    ], 14, Wr))), 128))
+                    ], 14, Kr))), 128))
                   ]),
                   _: 1
                 }, 8, ["enter-from-class", "leave-to-class"])
               ], 2),
-              c("div", Yr, [
+              c("div", Jr, [
                 $e(m.$slots, "footer", {}, () => [
                   h[4] || (h[4] = c("div", { class: "text-center" }, [
                     c("p", { class: "text-[10px] text-white/40 font-sans" }, [
@@ -4693,13 +4698,13 @@ const H = /* @__PURE__ */ r((e) => {
                 ])
               ])
             ], 2)
-          ], 2)) : P("", !0)
+          ], 2)) : L("", !0)
         ]),
         _: 3
       }, 8, ["enter-from-class", "leave-to-class"])
     ], 64));
   }
-}), Jr = /* @__PURE__ */ O({
+}), Qr = /* @__PURE__ */ H({
   name: "SelfModeSidebar",
   __name: "ElSelfModeSidebar",
   props: {
@@ -4707,11 +4712,11 @@ const H = /* @__PURE__ */ r((e) => {
     selfController: {}
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: a }) {
-    const t = e, o = a, s = L({
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = z({
       get: /* @__PURE__ */ r(() => t.modelValue, "get"),
       set: /* @__PURE__ */ r((l) => o("update:modelValue", l), "set")
-    }), i = L(() => t.selfController?.agentMode?.value ?? "self"), n = L(() => zt.map((l) => ({
+    }), i = z(() => t.selfController?.agentMode?.value ?? "self"), a = z(() => zt.map((l) => ({
       key: l.mode,
       icon: { src: l.icon },
       label: l.label,
@@ -4720,16 +4725,16 @@ const H = /* @__PURE__ */ r((e) => {
         t.selfController?.setMode(l.mode);
       }, "onClick")
     })));
-    return (l, d) => (f(), ne(Rt, {
+    return (l, d) => (f(), ce(Rt, {
       modelValue: s.value,
       "onUpdate:modelValue": d[0] || (d[0] = (C) => s.value = C),
-      items: n.value,
+      items: a.value,
       position: "right",
       title: "Mode",
       "width-classes": "w-[80%] max-w-[255px]"
     }, null, 8, ["modelValue", "items"]));
   }
-}), Qr = /* @__PURE__ */ O({
+}), Xr = /* @__PURE__ */ H({
   name: "SelfSidebar",
   __name: "ElSelfSidebar",
   props: {
@@ -4739,12 +4744,12 @@ const H = /* @__PURE__ */ r((e) => {
     title: {}
   },
   emits: ["update:modelValue"],
-  setup(e, { emit: a }) {
-    const t = e, o = a, s = L({
+  setup(e, { emit: n }) {
+    const t = e, o = n, s = z({
       get: /* @__PURE__ */ r(() => t.modelValue, "get"),
-      set: /* @__PURE__ */ r((n) => o("update:modelValue", n), "set")
-    }), i = L(() => {
-      const n = [
+      set: /* @__PURE__ */ r((a) => o("update:modelValue", a), "set")
+    }), i = z(() => {
+      const a = [
         {
           key: "share",
           icon: { src: "i-tabler-share" },
@@ -4771,16 +4776,16 @@ const H = /* @__PURE__ */ r((e) => {
           }, "onClick")
         }
       ];
-      return t.sdk.activeUser.value && n.push({
+      return t.sdk.activeUser.value && a.push({
         key: "logout",
         icon: { src: "i-tabler-logout" },
         label: "Logout",
         onClick: /* @__PURE__ */ r(async () => {
           await t.sdk.logout();
         }, "onClick")
-      }), n;
+      }), a;
     });
-    return (n, l) => (f(), ne(Rt, {
+    return (a, l) => (f(), ce(Rt, {
       modelValue: s.value,
       "onUpdate:modelValue": l[0] || (l[0] = (d) => s.value = d),
       items: i.value,
@@ -4788,7 +4793,7 @@ const H = /* @__PURE__ */ r((e) => {
       title: e.title || "Menu"
     }, null, 8, ["modelValue", "items", "title"]));
   }
-}), Xr = { class: "w-full max-w-full flex items-center justify-center" }, es = 0.25, ts = 0.35, wt = 500, os = 0.15, rs = 0.4, ss = /* @__PURE__ */ O({
+}), es = { class: "w-full max-w-full flex items-center justify-center" }, ts = 0.25, os = 0.35, wt = 500, rs = 0.15, ss = 0.4, ns = /* @__PURE__ */ H({
   __name: "FAudioVisualizer",
   props: {
     audioState: {},
@@ -4798,11 +4803,11 @@ const H = /* @__PURE__ */ r((e) => {
     enableGlow: { type: Boolean, default: !1 }
   },
   setup(e) {
-    const a = e, t = {
+    const n = e, t = {
       sm: { bars: 68, barWidth: 2, barSpacing: 1, minHeight: 3, maxHeight: 40 },
       md: { bars: 68, barWidth: 3, barSpacing: 1, minHeight: 4, maxHeight: 80 },
       lg: { bars: 68, barWidth: 4, barSpacing: 2, minHeight: 5, maxHeight: 120 }
-    }, o = L(() => t[a.size]), s = [
+    }, o = z(() => t[n.size]), s = [
       85,
       100,
       120,
@@ -4871,21 +4876,21 @@ const H = /* @__PURE__ */ r((e) => {
       7500,
       8e3,
       8500
-    ], i = N();
-    let n = null, l = null;
-    const d = N(!1), C = N(!0), m = /* @__PURE__ */ new Map();
-    let h, x, z, A, M, y, T;
-    function ie(g) {
+    ], i = R();
+    let a = null, l = null;
+    const d = R(!1), C = R(!0), m = /* @__PURE__ */ new Map();
+    let h, x, $, M, j, W, Z;
+    function B(g) {
       const { minHeight: u } = o.value;
-      h = new Float32Array(g).fill(u), x = new Float32Array(g).fill(0), z = new Float32Array(g).fill(u), A = new Float32Array(g).fill(u), M = new Float32Array(g).fill(u), y = new Float32Array(g).fill(0), T = new Float32Array(g).fill(0);
+      h = new Float32Array(g).fill(u), x = new Float32Array(g).fill(0), $ = new Float32Array(g).fill(u), M = new Float32Array(g).fill(u), j = new Float32Array(g).fill(u), W = new Float32Array(g).fill(0), Z = new Float32Array(g).fill(0);
     }
-    r(ie, "initPhysicsArrays");
-    const le = L(() => {
-      if (a.color !== "auto")
-        return a.color;
-      const g = a.audioState?.mode ?? "idle";
+    r(B, "initPhysicsArrays");
+    const k = z(() => {
+      if (n.color !== "auto")
+        return n.color;
+      const g = n.audioState?.mode ?? "idle";
       return g === "listening" ? "blue" : g === "processing" ? "cyan" : g === "speaking" ? "green" : "gray";
-    }), ce = {
+    }), D = {
       blue: {
         primary: [59, 130, 246],
         // User speaking
@@ -4907,89 +4912,89 @@ const H = /* @__PURE__ */ r((e) => {
         glow: "rgba(156,163,175,0.2)"
       }
     };
-    function be(g) {
+    function se(g) {
       return g < 200 ? { stiffnessMultiplier: 0.7, dampingMultiplier: 1.2 } : g < 1e3 ? { stiffnessMultiplier: 1, dampingMultiplier: 1 } : g < 4e3 ? { stiffnessMultiplier: 1.3, dampingMultiplier: 0.8 } : { stiffnessMultiplier: 1.5, dampingMultiplier: 0.6 };
     }
-    r(be, "getFrequencyPhysics");
-    let W = 1;
-    function te() {
+    r(se, "getFrequencyPhysics");
+    let _ = 1;
+    function ne() {
       if (!i.value)
         return;
-      typeof window < "u" && (W = Math.max(1, Math.min(2, window.devicePixelRatio || 1)));
-      const { bars: g, barWidth: u, barSpacing: j, maxHeight: S } = o.value, I = (u + j) * g - j, q = S;
-      i.value.width = Math.floor(I * W), i.value.height = Math.floor(q * W), i.value.style.width = `${I}px`, i.value.style.height = `${q}px`, n && n.setTransform(W, 0, 0, W, 0, 0), De();
+      typeof window < "u" && (_ = Math.max(1, Math.min(2, window.devicePixelRatio || 1)));
+      const { bars: g, barWidth: u, barSpacing: N, maxHeight: S } = o.value, A = (u + N) * g - N, K = S;
+      i.value.width = Math.floor(A * _), i.value.height = Math.floor(K * _), i.value.style.width = `${A}px`, i.value.style.height = `${K}px`, a && a.setTransform(_, 0, 0, _, 0, 0), De();
     }
-    r(te, "resizeCanvas");
+    r(ne, "resizeCanvas");
     function w(g) {
-      return Array.from({ length: s.length }, (j, S) => {
-        const I = s[S], V = Math.floor(I / 12e3 * g.length), F = Math.max(1, Math.floor(g.length / s.length / 2));
-        let _ = 0;
-        for (let Q = 0; Q < F && V + Q < g.length; Q++)
-          _ += g[V + Q];
-        _ = _ / F / 255;
-        let R = 1;
-        I < 150 ? R = 0.1 : I < 200 ? R = 0.3 : I >= 400 && I <= 600 ? R = 1.4 : I >= 1400 && I <= 1600 ? R = 1.3 : I >= 2400 && I <= 2600 ? R = 1.2 : I >= 200 && I <= 2e3 ? R = 1.1 : I >= 2e3 && I <= 4e3 ? R = 0.9 : I > 6e3 ? R = 0.4 : R = 0.7;
-        const pe = _ ** 0.5 * 0.6 * R;
+      return Array.from({ length: s.length }, (N, S) => {
+        const A = s[S], P = Math.floor(A / 12e3 * g.length), V = Math.max(1, Math.floor(g.length / s.length / 2));
+        let J = 0;
+        for (let te = 0; te < V && P + te < g.length; te++)
+          J += g[P + te];
+        J = J / V / 255;
+        let G = 1;
+        A < 150 ? G = 0.1 : A < 200 ? G = 0.3 : A >= 400 && A <= 600 ? G = 1.4 : A >= 1400 && A <= 1600 ? G = 1.3 : A >= 2400 && A <= 2600 ? G = 1.2 : A >= 200 && A <= 2e3 ? G = 1.1 : A >= 2e3 && A <= 4e3 ? G = 0.9 : A > 6e3 ? G = 0.4 : G = 0.7;
+        const pe = J ** 0.5 * 0.6 * G;
         return Math.min(0.85, pe);
       });
     }
     r(w, "mapFrequencyDataToBands");
-    function J(g) {
+    function ee(g) {
       const u = Array.from({ length: s.length }, () => 0);
       if (g <= 0)
         return u;
-      for (let j = 0; j < s.length; j++) {
-        const S = s[j];
-        let I = 0;
-        S >= 400 && S <= 600 ? I = g * 0.9 : S >= 1400 && S <= 1600 ? I = g * 0.8 : S >= 2400 && S <= 2600 ? I = g * 0.7 : S >= 200 && S <= 2e3 ? I = g * 0.6 : S >= 85 && S <= 300 ? I = g * 0.4 : I = g * 0.2, I *= 0.8 + Math.random() * 0.4, u[j] = Math.max(0, Math.min(1, I));
+      for (let N = 0; N < s.length; N++) {
+        const S = s[N];
+        let A = 0;
+        S >= 400 && S <= 600 ? A = g * 0.9 : S >= 1400 && S <= 1600 ? A = g * 0.8 : S >= 2400 && S <= 2600 ? A = g * 0.7 : S >= 200 && S <= 2e3 ? A = g * 0.6 : S >= 85 && S <= 300 ? A = g * 0.4 : A = g * 0.2, A *= 0.8 + Math.random() * 0.4, u[N] = Math.max(0, Math.min(1, A));
       }
       return u;
     }
-    r(J, "generateIntensityBasedBands");
-    function je(g, u, j) {
-      if (!a.enableWaveMotion || typeof window > "u")
+    r(ee, "generateIntensityBasedBands");
+    function je(g, u, N) {
+      if (!n.enableWaveMotion || typeof window > "u")
         return g;
-      const S = performance.now() * 1e-3, I = [...g];
-      for (let q = 0; q < g.length; q++) {
-        const V = q * (2 * Math.PI) / g.length;
-        let F = 0;
-        if (j === "listening" || j === "speaking") {
-          const R = Math.sin(S * 4.2 + V * 0.6 - S * 2) * 0.15, D = Math.sin(S * 6.8 + V * 1.2 - S * 1.5) * 0.08, de = Math.sin(S * 0.8) * 0.05;
-          F = R + D + de;
-        } else if (j === "processing") {
-          const R = Math.sin(S * 3 + V * 0.5 - S * 1.5) * 0.12, D = Math.sin(S * 5 + V * 0.8 - S * 1.2) * 0.06, de = Math.sin(S * 0.6) * 0.04;
-          F = R + D + de;
-        } else if (j === "connected") {
-          const R = Math.sin(S * 0.6) * 0.1, D = Math.sin(S * 2 + V * 0.3) * 0.05;
-          F = R + D;
+      const S = performance.now() * 1e-3, A = [...g];
+      for (let K = 0; K < g.length; K++) {
+        const P = K * (2 * Math.PI) / g.length;
+        let V = 0;
+        if (N === "listening" || N === "speaking") {
+          const G = Math.sin(S * 4.2 + P * 0.6 - S * 2) * 0.15, T = Math.sin(S * 6.8 + P * 1.2 - S * 1.5) * 0.08, ue = Math.sin(S * 0.8) * 0.05;
+          V = G + T + ue;
+        } else if (N === "processing") {
+          const G = Math.sin(S * 3 + P * 0.5 - S * 1.5) * 0.12, T = Math.sin(S * 5 + P * 0.8 - S * 1.2) * 0.06, ue = Math.sin(S * 0.6) * 0.04;
+          V = G + T + ue;
+        } else if (N === "connected") {
+          const G = Math.sin(S * 0.6) * 0.1, T = Math.sin(S * 2 + P * 0.3) * 0.05;
+          V = G + T;
         } else {
-          const R = Math.sin(S * 1.5 + V) * 0.12, D = Math.sin(S * 0.4) * 0.05;
-          F = R + D;
+          const G = Math.sin(S * 1.5 + P) * 0.12, T = Math.sin(S * 0.4) * 0.05;
+          V = G + T;
         }
-        const _ = Math.max(0.3, u);
-        I[q] = Math.max(0, Math.min(0.9, g[q] + F * _));
+        const J = Math.max(0.3, u);
+        A[K] = Math.max(0, Math.min(0.9, g[K] + V * J));
       }
-      return I;
+      return A;
     }
     r(je, "addWaveMotionOverlay");
     function Ne() {
-      const g = a.audioState;
+      const g = n.audioState;
       if (!g)
         return Array.from({ length: s.length }, () => 0);
       let u = [];
       if (g.getFrequencyData) {
         const S = g.getFrequencyData();
-        S && S.length > 0 && Array.from(S).some((q) => q > 5) && (u = w(S));
+        S && S.length > 0 && Array.from(S).some((K) => K > 5) && (u = w(S));
       }
       if (!u.length) {
         const S = g.mode === "listening" ? g.inputLevel ?? 0 : g.mode === "speaking" ? g.outputLevel ?? 0 : g.mode === "connected" ? 0.02 : 0;
-        u = J(S);
+        u = ee(S);
       }
-      const j = Math.max(
+      const N = Math.max(
         g.inputLevel ?? 0,
         g.outputLevel ?? 0
       );
-      return je(u, j, g.mode);
+      return je(u, N, g.mode);
     }
     r(Ne, "generateFrequencyBands");
     function Se() {
@@ -5007,101 +5012,101 @@ const H = /* @__PURE__ */ r((e) => {
       m.clear();
     }
     r(De, "clearGradientCache");
-    function oe() {
-      if (typeof window > "u" || !n || !i.value)
+    function ae() {
+      if (typeof window > "u" || !a || !i.value)
         return;
       Se();
-      const g = i.value, { bars: u, barWidth: j, barSpacing: S, minHeight: I, maxHeight: q } = o.value, V = g.width / W, F = g.height / W;
-      function _(R) {
-        if (!n)
+      const g = i.value, { bars: u, barWidth: N, barSpacing: S, minHeight: A, maxHeight: K } = o.value, P = g.width / _, V = g.height / _;
+      function J(G) {
+        if (!a)
           return;
         if (!C.value) {
-          l = requestAnimationFrame(_);
+          l = requestAnimationFrame(J);
           return;
         }
-        n.clearRect(0, 0, V, F);
-        const D = Ne(), de = 0.3;
-        for (let k = 0; k < u; k++) {
-          const ge = I + D[k] * (q - I);
-          A[k] = A[k] + de * (ge - A[k]), z[k] = A[k];
+        a.clearRect(0, 0, P, V);
+        const T = Ne(), ue = 0.3;
+        for (let y = 0; y < u; y++) {
+          const me = A + T[y] * (K - A);
+          M[y] = M[y] + ue * (me - M[y]), $[y] = M[y];
         }
         const pe = 16.67;
-        for (let k = 0; k < u; k++) {
-          const ge = s[k], re = be(ge), se = z[k] - h[k], xe = es * re.stiffnessMultiplier, Me = ts * re.dampingMultiplier, X = se * xe - x[k] * Me;
-          if (x[k] += X, h[k] += x[k], h[k] > M[k])
-            M[k] = h[k], y[k] = wt, T[k] = 0;
-          else if (y[k] = Math.max(0, y[k] - pe), y[k] <= 0) {
-            const Ve = (Math.max(I, h[k] * 1.1) - M[k]) * os - T[k] * rs;
-            T[k] += Ve, M[k] = Math.max(I, M[k] + T[k]);
+        for (let y = 0; y < u; y++) {
+          const me = s[y], ie = se(me), le = $[y] - h[y], xe = ts * ie.stiffnessMultiplier, Me = os * ie.dampingMultiplier, oe = le * xe - x[y] * Me;
+          if (x[y] += oe, h[y] += x[y], h[y] > j[y])
+            j[y] = h[y], W[y] = wt, Z[y] = 0;
+          else if (W[y] = Math.max(0, W[y] - pe), W[y] <= 0) {
+            const Ve = (Math.max(A, h[y] * 1.1) - j[y]) * rs - Z[y] * ss;
+            Z[y] += Ve, j[y] = Math.max(A, j[y] + Z[y]);
           }
         }
-        const Q = u * 0.15, ve = a.audioState?.mode ?? "idle";
-        if ((ve === "listening" || ve === "speaking") && a.enableGlow && !d.value) {
-          const k = performance.now() * 1e-3, ge = 0.1 + Math.sin(k * 2) * 0.05;
-          n.save(), n.globalCompositeOperation = "lighter", n.globalAlpha = ge;
-          const re = ce[le.value];
-          n.fillStyle = re.glow;
-          for (let se = 0; se < u; se++) {
-            const xe = se * (j + S), Me = h[se], X = F - Me;
-            n.beginPath(), n.roundRect(xe - 1, X - 1, j + 2, Me + 2, [2, 2, 0, 0]), n.fill();
+        const te = u * 0.15, ve = n.audioState?.mode ?? "idle";
+        if ((ve === "listening" || ve === "speaking") && n.enableGlow && !d.value) {
+          const y = performance.now() * 1e-3, me = 0.1 + Math.sin(y * 2) * 0.05;
+          a.save(), a.globalCompositeOperation = "lighter", a.globalAlpha = me;
+          const ie = D[k.value];
+          a.fillStyle = ie.glow;
+          for (let le = 0; le < u; le++) {
+            const xe = le * (N + S), Me = h[le], oe = V - Me;
+            a.beginPath(), a.roundRect(xe - 1, oe - 1, N + 2, Me + 2, [2, 2, 0, 0]), a.fill();
           }
-          n.restore();
+          a.restore();
         }
-        const we = ce[le.value], [ue, he, fe] = we.primary;
-        for (let k = 0; k < u; k++) {
-          const ge = k * (j + S), re = h[k], se = F - re, xe = s[k], Me = Math.min(k, u - 1 - k), X = Math.min(1, Me / Q), Pe = Math.min(1, re / q), Ve = (0.8 + Pe * 0.2) * X, lt = (0.6 + Pe * 0.2) * X, ct = (0.3 + Pe * 0.1) * X, Gt = Math.round(Pe * 10) / 10, Ot = Math.round(X * 10) / 10, Ht = `${le.value}-${Gt}-${Ot}-${re}`, Ut = Re(Ht, () => {
-            const Z = n.createLinearGradient(0, se, 0, se + re);
+        const we = D[k.value], [he, fe, ge] = we.primary;
+        for (let y = 0; y < u; y++) {
+          const me = y * (N + S), ie = h[y], le = V - ie, xe = s[y], Me = Math.min(y, u - 1 - y), oe = Math.min(1, Me / te), Pe = Math.min(1, ie / K), Ve = (0.8 + Pe * 0.2) * oe, lt = (0.6 + Pe * 0.2) * oe, ct = (0.3 + Pe * 0.1) * oe, Gt = Math.round(Pe * 10) / 10, Ot = Math.round(oe * 10) / 10, Ht = `${k.value}-${Gt}-${Ot}-${ie}`, Ut = Re(Ht, () => {
+            const Q = a.createLinearGradient(0, le, 0, le + ie);
             if (ve === "speaking")
-              Z.addColorStop(0, `rgba(${ue}, ${he}, ${fe}, ${Ve})`), Z.addColorStop(0.5, `rgba(${ue}, ${he}, ${fe}, ${lt})`), Z.addColorStop(1, `rgba(${ue}, ${he}, ${fe}, ${ct})`), (xe >= 400 && xe <= 600 || xe >= 1400 && xe <= 1600) && Z.addColorStop(0, `rgba(74, 222, 128, ${Math.min(1, Ve + 0.2)})`);
+              Q.addColorStop(0, `rgba(${he}, ${fe}, ${ge}, ${Ve})`), Q.addColorStop(0.5, `rgba(${he}, ${fe}, ${ge}, ${lt})`), Q.addColorStop(1, `rgba(${he}, ${fe}, ${ge}, ${ct})`), (xe >= 400 && xe <= 600 || xe >= 1400 && xe <= 1600) && Q.addColorStop(0, `rgba(74, 222, 128, ${Math.min(1, Ve + 0.2)})`);
             else if (ve === "listening")
-              Z.addColorStop(0, `rgba(${ue}, ${he}, ${fe}, ${Ve})`), Z.addColorStop(0.5, `rgba(${ue}, ${he}, ${fe}, ${lt})`), Z.addColorStop(1, `rgba(${ue}, ${he}, ${fe}, ${ct})`);
+              Q.addColorStop(0, `rgba(${he}, ${fe}, ${ge}, ${Ve})`), Q.addColorStop(0.5, `rgba(${he}, ${fe}, ${ge}, ${lt})`), Q.addColorStop(1, `rgba(${he}, ${fe}, ${ge}, ${ct})`);
             else {
-              const Ge = 0.6 * X, qt = 0.4 * X, Wt = 0.2 * X;
-              Z.addColorStop(0, `rgba(${ue}, ${he}, ${fe}, ${Ge})`), Z.addColorStop(0.6, `rgba(${ue}, ${he}, ${fe}, ${qt})`), Z.addColorStop(1, `rgba(${ue}, ${he}, ${fe}, ${Wt})`);
+              const Ge = 0.6 * oe, qt = 0.4 * oe, Wt = 0.2 * oe;
+              Q.addColorStop(0, `rgba(${he}, ${fe}, ${ge}, ${Ge})`), Q.addColorStop(0.6, `rgba(${he}, ${fe}, ${ge}, ${qt})`), Q.addColorStop(1, `rgba(${he}, ${fe}, ${ge}, ${Wt})`);
             }
-            return Z;
+            return Q;
           });
-          if (n.fillStyle = Ut, n.beginPath(), n.roundRect(ge, se, j, re, [1, 1, 0, 0]), n.fill(), M[k] > I + 2) {
-            const Z = F - M[k], Ge = y[k] > 0 ? 0.9 : Math.max(0.3, y[k] / wt);
-            n.fillStyle = `rgba(255, 255, 255, ${Ge})`, n.fillRect(ge, Z - 1, j, 2), Ge > 0.5 && !d.value && (n.shadowColor = we.glow, n.shadowBlur = 3, n.fillRect(ge, Z - 1, j, 2), n.shadowBlur = 0);
+          if (a.fillStyle = Ut, a.beginPath(), a.roundRect(me, le, N, ie, [1, 1, 0, 0]), a.fill(), j[y] > A + 2) {
+            const Q = V - j[y], Ge = W[y] > 0 ? 0.9 : Math.max(0.3, W[y] / wt);
+            a.fillStyle = `rgba(255, 255, 255, ${Ge})`, a.fillRect(me, Q - 1, N, 2), Ge > 0.5 && !d.value && (a.shadowColor = we.glow, a.shadowBlur = 3, a.fillRect(me, Q - 1, N, 2), a.shadowBlur = 0);
           }
         }
-        l = requestAnimationFrame(_);
+        l = requestAnimationFrame(J);
       }
-      r(_, "animate"), l = requestAnimationFrame(_);
+      r(J, "animate"), l = requestAnimationFrame(J);
     }
-    r(oe, "startAnimation"), Ee(() => {
-      if (ie(o.value.bars), i.value) {
-        if (n = i.value.getContext("2d"), te(), typeof window < "u") {
-          window.addEventListener("resize", Y, { passive: !0 });
+    r(ae, "startAnimation"), Ee(() => {
+      if (B(o.value.bars), i.value) {
+        if (a = i.value.getContext("2d"), ne(), typeof window < "u") {
+          window.addEventListener("resize", X, { passive: !0 });
           const g = /* @__PURE__ */ r(() => {
             C.value = !document.hidden;
           }, "handleVisibilityChange");
           document.addEventListener("visibilitychange", g, { passive: !0 });
         }
-        oe();
+        ae();
       }
     });
-    function Y() {
+    function X() {
       if (typeof window < "u") {
         const g = Math.max(1, Math.min(2, window.devicePixelRatio || 1));
-        g !== W && (W = g);
+        g !== _ && (_ = g);
       }
-      te();
+      ne();
     }
-    return r(Y, "onResize"), It(() => {
-      l && cancelAnimationFrame(l), typeof window < "u" && (window.removeEventListener("resize", Y), document.removeEventListener("visibilitychange", () => {
+    return r(X, "onResize"), It(() => {
+      l && cancelAnimationFrame(l), typeof window < "u" && (window.removeEventListener("resize", X), document.removeEventListener("visibilitychange", () => {
         C.value = !document.hidden;
       }));
-    }), ae(
-      [() => a.audioState?.mode, () => a.size],
+    }), de(
+      [() => n.audioState?.mode, () => n.size],
       () => {
-        h.length !== o.value.bars && ie(o.value.bars), !n && i.value && (n = i.value.getContext("2d")), l && cancelAnimationFrame(l), te(), oe();
+        h.length !== o.value.bars && B(o.value.bars), !a && i.value && (a = i.value.getContext("2d")), l && cancelAnimationFrame(l), ne(), ae();
       },
       { immediate: !1 }
-    ), ae(i, (g) => {
-      g && !n && (n = g.getContext("2d"), te(), oe());
-    }), (g, u) => (f(), b("div", Xr, [
+    ), de(i, (g) => {
+      g && !a && (a = g.getContext("2d"), ne(), ae());
+    }), (g, u) => (f(), b("div", es, [
       c("canvas", {
         ref_key: "canvasRef",
         ref: i,
@@ -5110,7 +5115,7 @@ const H = /* @__PURE__ */ r((e) => {
       }, null, 4)
     ]));
   }
-}), ns = /* @__PURE__ */ O({
+}), as = /* @__PURE__ */ H({
   __name: "ElSelfAudioVisualizer",
   props: {
     selfController: {},
@@ -5120,10 +5125,10 @@ const H = /* @__PURE__ */ r((e) => {
     enableGlow: { type: Boolean }
   },
   setup(e) {
-    const a = Yt(e, ["selfController"]), t = L(() => {
+    const n = Yt(e, ["selfController"]), t = z(() => {
       if (!e.selfController)
         return { mode: "idle" };
-      const o = e.selfController.voiceState.value, s = e.selfController.audioLevels.value, i = o.isSpeaking ? "speaking" : o.isProcessing ? "processing" : o.isListening ? "listening" : o.isConnected ? "connected" : "idle", n = /* @__PURE__ */ r(() => {
+      const o = e.selfController.voiceState.value, s = e.selfController.audioLevels.value, i = o.isSpeaking ? "speaking" : o.isProcessing ? "processing" : o.isListening ? "listening" : o.isConnected ? "connected" : "idle", a = /* @__PURE__ */ r(() => {
         try {
           if (o.isSpeaking) {
             const l = e.selfController.getOutputFrequencyData();
@@ -5145,33 +5150,33 @@ const H = /* @__PURE__ */ r((e) => {
         mode: i,
         inputLevel: s.inputLevel,
         outputLevel: s.outputLevel,
-        getFrequencyData: n
+        getFrequencyData: a
       };
     });
-    return (o, s) => (f(), ne(ss, Jt({ "audio-state": t.value }, a), null, 16, ["audio-state"]));
+    return (o, s) => (f(), ce(ns, Jt({ "audio-state": t.value }, n), null, 16, ["audio-state"]));
   }
-}), as = { class: "flex flex-col h-full items-center justify-center gap-4" }, is = { class: "flex-1 flex flex-col items-center justify-center space-y-8" }, ls = { class: "w-full max-w-md" }, cs = { class: "text-center flex gap-2 items-center text-xs" }, ds = { class: "flex items-center justify-center gap-2" }, us = {
+}), is = { class: "flex flex-col h-full items-center justify-center gap-4" }, ls = { class: "flex-1 flex flex-col items-center justify-center space-y-8" }, cs = { class: "w-full max-w-md" }, ds = { class: "text-center flex gap-2 items-center text-xs" }, us = { class: "flex items-center justify-center gap-2" }, hs = {
   key: 0,
   class: "size-2 bg-blue-500 rounded-full animate-pulse"
-}, hs = {
+}, fs = {
   key: 1,
   class: "size-2 bg-green-500 rounded-full animate-pulse"
-}, fs = {
+}, gs = {
   key: 2,
   class: "size-2 bg-white/50 rounded-full"
-}, gs = {
+}, ms = {
   key: 3,
   class: "size-2 bg-red-500 rounded-full"
-}, ms = { class: "text-white/70 text-sm max-w-xs leading-relaxed" }, bs = { class: "flex flex-col items-center space-y-6" }, ps = /* @__PURE__ */ O({
+}, bs = { class: "text-white/70 text-sm max-w-xs leading-relaxed" }, ps = { class: "flex flex-col items-center space-y-6" }, vs = /* @__PURE__ */ H({
   __name: "ElSelfVoice",
   props: {
     selfController: {}
   },
   setup(e) {
-    const a = L(() => e.selfController?.voiceState.value), t = L(() => a.value?.isConnected ? "red" : "green"), o = L(() => a.value?.isConnected ? "i-heroicons-phone-x-mark" : "i-heroicons-phone"), s = L(() => a.value?.isConnected ? "End Call" : "Start a Call"), i = L(() => {
+    const n = z(() => e.selfController?.voiceState.value), t = z(() => n.value?.isConnected ? "red" : "green"), o = z(() => n.value?.isConnected ? "i-heroicons-phone-x-mark" : "i-heroicons-phone"), s = z(() => n.value?.isConnected ? "End Call" : "Start a Call"), i = z(() => {
       const d = e.selfController?.voiceState.value;
       return !!d?.error || d?.connectionStatus === "connecting";
-    }), n = L(() => a.value?.connectionStatus === "connecting");
+    }), a = z(() => n.value?.connectionStatus === "connecting");
     async function l() {
       if (e.selfController)
         try {
@@ -5180,78 +5185,80 @@ const H = /* @__PURE__ */ r((e) => {
           console.error("Error toggling call:", d);
         }
     }
-    return r(l, "toggleCall"), (d, C) => (f(), b("div", as, [
-      c("div", is, [
-        c("div", ls, [
-          G(ns, {
+    return r(l, "toggleCall"), (d, C) => (f(), b("div", is, [
+      c("div", ls, [
+        c("div", cs, [
+          O(as, {
             "self-controller": e.selfController,
             "enable-wave-motion": "",
             "enable-glow": ""
           }, null, 8, ["self-controller"])
         ]),
-        c("div", cs, [
-          c("div", ds, [
-            e.selfController?.voiceState.value.isListening ? (f(), b("div", us)) : e.selfController?.voiceState.value.isSpeaking ? (f(), b("div", hs)) : e.selfController?.voiceState.value.isConnected && !e.selfController?.voiceState.value.isListening && !e.selfController?.voiceState.value.isSpeaking ? (f(), b("div", fs)) : e.selfController?.voiceState.value.error ? (f(), b("div", gs)) : P("", !0)
+        c("div", ds, [
+          c("div", us, [
+            e.selfController?.voiceState.value.isListening ? (f(), b("div", hs)) : e.selfController?.voiceState.value.isSpeaking ? (f(), b("div", fs)) : e.selfController?.voiceState.value.isConnected && !e.selfController?.voiceState.value.isListening && !e.selfController?.voiceState.value.isSpeaking ? (f(), b("div", gs)) : e.selfController?.voiceState.value.error ? (f(), b("div", ms)) : L("", !0)
           ]),
-          c("p", ms, U(e.selfController?.voiceState.value.error ? `Error: ${e.selfController.voiceState.value.error}` : e.selfController?.voiceState.value.transcript || "Ready to start a call..."), 1)
+          c("p", bs, q(e.selfController?.voiceState.value.error ? `Error: ${e.selfController.voiceState.value.error}` : e.selfController?.voiceState.value.transcript || "Ready to start a call..."), 1)
         ])
       ]),
-      c("div", bs, [
-        G(rt, {
+      c("div", ps, [
+        O(rt, {
           theme: t.value,
           icon: o.value,
           size: "lg",
-          loading: n.value,
+          loading: a.value,
           disabled: i.value,
           onClick: l
         }, {
-          default: ee(() => [
-            ze(U(s.value), 1)
+          default: re(() => [
+            ze(q(s.value), 1)
           ]),
           _: 1
         }, 8, ["theme", "icon", "loading", "disabled"])
       ])
     ]));
   }
-}), vs = {
+}), xs = {
   key: 0,
   class: "absolute inset-0 flex items-center justify-center bg-gradient-to-br from-theme-800 to-theme-950 rounded-3xl z-10"
-}, xs = ["data-quality"], ys = { class: "text-sm" }, ks = {
+}, ys = ["data-quality"], ks = { class: "text-sm" }, ws = {
   key: 0,
   class: "flex-1 basis-0 flex justify-end"
-}, ws = {
+}, Cs = {
   key: 0,
   class: "h-full pb-12 flex-1 flex flex-col relative z-20 min-h-0 px-4 @[480px]/agent:px-6 max-w-md mx-auto w-full"
-}, Cs = { class: "flex-1 basis-0 flex flex-col justify-start pt-8 gap-7" }, Ss = {
+}, Ss = { class: "flex-1 basis-0 flex flex-col justify-start pt-8 gap-7" }, Ms = {
   key: 0,
   class: "flex items-center justify-center gap-3"
-}, Ms = ["href"], As = {
+}, As = ["href"], Is = {
   key: 1,
   class: "flex-1 flex flex-col relative z-20 min-h-0 w-full gap-4 px-4"
-}, Is = { class: "max-w-md mx-auto" }, $s = {
+}, $s = { class: "max-w-md mx-auto" }, zs = {
   key: 2,
   class: "flex-1 flex flex-col relative z-20 min-h-0 w-full px-4 @[480px]/agent:px-6"
-}, zs = { class: "flex-1 min-h-0 max-w-md mx-auto w-full" }, Es = {
+}, Es = { class: "flex-1 min-h-0 max-w-md mx-auto w-full" }, Ts = {
   key: 2,
   class: "bg-gradient-to-br from-theme-800 to-theme-950 text-white flex items-center justify-center h-full p-8"
-}, Ts = { class: "text-center max-w-md space-y-4" }, Ls = { class: "text-sm text-white/70 leading-relaxed" }, Ds = {
+}, Ls = { class: "text-center max-w-md space-y-4" }, Ds = { class: "text-sm text-white/70 leading-relaxed" }, Ps = {
   key: 3,
   class: "bg-white/10 backdrop-blur-sm text-white/70 flex items-center justify-center h-full"
-}, qs = /* @__PURE__ */ O({
+}, Ws = /* @__PURE__ */ H({
   __name: "SelfAgent",
   props: {
     sdk: {},
     self: {},
     context: {},
     firstMessage: {},
+    buttonText: {},
+    buttonIcon: {},
     hasClose: { type: Boolean, default: !1 },
     isActive: { type: Boolean, default: !0 },
     loading: { type: Boolean, default: !1 },
     theme: { default: "green" }
   },
   emits: ["close", "error"],
-  setup(e, { emit: a }) {
-    const t = a, o = Qt(), s = N(!1), i = N(!1), n = N(), l = N(), d = L(() => o.value?.agentMode?.value ?? "self"), C = L(() => e.sdk.activeUser.value !== void 0), m = L(() => zt.find((y) => y.mode === d.value));
+  setup(e, { emit: n }) {
+    const t = n, o = Qt(), s = R(!1), i = R(!1), a = R(), l = R(), d = z(() => o.value?.agentMode?.value ?? "self"), C = z(() => e.sdk.activeUser.value !== void 0), m = z(() => zt.find((k) => k.mode === d.value));
     function h() {
       o.value && o.value.destroy();
       try {
@@ -5261,54 +5268,63 @@ const H = /* @__PURE__ */ r((e) => {
           context: e.context,
           firstMessage: e.firstMessage
         });
-      } catch (M) {
-        throw console.error("SelfController creation failed:", M), M;
+      } catch (B) {
+        throw console.error("SelfController creation failed:", B), B;
       }
     }
     r(h, "createSelfController");
-    function x(M) {
+    function x(B) {
       if (!l.value)
         return;
-      const y = so(M);
-      Object.entries(y).forEach(([T, ie]) => {
-        l.value.style.setProperty(`--primary-${T}`, ie);
+      const k = so(B);
+      Object.entries(k).forEach(([D, se]) => {
+        l.value.style.setProperty(`--primary-${D}`, se);
       });
     }
     r(x, "applyTheme"), Ee(() => {
       try {
         h(), x(e.theme);
-      } catch (M) {
-        const y = M instanceof Error ? M.message : "Failed to initialize digital self";
-        n.value = y, t("error", y);
+      } catch (B) {
+        const k = B instanceof Error ? B.message : "Failed to initialize digital self";
+        a.value = k, t("error", k);
       }
     }), It(() => {
       o.value && o.value.destroy();
-    }), ae(() => e.theme, (M) => {
-      x(M);
-    }), ae(() => e.sdk.activeUser.value, (M, y) => {
-      y && !M && o.value && o.value.setMode("self");
-    });
-    const z = L(() => e.self.cover?.src && e.self.cover?.quality === "low" ? !0 : !!(e.self.avatar?.src && e.self.avatar?.quality === "low")), A = L(() => {
-      const M = [z.value ? "backdrop-blur-sm" : ""];
-      return z.value && d.value === "self" ? M.push("from-black/80 via-black/60 to-black/80") : d.value === "self" ? M.push("from-black/70 via-black/50 to-black/80") : M.push("from-black/90 via-black/90 to-black/100"), M.join(" ");
+    }), de(() => e.theme, (B) => {
+      x(B);
+    }), de(() => e.sdk.activeUser.value, (B, k) => {
+      k && !B && o.value && o.value.setMode("self");
     });
-    return (M, y) => (f(), b("div", {
+    const $ = z(() => e.self.cover?.src && e.self.cover?.quality === "low" ? !0 : !!(e.self.avatar?.src && e.self.avatar?.quality === "low")), M = z(() => {
+      const B = [$.value ? "backdrop-blur-sm" : ""];
+      return $.value && d.value === "self" ? B.push("from-black/80 via-black/60 to-black/80") : d.value === "self" ? B.push("from-black/70 via-black/50 to-black/80") : B.push("from-black/90 via-black/90 to-black/100"), B.join(" ");
+    }), j = {
+      phone: "i-heroicons-phone",
+      calendar: "i-heroicons-calendar",
+      question: "i-heroicons-question-mark-circle",
+      message: "i-heroicons-chat-bubble-left-right",
+      sparkles: "i-heroicons-sparkles"
+    }, W = z(() => co({
+      template: e.buttonText || "Talk to {name}",
+      self: e.self
+    })), Z = z(() => j[e.buttonIcon || "phone"] || j.phone);
+    return (B, k) => (f(), b("div", {
       ref_key: "rootElement",
       ref: l,
-      key: K(Ye)(e.self),
+      key: Y(Ye)(e.self),
       class: "fiction-sdk @container/agent self-agent w-full h-full overflow-hidden relative",
       "data-test": "self-agent"
     }, [
-      e.loading ? (f(), b("div", vs, [
-        G(ot, { class: "text-white size-8" })
-      ])) : e.self && !n.value ? (f(), b("div", {
+      e.loading ? (f(), b("div", xs, [
+        O(ot, { class: "text-white size-8" })
+      ])) : e.self && !a.value ? (f(), b("div", {
         key: 1,
         class: "absolute inset-0 bg-cover bg-center bg-no-repeat",
-        style: tt({ backgroundImage: `url(${K(Ye)(e.self) || K(qe)()})` }),
+        style: tt({ backgroundImage: `url(${Y(Ye)(e.self) || Y(qe)()})` }),
         "data-quality": e.self.avatar?.quality || "none"
       }, [
         c("div", {
-          class: E(["absolute inset-0 bg-gradient-to-br z-0", A.value])
+          class: E(["absolute inset-0 bg-gradient-to-br z-0", M.value])
         }, null, 2),
         c("div", {
           class: E(["relative z-10 flex flex-col h-full transition-all duration-500 ease-[cubic-bezier(0.25,1,0.33,1)] will-change-transform", e.isActive ? "opacity-100 translate-y-0" : "opacity-0 translate-y-2"])
@@ -5324,93 +5340,93 @@ const H = /* @__PURE__ */ r((e) => {
               }, [
                 c("button", {
                   class: "cursor-pointer p-2 flex items-center gap-2 rounded-2xl text-white/70 hover:bg-white/10 transition-all duration-300 ease-[cubic-bezier(0.25,1,0.33,1)] hover:scale-105 active:scale-95",
-                  onClick: y[0] || (y[0] = (T) => s.value = !0)
-                }, [...y[6] || (y[6] = [
+                  onClick: k[0] || (k[0] = (D) => s.value = !0)
+                }, [...k[6] || (k[6] = [
                   c("i", { class: "i-tabler-menu size-7" }, null, -1)
                 ])])
               ], 2),
               c("button", {
                 class: E(["flex items-center gap-2 px-3.5 py-3 rounded-2xl text-white/90 hover:bg-white/10 transition-all cursor-pointer flex-grow-0", { "bg-white/10": i.value }]),
-                onClick: y[1] || (y[1] = (T) => i.value = !0)
+                onClick: k[1] || (k[1] = (D) => i.value = !0)
               }, [
                 c("i", {
                   class: E([m.value?.icon, "size-4 opacity-60"])
                 }, null, 2),
-                c("span", ys, U(m.value?.label), 1),
-                y[7] || (y[7] = c("i", { class: "i-tabler-chevron-down size-4" }, null, -1))
+                c("span", ks, q(m.value?.label), 1),
+                k[7] || (k[7] = c("i", { class: "i-tabler-chevron-down size-4" }, null, -1))
               ], 2),
-              e.hasClose ? (f(), b("div", ks, [
+              e.hasClose ? (f(), b("div", ws, [
                 c("button", {
                   class: "cursor-pointer flex items-center p-3 rounded-2xl text-white/70 hover:bg-white/10 transition-colors",
-                  onClick: y[2] || (y[2] = At((T) => t("close", "button"), ["stop"]))
-                }, [...y[8] || (y[8] = [
+                  onClick: k[2] || (k[2] = At((D) => t("close", "button"), ["stop"]))
+                }, [...k[8] || (k[8] = [
                   c("i", { class: "size-6 i-tabler-x" }, null, -1)
                 ])])
-              ])) : P("", !0)
+              ])) : L("", !0)
             ], 2)
           ], 2),
-          d.value === "self" ? (f(), b("div", ws, [
-            y[9] || (y[9] = c("div", { class: "flex-1 basis-0 mb-12" }, null, -1)),
-            G(Rr, { self: e.self }, null, 8, ["self"]),
-            c("div", Cs, [
-              G(rt, {
+          d.value === "self" ? (f(), b("div", Cs, [
+            k[9] || (k[9] = c("div", { class: "flex-1 basis-0 mb-12" }, null, -1)),
+            O(Gr, { self: e.self }, null, 8, ["self"]),
+            c("div", Ss, [
+              O(rt, {
                 theme: "primary",
                 size: "lg",
                 class: "w-full",
-                icon: "i-heroicons-phone",
+                icon: Z.value,
                 "data-test": "voice-button",
-                onClick: y[3] || (y[3] = (T) => o.value?.setMode("talk"))
+                onClick: k[3] || (k[3] = (D) => o.value?.setMode("talk"))
               }, {
-                default: ee(() => [
-                  ze(" Talk to " + U(e.self.name), 1)
+                default: re(() => [
+                  ze(q(W.value), 1)
                 ]),
                 _: 1
-              }),
-              e.self.accounts && e.self.accounts.length > 0 ? (f(), b("div", Ss, [
-                (f(!0), b(ke, null, Be(e.self.accounts.filter((T) => K(Ie)[T.platform]), (T) => (f(), b("a", {
-                  key: `${T.platform}-${T.handle}`,
-                  href: K(Ie)[T.platform].getUrl(T.handle),
+              }, 8, ["icon"]),
+              e.self.accounts && e.self.accounts.length > 0 ? (f(), b("div", Ms, [
+                (f(!0), b(ke, null, Be(e.self.accounts.filter((D) => Y(Ie)[D.platform]), (D) => (f(), b("a", {
+                  key: `${D.platform}-${D.handle}`,
+                  href: Y(Ie)[D.platform].getUrl(D.handle),
                   target: "_blank",
                   class: "size-12 rounded-full text-white/60 hover:text-white hover:bg-white/5 border border-white/0 hover:border-white/10 flex items-center justify-center transition-all duration-200 hover:scale-105"
                 }, [
                   c("i", {
-                    class: E([K(Ie)[T.platform].icon, "size-5"])
+                    class: E([Y(Ie)[D.platform].icon, "size-5"])
                   }, null, 2)
-                ], 8, Ms))), 128))
-              ])) : P("", !0)
+                ], 8, As))), 128))
+              ])) : L("", !0)
             ])
-          ])) : d.value === "talk" ? (f(), b("div", As, [
+          ])) : d.value === "talk" ? (f(), b("div", Is, [
             C.value ? (f(), b(ke, { key: 1 }, [
               c("div", null, [
-                c("div", Is, [
-                  G(st, { self: e.self }, null, 8, ["self"])
+                c("div", $s, [
+                  O(st, { self: e.self }, null, 8, ["self"])
                 ])
               ]),
-              G(ps, { "self-controller": o.value }, null, 8, ["self-controller"])
-            ], 64)) : (f(), ne(mt, {
+              O(vs, { "self-controller": o.value }, null, 8, ["self-controller"])
+            ], 64)) : (f(), ce(mt, {
               key: 0,
               sdk: e.sdk
             }, null, 8, ["sdk"]))
-          ])) : (f(), b("div", $s, [
-            c("div", zs, [
+          ])) : (f(), b("div", zs, [
+            c("div", Es, [
               d.value === "chat" ? (f(), b(ke, { key: 0 }, [
-                C.value ? (f(), ne(Lr, {
+                C.value ? (f(), ce(Dr, {
                   key: 1,
                   "self-controller": o.value,
                   self: e.self
-                }, null, 8, ["self-controller", "self"])) : (f(), ne(mt, {
+                }, null, 8, ["self-controller", "self"])) : (f(), ce(mt, {
                   key: 0,
                   sdk: e.sdk
                 }, null, 8, ["sdk"]))
-              ], 64)) : d.value === "info" ? (f(), ne(xr, {
+              ], 64)) : d.value === "info" ? (f(), ce(yr, {
                 key: 1,
                 self: e.self
-              }, null, 8, ["self"])) : P("", !0)
+              }, null, 8, ["self"])) : L("", !0)
             ])
           ])),
           c("div", {
             class: E(["relative z-20 text-center py-5 px-6", d.value === "info" ? "hidden" : ""])
-          }, [...y[10] || (y[10] = [
+          }, [...k[10] || (k[10] = [
             c("a", {
               href: "https://www.fiction.com",
               class: "flex items-center justify-center gap-1.5 text-[10px] font-sans font-normal text-white/50 hover:text-white/70 transition-colors"
@@ -5421,35 +5437,35 @@ const H = /* @__PURE__ */ r((e) => {
             ], -1)
           ])], 2)
         ], 2)
-      ], 12, xs)) : n.value ? (f(), b("div", Es, [
-        c("div", Ts, [
-          y[11] || (y[11] = c("div", { class: "flex justify-center" }, [
+      ], 12, ys)) : a.value ? (f(), b("div", Ts, [
+        c("div", Ls, [
+          k[11] || (k[11] = c("div", { class: "flex justify-center" }, [
             c("div", { class: "rounded-full bg-red-500/20 flex items-center justify-center size-10" }, [
               c("i", { class: "i-tabler-alert-circle size-6 text-red-400" })
             ])
           ], -1)),
-          y[12] || (y[12] = c("h3", { class: "text-lg font-medium" }, " Self Error ", -1)),
-          c("p", Ls, U(n.value), 1)
+          k[12] || (k[12] = c("h3", { class: "text-lg font-medium" }, " Self Error ", -1)),
+          c("p", Ds, q(a.value), 1)
         ])
-      ])) : (f(), b("div", Ds, " There was an error loading the digital self. Please try again later. ")),
-      G(Qr, {
+      ])) : (f(), b("div", Ps, " There was an error loading the digital self. Please try again later. ")),
+      O(Xr, {
         modelValue: s.value,
-        "onUpdate:modelValue": y[4] || (y[4] = (T) => s.value = T),
+        "onUpdate:modelValue": k[4] || (k[4] = (D) => s.value = D),
         self: e.self,
         sdk: e.sdk,
         title: e.self.name
       }, null, 8, ["modelValue", "self", "sdk", "title"]),
-      G(Jr, {
+      O(Qr, {
         modelValue: i.value,
-        "onUpdate:modelValue": y[5] || (y[5] = (T) => i.value = T),
+        "onUpdate:modelValue": k[5] || (k[5] = (D) => i.value = D),
         "self-controller": o.value
       }, null, 8, ["modelValue", "self-controller"])
     ]));
   }
-}), Ps = { class: "self-wrap" }, Vs = {
+}), Vs = { class: "self-wrap" }, Fs = {
   key: 0,
   class: "flex items-center justify-center h-full"
-}, Ws = /* @__PURE__ */ O({
+}, Ks = /* @__PURE__ */ H({
   __name: "SelfWrap",
   props: {
     sdk: {},
@@ -5457,24 +5473,26 @@ const H = /* @__PURE__ */ r((e) => {
     handle: {},
     context: {},
     firstMessage: {},
+    buttonText: {},
+    buttonIcon: {},
     hasClose: { type: Boolean },
     apiBase: {}
   },
   setup(e) {
-    const a = eo("SelfWrap"), t = e, o = t.sdk || to.getInstance({
+    const n = eo("SelfWrap"), t = e, o = t.sdk || to.getInstance({
       isDev: typeof window < "u" ? window.location.hostname === "localhost" || window.location.hostname.includes("127.0.0.1") : !1,
       ...t.apiBase && { apiBase: t.apiBase }
-    }), s = N(!t.self), i = N(t.self), n = N();
+    }), s = R(!t.self), i = R(t.self), a = R();
     return Ee(async () => {
       if (t.self) {
-        a.debug("Self provided via props, skipping fetch", {
+        n.debug("Self provided via props, skipping fetch", {
           selfId: t.self.selfId,
           handle: t.self.handle
         }), s.value = !1;
         return;
       }
       if (!t.handle) {
-        n.value = "No handle or self provided", a.warn("SelfWrap mounted without handle or self", {
+        a.value = "No handle or self provided", n.warn("SelfWrap mounted without handle or self", {
           propsReceived: {
             handle: t.handle,
             self: t.self,
@@ -5489,9 +5507,9 @@ const H = /* @__PURE__ */ r((e) => {
         return;
       }
       try {
-        s.value = !0, a.debug("Fetching public self", { handle: t.handle });
+        s.value = !0, n.debug("Fetching public self", { handle: t.handle });
         const l = await o.getPublicSelf({ handle: t.handle });
-        l ? (i.value = l, a.debug("Successfully fetched public self", {
+        l ? (i.value = l, n.debug("Successfully fetched public self", {
           selfId: l.selfId,
           handle: l.handle
         }), l.selfId && o.track({
@@ -5500,7 +5518,7 @@ const H = /* @__PURE__ */ r((e) => {
           properties: {
             viewSource: "widget"
           }
-        })) : (n.value = o.error.value || "Self not found", a.error("Failed to fetch public self - no data returned", {
+        })) : (a.value = o.error.value || "Self not found", n.error("Failed to fetch public self - no data returned", {
           handle: t.handle,
           sdkError: o.error.value,
           sdkState: {
@@ -5510,7 +5528,7 @@ const H = /* @__PURE__ */ r((e) => {
           }
         }));
       } catch (l) {
-        n.value = l instanceof Error ? l.message : "Failed to fetch self", a.error("Exception while fetching public self", {
+        a.value = l instanceof Error ? l.message : "Failed to fetch self", n.error("Exception while fetching public self", {
           handle: t.handle,
           error: l instanceof Error ? {
             message: l.message,
@@ -5523,11 +5541,11 @@ const H = /* @__PURE__ */ r((e) => {
           }
         });
       } finally {
-        s.value = !1, i.value || a.debug("SelfWrap component will render empty (silent failure)", {
+        s.value = !1, i.value || n.debug("SelfWrap component will render empty (silent failure)", {
           state: {
             loading: s.value,
             hasSelf: !!i.value,
-            error: n.value
+            error: a.value
           },
           props: {
             handle: t.handle,
@@ -5541,35 +5559,38 @@ const H = /* @__PURE__ */ r((e) => {
           }
         });
       }
-    }), (l, d) => (f(), b("div", Ps, [
-      s.value ? (f(), b("div", Vs, [...d[0] || (d[0] = [
+    }), (l, d) => (f(), b("div", Vs, [
+      s.value ? (f(), b("div", Fs, [...d[0] || (d[0] = [
         c("div", { class: "animate-spin rounded-full size-6 border-b-2 border-white" }, null, -1)
       ])])) : i.value ? $e(l.$slots, "default", {
         key: 1,
-        sdk: K(o),
+        sdk: Y(o),
         self: i.value,
         context: e.context,
         firstMessage: e.firstMessage,
+        buttonText: e.buttonText,
+        buttonIcon: e.buttonIcon,
         loading: s.value
-      }) : P("", !0)
+      }) : L("", !0)
     ]));
   }
 });
 export {
   no as A,
-  Ze as C,
-  Os as V,
-  Ws as _,
-  qs as a,
+  _e as C,
+  Hs as V,
+  Ks as _,
+  Ws as a,
   qe as b,
   ao as c,
   io as d,
-  Hs as e,
+  Us as e,
   zt as f,
   Ye as g,
   gt as h,
   Ue as i,
-  Us as j,
+  qs as j,
+  co as k,
   lo as p
 };
-//# sourceMappingURL=SelfWrap.vue_vue_type_script_setup_true_lang-DcjZRnSG.js.map
+//# sourceMappingURL=SelfWrap.vue_vue_type_script_setup_true_lang-Dy16trSb.js.map