@tangle-network/sandbox-ui 0.113.7 → 0.114.0

package/dist/assets.js

@@ -1,947 +1,1096 @@
-import {
-  cn
-} from "./chunk-EI44GEQ5.js";
-import "./chunk-CZ7CSFO4.js";
-
-// src/assets/approval-queue.tsx
-import * as React3 from "react";
-import { Button as Button3, Input as Input2 } from "@tangle-network/ui/primitives";
-import { Search, CheckCheck } from "lucide-react";
-
-// src/assets/asset-card.tsx
-import { Badge } from "@tangle-network/ui/primitives";
-import { Check, X, Pencil, GitBranch } from "lucide-react";
-
-// src/assets/preview/image-preview.tsx
-import * as React from "react";
-import { ChevronLeft, ChevronRight } from "lucide-react";
+import { t as cn } from "./utils-DzWbktWG.js";
+import { Badge, Button, Input, Label, Textarea } from "@tangle-network/ui/primitives";
 import { jsx, jsxs } from "react/jsx-runtime";
-var ASPECT = {
-  feed: "aspect-square",
-  story: "aspect-[9/16]",
-  carousel: "aspect-square"
+import * as React$1 from "react";
+import { Fragment as Fragment$1 } from "react";
+import { Check, CheckCheck, ChevronDown, ChevronLeft, ChevronRight, Film, GitBranch, Loader2, MessageSquare, Pencil, Play, Save, Search, Trophy, X } from "lucide-react";
+//#region src/assets/preview/image-preview.tsx
+const ASPECT = {
+	feed: "aspect-square",
+	story: "aspect-[9/16]",
+	carousel: "aspect-square"
 };
 function bgStyle(bg, brand) {
-  if (bg.type === "color") return { background: bg.value };
-  if (bg.type === "gradient") return { background: `linear-gradient(${bg.direction ?? "to bottom right"}, ${bg.from}, ${bg.to})` };
-  if (bg.type === "image") {
-    return {
-      backgroundImage: `url(${bg.url})`,
-      backgroundSize: "cover",
-      backgroundPosition: "center"
-    };
-  }
-  return { background: brand.primaryColor };
+	if (bg.type === "color") return { background: bg.value };
+	if (bg.type === "gradient") return { background: `linear-gradient(${bg.direction ?? "to bottom right"}, ${bg.from}, ${bg.to})` };
+	if (bg.type === "image") return {
+		backgroundImage: `url(${bg.url})`,
+		backgroundSize: "cover",
+		backgroundPosition: "center"
+	};
+	return { background: brand.primaryColor };
 }
 function Layer({ layer, brand }) {
-  const base = {
-    position: "absolute",
-    left: `${layer.x}%`,
-    top: `${layer.y}%`
-  };
-  if (layer.type === "text") {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          ...base,
-          fontSize: layer.fontSize ?? 16,
-          fontWeight: layer.fontWeight ?? "normal",
-          color: layer.color ?? brand.textColor,
-          width: layer.width ? `${layer.width}%` : void 0,
-          textAlign: layer.align ?? "left"
-        },
-        children: layer.text
-      }
-    );
-  }
-  if (layer.type === "image") {
-    return /* @__PURE__ */ jsx(
-      "img",
-      {
-        src: layer.url,
-        alt: "",
-        style: {
-          ...base,
-          width: `${layer.width}%`,
-          height: `${layer.height}%`,
-          opacity: layer.opacity ?? 1,
-          objectFit: "cover"
-        }
-      }
-    );
-  }
-  if (layer.type === "shape") {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          ...base,
-          width: `${layer.width}%`,
-          height: `${layer.height}%`,
-          background: layer.fill ?? brand.accentColor,
-          opacity: layer.opacity ?? 1,
-          borderRadius: layer.shape === "circle" ? "50%" : layer.shape === "rounded-rect" ? "8px" : 0
-        }
-      }
-    );
-  }
-  if (layer.type === "logo" && brand.logoUrl) {
-    return /* @__PURE__ */ jsx(
-      "img",
-      {
-        src: brand.logoUrl,
-        alt: brand.businessName,
-        style: {
-          ...base,
-          width: layer.width ? `${layer.width}%` : "12%"
-        }
-      }
-    );
-  }
-  return null;
+	const base = {
+		position: "absolute",
+		left: `${layer.x}%`,
+		top: `${layer.y}%`
+	};
+	if (layer.type === "text") return /* @__PURE__ */ jsx("div", {
+		style: {
+			...base,
+			fontSize: layer.fontSize ?? 16,
+			fontWeight: layer.fontWeight ?? "normal",
+			color: layer.color ?? brand.textColor,
+			width: layer.width ? `${layer.width}%` : void 0,
+			textAlign: layer.align ?? "left"
+		},
+		children: layer.text
+	});
+	if (layer.type === "image") return /* @__PURE__ */ jsx("img", {
+		src: layer.url,
+		alt: "",
+		style: {
+			...base,
+			width: `${layer.width}%`,
+			height: `${layer.height}%`,
+			opacity: layer.opacity ?? 1,
+			objectFit: "cover"
+		}
+	});
+	if (layer.type === "shape") return /* @__PURE__ */ jsx("div", { style: {
+		...base,
+		width: `${layer.width}%`,
+		height: `${layer.height}%`,
+		background: layer.fill ?? brand.accentColor,
+		opacity: layer.opacity ?? 1,
+		borderRadius: layer.shape === "circle" ? "50%" : layer.shape === "rounded-rect" ? "8px" : 0
+	} });
+	if (layer.type === "logo" && brand.logoUrl) return /* @__PURE__ */ jsx("img", {
+		src: brand.logoUrl,
+		alt: brand.businessName,
+		style: {
+			...base,
+			width: layer.width ? `${layer.width}%` : "12%"
+		}
+	});
+	return null;
 }
 function Slide({ slide, brand }) {
-  return /* @__PURE__ */ jsx("div", { className: "relative w-full h-full overflow-hidden", style: bgStyle(slide.background, brand), children: slide.layers.map((layer, i) => /* @__PURE__ */ jsx(Layer, { layer, brand }, i)) });
+	return /* @__PURE__ */ jsx("div", {
+		className: "relative w-full h-full overflow-hidden",
+		style: bgStyle(slide.background, brand),
+		children: slide.layers.map((layer, i) => /* @__PURE__ */ jsx(Layer, {
+			layer,
+			brand
+		}, i))
+	});
 }
 function ImagePreview({ content, brand, format = "feed", className }) {
-  const [activeIndex, setActiveIndex] = React.useState(0);
-  const slides = content.slides;
-  const isMulti = slides.length > 1;
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-2", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: cn("relative w-full rounded overflow-hidden", ASPECT[format]), children: [
-      /* @__PURE__ */ jsx(Slide, { slide: slides[activeIndex], brand }),
-      isMulti && activeIndex > 0 && /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: () => setActiveIndex((i) => i - 1),
-          className: "absolute left-1 top-1/2 -translate-y-1/2 rounded-full p-1 bg-black/40 text-white hover:bg-black/60",
-          children: /* @__PURE__ */ jsx(ChevronLeft, { size: 16 })
-        }
-      ),
-      isMulti && activeIndex < slides.length - 1 && /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: () => setActiveIndex((i) => i + 1),
-          className: "absolute right-1 top-1/2 -translate-y-1/2 rounded-full p-1 bg-black/40 text-white hover:bg-black/60",
-          children: /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
-        }
-      ),
-      isMulti && /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 left-1/2 -translate-x-1/2 flex gap-1", children: slides.map((_, i) => /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: () => setActiveIndex(i),
-          className: cn(
-            "w-1.5 h-1.5 rounded-full transition-colors",
-            i === activeIndex ? "bg-white" : "bg-white/40"
-          )
-        },
-        i
-      )) })
-    ] }),
-    isMulti && /* @__PURE__ */ jsxs("div", { className: "text-xs text-muted-foreground text-center", children: [
-      activeIndex + 1,
-      " / ",
-      slides.length
-    ] })
-  ] });
+	const [activeIndex, setActiveIndex] = React$1.useState(0);
+	const slides = content.slides;
+	const isMulti = slides.length > 1;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col gap-2", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: cn("relative w-full rounded overflow-hidden", ASPECT[format]),
+			children: [
+				/* @__PURE__ */ jsx(Slide, {
+					slide: slides[activeIndex],
+					brand
+				}),
+				isMulti && activeIndex > 0 && /* @__PURE__ */ jsx("button", {
+					onClick: () => setActiveIndex((i) => i - 1),
+					className: "absolute left-1 top-1/2 -translate-y-1/2 rounded-full p-1 bg-black/40 text-white hover:bg-black/60",
+					children: /* @__PURE__ */ jsx(ChevronLeft, { size: 16 })
+				}),
+				isMulti && activeIndex < slides.length - 1 && /* @__PURE__ */ jsx("button", {
+					onClick: () => setActiveIndex((i) => i + 1),
+					className: "absolute right-1 top-1/2 -translate-y-1/2 rounded-full p-1 bg-black/40 text-white hover:bg-black/60",
+					children: /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
+				}),
+				isMulti && /* @__PURE__ */ jsx("div", {
+					className: "absolute bottom-2 left-1/2 -translate-x-1/2 flex gap-1",
+					children: slides.map((_, i) => /* @__PURE__ */ jsx("button", {
+						onClick: () => setActiveIndex(i),
+						className: cn("w-1.5 h-1.5 rounded-full transition-colors", i === activeIndex ? "bg-white" : "bg-white/40")
+					}, i))
+				})
+			]
+		}), isMulti && /* @__PURE__ */ jsxs("div", {
+			className: "text-xs text-muted-foreground text-center",
+			children: [
+				activeIndex + 1,
+				" / ",
+				slides.length
+			]
+		})]
+	});
 }
-
-// src/assets/asset-card.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var STATUS_VARIANT = {
-  draft: "secondary",
-  pending_review: "outline",
-  approved: "default",
-  rejected: "destructive",
-  scheduled: "secondary",
-  published: "default"
+//#endregion
+//#region src/assets/asset-card.tsx
+const STATUS_VARIANT = {
+	draft: "secondary",
+	pending_review: "outline",
+	approved: "default",
+	rejected: "destructive",
+	scheduled: "secondary",
+	published: "default"
 };
-var STATUS_LABEL = {
-  draft: "Draft",
-  pending_review: "Review",
-  approved: "Approved",
-  rejected: "Rejected",
-  scheduled: "Scheduled",
-  published: "Published"
+const STATUS_LABEL = {
+	draft: "Draft",
+	pending_review: "Review",
+	approved: "Approved",
+	rejected: "Rejected",
+	scheduled: "Scheduled",
+	published: "Published"
 };
 function Thumbnail({ spec }) {
-  const { format, brand, content } = spec;
-  if (format === "email") {
-    const ec = content;
-    return /* @__PURE__ */ jsxs2("div", { className: "p-2 text-xs space-y-0.5", children: [
-      /* @__PURE__ */ jsx2("div", { className: "font-medium truncate", children: ec.subject }),
-      /* @__PURE__ */ jsxs2("div", { className: "text-muted-foreground truncate text-[10px]", children: [
-        ec.sections.length,
-        " sections"
-      ] })
-    ] });
-  }
-  if (format.startsWith("image:")) {
-    const imgFormat = format === "image:story" ? "story" : "feed";
-    return /* @__PURE__ */ jsx2("div", { className: "overflow-hidden rounded", style: { maxHeight: 120 }, children: /* @__PURE__ */ jsx2(
-      ImagePreview,
-      {
-        content,
-        brand,
-        format: imgFormat
-      }
-    ) });
-  }
-  if (format.startsWith("video:")) {
-    const vc = content;
-    return /* @__PURE__ */ jsxs2("div", { className: "p-2 text-xs space-y-0.5", children: [
-      /* @__PURE__ */ jsxs2("div", { className: "font-medium", children: [
-        vc.scenes.length,
-        " scenes"
-      ] }),
-      /* @__PURE__ */ jsxs2("div", { className: "text-muted-foreground", children: [
-        vc.durationSeconds,
-        "s video"
-      ] })
-    ] });
-  }
-  if (format.startsWith("copy:")) {
-    const cc = content;
-    return /* @__PURE__ */ jsxs2("div", { className: "p-2 text-xs truncate space-y-0.5", children: [
-      /* @__PURE__ */ jsx2("div", { className: "font-medium truncate", children: cc.headline }),
-      /* @__PURE__ */ jsx2("div", { className: "text-muted-foreground line-clamp-2 text-[10px]", children: cc.body })
-    ] });
-  }
-  return null;
+	const { format, brand, content } = spec;
+	if (format === "email") {
+		const ec = content;
+		return /* @__PURE__ */ jsxs("div", {
+			className: "p-2 text-xs space-y-0.5",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "font-medium truncate",
+				children: ec.subject
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "text-muted-foreground truncate text-[10px]",
+				children: [ec.sections.length, " sections"]
+			})]
+		});
+	}
+	if (format.startsWith("image:")) return /* @__PURE__ */ jsx("div", {
+		className: "overflow-hidden rounded",
+		style: { maxHeight: 120 },
+		children: /* @__PURE__ */ jsx(ImagePreview, {
+			content,
+			brand,
+			format: format === "image:story" ? "story" : "feed"
+		})
+	});
+	if (format.startsWith("video:")) {
+		const vc = content;
+		return /* @__PURE__ */ jsxs("div", {
+			className: "p-2 text-xs space-y-0.5",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "font-medium",
+				children: [vc.scenes.length, " scenes"]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "text-muted-foreground",
+				children: [vc.durationSeconds, "s video"]
+			})]
+		});
+	}
+	if (format.startsWith("copy:")) {
+		const cc = content;
+		return /* @__PURE__ */ jsxs("div", {
+			className: "p-2 text-xs truncate space-y-0.5",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "font-medium truncate",
+				children: cc.headline
+			}), /* @__PURE__ */ jsx("div", {
+				className: "text-muted-foreground line-clamp-2 text-[10px]",
+				children: cc.body
+			})]
+		});
+	}
+	return null;
 }
 function AssetCard({ spec, variantCount, onApprove, onReject, onEdit, className }) {
-  return /* @__PURE__ */ jsxs2("div", { className: cn("rounded-lg border border-border bg-card flex flex-col overflow-hidden hover:border-border/80 transition-colors", className), children: [
-    /* @__PURE__ */ jsx2("div", { className: "min-h-[80px] bg-muted/30", children: /* @__PURE__ */ jsx2(Thumbnail, { spec }) }),
-    /* @__PURE__ */ jsxs2("div", { className: "px-2 py-1.5 flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx2("span", { className: "text-[10px] text-muted-foreground flex-1 truncate", children: spec.format }),
-      /* @__PURE__ */ jsx2(Badge, { variant: STATUS_VARIANT[spec.status], className: "text-[10px] h-4 px-1.5", children: STATUS_LABEL[spec.status] }),
-      variantCount !== void 0 && variantCount > 0 && /* @__PURE__ */ jsxs2("span", { className: "flex items-center gap-0.5 text-[10px] text-muted-foreground", children: [
-        /* @__PURE__ */ jsx2(GitBranch, { size: 10 }),
-        variantCount
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs2("div", { className: "flex border-t border-border", children: [
-      onEdit && /* @__PURE__ */ jsxs2(
-        "button",
-        {
-          type: "button",
-          onClick: () => onEdit(spec.id),
-          className: "flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors",
-          children: [
-            /* @__PURE__ */ jsx2(Pencil, { size: 12 }),
-            "Edit"
-          ]
-        }
-      ),
-      onReject && spec.status === "pending_review" && /* @__PURE__ */ jsxs2(
-        "button",
-        {
-          type: "button",
-          onClick: () => onReject(spec.id),
-          className: "flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-muted-foreground hover:text-destructive hover:bg-destructive/5 transition-colors border-l border-border",
-          children: [
-            /* @__PURE__ */ jsx2(X, { size: 12 }),
-            "Reject"
-          ]
-        }
-      ),
-      onApprove && spec.status === "pending_review" && /* @__PURE__ */ jsxs2(
-        "button",
-        {
-          type: "button",
-          onClick: () => onApprove(spec.id),
-          className: "flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-muted-foreground hover:text-green-600 hover:bg-green-600/5 transition-colors border-l border-border",
-          children: [
-            /* @__PURE__ */ jsx2(Check, { size: 12 }),
-            "Approve"
-          ]
-        }
-      )
-    ] })
-  ] });
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("rounded-lg border border-border bg-card flex flex-col overflow-hidden hover:border-border/80 transition-colors", className),
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: "min-h-[80px] bg-muted/30",
+				children: /* @__PURE__ */ jsx(Thumbnail, { spec })
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "px-2 py-1.5 flex items-center gap-1.5",
+				children: [
+					/* @__PURE__ */ jsx("span", {
+						className: "text-[10px] text-muted-foreground flex-1 truncate",
+						children: spec.format
+					}),
+					/* @__PURE__ */ jsx(Badge, {
+						variant: STATUS_VARIANT[spec.status],
+						className: "text-[10px] h-4 px-1.5",
+						children: STATUS_LABEL[spec.status]
+					}),
+					variantCount !== void 0 && variantCount > 0 && /* @__PURE__ */ jsxs("span", {
+						className: "flex items-center gap-0.5 text-[10px] text-muted-foreground",
+						children: [/* @__PURE__ */ jsx(GitBranch, { size: 10 }), variantCount]
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex border-t border-border",
+				children: [
+					onEdit && /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: () => onEdit(spec.id),
+						className: "flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors",
+						children: [/* @__PURE__ */ jsx(Pencil, { size: 12 }), "Edit"]
+					}),
+					onReject && spec.status === "pending_review" && /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: () => onReject(spec.id),
+						className: "flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-muted-foreground hover:text-destructive hover:bg-destructive/5 transition-colors border-l border-border",
+						children: [/* @__PURE__ */ jsx(X, { size: 12 }), "Reject"]
+					}),
+					onApprove && spec.status === "pending_review" && /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						onClick: () => onApprove(spec.id),
+						className: "flex-1 flex items-center justify-center gap-1 py-1.5 text-xs text-muted-foreground hover:text-green-600 hover:bg-green-600/5 transition-colors border-l border-border",
+						children: [/* @__PURE__ */ jsx(Check, { size: 12 }), "Approve"]
+					})
+				]
+			})
+		]
+	});
 }
-
-// src/assets/asset-editor.tsx
-import * as React2 from "react";
-import { Button as Button2, Input, Textarea, Label } from "@tangle-network/ui/primitives";
-import { MessageSquare, Save, ChevronDown, ChevronRight as ChevronRight2 } from "lucide-react";
-
-// src/assets/preview/email-preview.tsx
-import { jsxs as jsxs3, jsx as jsx3 } from "react/jsx-runtime";
+//#endregion
+//#region src/assets/preview/email-preview.tsx
 function EmailPreview({ content, brand, previewUrl, className }) {
-  if (previewUrl) {
-    return jsxs3("div", { className: cn("flex flex-col gap-1", className), children: [
-      jsx3("div", { className: "text-xs text-muted-foreground font-medium truncate", children: content.subject }),
-      content.preheader && jsx3("div", { className: "text-xs text-muted-foreground/60 truncate", children: content.preheader }),
-      jsx3(
-        "iframe",
-        {
-          src: previewUrl,
-          className: "w-full rounded border border-border",
-          style: { height: 480, background: "#fff" },
-          title: "Email preview",
-          sandbox: "allow-same-origin"
-        }
-      )
-    ] });
-  }
-  return jsxs3("div", { className: cn("flex flex-col gap-2", className), children: [
-    jsx3("div", { className: "text-sm font-semibold truncate", children: content.subject }),
-    content.preheader && jsx3("div", { className: "text-xs text-muted-foreground truncate", children: content.preheader }),
-    jsx3(
-      "div",
-      {
-        className: "rounded border border-border p-4 space-y-3 overflow-y-auto",
-        style: { maxHeight: 480, fontFamily: brand.fontFamily, color: brand.textColor },
-        children: content.sections.map((section, i) => {
-          if (section.type === "hero") {
-            return jsxs3("div", { className: "text-center py-4 space-y-2", children: [
-              section.imageUrl && jsx3("img", { src: section.imageUrl, alt: "", className: "mx-auto max-h-40 object-cover rounded" }),
-              jsx3("div", { className: "text-xl font-bold", style: { color: brand.primaryColor }, children: section.headline }),
-              section.subheadline && jsx3("div", { className: "text-sm text-muted-foreground", children: section.subheadline }),
-              section.ctaLabel && jsx3(
-                "a",
-                {
-                  href: section.ctaUrl ?? "#",
-                  className: "inline-block px-4 py-2 rounded text-sm font-medium text-white",
-                  style: { background: brand.primaryColor },
-                  children: section.ctaLabel
-                }
-              )
-            ] }, i);
-          }
-          if (section.type === "body") {
-            return jsx3("p", { className: "text-sm leading-relaxed whitespace-pre-wrap", children: section.text }, i);
-          }
-          if (section.type === "feature") {
-            return jsxs3("div", { className: "flex gap-3 items-start", children: [
-              section.imageUrl && jsx3("img", { src: section.imageUrl, alt: "", className: "w-16 h-16 object-cover rounded shrink-0" }),
-              jsxs3("div", { children: [
-                jsx3("div", { className: "text-sm font-semibold", children: section.headline }),
-                jsx3("div", { className: "text-xs text-muted-foreground mt-0.5", children: section.description })
-              ] })
-            ] }, i);
-          }
-          if (section.type === "testimonial") {
-            return jsxs3("blockquote", { className: "border-l-2 pl-3 italic text-sm text-muted-foreground", style: { borderColor: brand.accentColor }, children: [
-              jsxs3("p", { children: [
-                '"',
-                section.quote,
-                '"'
-              ] }),
-              jsxs3("footer", { className: "mt-1 text-xs not-italic font-medium", children: [
-                section.author,
-                section.role ? `, ${section.role}` : ""
-              ] })
-            ] }, i);
-          }
-          if (section.type === "cta") {
-            return jsxs3("div", { className: "text-center py-3 space-y-1", children: [
-              jsx3(
-                "a",
-                {
-                  href: section.url,
-                  className: "inline-block px-5 py-2.5 rounded font-medium text-white text-sm",
-                  style: { background: brand.primaryColor },
-                  children: section.label
-                }
-              ),
-              section.subtext && jsx3("p", { className: "text-xs text-muted-foreground", children: section.subtext })
-            ] }, i);
-          }
-          if (section.type === "divider") {
-            return jsx3("hr", { className: "border-border" }, i);
-          }
-          return null;
-        })
-      }
-    )
-  ] });
+	if (previewUrl) return jsxs("div", {
+		className: cn("flex flex-col gap-1", className),
+		children: [
+			jsx("div", {
+				className: "text-xs text-muted-foreground font-medium truncate",
+				children: content.subject
+			}),
+			content.preheader && jsx("div", {
+				className: "text-xs text-muted-foreground/60 truncate",
+				children: content.preheader
+			}),
+			jsx("iframe", {
+				src: previewUrl,
+				className: "w-full rounded border border-border",
+				style: {
+					height: 480,
+					background: "#fff"
+				},
+				title: "Email preview",
+				sandbox: "allow-same-origin"
+			})
+		]
+	});
+	return jsxs("div", {
+		className: cn("flex flex-col gap-2", className),
+		children: [
+			jsx("div", {
+				className: "text-sm font-semibold truncate",
+				children: content.subject
+			}),
+			content.preheader && jsx("div", {
+				className: "text-xs text-muted-foreground truncate",
+				children: content.preheader
+			}),
+			jsx("div", {
+				className: "rounded border border-border p-4 space-y-3 overflow-y-auto",
+				style: {
+					maxHeight: 480,
+					fontFamily: brand.fontFamily,
+					color: brand.textColor
+				},
+				children: content.sections.map((section, i) => {
+					if (section.type === "hero") return jsxs("div", {
+						className: "text-center py-4 space-y-2",
+						children: [
+							section.imageUrl && jsx("img", {
+								src: section.imageUrl,
+								alt: "",
+								className: "mx-auto max-h-40 object-cover rounded"
+							}),
+							jsx("div", {
+								className: "text-xl font-bold",
+								style: { color: brand.primaryColor },
+								children: section.headline
+							}),
+							section.subheadline && jsx("div", {
+								className: "text-sm text-muted-foreground",
+								children: section.subheadline
+							}),
+							section.ctaLabel && jsx("a", {
+								href: section.ctaUrl ?? "#",
+								className: "inline-block px-4 py-2 rounded text-sm font-medium text-white",
+								style: { background: brand.primaryColor },
+								children: section.ctaLabel
+							})
+						]
+					}, i);
+					if (section.type === "body") return jsx("p", {
+						className: "text-sm leading-relaxed whitespace-pre-wrap",
+						children: section.text
+					}, i);
+					if (section.type === "feature") return jsxs("div", {
+						className: "flex gap-3 items-start",
+						children: [section.imageUrl && jsx("img", {
+							src: section.imageUrl,
+							alt: "",
+							className: "w-16 h-16 object-cover rounded shrink-0"
+						}), jsxs("div", { children: [jsx("div", {
+							className: "text-sm font-semibold",
+							children: section.headline
+						}), jsx("div", {
+							className: "text-xs text-muted-foreground mt-0.5",
+							children: section.description
+						})] })]
+					}, i);
+					if (section.type === "testimonial") return jsxs("blockquote", {
+						className: "border-l-2 pl-3 italic text-sm text-muted-foreground",
+						style: { borderColor: brand.accentColor },
+						children: [jsxs("p", { children: [
+							"\"",
+							section.quote,
+							"\""
+						] }), jsxs("footer", {
+							className: "mt-1 text-xs not-italic font-medium",
+							children: [section.author, section.role ? `, ${section.role}` : ""]
+						})]
+					}, i);
+					if (section.type === "cta") return jsxs("div", {
+						className: "text-center py-3 space-y-1",
+						children: [jsx("a", {
+							href: section.url,
+							className: "inline-block px-5 py-2.5 rounded font-medium text-white text-sm",
+							style: { background: brand.primaryColor },
+							children: section.label
+						}), section.subtext && jsx("p", {
+							className: "text-xs text-muted-foreground",
+							children: section.subtext
+						})]
+					}, i);
+					if (section.type === "divider") return jsx("hr", { className: "border-border" }, i);
+					return null;
+				})
+			})
+		]
+	});
 }
-
-// src/assets/preview/video-preview.tsx
-import { Fragment } from "react";
-import { Play, Film, Loader2 } from "lucide-react";
-import { Button } from "@tangle-network/ui/primitives";
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+//#endregion
+//#region src/assets/preview/video-preview.tsx
 function VideoPreview({ content, brand, onRenderRequest, isRendering, className }) {
-  if (content.renderedUrl) {
-    return /* @__PURE__ */ jsx4("div", { className: cn("rounded overflow-hidden aspect-[9/16] bg-black", className), children: /* @__PURE__ */ jsx4(
-      "video",
-      {
-        src: content.renderedUrl,
-        controls: true,
-        className: "w-full h-full object-contain",
-        playsInline: true
-      }
-    ) });
-  }
-  const sceneSummary = content.scenes.map((s) => {
-    if (s.type === "text-animation") return s.headline;
-    if (s.type === "image-reveal") return s.caption ?? "Image";
-    if (s.type === "slide") return "Slide";
-    if (s.type === "countdown") return `${s.from}\u2026`;
-    return "Scene";
-  });
-  return /* @__PURE__ */ jsxs4("div", { className: cn("flex flex-col gap-3", className), children: [
-    /* @__PURE__ */ jsxs4(
-      "div",
-      {
-        className: "relative rounded overflow-hidden aspect-[9/16] flex flex-col items-center justify-center gap-3",
-        style: { background: brand.primaryColor, color: brand.textColor },
-        children: [
-          /* @__PURE__ */ jsx4(Film, { size: 32, className: "opacity-60" }),
-          /* @__PURE__ */ jsx4("div", { className: "text-sm font-medium text-center px-4", children: brand.businessName }),
-          /* @__PURE__ */ jsxs4("div", { className: "text-xs opacity-60", children: [
-            content.scenes.length,
-            " scenes ",
-            "\xB7",
-            " ",
-            content.durationSeconds,
-            "s"
-          ] })
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxs4("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx4("div", { className: "text-xs font-medium text-muted-foreground", children: "Scenes" }),
-      sceneSummary.map((label, i) => /* @__PURE__ */ jsxs4("div", { className: "text-xs text-muted-foreground flex gap-1.5 items-center", children: [
-        /* @__PURE__ */ jsx4("span", { className: "font-mono text-[10px] w-4 text-right opacity-50", children: i + 1 }),
-        /* @__PURE__ */ jsx4("span", { children: label }),
-        /* @__PURE__ */ jsxs4("span", { className: "opacity-40", children: [
-          "\xB7",
-          " ",
-          content.scenes[i].durationSeconds,
-          "s"
-        ] })
-      ] }, i))
-    ] }),
-    onRenderRequest && /* @__PURE__ */ jsx4(
-      Button,
-      {
-        size: "sm",
-        variant: "outline",
-        onClick: onRenderRequest,
-        disabled: isRendering,
-        className: "w-full gap-2",
-        children: isRendering ? /* @__PURE__ */ jsxs4(Fragment, { children: [
-          /* @__PURE__ */ jsx4(Loader2, { size: 14, className: "animate-spin", "data-motion": "essential" }),
-          "Rendering\u2026"
-        ] }) : /* @__PURE__ */ jsxs4(Fragment, { children: [
-          /* @__PURE__ */ jsx4(Play, { size: 14 }),
-          "Render in sandbox"
-        ] })
-      }
-    )
-  ] });
+	if (content.renderedUrl) return /* @__PURE__ */ jsx("div", {
+		className: cn("rounded overflow-hidden aspect-[9/16] bg-black", className),
+		children: /* @__PURE__ */ jsx("video", {
+			src: content.renderedUrl,
+			controls: true,
+			className: "w-full h-full object-contain",
+			playsInline: true
+		})
+	});
+	const sceneSummary = content.scenes.map((s) => {
+		if (s.type === "text-animation") return s.headline;
+		if (s.type === "image-reveal") return s.caption ?? "Image";
+		if (s.type === "slide") return "Slide";
+		if (s.type === "countdown") return `${s.from}…`;
+		return "Scene";
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col gap-3", className),
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "relative rounded overflow-hidden aspect-[9/16] flex flex-col items-center justify-center gap-3",
+				style: {
+					background: brand.primaryColor,
+					color: brand.textColor
+				},
+				children: [
+					/* @__PURE__ */ jsx(Film, {
+						size: 32,
+						className: "opacity-60"
+					}),
+					/* @__PURE__ */ jsx("div", {
+						className: "text-sm font-medium text-center px-4",
+						children: brand.businessName
+					}),
+					/* @__PURE__ */ jsxs("div", {
+						className: "text-xs opacity-60",
+						children: [
+							content.scenes.length,
+							" scenes ",
+							"·",
+							" ",
+							content.durationSeconds,
+							"s"
+						]
+					})
+				]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-1",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "text-xs font-medium text-muted-foreground",
+					children: "Scenes"
+				}), sceneSummary.map((label, i) => /* @__PURE__ */ jsxs("div", {
+					className: "text-xs text-muted-foreground flex gap-1.5 items-center",
+					children: [
+						/* @__PURE__ */ jsx("span", {
+							className: "font-mono text-[10px] w-4 text-right opacity-50",
+							children: i + 1
+						}),
+						/* @__PURE__ */ jsx("span", { children: label }),
+						/* @__PURE__ */ jsxs("span", {
+							className: "opacity-40",
+							children: [
+								"·",
+								" ",
+								content.scenes[i].durationSeconds,
+								"s"
+							]
+						})
+					]
+				}, i))]
+			}),
+			onRenderRequest && /* @__PURE__ */ jsx(Button, {
+				size: "sm",
+				variant: "outline",
+				onClick: onRenderRequest,
+				disabled: isRendering,
+				className: "w-full gap-2",
+				children: isRendering ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Loader2, {
+					size: 14,
+					className: "animate-spin",
+					"data-motion": "essential"
+				}), "Rendering…"] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Play, { size: 14 }), "Render in sandbox"] })
+			})
+		]
+	});
 }
-
-// src/assets/preview/copy-preview.tsx
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-var PLATFORM_LIMITS = {
-  instagram: 2200,
-  tiktok: 2200,
-  x: 280,
-  linkedin: 3e3,
-  sms: 160,
-  "email-subject": 60
+//#endregion
+//#region src/assets/preview/copy-preview.tsx
+const PLATFORM_LIMITS = {
+	instagram: 2200,
+	tiktok: 2200,
+	x: 280,
+	linkedin: 3e3,
+	sms: 160,
+	"email-subject": 60
 };
-var PLATFORM_LABELS = {
-  instagram: "Instagram",
-  tiktok: "TikTok",
-  x: "X / Twitter",
-  linkedin: "LinkedIn",
-  sms: "SMS",
-  "email-subject": "Email Subject"
+const PLATFORM_LABELS = {
+	instagram: "Instagram",
+	tiktok: "TikTok",
+	x: "X / Twitter",
+	linkedin: "LinkedIn",
+	sms: "SMS",
+	"email-subject": "Email Subject"
 };
 function CopyPreview({ content, className }) {
-  const limit = PLATFORM_LIMITS[content.platform];
-  const bodyLen = content.body.length;
-  const isOverLimit = limit !== null && bodyLen > limit;
-  const warningThreshold = limit !== null ? limit * 0.9 : null;
-  const isNearLimit = !isOverLimit && warningThreshold !== null && bodyLen >= warningThreshold;
-  return /* @__PURE__ */ jsxs5("div", { className: cn("flex flex-col gap-2", className), children: [
-    /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-between", children: [
-      /* @__PURE__ */ jsx5("span", { className: "text-xs font-medium text-muted-foreground", children: PLATFORM_LABELS[content.platform] }),
-      limit !== null && /* @__PURE__ */ jsxs5("span", { className: cn("text-xs tabular-nums", isOverLimit ? "text-destructive font-medium" : isNearLimit ? "text-warning" : "text-muted-foreground"), children: [
-        bodyLen,
-        " / ",
-        limit
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxs5("div", { className: "rounded border border-border p-3 space-y-2 bg-card", children: [
-      content.headline && /* @__PURE__ */ jsx5("div", { className: "text-sm font-semibold", children: content.headline }),
-      /* @__PURE__ */ jsx5("p", { className: "text-sm whitespace-pre-wrap leading-relaxed", children: content.body }),
-      content.hashtags && content.hashtags.length > 0 && /* @__PURE__ */ jsx5("div", { className: "text-sm text-blue-500 flex flex-wrap gap-1", children: content.hashtags.map((tag) => /* @__PURE__ */ jsxs5("span", { children: [
-        "#",
-        tag
-      ] }, tag)) })
-    ] })
-  ] });
+	const limit = PLATFORM_LIMITS[content.platform];
+	const bodyLen = content.body.length;
+	const isOverLimit = limit !== null && bodyLen > limit;
+	const warningThreshold = limit !== null ? limit * .9 : null;
+	const isNearLimit = !isOverLimit && warningThreshold !== null && bodyLen >= warningThreshold;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col gap-2", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "text-xs font-medium text-muted-foreground",
+				children: PLATFORM_LABELS[content.platform]
+			}), limit !== null && /* @__PURE__ */ jsxs("span", {
+				className: cn("text-xs tabular-nums", isOverLimit ? "text-destructive font-medium" : isNearLimit ? "text-warning" : "text-muted-foreground"),
+				children: [
+					bodyLen,
+					" / ",
+					limit
+				]
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "rounded border border-border p-3 space-y-2 bg-card",
+			children: [
+				content.headline && /* @__PURE__ */ jsx("div", {
+					className: "text-sm font-semibold",
+					children: content.headline
+				}),
+				/* @__PURE__ */ jsx("p", {
+					className: "text-sm whitespace-pre-wrap leading-relaxed",
+					children: content.body
+				}),
+				content.hashtags && content.hashtags.length > 0 && /* @__PURE__ */ jsx("div", {
+					className: "text-sm text-blue-500 flex flex-wrap gap-1",
+					children: content.hashtags.map((tag) => /* @__PURE__ */ jsxs("span", { children: ["#", tag] }, tag))
+				})
+			]
+		})]
+	});
 }
-
-// src/assets/asset-editor.tsx
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+//#endregion
+//#region src/assets/asset-editor.tsx
 function BrandPanel({ brand, onChange }) {
-  const [open, setOpen] = React2.useState(false);
-  return /* @__PURE__ */ jsxs6("div", { className: "border border-border rounded", children: [
-    /* @__PURE__ */ jsxs6(
-      "button",
-      {
-        type: "button",
-        className: "flex w-full items-center justify-between px-3 py-2 text-xs font-medium text-muted-foreground hover:text-foreground",
-        onClick: () => setOpen((o) => !o),
-        children: [
-          "Brand tokens",
-          open ? /* @__PURE__ */ jsx6(ChevronDown, { size: 14 }) : /* @__PURE__ */ jsx6(ChevronRight2, { size: 14 })
-        ]
-      }
-    ),
-    open && /* @__PURE__ */ jsxs6("div", { className: "px-3 pb-3 space-y-2 border-t border-border pt-2", children: [
-      ["primaryColor", "accentColor", "textColor"].map((key) => /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx6(
-          "input",
-          {
-            type: "color",
-            value: brand[key],
-            onChange: (e) => onChange({ ...brand, [key]: e.target.value }),
-            className: "w-6 h-6 rounded cursor-pointer border-0"
-          }
-        ),
-        /* @__PURE__ */ jsx6(Label, { className: "text-xs capitalize", children: key.replace(/Color/, " color") })
-      ] }, key)),
-      /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Font family" }),
-        /* @__PURE__ */ jsx6(
-          Input,
-          {
-            value: brand.fontFamily,
-            onChange: (e) => onChange({ ...brand, fontFamily: e.target.value }),
-            className: "h-7 text-xs"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-        /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Logo URL" }),
-        /* @__PURE__ */ jsx6(
-          Input,
-          {
-            value: brand.logoUrl ?? "",
-            onChange: (e) => onChange({ ...brand, logoUrl: e.target.value || void 0 }),
-            className: "h-7 text-xs",
-            placeholder: "https://\u2026"
-          }
-        )
-      ] })
-    ] })
-  ] });
+	const [open, setOpen] = React$1.useState(false);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "border border-border rounded",
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			className: "flex w-full items-center justify-between px-3 py-2 text-xs font-medium text-muted-foreground hover:text-foreground",
+			onClick: () => setOpen((o) => !o),
+			children: ["Brand tokens", open ? /* @__PURE__ */ jsx(ChevronDown, { size: 14 }) : /* @__PURE__ */ jsx(ChevronRight, { size: 14 })]
+		}), open && /* @__PURE__ */ jsxs("div", {
+			className: "px-3 pb-3 space-y-2 border-t border-border pt-2",
+			children: [
+				[
+					"primaryColor",
+					"accentColor",
+					"textColor"
+				].map((key) => /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ jsx("input", {
+						type: "color",
+						value: brand[key],
+						onChange: (e) => onChange({
+							...brand,
+							[key]: e.target.value
+						}),
+						className: "w-6 h-6 rounded cursor-pointer border-0"
+					}), /* @__PURE__ */ jsx(Label, {
+						className: "text-xs capitalize",
+						children: key.replace(/Color/, " color")
+					})]
+				}, key)),
+				/* @__PURE__ */ jsxs("div", {
+					className: "space-y-1",
+					children: [/* @__PURE__ */ jsx(Label, {
+						className: "text-xs",
+						children: "Font family"
+					}), /* @__PURE__ */ jsx(Input, {
+						value: brand.fontFamily,
+						onChange: (e) => onChange({
+							...brand,
+							fontFamily: e.target.value
+						}),
+						className: "h-7 text-xs"
+					})]
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "space-y-1",
+					children: [/* @__PURE__ */ jsx(Label, {
+						className: "text-xs",
+						children: "Logo URL"
+					}), /* @__PURE__ */ jsx(Input, {
+						value: brand.logoUrl ?? "",
+						onChange: (e) => onChange({
+							...brand,
+							logoUrl: e.target.value || void 0
+						}),
+						className: "h-7 text-xs",
+						placeholder: "https://…"
+					})]
+				})
+			]
+		})]
+	});
 }
 function EmailEditor({ spec, onChange }) {
-  const content = spec.content;
-  return /* @__PURE__ */ jsxs6("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Subject" }),
-      /* @__PURE__ */ jsx6(
-        Input,
-        {
-          value: content.subject,
-          onChange: (e) => onChange({ ...spec, content: { ...content, subject: e.target.value } }),
-          className: "h-8 text-sm"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Preheader" }),
-      /* @__PURE__ */ jsx6(
-        Input,
-        {
-          value: content.preheader ?? "",
-          onChange: (e) => onChange({ ...spec, content: { ...content, preheader: e.target.value || void 0 } }),
-          className: "h-8 text-sm",
-          placeholder: "Preview text\u2026"
-        }
-      )
-    ] }),
-    content.sections.map((section, i) => {
-      if (section.type === "hero" || section.type === "body" || section.type === "cta") {
-        const textField = section.type === "body" ? "text" : section.type === "cta" ? "label" : "headline";
-        const val = section[textField] ?? "";
-        return /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-          /* @__PURE__ */ jsxs6(Label, { className: "text-xs capitalize", children: [
-            section.type,
-            " \u2014 ",
-            textField
-          ] }),
-          /* @__PURE__ */ jsx6(
-            Textarea,
-            {
-              value: val,
-              onChange: (e) => {
-                const updated = [...content.sections];
-                updated[i] = { ...updated[i], [textField]: e.target.value };
-                onChange({ ...spec, content: { ...content, sections: updated } });
-              },
-              className: "text-sm min-h-[60px]"
-            }
-          )
-        ] }, i);
-      }
-      return null;
-    })
-  ] });
+	const content = spec.content;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-3",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-1",
+				children: [/* @__PURE__ */ jsx(Label, {
+					className: "text-xs",
+					children: "Subject"
+				}), /* @__PURE__ */ jsx(Input, {
+					value: content.subject,
+					onChange: (e) => onChange({
+						...spec,
+						content: {
+							...content,
+							subject: e.target.value
+						}
+					}),
+					className: "h-8 text-sm"
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-1",
+				children: [/* @__PURE__ */ jsx(Label, {
+					className: "text-xs",
+					children: "Preheader"
+				}), /* @__PURE__ */ jsx(Input, {
+					value: content.preheader ?? "",
+					onChange: (e) => onChange({
+						...spec,
+						content: {
+							...content,
+							preheader: e.target.value || void 0
+						}
+					}),
+					className: "h-8 text-sm",
+					placeholder: "Preview text…"
+				})]
+			}),
+			content.sections.map((section, i) => {
+				if (section.type === "hero" || section.type === "body" || section.type === "cta") {
+					const textField = section.type === "body" ? "text" : section.type === "cta" ? "label" : "headline";
+					const val = section[textField] ?? "";
+					return /* @__PURE__ */ jsxs("div", {
+						className: "space-y-1",
+						children: [/* @__PURE__ */ jsxs(Label, {
+							className: "text-xs capitalize",
+							children: [
+								section.type,
+								" — ",
+								textField
+							]
+						}), /* @__PURE__ */ jsx(Textarea, {
+							value: val,
+							onChange: (e) => {
+								const updated = [...content.sections];
+								updated[i] = {
+									...updated[i],
+									[textField]: e.target.value
+								};
+								onChange({
+									...spec,
+									content: {
+										...content,
+										sections: updated
+									}
+								});
+							},
+							className: "text-sm min-h-[60px]"
+						})]
+					}, i);
+				}
+				return null;
+			})
+		]
+	});
 }
 function CopyEditor({ spec, onChange }) {
-  const content = spec.content;
-  return /* @__PURE__ */ jsxs6("div", { className: "space-y-3", children: [
-    /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Headline" }),
-      /* @__PURE__ */ jsx6(
-        Input,
-        {
-          value: content.headline,
-          onChange: (e) => onChange({ ...spec, content: { ...content, headline: e.target.value } }),
-          className: "h-8 text-sm"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Body" }),
-      /* @__PURE__ */ jsx6(
-        Textarea,
-        {
-          value: content.body,
-          onChange: (e) => onChange({ ...spec, content: { ...content, body: e.target.value } }),
-          className: "text-sm min-h-[80px]"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs6("div", { className: "space-y-1", children: [
-      /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Hashtags (comma-separated)" }),
-      /* @__PURE__ */ jsx6(
-        Input,
-        {
-          value: (content.hashtags ?? []).join(", "),
-          onChange: (e) => onChange({ ...spec, content: { ...content, hashtags: e.target.value.split(",").map((t) => t.trim()).filter(Boolean) } }),
-          className: "h-8 text-sm",
-          placeholder: "marketing, growth, saas"
-        }
-      )
-    ] })
-  ] });
+	const content = spec.content;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-3",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-1",
+				children: [/* @__PURE__ */ jsx(Label, {
+					className: "text-xs",
+					children: "Headline"
+				}), /* @__PURE__ */ jsx(Input, {
+					value: content.headline,
+					onChange: (e) => onChange({
+						...spec,
+						content: {
+							...content,
+							headline: e.target.value
+						}
+					}),
+					className: "h-8 text-sm"
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-1",
+				children: [/* @__PURE__ */ jsx(Label, {
+					className: "text-xs",
+					children: "Body"
+				}), /* @__PURE__ */ jsx(Textarea, {
+					value: content.body,
+					onChange: (e) => onChange({
+						...spec,
+						content: {
+							...content,
+							body: e.target.value
+						}
+					}),
+					className: "text-sm min-h-[80px]"
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "space-y-1",
+				children: [/* @__PURE__ */ jsx(Label, {
+					className: "text-xs",
+					children: "Hashtags (comma-separated)"
+				}), /* @__PURE__ */ jsx(Input, {
+					value: (content.hashtags ?? []).join(", "),
+					onChange: (e) => onChange({
+						...spec,
+						content: {
+							...content,
+							hashtags: e.target.value.split(",").map((t) => t.trim()).filter(Boolean)
+						}
+					}),
+					className: "h-8 text-sm",
+					placeholder: "marketing, growth, saas"
+				})]
+			})
+		]
+	});
 }
 function Preview({ spec, previewUrl, isRendering, onRenderRequest }) {
-  const { format, brand, content } = spec;
-  if (format === "email") return /* @__PURE__ */ jsx6(EmailPreview, { content, brand, previewUrl });
-  if (format.startsWith("image:")) {
-    const imgFormat = format === "image:story" ? "story" : format === "image:carousel" ? "carousel" : "feed";
-    return /* @__PURE__ */ jsx6(ImagePreview, { content, brand, format: imgFormat });
-  }
-  if (format.startsWith("video:")) {
-    return /* @__PURE__ */ jsx6(VideoPreview, { content, brand, onRenderRequest, isRendering });
-  }
-  if (format.startsWith("copy:")) {
-    return /* @__PURE__ */ jsx6(CopyPreview, { content });
-  }
-  return null;
+	const { format, brand, content } = spec;
+	if (format === "email") return /* @__PURE__ */ jsx(EmailPreview, {
+		content,
+		brand,
+		previewUrl
+	});
+	if (format.startsWith("image:")) return /* @__PURE__ */ jsx(ImagePreview, {
+		content,
+		brand,
+		format: format === "image:story" ? "story" : format === "image:carousel" ? "carousel" : "feed"
+	});
+	if (format.startsWith("video:")) return /* @__PURE__ */ jsx(VideoPreview, {
+		content,
+		brand,
+		onRenderRequest,
+		isRendering
+	});
+	if (format.startsWith("copy:")) return /* @__PURE__ */ jsx(CopyPreview, { content });
+	return null;
 }
 function AssetEditor({ spec, previewUrl, isRendering, onSave, onRenderRequest, onRevisionRequest, className }) {
-  const [draft, setDraft] = React2.useState(spec);
-  const [revisionInput, setRevisionInput] = React2.useState("");
-  const isDirty = JSON.stringify(draft) !== JSON.stringify(spec);
-  React2.useEffect(() => {
-    setDraft(spec);
-  }, [spec]);
-  const handleRevision = () => {
-    if (!revisionInput.trim()) return;
-    onRevisionRequest?.(revisionInput.trim());
-    setRevisionInput("");
-  };
-  return /* @__PURE__ */ jsxs6("div", { className: cn("grid grid-cols-2 gap-4 h-full min-h-0", className), children: [
-    /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-3 overflow-y-auto pr-1", children: [
-      /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsx6("span", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider", children: draft.format }),
-        isDirty && onSave && /* @__PURE__ */ jsxs6(Button2, { size: "sm", variant: "default", onClick: () => onSave(draft), className: "h-7 gap-1.5 text-xs", children: [
-          /* @__PURE__ */ jsx6(Save, { size: 12 }),
-          "Save"
-        ] })
-      ] }),
-      draft.format === "email" && /* @__PURE__ */ jsx6(EmailEditor, { spec: draft, onChange: (s) => setDraft(s) }),
-      (draft.format === "copy:caption" || draft.format === "copy:headline" || draft.format === "copy:sms") && /* @__PURE__ */ jsx6(CopyEditor, { spec: draft, onChange: (s) => setDraft(s) }),
-      /* @__PURE__ */ jsx6(BrandPanel, { brand: draft.brand, onChange: (b) => setDraft((d) => ({ ...d, brand: b })) }),
-      onRevisionRequest && /* @__PURE__ */ jsxs6("div", { className: "space-y-1.5", children: [
-        /* @__PURE__ */ jsx6(Label, { className: "text-xs", children: "Ask agent to revise" }),
-        /* @__PURE__ */ jsxs6("div", { className: "flex gap-1.5", children: [
-          /* @__PURE__ */ jsx6(
-            Input,
-            {
-              value: revisionInput,
-              onChange: (e) => setRevisionInput(e.target.value),
-              placeholder: "Make the CTA more urgent\u2026",
-              className: "h-8 text-sm",
-              onKeyDown: (e) => {
-                if (e.key === "Enter" && !e.shiftKey) {
-                  e.preventDefault();
-                  handleRevision();
-                }
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx6(
-            Button2,
-            {
-              size: "sm",
-              variant: "outline",
-              onClick: handleRevision,
-              disabled: !revisionInput.trim(),
-              className: "h-8 px-2",
-              children: /* @__PURE__ */ jsx6(MessageSquare, { size: 14 })
-            }
-          )
-        ] })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx6("div", { className: "overflow-y-auto", children: /* @__PURE__ */ jsx6(
-      Preview,
-      {
-        spec: draft,
-        previewUrl,
-        isRendering,
-        onRenderRequest
-      }
-    ) })
-  ] });
+	const [draft, setDraft] = React$1.useState(spec);
+	const [revisionInput, setRevisionInput] = React$1.useState("");
+	const isDirty = JSON.stringify(draft) !== JSON.stringify(spec);
+	React$1.useEffect(() => {
+		setDraft(spec);
+	}, [spec]);
+	const handleRevision = () => {
+		if (!revisionInput.trim()) return;
+		onRevisionRequest?.(revisionInput.trim());
+		setRevisionInput("");
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("grid grid-cols-2 gap-4 h-full min-h-0", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-3 overflow-y-auto pr-1",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "flex items-center justify-between",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider",
+						children: draft.format
+					}), isDirty && onSave && /* @__PURE__ */ jsxs(Button, {
+						size: "sm",
+						variant: "default",
+						onClick: () => onSave(draft),
+						className: "h-7 gap-1.5 text-xs",
+						children: [/* @__PURE__ */ jsx(Save, { size: 12 }), "Save"]
+					})]
+				}),
+				draft.format === "email" && /* @__PURE__ */ jsx(EmailEditor, {
+					spec: draft,
+					onChange: (s) => setDraft(s)
+				}),
+				(draft.format === "copy:caption" || draft.format === "copy:headline" || draft.format === "copy:sms") && /* @__PURE__ */ jsx(CopyEditor, {
+					spec: draft,
+					onChange: (s) => setDraft(s)
+				}),
+				/* @__PURE__ */ jsx(BrandPanel, {
+					brand: draft.brand,
+					onChange: (b) => setDraft((d) => ({
+						...d,
+						brand: b
+					}))
+				}),
+				onRevisionRequest && /* @__PURE__ */ jsxs("div", {
+					className: "space-y-1.5",
+					children: [/* @__PURE__ */ jsx(Label, {
+						className: "text-xs",
+						children: "Ask agent to revise"
+					}), /* @__PURE__ */ jsxs("div", {
+						className: "flex gap-1.5",
+						children: [/* @__PURE__ */ jsx(Input, {
+							value: revisionInput,
+							onChange: (e) => setRevisionInput(e.target.value),
+							placeholder: "Make the CTA more urgent…",
+							className: "h-8 text-sm",
+							onKeyDown: (e) => {
+								if (e.key === "Enter" && !e.shiftKey) {
+									e.preventDefault();
+									handleRevision();
+								}
+							}
+						}), /* @__PURE__ */ jsx(Button, {
+							size: "sm",
+							variant: "outline",
+							onClick: handleRevision,
+							disabled: !revisionInput.trim(),
+							className: "h-8 px-2",
+							children: /* @__PURE__ */ jsx(MessageSquare, { size: 14 })
+						})]
+					})]
+				})
+			]
+		}), /* @__PURE__ */ jsx("div", {
+			className: "overflow-y-auto",
+			children: /* @__PURE__ */ jsx(Preview, {
+				spec: draft,
+				previewUrl,
+				isRendering,
+				onRenderRequest
+			})
+		})]
+	});
 }
-
-// src/assets/approval-queue.tsx
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
-var FORMAT_OPTIONS = [
-  { value: "all", label: "All formats" },
-  { value: "email", label: "Email" },
-  { value: "image:feed", label: "Feed image" },
-  { value: "image:story", label: "Story" },
-  { value: "image:carousel", label: "Carousel" },
-  { value: "video:reel", label: "Reel" },
-  { value: "video:feed", label: "Video" },
-  { value: "copy:caption", label: "Caption" },
-  { value: "copy:headline", label: "Headline" },
-  { value: "copy:sms", label: "SMS" }
+//#endregion
+//#region src/assets/approval-queue.tsx
+const FORMAT_OPTIONS = [
+	{
+		value: "all",
+		label: "All formats"
+	},
+	{
+		value: "email",
+		label: "Email"
+	},
+	{
+		value: "image:feed",
+		label: "Feed image"
+	},
+	{
+		value: "image:story",
+		label: "Story"
+	},
+	{
+		value: "image:carousel",
+		label: "Carousel"
+	},
+	{
+		value: "video:reel",
+		label: "Reel"
+	},
+	{
+		value: "video:feed",
+		label: "Video"
+	},
+	{
+		value: "copy:caption",
+		label: "Caption"
+	},
+	{
+		value: "copy:headline",
+		label: "Headline"
+	},
+	{
+		value: "copy:sms",
+		label: "SMS"
+	}
 ];
-var STATUS_OPTIONS = [
-  { value: "all", label: "All statuses" },
-  { value: "pending_review", label: "Needs review" },
-  { value: "approved", label: "Approved" },
-  { value: "rejected", label: "Rejected" },
-  { value: "scheduled", label: "Scheduled" },
-  { value: "published", label: "Published" }
+const STATUS_OPTIONS = [
+	{
+		value: "all",
+		label: "All statuses"
+	},
+	{
+		value: "pending_review",
+		label: "Needs review"
+	},
+	{
+		value: "approved",
+		label: "Approved"
+	},
+	{
+		value: "rejected",
+		label: "Rejected"
+	},
+	{
+		value: "scheduled",
+		label: "Scheduled"
+	},
+	{
+		value: "published",
+		label: "Published"
+	}
 ];
-function ApprovalQueue({
-  assets,
-  variantCounts = {},
-  onApprove,
-  onReject,
-  onEdit,
-  onSave,
-  onRevisionRequest,
-  onRenderRequest,
-  renderingIds = /* @__PURE__ */ new Set(),
-  previewUrls = {},
-  className
-}) {
-  const [search, setSearch] = React3.useState("");
-  const [formatFilter, setFormatFilter] = React3.useState("all");
-  const [statusFilter, setStatusFilter] = React3.useState("pending_review");
-  const [editingId, setEditingId] = React3.useState(null);
-  const [scheduleDate, setScheduleDate] = React3.useState("");
-  const filtered = assets.filter((a) => {
-    if (formatFilter !== "all" && a.format !== formatFilter) return false;
-    if (statusFilter !== "all" && a.status !== statusFilter) return false;
-    if (search) {
-      const q = search.toLowerCase();
-      if (!a.id.includes(q) && !a.format.includes(q) && !a.brand.businessName.toLowerCase().includes(q)) return false;
-    }
-    return true;
-  });
-  const pendingCount = assets.filter((a) => a.status === "pending_review").length;
-  const handleBulkApprove = () => {
-    filtered.filter((a) => a.status === "pending_review").forEach((a) => onApprove?.(a.id, scheduleDate || void 0));
-  };
-  const editingSpec = editingId ? assets.find((a) => a.id === editingId) : null;
-  if (editingSpec) {
-    return /* @__PURE__ */ jsxs7("div", { className: cn("flex flex-col gap-3 h-full", className), children: [
-      /* @__PURE__ */ jsxs7("div", { className: "flex items-center justify-between", children: [
-        /* @__PURE__ */ jsx7(
-          "button",
-          {
-            type: "button",
-            onClick: () => setEditingId(null),
-            className: "text-xs text-muted-foreground hover:text-foreground",
-            children: "\u2190 Back to queue"
-          }
-        ),
-        /* @__PURE__ */ jsxs7("div", { className: "flex gap-2", children: [
-          onReject && editingSpec.status === "pending_review" && /* @__PURE__ */ jsx7(Button3, { size: "sm", variant: "outline", onClick: () => {
-            onReject(editingSpec.id);
-            setEditingId(null);
-          }, children: "Reject" }),
-          onApprove && editingSpec.status === "pending_review" && /* @__PURE__ */ jsx7(Button3, { size: "sm", onClick: () => {
-            onApprove(editingSpec.id, scheduleDate || void 0);
-            setEditingId(null);
-          }, children: "Approve" })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx7(
-        AssetEditor,
-        {
-          spec: editingSpec,
-          previewUrl: previewUrls[editingSpec.id],
-          isRendering: renderingIds.has(editingSpec.id),
-          onSave: (s) => {
-            onSave?.(s);
-            setEditingId(null);
-          },
-          onRenderRequest: () => onRenderRequest?.(editingSpec.id),
-          onRevisionRequest: (instr) => onRevisionRequest?.(editingSpec.id, instr),
-          className: "flex-1"
-        }
-      )
-    ] });
-  }
-  return /* @__PURE__ */ jsxs7("div", { className: cn("flex flex-col gap-3", className), children: [
-    /* @__PURE__ */ jsxs7("div", { className: "flex flex-wrap gap-2 items-center", children: [
-      /* @__PURE__ */ jsxs7("div", { className: "relative flex-1 min-w-40", children: [
-        /* @__PURE__ */ jsx7(Search, { size: 12, className: "absolute left-2.5 top-1/2 -translate-y-1/2 text-muted-foreground" }),
-        /* @__PURE__ */ jsx7(
-          Input2,
-          {
-            value: search,
-            onChange: (e) => setSearch(e.target.value),
-            placeholder: "Filter assets\u2026",
-            className: "h-8 pl-7 text-sm"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx7(
-        "select",
-        {
-          value: formatFilter,
-          onChange: (e) => setFormatFilter(e.target.value),
-          className: "h-8 px-2 text-xs rounded border border-input bg-background",
-          children: FORMAT_OPTIONS.map((o) => /* @__PURE__ */ jsx7("option", { value: o.value, children: o.label }, o.value))
-        }
-      ),
-      /* @__PURE__ */ jsx7(
-        "select",
-        {
-          value: statusFilter,
-          onChange: (e) => setStatusFilter(e.target.value),
-          className: "h-8 px-2 text-xs rounded border border-input bg-background",
-          children: STATUS_OPTIONS.map((o) => /* @__PURE__ */ jsx7("option", { value: o.value, children: o.label }, o.value))
-        }
-      ),
-      pendingCount > 0 && onApprove && /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-1.5", children: [
-        /* @__PURE__ */ jsx7(
-          "input",
-          {
-            type: "date",
-            value: scheduleDate,
-            onChange: (e) => setScheduleDate(e.target.value),
-            className: "h-8 px-2 text-xs rounded border border-input bg-background w-32"
-          }
-        ),
-        /* @__PURE__ */ jsxs7(Button3, { size: "sm", variant: "outline", onClick: handleBulkApprove, className: "h-8 gap-1.5 text-xs", children: [
-          /* @__PURE__ */ jsx7(CheckCheck, { size: 13 }),
-          "Approve all (",
-          pendingCount,
-          ")"
-        ] })
-      ] })
-    ] }),
-    filtered.length === 0 ? /* @__PURE__ */ jsx7("div", { className: "py-12 text-center text-sm text-muted-foreground", children: "No assets match your filters." }) : /* @__PURE__ */ jsx7("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3", children: filtered.map((a) => /* @__PURE__ */ jsx7(
-      AssetCard,
-      {
-        spec: a,
-        variantCount: variantCounts[a.id],
-        onApprove,
-        onReject,
-        onEdit: () => setEditingId(a.id)
-      },
-      a.id
-    )) })
-  ] });
+function ApprovalQueue({ assets, variantCounts = {}, onApprove, onReject, onEdit, onSave, onRevisionRequest, onRenderRequest, renderingIds = /* @__PURE__ */ new Set(), previewUrls = {}, className }) {
+	const [search, setSearch] = React$1.useState("");
+	const [formatFilter, setFormatFilter] = React$1.useState("all");
+	const [statusFilter, setStatusFilter] = React$1.useState("pending_review");
+	const [editingId, setEditingId] = React$1.useState(null);
+	const [scheduleDate, setScheduleDate] = React$1.useState("");
+	const filtered = assets.filter((a) => {
+		if (formatFilter !== "all" && a.format !== formatFilter) return false;
+		if (statusFilter !== "all" && a.status !== statusFilter) return false;
+		if (search) {
+			const q = search.toLowerCase();
+			if (!a.id.includes(q) && !a.format.includes(q) && !a.brand.businessName.toLowerCase().includes(q)) return false;
+		}
+		return true;
+	});
+	const pendingCount = assets.filter((a) => a.status === "pending_review").length;
+	const handleBulkApprove = () => {
+		filtered.filter((a) => a.status === "pending_review").forEach((a) => onApprove?.(a.id, scheduleDate || void 0));
+	};
+	const editingSpec = editingId ? assets.find((a) => a.id === editingId) : null;
+	if (editingSpec) return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col gap-3 h-full", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ jsx("button", {
+				type: "button",
+				onClick: () => setEditingId(null),
+				className: "text-xs text-muted-foreground hover:text-foreground",
+				children: "← Back to queue"
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex gap-2",
+				children: [onReject && editingSpec.status === "pending_review" && /* @__PURE__ */ jsx(Button, {
+					size: "sm",
+					variant: "outline",
+					onClick: () => {
+						onReject(editingSpec.id);
+						setEditingId(null);
+					},
+					children: "Reject"
+				}), onApprove && editingSpec.status === "pending_review" && /* @__PURE__ */ jsx(Button, {
+					size: "sm",
+					onClick: () => {
+						onApprove(editingSpec.id, scheduleDate || void 0);
+						setEditingId(null);
+					},
+					children: "Approve"
+				})]
+			})]
+		}), /* @__PURE__ */ jsx(AssetEditor, {
+			spec: editingSpec,
+			previewUrl: previewUrls[editingSpec.id],
+			isRendering: renderingIds.has(editingSpec.id),
+			onSave: (s) => {
+				onSave?.(s);
+				setEditingId(null);
+			},
+			onRenderRequest: () => onRenderRequest?.(editingSpec.id),
+			onRevisionRequest: (instr) => onRevisionRequest?.(editingSpec.id, instr),
+			className: "flex-1"
+		})]
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col gap-3", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex flex-wrap gap-2 items-center",
+			children: [
+				/* @__PURE__ */ jsxs("div", {
+					className: "relative flex-1 min-w-40",
+					children: [/* @__PURE__ */ jsx(Search, {
+						size: 12,
+						className: "absolute left-2.5 top-1/2 -translate-y-1/2 text-muted-foreground"
+					}), /* @__PURE__ */ jsx(Input, {
+						value: search,
+						onChange: (e) => setSearch(e.target.value),
+						placeholder: "Filter assets…",
+						className: "h-8 pl-7 text-sm"
+					})]
+				}),
+				/* @__PURE__ */ jsx("select", {
+					value: formatFilter,
+					onChange: (e) => setFormatFilter(e.target.value),
+					className: "h-8 px-2 text-xs rounded border border-input bg-background",
+					children: FORMAT_OPTIONS.map((o) => /* @__PURE__ */ jsx("option", {
+						value: o.value,
+						children: o.label
+					}, o.value))
+				}),
+				/* @__PURE__ */ jsx("select", {
+					value: statusFilter,
+					onChange: (e) => setStatusFilter(e.target.value),
+					className: "h-8 px-2 text-xs rounded border border-input bg-background",
+					children: STATUS_OPTIONS.map((o) => /* @__PURE__ */ jsx("option", {
+						value: o.value,
+						children: o.label
+					}, o.value))
+				}),
+				pendingCount > 0 && onApprove && /* @__PURE__ */ jsxs("div", {
+					className: "flex items-center gap-1.5",
+					children: [/* @__PURE__ */ jsx("input", {
+						type: "date",
+						value: scheduleDate,
+						onChange: (e) => setScheduleDate(e.target.value),
+						className: "h-8 px-2 text-xs rounded border border-input bg-background w-32"
+					}), /* @__PURE__ */ jsxs(Button, {
+						size: "sm",
+						variant: "outline",
+						onClick: handleBulkApprove,
+						className: "h-8 gap-1.5 text-xs",
+						children: [
+							/* @__PURE__ */ jsx(CheckCheck, { size: 13 }),
+							"Approve all (",
+							pendingCount,
+							")"
+						]
+					})]
+				})
+			]
+		}), filtered.length === 0 ? /* @__PURE__ */ jsx("div", {
+			className: "py-12 text-center text-sm text-muted-foreground",
+			children: "No assets match your filters."
+		}) : /* @__PURE__ */ jsx("div", {
+			className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-3",
+			children: filtered.map((a) => /* @__PURE__ */ jsx(AssetCard, {
+				spec: a,
+				variantCount: variantCounts[a.id],
+				onApprove,
+				onReject,
+				onEdit: () => setEditingId(a.id)
+			}, a.id))
+		})]
+	});
 }
-
-// src/assets/variant-compare.tsx
-import { Button as Button4, Badge as Badge2 } from "@tangle-network/ui/primitives";
-import { Trophy } from "lucide-react";
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
+//#endregion
+//#region src/assets/variant-compare.tsx
 function VariantCompare({ variants, onPromote, onSave, className }) {
-  const cols = Math.min(variants.length, 3);
-  if (variants.length === 0) {
-    return /* @__PURE__ */ jsx8("div", { className: cn("py-12 text-center text-sm text-muted-foreground", className), children: "No variants to compare." });
-  }
-  return /* @__PURE__ */ jsxs8("div", { className: cn("flex flex-col gap-3", className), children: [
-    /* @__PURE__ */ jsxs8("div", { className: "text-xs text-muted-foreground", children: [
-      "Comparing ",
-      variants.length,
-      " variant",
-      variants.length !== 1 ? "s" : "",
-      ".",
-      onPromote && " Promote one to mark it approved and archive the rest."
-    ] }),
-    /* @__PURE__ */ jsx8(
-      "div",
-      {
-        className: "grid gap-3",
-        style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
-        children: variants.slice(0, 3).map((variant) => /* @__PURE__ */ jsxs8("div", { className: "flex flex-col gap-2 rounded-lg border border-border p-3", children: [
-          /* @__PURE__ */ jsxs8("div", { className: "flex items-center justify-between", children: [
-            /* @__PURE__ */ jsxs8("div", { className: "flex items-center gap-1.5", children: [
-              /* @__PURE__ */ jsx8("span", { className: "text-xs font-medium", children: variant.label }),
-              variant.approvedAt && /* @__PURE__ */ jsx8(Badge2, { variant: "default", className: "text-[10px] h-4 px-1.5", children: "Approved" }),
-              variant.rejectedAt && /* @__PURE__ */ jsx8(Badge2, { variant: "destructive", className: "text-[10px] h-4 px-1.5", children: "Rejected" })
-            ] }),
-            onPromote && !variant.approvedAt && /* @__PURE__ */ jsxs8(
-              Button4,
-              {
-                size: "sm",
-                variant: "outline",
-                onClick: () => onPromote(variant.id),
-                className: "h-6 gap-1 text-[11px] px-2",
-                children: [
-                  /* @__PURE__ */ jsx8(Trophy, { size: 11 }),
-                  "Pick this"
-                ]
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx8(
-            AssetEditor,
-            {
-              spec: variant.spec,
-              onSave: (spec) => onSave?.({ ...variant, spec }),
-              className: "min-h-[300px]"
-            }
-          ),
-          variant.editLog.length > 0 && /* @__PURE__ */ jsxs8("div", { className: "text-[10px] text-muted-foreground space-y-0.5", children: [
-            /* @__PURE__ */ jsx8("span", { className: "font-medium", children: "Edit history" }),
-            variant.editLog.slice(-3).map((ev, i) => /* @__PURE__ */ jsxs8("div", { children: [
-              ev.action,
-              ev.editedFields?.length ? ` (${ev.editedFields.join(", ")})` : ""
-            ] }, i))
-          ] })
-        ] }, variant.id))
-      }
-    )
-  ] });
+	const cols = Math.min(variants.length, 3);
+	if (variants.length === 0) return /* @__PURE__ */ jsx("div", {
+		className: cn("py-12 text-center text-sm text-muted-foreground", className),
+		children: "No variants to compare."
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex flex-col gap-3", className),
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "text-xs text-muted-foreground",
+			children: [
+				"Comparing ",
+				variants.length,
+				" variant",
+				variants.length !== 1 ? "s" : "",
+				".",
+				onPromote && " Promote one to mark it approved and archive the rest."
+			]
+		}), /* @__PURE__ */ jsx("div", {
+			className: "grid gap-3",
+			style: { gridTemplateColumns: `repeat(${cols}, minmax(0, 1fr))` },
+			children: variants.slice(0, 3).map((variant) => /* @__PURE__ */ jsxs("div", {
+				className: "flex flex-col gap-2 rounded-lg border border-border p-3",
+				children: [
+					/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center justify-between",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "flex items-center gap-1.5",
+							children: [
+								/* @__PURE__ */ jsx("span", {
+									className: "text-xs font-medium",
+									children: variant.label
+								}),
+								variant.approvedAt && /* @__PURE__ */ jsx(Badge, {
+									variant: "default",
+									className: "text-[10px] h-4 px-1.5",
+									children: "Approved"
+								}),
+								variant.rejectedAt && /* @__PURE__ */ jsx(Badge, {
+									variant: "destructive",
+									className: "text-[10px] h-4 px-1.5",
+									children: "Rejected"
+								})
+							]
+						}), onPromote && !variant.approvedAt && /* @__PURE__ */ jsxs(Button, {
+							size: "sm",
+							variant: "outline",
+							onClick: () => onPromote(variant.id),
+							className: "h-6 gap-1 text-[11px] px-2",
+							children: [/* @__PURE__ */ jsx(Trophy, { size: 11 }), "Pick this"]
+						})]
+					}),
+					/* @__PURE__ */ jsx(AssetEditor, {
+						spec: variant.spec,
+						onSave: (spec) => onSave?.({
+							...variant,
+							spec
+						}),
+						className: "min-h-[300px]"
+					}),
+					variant.editLog.length > 0 && /* @__PURE__ */ jsxs("div", {
+						className: "text-[10px] text-muted-foreground space-y-0.5",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "font-medium",
+							children: "Edit history"
+						}), variant.editLog.slice(-3).map((ev, i) => /* @__PURE__ */ jsxs("div", { children: [ev.action, ev.editedFields?.length ? ` (${ev.editedFields.join(", ")})` : ""] }, i))]
+					})
+				]
+			}, variant.id))
+		})]
+	});
 }
-export {
-  ApprovalQueue,
-  AssetCard,
-  AssetEditor,
-  CopyPreview,
-  EmailPreview,
-  ImagePreview,
-  VariantCompare,
-  VideoPreview
-};
+//#endregion
+export { ApprovalQueue, AssetCard, AssetEditor, CopyPreview, EmailPreview, ImagePreview, VariantCompare, VideoPreview };