artifactuse 0.2.0 → 0.2.2

package/dist/vue/index.js

@@ -1,19 +1,19 @@
-import { ref as M, computed as b, createElementBlock as s, openBlock as a, normalizeClass as N, createElementVNode as e, toDisplayString as l, withModifiers as me, onMounted as $e, watch as de, Fragment as R, createCommentVNode as v, renderList as ve, createTextVNode as K, h as se, normalizeStyle as Pe, createStaticVNode as It, createBlock as xe, resolveDynamicComponent as Ft, nextTick as be, onUnmounted as De, Teleport as Vt, createVNode as Be, Transition as Ae, withCtx as He, withKeys as Rt, onBeforeUnmount as qt, unref as g, withDirectives as at, vShow as st, reactive as lt, provide as Ot, inject as Ut } from "vue";
-import { g as Se, f as nt, a as Oe, b as Ue, n as Dt, i as it, c as jt, D as Nt, d as ot } from "../index-llShix6s.js";
-import { J as Wt } from "../jszip.min-CdmYyw5L.js";
-const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class: "artifactuse-card__content" }, Kt = { class: "artifactuse-card__title" }, Yt = { class: "artifactuse-card__meta" }, Qt = { class: "artifactuse-card__type" }, Gt = { class: "artifactuse-card__size" }, ea = { class: "artifactuse-card__actions" }, ta = ["title"], aa = {
+import { ref as M, computed as C, createElementBlock as s, openBlock as a, normalizeClass as N, createElementVNode as e, toDisplayString as n, withModifiers as he, onMounted as $e, watch as de, Fragment as R, createCommentVNode as v, renderList as ve, createTextVNode as K, h as se, normalizeStyle as Pe, createStaticVNode as qt, createBlock as xe, resolveDynamicComponent as Ot, nextTick as Ce, onUnmounted as Ne, Teleport as Ut, createVNode as Se, Transition as He, withCtx as Be, withKeys as Dt, onBeforeUnmount as jt, unref as g, withDirectives as it, vShow as lt, reactive as ot, provide as Nt, inject as Wt } from "vue";
+import { g as Ee, f as rt, a as De, b as je, n as Jt, i as nt, c as Xt, D as Zt, d as ct } from "../index-INYOxlcg.js";
+import { J as Kt } from "../jszip.min-CdmYyw5L.js";
+const Yt = { class: "artifactuse-card__icon" }, Qt = ["innerHTML"], Gt = { class: "artifactuse-card__content" }, ea = { class: "artifactuse-card__title" }, ta = { class: "artifactuse-card__meta" }, aa = { class: "artifactuse-card__type" }, sa = { class: "artifactuse-card__size" }, ia = { class: "artifactuse-card__actions" }, la = ["title"], na = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, sa = {
+}, oa = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, ia = {
+}, ra = {
   __name: "ArtifactuseCard",
   props: {
     artifact: {
@@ -26,58 +26,58 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
     }
   },
   emits: ["open", "copy", "download"],
-  setup(H, { emit: d }) {
-    const _ = H, L = d, m = M(!1), r = b(() => Se(_.artifact.language)), V = b(() => {
+  setup(H, { emit: c }) {
+    const h = H, T = c, m = M(!1), o = C(() => Ee(h.artifact.language)), q = C(() => {
       var x;
-      return nt(_.artifact.size || ((x = _.artifact.code) == null ? void 0 : x.length) || 0);
-    }), S = b(() => Oe(_.artifact.language));
-    function h(x) {
-      x.stopPropagation(), L("open", _.artifact);
+      return rt(h.artifact.size || ((x = h.artifact.code) == null ? void 0 : x.length) || 0);
+    }), B = C(() => De(h.artifact.language));
+    function y(x) {
+      x.stopPropagation(), T("open", h.artifact);
     }
-    async function n() {
+    async function l() {
       try {
-        await navigator.clipboard.writeText(_.artifact.code), m.value = !0, setTimeout(() => {
+        await navigator.clipboard.writeText(h.artifact.code), m.value = !0, setTimeout(() => {
           m.value = !1;
-        }, 2e3), L("copy", _.artifact);
+        }, 2e3), T("copy", h.artifact);
       } catch (x) {
         console.error("Failed to copy:", x);
       }
     }
-    function p() {
+    function _() {
       var W;
-      const x = new Blob([_.artifact.code], { type: "text/plain" }), F = URL.createObjectURL(x), $ = document.createElement("a"), j = Ue(_.artifact.language), q = ((W = _.artifact.title) == null ? void 0 : W.replace(/[^a-z0-9]/gi, "_").toLowerCase()) || "code";
-      $.href = F, $.download = `${q}.${j}`, document.body.appendChild($), $.click(), document.body.removeChild($), URL.revokeObjectURL(F), L("download", _.artifact);
+      const x = new Blob([h.artifact.code], { type: "text/plain" }), F = URL.createObjectURL(x), $ = document.createElement("a"), j = je(h.artifact.language), O = ((W = h.artifact.title) == null ? void 0 : W.replace(/[^a-z0-9]/gi, "_").toLowerCase()) || "code";
+      $.href = F, $.download = `${O}.${j}`, document.body.appendChild($), $.click(), document.body.removeChild($), URL.revokeObjectURL(F), T("download", h.artifact);
     }
     return (x, F) => (a(), s("div", {
       class: N(["artifactuse-card", { "artifactuse-card--active": H.isActive }]),
-      onClick: h
+      onClick: y
     }, [
-      e("div", Jt, [
+      e("div", Yt, [
         (a(), s("svg", {
           viewBox: "0 0 24 24",
           fill: "none",
           stroke: "currentColor",
           "stroke-width": "1.5",
-          innerHTML: S.value
-        }, null, 8, Xt))
+          innerHTML: B.value
+        }, null, 8, Qt))
       ]),
-      e("div", Zt, [
-        e("div", Kt, l(H.artifact.title), 1),
-        e("div", Yt, [
-          e("span", Qt, l(r.value), 1),
+      e("div", Gt, [
+        e("div", ea, n(H.artifact.title), 1),
+        e("div", ta, [
+          e("span", aa, n(o.value), 1),
           F[0] || (F[0] = e("span", { class: "artifactuse-card__separator" }, "•", -1)),
-          e("span", Gt, l(V.value), 1)
+          e("span", sa, n(q.value), 1)
         ])
       ]),
-      e("div", ea, [
+      e("div", ia, [
         e("button", {
           class: "artifactuse-card__action",
-          onClick: me(n, ["stop"]),
+          onClick: he(l, ["stop"]),
           title: m.value ? "Copied!" : "Copy code"
         }, [
-          m.value ? (a(), s("svg", sa, [...F[2] || (F[2] = [
+          m.value ? (a(), s("svg", oa, [...F[2] || (F[2] = [
             e("polyline", { points: "20 6 9 17 4 12" }, null, -1)
-          ])])) : (a(), s("svg", aa, [...F[1] || (F[1] = [
+          ])])) : (a(), s("svg", na, [...F[1] || (F[1] = [
             e("rect", {
               x: "9",
               y: "9",
@@ -88,10 +88,10 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
             }, null, -1),
             e("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" }, null, -1)
           ])]))
-        ], 8, ta),
+        ], 8, la),
         e("button", {
           class: "artifactuse-card__action",
-          onClick: me(p, ["stop"]),
+          onClick: he(_, ["stop"]),
           title: "Download file"
         }, [...F[3] || (F[3] = [
           e("svg", {
@@ -123,10 +123,10 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
       ], -1))
     ], 2));
   }
-}, la = ["data-artifactuse-theme"], na = {
+}, ca = ["data-artifactuse-theme"], ua = {
   key: 0,
   class: "artifactuse-form-collapsed"
-}, oa = { class: "artifactuse-form-collapsed-icon" }, ra = {
+}, da = { class: "artifactuse-form-collapsed-icon" }, va = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
@@ -134,7 +134,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
   "stroke-width": "2.5",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, ca = {
+}, fa = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
@@ -142,7 +142,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
   "stroke-width": "2.5",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, ua = {
+}, pa = {
   key: 2,
   viewBox: "0 0 24 24",
   fill: "none",
@@ -150,64 +150,64 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
   "stroke-width": "2.5",
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
-}, da = { class: "artifactuse-form-collapsed-title" }, va = {
+}, _a = { class: "artifactuse-form-collapsed-title" }, ha = {
   key: 0,
   class: "artifactuse-form-header"
-}, fa = {
+}, ma = {
   key: 0,
   class: "artifactuse-form-title"
-}, pa = {
+}, ya = {
   key: 1,
   class: "artifactuse-form-description"
-}, ha = {
+}, ga = {
   key: 1,
   class: "artifactuse-form-buttons"
-}, _a = ["disabled", "onClick"], ma = ["innerHTML"], ya = { class: "artifactuse-form-fields" }, ga = {
+}, ka = ["disabled", "onClick"], wa = ["innerHTML"], ba = { class: "artifactuse-form-fields" }, Ca = {
   key: 0,
   class: "artifactuse-form-buttons"
-}, ka = ["type", "disabled", "onClick"], wa = {
+}, xa = ["type", "disabled", "onClick"], $a = {
   key: 0,
   class: "artifactuse-form-btn-spinner"
-}, Ca = ["innerHTML"], ba = {
+}, Ma = ["innerHTML"], Ta = {
   key: 1,
   class: "artifactuse-form-divider"
-}, xa = {
+}, La = {
   key: 2,
   class: "artifactuse-form-heading"
-}, $a = {
+}, Aa = {
   key: 3,
   class: "artifactuse-form-field"
-}, Ma = { class: "artifactuse-checkbox-label" }, La = ["checked", "disabled", "onChange"], Ta = { class: "artifactuse-checkbox-text" }, Pa = {
+}, Pa = { class: "artifactuse-checkbox-label" }, Ha = ["checked", "disabled", "onChange"], Ba = { class: "artifactuse-checkbox-text" }, Ea = {
   key: 0,
   class: "artifactuse-required"
-}, Aa = {
+}, Sa = {
   key: 0,
   class: "artifactuse-help-text"
-}, Ha = {
+}, za = {
   key: 1,
   class: "artifactuse-error-text"
-}, Sa = {
+}, Ia = {
   key: 4,
   class: "artifactuse-form-field"
-}, Ba = ["for"], Ea = {
+}, Fa = ["for"], Va = {
   key: 0,
   class: "artifactuse-required"
-}, za = ["id", "type", "value", "placeholder", "disabled", "required", "onInput"], Ia = ["id", "value", "placeholder", "disabled", "required", "rows", "onInput"], Fa = ["id", "value", "disabled", "required", "onChange"], Va = { value: "" }, Ra = ["value", "disabled"], qa = {
+}, Ra = ["id", "type", "value", "placeholder", "disabled", "required", "onInput"], qa = ["id", "value", "placeholder", "disabled", "required", "rows", "onInput"], Oa = ["id", "value", "disabled", "required", "onChange"], Ua = { value: "" }, Da = ["value", "disabled"], ja = {
   key: 3,
   class: "artifactuse-radio-group"
-}, Oa = ["name", "value", "checked", "disabled", "onChange"], Ua = {
+}, Na = ["name", "value", "checked", "disabled", "onChange"], Wa = {
   key: 4,
   class: "artifactuse-help-text"
-}, Da = {
+}, Ja = {
   key: 5,
   class: "artifactuse-error-text"
-}, ja = {
+}, Xa = {
   key: 0,
   class: "artifactuse-form-buttons artifactuse-form-buttons-default"
-}, Na = ["disabled"], Wa = {
+}, Za = ["disabled"], Ka = {
   key: 0,
   class: "artifactuse-form-btn-spinner"
-}, Ja = {
+}, Ya = {
   __name: "ArtifactuseInlineForm",
   props: {
     artifact: { type: Object, required: !0 },
@@ -220,133 +220,133 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
     }
   },
   emits: ["submit", "cancel", "reset", "button-click"],
-  setup(H, { emit: d }) {
-    const _ = H, L = d, m = M(_.initialState), r = b(() => m.value !== "active"), V = b(() => m.value === "active" ? "" : `artifactuse-form--${m.value}`);
-    function S(w) {
+  setup(H, { emit: c }) {
+    const h = H, T = c, m = M(h.initialState), o = C(() => m.value !== "active"), q = C(() => m.value === "active" ? "" : `artifactuse-form--${m.value}`);
+    function B(w) {
       m.value = w;
     }
-    const h = b(() => {
+    const y = C(() => {
       try {
-        return JSON.parse(_.artifact.code);
+        return JSON.parse(h.artifact.code);
       } catch {
         return { title: "Invalid Form", variant: "fields", data: { fields: [] } };
       }
-    }), n = M(null), p = b(() => _.artifact.id || h.value.id || `form-${Date.now()}`), x = b(() => `artifactuse-form-${h.value.variant || "fields"}`), F = b(() => h.value.title || "Form"), $ = M({}), j = M({}), q = M(!1), W = b(() => {
+    }), l = M(null), _ = C(() => h.artifact.id || y.value.id || `form-${Date.now()}`), x = C(() => `artifactuse-form-${y.value.variant || "fields"}`), F = C(() => y.value.title || "Form"), $ = M({}), j = M({}), O = M(!1), W = C(() => {
       var w;
-      return ((w = h.value.data) == null ? void 0 : w.fields) || [];
-    }), Y = b(() => {
+      return ((w = y.value.data) == null ? void 0 : w.fields) || [];
+    }), Y = C(() => {
       var w;
-      return h.value.variant === "buttons" ? ((w = h.value.data) == null ? void 0 : w.fields) || [] : [];
-    }), E = b(() => W.value.some((w) => w.type === "buttons"));
+      return y.value.variant === "buttons" ? ((w = y.value.data) == null ? void 0 : w.fields) || [] : [];
+    }), S = C(() => W.value.some((w) => w.type === "buttons"));
     function ie(w) {
       if (!w) return null;
-      const T = w.trim();
-      if (T.startsWith("#")) {
-        let c = T.slice(1);
-        if (c.length === 3 && (c = c.split("").map((z) => z + z).join("")), c.length === 6) {
-          const z = parseInt(c.slice(0, 2), 16), le = parseInt(c.slice(2, 4), 16), pe = parseInt(c.slice(4, 6), 16);
+      const L = w.trim();
+      if (L.startsWith("#")) {
+        let u = L.slice(1);
+        if (u.length === 3 && (u = u.split("").map((z) => z + z).join("")), u.length === 6) {
+          const z = parseInt(u.slice(0, 2), 16), le = parseInt(u.slice(2, 4), 16), pe = parseInt(u.slice(4, 6), 16);
           if (!isNaN(z) && !isNaN(le) && !isNaN(pe)) return `${z}, ${le}, ${pe}`;
         }
       }
-      const o = T.match(/^rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/i);
-      if (o) return `${o[1]}, ${o[2]}, ${o[3]}`;
-      const B = T.split(/[\s,]+/).map(Number).filter((c) => !isNaN(c));
-      return B.length >= 3 ? `${B[0]}, ${B[1]}, ${B[2]}` : null;
-    }
-    function X() {
-      if (n.value && _.accent) {
-        const w = ie(_.accent);
-        w && n.value.style.setProperty("--artifactuse-primary", w);
+      const r = L.match(/^rgba?\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/i);
+      if (r) return `${r[1]}, ${r[2]}, ${r[3]}`;
+      const E = L.split(/[\s,]+/).map(Number).filter((u) => !isNaN(u));
+      return E.length >= 3 ? `${E[0]}, ${E[1]}, ${E[2]}` : null;
+    }
+    function Z() {
+      if (l.value && h.accent) {
+        const w = ie(h.accent);
+        w && l.value.style.setProperty("--artifactuse-primary", w);
       }
     }
     $e(() => {
-      X(), m.value = _.initialState;
-    }), de(() => _.accent, X), de(() => _.initialState, (w) => {
+      Z(), m.value = h.initialState;
+    }), de(() => h.accent, Z), de(() => h.initialState, (w) => {
       m.value = w;
     });
-    function J() {
-      var o;
+    function X() {
+      var r;
       const w = {};
-      W.value.forEach((B) => {
-        ["buttons", "divider", "heading"].includes(B.type) || (B.defaultValue !== void 0 ? w[B.name] = B.defaultValue : B.type === "checkbox" ? w[B.name] = !1 : w[B.name] = "");
-      }), (o = h.value.data) != null && o.defaults && Object.assign(w, h.value.data.defaults), $.value = w;
+      W.value.forEach((E) => {
+        ["buttons", "divider", "heading"].includes(E.type) || (E.defaultValue !== void 0 ? w[E.name] = E.defaultValue : E.type === "checkbox" ? w[E.name] = !1 : w[E.name] = "");
+      }), (r = y.value.data) != null && r.defaults && Object.assign(w, y.value.data.defaults), $.value = w;
     }
-    J(), de(() => _.artifact.code, J);
+    X(), de(() => h.artifact.code, X);
     function oe(w) {
       return ["text", "email", "password", "tel", "url", "number", "date", "time", "datetime-local"].includes(w);
     }
-    function f(w) {
-      return w ? w.map((T) => typeof T == "string" ? { label: T, value: T } : T) : [];
+    function p(w) {
+      return w ? w.map((L) => typeof L == "string" ? { label: L, value: L } : L) : [];
     }
-    function k(w, T) {
-      $.value[w] = T, j.value[w] && delete j.value[w];
+    function k(w, L) {
+      $.value[w] = L, j.value[w] && delete j.value[w];
     }
     function ee() {
-      var B;
+      var E;
       const w = {};
-      W.value.forEach((c) => {
-        if (["buttons", "divider", "heading"].includes(c.type)) return;
-        const z = $.value[c.name];
-        if (c.required && !z && z !== 0 && z !== !1) {
-          w[c.name] = `${c.label || "This field"} is required`;
+      W.value.forEach((u) => {
+        if (["buttons", "divider", "heading"].includes(u.type)) return;
+        const z = $.value[u.name];
+        if (u.required && !z && z !== 0 && z !== !1) {
+          w[u.name] = `${u.label || "This field"} is required`;
           return;
         }
-        if (c.pattern && z && !new RegExp(c.pattern).test(z)) {
-          w[c.name] = c.patternMessage || `${c.label || "This field"} is invalid`;
+        if (u.pattern && z && !new RegExp(u.pattern).test(z)) {
+          w[u.name] = u.patternMessage || `${u.label || "This field"} is invalid`;
           return;
         }
-        if (c.type === "email" && z && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(z)) {
-          w[c.name] = "Please enter a valid email address";
+        if (u.type === "email" && z && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(z)) {
+          w[u.name] = "Please enter a valid email address";
           return;
         }
-        if (c.minLength && z && z.length < c.minLength) {
-          w[c.name] = `Minimum ${c.minLength} characters required`;
+        if (u.minLength && z && z.length < u.minLength) {
+          w[u.name] = `Minimum ${u.minLength} characters required`;
           return;
         }
-        if (c.maxLength && z && z.length > c.maxLength) {
-          w[c.name] = `Maximum ${c.maxLength} characters allowed`;
+        if (u.maxLength && z && z.length > u.maxLength) {
+          w[u.name] = `Maximum ${u.maxLength} characters allowed`;
           return;
         }
       });
-      const o = (B = h.value.data) == null ? void 0 : B.validation;
-      return o && Object.entries(o).forEach(([c, z]) => {
-        if (w[c]) return;
-        const le = $.value[c];
-        z.pattern && le && (new RegExp(z.pattern).test(le) || (w[c] = z.message || `${c} is invalid`));
+      const r = (E = y.value.data) == null ? void 0 : E.validation;
+      return r && Object.entries(r).forEach(([u, z]) => {
+        if (w[u]) return;
+        const le = $.value[u];
+        z.pattern && le && (new RegExp(z.pattern).test(le) || (w[u] = z.message || `${u} is invalid`));
       }), j.value = w, Object.keys(w).length === 0;
     }
     function re() {
-      J(), j.value = {};
+      X(), j.value = {};
     }
-    function P() {
-      ee() && (q.value = !0, L("submit", {
-        formId: p.value,
+    function A() {
+      ee() && (O.value = !0, T("submit", {
+        formId: _.value,
         action: "submit",
         values: { ...$.value },
         timestamp: Date.now()
       }), setTimeout(() => {
-        q.value = !1, S("submitted");
+        O.value = !1, B("submitted");
       }, 300));
     }
     function Q(w) {
-      const T = w.action || "custom";
-      switch (T) {
+      const L = w.action || "custom";
+      switch (L) {
         case "submit":
-          P();
+          A();
           break;
         case "cancel":
-          L("cancel", {
-            formId: p.value,
+          T("cancel", {
+            formId: _.value,
             action: "cancel",
             buttonName: w.name || "cancel",
             timestamp: Date.now()
           }), setTimeout(() => {
-            S("cancelled");
+            B("cancelled");
           }, 150);
           break;
         case "reset":
-          re(), L("reset", {
-            formId: p.value,
+          re(), T("reset", {
+            formId: _.value,
             action: "reset",
             buttonName: w.name || "reset",
             timestamp: Date.now()
@@ -354,34 +354,34 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
           break;
         case "custom":
         default:
-          L("button-click", {
-            formId: p.value,
-            action: T,
+          T("button-click", {
+            formId: _.value,
+            action: L,
             buttonName: w.name || w.label,
             buttonLabel: w.label,
             values: { ...$.value },
             timestamp: Date.now()
           }), setTimeout(() => {
-            S("submitted");
+            B("submitted");
           }, 150);
           break;
       }
     }
-    return (w, T) => (a(), s("div", {
+    return (w, L) => (a(), s("div", {
       ref_key: "containerRef",
-      ref: n,
+      ref: l,
       class: N([
         "artifactuse-inline-form",
         x.value,
-        V.value
+        q.value
       ]),
       "data-artifactuse-theme": H.theme
     }, [
-      r.value ? (a(), s("div", na, [
-        e("div", oa, [
-          m.value === "submitted" ? (a(), s("svg", ra, [...T[1] || (T[1] = [
+      o.value ? (a(), s("div", ua, [
+        e("div", da, [
+          m.value === "submitted" ? (a(), s("svg", va, [...L[1] || (L[1] = [
             e("polyline", { points: "20 6 9 17 4 12" }, null, -1)
-          ])])) : m.value === "cancelled" ? (a(), s("svg", ca, [...T[2] || (T[2] = [
+          ])])) : m.value === "cancelled" ? (a(), s("svg", fa, [...L[2] || (L[2] = [
             e("line", {
               x1: "18",
               y1: "6",
@@ -394,7 +394,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               x2: "18",
               y2: "18"
             }, null, -1)
-          ])])) : (a(), s("svg", ua, [...T[3] || (T[3] = [
+          ])])) : (a(), s("svg", pa, [...L[3] || (L[3] = [
             e("line", {
               x1: "5",
               y1: "12",
@@ -403,216 +403,216 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
             }, null, -1)
           ])]))
         ]),
-        e("span", da, l(F.value), 1)
+        e("span", _a, n(F.value), 1)
       ])) : (a(), s(R, { key: 1 }, [
-        h.value.title || h.value.description ? (a(), s("div", va, [
-          h.value.title ? (a(), s("div", fa, l(h.value.title), 1)) : v("", !0),
-          h.value.description ? (a(), s("p", pa, l(h.value.description), 1)) : v("", !0)
+        y.value.title || y.value.description ? (a(), s("div", ha, [
+          y.value.title ? (a(), s("div", ma, n(y.value.title), 1)) : v("", !0),
+          y.value.description ? (a(), s("p", ya, n(y.value.description), 1)) : v("", !0)
         ])) : v("", !0),
-        h.value.variant === "buttons" ? (a(), s("div", ha, [
-          (a(!0), s(R, null, ve(Y.value, (o) => (a(), s("button", {
-            key: o.name || o.label,
+        y.value.variant === "buttons" ? (a(), s("div", ga, [
+          (a(!0), s(R, null, ve(Y.value, (r) => (a(), s("button", {
+            key: r.name || r.label,
             type: "button",
-            class: N(["artifactuse-form-btn", `artifactuse-form-btn-${o.variant || "secondary"}`]),
-            disabled: o.disabled || q.value,
-            onClick: (B) => Q(o)
+            class: N(["artifactuse-form-btn", `artifactuse-form-btn-${r.variant || "secondary"}`]),
+            disabled: r.disabled || O.value,
+            onClick: (E) => Q(r)
           }, [
-            o.icon ? (a(), s("span", {
+            r.icon ? (a(), s("span", {
               key: 0,
               class: "artifactuse-form-btn-icon",
-              innerHTML: o.icon
-            }, null, 8, ma)) : v("", !0),
-            K(" " + l(o.label), 1)
-          ], 10, _a))), 128))
+              innerHTML: r.icon
+            }, null, 8, wa)) : v("", !0),
+            K(" " + n(r.label), 1)
+          ], 10, ka))), 128))
         ])) : (a(), s("form", {
           key: 2,
           class: "artifactuse-form",
-          onSubmit: me(P, ["prevent"])
+          onSubmit: he(A, ["prevent"])
         }, [
-          e("div", ya, [
-            (a(!0), s(R, null, ve(W.value, (o, B) => (a(), s(R, {
-              key: o.name || B
+          e("div", ba, [
+            (a(!0), s(R, null, ve(W.value, (r, E) => (a(), s(R, {
+              key: r.name || E
             }, [
-              o.type === "buttons" ? (a(), s("div", ga, [
-                (a(!0), s(R, null, ve(o.fields || [], (c) => (a(), s("button", {
-                  key: c.name || c.label,
-                  type: c.action === "submit" ? "submit" : "button",
-                  class: N(["artifactuse-form-btn", `artifactuse-form-btn-${c.variant || "secondary"}`]),
-                  disabled: c.disabled || c.action === "submit" && q.value,
-                  onClick: (z) => c.action !== "submit" ? Q(c) : null
+              r.type === "buttons" ? (a(), s("div", Ca, [
+                (a(!0), s(R, null, ve(r.fields || [], (u) => (a(), s("button", {
+                  key: u.name || u.label,
+                  type: u.action === "submit" ? "submit" : "button",
+                  class: N(["artifactuse-form-btn", `artifactuse-form-btn-${u.variant || "secondary"}`]),
+                  disabled: u.disabled || u.action === "submit" && O.value,
+                  onClick: (z) => u.action !== "submit" ? Q(u) : null
                 }, [
-                  q.value && c.action === "submit" ? (a(), s("span", wa)) : c.icon ? (a(), s("span", {
+                  O.value && u.action === "submit" ? (a(), s("span", $a)) : u.icon ? (a(), s("span", {
                     key: 1,
                     class: "artifactuse-form-btn-icon",
-                    innerHTML: c.icon
-                  }, null, 8, Ca)) : v("", !0),
-                  K(" " + l(q.value && c.action === "submit" ? "Submitting..." : c.label), 1)
-                ], 10, ka))), 128))
-              ])) : o.type === "divider" ? (a(), s("div", ba)) : o.type === "heading" ? (a(), s("div", xa, l(o.label), 1)) : o.type === "checkbox" ? (a(), s("div", $a, [
-                e("label", Ma, [
+                    innerHTML: u.icon
+                  }, null, 8, Ma)) : v("", !0),
+                  K(" " + n(O.value && u.action === "submit" ? "Submitting..." : u.label), 1)
+                ], 10, xa))), 128))
+              ])) : r.type === "divider" ? (a(), s("div", Ta)) : r.type === "heading" ? (a(), s("div", La, n(r.label), 1)) : r.type === "checkbox" ? (a(), s("div", Aa, [
+                e("label", Pa, [
                   e("input", {
                     type: "checkbox",
-                    checked: $.value[o.name],
-                    disabled: o.disabled,
+                    checked: $.value[r.name],
+                    disabled: r.disabled,
                     class: "artifactuse-checkbox",
-                    onChange: (c) => k(o.name, c.target.checked)
-                  }, null, 40, La),
-                  e("span", Ta, [
-                    K(l(o.label) + " ", 1),
-                    o.required ? (a(), s("span", Pa, "*")) : v("", !0)
+                    onChange: (u) => k(r.name, u.target.checked)
+                  }, null, 40, Ha),
+                  e("span", Ba, [
+                    K(n(r.label) + " ", 1),
+                    r.required ? (a(), s("span", Ea, "*")) : v("", !0)
                   ])
                 ]),
-                o.helpText ? (a(), s("span", Aa, l(o.helpText), 1)) : v("", !0),
-                j.value[o.name] ? (a(), s("span", Ha, l(j.value[o.name]), 1)) : v("", !0)
-              ])) : (a(), s("div", Sa, [
+                r.helpText ? (a(), s("span", Sa, n(r.helpText), 1)) : v("", !0),
+                j.value[r.name] ? (a(), s("span", za, n(j.value[r.name]), 1)) : v("", !0)
+              ])) : (a(), s("div", Ia, [
                 e("label", {
-                  for: `${p.value}-${o.name}`,
+                  for: `${_.value}-${r.name}`,
                   class: "artifactuse-label"
                 }, [
-                  K(l(o.label) + " ", 1),
-                  o.required ? (a(), s("span", Ea, "*")) : v("", !0)
-                ], 8, Ba),
-                oe(o.type) ? (a(), s("input", {
+                  K(n(r.label) + " ", 1),
+                  r.required ? (a(), s("span", Va, "*")) : v("", !0)
+                ], 8, Fa),
+                oe(r.type) ? (a(), s("input", {
                   key: 0,
-                  id: `${p.value}-${o.name}`,
-                  type: o.type,
-                  value: $.value[o.name],
-                  placeholder: o.placeholder,
-                  disabled: o.disabled,
-                  required: o.required,
+                  id: `${_.value}-${r.name}`,
+                  type: r.type,
+                  value: $.value[r.name],
+                  placeholder: r.placeholder,
+                  disabled: r.disabled,
+                  required: r.required,
                   class: "artifactuse-input",
-                  onInput: (c) => k(o.name, c.target.value)
-                }, null, 40, za)) : o.type === "textarea" ? (a(), s("textarea", {
+                  onInput: (u) => k(r.name, u.target.value)
+                }, null, 40, Ra)) : r.type === "textarea" ? (a(), s("textarea", {
                   key: 1,
-                  id: `${p.value}-${o.name}`,
-                  value: $.value[o.name],
-                  placeholder: o.placeholder,
-                  disabled: o.disabled,
-                  required: o.required,
-                  rows: o.rows || 3,
+                  id: `${_.value}-${r.name}`,
+                  value: $.value[r.name],
+                  placeholder: r.placeholder,
+                  disabled: r.disabled,
+                  required: r.required,
+                  rows: r.rows || 3,
                   class: "artifactuse-textarea",
-                  onInput: (c) => k(o.name, c.target.value)
-                }, null, 40, Ia)) : o.type === "select" ? (a(), s("select", {
+                  onInput: (u) => k(r.name, u.target.value)
+                }, null, 40, qa)) : r.type === "select" ? (a(), s("select", {
                   key: 2,
-                  id: `${p.value}-${o.name}`,
-                  value: $.value[o.name],
-                  disabled: o.disabled,
-                  required: o.required,
+                  id: `${_.value}-${r.name}`,
+                  value: $.value[r.name],
+                  disabled: r.disabled,
+                  required: r.required,
                   class: "artifactuse-select",
-                  onChange: (c) => k(o.name, c.target.value)
+                  onChange: (u) => k(r.name, u.target.value)
                 }, [
-                  e("option", Va, l(o.placeholder || "Select..."), 1),
-                  (a(!0), s(R, null, ve(f(o.options), (c) => (a(), s("option", {
-                    key: c.value,
-                    value: c.value,
-                    disabled: c.disabled
-                  }, l(c.label), 9, Ra))), 128))
-                ], 40, Fa)) : o.type === "radio" ? (a(), s("div", qa, [
-                  (a(!0), s(R, null, ve(f(o.options), (c) => (a(), s("label", {
-                    key: c.value,
+                  e("option", Ua, n(r.placeholder || "Select..."), 1),
+                  (a(!0), s(R, null, ve(p(r.options), (u) => (a(), s("option", {
+                    key: u.value,
+                    value: u.value,
+                    disabled: u.disabled
+                  }, n(u.label), 9, Da))), 128))
+                ], 40, Oa)) : r.type === "radio" ? (a(), s("div", ja, [
+                  (a(!0), s(R, null, ve(p(r.options), (u) => (a(), s("label", {
+                    key: u.value,
                     class: "artifactuse-radio-label"
                   }, [
                     e("input", {
                       type: "radio",
-                      name: o.name,
-                      value: c.value,
-                      checked: $.value[o.name] === c.value,
-                      disabled: c.disabled || o.disabled,
+                      name: r.name,
+                      value: u.value,
+                      checked: $.value[r.name] === u.value,
+                      disabled: u.disabled || r.disabled,
                       class: "artifactuse-radio",
-                      onChange: (z) => k(o.name, c.value)
-                    }, null, 40, Oa),
-                    e("span", null, l(c.label), 1)
+                      onChange: (z) => k(r.name, u.value)
+                    }, null, 40, Na),
+                    e("span", null, n(u.label), 1)
                   ]))), 128))
                 ])) : v("", !0),
-                o.helpText ? (a(), s("span", Ua, l(o.helpText), 1)) : v("", !0),
-                j.value[o.name] ? (a(), s("span", Da, l(j.value[o.name]), 1)) : v("", !0)
+                r.helpText ? (a(), s("span", Wa, n(r.helpText), 1)) : v("", !0),
+                j.value[r.name] ? (a(), s("span", Ja, n(j.value[r.name]), 1)) : v("", !0)
               ]))
             ], 64))), 128))
           ]),
-          E.value ? v("", !0) : (a(), s("div", ja, [
+          S.value ? v("", !0) : (a(), s("div", Xa, [
             e("button", {
               type: "button",
               class: "artifactuse-form-btn artifactuse-form-btn-ghost",
-              onClick: T[0] || (T[0] = (o) => Q({ action: "cancel", label: "Cancel" }))
+              onClick: L[0] || (L[0] = (r) => Q({ action: "cancel", label: "Cancel" }))
             }, " Cancel "),
             e("button", {
               type: "submit",
               class: "artifactuse-form-btn artifactuse-form-btn-primary",
-              disabled: q.value
+              disabled: O.value
             }, [
-              q.value ? (a(), s("span", Wa)) : v("", !0),
-              K(" " + l(q.value ? "Submitting..." : "Submit"), 1)
-            ], 8, Na)
+              O.value ? (a(), s("span", Ka)) : v("", !0),
+              K(" " + n(O.value ? "Submitting..." : "Submit"), 1)
+            ], 8, Za)
           ]))
         ], 32))
       ], 64))
-    ], 10, la));
+    ], 10, ca));
   }
-}, Xa = ["data-artifactuse-theme"], Za = { class: "artifactuse-social-header" }, Ka = ["src", "alt"], Ya = { class: "artifactuse-social-author" }, Qa = { class: "artifactuse-social-author-name" }, Ga = { class: "artifactuse-social-author-meta" }, es = { class: "artifactuse-social-author-handle" }, ts = { class: "artifactuse-social-timestamp" }, as = { class: "artifactuse-social-content" }, ss = ["innerHTML"], is = {
+}, Qa = ["data-artifactuse-theme"], Ga = { class: "artifactuse-social-header" }, es = ["src", "alt"], ts = { class: "artifactuse-social-author" }, as = { class: "artifactuse-social-author-name" }, ss = { class: "artifactuse-social-author-meta" }, is = { class: "artifactuse-social-author-handle" }, ls = { class: "artifactuse-social-timestamp" }, ns = { class: "artifactuse-social-content" }, os = ["innerHTML"], rs = {
   key: 0,
   class: "artifactuse-social-media"
-}, ls = ["data-count"], ns = ["src", "alt"], os = {
+}, cs = ["data-count"], us = ["src", "alt"], ds = {
   key: 1,
   class: "artifactuse-social-link-card"
-}, rs = ["src", "alt"], cs = { class: "artifactuse-social-link-info" }, us = { class: "artifactuse-social-link-domain" }, ds = { class: "artifactuse-social-link-title" }, vs = {
+}, vs = ["src", "alt"], fs = { class: "artifactuse-social-link-info" }, ps = { class: "artifactuse-social-link-domain" }, _s = { class: "artifactuse-social-link-title" }, hs = {
   key: 0,
   class: "artifactuse-social-link-description"
-}, fs = {
+}, ms = {
   key: 2,
   class: "artifactuse-social-poll"
-}, ps = { class: "artifactuse-social-poll-label" }, hs = { class: "artifactuse-social-poll-label-percent" }, _s = { class: "artifactuse-social-poll-meta" }, ms = {
+}, ys = { class: "artifactuse-social-poll-label" }, gs = { class: "artifactuse-social-poll-label-percent" }, ks = { class: "artifactuse-social-poll-meta" }, ws = {
   key: 3,
   class: "artifactuse-social-quote"
-}, ys = { class: "artifactuse-social-quote-header" }, gs = ["src"], ks = { class: "artifactuse-social-quote-author" }, ws = { class: "artifactuse-social-quote-handle" }, Cs = { class: "artifactuse-social-quote-text" }, bs = {
+}, bs = { class: "artifactuse-social-quote-header" }, Cs = ["src"], xs = { class: "artifactuse-social-quote-author" }, $s = { class: "artifactuse-social-quote-handle" }, Ms = { class: "artifactuse-social-quote-text" }, Ts = {
   key: 0,
   class: "artifactuse-social-engagement"
-}, xs = { class: "artifactuse-social-stat" }, $s = { class: "artifactuse-social-stat" }, Ms = { class: "artifactuse-social-stat" }, Ls = { class: "artifactuse-social-stat" }, Ts = { class: "artifactuse-social-header" }, Ps = ["src", "alt"], As = { class: "artifactuse-social-author-info" }, Hs = { class: "artifactuse-social-author-name" }, Ss = {
+}, Ls = { class: "artifactuse-social-stat" }, As = { class: "artifactuse-social-stat" }, Ps = { class: "artifactuse-social-stat" }, Hs = { class: "artifactuse-social-stat" }, Bs = { class: "artifactuse-social-header" }, Es = ["src", "alt"], Ss = { class: "artifactuse-social-author-info" }, zs = { class: "artifactuse-social-author-name" }, Is = {
   key: 0,
   class: "artifactuse-social-author-connection"
-}, Bs = { class: "artifactuse-social-author-headline" }, Es = { class: "artifactuse-social-timestamp" }, zs = { class: "artifactuse-social-content" }, Is = ["innerHTML"], Fs = {
+}, Fs = { class: "artifactuse-social-author-headline" }, Vs = { class: "artifactuse-social-timestamp" }, Rs = { class: "artifactuse-social-content" }, qs = ["innerHTML"], Os = {
   key: 0,
   class: "artifactuse-social-link-card"
-}, Vs = ["src", "alt"], Rs = { class: "artifactuse-social-link-info" }, qs = { class: "artifactuse-social-link-title" }, Os = { class: "artifactuse-social-link-domain" }, Us = {
+}, Us = ["src", "alt"], Ds = { class: "artifactuse-social-link-info" }, js = { class: "artifactuse-social-link-title" }, Ns = { class: "artifactuse-social-link-domain" }, Ws = {
   key: 0,
   class: "artifactuse-social-engagement"
-}, Ds = { class: "artifactuse-social-reactions" }, js = { class: "artifactuse-social-header" }, Ns = ["src", "alt"], Ws = { class: "artifactuse-social-author-name" }, Js = {
+}, Js = { class: "artifactuse-social-reactions" }, Xs = { class: "artifactuse-social-header" }, Zs = ["src", "alt"], Ks = { class: "artifactuse-social-author-name" }, Ys = {
   key: 0,
   class: "artifactuse-social-verified",
   viewBox: "0 0 24 24",
   fill: "currentColor"
-}, Xs = {
+}, Qs = {
   key: 0,
   class: "artifactuse-social-media"
-}, Zs = ["src", "alt"], Ks = { class: "artifactuse-social-likes" }, Ys = { class: "artifactuse-social-caption" }, Qs = { class: "artifactuse-social-caption-author" }, Gs = ["innerHTML"], ei = { class: "artifactuse-social-timestamp" }, ti = { class: "artifactuse-social-header" }, ai = ["src", "alt"], si = { class: "artifactuse-social-author-info" }, ii = { class: "artifactuse-social-author-name" }, li = { class: "artifactuse-social-timestamp" }, ni = { class: "artifactuse-social-content" }, oi = ["innerHTML"], ri = {
+}, Gs = ["src", "alt"], ei = { class: "artifactuse-social-likes" }, ti = { class: "artifactuse-social-caption" }, ai = { class: "artifactuse-social-caption-author" }, si = ["innerHTML"], ii = { class: "artifactuse-social-timestamp" }, li = { class: "artifactuse-social-header" }, ni = ["src", "alt"], oi = { class: "artifactuse-social-author-info" }, ri = { class: "artifactuse-social-author-name" }, ci = { class: "artifactuse-social-timestamp" }, ui = { class: "artifactuse-social-content" }, di = ["innerHTML"], vi = {
   key: 0,
   class: "artifactuse-social-link-card"
-}, ci = ["src", "alt"], ui = { class: "artifactuse-social-link-info" }, di = { class: "artifactuse-social-link-domain" }, vi = { class: "artifactuse-social-link-title" }, fi = {
+}, fi = ["src", "alt"], pi = { class: "artifactuse-social-link-info" }, _i = { class: "artifactuse-social-link-domain" }, hi = { class: "artifactuse-social-link-title" }, mi = {
   key: 0,
   class: "artifactuse-social-link-description"
-}, pi = {
+}, yi = {
   key: 0,
   class: "artifactuse-social-engagement"
-}, hi = { class: "artifactuse-social-reactions" }, _i = { class: "artifactuse-social-reaction-count" }, mi = { class: "artifactuse-social-comments-shares" }, yi = { class: "artifactuse-social-header" }, gi = ["src", "alt"], ki = { class: "artifactuse-social-author-info" }, wi = { class: "artifactuse-social-author-name" }, Ci = {
+}, gi = { class: "artifactuse-social-reactions" }, ki = { class: "artifactuse-social-reaction-count" }, wi = { class: "artifactuse-social-comments-shares" }, bi = { class: "artifactuse-social-header" }, Ci = ["src", "alt"], xi = { class: "artifactuse-social-author-info" }, $i = { class: "artifactuse-social-author-name" }, Mi = {
   key: 0,
   class: "artifactuse-social-verified",
   viewBox: "0 0 24 24",
   fill: "currentColor"
-}, bi = { class: "artifactuse-social-timestamp" }, xi = { class: "artifactuse-social-content" }, $i = ["innerHTML"], Mi = {
+}, Ti = { class: "artifactuse-social-timestamp" }, Li = { class: "artifactuse-social-content" }, Ai = ["innerHTML"], Pi = {
   key: 0,
   class: "artifactuse-social-engagement"
-}, Li = { class: "artifactuse-social-stat" }, Ti = { class: "artifactuse-social-stat" }, Pi = { class: "artifactuse-social-stat" }, Ai = { class: "artifactuse-social-thumbnail" }, Hi = ["src", "alt"], Si = {
+}, Hi = { class: "artifactuse-social-stat" }, Bi = { class: "artifactuse-social-stat" }, Ei = { class: "artifactuse-social-stat" }, Si = { class: "artifactuse-social-thumbnail" }, zi = ["src", "alt"], Ii = {
   key: 1,
   class: "artifactuse-social-duration"
-}, Bi = { class: "artifactuse-social-info" }, Ei = { class: "artifactuse-social-header" }, zi = ["src", "alt"], Ii = { class: "artifactuse-social-author-name" }, Fi = ["innerHTML"], Vi = {
+}, Fi = { class: "artifactuse-social-info" }, Vi = { class: "artifactuse-social-header" }, Ri = ["src", "alt"], qi = { class: "artifactuse-social-author-name" }, Oi = ["innerHTML"], Ui = {
   key: 0,
   class: "artifactuse-social-sound"
-}, Ri = {
+}, Di = {
   key: 1,
   class: "artifactuse-social-engagement"
-}, qi = { class: "artifactuse-social-thumbnail" }, Oi = ["src", "alt"], Ui = {
+}, ji = { class: "artifactuse-social-thumbnail" }, Ni = ["src", "alt"], Wi = {
   key: 1,
   class: "artifactuse-social-duration"
-}, Di = { class: "artifactuse-social-info" }, ji = ["src", "alt"], Ni = { class: "artifactuse-social-title" }, Wi = { class: "artifactuse-social-channel" }, Ji = { class: "artifactuse-social-meta" }, Xi = { class: "artifactuse-social-actions-bar" }, Zi = { class: "artifactuse-social-platform-badge" }, he = 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23888"><circle cx="12" cy="8" r="4"/><path d="M12 14c-6 0-8 3-8 6v2h16v-2c0-3-2-6-8-6z"/></svg>', Ki = {
+}, Ji = { class: "artifactuse-social-info" }, Xi = ["src", "alt"], Zi = { class: "artifactuse-social-title" }, Ki = { class: "artifactuse-social-channel" }, Yi = { class: "artifactuse-social-meta" }, Qi = { class: "artifactuse-social-actions-bar" }, Gi = { class: "artifactuse-social-platform-badge" }, _e = 'data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23888"><circle cx="12" cy="8" r="4"/><path d="M12 14c-6 0-8 3-8 6v2h16v-2c0-3-2-6-8-6z"/></svg>', el = {
   __name: "ArtifactuseSocialPreview",
   props: {
     artifact: {
@@ -625,37 +625,37 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
     }
   },
   emits: ["copy", "edit"],
-  setup(H, { emit: d }) {
-    const _ = H, L = d, m = M(null), r = M("Copy"), V = b(() => {
+  setup(H, { emit: c }) {
+    const h = H, T = c, m = M(null), o = M("Copy"), q = C(() => {
       try {
-        return JSON.parse(_.artifact.code);
+        return JSON.parse(h.artifact.code);
       } catch {
         return { platform: "twitter", data: {} };
       }
-    }), S = b(() => {
-      var f;
-      return ((f = V.value) == null ? void 0 : f.platform) || "twitter";
+    }), B = C(() => {
+      var p;
+      return ((p = q.value) == null ? void 0 : p.platform) || "twitter";
     });
-    b(() => {
-      var f;
-      return ((f = V.value) == null ? void 0 : f.variant) || "post";
+    C(() => {
+      var p;
+      return ((p = q.value) == null ? void 0 : p.variant) || "post";
     });
-    const h = b(() => {
-      var f, k;
-      return ((k = (f = V.value) == null ? void 0 : f.data) == null ? void 0 : k.author) || {};
-    }), n = b(() => {
-      var f, k;
-      return ((k = (f = V.value) == null ? void 0 : f.data) == null ? void 0 : k.content) || {};
-    }), p = b(() => {
-      var f, k;
-      return ((k = (f = V.value) == null ? void 0 : f.data) == null ? void 0 : k.engagement) || {};
-    }), x = b(() => {
-      var f, k;
-      return ((k = (f = V.value) == null ? void 0 : f.data) == null ? void 0 : k.meta) || {};
-    }), F = b(() => {
-      const f = p.value;
-      return f.likes || f.comments || f.shares || f.retweets || f.replies || f.views;
-    }), $ = b(() => `artifactuse-social-verified-${h.value.verifiedType || "blue"}`), j = b(() => ({
+    const y = C(() => {
+      var p, k;
+      return ((k = (p = q.value) == null ? void 0 : p.data) == null ? void 0 : k.author) || {};
+    }), l = C(() => {
+      var p, k;
+      return ((k = (p = q.value) == null ? void 0 : p.data) == null ? void 0 : k.content) || {};
+    }), _ = C(() => {
+      var p, k;
+      return ((k = (p = q.value) == null ? void 0 : p.data) == null ? void 0 : k.engagement) || {};
+    }), x = C(() => {
+      var p, k;
+      return ((k = (p = q.value) == null ? void 0 : p.data) == null ? void 0 : k.meta) || {};
+    }), F = C(() => {
+      const p = _.value;
+      return p.likes || p.comments || p.shares || p.retweets || p.replies || p.views;
+    }), $ = C(() => `artifactuse-social-verified-${y.value.verifiedType || "blue"}`), j = C(() => ({
       twitter: "X",
       linkedin: "LinkedIn",
       instagram: "Instagram",
@@ -663,8 +663,8 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
       threads: "Threads",
       tiktok: "TikTok",
       youtube: "YouTube"
-    })[S.value] || S.value), q = b(() => {
-      const f = {
+    })[B.value] || B.value), O = C(() => {
+      const p = {
         twitter: () => se("svg", { viewBox: "0 0 24 24", fill: "currentColor" }, [
           se("path", { d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" })
         ]),
@@ -687,61 +687,61 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
           se("path", { d: "M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z" })
         ])
       };
-      return f[S.value] || f.twitter;
-    }), W = b(() => {
-      let f = n.value.text || "";
-      return f = f.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), f = f.replace(/#(\w+)/g, '<span class="artifactuse-social-hashtag">#$1</span>'), f = f.replace(/@(\w+)/g, '<span class="artifactuse-social-mention">@$1</span>'), f = f.replace(
+      return p[B.value] || p.twitter;
+    }), W = C(() => {
+      let p = l.value.text || "";
+      return p = p.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), p = p.replace(/#(\w+)/g, '<span class="artifactuse-social-hashtag">#$1</span>'), p = p.replace(/@(\w+)/g, '<span class="artifactuse-social-mention">@$1</span>'), p = p.replace(
         /(https?:\/\/[^\s]+)/g,
         '<a href="$1" target="_blank" rel="noopener">$1</a>'
-      ), f;
-    }), Y = b(() => {
-      const f = p.value.reactions || {};
-      return Object.values(f).reduce((k, ee) => k + (ee || 0), 0) || p.value.likes || 0;
+      ), p;
+    }), Y = C(() => {
+      const p = _.value.reactions || {};
+      return Object.values(p).reduce((k, ee) => k + (ee || 0), 0) || _.value.likes || 0;
     });
-    function E(f) {
-      return f ? f >= 1e6 ? `${(f / 1e6).toFixed(1)}M` : f >= 1e3 ? `${(f / 1e3).toFixed(1)}K` : f.toString() : "0";
+    function S(p) {
+      return p ? p >= 1e6 ? `${(p / 1e6).toFixed(1)}M` : p >= 1e3 ? `${(p / 1e3).toFixed(1)}K` : p.toString() : "0";
     }
-    function ie(f) {
+    function ie(p) {
       try {
-        return new URL(f).hostname.replace("www.", "");
+        return new URL(p).hostname.replace("www.", "");
       } catch {
-        return f;
+        return p;
       }
     }
-    function X(f) {
-      f.target.src = he;
+    function Z(p) {
+      p.target.src = _e;
     }
-    function J(f) {
-      f.target.style.display = "none";
+    function X(p) {
+      p.target.style.display = "none";
     }
     function oe() {
-      const f = n.value.text || "";
-      navigator.clipboard.writeText(f).then(() => {
-        r.value = "Copied!", setTimeout(() => {
-          r.value = "Copy";
-        }, 2e3), L("copy", { platform: S.value, text: f });
+      const p = l.value.text || "";
+      navigator.clipboard.writeText(p).then(() => {
+        o.value = "Copied!", setTimeout(() => {
+          o.value = "Copy";
+        }, 2e3), T("copy", { platform: B.value, text: p });
       });
     }
-    return (f, k) => {
-      var ee, re, P, Q, w, T;
+    return (p, k) => {
+      var ee, re, A, Q, w, L;
       return a(), s("div", {
         ref_key: "containerRef",
         ref: m,
-        class: N(["artifactuse-social", [`artifactuse-social-${S.value}`]]),
+        class: N(["artifactuse-social", [`artifactuse-social-${B.value}`]]),
         "data-artifactuse-theme": H.theme
       }, [
-        S.value === "twitter" ? (a(), s(R, { key: 0 }, [
-          e("div", Za, [
+        B.value === "twitter" ? (a(), s(R, { key: 0 }, [
+          e("div", Ga, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: y.value.avatar || _e,
+              alt: y.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, Ka),
-            e("div", Ya, [
-              e("div", Qa, [
-                e("span", null, l(h.value.name), 1),
-                h.value.verified ? (a(), s("svg", {
+              onError: Z
+            }, null, 40, es),
+            e("div", ts, [
+              e("div", as, [
+                e("span", null, n(y.value.name), 1),
+                y.value.verified ? (a(), s("svg", {
                   key: 0,
                   class: N(["artifactuse-social-verified", $.value]),
                   viewBox: "0 0 24 24",
@@ -750,40 +750,40 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   e("path", { d: "M22.25 12c0-1.43-.88-2.67-2.19-3.34.46-1.39.2-2.9-.81-3.91s-2.52-1.27-3.91-.81c-.66-1.31-1.91-2.19-3.34-2.19s-2.67.88-3.34 2.19c-1.39-.46-2.9-.2-3.91.81s-1.27 2.52-.81 3.91C2.63 9.33 1.75 10.57 1.75 12s.88 2.67 2.19 3.34c-.46 1.39-.2 2.9.81 3.91s2.52 1.27 3.91.81c.66 1.31 1.91 2.19 3.34 2.19s2.67-.88 3.34-2.19c1.39.46 2.9.2 3.91-.81s1.27-2.52.81-3.91c1.31-.67 2.19-1.91 2.19-3.34zm-11.71 4.2L6.8 12.46l1.41-1.42 2.26 2.26 4.8-5.23 1.47 1.36-6.2 6.77z" }, null, -1)
                 ])], 2)) : v("", !0)
               ]),
-              e("div", Ga, [
-                e("span", es, l(h.value.handle), 1),
-                e("span", ts, "· " + l(x.value.timestamp || "Just now"), 1)
+              e("div", ss, [
+                e("span", is, n(y.value.handle), 1),
+                e("span", ls, "· " + n(x.value.timestamp || "Just now"), 1)
               ])
             ])
           ]),
-          e("div", as, [
+          e("div", ns, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, ss),
-            (ee = n.value.media) != null && ee.length ? (a(), s("div", is, [
+            }, null, 8, os),
+            (ee = l.value.media) != null && ee.length ? (a(), s("div", rs, [
               e("div", {
-                class: N(["artifactuse-social-media-grid", { "artifactuse-social-media-single": n.value.media.length === 1 }]),
-                "data-count": n.value.media.length
+                class: N(["artifactuse-social-media-grid", { "artifactuse-social-media-single": l.value.media.length === 1 }]),
+                "data-count": l.value.media.length
               }, [
-                (a(!0), s(R, null, ve(n.value.media.slice(0, 4), (o, B) => (a(), s("img", {
-                  key: B,
-                  src: o.url,
-                  alt: o.alt || "",
-                  onError: J
-                }, null, 40, ns))), 128))
-              ], 10, ls)
+                (a(!0), s(R, null, ve(l.value.media.slice(0, 4), (r, E) => (a(), s("img", {
+                  key: E,
+                  src: r.url,
+                  alt: r.alt || "",
+                  onError: X
+                }, null, 40, us))), 128))
+              ], 10, cs)
             ])) : v("", !0),
-            n.value.link && !((re = n.value.media) != null && re.length) ? (a(), s("div", os, [
-              n.value.link.image ? (a(), s("img", {
+            l.value.link && !((re = l.value.media) != null && re.length) ? (a(), s("div", ds, [
+              l.value.link.image ? (a(), s("img", {
                 key: 0,
-                src: n.value.link.image,
-                alt: n.value.link.title,
+                src: l.value.link.image,
+                alt: l.value.link.title,
                 class: "artifactuse-social-link-image",
-                onError: J
-              }, null, 40, rs)) : v("", !0),
-              e("div", cs, [
-                e("div", us, [
+                onError: X
+              }, null, 40, vs)) : v("", !0),
+              e("div", fs, [
+                e("div", ps, [
                   k[1] || (k[1] = e("svg", {
                     fill: "none",
                     viewBox: "0 0 24 24",
@@ -796,45 +796,45 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       d: "M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"
                     })
                   ], -1)),
-                  K(" " + l(n.value.link.domain || ie(n.value.link.url)), 1)
+                  K(" " + n(l.value.link.domain || ie(l.value.link.url)), 1)
                 ]),
-                e("div", ds, l(n.value.link.title), 1),
-                n.value.link.description ? (a(), s("div", vs, l(n.value.link.description), 1)) : v("", !0)
+                e("div", _s, n(l.value.link.title), 1),
+                l.value.link.description ? (a(), s("div", hs, n(l.value.link.description), 1)) : v("", !0)
               ])
             ])) : v("", !0),
-            n.value.poll ? (a(), s("div", fs, [
-              (a(!0), s(R, null, ve(n.value.poll.options, (o, B) => {
-                var c, z;
+            l.value.poll ? (a(), s("div", ms, [
+              (a(!0), s(R, null, ve(l.value.poll.options, (r, E) => {
+                var u, z;
                 return a(), s("div", {
-                  key: B,
+                  key: E,
                   class: "artifactuse-social-poll-option"
                 }, [
                   e("div", {
                     class: "artifactuse-social-poll-bar",
-                    style: Pe({ width: `${((c = n.value.poll.votes) == null ? void 0 : c[B]) || 0}%` })
+                    style: Pe({ width: `${((u = l.value.poll.votes) == null ? void 0 : u[E]) || 0}%` })
                   }, null, 4),
-                  e("div", ps, [
-                    e("span", null, l(o), 1),
-                    e("span", hs, l(((z = n.value.poll.votes) == null ? void 0 : z[B]) || 0) + "%", 1)
+                  e("div", ys, [
+                    e("span", null, n(r), 1),
+                    e("span", gs, n(((z = l.value.poll.votes) == null ? void 0 : z[E]) || 0) + "%", 1)
                   ])
                 ]);
               }), 128)),
-              e("div", _s, l(E(n.value.poll.totalVotes || 0)) + " votes · " + l(n.value.poll.duration || "Poll ended"), 1)
+              e("div", ks, n(S(l.value.poll.totalVotes || 0)) + " votes · " + n(l.value.poll.duration || "Poll ended"), 1)
             ])) : v("", !0),
-            n.value.quote ? (a(), s("div", ms, [
-              e("div", ys, [
+            l.value.quote ? (a(), s("div", ws, [
+              e("div", bs, [
                 e("img", {
-                  src: ((P = n.value.quote.author) == null ? void 0 : P.avatar) || he,
+                  src: ((A = l.value.quote.author) == null ? void 0 : A.avatar) || _e,
                   class: "artifactuse-social-quote-avatar"
-                }, null, 8, gs),
-                e("span", ks, l((Q = n.value.quote.author) == null ? void 0 : Q.name), 1),
-                e("span", ws, l((w = n.value.quote.author) == null ? void 0 : w.handle), 1)
+                }, null, 8, Cs),
+                e("span", xs, n((Q = l.value.quote.author) == null ? void 0 : Q.name), 1),
+                e("span", $s, n((w = l.value.quote.author) == null ? void 0 : w.handle), 1)
               ]),
-              e("p", Cs, l(n.value.quote.text), 1)
+              e("p", Ms, n(l.value.quote.text), 1)
             ])) : v("", !0)
           ]),
-          F.value ? (a(), s("div", bs, [
-            e("div", xs, [
+          F.value ? (a(), s("div", Ts, [
+            e("div", Ls, [
               k[2] || (k[2] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -843,9 +843,9 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M12 21C6.5 21 2 16.5 2 11V3l7 3 3-3 3 3 7-3v8c0 5.5-4.5 10-10 10z" })
               ], -1)),
-              e("span", null, l(E(p.value.replies || 0)), 1)
+              e("span", null, n(S(_.value.replies || 0)), 1)
             ]),
-            e("div", $s, [
+            e("div", As, [
               k[3] || (k[3] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -854,9 +854,9 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M7 17L17 7M17 7H8M17 7V16" })
               ], -1)),
-              e("span", null, l(E(p.value.retweets || 0)), 1)
+              e("span", null, n(S(_.value.retweets || 0)), 1)
             ]),
-            e("div", Ms, [
+            e("div", Ps, [
               k[4] || (k[4] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -865,9 +865,9 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" })
               ], -1)),
-              e("span", null, l(E(p.value.likes || 0)), 1)
+              e("span", null, n(S(_.value.likes || 0)), 1)
             ]),
-            e("div", Ls, [
+            e("div", Hs, [
               k[5] || (k[5] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -876,25 +876,25 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M15 3h4a2 2 0 012 2v14a2 2 0 01-2 2h-4M10 17l5-5-5-5M13.8 12H3" })
               ], -1)),
-              e("span", null, l(E(p.value.views || 0)), 1)
+              e("span", null, n(S(_.value.views || 0)), 1)
             ])
           ])) : v("", !0)
-        ], 64)) : S.value === "linkedin" ? (a(), s(R, { key: 1 }, [
-          e("div", Ts, [
+        ], 64)) : B.value === "linkedin" ? (a(), s(R, { key: 1 }, [
+          e("div", Bs, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: y.value.avatar || _e,
+              alt: y.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, Ps),
-            e("div", As, [
-              e("div", Hs, [
-                K(l(h.value.name) + " ", 1),
-                h.value.connection ? (a(), s("span", Ss, "· " + l(h.value.connection), 1)) : v("", !0)
+              onError: Z
+            }, null, 40, Es),
+            e("div", Ss, [
+              e("div", zs, [
+                K(n(y.value.name) + " ", 1),
+                y.value.connection ? (a(), s("span", Is, "· " + n(y.value.connection), 1)) : v("", !0)
               ]),
-              e("div", Bs, l(h.value.headline), 1),
-              e("div", Es, [
-                K(l(x.value.timestamp || "Just now") + " · ", 1),
+              e("div", Fs, n(y.value.headline), 1),
+              e("div", Vs, [
+                K(n(x.value.timestamp || "Just now") + " · ", 1),
                 k[6] || (k[6] = e("svg", {
                   viewBox: "0 0 24 24",
                   fill: "currentColor"
@@ -904,80 +904,80 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ])
             ])
           ]),
-          e("div", zs, [
+          e("div", Rs, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, Is),
-            n.value.link ? (a(), s("div", Fs, [
-              n.value.link.image ? (a(), s("img", {
+            }, null, 8, qs),
+            l.value.link ? (a(), s("div", Os, [
+              l.value.link.image ? (a(), s("img", {
                 key: 0,
-                src: n.value.link.image,
-                alt: n.value.link.title,
+                src: l.value.link.image,
+                alt: l.value.link.title,
                 class: "artifactuse-social-link-image",
-                onError: J
-              }, null, 40, Vs)) : v("", !0),
-              e("div", Rs, [
-                e("div", qs, l(n.value.link.title), 1),
-                e("div", Os, l(n.value.link.domain || ie(n.value.link.url)), 1)
+                onError: X
+              }, null, 40, Us)) : v("", !0),
+              e("div", Ds, [
+                e("div", js, n(l.value.link.title), 1),
+                e("div", Ns, n(l.value.link.domain || ie(l.value.link.url)), 1)
               ])
             ])) : v("", !0)
           ]),
-          F.value ? (a(), s("div", Us, [
-            e("div", Ds, [
+          F.value ? (a(), s("div", Ws, [
+            e("div", Js, [
               k[7] || (k[7] = e("div", { class: "artifactuse-social-reaction-icons" }, [
                 e("span", { class: "artifactuse-social-reaction-icon" }, "👍"),
                 e("span", { class: "artifactuse-social-reaction-icon" }, "❤️"),
                 e("span", { class: "artifactuse-social-reaction-icon" }, "👏")
               ], -1)),
-              e("span", null, l(E(p.value.likes || 0)), 1)
+              e("span", null, n(S(_.value.likes || 0)), 1)
             ]),
-            e("span", null, l(E(p.value.comments || 0)) + " comments · " + l(E(p.value.shares || 0)) + " shares", 1)
+            e("span", null, n(S(_.value.comments || 0)) + " comments · " + n(S(_.value.shares || 0)) + " shares", 1)
           ])) : v("", !0)
-        ], 64)) : S.value === "instagram" ? (a(), s(R, { key: 2 }, [
-          e("div", js, [
+        ], 64)) : B.value === "instagram" ? (a(), s(R, { key: 2 }, [
+          e("div", Xs, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: y.value.avatar || _e,
+              alt: y.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, Ns),
-            e("div", Ws, [
-              K(l(h.value.name) + " ", 1),
-              h.value.verified ? (a(), s("svg", Js, [...k[8] || (k[8] = [
+              onError: Z
+            }, null, 40, Zs),
+            e("div", Ks, [
+              K(n(y.value.name) + " ", 1),
+              y.value.verified ? (a(), s("svg", Ys, [...k[8] || (k[8] = [
                 e("path", { d: "M22.25 12c0-1.43-.88-2.67-2.19-3.34.46-1.39.2-2.9-.81-3.91s-2.52-1.27-3.91-.81c-.66-1.31-1.91-2.19-3.34-2.19s-2.67.88-3.34 2.19c-1.39-.46-2.9-.2-3.91.81s-1.27 2.52-.81 3.91C2.63 9.33 1.75 10.57 1.75 12s.88 2.67 2.19 3.34c-.46 1.39-.2 2.9.81 3.91s2.52 1.27 3.91.81c.66 1.31 1.91 2.19 3.34 2.19s2.67-.88 3.34-2.19c1.39.46 2.9.2 3.91-.81s1.27-2.52.81-3.91c1.31-.67 2.19-1.91 2.19-3.34zm-11.71 4.2L6.8 12.46l1.41-1.42 2.26 2.26 4.8-5.23 1.47 1.36-6.2 6.77z" }, null, -1)
               ])])) : v("", !0)
             ])
           ]),
-          (T = n.value.media) != null && T.length ? (a(), s("div", Xs, [
+          (L = l.value.media) != null && L.length ? (a(), s("div", Qs, [
             e("img", {
-              src: n.value.media[0].url,
-              alt: n.value.media[0].alt || "",
-              onError: J
-            }, null, 40, Zs)
+              src: l.value.media[0].url,
+              alt: l.value.media[0].alt || "",
+              onError: X
+            }, null, 40, Gs)
           ])) : v("", !0),
-          k[9] || (k[9] = It('<div class="artifactuse-social-actions"><div class="artifactuse-social-action"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"></path></svg></div><div class="artifactuse-social-action"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path></svg></div><div class="artifactuse-social-action"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z"></path></svg></div></div>', 1)),
-          e("div", Ks, l(E(p.value.likes || 0)) + " likes", 1),
-          e("div", Ys, [
-            e("span", Qs, l(h.value.name), 1),
+          k[9] || (k[9] = qt('<div class="artifactuse-social-actions"><div class="artifactuse-social-action"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"></path></svg></div><div class="artifactuse-social-action"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z"></path></svg></div><div class="artifactuse-social-action"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z"></path></svg></div></div>', 1)),
+          e("div", ei, n(S(_.value.likes || 0)) + " likes", 1),
+          e("div", ti, [
+            e("span", ai, n(y.value.name), 1),
             e("span", {
               class: "artifactuse-social-caption-text",
               innerHTML: W.value
-            }, null, 8, Gs)
+            }, null, 8, si)
           ]),
-          e("div", ei, l(x.value.timestamp || "Just now"), 1)
-        ], 64)) : S.value === "facebook" ? (a(), s(R, { key: 3 }, [
-          e("div", ti, [
+          e("div", ii, n(x.value.timestamp || "Just now"), 1)
+        ], 64)) : B.value === "facebook" ? (a(), s(R, { key: 3 }, [
+          e("div", li, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: y.value.avatar || _e,
+              alt: y.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, ai),
-            e("div", si, [
-              e("div", ii, l(h.value.name), 1),
-              e("div", li, [
-                K(l(x.value.timestamp || "Just now") + " · ", 1),
+              onError: Z
+            }, null, 40, ni),
+            e("div", oi, [
+              e("div", ri, n(y.value.name), 1),
+              e("div", ci, [
+                K(n(x.value.timestamp || "Just now") + " · ", 1),
                 k[10] || (k[10] = e("svg", {
                   viewBox: "0 0 24 24",
                   fill: "currentColor"
@@ -987,63 +987,63 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ])
             ])
           ]),
-          e("div", ni, [
+          e("div", ui, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, oi),
-            n.value.link ? (a(), s("div", ri, [
-              n.value.link.image ? (a(), s("img", {
+            }, null, 8, di),
+            l.value.link ? (a(), s("div", vi, [
+              l.value.link.image ? (a(), s("img", {
                 key: 0,
-                src: n.value.link.image,
-                alt: n.value.link.title,
+                src: l.value.link.image,
+                alt: l.value.link.title,
                 class: "artifactuse-social-link-image",
-                onError: J
-              }, null, 40, ci)) : v("", !0),
-              e("div", ui, [
-                e("div", di, l(n.value.link.domain || ie(n.value.link.url)), 1),
-                e("div", vi, l(n.value.link.title), 1),
-                n.value.link.description ? (a(), s("div", fi, l(n.value.link.description), 1)) : v("", !0)
+                onError: X
+              }, null, 40, fi)) : v("", !0),
+              e("div", pi, [
+                e("div", _i, n(l.value.link.domain || ie(l.value.link.url)), 1),
+                e("div", hi, n(l.value.link.title), 1),
+                l.value.link.description ? (a(), s("div", mi, n(l.value.link.description), 1)) : v("", !0)
               ])
             ])) : v("", !0)
           ]),
-          F.value ? (a(), s("div", pi, [
-            e("div", hi, [
+          F.value ? (a(), s("div", yi, [
+            e("div", gi, [
               k[11] || (k[11] = e("div", { class: "artifactuse-social-reaction-emojis" }, [
                 e("span", { class: "artifactuse-social-reaction-emoji" }, "👍"),
                 e("span", { class: "artifactuse-social-reaction-emoji" }, "❤️"),
                 e("span", { class: "artifactuse-social-reaction-emoji" }, "😂")
               ], -1)),
-              e("span", _i, l(E(Y.value)), 1)
+              e("span", ki, n(S(Y.value)), 1)
             ]),
-            e("span", mi, l(E(p.value.comments || 0)) + " comments · " + l(E(p.value.shares || 0)) + " shares", 1)
+            e("span", wi, n(S(_.value.comments || 0)) + " comments · " + n(S(_.value.shares || 0)) + " shares", 1)
           ])) : v("", !0)
-        ], 64)) : S.value === "threads" ? (a(), s(R, { key: 4 }, [
-          e("div", yi, [
+        ], 64)) : B.value === "threads" ? (a(), s(R, { key: 4 }, [
+          e("div", bi, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: y.value.avatar || _e,
+              alt: y.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, gi),
-            e("div", ki, [
-              e("div", wi, [
-                K(l(h.value.name) + " ", 1),
-                h.value.verified ? (a(), s("svg", Ci, [...k[12] || (k[12] = [
+              onError: Z
+            }, null, 40, Ci),
+            e("div", xi, [
+              e("div", $i, [
+                K(n(y.value.name) + " ", 1),
+                y.value.verified ? (a(), s("svg", Mi, [...k[12] || (k[12] = [
                   e("path", { d: "M22.25 12c0-1.43-.88-2.67-2.19-3.34.46-1.39.2-2.9-.81-3.91s-2.52-1.27-3.91-.81c-.66-1.31-1.91-2.19-3.34-2.19s-2.67.88-3.34 2.19c-1.39-.46-2.9-.2-3.91.81s-1.27 2.52-.81 3.91C2.63 9.33 1.75 10.57 1.75 12s.88 2.67 2.19 3.34c-.46 1.39-.2 2.9.81 3.91s2.52 1.27 3.91.81c.66 1.31 1.91 2.19 3.34 2.19s2.67-.88 3.34-2.19c1.39.46 2.9.2 3.91-.81s1.27-2.52.81-3.91c1.31-.67 2.19-1.91 2.19-3.34zm-11.71 4.2L6.8 12.46l1.41-1.42 2.26 2.26 4.8-5.23 1.47 1.36-6.2 6.77z" }, null, -1)
                 ])])) : v("", !0)
               ]),
-              e("span", bi, l(x.value.timestamp || "Just now"), 1)
+              e("span", Ti, n(x.value.timestamp || "Just now"), 1)
             ])
           ]),
-          e("div", xi, [
+          e("div", Li, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, $i)
+            }, null, 8, Ai)
           ]),
-          F.value ? (a(), s("div", Mi, [
-            e("div", Li, [
+          F.value ? (a(), s("div", Pi, [
+            e("div", Hi, [
               k[13] || (k[13] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -1052,9 +1052,9 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" })
               ], -1)),
-              e("span", null, l(E(p.value.likes || 0)), 1)
+              e("span", null, n(S(_.value.likes || 0)), 1)
             ]),
-            e("div", Ti, [
+            e("div", Bi, [
               k[14] || (k[14] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -1063,9 +1063,9 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M21 11.5a8.38 8.38 0 01-.9 3.8 8.5 8.5 0 01-7.6 4.7 8.38 8.38 0 01-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 01-.9-3.8 8.5 8.5 0 014.7-7.6 8.38 8.38 0 013.8-.9h.5a8.48 8.48 0 018 8v.5z" })
               ], -1)),
-              e("span", null, l(E(p.value.comments || 0)), 1)
+              e("span", null, n(S(_.value.comments || 0)), 1)
             ]),
-            e("div", Pi, [
+            e("div", Ei, [
               k[15] || (k[15] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -1074,17 +1074,17 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }, [
                 e("path", { d: "M7 17L17 7M17 7H8M17 7V16" })
               ], -1)),
-              e("span", null, l(E(p.value.shares || 0)), 1)
+              e("span", null, n(S(_.value.shares || 0)), 1)
             ])
           ])) : v("", !0)
-        ], 64)) : S.value === "tiktok" ? (a(), s(R, { key: 5 }, [
-          e("div", Ai, [
-            n.value.thumbnail ? (a(), s("img", {
+        ], 64)) : B.value === "tiktok" ? (a(), s(R, { key: 5 }, [
+          e("div", Si, [
+            l.value.thumbnail ? (a(), s("img", {
               key: 0,
-              src: n.value.thumbnail,
-              alt: n.value.text,
-              onError: J
-            }, null, 40, Hi)) : v("", !0),
+              src: l.value.thumbnail,
+              alt: l.value.text,
+              onError: X
+            }, null, 40, zi)) : v("", !0),
             k[16] || (k[16] = e("div", { class: "artifactuse-social-play-button" }, [
               e("div", { class: "artifactuse-social-play-icon" }, [
                 e("svg", {
@@ -1095,65 +1095,65 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 ])
               ])
             ], -1)),
-            n.value.duration ? (a(), s("div", Si, l(n.value.duration), 1)) : v("", !0)
+            l.value.duration ? (a(), s("div", Ii, n(l.value.duration), 1)) : v("", !0)
           ]),
-          e("div", Bi, [
-            e("div", Ei, [
+          e("div", Fi, [
+            e("div", Vi, [
               e("img", {
-                src: h.value.avatar || he,
-                alt: h.value.name,
+                src: y.value.avatar || _e,
+                alt: y.value.name,
                 class: "artifactuse-social-avatar",
-                onError: X
-              }, null, 40, zi),
-              e("span", Ii, l(h.value.name), 1)
+                onError: Z
+              }, null, 40, Ri),
+              e("span", qi, n(y.value.name), 1)
             ]),
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, Fi),
-            n.value.sound ? (a(), s("div", Vi, [
+            }, null, 8, Oi),
+            l.value.sound ? (a(), s("div", Ui, [
               k[17] || (k[17] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "currentColor"
               }, [
                 e("path", { d: "M12 3v10.55c-.59-.34-1.27-.55-2-.55-2.21 0-4 1.79-4 4s1.79 4 4 4 4-1.79 4-4V7h4V3h-6z" })
               ], -1)),
-              K(" " + l(n.value.sound), 1)
+              K(" " + n(l.value.sound), 1)
             ])) : v("", !0),
-            F.value ? (a(), s("div", Ri, [
-              e("span", null, l(E(p.value.likes || 0)) + " likes", 1),
-              e("span", null, l(E(p.value.comments || 0)) + " comments", 1),
-              e("span", null, l(E(p.value.shares || 0)) + " shares", 1)
+            F.value ? (a(), s("div", Di, [
+              e("span", null, n(S(_.value.likes || 0)) + " likes", 1),
+              e("span", null, n(S(_.value.comments || 0)) + " comments", 1),
+              e("span", null, n(S(_.value.shares || 0)) + " shares", 1)
             ])) : v("", !0)
           ])
-        ], 64)) : S.value === "youtube" ? (a(), s(R, { key: 6 }, [
-          e("div", qi, [
-            n.value.thumbnail ? (a(), s("img", {
+        ], 64)) : B.value === "youtube" ? (a(), s(R, { key: 6 }, [
+          e("div", ji, [
+            l.value.thumbnail ? (a(), s("img", {
               key: 0,
-              src: n.value.thumbnail,
-              alt: n.value.title,
-              onError: J
-            }, null, 40, Oi)) : v("", !0),
-            n.value.duration ? (a(), s("div", Ui, l(n.value.duration), 1)) : v("", !0)
+              src: l.value.thumbnail,
+              alt: l.value.title,
+              onError: X
+            }, null, 40, Ni)) : v("", !0),
+            l.value.duration ? (a(), s("div", Wi, n(l.value.duration), 1)) : v("", !0)
           ]),
-          e("div", Di, [
+          e("div", Ji, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: y.value.avatar || _e,
+              alt: y.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, ji),
+              onError: Z
+            }, null, 40, Xi),
             e("div", null, [
-              e("div", Ni, l(n.value.title || n.value.text), 1),
-              e("div", Wi, l(h.value.name), 1),
-              e("div", Ji, l(E(p.value.views || 0)) + " views · " + l(x.value.timestamp || "Just now"), 1)
+              e("div", Zi, n(l.value.title || l.value.text), 1),
+              e("div", Ki, n(y.value.name), 1),
+              e("div", Yi, n(S(_.value.views || 0)) + " views · " + n(x.value.timestamp || "Just now"), 1)
             ])
           ])
         ], 64)) : v("", !0),
-        e("div", Xi, [
-          e("div", Zi, [
-            (a(), xe(Ft(q.value))),
-            e("span", null, l(j.value), 1)
+        e("div", Qi, [
+          e("div", Gi, [
+            (a(), xe(Ot(O.value))),
+            e("span", null, n(j.value), 1)
           ]),
           e("button", {
             class: "artifactuse-social-copy-btn",
@@ -1175,31 +1175,31 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               }),
               e("path", { d: "M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1" })
             ], -1)),
-            K(" " + l(r.value), 1)
+            K(" " + n(o.value), 1)
           ])
         ])
-      ], 10, Xa);
+      ], 10, Qa);
     };
   }
-}, Yi = ["src", "alt"], Qi = ["src"], Gi = {
+}, tl = ["src", "alt"], al = ["src"], sl = {
   key: 2,
   class: "artifactuse-viewer-controls"
-}, el = ["title"], tl = {
+}, il = ["title"], ll = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, al = {
+}, nl = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, sl = {
+}, ol = {
   key: 3,
   class: "artifactuse-viewer-caption"
-}, il = {
+}, rl = {
   __name: "ArtifactuseViewer",
   props: {
     // Whether the viewer is open
@@ -1229,61 +1229,61 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
     }
   },
   emits: ["close"],
-  setup(H, { emit: d }) {
-    const _ = H, L = d, m = M(null), r = M(!1);
-    function V() {
-      r.value = !1, L("close");
+  setup(H, { emit: c }) {
+    const h = H, T = c, m = M(null), o = M(!1);
+    function q() {
+      o.value = !1, T("close");
     }
-    function S() {
-      _.type === "image" && (r.value = !r.value);
+    function B() {
+      h.type === "image" && (o.value = !o.value);
     }
-    function h() {
-      const p = document.createElement("a");
-      p.href = _.src, p.download = _.alt || "download", document.body.appendChild(p), p.click(), document.body.removeChild(p);
+    function y() {
+      const _ = document.createElement("a");
+      _.href = h.src, _.download = h.alt || "download", document.body.appendChild(_), _.click(), document.body.removeChild(_);
     }
-    function n(p) {
-      p.key === "Escape" && _.isOpen && V();
+    function l(_) {
+      _.key === "Escape" && h.isOpen && q();
     }
-    return de(() => _.isOpen, (p) => {
-      p ? (be(() => {
+    return de(() => h.isOpen, (_) => {
+      _ ? (Ce(() => {
         var x;
         (x = m.value) == null || x.focus();
-      }), document.body.style.overflow = "hidden") : (document.body.style.overflow = "", r.value = !1);
+      }), document.body.style.overflow = "hidden") : (document.body.style.overflow = "", o.value = !1);
     }), $e(() => {
-      document.addEventListener("keydown", n);
-    }), De(() => {
-      document.removeEventListener("keydown", n), document.body.style.overflow = "";
-    }), (p, x) => (a(), xe(Vt, { to: "body" }, [
-      Be(Ae, { name: "artifactuse-viewer" }, {
-        default: He(() => [
+      document.addEventListener("keydown", l);
+    }), Ne(() => {
+      document.removeEventListener("keydown", l), document.body.style.overflow = "";
+    }), (_, x) => (a(), xe(Ut, { to: "body" }, [
+      Se(He, { name: "artifactuse-viewer" }, {
+        default: Be(() => [
           H.isOpen ? (a(), s("div", {
             key: 0,
             class: "artifactuse-viewer-overlay",
-            onClick: V,
-            onKeydown: Rt(V, ["escape"]),
+            onClick: q,
+            onKeydown: Dt(q, ["escape"]),
             tabindex: "-1",
             ref_key: "overlayRef",
             ref: m
           }, [
             e("div", {
               class: "artifactuse-viewer-content",
-              onClick: x[0] || (x[0] = me(() => {
+              onClick: x[0] || (x[0] = he(() => {
               }, ["stop"]))
             }, [
               H.type === "image" ? (a(), s("img", {
                 key: 0,
                 src: H.src,
                 alt: H.alt,
-                class: N(["artifactuse-viewer-image", { "artifactuse-viewer-image--zoomed": r.value }]),
-                onClick: S
-              }, null, 10, Yi)) : H.type === "pdf" ? (a(), s("iframe", {
+                class: N(["artifactuse-viewer-image", { "artifactuse-viewer-image--zoomed": o.value }]),
+                onClick: B
+              }, null, 10, tl)) : H.type === "pdf" ? (a(), s("iframe", {
                 key: 1,
                 src: H.src,
                 class: "artifactuse-viewer-pdf"
-              }, null, 8, Qi)) : v("", !0),
+              }, null, 8, al)) : v("", !0),
               e("button", {
                 class: "artifactuse-viewer-close",
-                onClick: V,
+                onClick: q,
                 title: "Close (Esc)"
               }, [...x[1] || (x[1] = [
                 e("svg", {
@@ -1306,13 +1306,13 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   })
                 ], -1)
               ])]),
-              H.type === "image" ? (a(), s("div", Gi, [
+              H.type === "image" ? (a(), s("div", sl, [
                 e("button", {
                   class: "artifactuse-viewer-control",
-                  onClick: me(S, ["stop"]),
-                  title: r.value ? "Zoom out" : "Zoom in"
+                  onClick: he(B, ["stop"]),
+                  title: o.value ? "Zoom out" : "Zoom in"
                 }, [
-                  r.value ? (a(), s("svg", al, [...x[3] || (x[3] = [
+                  o.value ? (a(), s("svg", nl, [...x[3] || (x[3] = [
                     e("circle", {
                       cx: "11",
                       cy: "11",
@@ -1330,7 +1330,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       x2: "14",
                       y2: "11"
                     }, null, -1)
-                  ])])) : (a(), s("svg", tl, [...x[2] || (x[2] = [
+                  ])])) : (a(), s("svg", ll, [...x[2] || (x[2] = [
                     e("circle", {
                       cx: "11",
                       cy: "11",
@@ -1355,10 +1355,10 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       y2: "11"
                     }, null, -1)
                   ])]))
-                ], 8, el),
+                ], 8, il),
                 e("button", {
                   class: "artifactuse-viewer-control",
-                  onClick: me(h, ["stop"]),
+                  onClick: he(y, ["stop"]),
                   title: "Download"
                 }, [...x[4] || (x[4] = [
                   e("svg", {
@@ -1378,7 +1378,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   ], -1)
                 ])])
               ])) : v("", !0),
-              H.caption ? (a(), s("div", sl, l(H.caption), 1)) : v("", !0)
+              H.caption ? (a(), s("div", ol, n(H.caption), 1)) : v("", !0)
             ])
           ], 544)) : v("", !0)
         ]),
@@ -1386,7 +1386,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
       })
     ]));
   }
-}, ll = ["innerHTML"], Un = {
+}, cl = ["innerHTML"], Gn = {
   __name: "ArtifactuseAgentMessage",
   props: {
     // The raw message content (markdown/HTML from AI)
@@ -1447,33 +1447,33 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
     "social-copy",
     "media-open"
   ],
-  setup(H, { expose: d, emit: _ }) {
-    const L = H, m = _, {
-      processMessage: r,
-      openArtifact: V,
-      state: S,
-      getTheme: h,
-      instance: n
-    } = Ee(), p = M(null), x = M(null), F = M(""), $ = M([]);
+  setup(H, { expose: c, emit: h }) {
+    const T = H, m = h, {
+      processMessage: o,
+      openArtifact: q,
+      state: B,
+      getTheme: y,
+      instance: l
+    } = ze(), _ = M(null), x = M(null), F = M(""), $ = M([]);
     let j = null;
-    const q = M(!1), W = M("image"), Y = M(""), E = M(""), ie = M(""), X = b(() => (h == null ? void 0 : h()) || "dark"), J = b(() => S.activeArtifactId), oe = b(() => {
-      var C;
-      return L.inlineCards ?? ((C = n == null ? void 0 : n.config) == null ? void 0 : C.inlineCards) ?? !0;
-    }), f = M(!1);
+    const O = M(!1), W = M("image"), Y = M(""), S = M(""), ie = M(""), Z = C(() => (y == null ? void 0 : y()) || "dark"), X = C(() => B.activeArtifactId), oe = C(() => {
+      var b;
+      return T.inlineCards ?? ((b = l == null ? void 0 : l.config) == null ? void 0 : b.inlineCards) ?? !0;
+    }), p = M(!1);
     $e(() => {
-      L.typing && (f.value = !0);
-    }), de(() => L.typing, (C) => {
-      C && (f.value = !0);
+      T.typing && (p.value = !0);
+    }), de(() => T.typing, (b) => {
+      b && (p.value = !0);
     });
-    const k = b(() => f.value || L.isLastMessage ? "active" : "inactive");
-    function ee(C) {
-      if (!C) return null;
+    const k = C(() => p.value || T.isLastMessage ? "active" : "inactive");
+    function ee(b) {
+      if (!b) return null;
       try {
-        const I = decodeURIComponent(escape(atob(C)));
+        const I = decodeURIComponent(escape(atob(b)));
         return JSON.parse(I);
       } catch {
         try {
-          const D = C.replace(/&#10;/g, `
+          const D = b.replace(/&#10;/g, `
 `).replace(/&#13;/g, "\r").replace(/&#9;/g, "	").replace(/&quot;/g, '"').replace(/&#39;/g, "'").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&");
           return JSON.parse(D);
         } catch (D) {
@@ -1481,496 +1481,508 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
         }
       }
     }
-    const re = b(() => {
-      const C = [], I = F.value;
-      if (!I) return C;
+    const re = C(() => {
+      const b = [], I = F.value;
+      if (!I) return b;
       const D = /<div\s+class="artifactuse-placeholder[^"]*"[^>]*data-artifact-id="([^"]+)"[^>]*data-artifact-type="([^"]+)"[^>]*data-artifact=["']([^"']*)["'][^>]*><\/div>/gi;
-      let te = 0, A;
-      for (; (A = D.exec(I)) !== null; ) {
-        if (A.index > te) {
-          const O = I.slice(te, A.index);
-          O.trim() && C.push({ type: "html", content: O });
+      let te = 0, P;
+      for (; (P = D.exec(I)) !== null; ) {
+        if (P.index > te) {
+          const U = I.slice(te, P.index);
+          U.trim() && b.push({ type: "html", content: U });
         }
-        const ae = ee(A[3]), u = A[2];
-        ae && (u === "form" && ae.isInline ? C.push({ type: "form", artifact: ae }) : u === "social" ? C.push({ type: "social", artifact: ae }) : C.push({ type: "panel", artifact: ae })), te = A.index + A[0].length;
+        const ae = ee(P[3]), d = P[2];
+        ae && (d === "form" && ae.isInline ? b.push({ type: "form", artifact: ae }) : d === "social" ? b.push({ type: "social", artifact: ae }) : b.push({ type: "panel", artifact: ae })), te = P.index + P[0].length;
       }
       if (te < I.length) {
         const ae = I.slice(te);
-        ae.trim() && C.push({ type: "html", content: ae });
+        ae.trim() && b.push({ type: "html", content: ae });
       }
-      return C.length === 0 && I.trim() && C.push({ type: "html", content: I }), C;
+      return b.length === 0 && I.trim() && b.push({ type: "html", content: I }), b;
     });
-    function P(C) {
-      W.value = C.type || "image", Y.value = C.src || "", E.value = C.alt || "", ie.value = C.caption || "", q.value = !0, m("media-open", C);
+    function A(b) {
+      W.value = b.type || "image", Y.value = b.src || "", S.value = b.alt || "", ie.value = b.caption || "", O.value = !0, m("media-open", b);
     }
     function Q() {
-      q.value = !1, Y.value = "", E.value = "", ie.value = "";
+      O.value = !1, Y.value = "", S.value = "", ie.value = "";
     }
     function w() {
       if (!x.value) return;
-      x.value.querySelectorAll('img[data-lightbox="true"]').forEach((u) => {
-        u._lightboxHandler && u.removeEventListener("click", u._lightboxHandler), u._lightboxHandler = (O) => {
-          O.preventDefault(), O.stopPropagation(), P({
+      x.value.querySelectorAll('img[data-lightbox="true"]').forEach((d) => {
+        d._lightboxHandler && d.removeEventListener("click", d._lightboxHandler), d._lightboxHandler = (U) => {
+          U.preventDefault(), U.stopPropagation(), A({
             type: "image",
-            src: u.src,
-            alt: u.alt || "",
-            caption: u.dataset.caption || u.alt || ""
+            src: d.src,
+            alt: d.alt || "",
+            caption: d.dataset.caption || d.alt || ""
           });
-        }, u.addEventListener("click", u._lightboxHandler), u.style.cursor = "zoom-in";
-      }), x.value.querySelectorAll(".artifactuse-image-container img").forEach((u) => {
-        u._lightboxHandler || (u._lightboxHandler = (O) => {
-          O.preventDefault(), O.stopPropagation();
-          const G = u.closest(".artifactuse-image-container"), ce = G == null ? void 0 : G.querySelector(".artifactuse-image-caption"), ke = (ce == null ? void 0 : ce.textContent) || u.dataset.caption || u.alt || "";
-          P({
+        }, d.addEventListener("click", d._lightboxHandler), d.style.cursor = "zoom-in";
+      }), x.value.querySelectorAll(".artifactuse-image-container img").forEach((d) => {
+        d._lightboxHandler || (d._lightboxHandler = (U) => {
+          U.preventDefault(), U.stopPropagation();
+          const G = d.closest(".artifactuse-image-container"), ce = G == null ? void 0 : G.querySelector(".artifactuse-image-caption"), ke = (ce == null ? void 0 : ce.textContent) || d.dataset.caption || d.alt || "";
+          A({
             type: "image",
-            src: u.src,
-            alt: u.alt || "",
+            src: d.src,
+            alt: d.alt || "",
             caption: ke
           });
-        }, u.addEventListener("click", u._lightboxHandler), u.style.cursor = "zoom-in");
-      }), x.value.querySelectorAll(".artifactuse-gallery-item img, .artifactuse-image-gallery img").forEach((u) => {
-        u._lightboxHandler || (u._lightboxHandler = (O) => {
-          O.preventDefault(), O.stopPropagation();
-          const G = u.closest(".artifactuse-gallery-item"), ce = G == null ? void 0 : G.querySelector(".artifactuse-gallery-caption"), ke = (ce == null ? void 0 : ce.textContent) || u.dataset.caption || u.alt || "";
-          P({
+        }, d.addEventListener("click", d._lightboxHandler), d.style.cursor = "zoom-in");
+      }), x.value.querySelectorAll(".artifactuse-gallery-item img, .artifactuse-image-gallery img").forEach((d) => {
+        d._lightboxHandler || (d._lightboxHandler = (U) => {
+          U.preventDefault(), U.stopPropagation();
+          const G = d.closest(".artifactuse-gallery-item"), ce = G == null ? void 0 : G.querySelector(".artifactuse-gallery-caption"), ke = (ce == null ? void 0 : ce.textContent) || d.dataset.caption || d.alt || "";
+          A({
             type: "image",
-            src: u.src,
-            alt: u.alt || "",
+            src: d.src,
+            alt: d.alt || "",
             caption: ke
           });
-        }, u.addEventListener("click", u._lightboxHandler), u.style.cursor = "zoom-in");
-      }), x.value.querySelectorAll('a[href$=".pdf"], a[data-type="pdf"]').forEach((u) => {
-        u._pdfHandler && u.removeEventListener("click", u._pdfHandler), u._pdfHandler = (O) => {
-          O.preventDefault(), O.stopPropagation(), P({
+        }, d.addEventListener("click", d._lightboxHandler), d.style.cursor = "zoom-in");
+      }), x.value.querySelectorAll('a[href$=".pdf"], a[data-type="pdf"]').forEach((d) => {
+        d._pdfHandler && d.removeEventListener("click", d._pdfHandler), d._pdfHandler = (U) => {
+          U.preventDefault(), U.stopPropagation(), A({
             type: "pdf",
-            src: u.href,
-            alt: u.textContent || "PDF Document",
-            caption: u.title || u.textContent || ""
+            src: d.href,
+            alt: d.textContent || "PDF Document",
+            caption: d.title || d.textContent || ""
           });
-        }, u.addEventListener("click", u._pdfHandler);
-      }), x.value.querySelectorAll(".artifactuse-pdf-container, [data-pdf-viewer]").forEach((u) => {
+        }, d.addEventListener("click", d._pdfHandler);
+      }), x.value.querySelectorAll(".artifactuse-pdf-container, [data-pdf-viewer]").forEach((d) => {
         var G;
-        u._pdfHandler && u.removeEventListener("click", u._pdfHandler);
-        const O = u.dataset.pdfSrc || ((G = u.querySelector("iframe")) == null ? void 0 : G.src) || "";
-        O && (u._pdfHandler = (ce) => {
-          ce.preventDefault(), ce.stopPropagation(), P({
+        d._pdfHandler && d.removeEventListener("click", d._pdfHandler);
+        const U = d.dataset.pdfSrc || ((G = d.querySelector("iframe")) == null ? void 0 : G.src) || "";
+        U && (d._pdfHandler = (ce) => {
+          ce.preventDefault(), ce.stopPropagation(), A({
             type: "pdf",
-            src: O,
+            src: U,
             alt: "PDF Document",
-            caption: u.dataset.caption || ""
+            caption: d.dataset.caption || ""
           });
-        }, u.addEventListener("click", u._pdfHandler), u.style.cursor = "pointer");
-      }), x.value.querySelectorAll(".artifactuse-video-preview-wrapper, .video-preview-wrapper").forEach((u) => {
-        u._clickHandler && u.removeEventListener("click", u._clickHandler), u._clickHandler = (O) => {
-          if (O.target.closest(".artifactuse-video-play-button")) return;
-          const G = u.dataset.videoUrl || u.dataset.url;
+        }, d.addEventListener("click", d._pdfHandler), d.style.cursor = "pointer");
+      }), x.value.querySelectorAll(".artifactuse-video-preview-wrapper, .video-preview-wrapper").forEach((d) => {
+        d._clickHandler && d.removeEventListener("click", d._clickHandler), d._clickHandler = (U) => {
+          if (U.target.closest(".artifactuse-video-play-button")) return;
+          const G = d.dataset.videoUrl || d.dataset.url;
           G && window.open(G, "_blank", "noopener,noreferrer");
-        }, u.addEventListener("click", u._clickHandler);
+        }, d.addEventListener("click", d._clickHandler);
       });
     }
-    function T() {
+    function L() {
       if (!x.value) return;
-      x.value.querySelectorAll("img").forEach((A) => {
-        A._lightboxHandler && (A.removeEventListener("click", A._lightboxHandler), delete A._lightboxHandler);
-      }), x.value.querySelectorAll('a[href$=".pdf"], a[data-type="pdf"]').forEach((A) => {
-        A._pdfHandler && (A.removeEventListener("click", A._pdfHandler), delete A._pdfHandler);
-      }), x.value.querySelectorAll(".artifactuse-pdf-container, [data-pdf-viewer]").forEach((A) => {
-        A._pdfHandler && (A.removeEventListener("click", A._pdfHandler), delete A._pdfHandler);
-      }), x.value.querySelectorAll(".artifactuse-video-preview-wrapper, .video-preview-wrapper").forEach((A) => {
-        A._clickHandler && (A.removeEventListener("click", A._clickHandler), delete A._clickHandler);
+      x.value.querySelectorAll("img").forEach((P) => {
+        P._lightboxHandler && (P.removeEventListener("click", P._lightboxHandler), delete P._lightboxHandler);
+      }), x.value.querySelectorAll('a[href$=".pdf"], a[data-type="pdf"]').forEach((P) => {
+        P._pdfHandler && (P.removeEventListener("click", P._pdfHandler), delete P._pdfHandler);
+      }), x.value.querySelectorAll(".artifactuse-pdf-container, [data-pdf-viewer]").forEach((P) => {
+        P._pdfHandler && (P.removeEventListener("click", P._pdfHandler), delete P._pdfHandler);
+      }), x.value.querySelectorAll(".artifactuse-video-preview-wrapper, .video-preview-wrapper").forEach((P) => {
+        P._clickHandler && (P.removeEventListener("click", P._clickHandler), delete P._clickHandler);
       });
     }
-    function o() {
+    function r() {
       j && clearTimeout(j), j = setTimeout(async () => {
-        if (await be(), n != null && n.initializeContent && x.value)
+        if (await Ce(), l != null && l.initializeContent && x.value)
           try {
-            await n.initializeContent(x.value);
-          } catch (C) {
-            console.error("Failed to initialize content:", C);
+            await l.initializeContent(x.value);
+          } catch (b) {
+            console.error("Failed to initialize content:", b);
           }
         w();
       }, 100);
     }
     de(
-      () => L.content,
-      (C) => {
-        if (C) {
-          const I = r(C, L.messageId, {
-            inlinePreview: L.inlinePreview,
-            inlineCode: L.inlineCode,
-            tabs: L.tabs,
-            viewMode: L.viewMode
+      () => T.content,
+      (b) => {
+        if (b) {
+          const I = o(b, T.messageId, {
+            inlinePreview: T.inlinePreview,
+            inlineCode: T.inlineCode,
+            tabs: T.tabs,
+            viewMode: T.viewMode
           });
-          F.value = I.html, $.value = I.artifacts, I.artifacts.length > 0 && m("artifact-detected", I.artifacts), L.typing || o();
+          F.value = I.html, $.value = I.artifacts, I.artifacts.length > 0 && m("artifact-detected", I.artifacts), T.typing || r();
         }
       },
       { immediate: !0 }
     ), de(
-      () => L.typing,
-      (C, I) => {
-        I === !0 && C === !1 && o();
+      () => T.typing,
+      (b, I) => {
+        I === !0 && b === !1 && r();
       }
     ), $e(() => {
-      L.typing || o();
-    }), qt(() => {
-      j && clearTimeout(j), T();
+      T.typing || r();
+    }), jt(() => {
+      j && clearTimeout(j), L();
     });
-    function B(C) {
-      const I = C.target.closest(".artifactuse-inline-preview");
+    function E(b) {
+      const I = b.target.closest(".artifactuse-inline-preview");
       if (I) {
         if (I.dataset.nonClickable) return;
         const D = I.dataset.artifactId;
         if (D) {
-          const te = S.artifacts.find((A) => A.id === D);
-          te && c(te);
+          const te = B.artifacts.find((P) => P.id === D);
+          te && u(te);
         }
       }
     }
-    function c(C) {
-      V(C), m("artifact-open", C);
+    function u(b) {
+      q(b), m("artifact-open", b);
     }
-    function z(C) {
-      m("artifact-copy", C);
+    function z(b) {
+      m("artifact-copy", b);
     }
-    function le(C) {
-      m("artifact-download", C);
+    function le(b) {
+      m("artifact-download", b);
     }
-    function pe(C) {
-      m("form-submit", C);
+    function pe(b) {
+      m("form-submit", b);
     }
-    function ye(C) {
-      m("form-cancel", C);
+    function ye(b) {
+      m("form-cancel", b);
     }
-    function fe(C) {
-      m("form-button-click", C);
+    function fe(b) {
+      m("form-button-click", b);
     }
-    function Le(C) {
-      m("social-copy", C);
+    function Le(b) {
+      m("social-copy", b);
     }
-    return b(() => S.artifacts.filter((C) => C.messageId === L.messageId)), d({
-      openViewer: P,
+    return C(() => B.artifacts.filter((b) => b.messageId === T.messageId)), c({
+      openViewer: A,
       closeViewer: Q,
       attachMediaListeners: w
-    }), (C, I) => (a(), s("div", {
+    }), (b, I) => (a(), s("div", {
       class: "artifactuse-agent-message",
       ref_key: "messageRef",
-      ref: p
+      ref: _
     }, [
       e("div", {
         class: "artifactuse-message-content",
         ref_key: "contentRef",
         ref: x,
-        onClick: B
+        onClick: E
       }, [
         (a(!0), s(R, null, ve(re.value, (D, te) => (a(), s(R, { key: te }, [
           D.type === "html" ? (a(), s("div", {
             key: 0,
             innerHTML: D.content
-          }, null, 8, ll)) : D.type === "form" && D.artifact.isInline ? (a(), xe(Ja, {
+          }, null, 8, cl)) : D.type === "form" && D.artifact.isInline ? (a(), xe(Ya, {
             key: 1,
             artifact: D.artifact,
-            theme: X.value,
+            theme: Z.value,
             "initial-state": k.value,
             onSubmit: pe,
             onCancel: ye,
             onButtonClick: fe
-          }, null, 8, ["artifact", "theme", "initial-state"])) : D.type === "social" ? (a(), xe(Ki, {
+          }, null, 8, ["artifact", "theme", "initial-state"])) : D.type === "social" ? (a(), xe(el, {
             key: 2,
             artifact: D.artifact,
-            theme: X.value,
+            theme: Z.value,
             onCopy: Le
-          }, null, 8, ["artifact", "theme"])) : D.type === "panel" && oe.value ? (a(), xe(ia, {
+          }, null, 8, ["artifact", "theme"])) : D.type === "panel" && oe.value ? (a(), xe(ra, {
             key: 3,
             artifact: D.artifact,
-            "is-active": J.value === D.artifact.id,
-            onOpen: c,
+            "is-active": X.value === D.artifact.id,
+            onOpen: u,
             onCopy: z,
             onDownload: le
           }, null, 8, ["artifact", "is-active"])) : v("", !0)
         ], 64))), 128))
       ], 512),
-      Be(il, {
-        "is-open": q.value,
+      Se(rl, {
+        "is-open": O.value,
         type: W.value,
         src: Y.value,
-        alt: E.value,
+        alt: S.value,
         caption: ie.value,
         onClose: Q
       }, null, 8, ["is-open", "type", "src", "alt", "caption"])
     ], 512));
   }
-}, nl = { class: "artifactuse-panel__header artifactuse-panel__header--simple" }, ol = { class: "artifactuse-panel__actions" }, rl = { class: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, cl = {
+}, ul = { class: "artifactuse-panel__header artifactuse-panel__header--simple" }, dl = { class: "artifactuse-panel__actions" }, vl = { class: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, fl = {
   key: 0,
   href: "https://artifactuse.com",
   target: "_blank",
   rel: "noopener noreferrer",
   class: "artifactuse-panel__branding"
-}, ul = { class: "artifactuse-panel__header artifactuse-panel__header--simple" }, dl = { class: "artifactuse-panel__title" }, vl = { class: "artifactuse-panel__title-content" }, fl = { class: "artifactuse-panel__meta" }, pl = { class: "artifactuse-panel__actions" }, hl = ["disabled"], _l = {
+}, pl = { class: "artifactuse-panel__header artifactuse-panel__header--simple" }, _l = { class: "artifactuse-panel__title" }, hl = { class: "artifactuse-panel__title-content" }, ml = { class: "artifactuse-panel__meta" }, yl = { class: "artifactuse-panel__actions" }, gl = ["disabled"], kl = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, ml = {
+}, wl = {
   key: 1,
   class: "artifactuse-panel__spinner-icon",
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, yl = { class: "artifactuse-panel__list" }, gl = { class: "artifactuse-panel__list-items" }, kl = ["onClick"], wl = ["innerHTML"], Cl = { class: "artifactuse-panel__list-item-content" }, bl = { class: "artifactuse-panel__list-item-title" }, xl = { class: "artifactuse-panel__list-item-meta" }, $l = { class: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, Ml = {
+}, bl = { class: "artifactuse-panel__list" }, Cl = { class: "artifactuse-panel__list-items" }, xl = ["onClick"], $l = ["innerHTML"], Ml = { class: "artifactuse-panel__list-item-content" }, Tl = { class: "artifactuse-panel__list-item-title" }, Ll = { class: "artifactuse-panel__list-item-meta" }, Al = { class: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, Pl = {
   key: 0,
   href: "https://artifactuse.com",
   target: "_blank",
   rel: "noopener noreferrer",
   class: "artifactuse-panel__branding"
-}, Ll = { class: "artifactuse-panel__header" }, Tl = { class: "artifactuse-panel__title" }, Pl = ["innerHTML"], Al = { class: "artifactuse-panel__title-content" }, Hl = { class: "artifactuse-panel__name" }, Sl = { class: "artifactuse-panel__meta" }, Bl = { class: "artifactuse-panel__tabs" }, El = ["disabled"], zl = ["disabled"], Il = { class: "artifactuse-panel__actions" }, Fl = ["title"], Vl = {
+}, Hl = { class: "artifactuse-panel__header" }, Bl = ["title"], El = { class: "artifactuse-panel__title" }, Sl = ["innerHTML"], zl = { class: "artifactuse-panel__title-content" }, Il = { class: "artifactuse-panel__name" }, Fl = { class: "artifactuse-panel__meta" }, Vl = { class: "artifactuse-panel__tabs" }, Rl = ["disabled"], ql = ["disabled"], Ol = { class: "artifactuse-panel__actions" }, Ul = ["title"], Dl = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, Rl = {
+}, jl = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, ql = {
+}, Nl = {
+  key: 0,
+  class: "artifactuse-panel__file-tabs"
+}, Wl = { class: "artifactuse-panel__file-tabs-scroll" }, Jl = ["onClick"], Xl = ["innerHTML"], Zl = { class: "artifactuse-panel__file-tab-title" }, Kl = ["onClick"], Yl = {
   key: 0,
   class: "artifactuse-panel__loading"
-}, Ol = {
+}, Ql = {
   key: 0,
   class: "artifactuse-panel__loading"
-}, Ul = ["src"], Dl = {
+}, Gl = ["src"], en = {
   key: 2,
   class: "artifactuse-panel__no-preview"
-}, jl = { class: "artifactuse-panel__edit" }, Nl = { class: "artifactuse-panel__footer" }, Wl = { class: "artifactuse-panel__footer-left" }, Jl = {
+}, tn = { class: "artifactuse-panel__edit" }, an = { class: "artifactuse-panel__footer" }, sn = { class: "artifactuse-panel__footer-left" }, ln = {
   key: 0,
   href: "https://artifactuse.com",
   target: "_blank",
   rel: "noopener noreferrer",
   class: "artifactuse-panel__branding"
-}, Xl = {
+}, nn = {
   key: 1,
   class: "artifactuse-panel__badge"
-}, Zl = { class: "artifactuse-panel__footer-right" }, Kl = ["title"], Yl = {
+}, on = { class: "artifactuse-panel__footer-right" }, rn = ["title"], cn = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, Ql = {
+}, un = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, Gl = {
+}, dn = {
   key: 0,
   style: { position: "relative" }
-}, en = {
+}, vn = {
   key: 0,
   class: "artifactuse-share-popup"
-}, tn = { class: "artifactuse-share-popup__header" }, an = { class: "artifactuse-share-popup__title" }, sn = { class: "artifactuse-share-popup__body" }, ln = {
+}, fn = { class: "artifactuse-share-popup__header" }, pn = { class: "artifactuse-share-popup__title" }, _n = { class: "artifactuse-share-popup__body" }, hn = {
   key: 0,
   class: "artifactuse-share-popup__loading"
-}, nn = { key: 1 }, on = { class: "artifactuse-share-popup__error" }, rn = { class: "artifactuse-share-popup__error-text" }, cn = { class: "artifactuse-share-popup__actions" }, un = {
+}, mn = { key: 1 }, yn = { class: "artifactuse-share-popup__error" }, gn = { class: "artifactuse-share-popup__error-text" }, kn = { class: "artifactuse-share-popup__actions" }, wn = {
   key: 2,
   class: "artifactuse-share-popup__options"
-}, dn = { key: 3 }, vn = {
+}, bn = { key: 3 }, Cn = {
   key: 0,
   class: "artifactuse-share-popup__loading"
-}, fn = {
+}, xn = {
   key: 1,
   class: "artifactuse-share-popup__empty"
-}, pn = {
+}, $n = {
   key: 2,
   class: "artifactuse-share-popup__artifact-list"
-}, hn = ["onClick"], _n = { class: "artifactuse-share-popup__artifact-name" }, mn = { class: "artifactuse-share-popup__artifact-date" }, yn = {
+}, Mn = ["onClick"], Tn = { class: "artifactuse-share-popup__artifact-name" }, Ln = { class: "artifactuse-share-popup__artifact-date" }, An = {
   key: 4,
   class: "artifactuse-share-popup__success"
-}, gn = { class: "artifactuse-share-popup__link-wrapper" }, kn = ["value"], wn = {
+}, Pn = { class: "artifactuse-share-popup__link-wrapper" }, Hn = ["value"], Bn = {
   key: 0,
   class: "artifactuse-share-popup__expiry"
-}, Cn = { class: "artifactuse-share-popup__expiry-text" }, bn = {
+}, En = { class: "artifactuse-share-popup__expiry-text" }, Sn = {
   key: 1,
   class: "artifactuse-share-popup__save-prompt"
-}, xn = {
+}, zn = {
   key: 2,
   class: "artifactuse-panel__nav"
-}, $n = ["disabled"], Mn = ["disabled"], Ln = {
+}, In = ["disabled"], Fn = ["disabled"], Vn = {
   key: 0,
   class: "artifactuse-panel__artifact-list"
-}, Tn = { class: "artifactuse-panel__artifact-list-header" }, Pn = { class: "artifactuse-panel__artifact-list-items" }, An = ["onClick"], Hn = ["innerHTML"], Sn = { class: "artifactuse-panel__artifact-item-content" }, Bn = { class: "artifactuse-panel__artifact-item-title" }, En = { class: "artifactuse-panel__artifact-item-meta" }, zn = { class: "artifactuse-panel__artifact-item-index" }, Dn = {
+}, Rn = { class: "artifactuse-panel__artifact-list-header" }, qn = { class: "artifactuse-panel__artifact-list-items" }, On = ["onClick"], Un = ["innerHTML"], Dn = { class: "artifactuse-panel__artifact-item-content" }, jn = { class: "artifactuse-panel__artifact-item-title" }, Nn = { class: "artifactuse-panel__artifact-item-meta" }, Wn = { class: "artifactuse-panel__artifact-item-index" }, eo = {
   __name: "ArtifactusePanel",
   props: {
     panelWidth: { type: Number, default: void 0 },
     splitPosition: { type: Number, default: void 0 }
   },
   emits: ["close", "ai-request", "save", "export", "resize"],
-  setup(H, { emit: d }) {
-    var et, tt;
-    const _ = d, L = H, {
+  setup(H, { emit: c }) {
+    var at, st;
+    const h = c, T = H, {
       state: m,
-      activeArtifact: r,
-      artifactCount: V,
-      hasArtifacts: S,
-      closePanel: h,
-      toggleFullscreen: n,
-      setViewMode: p,
+      activeArtifact: o,
+      artifactCount: q,
+      hasArtifacts: B,
+      closePanel: y,
+      toggleFullscreen: l,
+      setViewMode: _,
       getPanelUrl: x,
       openArtifact: F,
       instance: $
-    } = Ee(), j = M(null), q = M(null), W = M(null), Y = M(null), E = M(null), ie = M(null), X = M(!1), J = M(!1), oe = M(!0), f = M(!1), k = M(!1), ee = M(!1), re = M(!1), P = M("options"), Q = M(""), w = M(null), T = M(""), o = M(!1), B = M(!1), c = M([]), z = M(!1), le = M("");
+    } = ze(), j = M(null), O = M(null), W = M(null), Y = M(null), S = M(null), ie = M(null), Z = M(!1), X = M(!1), oe = M(!0), p = M(!1), k = M(!1), ee = M(!1), re = M(!1), A = M("options"), Q = M(""), w = M(null), L = M(""), r = M(!1), E = M(!1), u = M([]), z = M(!1), le = M("");
     let pe = null, ye = null, fe = null;
-    const Le = b(() => {
+    const Le = C(() => {
       var i;
       return ((i = $.editor) == null ? void 0 : i.isAvailable()) || !1;
-    }), C = M(
-      Math.min(Math.max(L.panelWidth ?? ((et = $.config) == null ? void 0 : et.panelWidth) ?? 65, 25), 75)
+    }), b = M(
+      Math.min(Math.max(T.panelWidth ?? ((at = $.config) == null ? void 0 : at.panelWidth) ?? 65, 25), 75)
     ), I = M(
-      Math.min(Math.max(L.splitPosition ?? ((tt = $.config) == null ? void 0 : tt.splitPosition) ?? 50, 20), 80)
-    ), D = b(() => r.value ? Se(r.value.language) : ""), te = b(() => r.value ? `<svg viewBox="0 0 24 24" fill="currentColor">${Oe(r.value.language)}</svg>` : ""), A = b(() => {
-      if (!r.value) return null;
-      let i = x(r.value);
-      return i && r.value._refreshToken && (i += (i.includes("?") ? "&" : "?") + "_t=" + r.value._refreshToken), i;
+      Math.min(Math.max(T.splitPosition ?? ((st = $.config) == null ? void 0 : st.splitPosition) ?? 50, 20), 80)
+    ), D = C(() => o.value ? Ee(o.value.language) : ""), te = C(() => o.value ? `<svg viewBox="0 0 24 24" fill="currentColor">${De(o.value.language)}</svg>` : ""), P = C(() => {
+      if (!o.value) return null;
+      let i = x(o.value);
+      return i && o.value._refreshToken && (i += (i.includes("?") ? "&" : "?") + "_t=" + o.value._refreshToken), i;
     });
-    b(() => !r.value || !m.artifacts.length ? -1 : m.artifacts.findIndex((i) => i.id === r.value.id));
-    const ae = b(() => r.value ? Dt(r.value.language || "plaintext") : "plaintext"), u = b(() => m.artifacts.filter((i) => !i.isInline)), O = b(() => r.value ? u.value.findIndex((i) => i.id === r.value.id) : -1), G = b(() => {
+    C(() => !o.value || !m.artifacts.length ? -1 : m.artifacts.findIndex((i) => i.id === o.value.id));
+    const ae = C(() => o.value ? Jt(o.value.language || "plaintext") : "plaintext"), d = C(() => m.artifacts.filter((i) => !i.isInline)), U = C(() => o.value ? d.value.findIndex((i) => i.id === o.value.id) : -1), G = C(() => {
       var i;
       return ((i = $.config) == null ? void 0 : i.branding) !== !1;
-    }), ce = b(() => {
+    }), ce = C(() => {
       var i;
       return ((i = $.share) == null ? void 0 : i.enabled) !== !1;
-    }), ke = b(() => {
+    }), ke = C(() => {
       var i;
       return ((i = $.share) == null ? void 0 : i.isAuthenticated()) || !1;
-    }), ut = b(() => r.value ? C.value : Math.min(C.value, 30));
-    function je(i) {
-      return `<svg viewBox="0 0 24 24" fill="currentColor">${Oe(i)}</svg>`;
+    }), vt = C(() => o.value ? b.value : Math.min(b.value, 30)), Me = C(() => {
+      var i;
+      return ((i = $.config) == null ? void 0 : i.multiTab) === !0;
+    }), We = C(() => Me.value ? m.openTabs.map((i) => m.artifacts.find((t) => t.id === i)).filter(Boolean) : []);
+    function Ie(i) {
+      return `<svg viewBox="0 0 24 24" fill="currentColor">${De(i)}</svg>`;
+    }
+    function ft(i) {
+      F(i);
+    }
+    function pt(i) {
+      $.closeTab(i), m.openTabs.length === 0 && (k.value = !1);
     }
-    function dt() {
+    function _t() {
       k.value = !1, $.state.clearActiveArtifact();
     }
-    function Ne(i) {
+    function Je(i) {
       if (i.language !== "smartdiff") return null;
       try {
         const t = JSON.parse(i.code);
         if (t.oldCode === void 0 || t.newCode === void 0) return null;
-        const y = t.language || "plaintext", U = it() && window.Prism.languages[y], Z = jt(t.oldCode, t.newCode).split(`
+        const f = t.language || "plaintext", V = nt() && window.Prism.languages[f], J = Xt(t.oldCode, t.newCode).split(`
 `);
-        return { html: Z.map((ue) => {
-          const ne = ue[0], Ce = ue.slice(1), ge = U ? window.Prism.highlight(Ce, U, y) : Ce;
+        return { html: J.map((ue) => {
+          const ne = ue[0], be = ue.slice(1), ge = V ? window.Prism.highlight(be, V, f) : be;
           return ne === "-" ? `<span class="token deleted">${ge}</span>` : ne === "+" ? `<span class="token inserted">${ge}</span>` : ge;
         }).join(`
-`), lineCount: Z.length };
+`), lineCount: J.length };
       } catch {
         return null;
       }
     }
-    function vt() {
+    function ht() {
       var i;
-      if (Y.value && ((i = r.value) != null && i.code)) {
-        const t = Ne(r.value), y = t ? t.lineCount : r.value.code.split(`
+      if (Y.value && ((i = o.value) != null && i.code)) {
+        const t = Je(o.value), f = t ? t.lineCount : o.value.code.split(`
 `).length;
-        Y.value.innerHTML = Array.from({ length: y }, (U, Z) => `<div>${Z + 1}</div>`).join("");
+        Y.value.innerHTML = Array.from({ length: f }, (V, J) => `<div>${J + 1}</div>`).join("");
       }
     }
-    function ft() {
+    function mt() {
       var i;
-      if (q.value && it() && ((i = r.value) != null && i.code)) {
-        const t = Ne(r.value);
+      if (O.value && nt() && ((i = o.value) != null && i.code)) {
+        const t = Je(o.value);
         if (t)
-          q.value.innerHTML = t.html;
+          O.value.innerHTML = t.html;
         else {
-          const y = window.Prism.languages[ae.value];
-          y ? q.value.innerHTML = window.Prism.highlight(
-            r.value.code,
-            y,
+          const f = window.Prism.languages[ae.value];
+          f ? O.value.innerHTML = window.Prism.highlight(
+            o.value.code,
+            f,
             ae.value
-          ) : q.value.textContent = r.value.code;
+          ) : O.value.textContent = o.value.code;
         }
-        q.value.dataset.highlighted = "true", be(() => {
-          pt();
+        O.value.dataset.highlighted = "true", Ce(() => {
+          yt();
         });
       }
     }
-    function pt() {
+    function yt() {
       var t;
-      const i = (t = q.value) == null ? void 0 : t.closest("pre");
-      if (i && E.value && Y.value) {
-        const U = window.getComputedStyle(i).backgroundColor;
-        U && U !== "rgba(0, 0, 0, 0)" && U !== "transparent" && (E.value.style.backgroundColor = U, Y.value.style.backgroundColor = U);
+      const i = (t = O.value) == null ? void 0 : t.closest("pre");
+      if (i && S.value && Y.value) {
+        const V = window.getComputedStyle(i).backgroundColor;
+        V && V !== "rgba(0, 0, 0, 0)" && V !== "transparent" && (S.value.style.backgroundColor = V, Y.value.style.backgroundColor = V);
       }
     }
-    function ht() {
-      E.value && (E.value.style.backgroundColor = ""), Y.value && (Y.value.style.backgroundColor = "");
+    function gt() {
+      S.value && (S.value.style.backgroundColor = ""), Y.value && (Y.value.style.backgroundColor = "");
     }
-    function Te() {
-      be(() => {
-        vt(), ft();
+    function Ae() {
+      Ce(() => {
+        ht(), mt();
       });
     }
-    function We() {
-      !Le.value || !ie.value || !r.value || (ze(), fe = $.editor.create(ie.value, {
-        code: r.value.code || "",
-        language: r.value.editorLanguage || r.value.language || "plaintext",
+    function Xe() {
+      !Le.value || !ie.value || !o.value || (Fe(), fe = $.editor.create(ie.value, {
+        code: o.value.code || "",
+        language: o.value.editorLanguage || o.value.language || "plaintext",
         sdkTheme: $.getTheme()
       }));
     }
-    function ze() {
+    function Fe() {
       fe && (fe.destroy(), fe = null);
     }
-    function _t() {
-      if (!fe || !r.value) return;
+    function kt() {
+      if (!fe || !o.value) return;
       const i = fe.getCode();
       $.emit("edit:save", {
-        artifactId: r.value.id,
-        artifact: r.value,
+        artifactId: o.value.id,
+        artifact: o.value,
         code: i
       });
     }
-    function mt() {
-      clearTimeout(ye), oe.value = !1, j.value && r.value && ($.bridge.setIframe(j.value), $.bridge.loadArtifact(r.value));
+    function wt() {
+      clearTimeout(ye), oe.value = !1, j.value && o.value && ($.bridge.setIframe(j.value), $.bridge.loadArtifact(o.value));
     }
-    function yt() {
+    function bt() {
       clearTimeout(ye), oe.value = !1;
     }
-    function gt() {
+    function Ct() {
       clearTimeout(ye), ye = setTimeout(() => {
         oe.value = !1;
       }, 1e3);
     }
-    async function kt() {
-      if (r.value)
+    async function xt() {
+      if (o.value)
         try {
-          await navigator.clipboard.writeText(r.value.code), X.value = !0, setTimeout(() => {
-            X.value = !1;
+          await navigator.clipboard.writeText(o.value.code), Z.value = !0, setTimeout(() => {
+            Z.value = !1;
           }, 2e3);
         } catch (i) {
           console.error("Failed to copy:", i);
         }
     }
-    function wt() {
-      if (!r.value) return;
-      const { code: i, language: t, title: y } = r.value, U = Ue(t), Z = `${y.toLowerCase().replace(/\s+/g, "-")}.${U}`, _e = new Blob([i], { type: "text/plain" }), ue = URL.createObjectURL(_e), ne = document.createElement("a");
-      ne.href = ue, ne.download = Z, document.body.appendChild(ne), ne.click(), document.body.removeChild(ne), URL.revokeObjectURL(ue);
+    function $t() {
+      if (!o.value) return;
+      const { code: i, language: t, title: f } = o.value, V = je(t), J = `${f.toLowerCase().replace(/\s+/g, "-")}.${V}`, me = new Blob([i], { type: "text/plain" }), ue = URL.createObjectURL(me), ne = document.createElement("a");
+      ne.href = ue, ne.download = J, document.body.appendChild(ne), ne.click(), document.body.removeChild(ne), URL.revokeObjectURL(ue);
     }
-    async function Ct() {
-      if (!(ee.value || u.value.length === 0)) {
+    async function Mt() {
+      if (!(ee.value || d.value.length === 0)) {
         ee.value = !0;
         try {
-          const i = new Wt(), t = /* @__PURE__ */ new Map();
-          for (const ne of u.value) {
+          const i = new Kt(), t = /* @__PURE__ */ new Map();
+          for (const ne of d.value) {
             if (!ne.code) continue;
-            const Ce = Ue(ne.language);
-            let ge = (ne.title || "untitled").toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9-_]/g, ""), Re = `${ge}.${Ce}`;
-            const qe = t.get(Re) || 0;
-            qe > 0 && (Re = `${ge}-${qe}.${Ce}`), t.set(`${ge}.${Ce}`, qe + 1), i.file(Re, ne.code);
+            const be = je(ne.language);
+            let ge = (ne.title || "untitled").toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9-_]/g, ""), Oe = `${ge}.${be}`;
+            const Ue = t.get(Oe) || 0;
+            Ue > 0 && (Oe = `${ge}-${Ue}.${be}`), t.set(`${ge}.${be}`, Ue + 1), i.file(Oe, ne.code);
           }
-          const y = await i.generateAsync({ type: "blob" }), Z = `artifacts-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}.zip`, _e = URL.createObjectURL(y), ue = document.createElement("a");
-          ue.href = _e, ue.download = Z, document.body.appendChild(ue), ue.click(), document.body.removeChild(ue), URL.revokeObjectURL(_e);
+          const f = await i.generateAsync({ type: "blob" }), J = `artifacts-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}.zip`, me = URL.createObjectURL(f), ue = document.createElement("a");
+          ue.href = me, ue.download = J, document.body.appendChild(ue), ue.click(), document.body.removeChild(ue), URL.revokeObjectURL(me);
         } catch (i) {
           console.error("Failed to create ZIP:", i);
         } finally {
@@ -1978,205 +1990,205 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
         }
       }
     }
-    function bt() {
+    function Tt() {
       if (re.value) {
         re.value = !1;
         return;
       }
-      r.value && (P.value = "options", Q.value = "", w.value = null, T.value = "", o.value = !1, B.value = !1, c.value = [], z.value = !1, le.value = "", re.value = !0);
+      o.value && (A.value = "options", Q.value = "", w.value = null, L.value = "", r.value = !1, E.value = !1, u.value = [], z.value = !1, le.value = "", re.value = !0);
     }
-    function xt() {
+    function Lt() {
       re.value = !1;
     }
-    function Je(i) {
+    function Ze(i) {
       return i ? new Date(i).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" }) : "";
     }
-    async function Xe() {
-      if (!(!r.value || !$.share)) {
-        P.value = "loading", T.value = "";
+    async function Ke() {
+      if (!(!o.value || !$.share)) {
+        A.value = "loading", L.value = "";
         try {
-          const i = await $.share.share(r.value);
-          Q.value = i.url, w.value = i.expiresAt, B.value = !1, P.value = "success";
+          const i = await $.share.share(o.value);
+          Q.value = i.url, w.value = i.expiresAt, E.value = !1, A.value = "success";
         } catch (i) {
-          T.value = i.message || "Failed to create share link", P.value = "error";
+          L.value = i.message || "Failed to create share link", A.value = "error";
         }
       }
     }
-    async function Ze() {
+    async function Ye() {
       if (ke.value)
-        Ie();
+        Ve();
       else {
-        P.value = "loading";
+        A.value = "loading";
         try {
-          await $.share.openAuthPopup(), Ie();
+          await $.share.openAuthPopup(), Ve();
         } catch (i) {
-          i.message === "Authentication cancelled" ? P.value = "options" : (T.value = i.message || "Authentication failed", P.value = "error");
+          i.message === "Authentication cancelled" ? A.value = "options" : (L.value = i.message || "Authentication failed", A.value = "error");
         }
       }
     }
-    async function Ie() {
-      if (!(!r.value || !$.share)) {
-        P.value = "loading", T.value = "";
+    async function Ve() {
+      if (!(!o.value || !$.share)) {
+        A.value = "loading", L.value = "";
         try {
-          const i = await $.share.save(r.value);
-          Q.value = i.url, w.value = null, B.value = !0, P.value = "success";
+          const i = await $.share.save(o.value);
+          Q.value = i.url, w.value = null, E.value = !0, A.value = "success";
         } catch (i) {
-          T.value = i.message || "Failed to save artifact", P.value = "error";
+          L.value = i.message || "Failed to save artifact", A.value = "error";
         }
       }
     }
-    function $t() {
-      B.value ? Ie() : Xe();
+    function At() {
+      E.value ? Ve() : Ke();
     }
-    async function Mt() {
+    async function Pt() {
       var i;
       if ($.share) {
         if (!ke.value) {
-          P.value = "loading";
+          A.value = "loading";
           try {
             await $.share.openAuthPopup();
           } catch (t) {
-            t.message === "Authentication cancelled" ? P.value = "options" : (T.value = t.message || "Authentication failed", P.value = "error");
+            t.message === "Authentication cancelled" ? A.value = "options" : (L.value = t.message || "Authentication failed", A.value = "error");
             return;
           }
         }
-        P.value = "update-list", z.value = !0;
+        A.value = "update-list", z.value = !0;
         try {
-          const t = ((i = r.value) == null ? void 0 : i.language) || null, y = await $.share.listArtifacts(t);
-          c.value = y.projects || [];
+          const t = ((i = o.value) == null ? void 0 : i.language) || null, f = await $.share.listArtifacts(t);
+          u.value = f.projects || [];
         } catch (t) {
-          T.value = t.message || "Failed to load artifacts", P.value = "error";
+          L.value = t.message || "Failed to load artifacts", A.value = "error";
         } finally {
           z.value = !1;
         }
       }
     }
-    async function Lt(i) {
-      var y, U;
-      if (!r.value || !$.share) return;
-      const t = (y = i.project) == null ? void 0 : y.uuid;
+    async function Ht(i) {
+      var f, V;
+      if (!o.value || !$.share) return;
+      const t = (f = i.project) == null ? void 0 : f.uuid;
       if (t) {
-        P.value = "loading", T.value = "";
+        A.value = "loading", L.value = "";
         try {
-          const Z = await $.share.updateArtifact(t, r.value);
-          Q.value = Z.url || "", w.value = null, B.value = !0, le.value = ((U = i.project) == null ? void 0 : U.name) || "Untitled", P.value = "success";
-        } catch (Z) {
-          T.value = Z.message || "Failed to update artifact", P.value = "error";
+          const J = await $.share.updateArtifact(t, o.value);
+          Q.value = J.url || "", w.value = null, E.value = !0, le.value = ((V = i.project) == null ? void 0 : V.name) || "Untitled", A.value = "success";
+        } catch (J) {
+          L.value = J.message || "Failed to update artifact", A.value = "error";
         }
       }
     }
-    async function Tt() {
+    async function Bt() {
       if (Q.value)
         try {
-          await navigator.clipboard.writeText(Q.value), o.value = !0, setTimeout(() => {
-            o.value = !1;
+          await navigator.clipboard.writeText(Q.value), r.value = !0, setTimeout(() => {
+            r.value = !1;
           }, 2e3);
         } catch (i) {
           console.error("Failed to copy link:", i);
         }
     }
-    function Pt() {
-      A.value && window.open(A.value, "_blank");
+    function Et() {
+      P.value && window.open(P.value, "_blank");
     }
-    function At() {
-      Y.value && E.value && (Y.value.style.transform = `translateY(-${E.value.scrollTop}px)`);
+    function St() {
+      Y.value && S.value && (Y.value.style.transform = `translateY(-${S.value.scrollTop}px)`);
     }
-    function Ht() {
-      J.value = !J.value;
+    function zt() {
+      X.value = !X.value;
     }
-    function Ke(i) {
-      k.value = !0, F(i), J.value = !1;
+    function Qe(i) {
+      k.value = !0, F(i), X.value = !1;
     }
-    function St() {
-      const i = O.value - 1;
-      i >= 0 && F(u.value[i]);
+    function It() {
+      const i = U.value - 1;
+      i >= 0 && F(d.value[i]);
     }
-    function Bt() {
-      const i = O.value + 1;
-      i < u.value.length && F(u.value[i]);
+    function Ft() {
+      const i = U.value + 1;
+      i < d.value.length && F(d.value[i]);
     }
-    function Ye(i) {
+    function Ge(i) {
       const t = document.querySelector(".artifactuse-panel__nav");
-      t && !t.contains(i.target) && (J.value = !1);
+      t && !t.contains(i.target) && (X.value = !1);
     }
     let we = null;
-    function Et(i) {
+    function Vt(i) {
       we = {
         startX: i.clientX,
-        startWidth: C.value
-      }, document.addEventListener("mousemove", Qe), document.addEventListener("mouseup", Fe), document.body.style.cursor = "ew-resize", document.body.style.userSelect = "none", document.querySelectorAll("iframe").forEach((y) => y.style.pointerEvents = "none");
+        startWidth: b.value
+      }, document.addEventListener("mousemove", et), document.addEventListener("mouseup", Re), document.body.style.cursor = "ew-resize", document.body.style.userSelect = "none", document.querySelectorAll("iframe").forEach((f) => f.style.pointerEvents = "none");
     }
-    function Qe(i) {
+    function et(i) {
       if (!we) return;
-      const t = window.innerWidth, U = (we.startX - i.clientX) / t * 100, Z = we.startWidth + U;
-      C.value = Math.min(Math.max(Z, 25), 75), _("resize", { width: C.value });
+      const t = window.innerWidth, V = (we.startX - i.clientX) / t * 100, J = we.startWidth + V;
+      b.value = Math.min(Math.max(J, 25), 75), h("resize", { width: b.value });
     }
-    function Fe() {
+    function Re() {
       const i = we !== null;
-      we = null, document.removeEventListener("mousemove", Qe), document.removeEventListener("mouseup", Fe), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((y) => y.style.pointerEvents = ""), i && _("resize", { width: C.value });
+      we = null, document.removeEventListener("mousemove", et), document.removeEventListener("mouseup", Re), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((f) => f.style.pointerEvents = ""), i && h("resize", { width: b.value });
     }
-    let Me = null;
-    function zt(i) {
+    let Te = null;
+    function Rt(i) {
       if (!W.value) return;
       const t = W.value.getBoundingClientRect();
-      Me = {
+      Te = {
         startX: i.clientX,
         startPosition: I.value,
         contentLeft: t.left,
         contentWidth: t.width
-      }, document.addEventListener("mousemove", Ge), document.addEventListener("mouseup", Ve), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.querySelectorAll("iframe").forEach((U) => U.style.pointerEvents = "none");
+      }, document.addEventListener("mousemove", tt), document.addEventListener("mouseup", qe), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.querySelectorAll("iframe").forEach((V) => V.style.pointerEvents = "none");
     }
-    function Ge(i) {
-      if (!Me) return;
-      const y = (i.clientX - Me.contentLeft) / Me.contentWidth * 100;
-      I.value = Math.min(Math.max(y, 20), 80);
+    function tt(i) {
+      if (!Te) return;
+      const f = (i.clientX - Te.contentLeft) / Te.contentWidth * 100;
+      I.value = Math.min(Math.max(f, 20), 80);
     }
-    function Ve() {
-      Me = null, document.removeEventListener("mousemove", Ge), document.removeEventListener("mouseup", Ve), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((t) => t.style.pointerEvents = "");
+    function qe() {
+      Te = null, document.removeEventListener("mousemove", tt), document.removeEventListener("mouseup", qe), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((t) => t.style.pointerEvents = "");
     }
-    return de(r, (i, t) => {
-      i && (t && t.isPreviewable !== i.isPreviewable && (f.value = !0, setTimeout(() => {
-        f.value = !1;
-      }, 150)), (!t || i.id !== t.id) && (ht(), oe.value = !0, gt()), (!t || i.id !== t.id || i.code !== t.code) && (Te(), m.viewMode === "edit" && (!t || i.id !== t.id ? be(() => We()) : fe && fe.setCode(i.code || "")), clearTimeout(pe), pe = setTimeout(() => {
+    return de(o, (i, t) => {
+      i && (t && t.isPreviewable !== i.isPreviewable && (p.value = !0, setTimeout(() => {
+        p.value = !1;
+      }, 150)), (!t || i.id !== t.id) && (gt(), oe.value = !0, Ct()), (!t || i.id !== t.id || i.code !== t.code) && (Ae(), m.viewMode === "edit" && (!t || i.id !== t.id ? Ce(() => Xe()) : fe && fe.setCode(i.code || "")), clearTimeout(pe), pe = setTimeout(() => {
         j.value && i.isPreviewable && $.bridge.loadArtifact(i);
       }, 500)));
     }, { deep: !0 }), de(() => m.viewMode, (i) => {
-      (i === "code" || i === "split") && Te(), i === "edit" && be(() => We());
+      (i === "code" || i === "split") && Ae(), i === "edit" && Ce(() => Xe());
     }), de(() => m.isPanelOpen, (i) => {
-      i && r.value && Te(), i || ze();
-    }), de(() => L.panelWidth, (i) => {
-      i !== void 0 && (C.value = Math.min(Math.max(i, 25), 75));
-    }), de(() => L.splitPosition, (i) => {
+      i && o.value && Ae(), i || Fe();
+    }), de(() => T.panelWidth, (i) => {
+      i !== void 0 && (b.value = Math.min(Math.max(i, 25), 75));
+    }), de(() => T.splitPosition, (i) => {
       i !== void 0 && (I.value = Math.min(Math.max(i, 20), 80));
     }), $e(() => {
-      $.on("ai:request", (i) => _("ai-request", i)), $.on("save:request", (i) => _("save", i)), $.on("export:complete", (i) => _("export", i)), document.addEventListener("click", Ye), m.isPanelOpen && r.value && Te();
-    }), De(() => {
-      Fe(), Ve(), ze(), document.removeEventListener("click", Ye), clearTimeout(pe), clearTimeout(ye);
-    }), (i, t) => (a(), xe(Ae, { name: "artifactuse-panel" }, {
-      default: He(() => [
+      $.on("ai:request", (i) => h("ai-request", i)), $.on("save:request", (i) => h("save", i)), $.on("export:complete", (i) => h("export", i)), document.addEventListener("click", Ge), m.isPanelOpen && o.value && Ae();
+    }), Ne(() => {
+      Re(), qe(), Fe(), document.removeEventListener("click", Ge), clearTimeout(pe), clearTimeout(ye);
+    }), (i, t) => (a(), xe(He, { name: "artifactuse-panel" }, {
+      default: Be(() => [
         g(m).isPanelOpen ? (a(), s("div", {
           key: 0,
           class: N(["artifactuse-panel", {
             "artifactuse-panel--fullscreen": g(m).isFullscreen,
-            "artifactuse-panel--list": !g(r) && g(S),
-            "artifactuse-panel--empty": !g(S)
+            "artifactuse-panel--list": !g(o) && g(B),
+            "artifactuse-panel--empty": !g(B)
           }]),
-          style: Pe(g(m).isFullscreen ? void 0 : { width: `${ut.value}%` })
+          style: Pe(g(m).isFullscreen ? void 0 : { width: `${vt.value}%` })
         }, [
           g(m).isFullscreen ? v("", !0) : (a(), s("div", {
             key: 0,
             class: "artifactuse-panel__resize-handle",
-            onMousedown: me(Et, ["prevent"])
+            onMousedown: he(Vt, ["prevent"])
           }, [...t[12] || (t[12] = [
             e("div", { class: "artifactuse-panel__resize-handle-line" }, null, -1)
           ])], 32)),
-          g(S) ? g(r) ? (a(), s(R, { key: 3 }, [
-            e("header", Ll, [
-              k.value ? (a(), s("button", {
+          g(B) ? g(o) ? (a(), s(R, { key: 3 }, [
+            e("header", Hl, [
+              Me.value || k.value ? (a(), s("button", {
                 key: 0,
                 class: "artifactuse-panel__back",
-                title: "Back to list",
-                onClick: dt
+                title: Me.value ? "Browse artifacts" : "Back to list",
+                onClick: _t
               }, [...t[24] || (t[24] = [
                 e("svg", {
                   viewBox: "0 0 24 24",
@@ -2186,29 +2198,29 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 }, [
                   e("polyline", { points: "15 18 9 12 15 6" })
                 ], -1)
-              ])])) : v("", !0),
-              e("div", Tl, [
+              ])], 8, Bl)) : v("", !0),
+              e("div", El, [
                 e("span", {
                   class: "artifactuse-panel__icon",
                   innerHTML: te.value
-                }, null, 8, Pl),
-                e("div", Al, [
-                  e("span", Hl, l(g(r).title || "Untitled"), 1),
-                  e("span", Sl, [
-                    K(l(D.value) + " ", 1),
-                    g(r).lineCount ? (a(), s(R, { key: 0 }, [
-                      K(" • " + l(g(r).lineCount) + " lines ", 1)
+                }, null, 8, Sl),
+                e("div", zl, [
+                  e("span", Il, n(g(o).title || "Untitled"), 1),
+                  e("span", Fl, [
+                    K(n(D.value) + " ", 1),
+                    g(o).lineCount ? (a(), s(R, { key: 0 }, [
+                      K(" • " + n(g(o).lineCount) + " lines ", 1)
                     ], 64)) : v("", !0)
                   ])
                 ])
               ]),
-              e("div", Bl, [
-                !g(r).tabs || g(r).tabs.includes("preview") ? (a(), s("button", {
+              e("div", Vl, [
+                !g(o).tabs || g(o).tabs.includes("preview") ? (a(), s("button", {
                   key: 0,
                   class: N(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": g(m).viewMode === "preview" }]),
-                  disabled: !g(r).isPreviewable,
+                  disabled: !g(o).isPreviewable,
                   title: "Preview",
-                  onClick: t[2] || (t[2] = (y) => g(p)("preview"))
+                  onClick: t[2] || (t[2] = (f) => g(_)("preview"))
                 }, [...t[25] || (t[25] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2223,12 +2235,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       r: "3"
                     })
                   ], -1)
-                ])], 10, El)) : v("", !0),
-                !g(r).tabs || g(r).tabs.includes("code") ? (a(), s("button", {
+                ])], 10, Rl)) : v("", !0),
+                !g(o).tabs || g(o).tabs.includes("code") ? (a(), s("button", {
                   key: 1,
                   class: N(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": g(m).viewMode === "code" }]),
                   title: "Code",
-                  onClick: t[3] || (t[3] = (y) => g(p)("code"))
+                  onClick: t[3] || (t[3] = (f) => g(_)("code"))
                 }, [...t[26] || (t[26] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2240,12 +2252,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     e("polyline", { points: "8 6 2 12 8 18" })
                   ], -1)
                 ])], 2)) : v("", !0),
-                !g(r).tabs || g(r).tabs.includes("split") ? (a(), s("button", {
+                !g(o).tabs || g(o).tabs.includes("split") ? (a(), s("button", {
                   key: 2,
                   class: N(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": g(m).viewMode === "split" }]),
-                  disabled: !g(r).isPreviewable,
+                  disabled: !g(o).isPreviewable,
                   title: "Split view",
-                  onClick: t[4] || (t[4] = (y) => g(p)("split"))
+                  onClick: t[4] || (t[4] = (f) => g(_)("split"))
                 }, [...t[27] || (t[27] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2268,12 +2280,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       y2: "21"
                     })
                   ], -1)
-                ])], 10, zl)) : v("", !0),
-                g(r).tabs && g(r).tabs.includes("edit") && Le.value ? (a(), s("button", {
+                ])], 10, ql)) : v("", !0),
+                g(o).tabs && g(o).tabs.includes("edit") && Le.value ? (a(), s("button", {
                   key: 3,
                   class: N(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": g(m).viewMode === "edit" }]),
                   title: "Edit",
-                  onClick: t[5] || (t[5] = (y) => g(p)("edit"))
+                  onClick: t[5] || (t[5] = (f) => g(_)("edit"))
                 }, [...t[28] || (t[28] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2286,12 +2298,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   ], -1)
                 ])], 2)) : v("", !0)
               ]),
-              e("div", Il, [
+              e("div", Ol, [
                 g(m).viewMode === "edit" ? (a(), s("button", {
                   key: 0,
                   class: "artifactuse-panel__action artifactuse-panel__action--save",
                   title: "Save",
-                  onClick: _t
+                  onClick: kt
                 }, [...t[29] || (t[29] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2307,9 +2319,9 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 e("button", {
                   class: "artifactuse-panel__action",
                   title: g(m).isFullscreen ? "Exit fullscreen" : "Fullscreen",
-                  onClick: t[6] || (t[6] = (...y) => g(n) && g(n)(...y))
+                  onClick: t[6] || (t[6] = (...f) => g(l) && g(l)(...f))
                 }, [
-                  g(m).isFullscreen ? (a(), s("svg", Rl, [...t[31] || (t[31] = [
+                  g(m).isFullscreen ? (a(), s("svg", jl, [...t[31] || (t[31] = [
                     e("polyline", { points: "4 14 10 14 10 20" }, null, -1),
                     e("polyline", { points: "20 10 14 10 14 4" }, null, -1),
                     e("line", {
@@ -2324,7 +2336,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       x2: "10",
                       y2: "14"
                     }, null, -1)
-                  ])])) : (a(), s("svg", Vl, [...t[30] || (t[30] = [
+                  ])])) : (a(), s("svg", Dl, [...t[30] || (t[30] = [
                     e("polyline", { points: "15 3 21 3 21 9" }, null, -1),
                     e("polyline", { points: "9 21 3 21 3 15" }, null, -1),
                     e("line", {
@@ -2340,11 +2352,11 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       y2: "14"
                     }, null, -1)
                   ])]))
-                ], 8, Fl),
+                ], 8, Ul),
                 e("button", {
                   class: "artifactuse-panel__action artifactuse-panel__action--close",
                   title: "Close panel",
-                  onClick: t[7] || (t[7] = (...y) => g(h) && g(h)(...y))
+                  onClick: t[7] || (t[7] = (...f) => g(y) && g(y)(...f))
                 }, [...t[32] || (t[32] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2368,15 +2380,58 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 ])])
               ])
             ]),
+            Me.value && We.value.length > 0 ? (a(), s("div", Nl, [
+              e("div", Wl, [
+                (a(!0), s(R, null, ve(We.value, (f) => {
+                  var V;
+                  return a(), s("button", {
+                    key: f.id,
+                    class: N(["artifactuse-panel__file-tab", { "artifactuse-panel__file-tab--active": f.id === ((V = g(o)) == null ? void 0 : V.id) }]),
+                    onClick: (J) => ft(f)
+                  }, [
+                    e("span", {
+                      class: "artifactuse-panel__file-tab-icon",
+                      innerHTML: Ie(f.language)
+                    }, null, 8, Xl),
+                    e("span", Zl, n(f.title || "Untitled"), 1),
+                    e("button", {
+                      class: "artifactuse-panel__file-tab-close",
+                      title: "Close tab",
+                      onClick: he((J) => pt(f.id), ["stop"])
+                    }, [...t[33] || (t[33] = [
+                      e("svg", {
+                        viewBox: "0 0 24 24",
+                        fill: "none",
+                        stroke: "currentColor",
+                        "stroke-width": "2"
+                      }, [
+                        e("line", {
+                          x1: "18",
+                          y1: "6",
+                          x2: "6",
+                          y2: "18"
+                        }),
+                        e("line", {
+                          x1: "6",
+                          y1: "6",
+                          x2: "18",
+                          y2: "18"
+                        })
+                      ], -1)
+                    ])], 8, Kl)
+                  ], 10, Jl);
+                }), 128))
+              ])
+            ])) : v("", !0),
             e("div", {
               ref_key: "contentRef",
               ref: W,
               class: N(["artifactuse-panel__content", [
                 `artifactuse-panel__content--${g(m).viewMode}`,
-                { "artifactuse-panel__content--transitioning": f.value }
+                { "artifactuse-panel__content--transitioning": p.value }
               ]])
             }, [
-              f.value ? (a(), s("div", ql, [...t[33] || (t[33] = [
+              p.value ? (a(), s("div", Yl, [...t[34] || (t[34] = [
                 e("div", { class: "artifactuse-panel__spinner" }, null, -1)
               ])])) : v("", !0),
               g(m).viewMode === "preview" || g(m).viewMode === "split" ? (a(), s("div", {
@@ -2384,21 +2439,21 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 class: "artifactuse-panel__preview",
                 style: Pe(g(m).viewMode === "split" ? { width: `${I.value}%` } : void 0)
               }, [
-                oe.value && A.value ? (a(), s("div", Ol, [...t[34] || (t[34] = [
+                oe.value && P.value ? (a(), s("div", Ql, [...t[35] || (t[35] = [
                   e("div", { class: "artifactuse-panel__spinner" }, null, -1)
                 ])])) : v("", !0),
-                A.value ? (a(), s("iframe", {
+                P.value ? (a(), s("iframe", {
                   key: 1,
                   ref_key: "iframeRef",
                   ref: j,
-                  src: A.value,
+                  src: P.value,
                   class: N(["artifactuse-panel__iframe", { "artifactuse-panel__iframe--loading": oe.value }]),
                   sandbox: "allow-scripts allow-same-origin allow-forms allow-popups allow-modals allow-downloads allow-top-navigation-by-user-activation",
                   allow: "camera; microphone; fullscreen; geolocation; display-capture; autoplay; clipboard-write",
-                  onLoad: mt,
-                  onError: yt
-                }, null, 42, Ul)) : (a(), s("div", Dl, [
-                  t[35] || (t[35] = e("svg", {
+                  onLoad: wt,
+                  onError: bt
+                }, null, 42, Gl)) : (a(), s("div", en, [
+                  t[36] || (t[36] = e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
                     stroke: "currentColor",
@@ -2413,25 +2468,25 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       y2: "12"
                     })
                   ], -1)),
-                  e("p", null, "Preview not available for " + l(D.value), 1)
+                  e("p", null, "Preview not available for " + n(D.value), 1)
                 ]))
               ], 4)) : v("", !0),
-              at(e("div", {
+              it(e("div", {
                 class: "artifactuse-panel__code",
                 style: Pe(g(m).viewMode === "split" ? { width: `${100 - I.value}%` } : void 0)
               }, [
                 g(m).viewMode === "split" ? (a(), s("div", {
                   key: 0,
                   class: "artifactuse-panel__split-handle",
-                  onMousedown: me(zt, ["prevent"])
-                }, [...t[36] || (t[36] = [
+                  onMousedown: he(Rt, ["prevent"])
+                }, [...t[37] || (t[37] = [
                   e("div", { class: "artifactuse-panel__split-handle-line" }, null, -1)
                 ])], 32)) : v("", !0),
                 e("div", {
                   class: "artifactuse-panel__code-scroll",
                   ref_key: "codeScrollRef",
-                  ref: E,
-                  onScroll: At
+                  ref: S,
+                  onScroll: St
                 }, [
                   e("div", {
                     class: "artifactuse-panel__line-numbers",
@@ -2443,28 +2498,28 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   }, [
                     (a(), s("code", {
                       ref_key: "codeRef",
-                      ref: q,
-                      key: g(r).id,
+                      ref: O,
+                      key: g(o).id,
                       class: N(`language-${ae.value}`)
                     }, null, 2))
                   ], 2)
                 ], 544)
               ], 4), [
-                [st, g(m).viewMode === "code" || g(m).viewMode === "split"]
+                [lt, g(m).viewMode === "code" || g(m).viewMode === "split"]
               ]),
-              at(e("div", jl, [
+              it(e("div", tn, [
                 e("div", {
                   ref_key: "editorContainerRef",
                   ref: ie,
                   class: "artifactuse-panel__editor-container"
                 }, null, 512)
               ], 512), [
-                [st, g(m).viewMode === "edit"]
+                [lt, g(m).viewMode === "edit"]
               ])
             ], 2),
-            e("footer", Nl, [
-              e("div", Wl, [
-                G.value ? (a(), s("a", Jl, [...t[37] || (t[37] = [
+            e("footer", an, [
+              e("div", sn, [
+                G.value ? (a(), s("a", ln, [...t[38] || (t[38] = [
                   e("svg", {
                     width: "16",
                     height: "16",
@@ -2483,17 +2538,17 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   ], -1),
                   e("span", null, "Artifactuse", -1)
                 ])])) : v("", !0),
-                g(r).size ? (a(), s("span", Xl, l(g(nt)(g(r).size)), 1)) : v("", !0)
+                g(o).size ? (a(), s("span", nn, n(g(rt)(g(o).size)), 1)) : v("", !0)
               ]),
-              e("div", Zl, [
+              e("div", on, [
                 e("button", {
-                  class: N(["artifactuse-panel__footer-action", { "artifactuse-panel__footer-action--success": X.value }]),
-                  title: X.value ? "Copied!" : "Copy code",
-                  onClick: kt
+                  class: N(["artifactuse-panel__footer-action", { "artifactuse-panel__footer-action--success": Z.value }]),
+                  title: Z.value ? "Copied!" : "Copy code",
+                  onClick: xt
                 }, [
-                  X.value ? (a(), s("svg", Ql, [...t[39] || (t[39] = [
+                  Z.value ? (a(), s("svg", un, [...t[40] || (t[40] = [
                     e("polyline", { points: "20 6 9 17 4 12" }, null, -1)
-                  ])])) : (a(), s("svg", Yl, [...t[38] || (t[38] = [
+                  ])])) : (a(), s("svg", cn, [...t[39] || (t[39] = [
                     e("rect", {
                       x: "9",
                       y: "9",
@@ -2504,12 +2559,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     }, null, -1),
                     e("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" }, null, -1)
                   ])]))
-                ], 10, Kl),
+                ], 10, rn),
                 e("button", {
                   class: "artifactuse-panel__footer-action",
                   title: "Download file",
-                  onClick: wt
-                }, [...t[40] || (t[40] = [
+                  onClick: $t
+                }, [...t[41] || (t[41] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2526,12 +2581,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     })
                   ], -1)
                 ])]),
-                ce.value ? (a(), s("div", Gl, [
+                ce.value ? (a(), s("div", dn, [
                   e("button", {
                     class: "artifactuse-panel__footer-action",
                     title: "Share",
-                    onClick: bt
-                  }, [...t[41] || (t[41] = [
+                    onClick: Tt
+                  }, [...t[42] || (t[42] = [
                     e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
@@ -2567,15 +2622,15 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       })
                     ], -1)
                   ])]),
-                  Be(Ae, { name: "artifactuse-popup" }, {
-                    default: He(() => [
-                      re.value ? (a(), s("div", en, [
-                        e("div", tn, [
-                          e("span", an, l(P.value === "success" ? le.value ? "Artifact updated!" : "Link created!" : P.value === "update-list" ? "Update saved artifact" : "Share Artifact"), 1),
+                  Se(He, { name: "artifactuse-popup" }, {
+                    default: Be(() => [
+                      re.value ? (a(), s("div", vn, [
+                        e("div", fn, [
+                          e("span", pn, n(A.value === "success" ? le.value ? "Artifact updated!" : "Link created!" : A.value === "update-list" ? "Update saved artifact" : "Share Artifact"), 1),
                           e("button", {
                             class: "artifactuse-share-popup__close",
-                            onClick: xt
-                          }, [...t[42] || (t[42] = [
+                            onClick: Lt
+                          }, [...t[43] || (t[43] = [
                             e("svg", {
                               viewBox: "0 0 24 24",
                               fill: "none",
@@ -2597,29 +2652,29 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                             ], -1)
                           ])])
                         ]),
-                        e("div", sn, [
-                          P.value === "loading" ? (a(), s("div", ln, [...t[43] || (t[43] = [
+                        e("div", _n, [
+                          A.value === "loading" ? (a(), s("div", hn, [...t[44] || (t[44] = [
                             e("div", { class: "artifactuse-share-popup__spinner" }, null, -1),
                             e("p", { class: "artifactuse-share-popup__loading-text" }, "Creating link...", -1)
-                          ])])) : P.value === "error" ? (a(), s("div", nn, [
-                            e("div", on, [
-                              e("p", rn, l(T.value), 1)
+                          ])])) : A.value === "error" ? (a(), s("div", mn, [
+                            e("div", yn, [
+                              e("p", gn, n(L.value), 1)
                             ]),
-                            e("div", cn, [
+                            e("div", kn, [
                               e("button", {
                                 class: "artifactuse-share-popup__btn artifactuse-share-popup__btn--secondary",
-                                onClick: t[8] || (t[8] = (y) => P.value = "options")
+                                onClick: t[8] || (t[8] = (f) => A.value = "options")
                               }, " Back "),
                               e("button", {
                                 class: "artifactuse-share-popup__btn artifactuse-share-popup__btn--primary",
-                                onClick: $t
+                                onClick: At
                               }, " Retry ")
                             ])
-                          ])) : P.value === "options" ? (a(), s("div", un, [
+                          ])) : A.value === "options" ? (a(), s("div", wn, [
                             e("button", {
                               class: "artifactuse-share-popup__option",
-                              onClick: Xe
-                            }, [...t[44] || (t[44] = [
+                              onClick: Ke
+                            }, [...t[45] || (t[45] = [
                               e("div", { class: "artifactuse-share-popup__option-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
@@ -2638,8 +2693,8 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                             ])]),
                             e("button", {
                               class: "artifactuse-share-popup__option",
-                              onClick: Ze
-                            }, [...t[45] || (t[45] = [
+                              onClick: Ye
+                            }, [...t[46] || (t[46] = [
                               e("div", { class: "artifactuse-share-popup__option-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
@@ -2659,8 +2714,8 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                             ])]),
                             e("button", {
                               class: "artifactuse-share-popup__option",
-                              onClick: Mt
-                            }, [...t[46] || (t[46] = [
+                              onClick: Pt
+                            }, [...t[47] || (t[47] = [
                               e("div", { class: "artifactuse-share-popup__option-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
@@ -2678,29 +2733,29 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                                 e("p", { class: "artifactuse-share-popup__option-desc" }, "Replace an existing artifact")
                               ], -1)
                             ])])
-                          ])) : P.value === "update-list" ? (a(), s("div", dn, [
-                            z.value ? (a(), s("div", vn, [...t[47] || (t[47] = [
+                          ])) : A.value === "update-list" ? (a(), s("div", bn, [
+                            z.value ? (a(), s("div", Cn, [...t[48] || (t[48] = [
                               e("div", { class: "artifactuse-share-popup__spinner" }, null, -1),
                               e("p", { class: "artifactuse-share-popup__loading-text" }, "Loading artifacts...", -1)
-                            ])])) : c.value.length === 0 ? (a(), s("div", fn, " No saved artifacts of this type ")) : (a(), s("div", pn, [
-                              (a(!0), s(R, null, ve(c.value, (y) => {
-                                var U, Z, _e;
+                            ])])) : u.value.length === 0 ? (a(), s("div", xn, " No saved artifacts of this type ")) : (a(), s("div", $n, [
+                              (a(!0), s(R, null, ve(u.value, (f) => {
+                                var V, J, me;
                                 return a(), s("button", {
-                                  key: ((U = y.project) == null ? void 0 : U.uuid) || y.id,
+                                  key: ((V = f.project) == null ? void 0 : V.uuid) || f.id,
                                   class: "artifactuse-share-popup__artifact-item",
-                                  onClick: (ue) => Lt(y)
+                                  onClick: (ue) => Ht(f)
                                 }, [
-                                  e("span", _n, l(((Z = y.project) == null ? void 0 : Z.name) || "Untitled"), 1),
-                                  e("span", mn, l(Je((_e = y.project) == null ? void 0 : _e.created_at)), 1)
-                                ], 8, hn);
+                                  e("span", Tn, n(((J = f.project) == null ? void 0 : J.name) || "Untitled"), 1),
+                                  e("span", Ln, n(Ze((me = f.project) == null ? void 0 : me.created_at)), 1)
+                                ], 8, Mn);
                               }), 128))
                             ])),
                             e("button", {
                               class: "artifactuse-share-popup__back-btn",
-                              onClick: t[9] || (t[9] = (y) => P.value = "options")
+                              onClick: t[9] || (t[9] = (f) => A.value = "options")
                             }, "Back")
-                          ])) : P.value === "success" ? (a(), s("div", yn, [
-                            t[50] || (t[50] = e("div", { class: "artifactuse-share-popup__success-icon" }, [
+                          ])) : A.value === "success" ? (a(), s("div", An, [
+                            t[51] || (t[51] = e("div", { class: "artifactuse-share-popup__success-icon" }, [
                               e("svg", {
                                 viewBox: "0 0 24 24",
                                 fill: "none",
@@ -2710,21 +2765,21 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                                 e("polyline", { points: "20 6 9 17 4 12" })
                               ])
                             ], -1)),
-                            e("div", gn, [
+                            e("div", Pn, [
                               e("input", {
                                 type: "text",
                                 class: "artifactuse-share-popup__link",
                                 value: Q.value,
                                 readonly: "",
-                                onClick: t[10] || (t[10] = (y) => y.target.select())
-                              }, null, 8, kn),
+                                onClick: t[10] || (t[10] = (f) => f.target.select())
+                              }, null, 8, Hn),
                               e("button", {
-                                class: N(["artifactuse-share-popup__copy-btn", { "artifactuse-share-popup__copy-btn--copied": o.value }]),
-                                onClick: Tt
-                              }, l(o.value ? "Copied!" : "Copy"), 3)
+                                class: N(["artifactuse-share-popup__copy-btn", { "artifactuse-share-popup__copy-btn--copied": r.value }]),
+                                onClick: Bt
+                              }, n(r.value ? "Copied!" : "Copy"), 3)
                             ]),
-                            w.value && !B.value ? (a(), s("div", wn, [
-                              t[48] || (t[48] = e("span", { class: "artifactuse-share-popup__expiry-icon" }, [
+                            w.value && !E.value ? (a(), s("div", Bn, [
+                              t[49] || (t[49] = e("span", { class: "artifactuse-share-popup__expiry-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
                                   fill: "none",
@@ -2750,18 +2805,18 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                                   })
                                 ])
                               ], -1)),
-                              e("span", Cn, " Expires " + l(Je(w.value)), 1)
+                              e("span", En, " Expires " + n(Ze(w.value)), 1)
                             ])) : v("", !0),
-                            B.value ? v("", !0) : (a(), s("div", bn, [
-                              t[49] || (t[49] = e("p", { class: "artifactuse-share-popup__save-prompt-text" }, "Keep it permanently?", -1)),
+                            E.value ? v("", !0) : (a(), s("div", Sn, [
+                              t[50] || (t[50] = e("p", { class: "artifactuse-share-popup__save-prompt-text" }, "Keep it permanently?", -1)),
                               e("button", {
                                 class: "artifactuse-share-popup__save-prompt-btn",
-                                onClick: Ze
+                                onClick: Ye
                               }, " Save to account ")
                             ]))
                           ])) : v("", !0)
                         ]),
-                        t[51] || (t[51] = e("div", { class: "artifactuse-share-popup__footer" }, [
+                        t[52] || (t[52] = e("div", { class: "artifactuse-share-popup__footer" }, [
                           e("a", {
                             href: "https://artifactuse.com",
                             target: "_blank",
@@ -2792,12 +2847,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     _: 1
                   })
                 ])) : v("", !0),
-                A.value ? (a(), s("button", {
+                P.value ? (a(), s("button", {
                   key: 1,
                   class: "artifactuse-panel__footer-action",
                   title: "Open in new tab",
-                  onClick: Pt
-                }, [...t[52] || (t[52] = [
+                  onClick: Et
+                }, [...t[53] || (t[53] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2814,13 +2869,13 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     })
                   ], -1)
                 ])])) : v("", !0),
-                u.value.length > 1 ? (a(), s("div", xn, [
+                !Me.value && d.value.length > 1 ? (a(), s("div", zn, [
                   e("button", {
                     class: "artifactuse-panel__nav-btn",
-                    disabled: O.value <= 0,
+                    disabled: U.value <= 0,
                     title: "Previous artifact",
-                    onClick: St
-                  }, [...t[53] || (t[53] = [
+                    onClick: It
+                  }, [...t[54] || (t[54] = [
                     e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
@@ -2829,14 +2884,14 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     }, [
                       e("polyline", { points: "15 18 9 12 15 6" })
                     ], -1)
-                  ])], 8, $n),
+                  ])], 8, In),
                   e("button", {
                     class: "artifactuse-panel__nav-trigger",
                     title: "View all artifacts",
-                    onClick: Ht
+                    onClick: zt
                   }, [
-                    e("span", null, l(O.value + 1) + " / " + l(u.value.length), 1),
-                    t[54] || (t[54] = e("svg", {
+                    e("span", null, n(U.value + 1) + " / " + n(d.value.length), 1),
+                    t[55] || (t[55] = e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
                       stroke: "currentColor",
@@ -2847,10 +2902,10 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   ]),
                   e("button", {
                     class: "artifactuse-panel__nav-btn",
-                    disabled: O.value >= u.value.length - 1,
+                    disabled: U.value >= d.value.length - 1,
                     title: "Next artifact",
-                    onClick: Bt
-                  }, [...t[55] || (t[55] = [
+                    onClick: Ft
+                  }, [...t[56] || (t[56] = [
                     e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
@@ -2859,16 +2914,16 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     }, [
                       e("polyline", { points: "9 18 15 12 9 6" })
                     ], -1)
-                  ])], 8, Mn),
-                  Be(Ae, { name: "artifactuse-popup" }, {
-                    default: He(() => [
-                      J.value ? (a(), s("div", Ln, [
-                        e("div", Tn, [
-                          t[57] || (t[57] = e("span", null, "Artifacts", -1)),
+                  ])], 8, Fn),
+                  Se(He, { name: "artifactuse-popup" }, {
+                    default: Be(() => [
+                      X.value ? (a(), s("div", Vn, [
+                        e("div", Rn, [
+                          t[58] || (t[58] = e("span", null, "Artifacts", -1)),
                           e("button", {
                             class: "artifactuse-panel__artifact-list-close",
-                            onClick: t[11] || (t[11] = (y) => J.value = !1)
-                          }, [...t[56] || (t[56] = [
+                            onClick: t[11] || (t[11] = (f) => X.value = !1)
+                          }, [...t[57] || (t[57] = [
                             e("svg", {
                               viewBox: "0 0 24 24",
                               fill: "none",
@@ -2890,27 +2945,27 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                             ], -1)
                           ])])
                         ]),
-                        e("div", Pn, [
-                          (a(!0), s(R, null, ve(u.value, (y, U) => (a(), s("button", {
-                            key: y.id,
-                            class: N(["artifactuse-panel__artifact-item", { "artifactuse-panel__artifact-item--active": y.id === g(r).id }]),
-                            onClick: (Z) => Ke(y)
+                        e("div", qn, [
+                          (a(!0), s(R, null, ve(d.value, (f, V) => (a(), s("button", {
+                            key: f.id,
+                            class: N(["artifactuse-panel__artifact-item", { "artifactuse-panel__artifact-item--active": f.id === g(o).id }]),
+                            onClick: (J) => Qe(f)
                           }, [
                             e("span", {
                               class: "artifactuse-panel__artifact-item-icon",
-                              innerHTML: je(y.language)
-                            }, null, 8, Hn),
-                            e("div", Sn, [
-                              e("span", Bn, l(y.title || "Untitled"), 1),
-                              e("span", En, [
-                                K(l(g(Se)(y.language)) + " ", 1),
-                                y.lineCount ? (a(), s(R, { key: 0 }, [
-                                  K(" • " + l(y.lineCount) + " lines ", 1)
+                              innerHTML: Ie(f.language)
+                            }, null, 8, Un),
+                            e("div", Dn, [
+                              e("span", jn, n(f.title || "Untitled"), 1),
+                              e("span", Nn, [
+                                K(n(g(Ee)(f.language)) + " ", 1),
+                                f.lineCount ? (a(), s(R, { key: 0 }, [
+                                  K(" • " + n(f.lineCount) + " lines ", 1)
                                 ], 64)) : v("", !0)
                               ])
                             ]),
-                            e("span", zn, l(U + 1), 1)
-                          ], 10, An))), 128))
+                            e("span", Wn, n(V + 1), 1)
+                          ], 10, On))), 128))
                         ])
                       ])) : v("", !0)
                     ]),
@@ -2920,8 +2975,8 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ])
             ])
           ], 64)) : (a(), s(R, { key: 2 }, [
-            e("header", ul, [
-              e("div", dl, [
+            e("header", pl, [
+              e("div", _l, [
                 t[18] || (t[18] = e("span", { class: "artifactuse-panel__icon" }, [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2933,19 +2988,19 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     e("polyline", { points: "8 6 2 12 8 18" })
                   ])
                 ], -1)),
-                e("div", vl, [
+                e("div", hl, [
                   t[17] || (t[17] = e("span", { class: "artifactuse-panel__name" }, "Artifacts", -1)),
-                  e("span", fl, l(u.value.length) + " available", 1)
+                  e("span", ml, n(d.value.length) + " available", 1)
                 ])
               ]),
-              e("div", pl, [
+              e("div", yl, [
                 e("button", {
                   class: N(["artifactuse-panel__action", { "artifactuse-panel__action--loading": ee.value }]),
                   disabled: ee.value,
                   title: "Download all as ZIP",
-                  onClick: Ct
+                  onClick: Mt
                 }, [
-                  ee.value ? (a(), s("svg", ml, [...t[20] || (t[20] = [
+                  ee.value ? (a(), s("svg", wl, [...t[20] || (t[20] = [
                     e("circle", {
                       cx: "12",
                       cy: "12",
@@ -2953,7 +3008,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       "stroke-dasharray": "32",
                       "stroke-dashoffset": "32"
                     }, null, -1)
-                  ])])) : (a(), s("svg", _l, [...t[19] || (t[19] = [
+                  ])])) : (a(), s("svg", kl, [...t[19] || (t[19] = [
                     e("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }, null, -1),
                     e("polyline", { points: "7 10 12 15 17 10" }, null, -1),
                     e("line", {
@@ -2963,11 +3018,11 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       y2: "3"
                     }, null, -1)
                   ])]))
-                ], 10, hl),
+                ], 10, gl),
                 e("button", {
                   class: "artifactuse-panel__action artifactuse-panel__action--close",
                   title: "Close panel",
-                  onClick: t[1] || (t[1] = (...y) => g(h) && g(h)(...y))
+                  onClick: t[1] || (t[1] = (...f) => g(y) && g(y)(...f))
                 }, [...t[21] || (t[21] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -2991,23 +3046,23 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 ])])
               ])
             ]),
-            e("div", yl, [
-              e("div", gl, [
-                (a(!0), s(R, null, ve(u.value, (y, U) => (a(), s("button", {
-                  key: y.id,
+            e("div", bl, [
+              e("div", Cl, [
+                (a(!0), s(R, null, ve(d.value, (f, V) => (a(), s("button", {
+                  key: f.id,
                   class: "artifactuse-panel__list-item",
-                  onClick: (Z) => Ke(y)
+                  onClick: (J) => Qe(f)
                 }, [
                   e("span", {
                     class: "artifactuse-panel__list-item-icon",
-                    innerHTML: je(y.language)
-                  }, null, 8, wl),
-                  e("div", Cl, [
-                    e("span", bl, l(y.title || "Untitled"), 1),
-                    e("span", xl, [
-                      K(l(g(Se)(y.language)) + " ", 1),
-                      y.lineCount ? (a(), s(R, { key: 0 }, [
-                        K(" • " + l(y.lineCount) + " lines ", 1)
+                    innerHTML: Ie(f.language)
+                  }, null, 8, $l),
+                  e("div", Ml, [
+                    e("span", Tl, n(f.title || "Untitled"), 1),
+                    e("span", Ll, [
+                      K(n(g(Ee)(f.language)) + " ", 1),
+                      f.lineCount ? (a(), s(R, { key: 0 }, [
+                        K(" • " + n(f.lineCount) + " lines ", 1)
                       ], 64)) : v("", !0)
                     ])
                   ]),
@@ -3021,11 +3076,11 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       e("polyline", { points: "9 18 15 12 9 6" })
                     ])
                   ], -1))
-                ], 8, kl))), 128))
+                ], 8, xl))), 128))
               ])
             ]),
-            e("footer", $l, [
-              G.value ? (a(), s("a", Ml, [...t[23] || (t[23] = [
+            e("footer", Al, [
+              G.value ? (a(), s("a", Pl, [...t[23] || (t[23] = [
                 e("svg", {
                   width: "16",
                   height: "16",
@@ -3046,7 +3101,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ])])) : v("", !0)
             ])
           ], 64)) : (a(), s(R, { key: 1 }, [
-            e("header", nl, [
+            e("header", ul, [
               t[14] || (t[14] = e("div", { class: "artifactuse-panel__title" }, [
                 e("span", { class: "artifactuse-panel__icon" }, [
                   e("svg", {
@@ -3063,11 +3118,11 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   e("span", { class: "artifactuse-panel__name" }, "Artifacts")
                 ])
               ], -1)),
-              e("div", ol, [
+              e("div", dl, [
                 e("button", {
                   class: "artifactuse-panel__action artifactuse-panel__action--close",
                   title: "Close panel",
-                  onClick: t[0] || (t[0] = (...y) => g(h) && g(h)(...y))
+                  onClick: t[0] || (t[0] = (...f) => g(y) && g(y)(...f))
                 }, [...t[13] || (t[13] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
@@ -3106,8 +3161,8 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               e("h3", { class: "artifactuse-panel__empty-title" }, "No artifacts yet"),
               e("p", { class: "artifactuse-panel__empty-text" }, " Code blocks, forms, and other interactive content will appear here as the AI generates them. ")
             ], -1)),
-            e("footer", rl, [
-              G.value ? (a(), s("a", cl, [...t[15] || (t[15] = [
+            e("footer", vl, [
+              G.value ? (a(), s("a", fl, [...t[15] || (t[15] = [
                 e("svg", {
                   width: "16",
                   height: "16",
@@ -3133,22 +3188,22 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
       _: 1
     }));
   }
-}, In = ["title"], Fn = {
+}, Jn = ["title"], Xn = {
   key: 0,
   class: "artifactuse-panel-toggle-badge"
-}, jn = {
+}, to = {
   __name: "ArtifactusePanelToggle",
   setup(H) {
-    const { state: d, artifactCount: _, hasArtifacts: L, togglePanel: m } = Ee();
-    return (r, V) => (a(), s("button", {
+    const { state: c, artifactCount: h, hasArtifacts: T, togglePanel: m } = ze();
+    return (o, q) => (a(), s("button", {
       class: N(["artifactuse-panel-toggle", {
-        "artifactuse-panel-toggle--active": g(d).isPanelOpen,
-        "artifactuse-panel-toggle--has-artifacts": g(L)
+        "artifactuse-panel-toggle--active": g(c).isPanelOpen,
+        "artifactuse-panel-toggle--has-artifacts": g(T)
       }]),
-      onClick: V[0] || (V[0] = (...S) => g(m) && g(m)(...S)),
-      title: g(d).isPanelOpen ? "Close artifacts panel" : "Open artifacts panel"
+      onClick: q[0] || (q[0] = (...B) => g(m) && g(m)(...B)),
+      title: g(c).isPanelOpen ? "Close artifacts panel" : "Open artifacts panel"
     }, [
-      V[1] || (V[1] = e("svg", {
+      q[1] || (q[1] = e("svg", {
         viewBox: "0 0 24 24",
         fill: "none",
         stroke: "currentColor",
@@ -3159,148 +3214,160 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
         e("polyline", { points: "16 18 22 12 16 6" }),
         e("polyline", { points: "8 6 2 12 8 18" })
       ], -1)),
-      g(_) > 0 ? (a(), s("span", Fn, l(g(_) > 99 ? "99+" : g(_)), 1)) : v("", !0)
-    ], 10, In));
+      g(h) > 0 ? (a(), s("span", Xn, n(g(h) > 99 ? "99+" : g(h)), 1)) : v("", !0)
+    ], 10, Jn));
   }
-}, rt = Symbol("artifactuse");
-function ct(H = {}) {
-  var n;
-  const d = ot(H), _ = lt({
+}, ut = Symbol("artifactuse");
+function dt(H = {}) {
+  var l;
+  const c = ct(H), h = ot({
     artifacts: [],
     activeArtifactId: null,
     isPanelOpen: !1,
     viewMode: "preview",
-    isFullscreen: !1
+    isFullscreen: !1,
+    openTabs: [],
+    tabViewModes: {}
   });
-  d.state.subscribe((p) => {
-    _.artifacts = p.artifacts, _.activeArtifactId = p.activeArtifactId, _.isPanelOpen = p.isPanelOpen, _.viewMode = p.viewMode, _.isFullscreen = p.isFullscreen;
+  c.state.subscribe((_) => {
+    h.artifacts = _.artifacts, h.activeArtifactId = _.activeArtifactId, h.isPanelOpen = _.isPanelOpen, h.viewMode = _.viewMode, h.isFullscreen = _.isFullscreen, h.openTabs = _.openTabs, h.tabViewModes = _.tabViewModes;
   });
-  const L = b(() => _.activeArtifactId && _.artifacts.find((p) => p.id === _.activeArtifactId) || null), m = b(() => _.artifacts.filter((p) => !p.isInline).length), r = b(() => _.artifacts.some((p) => !p.isInline)), V = b(() => d.getPanelTypes()), S = b(() => L.value ? d.getPanelUrl(L.value) : null);
-  if (d.applyTheme(), H.theme === "auto" || !H.theme) {
-    const p = ((n = d.bridge) == null ? void 0 : n.theme) || d.theme;
-    p != null && p.watchSystemTheme && p.watchSystemTheme(() => {
-      d.applyTheme();
+  const T = C(() => h.activeArtifactId && h.artifacts.find((_) => _.id === h.activeArtifactId) || null), m = C(() => h.artifacts.filter((_) => !_.isInline).length), o = C(() => h.artifacts.some((_) => !_.isInline)), q = C(() => c.getPanelTypes()), B = C(() => T.value ? c.getPanelUrl(T.value) : null);
+  if (c.applyTheme(), H.theme === "auto" || !H.theme) {
+    const _ = ((l = c.bridge) == null ? void 0 : l.theme) || c.theme;
+    _ != null && _.watchSystemTheme && _.watchSystemTheme(() => {
+      c.applyTheme();
     });
   }
-  const h = {
-    instance: d,
-    state: _,
-    activeArtifact: L,
+  const y = {
+    instance: c,
+    state: h,
+    activeArtifact: T,
     artifactCount: m,
-    hasArtifacts: r,
+    hasArtifacts: o,
     // Panel computed
-    panelTypes: V,
-    activePanelUrl: S,
+    panelTypes: q,
+    activePanelUrl: B,
     // Methods
-    processMessage: d.processMessage,
-    initializeContent: d.initializeContent,
-    openArtifact: d.openArtifact,
-    openFile: d.openFile,
-    openCode: d.openCode,
-    updateFile: d.updateFile,
-    closePanel: d.closePanel,
-    togglePanel: d.togglePanel,
-    toggleFullscreen: d.toggleFullscreen,
-    setViewMode: d.setViewMode,
-    getPanelUrl: d.getPanelUrl,
-    sendToPanel: d.sendToPanel,
+    processMessage: c.processMessage,
+    initializeContent: c.initializeContent,
+    openArtifact: c.openArtifact,
+    openFile: c.openFile,
+    openCode: c.openCode,
+    updateFile: c.updateFile,
+    closePanel: c.closePanel,
+    togglePanel: c.togglePanel,
+    toggleFullscreen: c.toggleFullscreen,
+    setViewMode: c.setViewMode,
+    getPanelUrl: c.getPanelUrl,
+    sendToPanel: c.sendToPanel,
     // Panel management
-    hasPanel: d.hasPanel,
-    registerPanel: d.registerPanel,
-    unregisterPanel: d.unregisterPanel,
-    getPanelTypes: d.getPanelTypes,
+    hasPanel: c.hasPanel,
+    registerPanel: c.registerPanel,
+    unregisterPanel: c.unregisterPanel,
+    getPanelTypes: c.getPanelTypes,
+    // Multi-tab
+    closeTab: c.closeTab,
+    closeOtherTabs: c.closeOtherTabs,
+    closeAllTabs: c.closeAllTabs,
     // Events
-    on: d.on,
-    off: d.off,
+    on: c.on,
+    off: c.off,
     // State management
-    clearArtifacts: () => d.state.clear(),
+    clearArtifacts: () => c.state.clear(),
     // Theme - wrap setTheme to also apply
-    applyTheme: d.applyTheme,
-    setTheme: (p) => {
-      d.setTheme(p), d.applyTheme();
+    applyTheme: c.applyTheme,
+    setTheme: (_) => {
+      c.setTheme(_), c.applyTheme();
     },
-    getTheme: d.getTheme
+    getTheme: c.getTheme
   };
-  return Ot(rt, h), h;
+  return Nt(ut, y), y;
 }
-function Ee() {
-  const H = Ut(rt);
-  return H || (console.warn("useArtifactuse() called without provideArtifactuse(). Creating standalone instance."), ct());
+function ze() {
+  const H = Wt(ut);
+  return H || (console.warn("useArtifactuse() called without provideArtifactuse(). Creating standalone instance."), dt());
 }
-function Vn(H = {}) {
-  const d = ot(H), _ = lt({
+function Zn(H = {}) {
+  const c = ct(H), h = ot({
     artifacts: [],
     activeArtifactId: null,
     isPanelOpen: !1,
     viewMode: "preview",
-    isFullscreen: !1
+    isFullscreen: !1,
+    openTabs: [],
+    tabViewModes: {}
   });
-  let L;
+  let T;
   $e(() => {
-    L = d.state.subscribe((n) => {
-      _.artifacts = n.artifacts, _.activeArtifactId = n.activeArtifactId, _.isPanelOpen = n.isPanelOpen, _.viewMode = n.viewMode, _.isFullscreen = n.isFullscreen;
-    }), d.applyTheme();
-  }), De(() => {
-    L && L(), d.destroy();
+    T = c.state.subscribe((l) => {
+      h.artifacts = l.artifacts, h.activeArtifactId = l.activeArtifactId, h.isPanelOpen = l.isPanelOpen, h.viewMode = l.viewMode, h.isFullscreen = l.isFullscreen, h.openTabs = l.openTabs, h.tabViewModes = l.tabViewModes;
+    }), c.applyTheme();
+  }), Ne(() => {
+    T && T(), c.destroy();
   });
-  const m = b(() => _.activeArtifactId && _.artifacts.find((n) => n.id === _.activeArtifactId) || null), r = b(() => _.artifacts.filter((n) => !n.isInline).length), V = b(() => _.artifacts.some((n) => !n.isInline)), S = b(() => d.getPanelTypes()), h = b(() => m.value ? d.getPanelUrl(m.value) : null);
+  const m = C(() => h.activeArtifactId && h.artifacts.find((l) => l.id === h.activeArtifactId) || null), o = C(() => h.artifacts.filter((l) => !l.isInline).length), q = C(() => h.artifacts.some((l) => !l.isInline)), B = C(() => c.getPanelTypes()), y = C(() => m.value ? c.getPanelUrl(m.value) : null);
   return {
-    instance: d,
-    state: _,
+    instance: c,
+    state: h,
     activeArtifact: m,
-    artifactCount: r,
-    hasArtifacts: V,
+    artifactCount: o,
+    hasArtifacts: q,
     // Panel computed
-    panelTypes: S,
-    activePanelUrl: h,
+    panelTypes: B,
+    activePanelUrl: y,
     // Methods
-    processMessage: d.processMessage,
-    initializeContent: d.initializeContent,
-    openArtifact: d.openArtifact,
-    openFile: d.openFile,
-    openCode: d.openCode,
-    updateFile: d.updateFile,
-    closePanel: d.closePanel,
-    togglePanel: d.togglePanel,
-    toggleFullscreen: d.toggleFullscreen,
-    setViewMode: d.setViewMode,
-    getPanelUrl: d.getPanelUrl,
-    sendToPanel: d.sendToPanel,
+    processMessage: c.processMessage,
+    initializeContent: c.initializeContent,
+    openArtifact: c.openArtifact,
+    openFile: c.openFile,
+    openCode: c.openCode,
+    updateFile: c.updateFile,
+    closePanel: c.closePanel,
+    togglePanel: c.togglePanel,
+    toggleFullscreen: c.toggleFullscreen,
+    setViewMode: c.setViewMode,
+    getPanelUrl: c.getPanelUrl,
+    sendToPanel: c.sendToPanel,
     // Panel management
-    hasPanel: d.hasPanel,
-    registerPanel: d.registerPanel,
-    unregisterPanel: d.unregisterPanel,
-    getPanelTypes: d.getPanelTypes,
+    hasPanel: c.hasPanel,
+    registerPanel: c.registerPanel,
+    unregisterPanel: c.unregisterPanel,
+    getPanelTypes: c.getPanelTypes,
+    // Multi-tab
+    closeTab: c.closeTab,
+    closeOtherTabs: c.closeOtherTabs,
+    closeAllTabs: c.closeAllTabs,
     // Events
-    on: d.on,
-    off: d.off,
+    on: c.on,
+    off: c.off,
     // State management
-    clearArtifacts: () => d.state.clear(),
+    clearArtifacts: () => c.state.clear(),
     // Theme - wrap setTheme to also apply
-    applyTheme: d.applyTheme,
-    setTheme: (n) => {
-      d.setTheme(n), d.applyTheme();
+    applyTheme: c.applyTheme,
+    setTheme: (l) => {
+      c.setTheme(l), c.applyTheme();
     },
-    getTheme: d.getTheme
+    getTheme: c.getTheme
   };
 }
-const Nn = {
-  provideArtifactuse: ct,
-  useArtifactuse: Ee,
-  createArtifactuseComposable: Vn,
-  DEFAULT_PANELS: Nt
+const ao = {
+  provideArtifactuse: dt,
+  useArtifactuse: ze,
+  createArtifactuseComposable: Zn,
+  DEFAULT_PANELS: Zt
 };
 export {
-  Un as ArtifactuseAgentMessage,
-  ia as ArtifactuseCard,
-  Ja as ArtifactuseInlineForm,
-  Dn as ArtifactusePanel,
-  jn as ArtifactusePanelToggle,
-  Ki as ArtifactuseSocialPreview,
-  il as ArtifactuseViewer,
-  Nt as DEFAULT_PANELS,
-  Vn as createArtifactuseComposable,
-  Nn as default,
-  ct as provideArtifactuse,
-  Ee as useArtifactuse
+  Gn as ArtifactuseAgentMessage,
+  ra as ArtifactuseCard,
+  Ya as ArtifactuseInlineForm,
+  eo as ArtifactusePanel,
+  to as ArtifactusePanelToggle,
+  el as ArtifactuseSocialPreview,
+  rl as ArtifactuseViewer,
+  Zt as DEFAULT_PANELS,
+  Zn as createArtifactuseComposable,
+  ao as default,
+  dt as provideArtifactuse,
+  ze as useArtifactuse
 };