npm - @teamflojo/floimg-studio-ui - Versions diffs - 0.2.3 → 0.3.0 - Mend

@teamflojo/floimg-studio-ui 0.2.3 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/index.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import { jsxs as o, jsx as e, Fragment as U } from "react/jsx-runtime";
-import { memo as E, useRef as Q, useCallback as L, useState as I, useEffect as D, useMemo as oe } from "react";
-import Ne, { Handle as A, Position as P, applyNodeChanges as ze, applyEdgeChanges as Ce, MarkerType as Ie, Background as Se, Controls as Le, MiniMap as We, ReactFlowProvider as Ae, useReactFlow as Pe } from "reactflow";
-import { create as me } from "zustand";
-import { useQuery as F } from "@tanstack/react-query";
+import { jsxs as n, jsx as e, Fragment as B } from "react/jsx-runtime";
+import { memo as G, useRef as te, useCallback as W, useState as C, useEffect as U, useMemo as ie } from "react";
+import Ne, { Handle as P, Position as $, applyNodeChanges as ze, applyEdgeChanges as Ce, MarkerType as Ie, Background as Se, Controls as Le, MiniMap as We, ReactFlowProvider as Ae, useReactFlow as Pe } from "reactflow";
+import { create as ue } from "zustand";
+import { useQuery as K } from "@tanstack/react-query";
 function $e(r, l) {
   let t;
   try {
@@ -20,28 +20,28 @@ function $e(r, l) {
     removeItem: (i) => t.removeItem(i)
   };
 }
-const Y = (r) => (l) => {
+const re = (r) => (l) => {
   try {
     const t = r(l);
     return t instanceof Promise ? t : {
-      then(n) {
-        return Y(n)(t);
+      then(o) {
+        return re(o)(t);
       },
-      catch(n) {
+      catch(o) {
         return this;
       }
     };
   } catch (t) {
     return {
-      then(n) {
+      then(o) {
         return this;
       },
-      catch(n) {
-        return Y(n)(t);
+      catch(o) {
+        return re(o)(t);
       }
     };
   }
-}, Me = (r, l) => (t, n, i) => {
+}, je = (r, l) => (t, o, i) => {
   let s = {
     storage: $e(() => localStorage),
     partialize: (v) => v,
@@ -61,11 +61,11 @@ const Y = (r) => (l) => {
           `[zustand persist middleware] Unable to update item '${s.name}', the given storage is currently unavailable.`
         ), t(...v);
       },
-      n,
+      o,
       i
     );
   const c = () => {
-    const v = s.partialize({ ...n() });
+    const v = s.partialize({ ...o() });
     return m.setItem(s.name, {
       state: v,
       version: s.version
@@ -74,28 +74,28 @@ const Y = (r) => (l) => {
   i.setState = (v, w) => (u(v, w), c());
   const h = r(
     (...v) => (t(...v), c()),
-    n,
+    o,
     i
   );
   i.getInitialState = () => h;
-  let f;
+  let b;
   const y = () => {
     var v, w;
     if (!m) return;
     p = !1, d.forEach((g) => {
-      var z;
-      return g((z = n()) != null ? z : h);
+      var N;
+      return g((N = o()) != null ? N : h);
     });
-    const b = ((w = s.onRehydrateStorage) == null ? void 0 : w.call(s, (v = n()) != null ? v : h)) || void 0;
-    return Y(m.getItem.bind(m))(s.name).then((g) => {
+    const x = ((w = s.onRehydrateStorage) == null ? void 0 : w.call(s, (v = o()) != null ? v : h)) || void 0;
+    return re(m.getItem.bind(m))(s.name).then((g) => {
       if (g)
         if (typeof g.version == "number" && g.version !== s.version) {
           if (s.migrate) {
-            const z = s.migrate(
+            const N = s.migrate(
               g.state,
               g.version
             );
-            return z instanceof Promise ? z.then((W) => [!0, W]) : [!0, z];
+            return N instanceof Promise ? N.then((A) => [!0, A]) : [!0, N];
           }
           console.error(
             "State loaded from storage couldn't be migrated since no migrate function was provided"
@@ -104,17 +104,17 @@ const Y = (r) => (l) => {
           return [!1, g.state];
       return [!1, void 0];
     }).then((g) => {
-      var z;
-      const [W, x] = g;
-      if (f = s.merge(
-        x,
-        (z = n()) != null ? z : h
-      ), t(f, !0), W)
+      var N;
+      const [A, k] = g;
+      if (b = s.merge(
+        k,
+        (N = o()) != null ? N : h
+      ), t(b, !0), A)
         return c();
     }).then(() => {
-      b == null || b(f, void 0), f = n(), p = !0, a.forEach((g) => g(f));
+      x == null || x(b, void 0), b = o(), p = !0, a.forEach((g) => g(b));
     }).catch((g) => {
-      b == null || b(void 0, g);
+      x == null || x(void 0, g);
     });
   };
   return i.persist = {
@@ -136,9 +136,9 @@ const Y = (r) => (l) => {
     onFinishHydration: (v) => (a.add(v), () => {
       a.delete(v);
     })
-  }, s.skipHydration || y(), f || h;
-}, pe = Me, $ = "/api";
-async function j(r, l) {
+  }, s.skipHydration || y(), b || h;
+}, ge = je, j = "/api";
+async function T(r, l) {
   const t = await fetch(r, {
     ...l,
     headers: {
@@ -147,44 +147,44 @@ async function j(r, l) {
     }
   });
   if (!t.ok) {
-    const n = await t.json().catch(() => ({ error: "Unknown error" }));
-    throw new Error(n.error || `HTTP ${t.status}`);
+    const o = await t.json().catch(() => ({ error: "Unknown error" }));
+    throw new Error(o.error || `HTTP ${t.status}`);
   }
   return t.json();
 }
-async function je() {
-  return j(`${$}/nodes/generators`);
+async function Me() {
+  return T(`${j}/nodes/generators`);
 }
 async function De() {
-  return j(`${$}/nodes/transforms`);
+  return T(`${j}/nodes/transforms`);
 }
 async function Te() {
-  return j(`${$}/nodes/text`);
+  return T(`${j}/nodes/text`);
 }
 async function Ue() {
-  return j(`${$}/nodes/vision`);
+  return T(`${j}/nodes/vision`);
 }
 async function Oe(r, l, t) {
-  return j(`${$}/execute/sync`, {
+  return T(`${j}/execute/sync`, {
     method: "POST",
     body: JSON.stringify({ nodes: r, edges: l, aiProviders: t })
   });
 }
 async function Re(r, l) {
-  return j(`${$}/export/yaml`, {
+  return T(`${j}/export/yaml`, {
     method: "POST",
     body: JSON.stringify({ nodes: r, edges: l })
   });
 }
 async function Ee() {
-  return j(`${$}/images`);
+  return T(`${j}/images`);
 }
-function se(r) {
-  return `${$}/images/${r}/blob`;
+function le(r) {
+  return `${j}/images/${r}/blob`;
 }
 async function Be(r) {
   try {
-    return await j(`${$}/images/${r}/workflow`);
+    return await T(`${j}/images/${r}/workflow`);
   } catch {
     return null;
   }
@@ -192,75 +192,75 @@ async function Be(r) {
 async function Ve(r) {
   const l = new FormData();
   l.append("file", r);
-  const t = await fetch(`${$}/uploads`, {
+  const t = await fetch(`${j}/uploads`, {
     method: "POST",
     body: l
   });
   if (!t.ok) {
-    const n = await t.json().catch(() => ({ error: "Upload failed" }));
-    throw new Error(n.error || `HTTP ${t.status}`);
+    const o = await t.json().catch(() => ({ error: "Upload failed" }));
+    throw new Error(o.error || `HTTP ${t.status}`);
   }
   return t.json();
 }
 async function Ge() {
-  return j(`${$}/uploads`);
+  return T(`${j}/uploads`);
 }
 async function Fe(r) {
-  const l = await fetch(`${$}/uploads/${r}`, {
+  const l = await fetch(`${j}/uploads/${r}`, {
     method: "DELETE"
   });
   if (!l.ok)
     throw new Error(`Failed to delete upload: ${l.status}`);
 }
-function ue(r) {
-  return `${$}/uploads/${r}/blob`;
+function he(r) {
+  return `${j}/uploads/${r}/blob`;
 }
 async function He(r) {
-  return j(`${$}/import`, {
+  return T(`${j}/import`, {
     method: "POST",
     body: JSON.stringify({ yaml: r })
   });
 }
 async function _e(r) {
-  return j(`${$}/import/validate`, {
+  return T(`${j}/import/validate`, {
     method: "POST",
     body: JSON.stringify({ yaml: r })
   });
 }
 async function Ke(r) {
-  return j(`${$}/generate/workflow`, {
+  return T(`${j}/generate/workflow`, {
     method: "POST",
     body: JSON.stringify(r)
   });
 }
 async function qe() {
-  return j(`${$}/generate/status`);
+  return T(`${j}/generate/status`);
 }
-const ie = "http://localhost:11434", le = "http://localhost:1234", O = me()(
-  pe(
+const de = "http://localhost:11434", ce = "http://localhost:1234", V = ue()(
+  ge(
     (r, l) => ({
       ai: {
         ollama: {
-          baseUrl: ie,
+          baseUrl: de,
           enabled: !1
         },
         lmstudio: {
-          baseUrl: le,
+          baseUrl: ce,
           enabled: !1
         }
       },
       showSettings: !1,
-      setAIProvider: (t, n) => {
+      setAIProvider: (t, o) => {
         r((i) => ({
           ai: {
             ...i.ai,
-            [t]: n
+            [t]: o
           }
         }));
       },
       clearAIProvider: (t) => {
-        r((n) => {
-          const i = { ...n.ai };
+        r((o) => {
+          const i = { ...o.ai };
           return delete i[t], { ai: i };
         });
       },
@@ -268,8 +268,8 @@ const ie = "http://localhost:11434", le = "http://localhost:1234", O = me()(
       closeSettings: () => r({ showSettings: !1 }),
       getConfiguredProviders: () => {
         var i, s, p, d, a, m, c;
-        const { ai: t } = l(), n = {};
-        return (i = t.openai) != null && i.enabled && t.openai.apiKey && (n.openai = { apiKey: t.openai.apiKey }), (s = t.anthropic) != null && s.enabled && t.anthropic.apiKey && (n.anthropic = { apiKey: t.anthropic.apiKey }), (p = t.gemini) != null && p.enabled && t.gemini.apiKey && (n.gemini = { apiKey: t.gemini.apiKey }), (d = t.grok) != null && d.enabled && t.grok.apiKey && (n.grok = { apiKey: t.grok.apiKey }), (a = t.openrouter) != null && a.enabled && t.openrouter.apiKey && (n.openrouter = { apiKey: t.openrouter.apiKey }), (m = t.ollama) != null && m.enabled && (n.ollama = { baseUrl: t.ollama.baseUrl || ie }), (c = t.lmstudio) != null && c.enabled && (n.lmstudio = { baseUrl: t.lmstudio.baseUrl || le }), n;
+        const { ai: t } = l(), o = {};
+        return (i = t.openai) != null && i.enabled && t.openai.apiKey && (o.openai = { apiKey: t.openai.apiKey }), (s = t.anthropic) != null && s.enabled && t.anthropic.apiKey && (o.anthropic = { apiKey: t.anthropic.apiKey }), (p = t.gemini) != null && p.enabled && t.gemini.apiKey && (o.gemini = { apiKey: t.gemini.apiKey }), (d = t.grok) != null && d.enabled && t.grok.apiKey && (o.grok = { apiKey: t.grok.apiKey }), (a = t.openrouter) != null && a.enabled && t.openrouter.apiKey && (o.openrouter = { apiKey: t.openrouter.apiKey }), (m = t.ollama) != null && m.enabled && (o.ollama = { baseUrl: t.ollama.baseUrl || de }), (c = t.lmstudio) != null && c.enabled && (o.lmstudio = { baseUrl: t.lmstudio.baseUrl || ce }), o;
       }
     }),
     {
@@ -280,15 +280,15 @@ const ie = "http://localhost:11434", le = "http://localhost:1234", O = me()(
   )
 );
 let Je = 0;
-function V() {
+function H() {
   return `node_${++Je}`;
 }
-function de() {
+function me() {
   const r = Date.now(), l = Math.random().toString(36).substring(2, 8);
   return `wf_${r}_${l}`;
 }
-const k = me()(
-  pe(
+const f = ue()(
+  ge(
     (r, l) => ({
       nodes: [],
       edges: [],
@@ -314,16 +314,16 @@ const k = me()(
         nodeStatus: {}
       },
       loadTemplate: (t) => {
-        const n = /* @__PURE__ */ new Map(), i = t.workflow.nodes.map((p) => {
-          const d = V();
-          return n.set(p.id, d), {
+        const o = /* @__PURE__ */ new Map(), i = t.workflow.nodes.map((p) => {
+          const d = H();
+          return o.set(p.id, d), {
             id: d,
             type: p.type,
             position: p.position,
             data: p.data
           };
         }), s = t.workflow.edges.map((p) => {
-          const d = n.get(p.source) || p.source, a = n.get(p.target) || p.target;
+          const d = o.get(p.source) || p.source, a = o.get(p.target) || p.target;
           return {
             id: `edge_${d}_${a}`,
             source: d,
@@ -364,10 +364,10 @@ const k = me()(
         });
       },
       togglePreview: (t) => {
-        r((n) => ({
+        r((o) => ({
           previewVisible: {
-            ...n.previewVisible,
-            [t]: n.previewVisible[t] === !1
+            ...o.previewVisible,
+            [t]: o.previewVisible[t] === !1
             // default true, toggle
           }
         }));
@@ -376,14 +376,14 @@ const k = me()(
       setTransforms: (t) => r({ transforms: t }),
       setTextProviders: (t) => r({ textProviders: t }),
       setVisionProviders: (t) => r({ visionProviders: t }),
-      addNode: (t, n) => {
+      addNode: (t, o) => {
         var d, a, m;
-        const i = V();
+        const i = H();
         let s;
         if (t.type === "generator")
           s = {
             generatorName: t.name,
-            params: _(t),
+            params: Q(t),
             isAI: t.isAI,
             // Track if this is an AI generator (can accept text input)
             acceptsReferenceImages: t.acceptsReferenceImages,
@@ -396,7 +396,7 @@ const k = me()(
             // Track which provider this transform belongs to
             isAI: t.isAI,
             // Track if this is an AI transform (can accept text input)
-            params: _(t),
+            params: Q(t),
             acceptsReferenceImages: t.acceptsReferenceImages,
             maxReferenceImages: t.maxReferenceImages
           };
@@ -411,14 +411,14 @@ const k = me()(
             providerName: t.name,
             providerLabel: t.label,
             // Human-readable label (e.g., "Gemini Vision")
-            params: _(t)
+            params: Q(t)
           };
         else if (t.type === "text")
           s = {
             providerName: t.name,
             providerLabel: t.label,
             // Human-readable label (e.g., "Gemini Text")
-            params: _(t)
+            params: Q(t)
           };
         else {
           const c = ((d = t.params) == null ? void 0 : d.properties) || {}, u = ((a = c.provider) == null ? void 0 : a.default) || "filesystem";
@@ -430,31 +430,31 @@ const k = me()(
         const p = {
           id: i,
           type: t.type,
-          position: n,
+          position: o,
           data: s
         };
         r((c) => ({
           nodes: [...c.nodes, p]
         }));
       },
-      updateNodeData: (t, n) => {
+      updateNodeData: (t, o) => {
         r((i) => ({
           nodes: i.nodes.map(
-            (s) => s.id === t ? { ...s, data: { ...s.data, ...n } } : s
+            (s) => s.id === t ? { ...s, data: { ...s.data, ...o } } : s
           )
         }));
       },
       deleteNode: (t) => {
-        r((n) => ({
-          nodes: n.nodes.filter((i) => i.id !== t),
-          edges: n.edges.filter((i) => i.source !== t && i.target !== t),
-          selectedNodeId: n.selectedNodeId === t ? null : n.selectedNodeId
+        r((o) => ({
+          nodes: o.nodes.filter((i) => i.id !== t),
+          edges: o.edges.filter((i) => i.source !== t && i.target !== t),
+          selectedNodeId: o.selectedNodeId === t ? null : o.selectedNodeId
         }));
       },
       duplicateNode: (t) => {
-        const n = l(), i = n.nodes.find((d) => d.id === t);
+        const o = l(), i = o.nodes.find((d) => d.id === t);
         if (!i) return;
-        const s = V(), p = {
+        const s = H(), p = {
           ...i,
           id: s,
           position: {
@@ -466,7 +466,7 @@ const k = me()(
           selected: !1
         };
         r({
-          nodes: [...n.nodes, p],
+          nodes: [...o.nodes, p],
           selectedNodeId: s
           // Select the new node
         });
@@ -474,8 +474,8 @@ const k = me()(
       setNodes: (t) => r({ nodes: t }),
       addEdge: (t) => {
         if (!t.source || !t.target) return;
-        const n = [t.sourceHandle, t.targetHandle].filter(Boolean).join("_"), s = {
-          id: n ? `edge_${t.source}_${t.target}_${n}` : `edge_${t.source}_${t.target}`,
+        const o = [t.sourceHandle, t.targetHandle].filter(Boolean).join("_"), s = {
+          id: o ? `edge_${t.source}_${t.target}_${o}` : `edge_${t.source}_${t.target}`,
           source: t.source,
           target: t.target,
           sourceHandle: t.sourceHandle ?? void 0,
@@ -486,25 +486,25 @@ const k = me()(
         }));
       },
       deleteEdge: (t) => {
-        r((n) => ({
-          edges: n.edges.filter((i) => i.id !== t)
+        r((o) => ({
+          edges: o.edges.filter((i) => i.id !== t)
         }));
       },
       setEdges: (t) => r({ edges: t }),
       setSelectedNode: (t) => r({ selectedNodeId: t }),
       execute: async () => {
-        const { nodes: t, edges: n } = l(), i = t.map((a) => ({
+        const { nodes: t, edges: o } = l(), i = t.map((a) => ({
           id: a.id,
           type: a.type,
           position: a.position,
           data: a.data
-        })), s = n.map((a) => ({
+        })), s = o.map((a) => ({
           id: a.id,
           source: a.source,
           target: a.target,
           sourceHandle: a.sourceHandle ?? void 0,
           targetHandle: a.targetHandle ?? void 0
-        })), p = O.getState().getConfiguredProviders(), d = {};
+        })), p = V.getState().getConfiguredProviders(), d = {};
         for (const a of t)
           d[a.id] = "running";
         r({
@@ -559,12 +559,12 @@ const k = me()(
         }
       },
       exportToYaml: async () => {
-        const { nodes: t, edges: n } = l(), i = t.map((d) => ({
+        const { nodes: t, edges: o } = l(), i = t.map((d) => ({
           id: d.id,
           type: d.type,
           position: d.position,
           data: d.data
-        })), s = n.map((d) => ({
+        })), s = o.map((d) => ({
           id: d.id,
           source: d.source,
           target: d.target,
@@ -573,16 +573,16 @@ const k = me()(
         }));
         return (await Re(i, s)).yaml;
       },
-      importFromYaml: (t, n, i) => {
+      importFromYaml: (t, o, i) => {
         const s = /* @__PURE__ */ new Map(), p = t.map((a) => {
-          const m = V();
+          const m = H();
           return s.set(a.id, m), {
             id: m,
             type: a.type,
             position: a.position,
             data: a.data
           };
-        }), d = n.map((a) => {
+        }), d = o.map((a) => {
           const m = s.get(a.source) || a.source, c = s.get(a.target) || a.target;
           return {
             id: `edge_${m}_${c}`,
@@ -635,7 +635,7 @@ const k = me()(
       },
       saveWorkflow: (t) => {
         const {
-          nodes: n,
+          nodes: o,
           edges: i,
           activeWorkflowId: s,
           activeWorkflowName: p,
@@ -644,7 +644,7 @@ const k = me()(
         } = l(), m = Date.now();
         if (s) {
           const c = d.map(
-            (u) => u.id === s ? { ...u, name: t || p, nodes: n, edges: i, updatedAt: m } : u
+            (u) => u.id === s ? { ...u, name: t || p, nodes: o, edges: i, updatedAt: m } : u
           );
           return r({
             savedWorkflows: c,
@@ -652,10 +652,10 @@ const k = me()(
             hasUnsavedChanges: !1
           }), s;
         } else {
-          const c = de(), u = {
+          const c = me(), u = {
             id: c,
             name: t || p,
-            nodes: n,
+            nodes: o,
             edges: i,
             createdAt: m,
             updatedAt: m,
@@ -670,7 +670,7 @@ const k = me()(
         }
       },
       loadWorkflow: (t) => {
-        const { savedWorkflows: n } = l(), i = n.find((s) => s.id === t);
+        const { savedWorkflows: o } = l(), i = o.find((s) => s.id === t);
         i && r({
           nodes: i.nodes,
           edges: i.edges,
@@ -691,7 +691,7 @@ const k = me()(
         });
       },
       deleteWorkflow: (t) => {
-        const { savedWorkflows: n, activeWorkflowId: i } = l(), s = n.filter((p) => p.id !== t);
+        const { savedWorkflows: o, activeWorkflowId: i } = l(), s = o.filter((p) => p.id !== t);
         r(i === t ? {
           savedWorkflows: s,
           nodes: [],
@@ -712,92 +712,92 @@ const k = me()(
           }
         } : { savedWorkflows: s });
       },
-      renameWorkflow: (t, n) => {
+      renameWorkflow: (t, o) => {
         const { savedWorkflows: i, activeWorkflowId: s } = l(), p = i.map(
-          (d) => d.id === t ? { ...d, name: n, updatedAt: Date.now() } : d
+          (d) => d.id === t ? { ...d, name: o, updatedAt: Date.now() } : d
         );
         r({
           savedWorkflows: p,
-          ...s === t ? { activeWorkflowName: n } : {}
+          ...s === t ? { activeWorkflowName: o } : {}
         });
       },
       duplicateWorkflow: (t) => {
-        const { savedWorkflows: n } = l(), i = n.find((a) => a.id === t);
+        const { savedWorkflows: o } = l(), i = o.find((a) => a.id === t);
         if (!i) return "";
-        const s = Date.now(), p = de(), d = {
+        const s = Date.now(), p = me(), d = {
           ...i,
           id: p,
           name: `${i.name} (Copy)`,
           createdAt: s,
           updatedAt: s
         };
-        return r({ savedWorkflows: [...n, d] }), p;
+        return r({ savedWorkflows: [...o, d] }), p;
       },
       loadGeneratedWorkflow: (t) => {
-        const n = /* @__PURE__ */ new Map(), i = 250, s = 150, p = 3, d = t.nodes.map((m, c) => {
-          const u = V();
-          n.set(m.id, u);
-          const h = m.nodeType.split(":"), f = h[0], y = Math.floor(c / p), w = {
+        const o = /* @__PURE__ */ new Map(), i = 250, s = 150, p = 3, d = t.nodes.map((m, c) => {
+          const u = H();
+          o.set(m.id, u);
+          const h = m.nodeType.split(":"), b = h[0], y = Math.floor(c / p), w = {
             x: 100 + c % p * i,
             y: 100 + y * s
           };
-          let b;
-          if (f === "generator")
-            b = {
+          let x;
+          if (b === "generator")
+            x = {
               generatorName: h.slice(1).join(":"),
               params: m.parameters,
               isAI: !0
               // Assume AI since we're generating from AI
             };
-          else if (f === "transform") {
+          else if (b === "transform") {
             const g = h[1];
-            b = {
+            x = {
               operation: h.slice(2).join(":"),
               providerName: g,
               params: m.parameters
             };
-          } else if (f === "input")
-            b = {
+          } else if (b === "input")
+            x = {
               uploadId: void 0,
               filename: void 0,
               mime: void 0
             };
-          else if (f === "vision")
-            b = {
+          else if (b === "vision")
+            x = {
               providerName: h.slice(1).join(":"),
               params: m.parameters
             };
-          else if (f === "text") {
-            const g = h.slice(1).join(":"), z = m.parameters.jsonSchema, W = z != null && z.properties ? {
+          else if (b === "text") {
+            const g = h.slice(1).join(":"), N = m.parameters.jsonSchema, A = N != null && N.properties ? {
               type: "object",
               properties: Object.fromEntries(
-                Object.entries(z.properties).map(([x, C]) => [
-                  x,
+                Object.entries(N.properties).map(([k, L]) => [
+                  k,
                   {
-                    type: C.type || "string",
-                    description: C.description
+                    type: L.type || "string",
+                    description: L.description
                   }
                 ])
               )
             } : void 0;
-            b = {
+            x = {
               providerName: g,
               params: m.parameters,
-              outputSchema: W
+              outputSchema: A
             };
           } else
-            b = {
+            x = {
               destination: m.parameters.destination || "./output/image.png",
               provider: m.parameters.provider || "filesystem"
             };
           return {
             id: u,
-            type: f,
+            type: b,
             position: w,
-            data: b
+            data: x
           };
         }), a = t.edges.map((m) => {
-          const c = n.get(m.source) || m.source, u = n.get(m.target) || m.target, h = [m.sourceHandle, m.targetHandle].filter(Boolean).join("_");
+          const c = o.get(m.source) || m.source, u = o.get(m.target) || m.target, h = [m.sourceHandle, m.targetHandle].filter(Boolean).join("_");
           return {
             id: h ? `edge_${c}_${u}_${h}` : `edge_${c}_${u}`,
             source: c,
@@ -835,24 +835,24 @@ const k = me()(
     }
   )
 );
-function _(r) {
+function Q(r) {
   var t;
   const l = {};
   if ((t = r.params) != null && t.properties)
-    for (const [n, i] of Object.entries(r.params.properties))
-      i.default !== void 0 && (l[n] = i.default);
+    for (const [o, i] of Object.entries(r.params.properties))
+      i.default !== void 0 && (l[o] = i.default);
   return l;
 }
-function B(r) {
+function F(r) {
   return r === "running" ? "border-yellow-400 animate-pulse" : r === "completed" ? "border-green-500" : r === "error" ? "border-red-500" : "";
 }
-function X({ nodeId: r, color: l }) {
-  const t = k((i) => i.previewVisible[r] !== !1), n = k((i) => i.togglePreview);
+function ae({ nodeId: r, color: l }) {
+  const t = f((i) => i.previewVisible[r] !== !1), o = f((i) => i.togglePreview);
   return /* @__PURE__ */ e(
     "button",
     {
       onClick: (i) => {
-        i.stopPropagation(), n(r);
+        i.stopPropagation(), o(r);
       },
       className: `ml-auto p-1 rounded hover:bg-gray-200 dark:hover:bg-zinc-600 transition-colors ${t ? "opacity-100" : "opacity-40"}`,
       title: t ? "Hide preview" : "Show preview",
@@ -876,32 +876,32 @@ function X({ nodeId: r, color: l }) {
     }
   );
 }
-const Qe = E(function({
+const Qe = G(function({
   id: l,
   data: t,
-  selected: n
+  selected: o
 }) {
-  const i = k((u) => u.execution.previews[l]), s = k((u) => u.execution.nodeStatus[l]), p = k((u) => u.previewVisible[l] !== !1), a = B(s) || (n ? "border-blue-500" : "border-blue-200"), m = t.isAI, c = t.acceptsReferenceImages;
-  return /* @__PURE__ */ o(
+  const i = f((u) => u.execution.previews[l]), s = f((u) => u.execution.nodeStatus[l]), p = f((u) => u.previewVisible[l] !== !1), a = F(s) || (o ? "border-blue-500" : "border-blue-200"), m = t.isAI, c = t.acceptsReferenceImages;
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `rounded-lg border-2 bg-white dark:bg-zinc-800 shadow-md min-w-[180px] overflow-hidden ${a}`,
       children: [
         m && /* @__PURE__ */ e(
-          A,
+          P,
           {
             type: "target",
-            position: P.Top,
+            position: $.Top,
             id: "text",
             className: "w-3 h-3 !bg-pink-500",
             title: "Text input (optional prompt from text/vision node)"
           }
         ),
         c && /* @__PURE__ */ e(
-          A,
+          P,
           {
             type: "target",
-            position: P.Left,
+            position: $.Left,
             id: "references",
             className: "w-3 h-3 !bg-violet-500",
             style: { top: "50%" },
@@ -909,60 +909,60 @@ const Qe = E(function({
           }
         ),
         i && p && /* @__PURE__ */ e("div", { className: "bg-gray-100 dark:bg-zinc-900 border-b border-gray-200 dark:border-zinc-700", children: /* @__PURE__ */ e("img", { src: i, alt: "Preview", className: "w-full h-24 object-contain" }) }),
-        /* @__PURE__ */ o("div", { className: "px-4 py-3", children: [
-          /* @__PURE__ */ o("div", { className: "flex items-center gap-2 mb-2", children: [
+        /* @__PURE__ */ n("div", { className: "px-4 py-3", children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-2", children: [
             /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded-full bg-blue-500" }),
             /* @__PURE__ */ e("span", { className: "font-semibold text-sm text-blue-700 dark:text-blue-400", children: t.generatorName }),
-            /* @__PURE__ */ e(X, { nodeId: l, color: "text-blue-500 dark:text-blue-400" })
+            /* @__PURE__ */ e(ae, { nodeId: l, color: "text-blue-500 dark:text-blue-400" })
           ] }),
           m && /* @__PURE__ */ e("div", { className: "text-[10px] text-pink-500 dark:text-pink-400 mb-1", children: "↑ Connect text node for dynamic prompt" }),
           c && /* @__PURE__ */ e("div", { className: "text-[10px] text-violet-500 dark:text-violet-400 mb-1", children: "← Connect reference images" }),
-          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: Object.entries(t.params).filter(([, u]) => typeof u != "object" || u === null).slice(0, 2).map(([u, h]) => /* @__PURE__ */ o("div", { className: "truncate", children: [
+          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: Object.entries(t.params).filter(([, u]) => typeof u != "object" || u === null).slice(0, 2).map(([u, h]) => /* @__PURE__ */ n("div", { className: "truncate", children: [
             u,
             ": ",
             String(h).slice(0, 20)
           ] }, u)) })
         ] }),
-        /* @__PURE__ */ e(A, { type: "source", position: P.Right, className: "w-3 h-3 !bg-blue-500" })
+        /* @__PURE__ */ e(P, { type: "source", position: $.Right, className: "w-3 h-3 !bg-blue-500" })
       ]
     }
   );
-}), Ye = E(function({
+}), Ye = G(function({
   id: l,
   data: t,
-  selected: n
+  selected: o
 }) {
-  const i = k((u) => u.execution.previews[l]), s = k((u) => u.execution.nodeStatus[l]), p = k((u) => u.previewVisible[l] !== !1), a = B(s) || (n ? "border-teal-500" : "border-teal-200"), m = t.isAI, c = t.acceptsReferenceImages;
-  return /* @__PURE__ */ o(
+  const i = f((u) => u.execution.previews[l]), s = f((u) => u.execution.nodeStatus[l]), p = f((u) => u.previewVisible[l] !== !1), a = F(s) || (o ? "border-teal-500" : "border-teal-200"), m = t.isAI, c = t.acceptsReferenceImages;
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `rounded-lg border-2 bg-white dark:bg-zinc-800 shadow-md min-w-[180px] overflow-hidden ${a}`,
       children: [
         m && /* @__PURE__ */ e(
-          A,
+          P,
           {
             type: "target",
-            position: P.Top,
+            position: $.Top,
             id: "text",
             className: "w-3 h-3 !bg-pink-500",
             title: "Text input (optional prompt from text/vision node)"
           }
         ),
-        /* @__PURE__ */ e(A, { type: "target", position: P.Left, id: "image", className: "w-3 h-3 !bg-teal-500" }),
+        /* @__PURE__ */ e(P, { type: "target", position: $.Left, id: "image", className: "w-3 h-3 !bg-teal-500" }),
         c && /* @__PURE__ */ e(
-          A,
+          P,
           {
             type: "target",
-            position: P.Bottom,
+            position: $.Bottom,
             id: "references",
             className: "w-3 h-3 !bg-violet-500",
             title: `Reference images (up to ${t.maxReferenceImages || 13})`
           }
         ),
         i && p && /* @__PURE__ */ e("div", { className: "bg-gray-100 dark:bg-zinc-900 border-b border-gray-200 dark:border-zinc-700", children: /* @__PURE__ */ e("img", { src: i, alt: "Preview", className: "w-full h-24 object-contain" }) }),
-        /* @__PURE__ */ o("div", { className: "px-4 py-3", children: [
-          /* @__PURE__ */ o("div", { className: "flex items-center gap-2 mb-2", children: [
-            m ? /* @__PURE__ */ o("svg", { className: "w-3 h-3 text-purple-500", fill: "currentColor", viewBox: "0 0 20 20", children: [
+        /* @__PURE__ */ n("div", { className: "px-4 py-3", children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-2", children: [
+            m ? /* @__PURE__ */ n("svg", { className: "w-3 h-3 text-purple-500", fill: "currentColor", viewBox: "0 0 20 20", children: [
               /* @__PURE__ */ e("path", { d: "M13 7H7v6h6V7z" }),
               /* @__PURE__ */ e(
                 "path",
@@ -981,7 +981,7 @@ const Qe = E(function({
               }
             ),
             /* @__PURE__ */ e(
-              X,
+              ae,
               {
                 nodeId: l,
                 color: m ? "text-purple-500 dark:text-purple-400" : "text-teal-500 dark:text-teal-400"
@@ -990,25 +990,25 @@ const Qe = E(function({
           ] }),
           m && /* @__PURE__ */ e("div", { className: "text-[10px] text-pink-500 dark:text-pink-400 mb-1", children: "↑ Connect text node for dynamic prompt" }),
           c && /* @__PURE__ */ e("div", { className: "text-[10px] text-violet-500 dark:text-violet-400 mb-1", children: "↓ Connect reference images" }),
-          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: Object.entries(t.params).filter(([, u]) => typeof u != "object" || u === null).slice(0, 2).map(([u, h]) => /* @__PURE__ */ o("div", { className: "truncate", children: [
+          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: Object.entries(t.params).filter(([, u]) => typeof u != "object" || u === null).slice(0, 2).map(([u, h]) => /* @__PURE__ */ n("div", { className: "truncate", children: [
             u,
             ": ",
             String(h).slice(0, 20)
           ] }, u)) })
         ] }),
-        /* @__PURE__ */ e(A, { type: "source", position: P.Right, className: "w-3 h-3 !bg-teal-500" })
+        /* @__PURE__ */ e(P, { type: "source", position: $.Right, className: "w-3 h-3 !bg-teal-500" })
       ]
     }
   );
-}), Xe = E(function({ id: l, data: t, selected: n }) {
-  const i = k((d) => d.execution.nodeStatus[l]), p = B(i) || (n ? "border-green-500" : "border-green-200");
-  return /* @__PURE__ */ o(
+}), Xe = G(function({ id: l, data: t, selected: o }) {
+  const i = f((d) => d.execution.nodeStatus[l]), p = F(i) || (o ? "border-green-500" : "border-green-200");
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `px-4 py-3 rounded-lg border-2 bg-white dark:bg-zinc-800 shadow-md min-w-[180px] ${p}`,
       children: [
-        /* @__PURE__ */ e(A, { type: "target", position: P.Left, className: "w-3 h-3 !bg-green-500" }),
-        /* @__PURE__ */ o("div", { className: "flex items-center gap-2 mb-2", children: [
+        /* @__PURE__ */ e(P, { type: "target", position: $.Left, className: "w-3 h-3 !bg-green-500" }),
+        /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-2", children: [
           /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded-full bg-green-500" }),
           /* @__PURE__ */ e("span", { className: "font-semibold text-sm text-green-700 dark:text-green-400", children: "Save" })
         ] }),
@@ -1016,44 +1016,44 @@ const Qe = E(function({
       ]
     }
   );
-}), Ze = E(function({ id: l, data: t, selected: n }) {
-  const i = k((w) => w.execution.previews[l]), s = k((w) => w.execution.nodeStatus[l]), p = k((w) => w.previewVisible[l] !== !1), d = k((w) => w.updateNodeData), a = Q(null), c = B(s) || (n ? "border-amber-500" : "border-amber-200"), u = L(
+}), Ze = G(function({ id: l, data: t, selected: o }) {
+  const i = f((w) => w.execution.previews[l]), s = f((w) => w.execution.nodeStatus[l]), p = f((w) => w.previewVisible[l] !== !1), d = f((w) => w.updateNodeData), a = te(null), c = F(s) || (o ? "border-amber-500" : "border-amber-200"), u = W(
     async (w) => {
       try {
-        const b = await Ve(w);
+        const x = await Ve(w);
         d(l, {
-          uploadId: b.id,
-          filename: b.filename,
-          mime: b.mime
+          uploadId: x.id,
+          filename: x.filename,
+          mime: x.mime
         });
-      } catch (b) {
-        console.error("Upload failed:", b);
+      } catch (x) {
+        console.error("Upload failed:", x);
       }
     },
     [l, d]
-  ), h = L(
+  ), h = W(
     (w) => {
       w.preventDefault(), w.stopPropagation();
-      const b = w.dataTransfer.files[0];
-      b && b.type.startsWith("image/") && u(b);
+      const x = w.dataTransfer.files[0];
+      x && x.type.startsWith("image/") && u(x);
     },
     [u]
-  ), f = L((w) => {
+  ), b = W((w) => {
     w.preventDefault(), w.stopPropagation();
-  }, []), y = L(
+  }, []), y = W(
     (w) => {
       var g;
-      const b = (g = w.target.files) == null ? void 0 : g[0];
-      b && u(b);
+      const x = (g = w.target.files) == null ? void 0 : g[0];
+      x && u(x);
     },
     [u]
-  ), v = i || (t.uploadId ? ue(t.uploadId) : null);
-  return /* @__PURE__ */ o(
+  ), v = i || (t.uploadId ? he(t.uploadId) : null);
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `rounded-lg border-2 bg-white dark:bg-zinc-800 shadow-md min-w-[180px] overflow-hidden ${c}`,
       onDrop: h,
-      onDragOver: f,
+      onDragOver: b,
       children: [
         v && p ? /* @__PURE__ */ e("div", { className: "bg-gray-100 dark:bg-zinc-900 border-b border-gray-200 dark:border-zinc-700", children: /* @__PURE__ */ e("img", { src: v, alt: "Uploaded", className: "w-full h-24 object-contain" }) }) : v ? null : /* @__PURE__ */ e(
           "div",
@@ -1063,7 +1063,7 @@ const Qe = E(function({
               var w;
               return (w = a.current) == null ? void 0 : w.click();
             },
-            children: /* @__PURE__ */ o("div", { className: "text-center text-amber-600 dark:text-amber-400", children: [
+            children: /* @__PURE__ */ n("div", { className: "text-center text-amber-600 dark:text-amber-400", children: [
               /* @__PURE__ */ e("div", { className: "text-2xl mb-1", children: "+" }),
               /* @__PURE__ */ e("div", { className: "text-xs", children: "Drop image or click" })
             ] })
@@ -1079,41 +1079,41 @@ const Qe = E(function({
             onChange: y
           }
         ),
-        /* @__PURE__ */ o("div", { className: "px-4 py-3", children: [
-          /* @__PURE__ */ o("div", { className: "flex items-center gap-2 mb-2", children: [
+        /* @__PURE__ */ n("div", { className: "px-4 py-3", children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-2", children: [
             /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded-full bg-amber-500" }),
             /* @__PURE__ */ e("span", { className: "font-semibold text-sm text-amber-700 dark:text-amber-400", children: "Input" }),
-            /* @__PURE__ */ e(X, { nodeId: l, color: "text-amber-500 dark:text-amber-400" })
+            /* @__PURE__ */ e(ae, { nodeId: l, color: "text-amber-500 dark:text-amber-400" })
           ] }),
           /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 truncate", children: t.filename || "No image selected" })
         ] }),
-        /* @__PURE__ */ e(A, { type: "source", position: P.Right, className: "w-3 h-3 !bg-amber-500" })
+        /* @__PURE__ */ e(P, { type: "source", position: $.Right, className: "w-3 h-3 !bg-amber-500" })
       ]
     }
   );
-}), et = E(function({
+}), et = G(function({
   id: l,
   data: t,
-  selected: n
+  selected: o
 }) {
   var c, u, h;
-  const i = k((f) => f.execution.nodeStatus[l]), s = k((f) => {
+  const i = f((b) => b.execution.nodeStatus[l]), s = f((b) => {
     var y;
-    return (y = f.execution.dataOutputs) == null ? void 0 : y[l];
-  }), d = B(i) || (n ? "border-cyan-500" : "border-cyan-200"), a = (c = t.outputSchema) != null && c.properties ? Object.entries(t.outputSchema.properties) : [], m = a.length > 0;
-  return /* @__PURE__ */ o(
+    return (y = b.execution.dataOutputs) == null ? void 0 : y[l];
+  }), d = F(i) || (o ? "border-cyan-500" : "border-cyan-200"), a = (c = t.outputSchema) != null && c.properties ? Object.entries(t.outputSchema.properties) : [], m = a.length > 0;
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `rounded-lg border-2 bg-white dark:bg-zinc-800 shadow-md min-w-[180px] overflow-hidden ${d}`,
       children: [
-        /* @__PURE__ */ e(A, { type: "target", position: P.Left, className: "w-3 h-3 !bg-cyan-500" }),
-        s && /* @__PURE__ */ e("div", { className: "bg-cyan-50 dark:bg-cyan-900/30 border-b border-cyan-100 dark:border-cyan-800 p-2 max-h-24 overflow-auto", children: /* @__PURE__ */ o("pre", { className: "text-xs text-cyan-800 dark:text-cyan-200 whitespace-pre-wrap", children: [
+        /* @__PURE__ */ e(P, { type: "target", position: $.Left, className: "w-3 h-3 !bg-cyan-500" }),
+        s && /* @__PURE__ */ e("div", { className: "bg-cyan-50 dark:bg-cyan-900/30 border-b border-cyan-100 dark:border-cyan-800 p-2 max-h-24 overflow-auto", children: /* @__PURE__ */ n("pre", { className: "text-xs text-cyan-800 dark:text-cyan-200 whitespace-pre-wrap", children: [
           (u = s.content) == null ? void 0 : u.slice(0, 200),
           (((h = s.content) == null ? void 0 : h.length) || 0) > 200 && "..."
         ] }) }),
-        /* @__PURE__ */ o("div", { className: "px-4 py-3", children: [
-          /* @__PURE__ */ o("div", { className: "flex items-center gap-2 mb-2", children: [
-            /* @__PURE__ */ o("svg", { className: "w-3 h-3 text-cyan-500", fill: "currentColor", viewBox: "0 0 20 20", children: [
+        /* @__PURE__ */ n("div", { className: "px-4 py-3", children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-2", children: [
+            /* @__PURE__ */ n("svg", { className: "w-3 h-3 text-cyan-500", fill: "currentColor", viewBox: "0 0 20 20", children: [
               /* @__PURE__ */ e("path", { d: "M10 12a2 2 0 100-4 2 2 0 000 4z" }),
               /* @__PURE__ */ e(
                 "path",
@@ -1126,73 +1126,73 @@ const Qe = E(function({
             ] }),
             /* @__PURE__ */ e("span", { className: "font-semibold text-sm text-cyan-700 dark:text-cyan-400", children: t.providerLabel || t.providerName })
           ] }),
-          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: t.params.prompt ? /* @__PURE__ */ o("div", { className: "truncate", children: [
+          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: t.params.prompt ? /* @__PURE__ */ n("div", { className: "truncate", children: [
             String(t.params.prompt).slice(0, 30),
             "..."
           ] }) : null }),
-          m && /* @__PURE__ */ o("div", { className: "mt-2 pt-2 border-t border-cyan-200 dark:border-cyan-800", children: [
+          m && /* @__PURE__ */ n("div", { className: "mt-2 pt-2 border-t border-cyan-200 dark:border-cyan-800", children: [
             /* @__PURE__ */ e("div", { className: "text-[10px] text-cyan-500 dark:text-cyan-400 font-medium mb-1", children: "Outputs:" }),
-            a.map(([f]) => /* @__PURE__ */ o(
+            a.map(([b]) => /* @__PURE__ */ n(
               "div",
               {
                 className: "text-[10px] text-gray-500 dark:text-zinc-400 flex items-center gap-1",
                 children: [
                   /* @__PURE__ */ e("span", { className: "w-1.5 h-1.5 rounded-full bg-cyan-400" }),
-                  f
+                  b
                 ]
               },
-              f
+              b
             ))
           ] })
         ] }),
-        m ? /* @__PURE__ */ o(U, { children: [
+        m ? /* @__PURE__ */ n(B, { children: [
           /* @__PURE__ */ e(
-            A,
+            P,
             {
               type: "source",
-              position: P.Right,
+              position: $.Right,
               id: "output",
               className: "w-3 h-3 !bg-cyan-500",
               style: { top: "50%" },
               title: "Full JSON output"
             }
           ),
-          a.map(([f, y], v) => /* @__PURE__ */ e(
-            A,
+          a.map(([b, y], v) => /* @__PURE__ */ e(
+            P,
             {
               type: "source",
-              position: P.Right,
-              id: `output.${f}`,
+              position: $.Right,
+              id: `output.${b}`,
               className: "w-2.5 h-2.5 !bg-cyan-400",
               style: {
                 top: `${70 + v * 14}%`
               },
-              title: `${f}: ${y.description || y.type}`
+              title: `${b}: ${y.description || y.type}`
             },
-            f
+            b
           ))
-        ] }) : /* @__PURE__ */ e(A, { type: "source", position: P.Right, className: "w-3 h-3 !bg-cyan-500" })
+        ] }) : /* @__PURE__ */ e(P, { type: "source", position: $.Right, className: "w-3 h-3 !bg-cyan-500" })
       ]
     }
   );
-}), tt = E(function({ id: l, data: t, selected: n }) {
+}), tt = G(function({ id: l, data: t, selected: o }) {
   var c, u, h;
-  const i = k((f) => f.execution.nodeStatus[l]), s = k((f) => {
+  const i = f((b) => b.execution.nodeStatus[l]), s = f((b) => {
     var y;
-    return (y = f.execution.dataOutputs) == null ? void 0 : y[l];
-  }), d = B(i) || (n ? "border-pink-500" : "border-pink-200"), a = (c = t.outputSchema) != null && c.properties ? Object.entries(t.outputSchema.properties) : [], m = a.length > 0;
-  return /* @__PURE__ */ o(
+    return (y = b.execution.dataOutputs) == null ? void 0 : y[l];
+  }), d = F(i) || (o ? "border-pink-500" : "border-pink-200"), a = (c = t.outputSchema) != null && c.properties ? Object.entries(t.outputSchema.properties) : [], m = a.length > 0;
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `rounded-lg border-2 bg-white dark:bg-zinc-800 shadow-md min-w-[180px] overflow-hidden ${d}`,
       children: [
-        /* @__PURE__ */ e(A, { type: "target", position: P.Left, className: "w-3 h-3 !bg-pink-500" }),
-        s && /* @__PURE__ */ e("div", { className: "bg-pink-50 dark:bg-pink-900/30 border-b border-pink-100 dark:border-pink-800 p-2 max-h-24 overflow-auto", children: /* @__PURE__ */ o("pre", { className: "text-xs text-pink-800 dark:text-pink-200 whitespace-pre-wrap", children: [
+        /* @__PURE__ */ e(P, { type: "target", position: $.Left, className: "w-3 h-3 !bg-pink-500" }),
+        s && /* @__PURE__ */ e("div", { className: "bg-pink-50 dark:bg-pink-900/30 border-b border-pink-100 dark:border-pink-800 p-2 max-h-24 overflow-auto", children: /* @__PURE__ */ n("pre", { className: "text-xs text-pink-800 dark:text-pink-200 whitespace-pre-wrap", children: [
           (u = s.content) == null ? void 0 : u.slice(0, 200),
           (((h = s.content) == null ? void 0 : h.length) || 0) > 200 && "..."
         ] }) }),
-        /* @__PURE__ */ o("div", { className: "px-4 py-3", children: [
-          /* @__PURE__ */ o("div", { className: "flex items-center gap-2 mb-2", children: [
+        /* @__PURE__ */ n("div", { className: "px-4 py-3", children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center gap-2 mb-2", children: [
             /* @__PURE__ */ e("svg", { className: "w-3 h-3 text-pink-500", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ e(
               "path",
               {
@@ -1203,52 +1203,52 @@ const Qe = E(function({
             ) }),
             /* @__PURE__ */ e("span", { className: "font-semibold text-sm text-pink-700 dark:text-pink-400", children: t.providerLabel || t.providerName })
           ] }),
-          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: t.params.prompt ? /* @__PURE__ */ o("div", { className: "truncate", children: [
+          /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400", children: t.params.prompt ? /* @__PURE__ */ n("div", { className: "truncate", children: [
             String(t.params.prompt).slice(0, 30),
             "..."
           ] }) : null }),
-          m && /* @__PURE__ */ o("div", { className: "mt-2 pt-2 border-t border-pink-200 dark:border-pink-800", children: [
+          m && /* @__PURE__ */ n("div", { className: "mt-2 pt-2 border-t border-pink-200 dark:border-pink-800", children: [
             /* @__PURE__ */ e("div", { className: "text-[10px] text-pink-500 dark:text-pink-400 font-medium mb-1", children: "Outputs:" }),
-            a.map(([f]) => /* @__PURE__ */ o(
+            a.map(([b]) => /* @__PURE__ */ n(
               "div",
               {
                 className: "text-[10px] text-gray-500 dark:text-zinc-400 flex items-center gap-1",
                 children: [
                   /* @__PURE__ */ e("span", { className: "w-1.5 h-1.5 rounded-full bg-pink-400" }),
-                  f
+                  b
                 ]
               },
-              f
+              b
             ))
           ] })
         ] }),
-        m ? /* @__PURE__ */ o(U, { children: [
+        m ? /* @__PURE__ */ n(B, { children: [
           /* @__PURE__ */ e(
-            A,
+            P,
             {
               type: "source",
-              position: P.Right,
+              position: $.Right,
               id: "output",
               className: "w-3 h-3 !bg-pink-500",
               style: { top: "50%" },
               title: "Full JSON output"
             }
           ),
-          a.map(([f, y], v) => /* @__PURE__ */ e(
-            A,
+          a.map(([b, y], v) => /* @__PURE__ */ e(
+            P,
             {
               type: "source",
-              position: P.Right,
-              id: `output.${f}`,
+              position: $.Right,
+              id: `output.${b}`,
               className: "w-2.5 h-2.5 !bg-pink-400",
               style: {
                 top: `${70 + v * 14}%`
               },
-              title: `${f}: ${y.description || y.type}`
+              title: `${b}: ${y.description || y.type}`
             },
-            f
+            b
           ))
-        ] }) : /* @__PURE__ */ e(A, { type: "source", position: P.Right, className: "w-3 h-3 !bg-pink-500" })
+        ] }) : /* @__PURE__ */ e(P, { type: "source", position: $.Right, className: "w-3 h-3 !bg-pink-500" })
       ]
     }
   );
@@ -1273,41 +1273,41 @@ const Qe = E(function({
     strokeWidth: 2
   }
 };
-function nt() {
-  const r = k((h) => h.nodes), l = k((h) => h.edges), t = k((h) => h.setNodes), n = k((h) => h.setEdges), i = k((h) => h.addEdge), s = k((h) => h.setSelectedNode), p = L(
+function ot() {
+  const r = f((h) => h.nodes), l = f((h) => h.edges), t = f((h) => h.setNodes), o = f((h) => h.setEdges), i = f((h) => h.addEdge), s = f((h) => h.setSelectedNode), p = W(
     (h) => {
-      const { source: f, target: y } = h;
-      if (!f || !y) return !1;
-      const v = r.find((g) => g.id === f), w = r.find((g) => g.id === y);
+      const { source: b, target: y } = h;
+      if (!b || !y) return !1;
+      const v = r.find((g) => g.id === b), w = r.find((g) => g.id === y);
       return !(!v || !w || v.type === "save" || w.type === "generator" || w.type === "input" || l.find(
         (g) => g.target === y && g.targetHandle === h.targetHandle
-      ) || f === y);
+      ) || b === y);
     },
     [r, l]
-  ), d = L(
+  ), d = W(
     (h) => {
       t(ze(h, r));
     },
     [r, t]
-  ), a = L(
+  ), a = W(
     (h) => {
-      n(Ce(h, l));
+      o(Ce(h, l));
     },
-    [l, n]
-  ), m = L(
+    [l, o]
+  ), m = W(
     (h) => {
       i(h);
     },
     [i]
-  ), c = L(
-    (h, f) => {
-      s(f.id);
+  ), c = W(
+    (h, b) => {
+      s(b.id);
     },
     [s]
-  ), u = L(() => {
+  ), u = W(() => {
     s(null);
   }, [s]);
-  return /* @__PURE__ */ e("div", { className: "h-full w-full", children: /* @__PURE__ */ o(
+  return /* @__PURE__ */ e("div", { className: "h-full w-full", children: /* @__PURE__ */ n(
     Ne,
     {
       nodes: r,
@@ -1335,8 +1335,8 @@ function nt() {
     }
   ) });
 }
-function ot({ onSelect: r }) {
-  const [l, t] = I([]), [n, i] = I(!0), [s, p] = I(null), d = async () => {
+function nt({ onSelect: r }) {
+  const [l, t] = C([]), [o, i] = C(!0), [s, p] = C(null), d = async () => {
     try {
       i(!0);
       const c = await Ge();
@@ -1347,18 +1347,18 @@ function ot({ onSelect: r }) {
       i(!1);
     }
   };
-  D(() => {
+  U(() => {
     d();
   }, []);
   const a = async (c, u) => {
     if (u.stopPropagation(), !!confirm("Delete this upload?"))
       try {
-        await Fe(c), t((h) => h.filter((f) => f.id !== c));
+        await Fe(c), t((h) => h.filter((b) => b.id !== c));
       } catch (h) {
         console.error("Failed to delete:", h);
       }
   }, m = (c) => c < 1024 ? `${c} B` : c < 1024 * 1024 ? `${(c / 1024).toFixed(1)} KB` : `${(c / (1024 * 1024)).toFixed(1)} MB`;
-  return n ? /* @__PURE__ */ e("div", { className: "p-4 text-center text-gray-500 dark:text-zinc-400", children: "Loading uploads..." }) : s ? /* @__PURE__ */ o("div", { className: "p-4 text-center text-red-500 dark:text-red-400", children: [
+  return o ? /* @__PURE__ */ e("div", { className: "p-4 text-center text-gray-500 dark:text-zinc-400", children: "Loading uploads..." }) : s ? /* @__PURE__ */ n("div", { className: "p-4 text-center text-red-500 dark:text-red-400", children: [
     s,
     /* @__PURE__ */ e(
       "button",
@@ -1368,7 +1368,7 @@ function ot({ onSelect: r }) {
         children: "Retry"
       }
     )
-  ] }) : l.length === 0 ? /* @__PURE__ */ e("div", { className: "p-4 text-center text-gray-500 dark:text-zinc-400", children: "No uploads yet. Drag an image onto an Input node to upload." }) : /* @__PURE__ */ e("div", { className: "p-2", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-2", children: l.map((c) => /* @__PURE__ */ o(
+  ] }) : l.length === 0 ? /* @__PURE__ */ e("div", { className: "p-4 text-center text-gray-500 dark:text-zinc-400", children: "No uploads yet. Drag an image onto an Input node to upload." }) : /* @__PURE__ */ e("div", { className: "p-2", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-2 gap-2", children: l.map((c) => /* @__PURE__ */ n(
     "div",
     {
       className: "relative group rounded border border-gray-200 dark:border-zinc-700 overflow-hidden cursor-pointer hover:border-amber-400 dark:hover:border-amber-500 transition-colors",
@@ -1377,7 +1377,7 @@ function ot({ onSelect: r }) {
         /* @__PURE__ */ e(
           "img",
           {
-            src: ue(c.id),
+            src: he(c.id),
             alt: c.filename,
             className: "w-full h-20 object-cover"
           }
@@ -1398,33 +1398,33 @@ function ot({ onSelect: r }) {
   )) }) });
 }
 function st() {
-  const r = k((x) => x.setGenerators), l = k((x) => x.setTransforms), t = k((x) => x.setTextProviders), n = k((x) => x.setVisionProviders), i = k((x) => x.generators), s = k((x) => x.transforms), p = k((x) => x.textProviders), d = k((x) => x.visionProviders), a = k((x) => x.addNode), [m, c] = I(!1), { data: u } = F({
+  const r = f((k) => k.setGenerators), l = f((k) => k.setTransforms), t = f((k) => k.setTextProviders), o = f((k) => k.setVisionProviders), i = f((k) => k.generators), s = f((k) => k.transforms), p = f((k) => k.textProviders), d = f((k) => k.visionProviders), a = f((k) => k.addNode), [m, c] = C(!1), { data: u } = K({
     queryKey: ["generators"],
-    queryFn: je
-  }), { data: h } = F({
+    queryFn: Me
+  }), { data: h } = K({
     queryKey: ["transforms"],
     queryFn: De
-  }), { data: f } = F({
+  }), { data: b } = K({
     queryKey: ["textProviders"],
     queryFn: Te
-  }), { data: y } = F({
+  }), { data: y } = K({
     queryKey: ["visionProviders"],
     queryFn: Ue
   });
-  D(() => {
+  U(() => {
     u && r(u);
-  }, [u, r]), D(() => {
+  }, [u, r]), U(() => {
     h && l(h);
-  }, [h, l]), D(() => {
-    f && t(f);
-  }, [f, t]), D(() => {
-    y && n(y);
-  }, [y, n]);
-  const v = (x, C) => {
-    x.dataTransfer.setData("application/json", JSON.stringify(C)), x.dataTransfer.effectAllowed = "move";
-  }, w = (x) => {
-    a(x, { x: 250, y: 150 + Math.random() * 100 });
-  }, b = {
+  }, [h, l]), U(() => {
+    b && t(b);
+  }, [b, t]), U(() => {
+    y && o(y);
+  }, [y, o]);
+  const v = (k, L) => {
+    k.dataTransfer.setData("application/json", JSON.stringify(L)), k.dataTransfer.effectAllowed = "move";
+  }, w = (k) => {
+    a(k, { x: 250, y: 150 + Math.random() * 100 });
+  }, x = {
     id: "input:upload",
     type: "input",
     name: "upload",
@@ -1456,25 +1456,25 @@ function st() {
         }
       }
     }
-  }, z = i.reduce(
-    (x, C) => {
-      const S = C.category || "Other";
-      return x[S] || (x[S] = []), x[S].push(C), x;
+  }, N = i.reduce(
+    (k, L) => {
+      const S = L.category || "Other";
+      return k[S] || (k[S] = []), k[S].push(L), k;
     },
     {}
-  ), W = s.reduce(
-    (x, C) => {
-      const S = C.category || "Other";
-      return x[S] || (x[S] = []), x[S].push(C), x;
+  ), A = s.reduce(
+    (k, L) => {
+      const S = L.category || "Other";
+      return k[S] || (k[S] = []), k[S].push(L), k;
     },
     {}
   );
-  return /* @__PURE__ */ e("div", { className: "w-64 bg-gray-50 dark:bg-zinc-800 border-r border-gray-200 dark:border-zinc-700 overflow-y-auto", children: /* @__PURE__ */ o("div", { className: "p-4", children: [
+  return /* @__PURE__ */ e("div", { className: "w-64 bg-gray-50 dark:bg-zinc-800 border-r border-gray-200 dark:border-zinc-700 overflow-y-auto", children: /* @__PURE__ */ n("div", { className: "p-4", children: [
     /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-gray-800 dark:text-white mb-4", children: "Nodes" }),
-    /* @__PURE__ */ o("div", { className: "mb-6", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center justify-between mb-2", children: [
+    /* @__PURE__ */ n("div", { className: "mb-6", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-2", children: [
         /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-amber-600 dark:text-amber-400 uppercase tracking-wide", children: "Input" }),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ n(
           "button",
           {
             onClick: () => c(!m),
@@ -1486,12 +1486,12 @@ function st() {
           }
         )
       ] }),
-      /* @__PURE__ */ o(
+      /* @__PURE__ */ n(
         "div",
         {
           draggable: !0,
-          onDragStart: (x) => v(x, b),
-          onDoubleClick: () => w(b),
+          onDragStart: (k) => v(k, x),
+          onDoubleClick: () => w(x),
           className: "px-3 py-2 bg-amber-50 dark:bg-amber-900/30 border border-amber-200 dark:border-amber-700 rounded cursor-grab active:cursor-grabbing hover:bg-amber-100 dark:hover:bg-amber-900/50 transition-colors",
           children: [
             /* @__PURE__ */ e("div", { className: "text-sm font-medium text-amber-700 dark:text-amber-300", children: "Upload Image" }),
@@ -1499,17 +1499,17 @@ function st() {
           ]
         }
       ),
-      m && /* @__PURE__ */ e("div", { className: "mt-2 border border-amber-200 dark:border-amber-700 rounded bg-white dark:bg-zinc-900 max-h-64 overflow-y-auto", children: /* @__PURE__ */ e(ot, {}) })
+      m && /* @__PURE__ */ e("div", { className: "mt-2 border border-amber-200 dark:border-amber-700 rounded bg-white dark:bg-zinc-900 max-h-64 overflow-y-auto", children: /* @__PURE__ */ e(nt, {}) })
     ] }),
-    /* @__PURE__ */ o("div", { className: "mb-6", children: [
+    /* @__PURE__ */ n("div", { className: "mb-6", children: [
       /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-blue-600 dark:text-blue-400 uppercase tracking-wide mb-2", children: "Generators" }),
-      Object.entries(z).map(([x, C]) => /* @__PURE__ */ o("div", { className: "mb-3", children: [
-        /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 mb-1", children: x }),
-        C.map((S) => /* @__PURE__ */ o(
+      Object.entries(N).map(([k, L]) => /* @__PURE__ */ n("div", { className: "mb-3", children: [
+        /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 mb-1", children: k }),
+        L.map((S) => /* @__PURE__ */ n(
           "div",
           {
             draggable: !0,
-            onDragStart: (T) => v(T, S),
+            onDragStart: (R) => v(R, S),
             onDoubleClick: () => w(S),
             className: "px-3 py-2 bg-blue-50 dark:bg-blue-900/30 border border-blue-200 dark:border-blue-700 rounded mb-1 cursor-grab active:cursor-grabbing hover:bg-blue-100 dark:hover:bg-blue-900/50 transition-colors",
             children: [
@@ -1519,17 +1519,17 @@ function st() {
           },
           S.id
         ))
-      ] }, x))
+      ] }, k))
     ] }),
-    /* @__PURE__ */ o("div", { className: "mb-6", children: [
+    /* @__PURE__ */ n("div", { className: "mb-6", children: [
       /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-teal-600 dark:text-teal-400 uppercase tracking-wide mb-2", children: "Transforms" }),
-      Object.entries(W).map(([x, C]) => /* @__PURE__ */ o("div", { className: "mb-3", children: [
-        /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 mb-1", children: x }),
-        C.map((S) => /* @__PURE__ */ o(
+      Object.entries(A).map(([k, L]) => /* @__PURE__ */ n("div", { className: "mb-3", children: [
+        /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 mb-1", children: k }),
+        L.map((S) => /* @__PURE__ */ n(
           "div",
           {
             draggable: !0,
-            onDragStart: (T) => v(T, S),
+            onDragStart: (R) => v(R, S),
             onDoubleClick: () => w(S),
             className: "px-3 py-2 bg-teal-50 dark:bg-teal-900/30 border border-teal-200 dark:border-teal-700 rounded mb-1 cursor-grab active:cursor-grabbing hover:bg-teal-100 dark:hover:bg-teal-900/50 transition-colors",
             children: [
@@ -1539,49 +1539,49 @@ function st() {
           },
           S.id
         ))
-      ] }, x))
+      ] }, k))
     ] }),
-    p.length > 0 && /* @__PURE__ */ o("div", { className: "mb-6", children: [
+    p.length > 0 && /* @__PURE__ */ n("div", { className: "mb-6", children: [
       /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-pink-600 dark:text-pink-400 uppercase tracking-wide mb-2", children: "AI Text" }),
-      p.map((x) => /* @__PURE__ */ o(
+      p.map((k) => /* @__PURE__ */ n(
         "div",
         {
           draggable: !0,
-          onDragStart: (C) => v(C, x),
-          onDoubleClick: () => w(x),
+          onDragStart: (L) => v(L, k),
+          onDoubleClick: () => w(k),
           className: "px-3 py-2 bg-pink-50 dark:bg-pink-900/30 border border-pink-200 dark:border-pink-700 rounded mb-1 cursor-grab active:cursor-grabbing hover:bg-pink-100 dark:hover:bg-pink-900/50 transition-colors",
           children: [
-            /* @__PURE__ */ e("div", { className: "text-sm font-medium text-pink-700 dark:text-pink-300", children: x.label }),
-            x.description && /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 truncate", children: x.description })
+            /* @__PURE__ */ e("div", { className: "text-sm font-medium text-pink-700 dark:text-pink-300", children: k.label }),
+            k.description && /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 truncate", children: k.description })
           ]
         },
-        x.id
+        k.id
       ))
     ] }),
-    d.length > 0 && /* @__PURE__ */ o("div", { className: "mb-6", children: [
+    d.length > 0 && /* @__PURE__ */ n("div", { className: "mb-6", children: [
       /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-cyan-600 dark:text-cyan-400 uppercase tracking-wide mb-2", children: "AI Vision" }),
-      d.map((x) => /* @__PURE__ */ o(
+      d.map((k) => /* @__PURE__ */ n(
         "div",
         {
           draggable: !0,
-          onDragStart: (C) => v(C, x),
-          onDoubleClick: () => w(x),
+          onDragStart: (L) => v(L, k),
+          onDoubleClick: () => w(k),
           className: "px-3 py-2 bg-cyan-50 dark:bg-cyan-900/30 border border-cyan-200 dark:border-cyan-700 rounded mb-1 cursor-grab active:cursor-grabbing hover:bg-cyan-100 dark:hover:bg-cyan-900/50 transition-colors",
           children: [
-            /* @__PURE__ */ e("div", { className: "text-sm font-medium text-cyan-700 dark:text-cyan-300", children: x.label }),
-            x.description && /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 truncate", children: x.description })
+            /* @__PURE__ */ e("div", { className: "text-sm font-medium text-cyan-700 dark:text-cyan-300", children: k.label }),
+            k.description && /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 dark:text-zinc-400 truncate", children: k.description })
           ]
         },
-        x.id
+        k.id
       ))
     ] }),
-    /* @__PURE__ */ o("div", { className: "mb-6", children: [
+    /* @__PURE__ */ n("div", { className: "mb-6", children: [
       /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-green-600 dark:text-green-400 uppercase tracking-wide mb-2", children: "Output" }),
-      /* @__PURE__ */ o(
+      /* @__PURE__ */ n(
         "div",
         {
           draggable: !0,
-          onDragStart: (x) => v(x, g),
+          onDragStart: (k) => v(k, g),
           onDoubleClick: () => w(g),
           className: "px-3 py-2 bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-700 rounded cursor-grab active:cursor-grabbing hover:bg-green-100 dark:hover:bg-green-900/50 transition-colors",
           children: [
@@ -1594,17 +1594,17 @@ function st() {
   ] }) });
 }
 function it() {
-  var f, y, v, w;
-  const r = k((b) => b.selectedNodeId), l = k((b) => b.nodes), t = k((b) => b.generators), n = k((b) => b.transforms), i = k((b) => b.textProviders), s = k((b) => b.visionProviders), p = k((b) => b.updateNodeData), d = k((b) => b.deleteNode), a = l.find((b) => b.id === r);
+  var b, y, v, w;
+  const r = f((x) => x.selectedNodeId), l = f((x) => x.nodes), t = f((x) => x.generators), o = f((x) => x.transforms), i = f((x) => x.textProviders), s = f((x) => x.visionProviders), p = f((x) => x.updateNodeData), d = f((x) => x.deleteNode), a = l.find((x) => x.id === r);
   if (!a)
     return /* @__PURE__ */ e("div", { className: "w-80 bg-gray-50 dark:bg-zinc-800 border-l border-gray-200 dark:border-zinc-700 p-4", children: /* @__PURE__ */ e("div", { className: "text-gray-500 dark:text-zinc-400 text-sm", children: "Select a node to edit its properties" }) });
   let m, c = "";
   if (a.type === "generator") {
-    const b = a.data, g = t.find((z) => z.name === b.generatorName);
-    m = (f = g == null ? void 0 : g.params) == null ? void 0 : f.properties, c = (g == null ? void 0 : g.label) || b.generatorName;
+    const x = a.data, g = t.find((N) => N.name === x.generatorName);
+    m = (b = g == null ? void 0 : g.params) == null ? void 0 : b.properties, c = (g == null ? void 0 : g.label) || x.generatorName;
   } else if (a.type === "transform") {
-    const b = a.data, g = n.find((z) => z.name === b.operation);
-    m = (y = g == null ? void 0 : g.params) == null ? void 0 : y.properties, c = (g == null ? void 0 : g.label) || b.operation;
+    const x = a.data, g = o.find((N) => N.name === x.operation);
+    m = (y = g == null ? void 0 : g.params) == null ? void 0 : y.properties, c = (g == null ? void 0 : g.label) || x.operation;
   } else if (a.type === "save") {
     const g = a.data.provider === "floimg-cloud";
     c = g ? "Save to FloImg Cloud" : "Save", m = {
@@ -1615,50 +1615,50 @@ function it() {
       }
     };
   } else if (a.type === "text") {
-    const b = a.data, g = i.find((z) => z.name === b.providerName);
-    m = (v = g == null ? void 0 : g.params) == null ? void 0 : v.properties, c = (g == null ? void 0 : g.label) || b.providerName;
+    const x = a.data, g = i.find((N) => N.name === x.providerName);
+    m = (v = g == null ? void 0 : g.params) == null ? void 0 : v.properties, c = (g == null ? void 0 : g.label) || x.providerName;
   } else if (a.type === "vision") {
-    const b = a.data, g = s.find((z) => z.name === b.providerName);
-    m = (w = g == null ? void 0 : g.params) == null ? void 0 : w.properties, c = (g == null ? void 0 : g.label) || b.providerName;
+    const x = a.data, g = s.find((N) => N.name === x.providerName);
+    m = (w = g == null ? void 0 : g.params) == null ? void 0 : w.properties, c = (g == null ? void 0 : g.label) || x.providerName;
   }
-  const u = (b, g) => {
+  const u = (x, g) => {
     if (a.type === "generator") {
-      const z = a.data;
+      const N = a.data;
       p(a.id, {
-        params: { ...z.params, [b]: g }
+        params: { ...N.params, [x]: g }
       });
     } else if (a.type === "transform") {
-      const z = a.data;
+      const N = a.data;
       p(a.id, {
-        params: { ...z.params, [b]: g }
+        params: { ...N.params, [x]: g }
       });
     } else if (a.type === "save")
-      p(a.id, { [b]: g });
+      p(a.id, { [x]: g });
     else if (a.type === "text") {
-      const z = a.data;
+      const N = a.data;
       p(a.id, {
-        params: { ...z.params, [b]: g }
+        params: { ...N.params, [x]: g }
       });
     } else if (a.type === "vision") {
-      const z = a.data;
+      const N = a.data;
       p(a.id, {
-        params: { ...z.params, [b]: g }
+        params: { ...N.params, [x]: g }
       });
     }
-  }, h = (b) => {
+  }, h = (x) => {
     if (a.type === "generator")
-      return a.data.params[b];
+      return a.data.params[x];
     if (a.type === "transform")
-      return a.data.params[b];
+      return a.data.params[x];
     if (a.type === "save")
-      return a.data[b];
+      return a.data[x];
     if (a.type === "text")
-      return a.data.params[b];
+      return a.data.params[x];
     if (a.type === "vision")
-      return a.data.params[b];
+      return a.data.params[x];
   };
-  return /* @__PURE__ */ e("div", { className: "w-80 bg-gray-50 dark:bg-zinc-800 border-l border-gray-200 dark:border-zinc-700 overflow-y-auto", children: /* @__PURE__ */ o("div", { className: "p-4", children: [
-    /* @__PURE__ */ o("div", { className: "flex items-center justify-between mb-4", children: [
+  return /* @__PURE__ */ e("div", { className: "w-80 bg-gray-50 dark:bg-zinc-800 border-l border-gray-200 dark:border-zinc-700 overflow-y-auto", children: /* @__PURE__ */ n("div", { className: "p-4", children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-4", children: [
       /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-gray-800 dark:text-white", children: c }),
       /* @__PURE__ */ e(
         "button",
@@ -1669,15 +1669,15 @@ function it() {
         }
       )
     ] }),
-    /* @__PURE__ */ e("div", { className: "space-y-4", children: m && Object.entries(m).map(([b, g]) => /* @__PURE__ */ e(
+    /* @__PURE__ */ e("div", { className: "space-y-4", children: m && Object.entries(m).map(([x, g]) => /* @__PURE__ */ e(
       lt,
       {
-        name: b,
+        name: x,
         field: g,
-        value: h(b),
-        onChange: (z) => u(b, z)
+        value: h(x),
+        onChange: (N) => u(x, N)
       },
-      b
+      x
     )) }),
     (a.type === "text" || a.type === "vision") && /* @__PURE__ */ e(
       dt,
@@ -1689,15 +1689,15 @@ function it() {
     )
   ] }) });
 }
-function lt({ name: r, field: l, value: t, onChange: n }) {
+function lt({ name: r, field: l, value: t, onChange: o }) {
   const i = l.title || r, s = "w-full px-3 py-2 border border-gray-300 dark:border-zinc-600 rounded-md shadow-sm focus:ring-teal-500 focus:border-teal-500 bg-white dark:bg-zinc-900 text-gray-900 dark:text-zinc-100";
-  return l.enum ? /* @__PURE__ */ o("div", { children: [
+  return l.enum ? /* @__PURE__ */ n("div", { children: [
     /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-gray-700 dark:text-zinc-300 mb-1", children: i }),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ n(
       "select",
       {
         value: String(t || ""),
-        onChange: (p) => n(p.target.value),
+        onChange: (p) => o(p.target.value),
         className: s,
         children: [
           /* @__PURE__ */ e("option", { value: "", children: "Select..." }),
@@ -1706,40 +1706,40 @@ function lt({ name: r, field: l, value: t, onChange: n }) {
       }
     ),
     l.description && /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-gray-500 dark:text-zinc-400", children: l.description })
-  ] }) : l.type === "number" ? /* @__PURE__ */ o("div", { children: [
+  ] }) : l.type === "number" ? /* @__PURE__ */ n("div", { children: [
     /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-gray-700 dark:text-zinc-300 mb-1", children: i }),
     /* @__PURE__ */ e(
       "input",
       {
         type: "number",
         value: t !== void 0 ? Number(t) : "",
-        onChange: (p) => n(Number(p.target.value)),
+        onChange: (p) => o(Number(p.target.value)),
         min: l.minimum,
         max: l.maximum,
         className: s
       }
     ),
     l.description && /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-gray-500 dark:text-zinc-400", children: l.description })
-  ] }) : l.type === "boolean" ? /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+  ] }) : l.type === "boolean" ? /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
     /* @__PURE__ */ e(
       "input",
       {
         type: "checkbox",
         checked: !!t,
-        onChange: (p) => n(p.target.checked),
+        onChange: (p) => o(p.target.checked),
         className: "h-4 w-4 text-teal-600 focus:ring-teal-500 border-gray-300 dark:border-zinc-600 rounded bg-white dark:bg-zinc-900"
       }
     ),
     /* @__PURE__ */ e("label", { className: "text-sm font-medium text-gray-700 dark:text-zinc-300", children: i })
-  ] }) : r.toLowerCase().includes("color") && typeof t == "string" && t.startsWith("#") ? /* @__PURE__ */ o("div", { children: [
+  ] }) : r.toLowerCase().includes("color") && typeof t == "string" && t.startsWith("#") ? /* @__PURE__ */ n("div", { children: [
     /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-gray-700 dark:text-zinc-300 mb-1", children: i }),
-    /* @__PURE__ */ o("div", { className: "flex gap-2", children: [
+    /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
       /* @__PURE__ */ e(
         "input",
         {
           type: "color",
           value: String(t || "#000000"),
-          onChange: (p) => n(p.target.value),
+          onChange: (p) => o(p.target.value),
           className: "h-10 w-14 p-1 border border-gray-300 dark:border-zinc-600 rounded"
         }
       ),
@@ -1748,12 +1748,12 @@ function lt({ name: r, field: l, value: t, onChange: n }) {
         {
           type: "text",
           value: String(t || ""),
-          onChange: (p) => n(p.target.value),
+          onChange: (p) => o(p.target.value),
           className: s + " flex-1"
         }
       )
     ] })
-  ] }) : l.type === "object" ? /* @__PURE__ */ o("div", { children: [
+  ] }) : l.type === "object" ? /* @__PURE__ */ n("div", { children: [
     /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-gray-700 dark:text-zinc-300 mb-1", children: i }),
     /* @__PURE__ */ e(
       "textarea",
@@ -1761,7 +1761,7 @@ function lt({ name: r, field: l, value: t, onChange: n }) {
         value: t ? JSON.stringify(t, null, 2) : "{}",
         onChange: (p) => {
           try {
-            n(JSON.parse(p.target.value));
+            o(JSON.parse(p.target.value));
           } catch {
           }
         },
@@ -1770,13 +1770,13 @@ function lt({ name: r, field: l, value: t, onChange: n }) {
       }
     ),
     l.description && /* @__PURE__ */ e("p", { className: "mt-1 text-xs text-gray-500 dark:text-zinc-400", children: l.description })
-  ] }) : /* @__PURE__ */ o("div", { children: [
+  ] }) : /* @__PURE__ */ n("div", { children: [
     /* @__PURE__ */ e("label", { className: "block text-sm font-medium text-gray-700 dark:text-zinc-300 mb-1", children: i }),
     r === "prompt" || r === "code" || r === "text" ? /* @__PURE__ */ e(
       "textarea",
       {
         value: String(t || ""),
-        onChange: (p) => n(p.target.value),
+        onChange: (p) => o(p.target.value),
         rows: 3,
         className: s
       }
@@ -1785,7 +1785,7 @@ function lt({ name: r, field: l, value: t, onChange: n }) {
       {
         type: "text",
         value: String(t || ""),
-        onChange: (p) => n(p.target.value),
+        onChange: (p) => o(p.target.value),
         className: s
       }
     ),
@@ -1793,13 +1793,13 @@ function lt({ name: r, field: l, value: t, onChange: n }) {
   ] });
 }
 function dt({ nodeId: r, outputSchema: l, updateNodeData: t }) {
-  const [n, i] = I(""), s = (l == null ? void 0 : l.properties) || {}, p = Object.entries(s), d = () => {
-    if (!n.trim()) return;
+  const [o, i] = C(""), s = (l == null ? void 0 : l.properties) || {}, p = Object.entries(s), d = () => {
+    if (!o.trim()) return;
     const u = {
       type: "object",
       properties: {
         ...s,
-        [n.trim()]: { type: "string" }
+        [o.trim()]: { type: "string" }
       }
     };
     t(r, { outputSchema: u }), i("");
@@ -1829,25 +1829,25 @@ function dt({ nodeId: r, outputSchema: l, updateNodeData: t }) {
       }
     });
   };
-  return /* @__PURE__ */ o("div", { className: "mt-6 pt-4 border-t border-gray-200 dark:border-zinc-700", children: [
-    /* @__PURE__ */ o("div", { className: "flex items-center justify-between mb-3", children: [
+  return /* @__PURE__ */ n("div", { className: "mt-6 pt-4 border-t border-gray-200 dark:border-zinc-700", children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-3", children: [
       /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-gray-700 dark:text-zinc-300", children: "Output Schema" }),
       /* @__PURE__ */ e("span", { className: "text-xs text-gray-500 dark:text-zinc-500", children: p.length > 0 ? `${p.length} output${p.length > 1 ? "s" : ""}` : "No outputs defined" })
     ] }),
     /* @__PURE__ */ e("p", { className: "text-xs text-gray-500 dark:text-zinc-400 mb-3", children: "Define output properties to enable connecting individual JSON fields to other nodes." }),
-    p.length > 0 && /* @__PURE__ */ e("div", { className: "space-y-2 mb-3", children: p.map(([u, h]) => /* @__PURE__ */ o(
+    p.length > 0 && /* @__PURE__ */ e("div", { className: "space-y-2 mb-3", children: p.map(([u, h]) => /* @__PURE__ */ n(
       "div",
       {
         className: "flex items-center gap-2 p-2 bg-pink-50 dark:bg-pink-900/20 rounded border border-pink-200 dark:border-pink-800",
         children: [
-          /* @__PURE__ */ o("div", { className: "flex-1 min-w-0", children: [
-            /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ n("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ e("span", { className: "text-sm font-medium text-pink-700 dark:text-pink-300 truncate", children: u }),
-              /* @__PURE__ */ o(
+              /* @__PURE__ */ n(
                 "select",
                 {
                   value: h.type,
-                  onChange: (f) => m(u, f.target.value),
+                  onChange: (b) => m(u, b.target.value),
                   className: "text-xs px-1.5 py-0.5 rounded border border-pink-300 dark:border-pink-700 bg-white dark:bg-zinc-800 text-gray-700 dark:text-zinc-300",
                   children: [
                     /* @__PURE__ */ e("option", { value: "string", children: "string" }),
@@ -1864,7 +1864,7 @@ function dt({ nodeId: r, outputSchema: l, updateNodeData: t }) {
               {
                 type: "text",
                 value: h.description || "",
-                onChange: (f) => c(u, f.target.value),
+                onChange: (b) => c(u, b.target.value),
                 placeholder: "Description (optional)",
                 className: "mt-1 w-full text-xs px-2 py-1 rounded border border-pink-200 dark:border-pink-700 bg-white dark:bg-zinc-800 text-gray-600 dark:text-zinc-400 placeholder-gray-400 dark:placeholder-zinc-500"
               }
@@ -1891,12 +1891,12 @@ function dt({ nodeId: r, outputSchema: l, updateNodeData: t }) {
       },
       u
     )) }),
-    /* @__PURE__ */ o("div", { className: "flex gap-2", children: [
+    /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
       /* @__PURE__ */ e(
         "input",
         {
           type: "text",
-          value: n,
+          value: o,
           onChange: (u) => i(u.target.value),
           onKeyDown: (u) => u.key === "Enter" && d(),
           placeholder: "Property name...",
@@ -1907,7 +1907,7 @@ function dt({ nodeId: r, outputSchema: l, updateNodeData: t }) {
         "button",
         {
           onClick: d,
-          disabled: !n.trim(),
+          disabled: !o.trim(),
           className: "px-3 py-1.5 text-sm font-medium text-white bg-pink-500 rounded hover:bg-pink-600 disabled:opacity-50 disabled:cursor-not-allowed",
           children: "Add"
         }
@@ -1917,15 +1917,15 @@ function dt({ nodeId: r, outputSchema: l, updateNodeData: t }) {
   ] });
 }
 function ct(r, l) {
-  const t = new Map(r.map((d) => [d.id, d])), n = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
+  const t = new Map(r.map((d) => [d.id, d])), o = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map();
   for (const d of r)
-    n.set(d.id, 0), i.set(d.id, []);
+    o.set(d.id, 0), i.set(d.id, []);
   for (const d of l) {
     const a = i.get(d.source) || [];
-    a.push(d.target), i.set(d.source, a), n.set(d.target, (n.get(d.target) || 0) + 1);
+    a.push(d.target), i.set(d.source, a), o.set(d.target, (o.get(d.target) || 0) + 1);
   }
   const s = [];
-  for (const [d, a] of n)
+  for (const [d, a] of o)
     a === 0 && s.push(d);
   const p = [];
   for (; s.length > 0; ) {
@@ -1933,8 +1933,8 @@ function ct(r, l) {
     a && p.push(a);
     const m = i.get(d) || [];
     for (const c of m) {
-      const u = (n.get(c) || 1) - 1;
-      n.set(c, u), u === 0 && s.push(c);
+      const u = (o.get(c) || 1) - 1;
+      o.set(c, u), u === 0 && s.push(c);
     }
   }
   return p;
@@ -1943,21 +1943,21 @@ function mt(r) {
   const l = r.type || "node", t = r.id.replace(/[^a-zA-Z0-9]/g, "_");
   return `${l}_${t}`;
 }
-function G(r) {
+function _(r) {
   return typeof r == "string" ? r.includes(`
 `) ? "`" + r.replace(/`/g, "\\`").replace(/\$/g, "\\$") + "`" : JSON.stringify(r) : JSON.stringify(r, null, 2);
 }
 function pt(r, l, t) {
-  const n = t.get(r.id), i = [], s = l.find((d) => d.target === r.id), p = s ? t.get(s.source) : null;
+  const o = t.get(r.id), i = [], s = l.find((d) => d.target === r.id), p = s ? t.get(s.source) : null;
   switch (r.type) {
     case "generator": {
       const d = r.data;
       i.push(d.generatorName);
-      const a = d.params || {}, m = Object.entries(a).filter(([, c]) => c !== void 0 && c !== "").map(([c, u]) => `  ${c}: ${G(u)}`).join(`,
+      const a = d.params || {}, m = Object.entries(a).filter(([, c]) => c !== void 0 && c !== "").map(([c, u]) => `  ${c}: ${_(u)}`).join(`,
 `);
       return {
         code: `// Generate image using ${d.generatorName}
-const ${n} = await ${d.generatorName}({
+const ${o} = await ${d.generatorName}({
 ${m}
 });`,
         imports: i
@@ -1966,25 +1966,25 @@ ${m}
     case "input":
       return {
         code: `// Load input image
-const ${n} = await flo.loadImage("./input.png");`,
+const ${o} = await flo.loadImage("./input.png");`,
         imports: []
       };
     case "transform": {
-      const d = r.data, a = d.params || {}, m = Object.entries(a).filter(([, u]) => u !== void 0 && u !== "").map(([u, h]) => `${u}: ${G(h)}`).join(", "), c = p || "image";
+      const d = r.data, a = d.params || {}, m = Object.entries(a).filter(([, u]) => u !== void 0 && u !== "").map(([u, h]) => `${u}: ${_(h)}`).join(", "), c = p || "image";
       return {
         code: `// Apply ${d.operation} transform
-const ${n} = await flo.transform(${c}, "${d.operation}"${m ? `, { ${m} }` : ""});`,
+const ${o} = await flo.transform(${c}, "${d.operation}"${m ? `, { ${m} }` : ""});`,
         imports: []
       };
     }
     case "vision": {
       const d = r.data;
       i.push(d.providerName);
-      const a = d.params || {}, m = p || "image", c = Object.entries(a).filter(([, u]) => u !== void 0 && u !== "").map(([u, h]) => `  ${u}: ${G(h)}`).join(`,
+      const a = d.params || {}, m = p || "image", c = Object.entries(a).filter(([, u]) => u !== void 0 && u !== "").map(([u, h]) => `  ${u}: ${_(h)}`).join(`,
 `);
       return {
         code: `// Analyze image with ${d.providerName}
-const ${n} = await ${d.providerName}.analyze(${m}, {
+const ${o} = await ${d.providerName}.analyze(${m}, {
 ${c}
 });`,
         imports: i
@@ -1993,11 +1993,11 @@ ${c}
     case "text": {
       const d = r.data;
       i.push(d.providerName);
-      const a = d.params || {}, m = Object.entries(a).filter(([, c]) => c !== void 0 && c !== "").map(([c, u]) => `  ${c}: ${G(u)}`).join(`,
+      const a = d.params || {}, m = Object.entries(a).filter(([, c]) => c !== void 0 && c !== "").map(([c, u]) => `  ${c}: ${_(u)}`).join(`,
 `);
       return {
         code: `// Generate text with ${d.providerName}
-const ${n} = await ${d.providerName}.generate({
+const ${o} = await ${d.providerName}.generate({
 ${m}
 });`,
         imports: i
@@ -2007,7 +2007,7 @@ ${m}
       const d = r.data;
       return {
         code: `// Save result
-await flo.save(${p || "result"}, ${G(d.destination)});`,
+await flo.save(${p || "result"}, ${_(d.destination)});`,
         imports: []
       };
     }
@@ -2022,12 +2022,12 @@ function ut(r, l) {
   if (r.length === 0)
     return `// Empty workflow
 // Add nodes to your canvas to generate code`;
-  const t = ct(r, l), n = /* @__PURE__ */ new Map();
+  const t = ct(r, l), o = /* @__PURE__ */ new Map();
   for (const m of t)
-    n.set(m.id, mt(m));
+    o.set(m.id, mt(m));
   const i = /* @__PURE__ */ new Set(), s = [];
   for (const m of t) {
-    const { code: c, imports: u } = pt(m, l, n);
+    const { code: c, imports: u } = pt(m, l, o);
     s.push(c);
     for (const h of u)
       i.add(h);
@@ -2059,14 +2059,14 @@ runWorkflow().catch(console.error);
 ` + a;
 }
 function gt({ isOpen: r, onClose: l, onImport: t }) {
-  const [n, i] = I(""), [s, p] = I(!1), [d, a] = I(null), [m, c] = I(!1), u = L(async () => {
-    if (!n.trim()) {
+  const [o, i] = C(""), [s, p] = C(!1), [d, a] = C(null), [m, c] = C(!1), u = W(async () => {
+    if (!o.trim()) {
       a({ message: "Please enter or paste YAML content" });
       return;
     }
     p(!0), a(null);
     try {
-      const g = await He(n);
+      const g = await He(o);
       g.success ? (t(g.nodes, g.edges, g.name), i(""), l()) : a({
         message: g.error || "Import failed",
         line: g.line,
@@ -2077,52 +2077,52 @@ function gt({ isOpen: r, onClose: l, onImport: t }) {
     } finally {
       p(!1);
     }
-  }, [n, t, l]), h = L(async () => {
-    if (!n.trim()) {
+  }, [o, t, l]), h = W(async () => {
+    if (!o.trim()) {
       a({ message: "Please enter or paste YAML content" });
       return;
     }
     p(!0), a(null);
     try {
-      const g = await _e(n);
+      const g = await _e(o);
       g.valid ? (a(null), a({ message: "Valid YAML!" }), setTimeout(() => a(null), 2e3)) : g.errors.length > 0 && a(g.errors[0]);
     } catch (g) {
       a({ message: g instanceof Error ? g.message : "Validation failed" });
     } finally {
       p(!1);
     }
-  }, [n]), f = L(async (g) => {
+  }, [o]), b = W(async (g) => {
     if (!g.name.endsWith(".yaml") && !g.name.endsWith(".yml")) {
       a({ message: "Please upload a .yaml or .yml file" });
       return;
     }
     try {
-      const z = await g.text();
-      i(z), a(null);
+      const N = await g.text();
+      i(N), a(null);
     } catch {
       a({ message: "Failed to read file" });
     }
-  }, []), y = L((g) => {
+  }, []), y = W((g) => {
     g.preventDefault(), c(!0);
-  }, []), v = L((g) => {
+  }, []), v = W((g) => {
     g.preventDefault(), c(!1);
-  }, []), w = L(
+  }, []), w = W(
     (g) => {
       g.preventDefault(), c(!1);
-      const z = g.dataTransfer.files[0];
-      z && f(z);
+      const N = g.dataTransfer.files[0];
+      N && b(N);
     },
-    [f]
-  ), b = L(
+    [b]
+  ), x = W(
     (g) => {
-      var W;
-      const z = (W = g.target.files) == null ? void 0 : W[0];
-      z && f(z);
+      var A;
+      const N = (A = g.target.files) == null ? void 0 : A[0];
+      N && b(N);
     },
-    [f]
+    [b]
   );
-  return r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ o("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[80vh] flex flex-col", children: [
-    /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-zinc-700", children: [
+  return r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ n("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[80vh] flex flex-col", children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-zinc-700", children: [
       /* @__PURE__ */ e("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: "Import Workflow" }),
       /* @__PURE__ */ e(
         "button",
@@ -2141,9 +2141,9 @@ function gt({ isOpen: r, onClose: l, onImport: t }) {
         }
       )
     ] }),
-    /* @__PURE__ */ o("div", { className: "p-4 flex-1 overflow-auto", children: [
+    /* @__PURE__ */ n("div", { className: "p-4 flex-1 overflow-auto", children: [
       /* @__PURE__ */ e("p", { className: "text-sm text-gray-600 dark:text-zinc-400 mb-4", children: "Paste YAML content or drag and drop a .yaml file to import a workflow." }),
-      /* @__PURE__ */ o(
+      /* @__PURE__ */ n(
         "div",
         {
           onDragOver: y,
@@ -2156,12 +2156,12 @@ function gt({ isOpen: r, onClose: l, onImport: t }) {
               {
                 type: "file",
                 accept: ".yaml,.yml",
-                onChange: b,
+                onChange: x,
                 className: "hidden",
                 id: "yaml-file-input"
               }
             ),
-            /* @__PURE__ */ o(
+            /* @__PURE__ */ n(
               "label",
               {
                 htmlFor: "yaml-file-input",
@@ -2199,7 +2199,7 @@ function gt({ isOpen: r, onClose: l, onImport: t }) {
       /* @__PURE__ */ e(
         "textarea",
         {
-          value: n,
+          value: o,
           onChange: (g) => {
             i(g.target.value), a(null);
           },
@@ -2225,13 +2225,13 @@ steps:
           className: "w-full h-64 p-3 font-mono text-sm bg-gray-100 dark:bg-zinc-900 border border-gray-300 dark:border-zinc-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-teal-500 text-gray-800 dark:text-zinc-200"
         }
       ),
-      d && /* @__PURE__ */ o(
+      d && /* @__PURE__ */ n(
         "div",
         {
           className: `mt-4 p-3 rounded-lg text-sm ${d.message === "Valid YAML!" ? "bg-green-50 dark:bg-green-900/30 text-green-700 dark:text-green-400" : "bg-red-50 dark:bg-red-900/30 text-red-700 dark:text-red-400"}`,
           children: [
             /* @__PURE__ */ e("span", { className: "font-medium", children: d.message }),
-            d.line && /* @__PURE__ */ o("span", { className: "ml-2 text-xs", children: [
+            d.line && /* @__PURE__ */ n("span", { className: "ml-2 text-xs", children: [
               "(line ",
               d.line,
               d.column ? `, column ${d.column}` : "",
@@ -2241,26 +2241,26 @@ steps:
         }
       )
     ] }),
-    /* @__PURE__ */ o("div", { className: "flex justify-between items-center px-4 py-3 border-t border-gray-200 dark:border-zinc-700", children: [
+    /* @__PURE__ */ n("div", { className: "flex justify-between items-center px-4 py-3 border-t border-gray-200 dark:border-zinc-700", children: [
       /* @__PURE__ */ e("span", { className: "text-xs text-gray-500 dark:text-zinc-400", children: "Use with floimg CLI: floimg run workflow.yaml" }),
-      /* @__PURE__ */ o("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
         /* @__PURE__ */ e(
           "button",
           {
             onClick: h,
-            disabled: s || !n.trim(),
+            disabled: s || !o.trim(),
             className: "px-4 py-2 text-sm font-medium text-gray-700 dark:text-zinc-200 bg-white dark:bg-zinc-700 border border-gray-300 dark:border-zinc-600 rounded-md hover:bg-gray-50 dark:hover:bg-zinc-600 disabled:opacity-50 disabled:cursor-not-allowed",
             children: "Validate"
           }
         ),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ n(
           "button",
           {
             onClick: u,
-            disabled: s || !n.trim(),
+            disabled: s || !o.trim(),
             className: "px-4 py-2 text-sm font-medium text-white bg-teal-600 rounded-md hover:bg-teal-700 disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2",
             children: [
-              s && /* @__PURE__ */ o("svg", { className: "animate-spin h-4 w-4", viewBox: "0 0 24 24", fill: "none", children: [
+              s && /* @__PURE__ */ n("svg", { className: "animate-spin h-4 w-4", viewBox: "0 0 24 24", fill: "none", children: [
                 /* @__PURE__ */ e(
                   "circle",
                   {
@@ -2293,51 +2293,51 @@ function ht({
   brandingSlot: r,
   beforeActionsSlot: l,
   afterActionsSlot: t,
-  hideAttribution: n = !1,
+  hideAttribution: o = !1,
   hideWorkflowLibrary: i = !1
 } = {}) {
-  const s = k((N) => N.execution), p = k((N) => N.execute), d = k((N) => N.exportToYaml), a = k((N) => N.importFromYaml), m = k((N) => N.nodes), c = k((N) => N.edges), u = O((N) => N.openSettings), h = k((N) => N.activeWorkflowName), f = k((N) => N.hasUnsavedChanges), y = k((N) => N.saveWorkflow), v = k((N) => N.toggleLibrary), w = k((N) => N.setActiveWorkflowName), b = k((N) => N.selectedNodeId), g = k((N) => N.duplicateNode), [z, W] = I(!1), [x, C] = I(!1), [S, T] = I("yaml"), [Z, ge] = I(""), [ee, he] = I(""), [te, R] = I(null), [xe, K] = I(!1), [re, q] = I("");
-  D(() => {
-    const N = () => {
-      R("New workflow created"), setTimeout(() => R(null), 2e3);
+  const s = f((z) => z.execution), p = f((z) => z.execute), d = f((z) => z.exportToYaml), a = f((z) => z.importFromYaml), m = f((z) => z.nodes), c = f((z) => z.edges), u = V((z) => z.openSettings), h = f((z) => z.activeWorkflowName), b = f((z) => z.hasUnsavedChanges), y = f((z) => z.saveWorkflow), v = f((z) => z.toggleLibrary), w = f((z) => z.setActiveWorkflowName), x = f((z) => z.selectedNodeId), g = f((z) => z.duplicateNode), [N, A] = C(!1), [k, L] = C(!1), [S, R] = C("yaml"), [J, Y] = C(""), [I, M] = C(""), [E, O] = C(null), [xe, X] = C(!1), [oe, Z] = C("");
+  U(() => {
+    const z = () => {
+      O("New workflow created"), setTimeout(() => O(null), 2e3);
     };
-    return window.addEventListener("new-workflow-created", N), () => window.removeEventListener("new-workflow-created", N);
+    return window.addEventListener("new-workflow-created", z), () => window.removeEventListener("new-workflow-created", z);
   }, []);
-  const J = L(() => {
-    m.length !== 0 && (y(), R("Saved!"), setTimeout(() => R(null), 2e3));
+  const ee = W(() => {
+    m.length !== 0 && (y(), O("Saved!"), setTimeout(() => O(null), 2e3));
   }, [m.length, y]), be = () => {
-    q(h), K(!0);
-  }, ae = () => {
-    const N = re.trim();
-    N && N !== h && w(N), K(!1);
-  }, ne = L(() => {
-    b && g(b);
-  }, [b, g]);
-  D(() => {
-    function N(M) {
-      (M.metaKey || M.ctrlKey) && M.key === "s" && (M.preventDefault(), J()), (M.metaKey || M.ctrlKey) && M.key === "d" && (M.preventDefault(), ne());
+    Z(h), X(!0);
+  }, ne = () => {
+    const z = oe.trim();
+    z && z !== h && w(z), X(!1);
+  }, se = W(() => {
+    x && g(x);
+  }, [x, g]);
+  U(() => {
+    function z(D) {
+      (D.metaKey || D.ctrlKey) && D.key === "s" && (D.preventDefault(), ee()), (D.metaKey || D.ctrlKey) && D.key === "d" && (D.preventDefault(), se());
     }
-    return document.addEventListener("keydown", N), () => document.removeEventListener("keydown", N);
-  }, [J, ne]);
+    return document.addEventListener("keydown", z), () => document.removeEventListener("keydown", z);
+  }, [ee, se]);
   const fe = async () => {
     await p();
   }, ke = async () => {
-    const N = await d();
-    ge(N);
-    const M = ut(m, c);
-    he(M), W(!0);
+    const z = await d();
+    Y(z);
+    const D = ut(m, c);
+    M(D), A(!0);
   }, ve = () => {
-    const N = S === "yaml" ? Z : ee;
-    navigator.clipboard.writeText(N);
-  }, ye = L(
-    (N, M, we) => {
-      a(N, M, we), R("Workflow imported!"), setTimeout(() => R(null), 2e3);
+    const z = S === "yaml" ? J : I;
+    navigator.clipboard.writeText(z);
+  }, ye = W(
+    (z, D, we) => {
+      a(z, D, we), O("Workflow imported!"), setTimeout(() => O(null), 2e3);
     },
     [a]
   );
-  return /* @__PURE__ */ o(U, { children: [
-    /* @__PURE__ */ o("div", { className: "h-14 bg-white dark:bg-zinc-800 border-b border-gray-200 dark:border-zinc-700 flex items-center justify-between px-4", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-4", children: [
+  return /* @__PURE__ */ n(B, { children: [
+    /* @__PURE__ */ n("div", { className: "h-14 bg-white dark:bg-zinc-800 border-b border-gray-200 dark:border-zinc-700 flex items-center justify-between px-4", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-4", children: [
         !i && /* @__PURE__ */ e(
           "button",
           {
@@ -2355,10 +2355,10 @@ function ht({
             ) })
           }
         ),
-        /* @__PURE__ */ o("div", { className: "flex items-baseline gap-2", children: [
+        /* @__PURE__ */ n("div", { className: "flex items-baseline gap-2", children: [
           /* @__PURE__ */ e("h1", { className: "text-xl font-bold text-gray-800 dark:text-white", children: "FloImg Studio" }),
           r,
-          !n && /* @__PURE__ */ e(
+          !o && /* @__PURE__ */ e(
             "a",
             {
               href: "https://flojo.io",
@@ -2369,16 +2369,16 @@ function ht({
             }
           )
         ] }),
-        /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
           xe ? /* @__PURE__ */ e(
             "input",
             {
               type: "text",
-              value: re,
-              onChange: (N) => q(N.target.value),
-              onBlur: ae,
-              onKeyDown: (N) => {
-                N.key === "Enter" && ae(), N.key === "Escape" && (q(h), K(!1));
+              value: oe,
+              onChange: (z) => Z(z.target.value),
+              onBlur: ne,
+              onKeyDown: (z) => {
+                z.key === "Enter" && ne(), z.key === "Escape" && (Z(h), X(!1));
               },
               className: "w-48 px-2 py-1 text-sm font-medium bg-white dark:bg-zinc-900 border border-teal-500 rounded focus:outline-none focus:ring-1 focus:ring-teal-500 text-gray-900 dark:text-zinc-100",
               autoFocus: !0
@@ -2392,16 +2392,16 @@ function ht({
               children: h
             }
           ),
-          f && /* @__PURE__ */ e("span", { className: "text-xs text-amber-600 dark:text-amber-400", children: "(unsaved)" }),
-          te && /* @__PURE__ */ e("span", { className: "text-xs text-green-600 dark:text-green-400", children: te })
+          b && /* @__PURE__ */ e("span", { className: "text-xs text-amber-600 dark:text-amber-400", children: "(unsaved)" }),
+          E && /* @__PURE__ */ e("span", { className: "text-xs text-green-600 dark:text-green-400", children: E })
         ] }),
-        /* @__PURE__ */ o("span", { className: "text-sm text-gray-500 dark:text-zinc-400", children: [
+        /* @__PURE__ */ n("span", { className: "text-sm text-gray-500 dark:text-zinc-400", children: [
           m.length,
           " node",
           m.length !== 1 ? "s" : ""
         ] })
       ] }),
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-3", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-3", children: [
         l,
         /* @__PURE__ */ e(
           "button",
@@ -2409,7 +2409,7 @@ function ht({
             onClick: u,
             className: "p-2 text-gray-500 dark:text-zinc-400 hover:text-gray-700 dark:hover:text-zinc-200 hover:bg-gray-100 dark:hover:bg-zinc-700 rounded-md",
             title: "AI Settings",
-            children: /* @__PURE__ */ o("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
+            children: /* @__PURE__ */ n("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
               /* @__PURE__ */ e(
                 "path",
                 {
@@ -2434,7 +2434,7 @@ function ht({
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: J,
+            onClick: ee,
             disabled: m.length === 0,
             className: "p-2 text-gray-500 dark:text-zinc-400 hover:text-gray-700 dark:hover:text-zinc-200 hover:bg-gray-100 dark:hover:bg-zinc-700 rounded-md disabled:opacity-50 disabled:cursor-not-allowed",
             title: "Save Workflow (Cmd+S)",
@@ -2452,7 +2452,7 @@ function ht({
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => C(!0),
+            onClick: () => L(!0),
             className: "px-4 py-2 text-sm font-medium text-gray-700 dark:text-zinc-200 bg-white dark:bg-zinc-700 border border-gray-300 dark:border-zinc-600 rounded-md hover:bg-gray-50 dark:hover:bg-zinc-600",
             children: "Import"
           }
@@ -2472,8 +2472,8 @@ function ht({
             onClick: fe,
             disabled: m.length === 0 || s.status === "running",
             className: "px-4 py-2 text-sm font-medium text-white bg-teal-600 rounded-md hover:bg-teal-700 disabled:opacity-50 disabled:cursor-not-allowed flex items-center gap-2",
-            children: s.status === "running" ? /* @__PURE__ */ o(U, { children: [
-              /* @__PURE__ */ o("svg", { className: "animate-spin h-4 w-4", viewBox: "0 0 24 24", fill: "none", children: [
+            children: s.status === "running" ? /* @__PURE__ */ n(B, { children: [
+              /* @__PURE__ */ n("svg", { className: "animate-spin h-4 w-4", viewBox: "0 0 24 24", fill: "none", children: [
                 /* @__PURE__ */ e(
                   "circle",
                   {
@@ -2495,8 +2495,8 @@ function ht({
                 )
               ] }),
               "Running..."
-            ] }) : /* @__PURE__ */ o(U, { children: [
-              /* @__PURE__ */ o("svg", { className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
+            ] }) : /* @__PURE__ */ n(B, { children: [
+              /* @__PURE__ */ n("svg", { className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: [
                 /* @__PURE__ */ e(
                   "path",
                   {
@@ -2523,35 +2523,35 @@ function ht({
         t
       ] })
     ] }),
-    s.status === "completed" && s.imageIds.length > 0 && /* @__PURE__ */ e("div", { className: "bg-green-50 dark:bg-green-900/30 border-b border-green-200 dark:border-green-800 px-4 py-3", children: /* @__PURE__ */ o("div", { className: "flex items-center gap-4", children: [
-      /* @__PURE__ */ o("span", { className: "text-green-700 dark:text-green-400 font-medium", children: [
+    s.status === "completed" && s.imageIds.length > 0 && /* @__PURE__ */ e("div", { className: "bg-green-50 dark:bg-green-900/30 border-b border-green-200 dark:border-green-800 px-4 py-3", children: /* @__PURE__ */ n("div", { className: "flex items-center gap-4", children: [
+      /* @__PURE__ */ n("span", { className: "text-green-700 dark:text-green-400 font-medium", children: [
         "Generated ",
         s.imageIds.length,
         " image",
         s.imageIds.length !== 1 ? "s" : ""
       ] }),
-      /* @__PURE__ */ e("div", { className: "flex gap-2", children: s.imageUrls.slice(0, 4).map((N, M) => /* @__PURE__ */ e("a", { href: N, target: "_blank", rel: "noopener noreferrer", className: "block", children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e("div", { className: "flex gap-2", children: s.imageUrls.slice(0, 4).map((z, D) => /* @__PURE__ */ e("a", { href: z, target: "_blank", rel: "noopener noreferrer", className: "block", children: /* @__PURE__ */ e(
         "img",
         {
-          src: N,
+          src: z,
           alt: "Generated",
           className: "h-12 w-12 object-cover rounded border border-green-300 dark:border-green-700"
         }
-      ) }, M)) })
+      ) }, D)) })
     ] }) }),
-    s.status === "error" && /* @__PURE__ */ e("div", { className: "bg-red-50 dark:bg-red-900/30 border-b border-red-200 dark:border-red-800 px-4 py-3", children: /* @__PURE__ */ o("span", { className: "text-red-700 dark:text-red-400", children: [
+    s.status === "error" && /* @__PURE__ */ e("div", { className: "bg-red-50 dark:bg-red-900/30 border-b border-red-200 dark:border-red-800 px-4 py-3", children: /* @__PURE__ */ n("span", { className: "text-red-700 dark:text-red-400", children: [
       "Error: ",
       s.error
     ] }) }),
-    z && /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ o("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[80vh] flex flex-col", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-zinc-700", children: [
-        /* @__PURE__ */ o("div", { className: "flex items-center gap-4", children: [
+    N && /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ n("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl max-w-2xl w-full mx-4 max-h-[80vh] flex flex-col", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-zinc-700", children: [
+        /* @__PURE__ */ n("div", { className: "flex items-center gap-4", children: [
           /* @__PURE__ */ e("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: "Export Workflow" }),
-          /* @__PURE__ */ o("div", { className: "flex gap-1 bg-gray-100 dark:bg-zinc-700 rounded-lg p-1", children: [
+          /* @__PURE__ */ n("div", { className: "flex gap-1 bg-gray-100 dark:bg-zinc-700 rounded-lg p-1", children: [
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => T("yaml"),
+                onClick: () => R("yaml"),
                 className: `px-3 py-1 text-sm font-medium rounded-md transition-colors ${S === "yaml" ? "bg-white dark:bg-zinc-600 text-gray-900 dark:text-white shadow-sm" : "text-gray-600 dark:text-zinc-400 hover:text-gray-900 dark:hover:text-white"}`,
                 children: "YAML"
               }
@@ -2559,7 +2559,7 @@ function ht({
             /* @__PURE__ */ e(
               "button",
               {
-                onClick: () => T("javascript"),
+                onClick: () => R("javascript"),
                 className: `px-3 py-1 text-sm font-medium rounded-md transition-colors ${S === "javascript" ? "bg-white dark:bg-zinc-600 text-gray-900 dark:text-white shadow-sm" : "text-gray-600 dark:text-zinc-400 hover:text-gray-900 dark:hover:text-white"}`,
                 children: "JavaScript"
               }
@@ -2569,7 +2569,7 @@ function ht({
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: () => W(!1),
+            onClick: () => A(!1),
             className: "text-gray-500 dark:text-zinc-400 hover:text-gray-700 dark:hover:text-zinc-200",
             children: /* @__PURE__ */ e("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e(
               "path",
@@ -2583,10 +2583,10 @@ function ht({
           }
         )
       ] }),
-      /* @__PURE__ */ e("div", { className: "p-4 overflow-auto flex-1", children: /* @__PURE__ */ e("pre", { className: "bg-gray-100 dark:bg-zinc-900 p-4 rounded text-sm font-mono whitespace-pre-wrap text-gray-800 dark:text-zinc-200", children: S === "yaml" ? Z : ee }) }),
-      /* @__PURE__ */ o("div", { className: "flex justify-between items-center px-4 py-3 border-t border-gray-200 dark:border-zinc-700", children: [
+      /* @__PURE__ */ e("div", { className: "p-4 overflow-auto flex-1", children: /* @__PURE__ */ e("pre", { className: "bg-gray-100 dark:bg-zinc-900 p-4 rounded text-sm font-mono whitespace-pre-wrap text-gray-800 dark:text-zinc-200", children: S === "yaml" ? J : I }) }),
+      /* @__PURE__ */ n("div", { className: "flex justify-between items-center px-4 py-3 border-t border-gray-200 dark:border-zinc-700", children: [
         /* @__PURE__ */ e("span", { className: "text-xs text-gray-500 dark:text-zinc-400", children: S === "yaml" ? "Use with floimg CLI: floimg run workflow.yaml" : "Run with Node.js or Bun" }),
-        /* @__PURE__ */ o("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
           /* @__PURE__ */ e(
             "button",
             {
@@ -2598,7 +2598,7 @@ function ht({
           /* @__PURE__ */ e(
             "button",
             {
-              onClick: () => W(!1),
+              onClick: () => A(!1),
               className: "px-4 py-2 text-sm font-medium text-white bg-teal-600 rounded-md hover:bg-teal-700",
               children: "Close"
             }
@@ -2609,20 +2609,20 @@ function ht({
     /* @__PURE__ */ e(
       gt,
       {
-        isOpen: x,
-        onClose: () => C(!1),
+        isOpen: k,
+        onClose: () => L(!1),
         onImport: ye
       }
     )
   ] });
 }
 function xt() {
-  const r = k((a) => a.loadTemplate), [l, t] = I(null), {
-    data: n,
+  const r = f((a) => a.loadTemplate), [l, t] = C(null), {
+    data: o,
     isLoading: i,
     error: s,
     refetch: p
-  } = F({
+  } = K({
     queryKey: ["images"],
     queryFn: Ee,
     refetchInterval: 5e3
@@ -2652,18 +2652,18 @@ function xt() {
       t(null);
     }
   };
-  return i ? /* @__PURE__ */ e("div", { className: "p-8 text-center text-gray-500 dark:text-zinc-400", children: "Loading images..." }) : s ? /* @__PURE__ */ o("div", { className: "p-8 text-center text-red-500 dark:text-red-400", children: [
+  return i ? /* @__PURE__ */ e("div", { className: "p-8 text-center text-gray-500 dark:text-zinc-400", children: "Loading images..." }) : s ? /* @__PURE__ */ n("div", { className: "p-8 text-center text-red-500 dark:text-red-400", children: [
     "Error loading images: ",
     s instanceof Error ? s.message : "Unknown error"
-  ] }) : !n || n.length === 0 ? /* @__PURE__ */ o("div", { className: "p-8 text-center text-gray-500 dark:text-zinc-400", children: [
+  ] }) : !o || o.length === 0 ? /* @__PURE__ */ n("div", { className: "p-8 text-center text-gray-500 dark:text-zinc-400", children: [
     /* @__PURE__ */ e("div", { className: "text-lg mb-2", children: "No images yet" }),
     /* @__PURE__ */ e("div", { className: "text-sm", children: "Create a workflow and click Execute to generate images" })
-  ] }) : /* @__PURE__ */ o("div", { className: "p-4 bg-gray-100 dark:bg-zinc-900 min-h-full", children: [
-    /* @__PURE__ */ o("div", { className: "flex items-center justify-between mb-4", children: [
-      /* @__PURE__ */ o("div", { children: [
-        /* @__PURE__ */ o("h2", { className: "text-lg font-semibold text-gray-800 dark:text-white", children: [
+  ] }) : /* @__PURE__ */ n("div", { className: "p-4 bg-gray-100 dark:bg-zinc-900 min-h-full", children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-4", children: [
+      /* @__PURE__ */ n("div", { children: [
+        /* @__PURE__ */ n("h2", { className: "text-lg font-semibold text-gray-800 dark:text-white", children: [
           "Images (",
-          n.length,
+          o.length,
           ")"
         ] }),
         /* @__PURE__ */ e("p", { className: "text-xs text-gray-500 dark:text-zinc-500", children: "Your generated images" })
@@ -2677,7 +2677,7 @@ function xt() {
         }
       )
     ] }),
-    /* @__PURE__ */ e("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", children: n.map((a) => /* @__PURE__ */ e(
+    /* @__PURE__ */ e("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", children: o.map((a) => /* @__PURE__ */ e(
       bt,
       {
         image: a,
@@ -2689,20 +2689,20 @@ function xt() {
   ] });
 }
 function bt({ image: r, onLoadWorkflow: l, isLoading: t }) {
-  const n = (s) => new Date(s).toLocaleString(), i = (s) => s < 1024 ? `${s} B` : s < 1048576 ? `${(s / 1024).toFixed(1)} KB` : `${(s / 1048576).toFixed(1)} MB`;
-  return /* @__PURE__ */ o("div", { className: "bg-white dark:bg-zinc-800 rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden shadow-sm hover:shadow-md transition-shadow group", children: [
-    /* @__PURE__ */ o("div", { className: "relative", children: [
+  const o = (s) => new Date(s).toLocaleString(), i = (s) => s < 1024 ? `${s} B` : s < 1048576 ? `${(s / 1024).toFixed(1)} KB` : `${(s / 1048576).toFixed(1)} MB`;
+  return /* @__PURE__ */ n("div", { className: "bg-white dark:bg-zinc-800 rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden shadow-sm hover:shadow-md transition-shadow group", children: [
+    /* @__PURE__ */ n("div", { className: "relative", children: [
       /* @__PURE__ */ e(
         "a",
         {
-          href: se(r.id),
+          href: le(r.id),
           target: "_blank",
           rel: "noopener noreferrer",
           className: "block aspect-square bg-gray-100 dark:bg-zinc-900",
           children: /* @__PURE__ */ e(
             "img",
             {
-              src: se(r.id),
+              src: le(r.id),
               alt: r.filename,
               className: "w-full h-full object-cover",
               loading: "lazy"
@@ -2722,14 +2722,14 @@ function bt({ image: r, onLoadWorkflow: l, isLoading: t }) {
         }
       ) })
     ] }),
-    /* @__PURE__ */ o("div", { className: "p-3", children: [
+    /* @__PURE__ */ n("div", { className: "p-3", children: [
       /* @__PURE__ */ e("div", { className: "text-sm font-medium text-gray-800 dark:text-white truncate", children: r.filename }),
-      /* @__PURE__ */ o("div", { className: "text-xs text-gray-500 dark:text-zinc-400 mt-1", children: [
+      /* @__PURE__ */ n("div", { className: "text-xs text-gray-500 dark:text-zinc-400 mt-1", children: [
         r.mime,
         " • ",
         i(r.size)
       ] }),
-      /* @__PURE__ */ e("div", { className: "text-xs text-gray-400 dark:text-zinc-500 mt-1", children: n(r.createdAt) })
+      /* @__PURE__ */ e("div", { className: "text-xs text-gray-400 dark:text-zinc-500 mt-1", children: o(r.createdAt) })
     ] })
   ] });
 }
@@ -3137,7 +3137,7 @@ const ft = {
     ],
     edges: [{ id: "e1", source: "gen-1", target: "transform-1" }]
   }
-}, H = [
+}, q = [
   // Charts
   ft,
   kt,
@@ -3153,29 +3153,29 @@ const ft = {
   It
 ];
 function St() {
-  const r = new Set(H.map((l) => l.category));
+  const r = new Set(q.map((l) => l.category));
   return Array.from(r).sort();
 }
 function Ft(r) {
-  return H.filter((l) => l.category === r);
+  return q.filter((l) => l.category === r);
 }
-function ce(r) {
-  return H.find((l) => l.id === r);
+function pe(r) {
+  return q.find((l) => l.id === r);
 }
 function Ht(r) {
   const l = r.toLowerCase();
-  return H.filter(
+  return q.filter(
     (t) => {
-      var n;
-      return t.name.toLowerCase().includes(l) || t.description.toLowerCase().includes(l) || t.category.toLowerCase().includes(l) || t.generator.toLowerCase().includes(l) || ((n = t.tags) == null ? void 0 : n.some((i) => i.toLowerCase().includes(l)));
+      var o;
+      return t.name.toLowerCase().includes(l) || t.description.toLowerCase().includes(l) || t.category.toLowerCase().includes(l) || t.generator.toLowerCase().includes(l) || ((o = t.tags) == null ? void 0 : o.some((i) => i.toLowerCase().includes(l)));
     }
   );
 }
 function Lt({ onSelect: r }) {
-  const [l, t] = I(null), [n, i] = I(""), s = oe(() => St(), []), p = oe(() => {
-    let d = H;
-    if (l && (d = d.filter((a) => a.category === l)), n) {
-      const a = n.toLowerCase();
+  const [l, t] = C(null), [o, i] = C(""), s = ie(() => St(), []), p = ie(() => {
+    let d = q;
+    if (l && (d = d.filter((a) => a.category === l)), o) {
+      const a = o.toLowerCase();
       d = d.filter(
         (m) => {
           var c;
@@ -3184,24 +3184,24 @@ function Lt({ onSelect: r }) {
       );
     }
     return d;
-  }, [l, n]);
-  return /* @__PURE__ */ o("div", { className: "p-6", children: [
-    /* @__PURE__ */ o("div", { className: "mb-6", children: [
+  }, [l, o]);
+  return /* @__PURE__ */ n("div", { className: "p-6", children: [
+    /* @__PURE__ */ n("div", { className: "mb-6", children: [
       /* @__PURE__ */ e("h2", { className: "text-2xl font-bold text-gray-900 dark:text-white mb-2", children: "Templates" }),
       /* @__PURE__ */ e("p", { className: "text-gray-600 dark:text-zinc-400", children: "Start with a pre-built workflow. Click any template to load it into the editor." })
     ] }),
-    /* @__PURE__ */ o("div", { className: "flex flex-wrap gap-4 mb-6", children: [
+    /* @__PURE__ */ n("div", { className: "flex flex-wrap gap-4 mb-6", children: [
       /* @__PURE__ */ e(
         "input",
         {
           type: "text",
           placeholder: "Search templates...",
-          value: n,
+          value: o,
           onChange: (d) => i(d.target.value),
           className: "px-4 py-2 border border-gray-300 dark:border-zinc-600 rounded-lg bg-white dark:bg-zinc-800 text-gray-900 dark:text-white focus:ring-2 focus:ring-teal-500 focus:border-transparent w-64"
         }
       ),
-      /* @__PURE__ */ o("div", { className: "flex gap-2 flex-wrap", children: [
+      /* @__PURE__ */ n("div", { className: "flex gap-2 flex-wrap", children: [
         /* @__PURE__ */ e(
           "button",
           {
@@ -3232,13 +3232,13 @@ function Lt({ onSelect: r }) {
   ] });
 }
 function Wt({ template: r, onSelect: l }) {
-  const t = r.workflow.nodes.length, n = r.workflow.edges.length, i = {
+  const t = r.workflow.nodes.length, o = r.workflow.edges.length, i = {
     quickchart: "bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300",
     mermaid: "bg-pink-100 text-pink-800 dark:bg-pink-900/30 dark:text-pink-300",
     qr: "bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300",
     d3: "bg-orange-100 text-orange-800 dark:bg-orange-900/30 dark:text-orange-300"
   };
-  return /* @__PURE__ */ o("div", { className: "bg-white dark:bg-zinc-800 rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden hover:shadow-lg transition-shadow", children: [
+  return /* @__PURE__ */ n("div", { className: "bg-white dark:bg-zinc-800 rounded-lg border border-gray-200 dark:border-zinc-700 overflow-hidden hover:shadow-lg transition-shadow", children: [
     /* @__PURE__ */ e("div", { className: "aspect-video bg-gray-100 dark:bg-zinc-900 flex items-center justify-center p-4", children: r.preview ? /* @__PURE__ */ e(
       "img",
       {
@@ -3246,7 +3246,7 @@ function Wt({ template: r, onSelect: l }) {
         alt: r.name,
         className: "max-w-full max-h-full object-contain"
       }
-    ) : /* @__PURE__ */ o("div", { className: "text-center text-gray-400 dark:text-zinc-500", children: [
+    ) : /* @__PURE__ */ n("div", { className: "text-center text-gray-400 dark:text-zinc-500", children: [
       /* @__PURE__ */ e(
         "svg",
         {
@@ -3267,8 +3267,8 @@ function Wt({ template: r, onSelect: l }) {
       ),
       /* @__PURE__ */ e("span", { className: "text-sm", children: "No preview" })
     ] }) }),
-    /* @__PURE__ */ o("div", { className: "p-4", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-start justify-between mb-2", children: [
+    /* @__PURE__ */ n("div", { className: "p-4", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-start justify-between mb-2", children: [
         /* @__PURE__ */ e("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: r.name }),
         /* @__PURE__ */ e(
           "span",
@@ -3279,8 +3279,8 @@ function Wt({ template: r, onSelect: l }) {
         )
       ] }),
       /* @__PURE__ */ e("p", { className: "text-sm text-gray-600 dark:text-zinc-400 mb-3", children: r.description }),
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-4 text-xs text-gray-500 dark:text-zinc-500 mb-4", children: [
-        /* @__PURE__ */ o("span", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-4 text-xs text-gray-500 dark:text-zinc-500 mb-4", children: [
+        /* @__PURE__ */ n("span", { className: "flex items-center gap-1", children: [
           /* @__PURE__ */ e("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e(
             "path",
             {
@@ -3294,7 +3294,7 @@ function Wt({ template: r, onSelect: l }) {
           " node",
           t !== 1 ? "s" : ""
         ] }),
-        n > 0 && /* @__PURE__ */ o("span", { className: "flex items-center gap-1", children: [
+        o > 0 && /* @__PURE__ */ n("span", { className: "flex items-center gap-1", children: [
           /* @__PURE__ */ e("svg", { className: "w-4 h-4", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e(
             "path",
             {
@@ -3304,9 +3304,9 @@ function Wt({ template: r, onSelect: l }) {
               d: "M13 7l5 5m0 0l-5 5m5-5H6"
             }
           ) }),
-          n,
+          o,
           " edge",
-          n !== 1 ? "s" : ""
+          o !== 1 ? "s" : ""
         ] })
       ] }),
       r.tags && r.tags.length > 0 && /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-1 mb-4", children: r.tags.slice(0, 4).map((s) => /* @__PURE__ */ e(
@@ -3332,23 +3332,23 @@ function At({
   workflow: r,
   isActive: l,
   onLoad: t,
-  onDelete: n,
+  onDelete: o,
   onRename: i,
   onDuplicate: s
 }) {
-  const [p, d] = I(!1), [a, m] = I(r.name), [c, u] = I(!1), h = () => {
+  const [p, d] = C(!1), [a, m] = C(r.name), [c, u] = C(!1), h = () => {
     a.trim() && a !== r.name && i(a.trim()), d(!1);
-  }, f = (y) => {
-    const v = new Date(y), b = (/* @__PURE__ */ new Date()).getTime() - v.getTime(), g = Math.floor(b / 6e4), z = Math.floor(b / 36e5), W = Math.floor(b / 864e5);
-    return g < 1 ? "Just now" : g < 60 ? `${g}m ago` : z < 24 ? `${z}h ago` : W < 7 ? `${W}d ago` : v.toLocaleDateString();
+  }, b = (y) => {
+    const v = new Date(y), x = (/* @__PURE__ */ new Date()).getTime() - v.getTime(), g = Math.floor(x / 6e4), N = Math.floor(x / 36e5), A = Math.floor(x / 864e5);
+    return g < 1 ? "Just now" : g < 60 ? `${g}m ago` : N < 24 ? `${N}h ago` : A < 7 ? `${A}d ago` : v.toLocaleDateString();
   };
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ n(
     "div",
     {
       className: `group relative p-3 rounded-lg border transition-colors ${l ? "bg-teal-50 dark:bg-teal-900/20 border-teal-200 dark:border-teal-800" : "bg-white dark:bg-zinc-800 border-zinc-200 dark:border-zinc-700 hover:border-zinc-300 dark:hover:border-zinc-600"}`,
       children: [
-        /* @__PURE__ */ o("div", { className: "flex items-start justify-between gap-2", children: [
-          /* @__PURE__ */ o("button", { onClick: t, className: "flex-1 text-left min-w-0", children: [
+        /* @__PURE__ */ n("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ n("button", { onClick: t, className: "flex-1 text-left min-w-0", children: [
             p ? /* @__PURE__ */ e(
               "input",
               {
@@ -3364,13 +3364,13 @@ function At({
                 onClick: (y) => y.stopPropagation()
               }
             ) : /* @__PURE__ */ e("span", { className: "block text-sm font-medium text-zinc-900 dark:text-zinc-100 truncate", children: r.name }),
-            /* @__PURE__ */ o("span", { className: "block text-xs text-zinc-500 dark:text-zinc-400 mt-0.5", children: [
+            /* @__PURE__ */ n("span", { className: "block text-xs text-zinc-500 dark:text-zinc-400 mt-0.5", children: [
               r.nodes.length,
               " nodes · Updated ",
-              f(r.updatedAt)
+              b(r.updatedAt)
             ] })
           ] }),
-          /* @__PURE__ */ o("div", { className: "relative", children: [
+          /* @__PURE__ */ n("div", { className: "relative", children: [
             /* @__PURE__ */ e(
               "button",
               {
@@ -3381,9 +3381,9 @@ function At({
                 children: /* @__PURE__ */ e("svg", { className: "w-4 h-4", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ e("path", { d: "M10 6a2 2 0 110-4 2 2 0 010 4zM10 12a2 2 0 110-4 2 2 0 010 4zM10 18a2 2 0 110-4 2 2 0 010 4z" }) })
               }
             ),
-            c && /* @__PURE__ */ o(U, { children: [
+            c && /* @__PURE__ */ n(B, { children: [
               /* @__PURE__ */ e("div", { className: "fixed inset-0 z-10", onClick: () => u(!1) }),
-              /* @__PURE__ */ o("div", { className: "absolute right-0 top-full mt-1 w-36 bg-white dark:bg-zinc-800 rounded-lg shadow-lg border border-zinc-200 dark:border-zinc-700 py-1 z-20", children: [
+              /* @__PURE__ */ n("div", { className: "absolute right-0 top-full mt-1 w-36 bg-white dark:bg-zinc-800 rounded-lg shadow-lg border border-zinc-200 dark:border-zinc-700 py-1 z-20", children: [
                 /* @__PURE__ */ e(
                   "button",
                   {
@@ -3408,7 +3408,7 @@ function At({
                   "button",
                   {
                     onClick: (y) => {
-                      y.stopPropagation(), window.confirm("Delete this workflow?") && n(), u(!1);
+                      y.stopPropagation(), window.confirm("Delete this workflow?") && o(), u(!1);
                     },
                     className: "w-full px-3 py-1.5 text-left text-sm text-red-600 dark:text-red-400 hover:bg-zinc-100 dark:hover:bg-zinc-700",
                     children: "Delete"
@@ -3424,13 +3424,13 @@ function At({
   );
 }
 function Pt() {
-  const r = k((c) => c.showLibrary), l = k((c) => c.toggleLibrary), t = k((c) => c.savedWorkflows), n = k((c) => c.activeWorkflowId), i = k((c) => c.loadWorkflow), s = k((c) => c.deleteWorkflow), p = k((c) => c.renameWorkflow), d = k((c) => c.duplicateWorkflow), a = k((c) => c.newWorkflow);
+  const r = f((c) => c.showLibrary), l = f((c) => c.toggleLibrary), t = f((c) => c.savedWorkflows), o = f((c) => c.activeWorkflowId), i = f((c) => c.loadWorkflow), s = f((c) => c.deleteWorkflow), p = f((c) => c.renameWorkflow), d = f((c) => c.duplicateWorkflow), a = f((c) => c.newWorkflow);
   if (!r) return null;
   const m = [...t].sort((c, u) => u.updatedAt - c.updatedAt);
-  return /* @__PURE__ */ o(U, { children: [
+  return /* @__PURE__ */ n(B, { children: [
     /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/20 dark:bg-black/40 z-40", onClick: l }),
-    /* @__PURE__ */ o("div", { className: "fixed left-0 top-0 bottom-0 w-80 bg-zinc-50 dark:bg-zinc-900 border-r border-zinc-200 dark:border-zinc-700 z-50 flex flex-col shadow-xl", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-4 py-3 border-b border-zinc-200 dark:border-zinc-700", children: [
+    /* @__PURE__ */ n("div", { className: "fixed left-0 top-0 bottom-0 w-80 bg-zinc-50 dark:bg-zinc-900 border-r border-zinc-200 dark:border-zinc-700 z-50 flex flex-col shadow-xl", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-4 py-3 border-b border-zinc-200 dark:border-zinc-700", children: [
         /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-zinc-900 dark:text-zinc-100", children: "My Workflows" }),
         /* @__PURE__ */ e(
           "button",
@@ -3449,7 +3449,7 @@ function Pt() {
           }
         )
       ] }),
-      /* @__PURE__ */ e("div", { className: "p-4 border-b border-zinc-200 dark:border-zinc-700", children: /* @__PURE__ */ o(
+      /* @__PURE__ */ e("div", { className: "p-4 border-b border-zinc-200 dark:border-zinc-700", children: /* @__PURE__ */ n(
         "button",
         {
           onClick: () => {
@@ -3470,7 +3470,7 @@ function Pt() {
           ]
         }
       ) }),
-      /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto p-4", children: m.length === 0 ? /* @__PURE__ */ o("div", { className: "text-center py-8", children: [
+      /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto p-4", children: m.length === 0 ? /* @__PURE__ */ n("div", { className: "text-center py-8", children: [
         /* @__PURE__ */ e("div", { className: "w-12 h-12 mx-auto mb-3 rounded-full bg-zinc-200 dark:bg-zinc-700 flex items-center justify-center", children: /* @__PURE__ */ e(
           "svg",
           {
@@ -3495,7 +3495,7 @@ function Pt() {
         At,
         {
           workflow: c,
-          isActive: c.id === n,
+          isActive: c.id === o,
           onLoad: () => {
             i(c.id), l();
           },
@@ -3505,7 +3505,7 @@ function Pt() {
         },
         c.id
       )) }) }),
-      /* @__PURE__ */ o("div", { className: "px-4 py-3 border-t border-zinc-200 dark:border-zinc-700 text-xs text-zinc-500 dark:text-zinc-400", children: [
+      /* @__PURE__ */ n("div", { className: "px-4 py-3 border-t border-zinc-200 dark:border-zinc-700 text-xs text-zinc-500 dark:text-zinc-400", children: [
         t.length,
         " workflow",
         t.length !== 1 ? "s" : "",
@@ -3550,7 +3550,7 @@ const $t = [
     placeholder: "sk-or-...",
     docsUrl: "https://openrouter.ai/keys"
   }
-], Mt = [
+], jt = [
   {
     id: "ollama",
     name: "Ollama",
@@ -3566,8 +3566,8 @@ const $t = [
     docsUrl: "https://lmstudio.ai"
   }
 ];
-function jt({ provider: r }) {
-  const l = O((h) => h.ai), t = O((h) => h.setAIProvider), n = l[r.id], i = (n == null ? void 0 : n.enabled) ?? !1, s = (n == null ? void 0 : n.apiKey) ?? "", [p, d] = I(s), [a, m] = I(!1), c = () => {
+function Mt({ provider: r }) {
+  const l = V((h) => h.ai), t = V((h) => h.setAIProvider), o = l[r.id], i = (o == null ? void 0 : o.enabled) ?? !1, s = (o == null ? void 0 : o.apiKey) ?? "", [p, d] = C(s), [a, m] = C(!1), c = () => {
     t(r.id, {
       apiKey: p,
       enabled: !i
@@ -3578,9 +3578,9 @@ function jt({ provider: r }) {
       enabled: i
     });
   };
-  return /* @__PURE__ */ o("div", { className: "flex items-start gap-4 p-4 border border-gray-200 dark:border-zinc-700 rounded-lg", children: [
-    /* @__PURE__ */ o("div", { className: "flex-1 min-w-0", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+  return /* @__PURE__ */ n("div", { className: "flex items-start gap-4 p-4 border border-gray-200 dark:border-zinc-700 rounded-lg", children: [
+    /* @__PURE__ */ n("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e("span", { className: "font-medium text-gray-900 dark:text-white", children: r.name }),
         /* @__PURE__ */ e(
           "a",
@@ -3594,7 +3594,7 @@ function jt({ provider: r }) {
         )
       ] }),
       /* @__PURE__ */ e("p", { className: "text-sm text-gray-500 dark:text-zinc-400 mt-0.5", children: r.description }),
-      /* @__PURE__ */ e("div", { className: "mt-2 flex items-center gap-2", children: /* @__PURE__ */ o("div", { className: "relative flex-1", children: [
+      /* @__PURE__ */ e("div", { className: "mt-2 flex items-center gap-2", children: /* @__PURE__ */ n("div", { className: "relative flex-1", children: [
         /* @__PURE__ */ e(
           "input",
           {
@@ -3648,7 +3648,7 @@ function jt({ provider: r }) {
   ] });
 }
 function Dt({ provider: r }) {
-  const l = O((c) => c.ai), t = O((c) => c.setAIProvider), n = l[r.id], i = (n == null ? void 0 : n.enabled) ?? !1, s = (n == null ? void 0 : n.baseUrl) ?? r.defaultUrl, [p, d] = I(s), a = () => {
+  const l = V((c) => c.ai), t = V((c) => c.setAIProvider), o = l[r.id], i = (o == null ? void 0 : o.enabled) ?? !1, s = (o == null ? void 0 : o.baseUrl) ?? r.defaultUrl, [p, d] = C(s), a = () => {
     t(r.id, {
       baseUrl: p,
       enabled: !i
@@ -3659,9 +3659,9 @@ function Dt({ provider: r }) {
       enabled: i
     });
   };
-  return /* @__PURE__ */ o("div", { className: "flex items-start gap-4 p-4 border border-gray-200 dark:border-zinc-700 rounded-lg", children: [
-    /* @__PURE__ */ o("div", { className: "flex-1 min-w-0", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+  return /* @__PURE__ */ n("div", { className: "flex items-start gap-4 p-4 border border-gray-200 dark:border-zinc-700 rounded-lg", children: [
+    /* @__PURE__ */ n("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ e("span", { className: "font-medium text-gray-900 dark:text-white", children: r.name }),
         /* @__PURE__ */ e(
           "a",
@@ -3703,10 +3703,10 @@ function Dt({ provider: r }) {
   ] });
 }
 function Tt() {
-  const r = O((t) => t.showSettings), l = O((t) => t.closeSettings);
-  return r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ o("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl max-w-xl w-full mx-4 max-h-[85vh] flex flex-col", children: [
-    /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-zinc-700", children: [
-      /* @__PURE__ */ o("div", { children: [
+  const r = V((t) => t.showSettings), l = V((t) => t.closeSettings);
+  return r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50", children: /* @__PURE__ */ n("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl max-w-xl w-full mx-4 max-h-[85vh] flex flex-col", children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-6 py-4 border-b border-gray-200 dark:border-zinc-700", children: [
+      /* @__PURE__ */ n("div", { children: [
         /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: "AI Provider Settings" }),
         /* @__PURE__ */ e("p", { className: "text-sm text-gray-500 dark:text-zinc-400 mt-0.5", children: "Configure your AI providers for vision and text generation" })
       ] }),
@@ -3727,16 +3727,16 @@ function Tt() {
         }
       )
     ] }),
-    /* @__PURE__ */ o("div", { className: "flex-1 overflow-y-auto p-6 space-y-6", children: [
-      /* @__PURE__ */ o("section", { children: [
+    /* @__PURE__ */ n("div", { className: "flex-1 overflow-y-auto p-6 space-y-6", children: [
+      /* @__PURE__ */ n("section", { children: [
         /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-gray-700 dark:text-zinc-300 mb-3", children: "Cloud Providers" }),
-        /* @__PURE__ */ e("div", { className: "space-y-3", children: $t.map((t) => /* @__PURE__ */ e(jt, { provider: t }, t.id)) })
+        /* @__PURE__ */ e("div", { className: "space-y-3", children: $t.map((t) => /* @__PURE__ */ e(Mt, { provider: t }, t.id)) })
       ] }),
-      /* @__PURE__ */ o("section", { children: [
+      /* @__PURE__ */ n("section", { children: [
         /* @__PURE__ */ e("h3", { className: "text-sm font-medium text-gray-700 dark:text-zinc-300 mb-3", children: "Local Providers" }),
-        /* @__PURE__ */ e("div", { className: "space-y-3", children: Mt.map((t) => /* @__PURE__ */ e(Dt, { provider: t }, t.id)) })
+        /* @__PURE__ */ e("div", { className: "space-y-3", children: jt.map((t) => /* @__PURE__ */ e(Dt, { provider: t }, t.id)) })
       ] }),
-      /* @__PURE__ */ e("div", { className: "bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg p-4", children: /* @__PURE__ */ o("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ e("div", { className: "bg-blue-50 dark:bg-blue-900/20 border border-blue-200 dark:border-blue-800 rounded-lg p-4", children: /* @__PURE__ */ n("div", { className: "flex items-start gap-3", children: [
         /* @__PURE__ */ e(
           "svg",
           {
@@ -3755,7 +3755,7 @@ function Tt() {
             )
           }
         ),
-        /* @__PURE__ */ o("div", { children: [
+        /* @__PURE__ */ n("div", { children: [
           /* @__PURE__ */ e("p", { className: "text-sm font-medium text-blue-900 dark:text-blue-300", children: "Your keys stay local" }),
           /* @__PURE__ */ e("p", { className: "text-sm text-blue-700 dark:text-blue-400 mt-1", children: "API keys are stored in your browser only and sent directly to providers. They never pass through our servers." })
         ] })
@@ -3772,54 +3772,54 @@ function Tt() {
   ] }) }) : null;
 }
 function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
-  const [n, i] = I([]), [s, p] = I(""), [d, a] = I(!1), [m, c] = I(null), [u, h] = I(null), [f, y] = I(""), v = Q(null), w = Q(null);
-  D(() => {
-    r && u === null && qe().then((x) => {
-      h(x.available), y(x.message);
+  const [o, i] = C([]), [s, p] = C(""), [d, a] = C(!1), [m, c] = C(null), [u, h] = C(null), [b, y] = C(""), [v, w] = C(), [x, g] = C(!1), [N, A] = C(), k = te(null), L = te(null);
+  U(() => {
+    r && u === null && qe().then((I) => {
+      h(I.available), y(I.message), w(I.reason), g(I.isCloudDeployment ?? !1), A(I.supportUrl);
     }).catch(() => {
-      h(!1), y("Failed to check AI availability");
+      h(!1), y("Failed to check AI availability"), w("service_unavailable");
     });
-  }, [r, u]), D(() => {
-    r && w.current && w.current.focus();
-  }, [r]), D(() => {
-    var x;
-    (x = v.current) == null || x.scrollIntoView({ behavior: "smooth" });
-  }, [n]);
-  const b = L(async () => {
+  }, [r, u]), U(() => {
+    r && L.current && L.current.focus();
+  }, [r]), U(() => {
+    var I;
+    (I = k.current) == null || I.scrollIntoView({ behavior: "smooth" });
+  }, [o]);
+  const S = W(async () => {
     if (!s.trim() || d) return;
-    const x = {
+    const I = {
       role: "user",
       content: s.trim(),
       timestamp: Date.now()
     };
-    i((C) => [...C, x]), p(""), a(!0), c(null);
+    i((M) => [...M, I]), p(""), a(!0), c(null);
     try {
-      const C = await Ke({
-        prompt: x.content,
-        history: n
-      }), S = {
+      const M = await Ke({
+        prompt: I.content,
+        history: o
+      }), E = {
         role: "assistant",
-        content: C.message,
-        workflow: C.workflow,
+        content: M.message,
+        workflow: M.workflow,
         timestamp: Date.now()
       };
-      i((T) => [...T, S]), !C.success && C.error && c(C.error);
-    } catch (C) {
-      c(C instanceof Error ? C.message : "Failed to generate workflow");
+      i((O) => [...O, E]), !M.success && M.error && c(M.error);
+    } catch (M) {
+      c(M instanceof Error ? M.message : "Failed to generate workflow");
     } finally {
       a(!1);
     }
-  }, [s, d, n]), g = (x) => {
-    x.key === "Enter" && !x.shiftKey && (x.preventDefault(), b());
-  }, z = (x) => {
-    t(x), l();
-  }, W = () => {
+  }, [s, d, o]), R = (I) => {
+    I.key === "Enter" && !I.shiftKey && (I.preventDefault(), S());
+  }, J = (I) => {
+    t(I), l();
+  }, Y = () => {
     i([]), c(null);
   };
-  return r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50", children: /* @__PURE__ */ o("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl w-full max-w-2xl mx-4 h-[80vh] flex flex-col", children: [
-    /* @__PURE__ */ o("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-zinc-700", children: [
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
+  return r ? /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50 flex items-center justify-center z-50", children: /* @__PURE__ */ n("div", { className: "bg-white dark:bg-zinc-800 rounded-lg shadow-xl w-full max-w-2xl mx-4 h-[80vh] flex flex-col", children: [
+    /* @__PURE__ */ n("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-200 dark:border-zinc-700", children: [
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ e(
             "svg",
             {
@@ -3842,11 +3842,11 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
         ] }),
         /* @__PURE__ */ e("span", { className: "text-xs bg-teal-100 dark:bg-teal-900 text-teal-700 dark:text-teal-300 px-2 py-0.5 rounded", children: "Gemini 3 Pro" })
       ] }),
-      /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
-        n.length > 0 && /* @__PURE__ */ e(
+      /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
+        o.length > 0 && /* @__PURE__ */ e(
           "button",
           {
-            onClick: W,
+            onClick: Y,
             className: "p-2 text-gray-500 dark:text-zinc-400 hover:text-gray-700 dark:hover:text-zinc-200 hover:bg-gray-100 dark:hover:bg-zinc-700 rounded",
             title: "New Chat",
             children: /* @__PURE__ */ e("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e(
@@ -3878,9 +3878,26 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
         )
       ] })
     ] }),
-    /* @__PURE__ */ o("div", { className: "flex-1 overflow-auto p-4 space-y-4", children: [
-      u === !1 && /* @__PURE__ */ e("div", { className: "bg-amber-50 dark:bg-amber-900/30 border border-amber-200 dark:border-amber-800 rounded-lg p-4", children: /* @__PURE__ */ o("div", { className: "flex items-start gap-3", children: [
-        /* @__PURE__ */ e(
+    /* @__PURE__ */ n("div", { className: "flex-1 overflow-auto p-4 space-y-4", children: [
+      u === !1 && /* @__PURE__ */ e("div", { className: "bg-amber-50 dark:bg-amber-900/30 border border-amber-200 dark:border-amber-800 rounded-lg p-4", children: /* @__PURE__ */ n("div", { className: "flex items-start gap-3", children: [
+        v === "tier_limit" ? /* @__PURE__ */ e(
+          "svg",
+          {
+            className: "h-5 w-5 text-amber-600 dark:text-amber-400 mt-0.5",
+            fill: "none",
+            viewBox: "0 0 24 24",
+            stroke: "currentColor",
+            children: /* @__PURE__ */ e(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                strokeWidth: 2,
+                d: "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
+              }
+            )
+          }
+        ) : /* @__PURE__ */ e(
           "svg",
           {
             className: "h-5 w-5 text-amber-600 dark:text-amber-400 mt-0.5",
@@ -3898,13 +3915,40 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
             )
           }
         ),
-        /* @__PURE__ */ o("div", { children: [
-          /* @__PURE__ */ e("p", { className: "font-medium text-amber-800 dark:text-amber-200", children: "AI Generation Not Available" }),
-          /* @__PURE__ */ e("p", { className: "text-sm text-amber-700 dark:text-amber-300 mt-1", children: f }),
-          /* @__PURE__ */ e("p", { className: "text-xs text-amber-600 dark:text-amber-400 mt-2", children: "Set GEMINI_API_KEY in your environment to enable this feature." })
+        /* @__PURE__ */ n("div", { children: [
+          /* @__PURE__ */ e("p", { className: "font-medium text-amber-800 dark:text-amber-200", children: v === "tier_limit" ? "AI Workflow Generation Not Available" : "AI Generation Not Available" }),
+          /* @__PURE__ */ e("p", { className: "text-sm text-amber-700 dark:text-amber-300 mt-1", children: b }),
+          /* @__PURE__ */ n("div", { className: "flex flex-col sm:flex-row gap-2 mt-3", children: [
+            v === "tier_limit" && /* @__PURE__ */ e(
+              "a",
+              {
+                href: "/pricing",
+                className: "text-sm font-medium text-teal-600 hover:text-teal-700 dark:text-teal-400 dark:hover:text-teal-300",
+                children: "View Plans"
+              }
+            ),
+            v === "service_unavailable" && N && /* @__PURE__ */ e(
+              "a",
+              {
+                href: N,
+                className: "text-sm font-medium text-amber-700 hover:text-amber-800 dark:text-amber-400 dark:hover:text-amber-300",
+                children: "Contact Support"
+              }
+            ),
+            v === "not_configured" && !x && /* @__PURE__ */ e(
+              "a",
+              {
+                href: "https://floimg.com/docs/studio/ai-workflows",
+                target: "_blank",
+                rel: "noopener noreferrer",
+                className: "text-sm font-medium text-teal-600 hover:text-teal-700 dark:text-teal-400 dark:hover:text-teal-300",
+                children: "View Setup Guide"
+              }
+            )
+          ] })
         ] })
       ] }) }),
-      n.length === 0 && u !== !1 && /* @__PURE__ */ o("div", { className: "text-center py-8", children: [
+      o.length === 0 && u !== !1 && /* @__PURE__ */ n("div", { className: "text-center py-8", children: [
         /* @__PURE__ */ e("div", { className: "inline-flex items-center justify-center w-16 h-16 bg-teal-100 dark:bg-teal-900/50 rounded-full mb-4", children: /* @__PURE__ */ e(
           "svg",
           {
@@ -3931,62 +3975,62 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
           "Generate an image with Gemini, then use it as a reference to create a variation with different lighting",
           "Create a product mockup: generate a minimalist logo, then composite it onto a t-shirt image",
           "Build an AI art pipeline: generate a base image, apply artistic style transfer, then upscale to 4K"
-        ].map((x, C) => /* @__PURE__ */ o(
+        ].map((I, M) => /* @__PURE__ */ n(
           "button",
           {
-            onClick: () => p(x),
+            onClick: () => p(I),
             className: "block w-full text-left text-sm px-4 py-2 bg-gray-100 dark:bg-zinc-700 hover:bg-gray-200 dark:hover:bg-zinc-600 rounded-lg text-gray-700 dark:text-zinc-300 transition-colors",
             children: [
               '"',
-              x,
+              I,
               '"'
             ]
           },
-          C
+          M
         )) })
       ] }),
-      n.map((x, C) => /* @__PURE__ */ e(
+      o.map((I, M) => /* @__PURE__ */ e(
         "div",
         {
-          className: `flex ${x.role === "user" ? "justify-end" : "justify-start"}`,
-          children: /* @__PURE__ */ o(
+          className: `flex ${I.role === "user" ? "justify-end" : "justify-start"}`,
+          children: /* @__PURE__ */ n(
             "div",
             {
-              className: `max-w-[80%] rounded-lg px-4 py-3 ${x.role === "user" ? "bg-teal-600 text-white" : "bg-gray-100 dark:bg-zinc-700 text-gray-900 dark:text-white"}`,
+              className: `max-w-[80%] rounded-lg px-4 py-3 ${I.role === "user" ? "bg-teal-600 text-white" : "bg-gray-100 dark:bg-zinc-700 text-gray-900 dark:text-white"}`,
               children: [
-                /* @__PURE__ */ e("p", { className: "text-sm whitespace-pre-wrap", children: x.content }),
-                x.role === "assistant" && x.workflow && /* @__PURE__ */ o("div", { className: "mt-3 pt-3 border-t border-gray-200 dark:border-zinc-600", children: [
-                  /* @__PURE__ */ o("div", { className: "flex items-center justify-between mb-2", children: [
+                /* @__PURE__ */ e("p", { className: "text-sm whitespace-pre-wrap", children: I.content }),
+                I.role === "assistant" && I.workflow && /* @__PURE__ */ n("div", { className: "mt-3 pt-3 border-t border-gray-200 dark:border-zinc-600", children: [
+                  /* @__PURE__ */ n("div", { className: "flex items-center justify-between mb-2", children: [
                     /* @__PURE__ */ e("span", { className: "text-xs font-medium text-gray-500 dark:text-zinc-400", children: "Generated Workflow" }),
                     /* @__PURE__ */ e(
                       "button",
                       {
-                        onClick: () => z(x.workflow),
+                        onClick: () => J(I.workflow),
                         className: "text-xs px-3 py-1 bg-teal-600 hover:bg-teal-700 text-white rounded transition-colors",
                         children: "Apply to Canvas"
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ e("div", { className: "bg-white dark:bg-zinc-800 rounded p-2 text-xs", children: /* @__PURE__ */ o("div", { className: "space-y-1", children: [
-                    x.workflow.nodes.map((S, T) => /* @__PURE__ */ o(
+                  /* @__PURE__ */ e("div", { className: "bg-white dark:bg-zinc-800 rounded p-2 text-xs", children: /* @__PURE__ */ n("div", { className: "space-y-1", children: [
+                    I.workflow.nodes.map((E, O) => /* @__PURE__ */ n(
                       "div",
                       {
                         className: "flex items-center gap-2 text-gray-600 dark:text-zinc-300",
                         children: [
-                          /* @__PURE__ */ e("span", { className: "font-mono bg-gray-100 dark:bg-zinc-700 px-1.5 py-0.5 rounded", children: S.nodeType.split(":").pop() }),
-                          S.label && /* @__PURE__ */ o("span", { className: "text-gray-400", children: [
+                          /* @__PURE__ */ e("span", { className: "font-mono bg-gray-100 dark:bg-zinc-700 px-1.5 py-0.5 rounded", children: E.nodeType.split(":").pop() }),
+                          E.label && /* @__PURE__ */ n("span", { className: "text-gray-400", children: [
                             "(",
-                            S.label,
+                            E.label,
                             ")"
                           ] })
                         ]
                       },
-                      T
+                      O
                     )),
-                    x.workflow.edges.length > 0 && /* @__PURE__ */ o("div", { className: "text-gray-400 dark:text-zinc-500 pt-1", children: [
-                      x.workflow.edges.length,
+                    I.workflow.edges.length > 0 && /* @__PURE__ */ n("div", { className: "text-gray-400 dark:text-zinc-500 pt-1", children: [
+                      I.workflow.edges.length,
                       " connection",
-                      x.workflow.edges.length !== 1 ? "s" : ""
+                      I.workflow.edges.length !== 1 ? "s" : ""
                     ] })
                   ] }) })
                 ] })
@@ -3994,10 +4038,10 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
             }
           )
         },
-        C
+        M
       )),
-      d && /* @__PURE__ */ e("div", { className: "flex justify-start", children: /* @__PURE__ */ e("div", { className: "bg-gray-100 dark:bg-zinc-700 rounded-lg px-4 py-3", children: /* @__PURE__ */ o("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ o("div", { className: "flex space-x-1", children: [
+      d && /* @__PURE__ */ e("div", { className: "flex justify-start", children: /* @__PURE__ */ e("div", { className: "bg-gray-100 dark:bg-zinc-700 rounded-lg px-4 py-3", children: /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ n("div", { className: "flex space-x-1", children: [
           /* @__PURE__ */ e("div", { className: "w-2 h-2 bg-gray-400 dark:bg-zinc-500 rounded-full animate-bounce" }),
           /* @__PURE__ */ e(
             "div",
@@ -4017,17 +4061,17 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
         /* @__PURE__ */ e("span", { className: "text-sm text-gray-500 dark:text-zinc-400", children: "Generating workflow..." })
       ] }) }) }),
       m && /* @__PURE__ */ e("div", { className: "bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-lg p-3", children: /* @__PURE__ */ e("p", { className: "text-sm text-red-700 dark:text-red-300", children: m }) }),
-      /* @__PURE__ */ e("div", { ref: v })
+      /* @__PURE__ */ e("div", { ref: k })
     ] }),
-    /* @__PURE__ */ o("div", { className: "border-t border-gray-200 dark:border-zinc-700 p-4", children: [
-      /* @__PURE__ */ o("div", { className: "flex gap-2", children: [
+    /* @__PURE__ */ n("div", { className: "border-t border-gray-200 dark:border-zinc-700 p-4", children: [
+      /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
         /* @__PURE__ */ e(
           "textarea",
           {
-            ref: w,
+            ref: L,
             value: s,
-            onChange: (x) => p(x.target.value),
-            onKeyDown: g,
+            onChange: (I) => p(I.target.value),
+            onKeyDown: R,
             placeholder: u === !1 ? "AI generation not available" : "Describe what workflow you want to create...",
             disabled: d || u === !1,
             rows: 2,
@@ -4037,7 +4081,7 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
         /* @__PURE__ */ e(
           "button",
           {
-            onClick: b,
+            onClick: S,
             disabled: !s.trim() || d || u === !1,
             className: "self-end px-4 py-2 bg-teal-600 hover:bg-teal-700 disabled:opacity-50 disabled:cursor-not-allowed text-white rounded-lg transition-colors",
             children: /* @__PURE__ */ e("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e(
@@ -4057,7 +4101,7 @@ function Ut({ isOpen: r, onClose: l, onApplyWorkflow: t }) {
   ] }) }) : null;
 }
 function Ot() {
-  const { screenToFlowPosition: r } = Pe(), l = k((i) => i.addNode), t = L(
+  const { screenToFlowPosition: r } = Pe(), l = f((i) => i.addNode), t = W(
     (i) => {
       i.preventDefault();
       const s = i.dataTransfer.getData("application/json");
@@ -4073,20 +4117,20 @@ function Ot() {
         }
     },
     [l, r]
-  ), n = L((i) => {
+  ), o = W((i) => {
     i.preventDefault(), i.dataTransfer.dropEffect = "move";
   }, []);
-  return /* @__PURE__ */ e("div", { className: "flex-1", onDrop: t, onDragOver: n, children: /* @__PURE__ */ e(nt, {}) });
+  return /* @__PURE__ */ e("div", { className: "flex-1", onDrop: t, onDragOver: o, children: /* @__PURE__ */ e(ot, {}) });
 }
 function _t() {
-  const [r, l] = I("editor"), [t, n] = I(!1), i = k((a) => a.loadTemplate), s = k((a) => a.loadGeneratedWorkflow);
-  D(() => {
+  const [r, l] = C("editor"), [t, o] = C(!1), i = f((a) => a.loadTemplate), s = f((a) => a.loadGeneratedWorkflow);
+  U(() => {
     const m = new URLSearchParams(window.location.search).get("template");
     if (m) {
-      const c = ce(m);
+      const c = pe(m);
       c && (i(c), window.history.replaceState({}, "", window.location.pathname));
     }
-  }, [i]), D(() => {
+  }, [i]), U(() => {
     const a = () => {
       l("editor");
     };
@@ -4094,33 +4138,33 @@ function _t() {
       window.removeEventListener("workflow-loaded", a);
     };
   }, []);
-  const p = L(
+  const p = W(
     (a) => {
-      const m = ce(a);
+      const m = pe(a);
       m && (i(m), l("editor"));
     },
     [i]
-  ), d = L(
+  ), d = W(
     (a) => {
       s(a), l("editor");
     },
     [s]
   );
-  return /* @__PURE__ */ o(Ae, { children: [
+  return /* @__PURE__ */ n(Ae, { children: [
     /* @__PURE__ */ e(Tt, {}),
     /* @__PURE__ */ e(
       Ut,
       {
         isOpen: t,
-        onClose: () => n(!1),
+        onClose: () => o(!1),
         onApplyWorkflow: d
       }
     ),
     /* @__PURE__ */ e(Pt, {}),
-    /* @__PURE__ */ o("div", { className: "h-screen flex flex-col bg-gray-100 dark:bg-zinc-900", children: [
+    /* @__PURE__ */ n("div", { className: "h-screen flex flex-col bg-gray-100 dark:bg-zinc-900", children: [
       /* @__PURE__ */ e(ht, {}),
-      /* @__PURE__ */ e("div", { className: "bg-white dark:bg-zinc-800 border-b border-gray-200 dark:border-zinc-700", children: /* @__PURE__ */ o("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ o("div", { className: "flex", children: [
+      /* @__PURE__ */ e("div", { className: "bg-white dark:bg-zinc-800 border-b border-gray-200 dark:border-zinc-700", children: /* @__PURE__ */ n("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ n("div", { className: "flex", children: [
           /* @__PURE__ */ e(
             "button",
             {
@@ -4146,10 +4190,10 @@ function _t() {
             }
           )
         ] }),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ n(
           "button",
           {
-            onClick: () => n(!0),
+            onClick: () => o(!0),
             className: "mr-4 px-4 py-1.5 text-sm font-medium text-white bg-gradient-to-r from-teal-500 to-cyan-500 hover:from-teal-600 hover:to-cyan-600 rounded-full flex items-center gap-2 transition-all shadow-sm hover:shadow",
             children: [
               /* @__PURE__ */ e("svg", { className: "h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e(
@@ -4166,8 +4210,8 @@ function _t() {
           }
         )
       ] }) }),
-      /* @__PURE__ */ o("div", { className: "flex-1 flex overflow-hidden", children: [
-        r === "editor" && /* @__PURE__ */ o(U, { children: [
+      /* @__PURE__ */ n("div", { className: "flex-1 flex overflow-hidden", children: [
+        r === "editor" && /* @__PURE__ */ n(B, { children: [
           /* @__PURE__ */ e(st, {}),
           /* @__PURE__ */ e(Ot, {}),
           /* @__PURE__ */ e(it, {})
@@ -4187,14 +4231,14 @@ export {
   st as NodePalette,
   Lt as TemplateGallery,
   ht as Toolbar,
-  ot as UploadGallery,
-  nt as WorkflowEditor,
+  nt as UploadGallery,
+  ot as WorkflowEditor,
   Pt as WorkflowLibrary,
   St as getCategories,
-  ce as getTemplateById,
+  pe as getTemplateById,
   Ft as getTemplatesByCategory,
   Ht as searchTemplates,
-  H as templates,
-  k as useWorkflowStore
+  q as templates,
+  f as useWorkflowStore
 };
 //# sourceMappingURL=index.js.map