artifactuse 0.2.0 → 0.2.3

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 j, createElementVNode as e, toDisplayString as l, withModifiers as he, onMounted as Me, watch as de, Fragment as R, createCommentVNode as v, renderList as ve, createTextVNode as K, h as se, normalizeStyle as He, createStaticVNode as Ot, createBlock as $e, resolveDynamicComponent as Ut, nextTick as xe, onUnmounted as We, Teleport as Dt, createVNode as ze, Transition as Ee, withCtx as Be, withKeys as Nt, onBeforeUnmount as jt, unref as y, withDirectives as lt, vShow as nt, reactive as rt, provide as Wt, inject as Jt } from "vue";
+import { g as Se, f as ct, a as Ne, b as je, n as Xt, i as ot, c as Zt, D as Kt, d as ut } from "../index-B4BEvWtI.js";
+import { J as Yt } from "../jszip.min-CdmYyw5L.js";
+const Qt = { class: "artifactuse-card__icon" }, Gt = ["innerHTML"], ea = { class: "artifactuse-card__content" }, ta = { class: "artifactuse-card__title" }, aa = { class: "artifactuse-card__meta" }, sa = { class: "artifactuse-card__type" }, ia = { class: "artifactuse-card__size" }, la = { class: "artifactuse-card__actions" }, na = ["title"], oa = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, sa = {
+}, ra = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, ia = {
+}, ca = {
   __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, T = c, f = M(!1), o = C(() => Se(_.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 ct(_.artifact.size || ((x = _.artifact.code) == null ? void 0 : x.length) || 0);
+    }), E = C(() => Ne(_.artifact.language));
+    function g(x) {
+      x.stopPropagation(), T("open", _.artifact);
     }
     async function n() {
       try {
-        await navigator.clipboard.writeText(_.artifact.code), m.value = !0, setTimeout(() => {
-          m.value = !1;
-        }, 2e3), L("copy", _.artifact);
+        await navigator.clipboard.writeText(_.artifact.code), f.value = !0, setTimeout(() => {
+          f.value = !1;
+        }, 2e3), T("copy", _.artifact);
       } catch (x) {
         console.error("Failed to copy:", x);
       }
     }
-    function p() {
+    function h() {
       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([_.artifact.code], { type: "text/plain" }), I = URL.createObjectURL(x), $ = document.createElement("a"), N = je(_.artifact.language), O = ((W = _.artifact.title) == null ? void 0 : W.replace(/[^a-z0-9]/gi, "_").toLowerCase()) || "code";
+      $.href = I, $.download = `${O}.${N}`, document.body.appendChild($), $.click(), document.body.removeChild($), URL.revokeObjectURL(I), T("download", _.artifact);
     }
-    return (x, F) => (a(), s("div", {
-      class: N(["artifactuse-card", { "artifactuse-card--active": H.isActive }]),
-      onClick: h
+    return (x, I) => (a(), s("div", {
+      class: j(["artifactuse-card", { "artifactuse-card--active": H.isActive }]),
+      onClick: g
     }, [
-      e("div", Jt, [
+      e("div", Qt, [
         (a(), s("svg", {
           viewBox: "0 0 24 24",
           fill: "none",
           stroke: "currentColor",
           "stroke-width": "1.5",
-          innerHTML: S.value
-        }, null, 8, Xt))
+          innerHTML: E.value
+        }, null, 8, Gt))
       ]),
-      e("div", Zt, [
-        e("div", Kt, l(H.artifact.title), 1),
-        e("div", Yt, [
-          e("span", Qt, l(r.value), 1),
-          F[0] || (F[0] = e("span", { class: "artifactuse-card__separator" }, "•", -1)),
-          e("span", Gt, l(V.value), 1)
+      e("div", ea, [
+        e("div", ta, l(H.artifact.title), 1),
+        e("div", aa, [
+          e("span", sa, l(o.value), 1),
+          I[0] || (I[0] = e("span", { class: "artifactuse-card__separator" }, "•", -1)),
+          e("span", ia, l(q.value), 1)
         ])
       ]),
-      e("div", ea, [
+      e("div", la, [
         e("button", {
           class: "artifactuse-card__action",
-          onClick: me(n, ["stop"]),
-          title: m.value ? "Copied!" : "Copy code"
+          onClick: he(n, ["stop"]),
+          title: f.value ? "Copied!" : "Copy code"
         }, [
-          m.value ? (a(), s("svg", sa, [...F[2] || (F[2] = [
+          f.value ? (a(), s("svg", ra, [...I[2] || (I[2] = [
             e("polyline", { points: "20 6 9 17 4 12" }, null, -1)
-          ])])) : (a(), s("svg", aa, [...F[1] || (F[1] = [
+          ])])) : (a(), s("svg", oa, [...I[1] || (I[1] = [
             e("rect", {
               x: "9",
               y: "9",
@@ -88,12 +88,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)
           ])]))
-        ], 8, ta),
+        ], 8, na),
         e("button", {
           class: "artifactuse-card__action",
-          onClick: me(p, ["stop"]),
+          onClick: he(h, ["stop"]),
           title: "Download file"
-        }, [...F[3] || (F[3] = [
+        }, [...I[3] || (I[3] = [
           e("svg", {
             viewBox: "0 0 24 24",
             fill: "none",
@@ -111,7 +111,7 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
           ], -1)
         ])])
       ]),
-      F[4] || (F[4] = e("div", { class: "artifactuse-card__arrow" }, [
+      I[4] || (I[4] = e("div", { class: "artifactuse-card__arrow" }, [
         e("svg", {
           viewBox: "0 0 24 24",
           fill: "none",
@@ -123,10 +123,10 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
       ], -1))
     ], 2));
   }
-}, la = ["data-artifactuse-theme"], na = {
+}, ua = ["data-artifactuse-theme"], da = {
   key: 0,
   class: "artifactuse-form-collapsed"
-}, oa = { class: "artifactuse-form-collapsed-icon" }, ra = {
+}, va = { class: "artifactuse-form-collapsed-icon" }, fa = {
   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 = {
+}, pa = {
   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 = {
+}, _a = {
   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 = {
+}, ha = { class: "artifactuse-form-collapsed-title" }, ma = {
   key: 0,
   class: "artifactuse-form-header"
-}, fa = {
+}, ya = {
   key: 0,
   class: "artifactuse-form-title"
-}, pa = {
+}, ga = {
   key: 1,
   class: "artifactuse-form-description"
-}, ha = {
+}, ka = {
   key: 1,
   class: "artifactuse-form-buttons"
-}, _a = ["disabled", "onClick"], ma = ["innerHTML"], ya = { class: "artifactuse-form-fields" }, ga = {
+}, wa = ["disabled", "onClick"], ba = ["innerHTML"], Ca = { class: "artifactuse-form-fields" }, xa = {
   key: 0,
   class: "artifactuse-form-buttons"
-}, ka = ["type", "disabled", "onClick"], wa = {
+}, $a = ["type", "disabled", "onClick"], Ma = {
   key: 0,
   class: "artifactuse-form-btn-spinner"
-}, Ca = ["innerHTML"], ba = {
+}, Ta = ["innerHTML"], La = {
   key: 1,
   class: "artifactuse-form-divider"
-}, xa = {
+}, Pa = {
   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 = {
+}, Ha = { class: "artifactuse-checkbox-label" }, Ea = ["checked", "disabled", "onChange"], Ba = { class: "artifactuse-checkbox-text" }, Sa = {
   key: 0,
   class: "artifactuse-required"
-}, Aa = {
+}, za = {
   key: 0,
   class: "artifactuse-help-text"
-}, Ha = {
+}, Va = {
   key: 1,
   class: "artifactuse-error-text"
-}, Sa = {
+}, Ia = {
   key: 4,
   class: "artifactuse-form-field"
-}, Ba = ["for"], Ea = {
+}, Fa = ["for"], Ra = {
   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 = {
+}, qa = ["id", "type", "value", "placeholder", "disabled", "required", "onInput"], Oa = ["id", "value", "placeholder", "disabled", "required", "rows", "onInput"], Ua = ["id", "value", "disabled", "required", "onChange"], Da = { value: "" }, Na = ["value", "disabled"], ja = {
   key: 3,
   class: "artifactuse-radio-group"
-}, Oa = ["name", "value", "checked", "disabled", "onChange"], Ua = {
+}, Wa = ["name", "value", "checked", "disabled", "onChange"], Ja = {
   key: 4,
   class: "artifactuse-help-text"
-}, Da = {
+}, Xa = {
   key: 5,
   class: "artifactuse-error-text"
-}, ja = {
+}, Za = {
   key: 0,
   class: "artifactuse-form-buttons artifactuse-form-buttons-default"
-}, Na = ["disabled"], Wa = {
+}, Ka = ["disabled"], Ya = {
   key: 0,
   class: "artifactuse-form-btn-spinner"
-}, Ja = {
+}, Qa = {
   __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) {
-      m.value = w;
+  setup(H, { emit: c }) {
+    const _ = H, T = c, f = M(_.initialState), o = C(() => f.value !== "active"), q = C(() => f.value === "active" ? "" : `artifactuse-form--${f.value}`);
+    function E(w) {
+      f.value = w;
     }
-    const h = b(() => {
+    const g = C(() => {
       try {
         return JSON.parse(_.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(() => {
+    }), n = M(null), h = C(() => _.artifact.id || g.value.id || `form-${Date.now()}`), x = C(() => `artifactuse-form-${g.value.variant || "fields"}`), I = C(() => g.value.title || "Form"), $ = M({}), N = M({}), O = M(!1), W = C(() => {
       var w;
-      return ((w = h.value.data) == null ? void 0 : w.fields) || [];
-    }), Y = b(() => {
+      return ((w = g.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 g.value.variant === "buttons" ? ((w = g.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));
+      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 B = L.split(/[\s,]+/).map(Number).filter((u) => !isNaN(u));
       return B.length >= 3 ? `${B[0]}, ${B[1]}, ${B[2]}` : null;
     }
-    function X() {
+    function Z() {
       if (n.value && _.accent) {
         const w = ie(_.accent);
         w && n.value.style.setProperty("--artifactuse-primary", w);
       }
     }
-    $e(() => {
-      X(), m.value = _.initialState;
-    }), de(() => _.accent, X), de(() => _.initialState, (w) => {
-      m.value = w;
+    Me(() => {
+      Z(), f.value = _.initialState;
+    }), de(() => _.accent, Z), de(() => _.initialState, (w) => {
+      f.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;
+      }), (r = g.value.data) != null && r.defaults && Object.assign(w, g.value.data.defaults), $.value = w;
     }
-    J(), de(() => _.artifact.code, J);
+    X(), de(() => _.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 m(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, N.value[w] && delete N.value[w];
     }
     function ee() {
       var B;
       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`));
-      }), j.value = w, Object.keys(w).length === 0;
+      const r = (B = g.value.data) == null ? void 0 : B.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`));
+      }), N.value = w, Object.keys(w).length === 0;
     }
     function re() {
-      J(), j.value = {};
+      X(), N.value = {};
     }
     function P() {
-      ee() && (q.value = !0, L("submit", {
-        formId: p.value,
+      ee() && (O.value = !0, T("submit", {
+        formId: h.value,
         action: "submit",
         values: { ...$.value },
         timestamp: Date.now()
       }), setTimeout(() => {
-        q.value = !1, S("submitted");
+        O.value = !1, E("submitted");
       }, 300));
     }
     function Q(w) {
-      const T = w.action || "custom";
-      switch (T) {
+      const L = w.action || "custom";
+      switch (L) {
         case "submit":
           P();
           break;
         case "cancel":
-          L("cancel", {
-            formId: p.value,
+          T("cancel", {
+            formId: h.value,
             action: "cancel",
             buttonName: w.name || "cancel",
             timestamp: Date.now()
           }), setTimeout(() => {
-            S("cancelled");
+            E("cancelled");
           }, 150);
           break;
         case "reset":
-          re(), L("reset", {
-            formId: p.value,
+          re(), T("reset", {
+            formId: h.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: h.value,
+            action: L,
             buttonName: w.name || w.label,
             buttonLabel: w.label,
             values: { ...$.value },
             timestamp: Date.now()
           }), setTimeout(() => {
-            S("submitted");
+            E("submitted");
           }, 150);
           break;
       }
     }
-    return (w, T) => (a(), s("div", {
+    return (w, L) => (a(), s("div", {
       ref_key: "containerRef",
       ref: n,
-      class: N([
+      class: j([
         "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", da, [
+        e("div", va, [
+          f.value === "submitted" ? (a(), s("svg", fa, [...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] = [
+          ])])) : f.value === "cancelled" ? (a(), s("svg", pa, [...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", _a, [...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", ha, l(I.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)
+        g.value.title || g.value.description ? (a(), s("div", ma, [
+          g.value.title ? (a(), s("div", ya, l(g.value.title), 1)) : v("", !0),
+          g.value.description ? (a(), s("p", ga, l(g.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,
+        g.value.variant === "buttons" ? (a(), s("div", ka, [
+          (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: j(["artifactuse-form-btn", `artifactuse-form-btn-${r.variant || "secondary"}`]),
+            disabled: r.disabled || O.value,
+            onClick: (B) => 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, ba)) : v("", !0),
+            K(" " + l(r.label), 1)
+          ], 10, wa))), 128))
         ])) : (a(), s("form", {
           key: 2,
           class: "artifactuse-form",
-          onSubmit: me(P, ["prevent"])
+          onSubmit: he(P, ["prevent"])
         }, [
-          e("div", ya, [
-            (a(!0), s(R, null, ve(W.value, (o, B) => (a(), s(R, {
-              key: o.name || B
+          e("div", Ca, [
+            (a(!0), s(R, null, ve(W.value, (r, B) => (a(), s(R, {
+              key: r.name || B
             }, [
-              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", xa, [
+                (a(!0), s(R, null, ve(r.fields || [], (u) => (a(), s("button", {
+                  key: u.name || u.label,
+                  type: u.action === "submit" ? "submit" : "button",
+                  class: j(["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", Ma)) : 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, Ta)) : v("", !0),
+                  K(" " + l(O.value && u.action === "submit" ? "Submitting..." : u.label), 1)
+                ], 10, $a))), 128))
+              ])) : r.type === "divider" ? (a(), s("div", La)) : r.type === "heading" ? (a(), s("div", Pa, l(r.label), 1)) : r.type === "checkbox" ? (a(), s("div", Aa, [
+                e("label", Ha, [
                   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, Ea),
+                  e("span", Ba, [
+                    K(l(r.label) + " ", 1),
+                    r.required ? (a(), s("span", Sa, "*")) : 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", za, l(r.helpText), 1)) : v("", !0),
+                N.value[r.name] ? (a(), s("span", Va, l(N.value[r.name]), 1)) : v("", !0)
+              ])) : (a(), s("div", Ia, [
                 e("label", {
-                  for: `${p.value}-${o.name}`,
+                  for: `${h.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(l(r.label) + " ", 1),
+                  r.required ? (a(), s("span", Ra, "*")) : 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: `${h.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, qa)) : 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: `${h.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, Oa)) : r.type === "select" ? (a(), s("select", {
                   key: 2,
-                  id: `${p.value}-${o.name}`,
-                  value: $.value[o.name],
-                  disabled: o.disabled,
-                  required: o.required,
+                  id: `${h.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", Da, l(r.placeholder || "Select..."), 1),
+                  (a(!0), s(R, null, ve(m(r.options), (u) => (a(), s("option", {
+                    key: u.value,
+                    value: u.value,
+                    disabled: u.disabled
+                  }, l(u.label), 9, Na))), 128))
+                ], 40, Ua)) : r.type === "radio" ? (a(), s("div", ja, [
+                  (a(!0), s(R, null, ve(m(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, Wa),
+                    e("span", null, l(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", Ja, l(r.helpText), 1)) : v("", !0),
+                N.value[r.name] ? (a(), s("span", Xa, l(N.value[r.name]), 1)) : v("", !0)
               ]))
             ], 64))), 128))
           ]),
-          E.value ? v("", !0) : (a(), s("div", ja, [
+          S.value ? v("", !0) : (a(), s("div", Za, [
             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", Ya)) : v("", !0),
+              K(" " + l(O.value ? "Submitting..." : "Submit"), 1)
+            ], 8, Ka)
           ]))
         ], 32))
       ], 64))
-    ], 10, la));
+    ], 10, ua));
   }
-}, 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 = {
+}, Ga = ["data-artifactuse-theme"], es = { class: "artifactuse-social-header" }, ts = ["src", "alt"], as = { class: "artifactuse-social-author" }, ss = { class: "artifactuse-social-author-name" }, is = { class: "artifactuse-social-author-meta" }, ls = { class: "artifactuse-social-author-handle" }, ns = { class: "artifactuse-social-timestamp" }, os = { class: "artifactuse-social-content" }, rs = ["innerHTML"], cs = {
   key: 0,
   class: "artifactuse-social-media"
-}, ls = ["data-count"], ns = ["src", "alt"], os = {
+}, us = ["data-count"], ds = ["src", "alt"], vs = {
   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 = {
+}, fs = ["src", "alt"], ps = { class: "artifactuse-social-link-info" }, _s = { class: "artifactuse-social-link-domain" }, hs = { class: "artifactuse-social-link-title" }, ms = {
   key: 0,
   class: "artifactuse-social-link-description"
-}, fs = {
+}, ys = {
   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 = {
+}, gs = { class: "artifactuse-social-poll-label" }, ks = { class: "artifactuse-social-poll-label-percent" }, ws = { class: "artifactuse-social-poll-meta" }, bs = {
   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 = {
+}, Cs = { class: "artifactuse-social-quote-header" }, xs = ["src"], $s = { class: "artifactuse-social-quote-author" }, Ms = { class: "artifactuse-social-quote-handle" }, Ts = { class: "artifactuse-social-quote-text" }, Ls = {
   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 = {
+}, Ps = { class: "artifactuse-social-stat" }, As = { class: "artifactuse-social-stat" }, Hs = { class: "artifactuse-social-stat" }, Es = { class: "artifactuse-social-stat" }, Bs = { class: "artifactuse-social-header" }, Ss = ["src", "alt"], zs = { class: "artifactuse-social-author-info" }, Vs = { 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" }, Rs = { class: "artifactuse-social-timestamp" }, qs = { class: "artifactuse-social-content" }, Os = ["innerHTML"], Us = {
   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 = {
+}, Ds = ["src", "alt"], Ns = { class: "artifactuse-social-link-info" }, js = { class: "artifactuse-social-link-title" }, Ws = { class: "artifactuse-social-link-domain" }, Js = {
   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 = {
+}, Xs = { class: "artifactuse-social-reactions" }, Zs = { class: "artifactuse-social-header" }, Ks = ["src", "alt"], Ys = { class: "artifactuse-social-author-name" }, Qs = {
   key: 0,
   class: "artifactuse-social-verified",
   viewBox: "0 0 24 24",
   fill: "currentColor"
-}, Xs = {
+}, Gs = {
   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 = {
+}, ei = ["src", "alt"], ti = { class: "artifactuse-social-likes" }, ai = { class: "artifactuse-social-caption" }, si = { class: "artifactuse-social-caption-author" }, ii = ["innerHTML"], li = { class: "artifactuse-social-timestamp" }, ni = { class: "artifactuse-social-header" }, oi = ["src", "alt"], ri = { class: "artifactuse-social-author-info" }, ci = { class: "artifactuse-social-author-name" }, ui = { class: "artifactuse-social-timestamp" }, di = { class: "artifactuse-social-content" }, vi = ["innerHTML"], fi = {
   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 = {
+}, pi = ["src", "alt"], _i = { class: "artifactuse-social-link-info" }, hi = { class: "artifactuse-social-link-domain" }, mi = { class: "artifactuse-social-link-title" }, yi = {
   key: 0,
   class: "artifactuse-social-link-description"
-}, pi = {
+}, gi = {
   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 = {
+}, ki = { class: "artifactuse-social-reactions" }, wi = { class: "artifactuse-social-reaction-count" }, bi = { class: "artifactuse-social-comments-shares" }, Ci = { class: "artifactuse-social-header" }, xi = ["src", "alt"], $i = { class: "artifactuse-social-author-info" }, Mi = { class: "artifactuse-social-author-name" }, Ti = {
   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 = {
+}, Li = { class: "artifactuse-social-timestamp" }, Pi = { class: "artifactuse-social-content" }, Ai = ["innerHTML"], Hi = {
   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 = {
+}, Ei = { class: "artifactuse-social-stat" }, Bi = { class: "artifactuse-social-stat" }, Si = { class: "artifactuse-social-stat" }, zi = { class: "artifactuse-social-thumbnail" }, Vi = ["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" }, Ri = { class: "artifactuse-social-header" }, qi = ["src", "alt"], Oi = { class: "artifactuse-social-author-name" }, Ui = ["innerHTML"], Di = {
   key: 0,
   class: "artifactuse-social-sound"
-}, Ri = {
+}, Ni = {
   key: 1,
   class: "artifactuse-social-engagement"
-}, qi = { class: "artifactuse-social-thumbnail" }, Oi = ["src", "alt"], Ui = {
+}, ji = { class: "artifactuse-social-thumbnail" }, Wi = ["src", "alt"], Ji = {
   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 = {
+}, Xi = { class: "artifactuse-social-info" }, Zi = ["src", "alt"], Ki = { class: "artifactuse-social-title" }, Yi = { class: "artifactuse-social-channel" }, Qi = { class: "artifactuse-social-meta" }, Gi = { class: "artifactuse-social-actions-bar" }, el = { 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>', tl = {
   __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, T = c, f = M(null), o = M("Copy"), q = C(() => {
       try {
         return JSON.parse(_.artifact.code);
       } catch {
         return { platform: "twitter", data: {} };
       }
-    }), S = b(() => {
-      var f;
-      return ((f = V.value) == null ? void 0 : f.platform) || "twitter";
+    }), E = C(() => {
+      var m;
+      return ((m = q.value) == null ? void 0 : m.platform) || "twitter";
     });
-    b(() => {
-      var f;
-      return ((f = V.value) == null ? void 0 : f.variant) || "post";
+    C(() => {
+      var m;
+      return ((m = q.value) == null ? void 0 : m.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 g = C(() => {
+      var m, k;
+      return ((k = (m = q.value) == null ? void 0 : m.data) == null ? void 0 : k.author) || {};
+    }), n = C(() => {
+      var m, k;
+      return ((k = (m = q.value) == null ? void 0 : m.data) == null ? void 0 : k.content) || {};
+    }), h = C(() => {
+      var m, k;
+      return ((k = (m = q.value) == null ? void 0 : m.data) == null ? void 0 : k.engagement) || {};
+    }), x = C(() => {
+      var m, k;
+      return ((k = (m = q.value) == null ? void 0 : m.data) == null ? void 0 : k.meta) || {};
+    }), I = C(() => {
+      const m = h.value;
+      return m.likes || m.comments || m.shares || m.retweets || m.replies || m.views;
+    }), $ = C(() => `artifactuse-social-verified-${g.value.verifiedType || "blue"}`), N = 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 = {
+    })[E.value] || E.value), O = C(() => {
+      const m = {
         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,103 +687,103 @@ 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 m[E.value] || m.twitter;
+    }), W = C(() => {
+      let m = n.value.text || "";
+      return m = m.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), m = m.replace(/#(\w+)/g, '<span class="artifactuse-social-hashtag">#$1</span>'), m = m.replace(/@(\w+)/g, '<span class="artifactuse-social-mention">@$1</span>'), m = m.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;
+      ), m;
+    }), Y = C(() => {
+      const m = h.value.reactions || {};
+      return Object.values(m).reduce((k, ee) => k + (ee || 0), 0) || h.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(m) {
+      return m ? m >= 1e6 ? `${(m / 1e6).toFixed(1)}M` : m >= 1e3 ? `${(m / 1e3).toFixed(1)}K` : m.toString() : "0";
     }
-    function ie(f) {
+    function ie(m) {
       try {
-        return new URL(f).hostname.replace("www.", "");
+        return new URL(m).hostname.replace("www.", "");
       } catch {
-        return f;
+        return m;
       }
     }
-    function X(f) {
-      f.target.src = he;
+    function Z(m) {
+      m.target.src = _e;
     }
-    function J(f) {
-      f.target.style.display = "none";
+    function X(m) {
+      m.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 m = n.value.text || "";
+      navigator.clipboard.writeText(m).then(() => {
+        o.value = "Copied!", setTimeout(() => {
+          o.value = "Copy";
+        }, 2e3), T("copy", { platform: E.value, text: m });
       });
     }
-    return (f, k) => {
-      var ee, re, P, Q, w, T;
+    return (m, k) => {
+      var ee, re, P, Q, w, L;
       return a(), s("div", {
         ref_key: "containerRef",
-        ref: m,
-        class: N(["artifactuse-social", [`artifactuse-social-${S.value}`]]),
+        ref: f,
+        class: j(["artifactuse-social", [`artifactuse-social-${E.value}`]]),
         "data-artifactuse-theme": H.theme
       }, [
-        S.value === "twitter" ? (a(), s(R, { key: 0 }, [
-          e("div", Za, [
+        E.value === "twitter" ? (a(), s(R, { key: 0 }, [
+          e("div", es, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: g.value.avatar || _e,
+              alt: g.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, ts),
+            e("div", as, [
+              e("div", ss, [
+                e("span", null, l(g.value.name), 1),
+                g.value.verified ? (a(), s("svg", {
                   key: 0,
-                  class: N(["artifactuse-social-verified", $.value]),
+                  class: j(["artifactuse-social-verified", $.value]),
                   viewBox: "0 0 24 24",
                   fill: "currentColor"
                 }, [...k[0] || (k[0] = [
                   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", is, [
+                e("span", ls, l(g.value.handle), 1),
+                e("span", ns, "· " + l(x.value.timestamp || "Just now"), 1)
               ])
             ])
           ]),
-          e("div", as, [
+          e("div", os, [
             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, rs),
+            (ee = n.value.media) != null && ee.length ? (a(), s("div", cs, [
               e("div", {
-                class: N(["artifactuse-social-media-grid", { "artifactuse-social-media-single": n.value.media.length === 1 }]),
+                class: j(["artifactuse-social-media-grid", { "artifactuse-social-media-single": n.value.media.length === 1 }]),
                 "data-count": n.value.media.length
               }, [
-                (a(!0), s(R, null, ve(n.value.media.slice(0, 4), (o, B) => (a(), s("img", {
+                (a(!0), s(R, null, ve(n.value.media.slice(0, 4), (r, B) => (a(), s("img", {
                   key: B,
-                  src: o.url,
-                  alt: o.alt || "",
-                  onError: J
-                }, null, 40, ns))), 128))
-              ], 10, ls)
+                  src: r.url,
+                  alt: r.alt || "",
+                  onError: X
+                }, null, 40, ds))), 128))
+              ], 10, us)
             ])) : v("", !0),
-            n.value.link && !((re = n.value.media) != null && re.length) ? (a(), s("div", os, [
+            n.value.link && !((re = n.value.media) != null && re.length) ? (a(), s("div", vs, [
               n.value.link.image ? (a(), s("img", {
                 key: 0,
                 src: n.value.link.image,
                 alt: n.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, fs)) : v("", !0),
+              e("div", ps, [
+                e("div", _s, [
                   k[1] || (k[1] = e("svg", {
                     fill: "none",
                     viewBox: "0 0 24 24",
@@ -798,43 +798,43 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   ], -1)),
                   K(" " + l(n.value.link.domain || ie(n.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", hs, l(n.value.link.title), 1),
+                n.value.link.description ? (a(), s("div", ms, l(n.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;
+            n.value.poll ? (a(), s("div", ys, [
+              (a(!0), s(R, null, ve(n.value.poll.options, (r, B) => {
+                var u, z;
                 return a(), s("div", {
                   key: B,
                   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: He({ width: `${((u = n.value.poll.votes) == null ? void 0 : u[B]) || 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", gs, [
+                    e("span", null, l(r), 1),
+                    e("span", ks, l(((z = n.value.poll.votes) == null ? void 0 : z[B]) || 0) + "%", 1)
                   ])
                 ]);
               }), 128)),
-              e("div", _s, l(E(n.value.poll.totalVotes || 0)) + " votes · " + l(n.value.poll.duration || "Poll ended"), 1)
+              e("div", ws, l(S(n.value.poll.totalVotes || 0)) + " votes · " + l(n.value.poll.duration || "Poll ended"), 1)
             ])) : v("", !0),
-            n.value.quote ? (a(), s("div", ms, [
-              e("div", ys, [
+            n.value.quote ? (a(), s("div", bs, [
+              e("div", Cs, [
                 e("img", {
-                  src: ((P = n.value.quote.author) == null ? void 0 : P.avatar) || he,
+                  src: ((P = n.value.quote.author) == null ? void 0 : P.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, xs),
+                e("span", $s, l((Q = n.value.quote.author) == null ? void 0 : Q.name), 1),
+                e("span", Ms, l((w = n.value.quote.author) == null ? void 0 : w.handle), 1)
               ]),
-              e("p", Cs, l(n.value.quote.text), 1)
+              e("p", Ts, l(n.value.quote.text), 1)
             ])) : v("", !0)
           ]),
-          F.value ? (a(), s("div", bs, [
-            e("div", xs, [
+          I.value ? (a(), s("div", Ls, [
+            e("div", Ps, [
               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, l(S(h.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, l(S(h.value.retweets || 0)), 1)
             ]),
-            e("div", Ms, [
+            e("div", Hs, [
               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, l(S(h.value.likes || 0)), 1)
             ]),
-            e("div", Ls, [
+            e("div", Es, [
               k[5] || (k[5] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "none",
@@ -876,24 +876,24 @@ 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, l(S(h.value.views || 0)), 1)
             ])
           ])) : v("", !0)
-        ], 64)) : S.value === "linkedin" ? (a(), s(R, { key: 1 }, [
-          e("div", Ts, [
+        ], 64)) : E.value === "linkedin" ? (a(), s(R, { key: 1 }, [
+          e("div", Bs, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: g.value.avatar || _e,
+              alt: g.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, Ss),
+            e("div", zs, [
+              e("div", Vs, [
+                K(l(g.value.name) + " ", 1),
+                g.value.connection ? (a(), s("span", Is, "· " + l(g.value.connection), 1)) : v("", !0)
               ]),
-              e("div", Bs, l(h.value.headline), 1),
-              e("div", Es, [
+              e("div", Fs, l(g.value.headline), 1),
+              e("div", Rs, [
                 K(l(x.value.timestamp || "Just now") + " · ", 1),
                 k[6] || (k[6] = e("svg", {
                   viewBox: "0 0 24 24",
@@ -904,79 +904,79 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ])
             ])
           ]),
-          e("div", zs, [
+          e("div", qs, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, Is),
-            n.value.link ? (a(), s("div", Fs, [
+            }, null, 8, Os),
+            n.value.link ? (a(), s("div", Us, [
               n.value.link.image ? (a(), s("img", {
                 key: 0,
                 src: n.value.link.image,
                 alt: n.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, Ds)) : v("", !0),
+              e("div", Ns, [
+                e("div", js, l(n.value.link.title), 1),
+                e("div", Ws, l(n.value.link.domain || ie(n.value.link.url)), 1)
               ])
             ])) : v("", !0)
           ]),
-          F.value ? (a(), s("div", Us, [
-            e("div", Ds, [
+          I.value ? (a(), s("div", Js, [
+            e("div", Xs, [
               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, l(S(h.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, l(S(h.value.comments || 0)) + " comments · " + l(S(h.value.shares || 0)) + " shares", 1)
           ])) : v("", !0)
-        ], 64)) : S.value === "instagram" ? (a(), s(R, { key: 2 }, [
-          e("div", js, [
+        ], 64)) : E.value === "instagram" ? (a(), s(R, { key: 2 }, [
+          e("div", Zs, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: g.value.avatar || _e,
+              alt: g.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, Ks),
+            e("div", Ys, [
+              K(l(g.value.name) + " ", 1),
+              g.value.verified ? (a(), s("svg", Qs, [...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 = n.value.media) != null && L.length ? (a(), s("div", Gs, [
             e("img", {
               src: n.value.media[0].url,
               alt: n.value.media[0].alt || "",
-              onError: J
-            }, null, 40, Zs)
+              onError: X
+            }, null, 40, ei)
           ])) : 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] = Ot('<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", ti, l(S(h.value.likes || 0)) + " likes", 1),
+          e("div", ai, [
+            e("span", si, l(g.value.name), 1),
             e("span", {
               class: "artifactuse-social-caption-text",
               innerHTML: W.value
-            }, null, 8, Gs)
+            }, null, 8, ii)
           ]),
-          e("div", ei, l(x.value.timestamp || "Just now"), 1)
-        ], 64)) : S.value === "facebook" ? (a(), s(R, { key: 3 }, [
-          e("div", ti, [
+          e("div", li, l(x.value.timestamp || "Just now"), 1)
+        ], 64)) : E.value === "facebook" ? (a(), s(R, { key: 3 }, [
+          e("div", ni, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: g.value.avatar || _e,
+              alt: g.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, [
+              onError: Z
+            }, null, 40, oi),
+            e("div", ri, [
+              e("div", ci, l(g.value.name), 1),
+              e("div", ui, [
                 K(l(x.value.timestamp || "Just now") + " · ", 1),
                 k[10] || (k[10] = e("svg", {
                   viewBox: "0 0 24 24",
@@ -987,63 +987,63 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ])
             ])
           ]),
-          e("div", ni, [
+          e("div", di, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, oi),
-            n.value.link ? (a(), s("div", ri, [
+            }, null, 8, vi),
+            n.value.link ? (a(), s("div", fi, [
               n.value.link.image ? (a(), s("img", {
                 key: 0,
                 src: n.value.link.image,
                 alt: n.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, pi)) : v("", !0),
+              e("div", _i, [
+                e("div", hi, l(n.value.link.domain || ie(n.value.link.url)), 1),
+                e("div", mi, l(n.value.link.title), 1),
+                n.value.link.description ? (a(), s("div", yi, l(n.value.link.description), 1)) : v("", !0)
               ])
             ])) : v("", !0)
           ]),
-          F.value ? (a(), s("div", pi, [
-            e("div", hi, [
+          I.value ? (a(), s("div", gi, [
+            e("div", ki, [
               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", wi, l(S(Y.value)), 1)
             ]),
-            e("span", mi, l(E(p.value.comments || 0)) + " comments · " + l(E(p.value.shares || 0)) + " shares", 1)
+            e("span", bi, l(S(h.value.comments || 0)) + " comments · " + l(S(h.value.shares || 0)) + " shares", 1)
           ])) : v("", !0)
-        ], 64)) : S.value === "threads" ? (a(), s(R, { key: 4 }, [
-          e("div", yi, [
+        ], 64)) : E.value === "threads" ? (a(), s(R, { key: 4 }, [
+          e("div", Ci, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: g.value.avatar || _e,
+              alt: g.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, xi),
+            e("div", $i, [
+              e("div", Mi, [
+                K(l(g.value.name) + " ", 1),
+                g.value.verified ? (a(), s("svg", Ti, [...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", Li, l(x.value.timestamp || "Just now"), 1)
             ])
           ]),
-          e("div", xi, [
+          e("div", Pi, [
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, $i)
+            }, null, 8, Ai)
           ]),
-          F.value ? (a(), s("div", Mi, [
-            e("div", Li, [
+          I.value ? (a(), s("div", Hi, [
+            e("div", Ei, [
               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, l(S(h.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, l(S(h.value.comments || 0)), 1)
             ]),
-            e("div", Pi, [
+            e("div", Si, [
               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, l(S(h.value.shares || 0)), 1)
             ])
           ])) : v("", !0)
-        ], 64)) : S.value === "tiktok" ? (a(), s(R, { key: 5 }, [
-          e("div", Ai, [
+        ], 64)) : E.value === "tiktok" ? (a(), s(R, { key: 5 }, [
+          e("div", zi, [
             n.value.thumbnail ? (a(), s("img", {
               key: 0,
               src: n.value.thumbnail,
               alt: n.value.text,
-              onError: J
-            }, null, 40, Hi)) : v("", !0),
+              onError: X
+            }, null, 40, Vi)) : v("", !0),
             k[16] || (k[16] = e("div", { class: "artifactuse-social-play-button" }, [
               e("div", { class: "artifactuse-social-play-icon" }, [
                 e("svg", {
@@ -1095,23 +1095,23 @@ 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)
+            n.value.duration ? (a(), s("div", Ii, l(n.value.duration), 1)) : v("", !0)
           ]),
-          e("div", Bi, [
-            e("div", Ei, [
+          e("div", Fi, [
+            e("div", Ri, [
               e("img", {
-                src: h.value.avatar || he,
-                alt: h.value.name,
+                src: g.value.avatar || _e,
+                alt: g.value.name,
                 class: "artifactuse-social-avatar",
-                onError: X
-              }, null, 40, zi),
-              e("span", Ii, l(h.value.name), 1)
+                onError: Z
+              }, null, 40, qi),
+              e("span", Oi, l(g.value.name), 1)
             ]),
             e("p", {
               class: "artifactuse-social-text",
               innerHTML: W.value
-            }, null, 8, Fi),
-            n.value.sound ? (a(), s("div", Vi, [
+            }, null, 8, Ui),
+            n.value.sound ? (a(), s("div", Di, [
               k[17] || (k[17] = e("svg", {
                 viewBox: "0 0 24 24",
                 fill: "currentColor"
@@ -1120,40 +1120,40 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
               ], -1)),
               K(" " + l(n.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)
+            I.value ? (a(), s("div", Ni, [
+              e("span", null, l(S(h.value.likes || 0)) + " likes", 1),
+              e("span", null, l(S(h.value.comments || 0)) + " comments", 1),
+              e("span", null, l(S(h.value.shares || 0)) + " shares", 1)
             ])) : v("", !0)
           ])
-        ], 64)) : S.value === "youtube" ? (a(), s(R, { key: 6 }, [
-          e("div", qi, [
+        ], 64)) : E.value === "youtube" ? (a(), s(R, { key: 6 }, [
+          e("div", ji, [
             n.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)
+              onError: X
+            }, null, 40, Wi)) : v("", !0),
+            n.value.duration ? (a(), s("div", Ji, l(n.value.duration), 1)) : v("", !0)
           ]),
-          e("div", Di, [
+          e("div", Xi, [
             e("img", {
-              src: h.value.avatar || he,
-              alt: h.value.name,
+              src: g.value.avatar || _e,
+              alt: g.value.name,
               class: "artifactuse-social-avatar",
-              onError: X
-            }, null, 40, ji),
+              onError: Z
+            }, null, 40, Zi),
             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", Ki, l(n.value.title || n.value.text), 1),
+              e("div", Yi, l(g.value.name), 1),
+              e("div", Qi, l(S(h.value.views || 0)) + " views · " + l(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", Gi, [
+          e("div", el, [
+            (a(), $e(Ut(O.value))),
+            e("span", null, l(N.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(" " + l(o.value), 1)
           ])
         ])
-      ], 10, Xa);
+      ], 10, Ga);
     };
   }
-}, Yi = ["src", "alt"], Qi = ["src"], Gi = {
+}, al = ["src", "alt"], sl = ["src"], il = {
   key: 2,
   class: "artifactuse-viewer-controls"
-}, el = ["title"], tl = {
+}, ll = ["title"], nl = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, al = {
+}, ol = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, sl = {
+}, rl = {
   key: 3,
   class: "artifactuse-viewer-caption"
-}, il = {
+}, cl = {
   __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, T = c, f = M(null), o = M(!1);
+    function q() {
+      o.value = !1, T("close");
     }
-    function S() {
-      _.type === "image" && (r.value = !r.value);
+    function E() {
+      _.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 g() {
+      const h = document.createElement("a");
+      h.href = _.src, h.download = _.alt || "download", document.body.appendChild(h), h.click(), document.body.removeChild(h);
     }
-    function n(p) {
-      p.key === "Escape" && _.isOpen && V();
+    function n(h) {
+      h.key === "Escape" && _.isOpen && q();
     }
-    return de(() => _.isOpen, (p) => {
-      p ? (be(() => {
+    return de(() => _.isOpen, (h) => {
+      h ? (xe(() => {
         var x;
-        (x = m.value) == null || x.focus();
-      }), document.body.style.overflow = "hidden") : (document.body.style.overflow = "", r.value = !1);
-    }), $e(() => {
+        (x = f.value) == null || x.focus();
+      }), document.body.style.overflow = "hidden") : (document.body.style.overflow = "", o.value = !1);
+    }), Me(() => {
       document.addEventListener("keydown", n);
-    }), De(() => {
+    }), We(() => {
       document.removeEventListener("keydown", n), document.body.style.overflow = "";
-    }), (p, x) => (a(), xe(Vt, { to: "body" }, [
-      Be(Ae, { name: "artifactuse-viewer" }, {
-        default: He(() => [
+    }), (h, x) => (a(), $e(Dt, { to: "body" }, [
+      ze(Ee, { 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: Nt(q, ["escape"]),
             tabindex: "-1",
             ref_key: "overlayRef",
-            ref: m
+            ref: f
           }, [
             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: j(["artifactuse-viewer-image", { "artifactuse-viewer-image--zoomed": o.value }]),
+                onClick: E
+              }, null, 10, al)) : H.type === "pdf" ? (a(), s("iframe", {
                 key: 1,
                 src: H.src,
                 class: "artifactuse-viewer-pdf"
-              }, null, 8, Qi)) : v("", !0),
+              }, null, 8, sl)) : 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", il, [
                 e("button", {
                   class: "artifactuse-viewer-control",
-                  onClick: me(S, ["stop"]),
-                  title: r.value ? "Zoom out" : "Zoom in"
+                  onClick: he(E, ["stop"]),
+                  title: o.value ? "Zoom out" : "Zoom in"
                 }, [
-                  r.value ? (a(), s("svg", al, [...x[3] || (x[3] = [
+                  o.value ? (a(), s("svg", ol, [...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", nl, [...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, ll),
                 e("button", {
                   class: "artifactuse-viewer-control",
-                  onClick: me(h, ["stop"]),
+                  onClick: he(g, ["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", rl, l(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 = {
+}, ul = ["innerHTML"], co = {
   __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,
+  setup(H, { expose: c, emit: _ }) {
+    const T = H, f = _, {
+      processMessage: o,
+      openArtifact: q,
+      state: E,
+      getTheme: g,
       instance: n
-    } = Ee(), p = 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);
-    $e(() => {
-      L.typing && (f.value = !0);
-    }), de(() => L.typing, (C) => {
-      C && (f.value = !0);
+    } = Ve(), h = M(null), x = M(null), I = M(""), $ = M([]);
+    let N = null;
+    const O = M(!1), W = M("image"), Y = M(""), S = M(""), ie = M(""), Z = C(() => (g == null ? void 0 : g()) || "dark"), X = C(() => E.activeArtifactId), oe = C(() => {
+      var b;
+      return T.inlineCards ?? ((b = n == null ? void 0 : n.config) == null ? void 0 : b.inlineCards) ?? !0;
+    }), m = M(!1);
+    Me(() => {
+      T.typing && (m.value = !0);
+    }), de(() => T.typing, (b) => {
+      b && (m.value = !0);
     });
-    const k = b(() => f.value || L.isLastMessage ? "active" : "inactive");
-    function ee(C) {
-      if (!C) return null;
+    const k = C(() => m.value || T.isLastMessage ? "active" : "inactive");
+    function ee(b) {
+      if (!b) return null;
       try {
-        const I = decodeURIComponent(escape(atob(C)));
-        return JSON.parse(I);
+        const V = decodeURIComponent(escape(atob(b)));
+        return JSON.parse(V);
       } 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,94 +1481,94 @@ 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 = [], V = I.value;
+      if (!V) 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; ) {
+      for (; (A = D.exec(V)) !== null; ) {
         if (A.index > te) {
-          const O = I.slice(te, A.index);
-          O.trim() && C.push({ type: "html", content: O });
+          const U = V.slice(te, A.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(A[3]), d = A[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 = A.index + A[0].length;
       }
-      if (te < I.length) {
-        const ae = I.slice(te);
-        ae.trim() && C.push({ type: "html", content: ae });
+      if (te < V.length) {
+        const ae = V.slice(te);
+        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 && V.trim() && b.push({ type: "html", content: V }), 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 P(b) {
+      W.value = b.type || "image", Y.value = b.src || "", S.value = b.alt || "", ie.value = b.caption || "", O.value = !0, f("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(), P({
             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 || "";
+        }, 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 || "";
           P({
             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 || "";
+        }, 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 || "";
           P({
             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(), P({
             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) => {
+        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(), P({
             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);
@@ -1580,81 +1580,81 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
         A._clickHandler && (A.removeEventListener("click", A._clickHandler), delete A._clickHandler);
       });
     }
-    function o() {
-      j && clearTimeout(j), j = setTimeout(async () => {
-        if (await be(), n != null && n.initializeContent && x.value)
+    function r() {
+      N && clearTimeout(N), N = setTimeout(async () => {
+        if (await xe(), n != null && n.initializeContent && x.value)
           try {
             await n.initializeContent(x.value);
-          } catch (C) {
-            console.error("Failed to initialize content:", C);
+          } 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 V = 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();
+          I.value = V.html, $.value = V.artifacts, V.artifacts.length > 0 && f("artifact-detected", V.artifacts), T.typing || r();
         }
       },
       { immediate: !0 }
     ), de(
-      () => L.typing,
-      (C, I) => {
-        I === !0 && C === !1 && o();
+      () => T.typing,
+      (b, V) => {
+        V === !0 && b === !1 && r();
       }
-    ), $e(() => {
-      L.typing || o();
-    }), qt(() => {
-      j && clearTimeout(j), T();
+    ), Me(() => {
+      T.typing || r();
+    }), jt(() => {
+      N && clearTimeout(N), L();
     });
-    function B(C) {
-      const I = C.target.closest(".artifactuse-inline-preview");
-      if (I) {
-        if (I.dataset.nonClickable) return;
-        const D = I.dataset.artifactId;
+    function B(b) {
+      const V = b.target.closest(".artifactuse-inline-preview");
+      if (V) {
+        if (V.dataset.nonClickable) return;
+        const D = V.dataset.artifactId;
         if (D) {
-          const te = S.artifacts.find((A) => A.id === D);
-          te && c(te);
+          const te = E.artifacts.find((A) => A.id === D);
+          te && u(te);
         }
       }
     }
-    function c(C) {
-      V(C), m("artifact-open", C);
+    function u(b) {
+      q(b), f("artifact-open", b);
     }
-    function z(C) {
-      m("artifact-copy", C);
+    function z(b) {
+      f("artifact-copy", b);
     }
-    function le(C) {
-      m("artifact-download", C);
+    function le(b) {
+      f("artifact-download", b);
     }
-    function pe(C) {
-      m("form-submit", C);
+    function pe(b) {
+      f("form-submit", b);
     }
-    function ye(C) {
-      m("form-cancel", C);
+    function ye(b) {
+      f("form-cancel", b);
     }
-    function fe(C) {
-      m("form-button-click", C);
+    function fe(b) {
+      f("form-button-click", b);
     }
-    function Le(C) {
-      m("social-copy", C);
+    function Pe(b) {
+      f("social-copy", b);
     }
-    return b(() => S.artifacts.filter((C) => C.messageId === L.messageId)), d({
+    return C(() => E.artifacts.filter((b) => b.messageId === T.messageId)), c({
       openViewer: P,
       closeViewer: Q,
       attachMediaListeners: w
-    }), (C, I) => (a(), s("div", {
+    }), (b, V) => (a(), s("div", {
       class: "artifactuse-agent-message",
       ref_key: "messageRef",
-      ref: p
+      ref: h
     }, [
       e("div", {
         class: "artifactuse-message-content",
@@ -1666,311 +1666,335 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
           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, ul)) : D.type === "form" && D.artifact.isInline ? (a(), $e(Qa, {
             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(), $e(tl, {
             key: 2,
             artifact: D.artifact,
-            theme: X.value,
-            onCopy: Le
-          }, null, 8, ["artifact", "theme"])) : D.type === "panel" && oe.value ? (a(), xe(ia, {
+            theme: Z.value,
+            onCopy: Pe
+          }, null, 8, ["artifact", "theme"])) : D.type === "panel" && oe.value ? (a(), $e(ca, {
             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,
+      ze(cl, {
+        "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 = {
+}, dl = { class: "artifactuse-panel__header artifactuse-panel__header--simple" }, vl = { class: "artifactuse-panel__title" }, fl = { class: "artifactuse-panel__icon" }, pl = {
+  key: 0,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2"
+}, _l = {
+  key: 1,
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2"
+}, hl = { class: "artifactuse-panel__title-content" }, ml = { class: "artifactuse-panel__name" }, yl = { class: "artifactuse-panel__actions" }, gl = { class: "artifactuse-panel__empty" }, kl = { class: "artifactuse-panel__empty-title" }, wl = { class: "artifactuse-panel__empty-text" }, bl = { class: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, Cl = {
   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 = {
+}, xl = { class: "artifactuse-panel__header artifactuse-panel__header--simple" }, $l = { class: "artifactuse-panel__title" }, Ml = { class: "artifactuse-panel__title-content" }, Tl = { class: "artifactuse-panel__meta" }, Ll = { class: "artifactuse-panel__actions" }, Pl = ["disabled"], Al = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, ml = {
+}, Hl = {
   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 = {
+}, El = { class: "artifactuse-panel__list" }, Bl = { class: "artifactuse-panel__list-items" }, Sl = ["onClick"], zl = ["innerHTML"], Vl = { class: "artifactuse-panel__list-item-content" }, Il = { class: "artifactuse-panel__list-item-title" }, Fl = { class: "artifactuse-panel__list-item-meta" }, Rl = { class: "artifactuse-panel__footer artifactuse-panel__footer--simple" }, ql = {
   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 = {
+}, Ol = { class: "artifactuse-panel__header" }, Ul = ["title"], Dl = { class: "artifactuse-panel__title" }, Nl = ["innerHTML"], jl = { class: "artifactuse-panel__title-content" }, Wl = { class: "artifactuse-panel__name" }, Jl = { class: "artifactuse-panel__meta" }, Xl = { class: "artifactuse-panel__tabs" }, Zl = ["disabled"], Kl = ["disabled"], Yl = { class: "artifactuse-panel__actions" }, Ql = ["title"], Gl = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, Rl = {
+}, en = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, ql = {
+}, tn = {
+  key: 0,
+  class: "artifactuse-panel__file-tabs"
+}, an = { class: "artifactuse-panel__file-tabs-scroll" }, sn = ["onClick"], ln = ["innerHTML"], nn = { class: "artifactuse-panel__file-tab-title" }, on = ["onClick"], rn = {
   key: 0,
   class: "artifactuse-panel__loading"
-}, Ol = {
+}, cn = {
   key: 0,
   class: "artifactuse-panel__loading"
-}, Ul = ["src"], Dl = {
+}, un = ["src"], dn = {
   key: 2,
   class: "artifactuse-panel__no-preview"
-}, jl = { class: "artifactuse-panel__edit" }, Nl = { class: "artifactuse-panel__footer" }, Wl = { class: "artifactuse-panel__footer-left" }, Jl = {
+}, vn = { class: "artifactuse-panel__edit" }, fn = { class: "artifactuse-panel__footer" }, pn = { class: "artifactuse-panel__footer-left" }, _n = {
   key: 0,
   href: "https://artifactuse.com",
   target: "_blank",
   rel: "noopener noreferrer",
   class: "artifactuse-panel__branding"
-}, Xl = {
+}, hn = {
   key: 1,
   class: "artifactuse-panel__badge"
-}, Zl = { class: "artifactuse-panel__footer-right" }, Kl = ["title"], Yl = {
+}, mn = { class: "artifactuse-panel__footer-right" }, yn = ["title"], gn = {
   key: 0,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, Ql = {
+}, kn = {
   key: 1,
   viewBox: "0 0 24 24",
   fill: "none",
   stroke: "currentColor",
   "stroke-width": "2"
-}, Gl = {
+}, wn = {
   key: 0,
   style: { position: "relative" }
-}, en = {
+}, bn = {
   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 = {
+}, Cn = { class: "artifactuse-share-popup__header" }, xn = { class: "artifactuse-share-popup__title" }, $n = { class: "artifactuse-share-popup__body" }, Mn = {
   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 = {
+}, Tn = { key: 1 }, Ln = { class: "artifactuse-share-popup__error" }, Pn = { class: "artifactuse-share-popup__error-text" }, An = { class: "artifactuse-share-popup__actions" }, Hn = {
   key: 2,
   class: "artifactuse-share-popup__options"
-}, dn = { key: 3 }, vn = {
+}, En = { key: 3 }, Bn = {
   key: 0,
   class: "artifactuse-share-popup__loading"
-}, fn = {
+}, Sn = {
   key: 1,
   class: "artifactuse-share-popup__empty"
-}, pn = {
+}, zn = {
   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 = {
+}, Vn = ["onClick"], In = { class: "artifactuse-share-popup__artifact-name" }, Fn = { class: "artifactuse-share-popup__artifact-date" }, Rn = {
   key: 4,
   class: "artifactuse-share-popup__success"
-}, gn = { class: "artifactuse-share-popup__link-wrapper" }, kn = ["value"], wn = {
+}, qn = { class: "artifactuse-share-popup__link-wrapper" }, On = ["value"], Un = {
   key: 0,
   class: "artifactuse-share-popup__expiry"
-}, Cn = { class: "artifactuse-share-popup__expiry-text" }, bn = {
+}, Dn = { class: "artifactuse-share-popup__expiry-text" }, Nn = {
   key: 1,
   class: "artifactuse-share-popup__save-prompt"
-}, xn = {
+}, jn = {
   key: 2,
   class: "artifactuse-panel__nav"
-}, $n = ["disabled"], Mn = ["disabled"], Ln = {
+}, Wn = ["disabled"], Jn = ["disabled"], Xn = {
   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 = {
+}, Zn = { class: "artifactuse-panel__artifact-list-header" }, Kn = { class: "artifactuse-panel__artifact-list-items" }, Yn = ["onClick"], Qn = ["innerHTML"], Gn = { class: "artifactuse-panel__artifact-item-content" }, eo = { class: "artifactuse-panel__artifact-item-title" }, to = { class: "artifactuse-panel__artifact-item-meta" }, ao = { class: "artifactuse-panel__artifact-item-index" }, uo = {
   __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, {
-      state: m,
-      activeArtifact: r,
-      artifactCount: V,
-      hasArtifacts: S,
-      closePanel: h,
+  setup(H, { emit: c }) {
+    var st, it;
+    const _ = c, T = H, {
+      state: f,
+      activeArtifact: o,
+      artifactCount: q,
+      hasArtifacts: E,
+      closePanel: g,
       toggleFullscreen: n,
-      setViewMode: p,
+      setViewMode: h,
       getPanelUrl: x,
-      openArtifact: F,
+      openArtifact: I,
       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("");
+    } = Ve(), N = 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), m = M(!1), k = M(!1), ee = M(!1), re = M(!1), P = M("options"), Q = M(""), w = M(null), L = M(""), r = M(!1), B = M(!1), u = M([]), z = M(!1), le = M("");
     let pe = null, ye = null, fe = null;
-    const Le = b(() => {
+    const Pe = 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)
-    ), 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;
+    }), b = M(
+      Math.min(Math.max(T.panelWidth ?? ((st = $.config) == null ? void 0 : st.panelWidth) ?? 65, 25), 75)
+    ), V = M(
+      Math.min(Math.max(T.splitPosition ?? ((it = $.config) == null ? void 0 : it.splitPosition) ?? 50, 20), 80)
+    ), D = C(() => o.value ? Se(o.value.language) : ""), te = C(() => o.value ? `<svg viewBox="0 0 24 24" fill="currentColor">${Ne(o.value.language)}</svg>` : ""), A = 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 || !f.artifacts.length ? -1 : f.artifacts.findIndex((i) => i.id === o.value.id));
+    const ae = C(() => o.value ? Xt(o.value.language || "plaintext") : "plaintext"), d = C(() => f.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>`;
+    }), ft = C(() => !o.value && !f.forceEmptyView ? Math.min(b.value, 30) : b.value), Te = C(() => {
+      var i;
+      return ((i = $.config) == null ? void 0 : i.multiTab) === !0;
+    }), we = C(() => f.forceEmptyView), Je = C(() => Te.value ? f.openTabs.map((i) => f.artifacts.find((t) => t.id === i)).filter(Boolean) : []);
+    function Ie(i) {
+      return `<svg viewBox="0 0 24 24" fill="currentColor">${Ne(i)}</svg>`;
+    }
+    function pt(i) {
+      I(i);
     }
-    function dt() {
+    function _t(i) {
+      $.closeTab(i), f.openTabs.length === 0 && (k.value = !1);
+    }
+    function ht() {
       k.value = !1, $.state.clearActiveArtifact();
     }
-    function Ne(i) {
+    function Xe(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 p = t.language || "plaintext", F = ot() && window.Prism.languages[p], J = Zt(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], Ce = ue.slice(1), ge = F ? window.Prism.highlight(Ce, F, p) : Ce;
           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 mt() {
       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 = Xe(o.value), p = 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: p }, (F, J) => `<div>${J + 1}</div>`).join("");
       }
     }
-    function ft() {
+    function yt() {
       var i;
-      if (q.value && it() && ((i = r.value) != null && i.code)) {
-        const t = Ne(r.value);
+      if (O.value && ot() && ((i = o.value) != null && i.code)) {
+        const t = Xe(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 p = window.Prism.languages[ae.value];
+          p ? O.value.innerHTML = window.Prism.highlight(
+            o.value.code,
+            p,
             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", xe(() => {
+          gt();
         });
       }
     }
-    function pt() {
+    function gt() {
       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 F = window.getComputedStyle(i).backgroundColor;
+        F && F !== "rgba(0, 0, 0, 0)" && F !== "transparent" && (S.value.style.backgroundColor = F, Y.value.style.backgroundColor = F);
       }
     }
-    function ht() {
-      E.value && (E.value.style.backgroundColor = ""), Y.value && (Y.value.style.backgroundColor = "");
+    function kt() {
+      S.value && (S.value.style.backgroundColor = ""), Y.value && (Y.value.style.backgroundColor = "");
     }
-    function Te() {
-      be(() => {
-        vt(), ft();
+    function Ae() {
+      xe(() => {
+        mt(), yt();
       });
     }
-    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 Ze() {
+      !Pe.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 wt() {
+      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 bt() {
+      clearTimeout(ye), oe.value = !1, N.value && o.value && ($.bridge.setIframe(N.value), $.bridge.loadArtifact(o.value));
     }
-    function yt() {
+    function Ct() {
       clearTimeout(ye), oe.value = !1;
     }
-    function gt() {
+    function xt() {
       clearTimeout(ye), ye = setTimeout(() => {
         oe.value = !1;
       }, 1e3);
     }
-    async function kt() {
-      if (r.value)
+    async function $t() {
+      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 Mt() {
+      if (!o.value) return;
+      const { code: i, language: t, title: p } = o.value, F = je(t), J = `${p.toLowerCase().replace(/\s+/g, "-")}.${F}`, 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 Tt() {
+      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 Yt(), 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 Ce = je(ne.language);
+            let ge = (ne.title || "untitled").toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9-_]/g, ""), Ue = `${ge}.${Ce}`;
+            const De = t.get(Ue) || 0;
+            De > 0 && (Ue = `${ge}-${De}.${Ce}`), t.set(`${ge}.${Ce}`, De + 1), i.file(Ue, 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 p = await i.generateAsync({ type: "blob" }), J = `artifacts-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}.zip`, me = URL.createObjectURL(p), 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,57 +2002,57 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
         }
       }
     }
-    function bt() {
+    function Lt() {
       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 && (P.value = "options", Q.value = "", w.value = null, L.value = "", r.value = !1, B.value = !1, u.value = [], z.value = !1, le.value = "", re.value = !0);
     }
-    function xt() {
+    function Pt() {
       re.value = !1;
     }
-    function Je(i) {
+    function Ke(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 Ye() {
+      if (!(!o.value || !$.share)) {
+        P.value = "loading", L.value = "";
         try {
-          const i = await $.share.share(r.value);
+          const i = await $.share.share(o.value);
           Q.value = i.url, w.value = i.expiresAt, B.value = !1, P.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", P.value = "error";
         }
       }
     }
-    async function Ze() {
+    async function Qe() {
       if (ke.value)
-        Ie();
+        Re();
       else {
         P.value = "loading";
         try {
-          await $.share.openAuthPopup(), Ie();
+          await $.share.openAuthPopup(), Re();
         } catch (i) {
-          i.message === "Authentication cancelled" ? P.value = "options" : (T.value = i.message || "Authentication failed", P.value = "error");
+          i.message === "Authentication cancelled" ? P.value = "options" : (L.value = i.message || "Authentication failed", P.value = "error");
         }
       }
     }
-    async function Ie() {
-      if (!(!r.value || !$.share)) {
-        P.value = "loading", T.value = "";
+    async function Re() {
+      if (!(!o.value || !$.share)) {
+        P.value = "loading", L.value = "";
         try {
-          const i = await $.share.save(r.value);
+          const i = await $.share.save(o.value);
           Q.value = i.url, w.value = null, B.value = !0, P.value = "success";
         } catch (i) {
-          T.value = i.message || "Failed to save artifact", P.value = "error";
+          L.value = i.message || "Failed to save artifact", P.value = "error";
         }
       }
     }
-    function $t() {
-      B.value ? Ie() : Xe();
+    function At() {
+      B.value ? Re() : Ye();
     }
-    async function Mt() {
+    async function Ht() {
       var i;
       if ($.share) {
         if (!ke.value) {
@@ -2036,148 +2060,354 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
           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" ? P.value = "options" : (L.value = t.message || "Authentication failed", P.value = "error");
             return;
           }
         }
         P.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, p = await $.share.listArtifacts(t);
+          u.value = p.projects || [];
         } catch (t) {
-          T.value = t.message || "Failed to load artifacts", P.value = "error";
+          L.value = t.message || "Failed to load artifacts", P.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 Et(i) {
+      var p, F;
+      if (!o.value || !$.share) return;
+      const t = (p = i.project) == null ? void 0 : p.uuid;
       if (t) {
-        P.value = "loading", T.value = "";
+        P.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, B.value = !0, le.value = ((F = i.project) == null ? void 0 : F.name) || "Untitled", P.value = "success";
+        } catch (J) {
+          L.value = J.message || "Failed to update artifact", P.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() {
+    function St() {
       A.value && window.open(A.value, "_blank");
     }
-    function At() {
-      Y.value && E.value && (Y.value.style.transform = `translateY(-${E.value.scrollTop}px)`);
+    function zt() {
+      Y.value && S.value && (Y.value.style.transform = `translateY(-${S.value.scrollTop}px)`);
     }
-    function Ht() {
-      J.value = !J.value;
+    function Vt() {
+      X.value = !X.value;
     }
-    function Ke(i) {
-      k.value = !0, F(i), J.value = !1;
+    function Ge(i) {
+      k.value = !0, I(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 && I(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 && I(d.value[i]);
     }
-    function Ye(i) {
+    function et(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) {
-      we = {
+    let be = null;
+    function Rt(i) {
+      be = {
         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", tt), document.addEventListener("mouseup", qe), document.body.style.cursor = "ew-resize", document.body.style.userSelect = "none", document.querySelectorAll("iframe").forEach((p) => p.style.pointerEvents = "none");
     }
-    function Qe(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 });
+    function tt(i) {
+      if (!be) return;
+      const t = window.innerWidth, F = (be.startX - i.clientX) / t * 100, J = be.startWidth + F;
+      b.value = Math.min(Math.max(J, 25), 75), _("resize", { width: b.value });
     }
-    function Fe() {
-      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 });
+    function qe() {
+      const i = be !== null;
+      be = null, document.removeEventListener("mousemove", tt), document.removeEventListener("mouseup", qe), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((p) => p.style.pointerEvents = ""), i && _("resize", { width: b.value });
     }
-    let Me = null;
-    function zt(i) {
+    let Le = null;
+    function qt(i) {
       if (!W.value) return;
       const t = W.value.getBoundingClientRect();
-      Me = {
+      Le = {
         startX: i.clientX,
-        startPosition: I.value,
+        startPosition: V.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", at), document.addEventListener("mouseup", Oe), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", document.querySelectorAll("iframe").forEach((F) => F.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 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 = "");
-    }
-    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(() => {
-        j.value && i.isPreviewable && $.bridge.loadArtifact(i);
+    function at(i) {
+      if (!Le) return;
+      const p = (i.clientX - Le.contentLeft) / Le.contentWidth * 100;
+      V.value = Math.min(Math.max(p, 20), 80);
+    }
+    function Oe() {
+      Le = null, document.removeEventListener("mousemove", at), document.removeEventListener("mouseup", Oe), document.body.style.cursor = "", document.body.style.userSelect = "", document.querySelectorAll("iframe").forEach((t) => t.style.pointerEvents = "");
+    }
+    return de(o, (i, t) => {
+      i && (t && t.isPreviewable !== i.isPreviewable && (m.value = !0, setTimeout(() => {
+        m.value = !1;
+      }, 150)), (!t || i.id !== t.id) && (kt(), oe.value = !0, xt()), (!t || i.id !== t.id || i.code !== t.code) && (Ae(), f.viewMode === "edit" && (!t || i.id !== t.id ? xe(() => Ze()) : fe && fe.setCode(i.code || "")), clearTimeout(pe), pe = setTimeout(() => {
+        N.value && i.isPreviewable && $.bridge.loadArtifact(i);
       }, 500)));
-    }, { deep: !0 }), de(() => m.viewMode, (i) => {
-      (i === "code" || i === "split") && Te(), i === "edit" && be(() => We());
-    }), 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 !== 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(() => [
-        g(m).isPanelOpen ? (a(), s("div", {
+    }, { deep: !0 }), de(() => f.viewMode, (i) => {
+      (i === "code" || i === "split") && Ae(), i === "edit" && xe(() => Ze());
+    }), de(() => f.isPanelOpen, (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 && (V.value = Math.min(Math.max(i, 20), 80));
+    }), Me(() => {
+      $.on("ai:request", (i) => _("ai-request", i)), $.on("save:request", (i) => _("save", i)), $.on("export:complete", (i) => _("export", i)), document.addEventListener("click", et), f.isPanelOpen && o.value && Ae();
+    }), We(() => {
+      qe(), Oe(), Fe(), document.removeEventListener("click", et), clearTimeout(pe), clearTimeout(ye);
+    }), (i, t) => (a(), $e(Ee, { name: "artifactuse-panel" }, {
+      default: Be(() => [
+        y(f).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)
+          class: j(["artifactuse-panel", {
+            "artifactuse-panel--fullscreen": y(f).isFullscreen,
+            "artifactuse-panel--list": !y(o) && y(E) && !y(f).forceEmptyView,
+            "artifactuse-panel--empty": !y(E) && !y(f).forceEmptyView
           }]),
-          style: Pe(g(m).isFullscreen ? void 0 : { width: `${ut.value}%` })
+          style: He(y(f).isFullscreen ? void 0 : { width: `${ft.value}%` })
         }, [
-          g(m).isFullscreen ? v("", !0) : (a(), s("div", {
+          y(f).isFullscreen ? v("", !0) : (a(), s("div", {
             key: 0,
             class: "artifactuse-panel__resize-handle",
-            onMousedown: me(Et, ["prevent"])
+            onMousedown: he(Rt, ["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", {
+          !y(E) || we.value ? (a(), s(R, { key: 1 }, [
+            e("header", dl, [
+              e("div", vl, [
+                e("span", fl, [
+                  we.value ? (a(), s("svg", pl, [...t[13] || (t[13] = [
+                    e("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }, null, -1),
+                    e("polyline", { points: "14 2 14 8 20 8" }, null, -1)
+                  ])])) : (a(), s("svg", _l, [...t[14] || (t[14] = [
+                    e("polyline", { points: "16 18 22 12 16 6" }, null, -1),
+                    e("polyline", { points: "8 6 2 12 8 18" }, null, -1)
+                  ])]))
+                ]),
+                e("div", hl, [
+                  e("span", ml, l(we.value ? "Artifact Viewer" : "Artifacts"), 1)
+                ])
+              ]),
+              e("div", yl, [
+                e("button", {
+                  class: "artifactuse-panel__action artifactuse-panel__action--close",
+                  title: "Close panel",
+                  onClick: t[0] || (t[0] = (...p) => y(g) && y(g)(...p))
+                }, [...t[15] || (t[15] = [
+                  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)
+                ])])
+              ])
+            ]),
+            e("div", gl, [
+              t[16] || (t[16] = e("div", { class: "artifactuse-panel__empty-icon" }, [
+                e("svg", {
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  "stroke-width": "1.5"
+                }, [
+                  e("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }),
+                  e("polyline", { points: "14 2 14 8 20 8" })
+                ])
+              ], -1)),
+              e("h3", kl, l(we.value ? "No artifact selected" : "No artifacts yet"), 1),
+              e("p", wl, l(we.value ? "Open an artifact to have it appear here" : "Code blocks, forms, and other interactive content will appear here as the AI generates them."), 1)
+            ]),
+            e("footer", bl, [
+              G.value ? (a(), s("a", Cl, [...t[17] || (t[17] = [
+                e("svg", {
+                  width: "16",
+                  height: "16",
+                  viewBox: "0 0 42 42",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg"
+                }, [
+                  e("path", {
+                    d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0",
+                    fill: "#5F51C8"
+                  }),
+                  e("path", {
+                    d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z",
+                    fill: "#695AE0"
+                  })
+                ], -1),
+                e("span", null, "Artifactuse", -1)
+              ])])) : v("", !0)
+            ])
+          ], 64)) : !y(o) && !we.value ? (a(), s(R, { key: 2 }, [
+            e("header", xl, [
+              e("div", $l, [
+                t[19] || (t[19] = e("span", { class: "artifactuse-panel__icon" }, [
+                  e("svg", {
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    "stroke-width": "2"
+                  }, [
+                    e("polyline", { points: "16 18 22 12 16 6" }),
+                    e("polyline", { points: "8 6 2 12 8 18" })
+                  ])
+                ], -1)),
+                e("div", Ml, [
+                  t[18] || (t[18] = e("span", { class: "artifactuse-panel__name" }, "Artifacts", -1)),
+                  e("span", Tl, l(d.value.length) + " available", 1)
+                ])
+              ]),
+              e("div", Ll, [
+                e("button", {
+                  class: j(["artifactuse-panel__action", { "artifactuse-panel__action--loading": ee.value }]),
+                  disabled: ee.value,
+                  title: "Download all as ZIP",
+                  onClick: Tt
+                }, [
+                  ee.value ? (a(), s("svg", Hl, [...t[21] || (t[21] = [
+                    e("circle", {
+                      cx: "12",
+                      cy: "12",
+                      r: "10",
+                      "stroke-dasharray": "32",
+                      "stroke-dashoffset": "32"
+                    }, null, -1)
+                  ])])) : (a(), s("svg", Al, [...t[20] || (t[20] = [
+                    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", {
+                      x1: "12",
+                      y1: "15",
+                      x2: "12",
+                      y2: "3"
+                    }, null, -1)
+                  ])]))
+                ], 10, Pl),
+                e("button", {
+                  class: "artifactuse-panel__action artifactuse-panel__action--close",
+                  title: "Close panel",
+                  onClick: t[1] || (t[1] = (...p) => y(g) && y(g)(...p))
+                }, [...t[22] || (t[22] = [
+                  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)
+                ])])
+              ])
+            ]),
+            e("div", El, [
+              e("div", Bl, [
+                (a(!0), s(R, null, ve(d.value, (p, F) => (a(), s("button", {
+                  key: p.id,
+                  class: "artifactuse-panel__list-item",
+                  onClick: (J) => Ge(p)
+                }, [
+                  e("span", {
+                    class: "artifactuse-panel__list-item-icon",
+                    innerHTML: Ie(p.language)
+                  }, null, 8, zl),
+                  e("div", Vl, [
+                    e("span", Il, l(p.title || "Untitled"), 1),
+                    e("span", Fl, [
+                      K(l(y(Se)(p.language)) + " ", 1),
+                      p.lineCount ? (a(), s(R, { key: 0 }, [
+                        K(" • " + l(p.lineCount) + " lines ", 1)
+                      ], 64)) : v("", !0)
+                    ])
+                  ]),
+                  t[23] || (t[23] = e("span", { class: "artifactuse-panel__list-item-arrow" }, [
+                    e("svg", {
+                      viewBox: "0 0 24 24",
+                      fill: "none",
+                      stroke: "currentColor",
+                      "stroke-width": "2"
+                    }, [
+                      e("polyline", { points: "9 18 15 12 9 6" })
+                    ])
+                  ], -1))
+                ], 8, Sl))), 128))
+              ])
+            ]),
+            e("footer", Rl, [
+              G.value ? (a(), s("a", ql, [...t[24] || (t[24] = [
+                e("svg", {
+                  width: "16",
+                  height: "16",
+                  viewBox: "0 0 42 42",
+                  fill: "none",
+                  xmlns: "http://www.w3.org/2000/svg"
+                }, [
+                  e("path", {
+                    d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0",
+                    fill: "#5F51C8"
+                  }),
+                  e("path", {
+                    d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z",
+                    fill: "#695AE0"
+                  })
+                ], -1),
+                e("span", null, "Artifactuse", -1)
+              ])])) : v("", !0)
+            ])
+          ], 64)) : (a(), s(R, { key: 3 }, [
+            e("header", Ol, [
+              Te.value || k.value ? (a(), s("button", {
                 key: 0,
                 class: "artifactuse-panel__back",
-                title: "Back to list",
-                onClick: dt
-              }, [...t[24] || (t[24] = [
+                title: Te.value ? "Browse artifacts" : "Back to list",
+                onClick: ht
+              }, [...t[25] || (t[25] = [
                 e("svg", {
                   viewBox: "0 0 24 24",
                   fill: "none",
@@ -2186,30 +2416,30 @@ 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, Ul)) : v("", !0),
+              e("div", Dl, [
                 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, [
+                }, null, 8, Nl),
+                e("div", jl, [
+                  e("span", Wl, l(y(o).title || "Untitled"), 1),
+                  e("span", Jl, [
                     K(l(D.value) + " ", 1),
-                    g(r).lineCount ? (a(), s(R, { key: 0 }, [
-                      K(" • " + l(g(r).lineCount) + " lines ", 1)
+                    y(o).lineCount ? (a(), s(R, { key: 0 }, [
+                      K(" • " + l(y(o).lineCount) + " lines ", 1)
                     ], 64)) : v("", !0)
                   ])
                 ])
               ]),
-              e("div", Bl, [
-                !g(r).tabs || g(r).tabs.includes("preview") ? (a(), s("button", {
+              e("div", Xl, [
+                !y(o).tabs || y(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,
+                  class: j(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": y(f).viewMode === "preview" }]),
+                  disabled: !y(o).isPreviewable,
                   title: "Preview",
-                  onClick: t[2] || (t[2] = (y) => g(p)("preview"))
-                }, [...t[25] || (t[25] = [
+                  onClick: t[2] || (t[2] = (p) => y(h)("preview"))
+                }, [...t[26] || (t[26] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2223,13 +2453,13 @@ 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, Zl)) : v("", !0),
+                !y(o).tabs || y(o).tabs.includes("code") ? (a(), s("button", {
                   key: 1,
-                  class: N(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": g(m).viewMode === "code" }]),
+                  class: j(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": y(f).viewMode === "code" }]),
                   title: "Code",
-                  onClick: t[3] || (t[3] = (y) => g(p)("code"))
-                }, [...t[26] || (t[26] = [
+                  onClick: t[3] || (t[3] = (p) => y(h)("code"))
+                }, [...t[27] || (t[27] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2240,13 +2470,13 @@ 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", {
+                !y(o).tabs || y(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,
+                  class: j(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": y(f).viewMode === "split" }]),
+                  disabled: !y(o).isPreviewable,
                   title: "Split view",
-                  onClick: t[4] || (t[4] = (y) => g(p)("split"))
-                }, [...t[27] || (t[27] = [
+                  onClick: t[4] || (t[4] = (p) => y(h)("split"))
+                }, [...t[28] || (t[28] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2268,13 +2498,13 @@ 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, Kl)) : v("", !0),
+                y(o).tabs && y(o).tabs.includes("edit") && Pe.value ? (a(), s("button", {
                   key: 3,
-                  class: N(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": g(m).viewMode === "edit" }]),
+                  class: j(["artifactuse-panel__tab", { "artifactuse-panel__tab--active": y(f).viewMode === "edit" }]),
                   title: "Edit",
-                  onClick: t[5] || (t[5] = (y) => g(p)("edit"))
-                }, [...t[28] || (t[28] = [
+                  onClick: t[5] || (t[5] = (p) => y(h)("edit"))
+                }, [...t[29] || (t[29] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2286,13 +2516,13 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   ], -1)
                 ])], 2)) : v("", !0)
               ]),
-              e("div", Il, [
-                g(m).viewMode === "edit" ? (a(), s("button", {
+              e("div", Yl, [
+                y(f).viewMode === "edit" ? (a(), s("button", {
                   key: 0,
                   class: "artifactuse-panel__action artifactuse-panel__action--save",
                   title: "Save",
-                  onClick: _t
-                }, [...t[29] || (t[29] = [
+                  onClick: wt
+                }, [...t[30] || (t[30] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2306,10 +2536,10 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 ])])) : v("", !0),
                 e("button", {
                   class: "artifactuse-panel__action",
-                  title: g(m).isFullscreen ? "Exit fullscreen" : "Fullscreen",
-                  onClick: t[6] || (t[6] = (...y) => g(n) && g(n)(...y))
+                  title: y(f).isFullscreen ? "Exit fullscreen" : "Fullscreen",
+                  onClick: t[6] || (t[6] = (...p) => y(n) && y(n)(...p))
                 }, [
-                  g(m).isFullscreen ? (a(), s("svg", Rl, [...t[31] || (t[31] = [
+                  y(f).isFullscreen ? (a(), s("svg", en, [...t[32] || (t[32] = [
                     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 +2554,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", Gl, [...t[31] || (t[31] = [
                     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,12 +2570,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                       y2: "14"
                     }, null, -1)
                   ])]))
-                ], 8, Fl),
+                ], 8, Ql),
                 e("button", {
                   class: "artifactuse-panel__action artifactuse-panel__action--close",
                   title: "Close panel",
-                  onClick: t[7] || (t[7] = (...y) => g(h) && g(h)(...y))
-                }, [...t[32] || (t[32] = [
+                  onClick: t[7] || (t[7] = (...p) => y(g) && y(g)(...p))
+                }, [...t[33] || (t[33] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2368,37 +2598,80 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 ])])
               ])
             ]),
+            Te.value && Je.value.length > 0 ? (a(), s("div", tn, [
+              e("div", an, [
+                (a(!0), s(R, null, ve(Je.value, (p) => {
+                  var F;
+                  return a(), s("button", {
+                    key: p.id,
+                    class: j(["artifactuse-panel__file-tab", { "artifactuse-panel__file-tab--active": p.id === ((F = y(o)) == null ? void 0 : F.id) }]),
+                    onClick: (J) => pt(p)
+                  }, [
+                    e("span", {
+                      class: "artifactuse-panel__file-tab-icon",
+                      innerHTML: Ie(p.language)
+                    }, null, 8, ln),
+                    e("span", nn, l(p.title || "Untitled"), 1),
+                    e("button", {
+                      class: "artifactuse-panel__file-tab-close",
+                      title: "Close tab",
+                      onClick: he((J) => _t(p.id), ["stop"])
+                    }, [...t[34] || (t[34] = [
+                      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, on)
+                  ], 10, sn);
+                }), 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 }
+              class: j(["artifactuse-panel__content", [
+                `artifactuse-panel__content--${y(f).viewMode}`,
+                { "artifactuse-panel__content--transitioning": m.value }
               ]])
             }, [
-              f.value ? (a(), s("div", ql, [...t[33] || (t[33] = [
+              m.value ? (a(), s("div", rn, [...t[35] || (t[35] = [
                 e("div", { class: "artifactuse-panel__spinner" }, null, -1)
               ])])) : v("", !0),
-              g(m).viewMode === "preview" || g(m).viewMode === "split" ? (a(), s("div", {
+              y(f).viewMode === "preview" || y(f).viewMode === "split" ? (a(), s("div", {
                 key: 1,
                 class: "artifactuse-panel__preview",
-                style: Pe(g(m).viewMode === "split" ? { width: `${I.value}%` } : void 0)
+                style: He(y(f).viewMode === "split" ? { width: `${V.value}%` } : void 0)
               }, [
-                oe.value && A.value ? (a(), s("div", Ol, [...t[34] || (t[34] = [
+                oe.value && A.value ? (a(), s("div", cn, [...t[36] || (t[36] = [
                   e("div", { class: "artifactuse-panel__spinner" }, null, -1)
                 ])])) : v("", !0),
                 A.value ? (a(), s("iframe", {
                   key: 1,
                   ref_key: "iframeRef",
-                  ref: j,
+                  ref: N,
                   src: A.value,
-                  class: N(["artifactuse-panel__iframe", { "artifactuse-panel__iframe--loading": oe.value }]),
+                  class: j(["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: bt,
+                  onError: Ct
+                }, null, 42, un)) : (a(), s("div", dn, [
+                  t[37] || (t[37] = e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
                     stroke: "currentColor",
@@ -2416,22 +2689,22 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   e("p", null, "Preview not available for " + l(D.value), 1)
                 ]))
               ], 4)) : v("", !0),
-              at(e("div", {
+              lt(e("div", {
                 class: "artifactuse-panel__code",
-                style: Pe(g(m).viewMode === "split" ? { width: `${100 - I.value}%` } : void 0)
+                style: He(y(f).viewMode === "split" ? { width: `${100 - V.value}%` } : void 0)
               }, [
-                g(m).viewMode === "split" ? (a(), s("div", {
+                y(f).viewMode === "split" ? (a(), s("div", {
                   key: 0,
                   class: "artifactuse-panel__split-handle",
-                  onMousedown: me(zt, ["prevent"])
-                }, [...t[36] || (t[36] = [
+                  onMousedown: he(qt, ["prevent"])
+                }, [...t[38] || (t[38] = [
                   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: zt
                 }, [
                   e("div", {
                     class: "artifactuse-panel__line-numbers",
@@ -2439,32 +2712,32 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     ref: Y
                   }, null, 512),
                   e("pre", {
-                    class: N(["artifactuse-panel__code-block", `language-${ae.value}`])
+                    class: j(["artifactuse-panel__code-block", `language-${ae.value}`])
                   }, [
                     (a(), s("code", {
                       ref_key: "codeRef",
-                      ref: q,
-                      key: g(r).id,
-                      class: N(`language-${ae.value}`)
+                      ref: O,
+                      key: y(o).id,
+                      class: j(`language-${ae.value}`)
                     }, null, 2))
                   ], 2)
                 ], 544)
               ], 4), [
-                [st, g(m).viewMode === "code" || g(m).viewMode === "split"]
+                [nt, y(f).viewMode === "code" || y(f).viewMode === "split"]
               ]),
-              at(e("div", jl, [
+              lt(e("div", vn, [
                 e("div", {
                   ref_key: "editorContainerRef",
                   ref: ie,
                   class: "artifactuse-panel__editor-container"
                 }, null, 512)
               ], 512), [
-                [st, g(m).viewMode === "edit"]
+                [nt, y(f).viewMode === "edit"]
               ])
             ], 2),
-            e("footer", Nl, [
-              e("div", Wl, [
-                G.value ? (a(), s("a", Jl, [...t[37] || (t[37] = [
+            e("footer", fn, [
+              e("div", pn, [
+                G.value ? (a(), s("a", _n, [...t[39] || (t[39] = [
                   e("svg", {
                     width: "16",
                     height: "16",
@@ -2483,17 +2756,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)
+                y(o).size ? (a(), s("span", hn, l(y(ct)(y(o).size)), 1)) : v("", !0)
               ]),
-              e("div", Zl, [
+              e("div", mn, [
                 e("button", {
-                  class: N(["artifactuse-panel__footer-action", { "artifactuse-panel__footer-action--success": X.value }]),
-                  title: X.value ? "Copied!" : "Copy code",
-                  onClick: kt
+                  class: j(["artifactuse-panel__footer-action", { "artifactuse-panel__footer-action--success": Z.value }]),
+                  title: Z.value ? "Copied!" : "Copy code",
+                  onClick: $t
                 }, [
-                  X.value ? (a(), s("svg", Ql, [...t[39] || (t[39] = [
+                  Z.value ? (a(), s("svg", kn, [...t[41] || (t[41] = [
                     e("polyline", { points: "20 6 9 17 4 12" }, null, -1)
-                  ])])) : (a(), s("svg", Yl, [...t[38] || (t[38] = [
+                  ])])) : (a(), s("svg", gn, [...t[40] || (t[40] = [
                     e("rect", {
                       x: "9",
                       y: "9",
@@ -2504,12 +2777,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, yn),
                 e("button", {
                   class: "artifactuse-panel__footer-action",
                   title: "Download file",
-                  onClick: wt
-                }, [...t[40] || (t[40] = [
+                  onClick: Mt
+                }, [...t[42] || (t[42] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2526,12 +2799,12 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     })
                   ], -1)
                 ])]),
-                ce.value ? (a(), s("div", Gl, [
+                ce.value ? (a(), s("div", wn, [
                   e("button", {
                     class: "artifactuse-panel__footer-action",
                     title: "Share",
-                    onClick: bt
-                  }, [...t[41] || (t[41] = [
+                    onClick: Lt
+                  }, [...t[43] || (t[43] = [
                     e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
@@ -2567,15 +2840,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),
+                  ze(Ee, { name: "artifactuse-popup" }, {
+                    default: Be(() => [
+                      re.value ? (a(), s("div", bn, [
+                        e("div", Cn, [
+                          e("span", xn, l(P.value === "success" ? le.value ? "Artifact updated!" : "Link created!" : P.value === "update-list" ? "Update saved artifact" : "Share Artifact"), 1),
                           e("button", {
                             class: "artifactuse-share-popup__close",
-                            onClick: xt
-                          }, [...t[42] || (t[42] = [
+                            onClick: Pt
+                          }, [...t[44] || (t[44] = [
                             e("svg", {
                               viewBox: "0 0 24 24",
                               fill: "none",
@@ -2597,29 +2870,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, [
+                          P.value === "loading" ? (a(), s("div", Mn, [...t[45] || (t[45] = [
                             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)
+                          ])])) : P.value === "error" ? (a(), s("div", Tn, [
+                            e("div", Ln, [
+                              e("p", Pn, l(L.value), 1)
                             ]),
-                            e("div", cn, [
+                            e("div", An, [
                               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] = (p) => P.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, [
+                          ])) : P.value === "options" ? (a(), s("div", Hn, [
                             e("button", {
                               class: "artifactuse-share-popup__option",
-                              onClick: Xe
-                            }, [...t[44] || (t[44] = [
+                              onClick: Ye
+                            }, [...t[46] || (t[46] = [
                               e("div", { class: "artifactuse-share-popup__option-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
@@ -2638,8 +2911,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: Qe
+                            }, [...t[47] || (t[47] = [
                               e("div", { class: "artifactuse-share-popup__option-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
@@ -2659,8 +2932,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: Ht
+                            }, [...t[48] || (t[48] = [
                               e("div", { class: "artifactuse-share-popup__option-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
@@ -2678,29 +2951,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] = [
+                          ])) : P.value === "update-list" ? (a(), s("div", En, [
+                            z.value ? (a(), s("div", Bn, [...t[49] || (t[49] = [
                               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", Sn, " No saved artifacts of this type ")) : (a(), s("div", zn, [
+                              (a(!0), s(R, null, ve(u.value, (p) => {
+                                var F, J, me;
                                 return a(), s("button", {
-                                  key: ((U = y.project) == null ? void 0 : U.uuid) || y.id,
+                                  key: ((F = p.project) == null ? void 0 : F.uuid) || p.id,
                                   class: "artifactuse-share-popup__artifact-item",
-                                  onClick: (ue) => Lt(y)
+                                  onClick: (ue) => Et(p)
                                 }, [
-                                  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", In, l(((J = p.project) == null ? void 0 : J.name) || "Untitled"), 1),
+                                  e("span", Fn, l(Ke((me = p.project) == null ? void 0 : me.created_at)), 1)
+                                ], 8, Vn);
                               }), 128))
                             ])),
                             e("button", {
                               class: "artifactuse-share-popup__back-btn",
-                              onClick: t[9] || (t[9] = (y) => P.value = "options")
+                              onClick: t[9] || (t[9] = (p) => P.value = "options")
                             }, "Back")
-                          ])) : P.value === "success" ? (a(), s("div", yn, [
-                            t[50] || (t[50] = e("div", { class: "artifactuse-share-popup__success-icon" }, [
+                          ])) : P.value === "success" ? (a(), s("div", Rn, [
+                            t[52] || (t[52] = e("div", { class: "artifactuse-share-popup__success-icon" }, [
                               e("svg", {
                                 viewBox: "0 0 24 24",
                                 fill: "none",
@@ -2710,21 +2983,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", qn, [
                               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] = (p) => p.target.select())
+                              }, null, 8, On),
                               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: j(["artifactuse-share-popup__copy-btn", { "artifactuse-share-popup__copy-btn--copied": r.value }]),
+                                onClick: Bt
+                              }, l(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 && !B.value ? (a(), s("div", Un, [
+                              t[50] || (t[50] = e("span", { class: "artifactuse-share-popup__expiry-icon" }, [
                                 e("svg", {
                                   viewBox: "0 0 24 24",
                                   fill: "none",
@@ -2750,18 +3023,18 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                                   })
                                 ])
                               ], -1)),
-                              e("span", Cn, " Expires " + l(Je(w.value)), 1)
+                              e("span", Dn, " Expires " + l(Ke(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)),
+                            B.value ? v("", !0) : (a(), s("div", Nn, [
+                              t[51] || (t[51] = 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: Qe
                               }, " Save to account ")
                             ]))
                           ])) : v("", !0)
                         ]),
-                        t[51] || (t[51] = e("div", { class: "artifactuse-share-popup__footer" }, [
+                        t[53] || (t[53] = e("div", { class: "artifactuse-share-popup__footer" }, [
                           e("a", {
                             href: "https://artifactuse.com",
                             target: "_blank",
@@ -2796,8 +3069,8 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                   key: 1,
                   class: "artifactuse-panel__footer-action",
                   title: "Open in new tab",
-                  onClick: Pt
-                }, [...t[52] || (t[52] = [
+                  onClick: St
+                }, [...t[54] || (t[54] = [
                   e("svg", {
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -2814,13 +3087,13 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     })
                   ], -1)
                 ])])) : v("", !0),
-                u.value.length > 1 ? (a(), s("div", xn, [
+                !Te.value && d.value.length > 1 ? (a(), s("div", jn, [
                   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[55] || (t[55] = [
                     e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
@@ -2829,14 +3102,14 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                     }, [
                       e("polyline", { points: "15 18 9 12 15 6" })
                     ], -1)
-                  ])], 8, $n),
+                  ])], 8, Wn),
                   e("button", {
                     class: "artifactuse-panel__nav-trigger",
                     title: "View all artifacts",
-                    onClick: Ht
+                    onClick: Vt
                   }, [
-                    e("span", null, l(O.value + 1) + " / " + l(u.value.length), 1),
-                    t[54] || (t[54] = e("svg", {
+                    e("span", null, l(U.value + 1) + " / " + l(d.value.length), 1),
+                    t[56] || (t[56] = e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
                       stroke: "currentColor",
@@ -2847,10 +3120,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[57] || (t[57] = [
                     e("svg", {
                       viewBox: "0 0 24 24",
                       fill: "none",
@@ -2859,16 +3132,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, Jn),
+                  ze(Ee, { name: "artifactuse-popup" }, {
+                    default: Be(() => [
+                      X.value ? (a(), s("div", Xn, [
+                        e("div", Zn, [
+                          t[59] || (t[59] = 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] = (p) => X.value = !1)
+                          }, [...t[58] || (t[58] = [
                             e("svg", {
                               viewBox: "0 0 24 24",
                               fill: "none",
@@ -2890,27 +3163,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", Kn, [
+                          (a(!0), s(R, null, ve(d.value, (p, F) => (a(), s("button", {
+                            key: p.id,
+                            class: j(["artifactuse-panel__artifact-item", { "artifactuse-panel__artifact-item--active": p.id === y(o).id }]),
+                            onClick: (J) => Ge(p)
                           }, [
                             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(p.language)
+                            }, null, 8, Qn),
+                            e("div", Gn, [
+                              e("span", eo, l(p.title || "Untitled"), 1),
+                              e("span", to, [
+                                K(l(y(Se)(p.language)) + " ", 1),
+                                p.lineCount ? (a(), s(R, { key: 0 }, [
+                                  K(" • " + l(p.lineCount) + " lines ", 1)
                                 ], 64)) : v("", !0)
                               ])
                             ]),
-                            e("span", zn, l(U + 1), 1)
-                          ], 10, An))), 128))
+                            e("span", ao, l(F + 1), 1)
+                          ], 10, Yn))), 128))
                         ])
                       ])) : v("", !0)
                     ]),
@@ -2919,236 +3192,28 @@ const Jt = { class: "artifactuse-card__icon" }, Xt = ["innerHTML"], Zt = { class
                 ])) : v("", !0)
               ])
             ])
-          ], 64)) : (a(), s(R, { key: 2 }, [
-            e("header", ul, [
-              e("div", dl, [
-                t[18] || (t[18] = e("span", { class: "artifactuse-panel__icon" }, [
-                  e("svg", {
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    "stroke-width": "2"
-                  }, [
-                    e("polyline", { points: "16 18 22 12 16 6" }),
-                    e("polyline", { points: "8 6 2 12 8 18" })
-                  ])
-                ], -1)),
-                e("div", vl, [
-                  t[17] || (t[17] = e("span", { class: "artifactuse-panel__name" }, "Artifacts", -1)),
-                  e("span", fl, l(u.value.length) + " available", 1)
-                ])
-              ]),
-              e("div", pl, [
-                e("button", {
-                  class: N(["artifactuse-panel__action", { "artifactuse-panel__action--loading": ee.value }]),
-                  disabled: ee.value,
-                  title: "Download all as ZIP",
-                  onClick: Ct
-                }, [
-                  ee.value ? (a(), s("svg", ml, [...t[20] || (t[20] = [
-                    e("circle", {
-                      cx: "12",
-                      cy: "12",
-                      r: "10",
-                      "stroke-dasharray": "32",
-                      "stroke-dashoffset": "32"
-                    }, null, -1)
-                  ])])) : (a(), s("svg", _l, [...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", {
-                      x1: "12",
-                      y1: "15",
-                      x2: "12",
-                      y2: "3"
-                    }, null, -1)
-                  ])]))
-                ], 10, hl),
-                e("button", {
-                  class: "artifactuse-panel__action artifactuse-panel__action--close",
-                  title: "Close panel",
-                  onClick: t[1] || (t[1] = (...y) => g(h) && g(h)(...y))
-                }, [...t[21] || (t[21] = [
-                  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)
-                ])])
-              ])
-            ]),
-            e("div", yl, [
-              e("div", gl, [
-                (a(!0), s(R, null, ve(u.value, (y, U) => (a(), s("button", {
-                  key: y.id,
-                  class: "artifactuse-panel__list-item",
-                  onClick: (Z) => Ke(y)
-                }, [
-                  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)
-                      ], 64)) : v("", !0)
-                    ])
-                  ]),
-                  t[22] || (t[22] = e("span", { class: "artifactuse-panel__list-item-arrow" }, [
-                    e("svg", {
-                      viewBox: "0 0 24 24",
-                      fill: "none",
-                      stroke: "currentColor",
-                      "stroke-width": "2"
-                    }, [
-                      e("polyline", { points: "9 18 15 12 9 6" })
-                    ])
-                  ], -1))
-                ], 8, kl))), 128))
-              ])
-            ]),
-            e("footer", $l, [
-              G.value ? (a(), s("a", Ml, [...t[23] || (t[23] = [
-                e("svg", {
-                  width: "16",
-                  height: "16",
-                  viewBox: "0 0 42 42",
-                  fill: "none",
-                  xmlns: "http://www.w3.org/2000/svg"
-                }, [
-                  e("path", {
-                    d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0",
-                    fill: "#5F51C8"
-                  }),
-                  e("path", {
-                    d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z",
-                    fill: "#695AE0"
-                  })
-                ], -1),
-                e("span", null, "Artifactuse", -1)
-              ])])) : v("", !0)
-            ])
-          ], 64)) : (a(), s(R, { key: 1 }, [
-            e("header", nl, [
-              t[14] || (t[14] = e("div", { class: "artifactuse-panel__title" }, [
-                e("span", { class: "artifactuse-panel__icon" }, [
-                  e("svg", {
-                    viewBox: "0 0 24 24",
-                    fill: "none",
-                    stroke: "currentColor",
-                    "stroke-width": "2"
-                  }, [
-                    e("polyline", { points: "16 18 22 12 16 6" }),
-                    e("polyline", { points: "8 6 2 12 8 18" })
-                  ])
-                ]),
-                e("div", { class: "artifactuse-panel__title-content" }, [
-                  e("span", { class: "artifactuse-panel__name" }, "Artifacts")
-                ])
-              ], -1)),
-              e("div", ol, [
-                e("button", {
-                  class: "artifactuse-panel__action artifactuse-panel__action--close",
-                  title: "Close panel",
-                  onClick: t[0] || (t[0] = (...y) => g(h) && g(h)(...y))
-                }, [...t[13] || (t[13] = [
-                  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)
-                ])])
-              ])
-            ]),
-            t[16] || (t[16] = e("div", { class: "artifactuse-panel__empty" }, [
-              e("div", { class: "artifactuse-panel__empty-icon" }, [
-                e("svg", {
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  "stroke-width": "1.5"
-                }, [
-                  e("path", { d: "M14.5 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7.5L14.5 2z" }),
-                  e("polyline", { points: "14 2 14 8 20 8" })
-                ])
-              ]),
-              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("svg", {
-                  width: "16",
-                  height: "16",
-                  viewBox: "0 0 42 42",
-                  fill: "none",
-                  xmlns: "http://www.w3.org/2000/svg"
-                }, [
-                  e("path", {
-                    d: "M16.6667 41.6673V10.4173C16.6667 9.86478 16.4472 9.33488 16.0565 8.94418C15.6658 8.55348 15.1359 8.33398 14.5833 8.33398H4.16667C3.0616 8.33398 2.00179 8.77297 1.22039 9.55437C0.438987 10.3358 0 11.3956 0 12.5007V37.5006C0 38.6057 0.438987 39.6655 1.22039 40.4469C2.00179 41.2283 3.0616 41.6673 4.16667 41.6673H29.1667C30.2717 41.6673 31.3315 41.2283 32.1129 40.4469C32.8943 39.6655 33.3333 38.6057 33.3333 37.5006V27.084C33.3333 26.5314 33.1138 26.0015 32.7231 25.6108C32.3324 25.2201 31.8025 25.0007 31.25 25.0007H0",
-                    fill: "#5F51C8"
-                  }),
-                  e("path", {
-                    d: "M39.5833 0H27.0833C25.9327 0 25 0.93274 25 2.08333V14.5833C25 15.7339 25.9327 16.6667 27.0833 16.6667H39.5833C40.7339 16.6667 41.6667 15.7339 41.6667 14.5833V2.08333C41.6667 0.93274 40.7339 0 39.5833 0Z",
-                    fill: "#695AE0"
-                  })
-                ], -1),
-                e("span", null, "Artifactuse", -1)
-              ])])) : v("", !0)
-            ])
           ], 64))
         ], 6)) : v("", !0)
       ]),
       _: 1
     }));
   }
-}, In = ["title"], Fn = {
+}, so = ["title"], io = {
   key: 0,
   class: "artifactuse-panel-toggle-badge"
-}, jn = {
+}, vo = {
   __name: "ArtifactusePanelToggle",
   setup(H) {
-    const { state: d, artifactCount: _, hasArtifacts: L, togglePanel: m } = Ee();
-    return (r, V) => (a(), s("button", {
-      class: N(["artifactuse-panel-toggle", {
-        "artifactuse-panel-toggle--active": g(d).isPanelOpen,
-        "artifactuse-panel-toggle--has-artifacts": g(L)
+    const { state: c, artifactCount: _, hasArtifacts: T, togglePanel: f } = Ve();
+    return (o, q) => (a(), s("button", {
+      class: j(["artifactuse-panel-toggle", {
+        "artifactuse-panel-toggle--active": y(c).isPanelOpen,
+        "artifactuse-panel-toggle--has-artifacts": y(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] = (...E) => y(f) && y(f)(...E)),
+      title: y(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 +3224,164 @@ 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));
+      y(_) > 0 ? (a(), s("span", io, l(y(_) > 99 ? "99+" : y(_)), 1)) : v("", !0)
+    ], 10, so));
   }
-}, rt = Symbol("artifactuse");
-function ct(H = {}) {
+}, dt = Symbol("artifactuse");
+function vt(H = {}) {
   var n;
-  const d = ot(H), _ = lt({
+  const c = ut(H), _ = rt({
     artifacts: [],
     activeArtifactId: null,
     isPanelOpen: !1,
     viewMode: "preview",
-    isFullscreen: !1
+    isFullscreen: !1,
+    openTabs: [],
+    tabViewModes: {},
+    forceEmptyView: !1
   });
-  d.state.subscribe((p) => {
-    _.artifacts = p.artifacts, _.activeArtifactId = p.activeArtifactId, _.isPanelOpen = p.isPanelOpen, _.viewMode = p.viewMode, _.isFullscreen = p.isFullscreen;
+  c.state.subscribe((h) => {
+    _.artifacts = h.artifacts, _.activeArtifactId = h.activeArtifactId, _.isPanelOpen = h.isPanelOpen, _.viewMode = h.viewMode, _.isFullscreen = h.isFullscreen, _.openTabs = h.openTabs, _.tabViewModes = h.tabViewModes, _.forceEmptyView = h.forceEmptyView;
   });
-  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(() => _.activeArtifactId && _.artifacts.find((h) => h.id === _.activeArtifactId) || null), f = C(() => _.artifacts.filter((h) => !h.isInline).length), o = C(() => _.artifacts.some((h) => !h.isInline)), q = C(() => c.getPanelTypes()), E = C(() => T.value ? c.getPanelUrl(T.value) : null);
+  if (c.applyTheme(), H.theme === "auto" || !H.theme) {
+    const h = ((n = c.bridge) == null ? void 0 : n.theme) || c.theme;
+    h != null && h.watchSystemTheme && h.watchSystemTheme(() => {
+      c.applyTheme();
     });
   }
-  const h = {
-    instance: d,
+  const g = {
+    instance: c,
     state: _,
-    activeArtifact: L,
-    artifactCount: m,
-    hasArtifacts: r,
+    activeArtifact: T,
+    artifactCount: f,
+    hasArtifacts: o,
     // Panel computed
-    panelTypes: V,
-    activePanelUrl: S,
+    panelTypes: q,
+    activePanelUrl: E,
     // 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,
+    openPanel: c.openPanel,
+    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: (h) => {
+      c.setTheme(h), c.applyTheme();
     },
-    getTheme: d.getTheme
+    getTheme: c.getTheme
   };
-  return Ot(rt, h), h;
+  return Wt(dt, g), g;
 }
-function Ee() {
-  const H = Ut(rt);
-  return H || (console.warn("useArtifactuse() called without provideArtifactuse(). Creating standalone instance."), ct());
+function Ve() {
+  const H = Jt(dt);
+  return H || (console.warn("useArtifactuse() called without provideArtifactuse(). Creating standalone instance."), vt());
 }
-function Vn(H = {}) {
-  const d = ot(H), _ = lt({
+function lo(H = {}) {
+  const c = ut(H), _ = rt({
     artifacts: [],
     activeArtifactId: null,
     isPanelOpen: !1,
     viewMode: "preview",
-    isFullscreen: !1
+    isFullscreen: !1,
+    openTabs: [],
+    tabViewModes: {},
+    forceEmptyView: !1
   });
-  let L;
-  $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();
+  let T;
+  Me(() => {
+    T = c.state.subscribe((n) => {
+      _.artifacts = n.artifacts, _.activeArtifactId = n.activeArtifactId, _.isPanelOpen = n.isPanelOpen, _.viewMode = n.viewMode, _.isFullscreen = n.isFullscreen, _.openTabs = n.openTabs, _.tabViewModes = n.tabViewModes, _.forceEmptyView = n.forceEmptyView;
+    }), c.applyTheme();
+  }), We(() => {
+    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 f = C(() => _.activeArtifactId && _.artifacts.find((n) => n.id === _.activeArtifactId) || null), o = C(() => _.artifacts.filter((n) => !n.isInline).length), q = C(() => _.artifacts.some((n) => !n.isInline)), E = C(() => c.getPanelTypes()), g = C(() => f.value ? c.getPanelUrl(f.value) : null);
   return {
-    instance: d,
+    instance: c,
     state: _,
-    activeArtifact: m,
-    artifactCount: r,
-    hasArtifacts: V,
+    activeArtifact: f,
+    artifactCount: o,
+    hasArtifacts: q,
     // Panel computed
-    panelTypes: S,
-    activePanelUrl: h,
+    panelTypes: E,
+    activePanelUrl: g,
     // 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,
+    openPanel: c.openPanel,
+    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,
+    applyTheme: c.applyTheme,
     setTheme: (n) => {
-      d.setTheme(n), d.applyTheme();
+      c.setTheme(n), c.applyTheme();
     },
-    getTheme: d.getTheme
+    getTheme: c.getTheme
   };
 }
-const Nn = {
-  provideArtifactuse: ct,
-  useArtifactuse: Ee,
-  createArtifactuseComposable: Vn,
-  DEFAULT_PANELS: Nt
+const fo = {
+  provideArtifactuse: vt,
+  useArtifactuse: Ve,
+  createArtifactuseComposable: lo,
+  DEFAULT_PANELS: Kt
 };
 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
+  co as ArtifactuseAgentMessage,
+  ca as ArtifactuseCard,
+  Qa as ArtifactuseInlineForm,
+  uo as ArtifactusePanel,
+  vo as ArtifactusePanelToggle,
+  tl as ArtifactuseSocialPreview,
+  cl as ArtifactuseViewer,
+  Kt as DEFAULT_PANELS,
+  lo as createArtifactuseComposable,
+  fo as default,
+  vt as provideArtifactuse,
+  Ve as useArtifactuse
 };