best-email-builder 0.2.0 → 0.4.0

package/dist/chunk-AT73Y7JA.js

@@ -0,0 +1,1427 @@
+import {
+  DARK_PAGE,
+  DEFAULT_ASSETS_PATH,
+  DEFAULT_BUTTON_URL,
+  DEFAULT_VARIABLES,
+  EMAIL_MOBILE_WIDTH,
+  FONT_STACK,
+  GROUPS,
+  IMAGE_TYPES,
+  PALETTE,
+  cleanBrand,
+  identity,
+  imageUploadError,
+  inWhiteSection,
+  prop,
+  readDocument,
+  simulateDarkMode,
+  translatorFor,
+  validateCustomVariable
+} from "./chunk-HHLOE6OZ.js";
+
+// src/ui/context.jsx
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { AlertCircle, CheckCircle2, Info, TriangleAlert, X } from "lucide-react";
+
+// src/ui/primitives/overlays.jsx
+import {
+  AlertDialog as AlertDialogPrimitive,
+  Dialog as DialogPrimitive,
+  DropdownMenu as DropdownMenuPrimitive,
+  Popover as PopoverPrimitive,
+  Select as SelectPrimitive
+} from "radix-ui";
+import { CheckIcon, ChevronDownIcon, XIcon } from "lucide-react";
+
+// src/ui/primitives/cn.js
+import { clsx } from "clsx";
+import { extendTailwindMerge } from "tailwind-merge";
+var twMerge = extendTailwindMerge({ prefix: "eb" });
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/ui/primitives/overlays.jsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var FADE_ZOOM = "eb:data-[state=open]:animate-in eb:data-[state=open]:fade-in-0 eb:data-[state=open]:zoom-in-95 eb:data-[state=closed]:animate-out eb:data-[state=closed]:fade-out-0 eb:data-[state=closed]:zoom-out-95";
+function Dialog(props) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
+}
+function DialogContent({ className, children, showCloseButton = true, ...props }) {
+  const t = useT();
+  return /* @__PURE__ */ jsxs(DialogPrimitive.Portal, { children: [
+    /* @__PURE__ */ jsx(DialogPrimitive.Overlay, { className: "eb-scope eb:fixed eb:inset-0 eb:z-50 eb:bg-black/50 eb:data-[state=open]:animate-in eb:data-[state=open]:fade-in-0 eb:data-[state=closed]:animate-out eb:data-[state=closed]:fade-out-0" }),
+    /* @__PURE__ */ jsxs(
+      DialogPrimitive.Content,
+      {
+        "data-slot": "dialog-content",
+        className: cn(
+          "eb-scope eb:fixed eb:top-[50%] eb:left-[50%] eb:z-50 eb:grid eb:w-full eb:max-w-[calc(100%-2rem)] eb:translate-x-[-50%] eb:translate-y-[-50%] eb:gap-4 eb:rounded-lg2 eb:border eb:border-border eb:bg-background eb:p-6 eb:text-foreground eb:shadow-lg eb:duration-200 eb:outline-none eb:sm:max-w-lg",
+          FADE_ZOOM,
+          className
+        ),
+        ...props,
+        children: [
+          children,
+          showCloseButton && /* @__PURE__ */ jsxs(DialogPrimitive.Close, { className: "eb:absolute eb:top-4 eb:right-4 eb:rounded-xs eb:opacity-70 eb:transition-opacity eb:hover:opacity-100 eb:focus:ring-2 eb:focus:ring-ring eb:focus:ring-offset-2 eb:focus:outline-hidden eb:disabled:pointer-events-none eb:[&_svg]:pointer-events-none eb:[&_svg]:shrink-0 eb:[&_svg:not([class*='size-'])]:size-4", children: [
+            /* @__PURE__ */ jsx(XIcon, {}),
+            /* @__PURE__ */ jsx("span", { className: "eb:sr-only", children: t("Close") })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+function DialogHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cn("eb:flex eb:flex-col eb:gap-2 eb:text-left", className), ...props });
+}
+function DialogTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Title, { className: cn("eb:text-lg eb:leading-none eb:font-semibold", className), ...props });
+}
+function DialogDescription({ className, ...props }) {
+  return /* @__PURE__ */ jsx(DialogPrimitive.Description, { className: cn("eb:text-sm eb:text-muted-foreground", className), ...props });
+}
+function AlertDialog(props) {
+  return /* @__PURE__ */ jsx(AlertDialogPrimitive.Root, { ...props });
+}
+function AlertDialogContent({ className, ...props }) {
+  return /* @__PURE__ */ jsxs(AlertDialogPrimitive.Portal, { children: [
+    /* @__PURE__ */ jsx(AlertDialogPrimitive.Overlay, { className: "eb-scope eb:fixed eb:inset-0 eb:z-50 eb:bg-black/50 eb:data-[state=open]:animate-in eb:data-[state=open]:fade-in-0 eb:data-[state=closed]:animate-out eb:data-[state=closed]:fade-out-0" }),
+    /* @__PURE__ */ jsx(
+      AlertDialogPrimitive.Content,
+      {
+        className: cn(
+          "eb-scope eb:fixed eb:top-[50%] eb:left-[50%] eb:z-50 eb:grid eb:w-full eb:max-w-[calc(100%-2rem)] eb:translate-x-[-50%] eb:translate-y-[-50%] eb:gap-4 eb:rounded-lg2 eb:border eb:border-border eb:bg-background eb:p-6 eb:text-foreground eb:shadow-lg eb:duration-200 eb:sm:max-w-lg",
+          FADE_ZOOM,
+          className
+        ),
+        ...props
+      }
+    )
+  ] });
+}
+var AlertDialogTitle = ({ className, ...props }) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Title, { className: cn("eb:text-lg eb:font-semibold", className), ...props });
+var AlertDialogDescription = ({ className, ...props }) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Description, { className: cn("eb:text-sm eb:text-muted-foreground", className), ...props });
+var AlertDialogAction = AlertDialogPrimitive.Action;
+var AlertDialogCancel = AlertDialogPrimitive.Cancel;
+function Popover(props) {
+  return /* @__PURE__ */ jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
+}
+function PopoverTrigger(props) {
+  return /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
+}
+function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
+  return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    PopoverPrimitive.Content,
+    {
+      "data-slot": "popover-content",
+      align,
+      sideOffset,
+      className: cn(
+        "eb-scope eb:z-50 eb:w-72 eb:origin-(--radix-popover-content-transform-origin) eb:rounded-lg2 eb:border eb:border-border eb:bg-popover eb:p-4 eb:text-popover-foreground eb:shadow-md eb:outline-hidden",
+        FADE_ZOOM,
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function DropdownMenu(props) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Root, { "data-slot": "dropdown-menu", ...props });
+}
+function DropdownMenuTrigger(props) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
+}
+function DropdownMenuContent({ className, sideOffset = 4, ...props }) {
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Content,
+    {
+      "data-slot": "dropdown-menu-content",
+      sideOffset,
+      className: cn(
+        "eb-scope eb:z-50 eb:max-h-(--radix-dropdown-menu-content-available-height) eb:min-w-[8rem] eb:origin-(--radix-dropdown-menu-content-transform-origin) eb:overflow-x-hidden eb:overflow-y-auto eb:rounded-lg2 eb:border eb:border-border eb:bg-popover eb:p-1 eb:text-popover-foreground eb:shadow-md",
+        FADE_ZOOM,
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function DropdownMenuItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive.Item,
+    {
+      "data-slot": "dropdown-menu-item",
+      className: cn(
+        "eb:relative eb:flex eb:cursor-default eb:items-center eb:gap-2 eb:rounded-sm eb:px-2 eb:py-1.5 eb:text-[13px] eb:outline-hidden eb:select-none eb:focus:bg-accent eb:focus:text-accent-foreground eb:data-[disabled]:pointer-events-none eb:data-[disabled]:opacity-50 eb:[&_svg]:pointer-events-none eb:[&_svg]:shrink-0 eb:[&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function Select(props) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.Root, { "data-slot": "select", ...props });
+}
+function SelectValue(props) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
+}
+function SelectTrigger({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    SelectPrimitive.Trigger,
+    {
+      "data-slot": "select-trigger",
+      className: cn(
+        "eb:flex eb:h-8 eb:w-full eb:items-center eb:justify-between eb:gap-2 eb:rounded-lg2 eb:border eb:border-border-strong eb:bg-surface-75 eb:px-3 eb:py-1 eb:text-[13px] eb:whitespace-nowrap eb:text-foreground eb:shadow-xs eb:transition-[color,box-shadow] eb:outline-none eb:focus-visible:border-ring eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50 eb:disabled:cursor-not-allowed eb:disabled:opacity-50 eb:data-[placeholder]:text-foreground-muted eb:*:data-[slot=select-value]:line-clamp-1 eb:*:data-[slot=select-value]:flex eb:*:data-[slot=select-value]:items-center eb:*:data-[slot=select-value]:gap-2 eb:[&_svg]:pointer-events-none eb:[&_svg]:shrink-0 eb:[&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "eb:size-4 eb:opacity-50" }) })
+      ]
+    }
+  );
+}
+function SelectContent({ className, children, position = "popper", ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    SelectPrimitive.Content,
+    {
+      "data-slot": "select-content",
+      position,
+      className: cn(
+        "eb-scope eb:relative eb:z-50 eb:max-h-(--radix-select-content-available-height) eb:min-w-[8rem] eb:origin-(--radix-select-content-transform-origin) eb:overflow-x-hidden eb:overflow-y-auto eb:rounded-lg2 eb:border eb:border-border eb:bg-popover eb:text-popover-foreground eb:shadow-md",
+        FADE_ZOOM,
+        position === "popper" && "eb:data-[side=bottom]:translate-y-1 eb:data-[side=top]:-translate-y-1",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        SelectPrimitive.Viewport,
+        {
+          className: cn(
+            "eb:p-1",
+            position === "popper" && "eb:h-[var(--radix-select-trigger-height)] eb:w-full eb:min-w-[var(--radix-select-trigger-width)] eb:scroll-my-1"
+          ),
+          children
+        }
+      )
+    }
+  ) });
+}
+function SelectItem({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    SelectPrimitive.Item,
+    {
+      "data-slot": "select-item",
+      className: cn(
+        "eb:relative eb:flex eb:w-full eb:cursor-default eb:items-center eb:gap-2 eb:rounded-sm eb:py-1.5 eb:pr-8 eb:pl-2 eb:text-[13px] eb:outline-hidden eb:select-none eb:focus:bg-accent eb:focus:text-accent-foreground eb:data-[disabled]:pointer-events-none eb:data-[disabled]:opacity-50",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "eb:absolute eb:right-2 eb:flex eb:size-3.5 eb:items-center eb:justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { className: "eb:size-4" }) }) }),
+        /* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
+      ]
+    }
+  );
+}
+
+// src/ui/primitives/button.jsx
+import { Slot } from "radix-ui";
+import { cva } from "class-variance-authority";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var buttonVariants = cva(
+  "eb:inline-flex eb:shrink-0 eb:items-center eb:justify-center eb:gap-2 eb:whitespace-nowrap eb:rounded-lg2 eb:text-sm eb:font-medium eb:transition-all eb:outline-none eb:disabled:pointer-events-none eb:disabled:opacity-50 eb:focus-visible:border-ring eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50 eb:aria-invalid:border-destructive eb:aria-invalid:ring-destructive/20 eb:[&_svg]:pointer-events-none eb:[&_svg]:shrink-0 eb:[&_svg:not([class*='size-'])]:size-4",
+  {
+    variants: {
+      variant: {
+        default: "eb:bg-primary eb:text-primary-foreground eb:hover:bg-primary/90",
+        destructive: "eb:bg-destructive eb:text-white eb:hover:bg-destructive/90 eb:focus-visible:ring-destructive/20",
+        outline: "eb:border eb:border-border eb:bg-background eb:text-foreground eb:shadow-xs eb:hover:bg-accent eb:hover:text-accent-foreground",
+        secondary: "eb:bg-secondary eb:text-secondary-foreground eb:hover:bg-secondary/80",
+        ghost: "eb:text-foreground eb:hover:bg-accent eb:hover:text-accent-foreground",
+        link: "eb:text-primary eb:underline-offset-4 eb:hover:underline"
+      },
+      size: {
+        default: "eb:h-8 eb:gap-1.5 eb:px-3 eb:text-[13px] eb:has-[>svg]:px-2.5",
+        xs: "eb:h-6 eb:gap-1 eb:px-2 eb:text-xs eb:has-[>svg]:px-1.5 eb:[&_svg:not([class*='size-'])]:size-3",
+        "sm-compact": "eb:h-7 eb:gap-1.5 eb:px-3 eb:text-xs eb:has-[>svg]:px-2.5 eb:[&_svg:not([class*='size-'])]:size-3",
+        sm: "eb:h-8 eb:gap-1.5 eb:px-3 eb:text-[13px] eb:has-[>svg]:px-2.5",
+        lg: "eb:h-10 eb:px-6 eb:has-[>svg]:px-4",
+        icon: "eb:size-8",
+        "icon-xs": "eb:size-6 eb:[&_svg:not([class*='size-'])]:size-3",
+        "icon-sm-compact": "eb:size-7 eb:[&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "eb:size-8"
+      }
+    },
+    defaultVariants: { variant: "default", size: "default" }
+  }
+);
+function Button({ className, variant = "default", size = "default", asChild = false, type, ...props }) {
+  const Comp = asChild ? Slot.Root : "button";
+  return /* @__PURE__ */ jsx2(
+    Comp,
+    {
+      "data-slot": "button",
+      type: asChild ? type : type || "button",
+      className: cn(buttonVariants({ variant, size }), className),
+      ...props
+    }
+  );
+}
+
+// src/ui/primitives/misc.jsx
+import { Separator as SeparatorPrimitive, Tabs as TabsPrimitive, Tooltip as TooltipPrimitive } from "radix-ui";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+function Separator({ className, orientation = "horizontal", decorative = true, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    SeparatorPrimitive.Root,
+    {
+      "data-slot": "separator",
+      decorative,
+      orientation,
+      className: cn(
+        "eb:shrink-0 eb:bg-border eb:data-[orientation=horizontal]:h-px eb:data-[orientation=horizontal]:w-full eb:data-[orientation=vertical]:h-full eb:data-[orientation=vertical]:w-px",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function Skeleton({ className, as: Comp = "div", ...props }) {
+  return /* @__PURE__ */ jsx3(Comp, { "data-slot": "skeleton", className: cn("eb:animate-pulse eb:rounded-lg2 eb:bg-accent", className), ...props });
+}
+function SectionLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    "span",
+    {
+      "data-slot": "section-label",
+      className: cn("eb:font-mono eb:text-[10px] eb:uppercase eb:tracking-[0.14em] eb:text-foreground-muted", className),
+      ...props
+    }
+  );
+}
+function TruncatedText({ children, className, as: Comp = "span", ...props }) {
+  return /* @__PURE__ */ jsx3(
+    Comp,
+    {
+      className: cn("eb:block eb:truncate", className),
+      title: typeof children === "string" ? children : void 0,
+      ...props,
+      children
+    }
+  );
+}
+function Tabs({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(TabsPrimitive.Root, { "data-slot": "tabs", className: cn("eb:flex eb:flex-col eb:gap-2", className), ...props });
+}
+function TabsList({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    TabsPrimitive.List,
+    {
+      "data-slot": "tabs-list",
+      className: cn(
+        "eb:inline-flex eb:h-8 eb:w-fit eb:items-center eb:justify-center eb:rounded-lg2 eb:bg-muted eb:p-[3px] eb:text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsTrigger({ className, ...props }) {
+  return /* @__PURE__ */ jsx3(
+    TabsPrimitive.Trigger,
+    {
+      "data-slot": "tabs-trigger",
+      className: cn(
+        "eb:inline-flex eb:h-[calc(100%-1px)] eb:flex-1 eb:items-center eb:justify-center eb:gap-1.5 eb:rounded-lg2 eb:border eb:border-transparent eb:px-2 eb:py-1 eb:text-[13px] eb:font-medium eb:whitespace-nowrap eb:text-foreground/60 eb:transition-all eb:hover:text-foreground eb:focus-visible:border-ring eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50 eb:focus-visible:outline-1 eb:disabled:pointer-events-none eb:disabled:opacity-50 eb:data-[state=active]:bg-background eb:data-[state=active]:text-foreground eb:data-[state=active]:shadow-sm eb:[&_svg]:pointer-events-none eb:[&_svg]:shrink-0 eb:[&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TooltipProvider({ delayDuration = 0, ...props }) {
+  return /* @__PURE__ */ jsx3(TooltipPrimitive.Provider, { delayDuration, ...props });
+}
+function Tooltip(props) {
+  return /* @__PURE__ */ jsx3(TooltipPrimitive.Root, { ...props });
+}
+function TooltipTrigger(props) {
+  return /* @__PURE__ */ jsx3(TooltipPrimitive.Trigger, { ...props });
+}
+function TooltipContent({ className, sideOffset = 4, children, ...props }) {
+  return /* @__PURE__ */ jsx3(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx3(
+    TooltipPrimitive.Content,
+    {
+      "data-slot": "tooltip-content",
+      sideOffset,
+      className: cn(
+        "eb-scope eb:z-50 eb:w-fit eb:origin-(--radix-tooltip-content-transform-origin) eb:animate-in eb:rounded-lg2 eb:border eb:border-border eb:bg-popover eb:px-3 eb:py-1.5 eb:text-xs eb:text-balance eb:text-popover-foreground eb:shadow-md eb:fade-in-0 eb:zoom-in-95 eb:data-[state=closed]:animate-out eb:data-[state=closed]:fade-out-0 eb:data-[state=closed]:zoom-out-95",
+        className
+      ),
+      ...props,
+      children
+    }
+  ) });
+}
+function TooltipWrap({ label, side = "top", children, asChild = true, delayDuration }) {
+  if (!label) return children;
+  return /* @__PURE__ */ jsxs2(Tooltip, { delayDuration, children: [
+    /* @__PURE__ */ jsx3(TooltipTrigger, { asChild, children }),
+    /* @__PURE__ */ jsx3(TooltipContent, { side, className: "eb:px-2 eb:py-1 eb:text-[11px]", children: label })
+  ] });
+}
+
+// src/ui/context.jsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var NoticeContext = createContext({ notices: [], dismiss: () => {
+} });
+var UiContext = createContext({
+  t: identity,
+  locale: "en",
+  /** @type {(level: NotifyLevel, message: string) => void} */
+  notify: () => {
+  },
+  /** @type {(options: ConfirmOptions) => Promise<boolean>} */
+  confirm: async () => false
+});
+var useUi = () => useContext(UiContext);
+var useT = () => useContext(UiContext).t;
+var NOTICE_ICON = { success: CheckCircle2, info: Info, warning: TriangleAlert, error: AlertCircle };
+var NOTICE_TTL = { success: 3500, info: 4e3, warning: 6e3, error: 7e3 };
+function NoticeArea() {
+  const t = useT();
+  const { notices, dismiss: onDismiss } = useContext(NoticeContext);
+  return /* @__PURE__ */ jsx4("div", { className: "eb:pointer-events-none eb:absolute eb:right-3 eb:bottom-3 eb:z-40 eb:flex eb:w-80 eb:max-w-[calc(100%-1.5rem)] eb:flex-col eb:gap-2", children: notices.map((notice) => {
+    const Icon = NOTICE_ICON[notice.level] || Info;
+    return /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        role: notice.level === "error" ? "alert" : "status",
+        "data-level": notice.level,
+        className: "eb:pointer-events-auto eb:flex eb:items-start eb:gap-2 eb:rounded-lg2 eb:border eb:border-border eb:bg-popover eb:px-3 eb:py-2.5 eb:text-[13px] eb:text-popover-foreground eb:shadow-lg",
+        children: [
+          /* @__PURE__ */ jsx4(
+            Icon,
+            {
+              "aria-hidden": "true",
+              className: cn(
+                "eb:mt-0.5 eb:size-4 eb:shrink-0",
+                notice.level === "error" && "eb:text-destructive",
+                notice.level === "warning" && "eb:text-warning",
+                notice.level === "success" && "eb:text-success",
+                notice.level === "info" && "eb:text-foreground-muted"
+              )
+            }
+          ),
+          /* @__PURE__ */ jsx4("p", { className: "eb:min-w-0 eb:flex-1", children: notice.message }),
+          /* @__PURE__ */ jsx4(
+            "button",
+            {
+              type: "button",
+              "aria-label": t("Dismiss"),
+              className: "eb:shrink-0 eb:rounded-sm eb:text-foreground-muted eb:hover:text-foreground",
+              onClick: () => onDismiss(notice.id),
+              children: /* @__PURE__ */ jsx4(X, { className: "eb:size-3.5" })
+            }
+          )
+        ]
+      },
+      notice.id
+    );
+  }) });
+}
+function UiProvider({ locale = "en", messages, onNotify, children }) {
+  const t = useMemo(() => translatorFor(locale, messages), [locale, messages]);
+  const [notices, setNotices] = useState([]);
+  const timers = useRef(/* @__PURE__ */ new Map());
+  const dismiss = useCallback((id) => {
+    clearTimeout(timers.current.get(id));
+    timers.current.delete(id);
+    setNotices((list) => list.filter((n) => n.id !== id));
+  }, []);
+  const hostNotify = useRef(onNotify);
+  hostNotify.current = onNotify;
+  const nextId = useRef(0);
+  const notify = useCallback(
+    (level, message) => {
+      if (hostNotify.current) {
+        hostNotify.current(level, message);
+        return;
+      }
+      const id = nextId.current += 1;
+      setNotices((list) => {
+        const same = list.filter((n) => n.level === level && n.message === message);
+        for (const notice of same) {
+          clearTimeout(timers.current.get(notice.id));
+          timers.current.delete(notice.id);
+        }
+        return [...list.filter((n) => !same.includes(n)).slice(-3), { id, level, message }];
+      });
+      timers.current.set(
+        id,
+        setTimeout(() => dismiss(id), NOTICE_TTL[level] || 4e3)
+      );
+    },
+    [dismiss]
+  );
+  useEffect(() => {
+    const pending = timers.current;
+    return () => pending.forEach((timer) => clearTimeout(timer));
+  }, []);
+  const [request, setRequest] = useState(null);
+  const confirm = useCallback(
+    (options2 = {}) => new Promise((resolve) => {
+      setRequest((current) => {
+        current?.resolve(false);
+        return { options: options2, resolve };
+      });
+    }),
+    []
+  );
+  const settle = (result) => {
+    request?.resolve(result);
+    setRequest(null);
+  };
+  const value = useMemo(() => ({ t, locale, notify, confirm }), [t, locale, notify, confirm]);
+  const noticeValue = useMemo(() => ({ notices, dismiss }), [notices, dismiss]);
+  const options = request?.options || {};
+  return /* @__PURE__ */ jsx4(UiContext.Provider, { value, children: /* @__PURE__ */ jsxs3(TooltipProvider, { delayDuration: 300, children: [
+    /* @__PURE__ */ jsx4(NoticeContext.Provider, { value: noticeValue, children }),
+    /* @__PURE__ */ jsx4(AlertDialog, { open: Boolean(request), onOpenChange: (open) => !open && settle(false), children: /* @__PURE__ */ jsxs3(AlertDialogContent, { children: [
+      /* @__PURE__ */ jsxs3("div", { className: "eb:flex eb:items-center eb:gap-3", children: [
+        /* @__PURE__ */ jsx4(
+          "span",
+          {
+            className: cn(
+              "eb:flex eb:size-10 eb:shrink-0 eb:items-center eb:justify-center eb:rounded-lg2",
+              options.destructive ? "eb:bg-destructive/10 eb:text-destructive" : "eb:bg-primary/10 eb:text-primary"
+            ),
+            children: /* @__PURE__ */ jsx4(AlertCircle, { className: "eb:size-5" })
+          }
+        ),
+        /* @__PURE__ */ jsx4(AlertDialogTitle, { className: "eb:text-base", children: options.title || t("Confirm") })
+      ] }),
+      options.description && /* @__PURE__ */ jsx4(AlertDialogDescription, { className: "eb:text-[13px] eb:leading-relaxed", children: options.description }),
+      /* @__PURE__ */ jsxs3("div", { className: "eb:flex eb:flex-col-reverse eb:gap-2 eb:sm:flex-row eb:sm:justify-end", children: [
+        /* @__PURE__ */ jsx4(AlertDialogCancel, { className: buttonVariants({ variant: "outline" }), onClick: () => settle(false), children: options.cancelLabel || t("Cancel") }),
+        /* @__PURE__ */ jsx4(
+          AlertDialogAction,
+          {
+            className: buttonVariants({ variant: options.destructive ? "destructive" : "default" }),
+            onClick: () => settle(true),
+            children: options.confirmLabel || t("Confirm")
+          }
+        )
+      ] })
+    ] }) })
+  ] }) });
+}
+
+// src/features/templates/starter.js
+function escapeXml(text) {
+  return String(text ?? "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+var SIDE = 'padding-left="32px" padding-right="32px"';
+var TEXT = `font-family="${FONT_STACK}" color="${PALETTE.ink}"`;
+function senderHeaderMjml(sender, t) {
+  const name = escapeXml(sender.name || t("Your company"));
+  return sender.logoUrl ? `<mj-image src="${escapeXml(sender.logoUrl)}" alt="${name}" width="${Number(sender.logoWidth) || 140}px" align="left" ${SIDE}></mj-image>` : `<mj-text ${TEXT} font-size="18px" line-height="24px" font-weight="bold" ${SIDE}>${name}</mj-text>`;
+}
+function footerSectionMjml(sender, t) {
+  const name = escapeXml(sender.name || t("Your company"));
+  const footer = [name, sender.address ? escapeXml(sender.address) : ""].filter(Boolean).join(" \xB7 ");
+  return `<mj-section padding-top="20px" padding-bottom="28px"><mj-column><mj-text font-family="${FONT_STACK}" font-size="12px" line-height="18px" color="#6d7484" align="center" ${SIDE}>${footer}<br /><a href="{{ unsubscribe }}" style="color:#6d7484;text-decoration:underline;">${escapeXml(t("Unsubscribe"))}</a></mj-text></mj-column></mj-section>`;
+}
+function createStarterMjml({ sender = {}, buttonUrl = DEFAULT_BUTTON_URL, t = identity } = {}) {
+  return [
+    "<mjml>",
+    `<mj-body background-color="${PALETTE.canvas}" width="600px">`,
+    // Header: logo or sender name.
+    `<mj-section background-color="${PALETTE.surface}" padding-top="28px" padding-bottom="8px">`,
+    "<mj-column>",
+    senderHeaderMjml(sender, t),
+    "</mj-column>",
+    "</mj-section>",
+    // Body: headline, text, button.
+    `<mj-section background-color="${PALETTE.surface}" padding-top="8px" padding-bottom="28px">`,
+    "<mj-column>",
+    `<mj-text ${TEXT} font-size="24px" line-height="32px" font-weight="bold" ${SIDE}>${escapeXml(t("Your headline"))}</mj-text>`,
+    `<mj-text ${TEXT} font-size="15px" line-height="24px" ${SIDE}>${escapeXml(t("Hello {name},", { name: "{{contact.firstname}}" }))}<br /><br />${escapeXml(t("Your text."))}</mj-text>`,
+    `<mj-button href="${escapeXml(buttonUrl)}" background-color="${PALETTE.navy}" color="${PALETTE.white}" font-family="${FONT_STACK}" font-size="15px" font-weight="bold" border-radius="6px" inner-padding="12px 28px" align="left" ${SIDE}>${escapeXml(t("Learn more"))}</mj-button>`,
+    "</mj-column>",
+    "</mj-section>",
+    // Footer: sender and unsubscribe link.
+    footerSectionMjml(sender, t),
+    "</mj-body>",
+    "</mjml>"
+  ].join("");
+}
+var STARTER_MJML = createStarterMjml();
+
+// src/blocks/social/index.js
+var SOCIAL_NETWORKS = [
+  { value: "facebook-noshare", label: "Facebook", href: "https://www.facebook.com/" },
+  { value: "instagram-noshare", label: "Instagram", href: "https://www.instagram.com/" },
+  { value: "linkedin-noshare", label: "LinkedIn", href: "https://www.linkedin.com/" },
+  { value: "x-noshare", label: "X", href: "https://x.com/" },
+  { value: "youtube-noshare", label: "YouTube", href: "https://www.youtube.com/" },
+  { value: "github-noshare", label: "GitHub", href: "https://github.com/" }
+];
+var DEFAULT_NETWORKS = ["facebook-noshare", "instagram-noshare", "linkedin-noshare", "x-noshare"];
+var MJML = '<mj-social mode="horizontal" align="center" icon-size="28px" border-radius="14px" inner-padding="6px">' + DEFAULT_NETWORKS.map((name) => {
+  const network = SOCIAL_NETWORKS.find((n) => n.value === name);
+  return `<mj-social-element name="${name}" href="${network?.href}"></mj-social-element>`;
+}).join("") + "</mj-social>";
+var socialBlock = {
+  id: "social",
+  label: "Social links",
+  description: "Icons linking to your profiles",
+  icon: "Share2",
+  kind: "content",
+  tagName: "mj-social",
+  order: 60,
+  mjml: MJML,
+  sectionMjml: inWhiteSection(MJML),
+  properties: [
+    { key: "icon-size", label: "Icon size", type: "size", group: GROUPS.layout, min: 16, max: 48, unit: "px" },
+    prop.radius(24),
+    prop.align(),
+    {
+      key: "mode",
+      label: "Direction",
+      type: "select",
+      group: GROUPS.layout,
+      options: [
+        { value: "horizontal", label: "Horizontal" },
+        { value: "vertical", label: "Vertical" }
+      ]
+    },
+    prop.padding("inner-padding", "Space around each icon"),
+    prop.padding()
+  ]
+};
+var socialElementBlock = {
+  id: "social-element",
+  label: "Social link",
+  icon: "Link",
+  kind: "structure",
+  tagName: "mj-social-element",
+  order: 903,
+  properties: [
+    {
+      key: "name",
+      label: "Network",
+      type: "select",
+      group: GROUPS.content,
+      options: SOCIAL_NETWORKS.map(({ value, label }) => ({ value, label }))
+    },
+    prop.href("Profile URL"),
+    prop.background("background-color", "Icon background")
+  ]
+};
+
+// src/features/templates/gallery.js
+var WHITE_SECTION = `background-color="${PALETTE.surface}"`;
+function section(inner, { top = 8, bottom = 8, x = 0 } = {}) {
+  const sides = x ? ` padding-left="${x}px" padding-right="${x}px"` : "";
+  return `<mj-section ${WHITE_SECTION} padding-top="${top}px" padding-bottom="${bottom}px"${sides}>${inner}</mj-section>`;
+}
+function column(inner, attrs = "") {
+  return `<mj-column${attrs ? ` ${attrs}` : ""}>${inner}</mj-column>`;
+}
+function heading(text, { size = 24, color = PALETTE.navy, align = "left", side = true } = {}) {
+  return `<mj-text font-family="${FONT_STACK}" font-size="${size}px" line-height="${Math.round(size * 1.3)}px" font-weight="bold" color="${color}" align="${align}"${side ? ` ${SIDE}` : ""}>${text}</mj-text>`;
+}
+function paragraph(html, { size = 15, color = PALETTE.ink, align = "left", side = true } = {}) {
+  return `<mj-text font-family="${FONT_STACK}" font-size="${size}px" line-height="${Math.round(size * 1.6)}px" color="${color}" align="${align}"${side ? ` ${SIDE}` : ""}>${html}</mj-text>`;
+}
+function button(label, { align = "left", background = PALETTE.navy, color = PALETTE.white, side = true } = {}) {
+  return `<mj-button href="${DEFAULT_BUTTON_URL}" background-color="${background}" color="${color}" font-family="${FONT_STACK}" font-size="15px" font-weight="bold" border-radius="6px" inner-padding="12px 28px" align="${align}"${side ? ` ${SIDE}` : ""}>${label}</mj-button>`;
+}
+var IMAGE = '<mj-image align="center"></mj-image>';
+function header(sender, t) {
+  return `<mj-section ${WHITE_SECTION} padding-top="28px" padding-bottom="8px">${column(senderHeaderMjml(sender, t))}</mj-section>`;
+}
+function banner({ title, text, cta, background = PALETTE.navy }) {
+  return `<mj-section background-color="${background}" background-size="cover" background-position="center center" background-repeat="no-repeat" padding-top="48px" padding-bottom="48px">` + column(
+    heading(title, { size: 30, color: PALETTE.white, align: "center" }) + paragraph(text, { size: 16, color: PALETTE.border, align: "center" }) + (cta ? button(cta, { align: "center", background: PALETTE.white, color: PALETTE.navy }) : "")
+  ) + "</mj-section>";
+}
+function social() {
+  const elements = ["facebook-noshare", "instagram-noshare", "linkedin-noshare"].map((name) => `<mj-social-element name="${name}" href="${SOCIAL_NETWORKS.find((n) => n.value === name)?.href}"></mj-social-element>`).join("");
+  return section(
+    column(
+      `<mj-social mode="horizontal" align="center" icon-size="28px" border-radius="14px" inner-padding="6px">${elements}</mj-social>`
+    ),
+    { top: 16, bottom: 16 }
+  );
+}
+function email(body) {
+  return `<mjml><mj-body background-color="${PALETTE.canvas}" width="600px">${body}</mj-body></mjml>`;
+}
+var esc = escapeXml;
+var TEMPLATE_GALLERY = [
+  {
+    id: "blank",
+    name: "Blank",
+    description: "An empty page to build from scratch",
+    create: () => email("")
+  },
+  {
+    id: "simple",
+    name: "Simple",
+    description: "Logo, headline, text and a button",
+    create: ({ sender, t }) => createStarterMjml({ sender, t })
+  },
+  {
+    id: "newsletter",
+    name: "Newsletter",
+    description: "Monthly news: banner, two articles, highlights",
+    meta: (t) => ({
+      subject: t("The news of the month"),
+      preheader: t("What changed, what is coming, and two stories worth your time.")
+    }),
+    create: ({ sender, t }) => email(
+      header(sender, t) + banner({
+        title: esc(t("The news of the month")),
+        text: esc(t("What changed, what is coming, and two stories worth your time.")),
+        cta: null
+      }) + [1, 2].map(
+        (n) => section(
+          column(IMAGE, 'vertical-align="middle"') + column(
+            heading(esc(t("Article {n}", { n })), { size: 20, side: false }) + paragraph(esc(t("Two or three sentences that sum up the story and make people want the rest.")), {
+              side: false
+            }) + button(esc(t("Read more")), { side: false }),
+            'vertical-align="middle"'
+          ),
+          { top: 16, bottom: 16, x: 16 }
+        )
+      ).join("") + section(column(heading(esc(t("In brief")), { size: 20 })), { top: 20, bottom: 0 }) + section(
+        [t("A new feature"), t("An event"), t("A tip")].map(
+          (title) => column(
+            heading(esc(title), { size: 16, side: false }) + paragraph(esc(t("One sentence about it.")), { size: 14, side: false })
+          )
+        ).join(""),
+        { bottom: 20, x: 16 }
+      ) + social() + footerSectionMjml(sender, t)
+    )
+  },
+  {
+    id: "welcome",
+    name: "Welcome",
+    description: "Greets a new customer and lists the first steps",
+    meta: (t) => ({ subject: t("Welcome aboard!"), preheader: t("Three steps to get started.") }),
+    create: ({ sender, t }) => email(
+      header(sender, t) + section(
+        column(
+          heading(esc(t("Welcome, {name}!", { name: "{{contact.firstname}}" })), { size: 28 }) + paragraph(esc(t("Thank you for joining us. Here is how to get the most out of your account.")))
+        ),
+        { top: 16, bottom: 8 }
+      ) + section(
+        [
+          [t("1. Complete your profile"), t("So we can tailor what we send you.")],
+          [t("2. Explore"), t("Take a tour of what you can do.")],
+          [t("3. Ask us anything"), t("Reply to this email: a person reads it.")]
+        ].map(
+          ([title, text]) => column(
+            heading(esc(title), { size: 16, side: false }) + paragraph(esc(text), { size: 14, side: false }),
+            `background-color="${PALETTE.canvas}" padding-top="12px" padding-bottom="12px" padding-left="12px" padding-right="12px"`
+          )
+        ).join(""),
+        { x: 24 }
+      ) + section(column(button(esc(t("Get started")), { align: "center" })), { top: 16, bottom: 28 }) + footerSectionMjml(sender, t)
+    )
+  },
+  {
+    id: "promotion",
+    name: "Promotion",
+    description: "A sale with a discount code and two products",
+    meta: (t) => ({ subject: t("30% off this weekend only"), preheader: t("With the code SPRING30, until Sunday midnight.") }),
+    create: ({ sender, t }) => email(
+      header(sender, t) + banner({
+        title: esc(t("30% off everything")),
+        text: esc(t("This weekend only, with the code SPRING30.")),
+        cta: esc(t("Shop the sale")),
+        background: PALETTE.brand
+      }) + section(
+        [t("Product one"), t("Product two")].map(
+          (name) => column(
+            IMAGE + heading(esc(name), { size: 18, side: false }) + paragraph(esc(t("\u20AC49 instead of \u20AC70")), { size: 15, side: false }) + button(esc(t("Buy")), { side: false })
+          )
+        ).join(""),
+        { top: 20, bottom: 20, x: 16 }
+      ) + section(
+        column(
+          paragraph(esc(t("Offer valid until Sunday midnight, while stocks last.")), {
+            size: 12,
+            color: "#6d7484",
+            align: "center"
+          })
+        )
+      ) + footerSectionMjml(sender, t)
+    )
+  },
+  {
+    id: "event",
+    name: "Event invitation",
+    description: "Date, place and a button to book a seat",
+    meta: (t) => ({ subject: t("You're invited"), preheader: t("Save the date \u2014 seats are limited.") }),
+    create: ({ sender, t }) => email(
+      header(sender, t) + banner({
+        title: esc(t("You're invited")),
+        text: esc(t("An evening of talks and drinks with the team and our customers.")),
+        cta: null
+      }) + section(
+        column(heading(esc(t("When")), { size: 16, side: false }) + paragraph(esc(t("Thursday, 7 pm")), { side: false })) + column(heading(esc(t("Where")), { size: 16, side: false }) + paragraph(esc(t("Our offices, 1 Main Street")), { side: false })),
+        { top: 24, x: 16 }
+      ) + section(
+        column(
+          paragraph(esc(t("Seats are limited: book yours now, it takes ten seconds."))) + button(esc(t("Book my seat")), { align: "left" })
+        ),
+        { bottom: 28 }
+      ) + footerSectionMjml(sender, t)
+    )
+  }
+];
+function buildGallery({ templates = TEMPLATE_GALLERY, sender = {}, t = identity } = {}) {
+  return templates.map((template) => {
+    const meta = template.meta ? template.meta(t) : {};
+    return {
+      id: template.id,
+      name: t(template.name),
+      description: t(template.description),
+      mjml: template.create({ sender, t }),
+      subject: meta.subject || "",
+      preheader: meta.preheader || ""
+    };
+  });
+}
+var THUMBNAIL_IMAGE = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 300'%3E%3Crect width='600' height='300' fill='%23dfe6f0'/%3E%3C/svg%3E";
+function withThumbnailImages(mjml) {
+  return String(mjml || "").replace(/<mj-image(?![^>]*\ssrc=)([^>]*)>/g, `<mj-image src="${THUMBNAIL_IMAGE}"$1>`);
+}
+function withPlaceholderImages(html) {
+  return String(html || "").replace(/<img(?![^>]*\ssrc=)(\s[^>]*)?>/g, (_m, attrs = "") => `<img src="${THUMBNAIL_IMAGE}"${attrs}>`);
+}
+
+// src/storage/client.js
+var StorageError = class extends Error {
+  /** @param {string} message @param {number} status @param {string} [code] */
+  constructor(message, status, code) {
+    super(message);
+    this.name = "StorageError";
+    this.status = status;
+    this.code = code;
+  }
+};
+function assertUploadable(file) {
+  const error = imageUploadError(file);
+  if (error) throw new StorageError(error, 415, "UNSUPPORTED_IMAGE");
+}
+function withDocument(template) {
+  if (!template || !template.document) return template;
+  return { ...template, document: readDocument(template.document) };
+}
+function createHttpStorage({ baseUrl = "/api/email-builder", headers = {}, fetch: fetchImpl, generate = false, brand = false } = {}) {
+  const root = baseUrl.replace(/\/+$/, "");
+  const doFetch = fetchImpl || ((input, init) => fetch(input, init));
+  const extraHeaders = () => typeof headers === "function" ? headers() : headers;
+  async function unwrap(res) {
+    const json = await res.json().catch(() => ({}));
+    if (!res.ok || json.error) {
+      throw new StorageError(json.error || `Request failed (HTTP ${res.status})`, res.status, json.code);
+    }
+    return json.data;
+  }
+  async function call(path, init) {
+    const res = await doFetch(`${root}${path}`, {
+      ...init,
+      headers: { "Content-Type": "application/json", ...extraHeaders(), ...init?.headers || {} }
+    });
+    return unwrap(res);
+  }
+  function body(payload) {
+    return JSON.stringify({ ...payload, document: readDocument(payload.document) });
+  }
+  return {
+    list: async () => call("/templates"),
+    load: async (id) => withDocument(await call(`/templates/${encodeURIComponent(id)}`)),
+    remove: async (id) => {
+      await call(`/templates/${encodeURIComponent(id)}`, { method: "DELETE" });
+    },
+    create: async (payload) => call("/templates", { method: "POST", body: body(payload) }),
+    duplicate: async (id) => call("/templates", { method: "POST", body: JSON.stringify({ duplicateOf: id }) }),
+    save: async (id, payload) => call(`/templates/${encodeURIComponent(id)}`, { method: "PUT", body: body(payload) }),
+    listVersions: async (id) => call(`/templates/${encodeURIComponent(id)}/versions`),
+    getVersion: async (id, versionId) => withDocument(await call(`/templates/${encodeURIComponent(id)}/versions/${encodeURIComponent(versionId)}`)),
+    render: async (input) => call("/render", { method: "POST", body: JSON.stringify(input) }),
+    sendTest: async (input) => call("/test", { method: "POST", body: JSON.stringify(input) }),
+    listVariables: async () => call("/variables"),
+    saveVariable: async (variable, { create = false } = {}) => create ? call("/variables", { method: "POST", body: JSON.stringify(variable) }) : call(`/variables/${encodeURIComponent(String(variable.key))}`, { method: "PUT", body: JSON.stringify(variable) }),
+    deleteVariable: async (key) => {
+      await call(`/variables/${encodeURIComponent(key)}`, { method: "DELETE" });
+    },
+    ...generate ? {
+      generate: async (input, { signal } = {}) => call("/generate", { method: "POST", body: JSON.stringify(input), signal }),
+      rewrite: async (input, { signal } = {}) => call("/rewrite", { method: "POST", body: JSON.stringify(input), signal }),
+      suggestSubjects: async (input, { signal } = {}) => call("/subjects", { method: "POST", body: JSON.stringify(input), signal })
+    } : {},
+    ...brand ? {
+      loadBrand: async () => call("/brand"),
+      saveBrand: async (value) => call("/brand", { method: "PUT", body: JSON.stringify(value) }),
+      ...brand === true || brand.import !== false ? {
+        importBrand: async (url, { signal } = {}) => call("/brand/import", { method: "POST", body: JSON.stringify({ url }), signal })
+      } : {}
+    } : {},
+    async uploadImage(file) {
+      assertUploadable(file);
+      const form = new FormData();
+      form.append("file", file, file.name || "image");
+      const res = await doFetch(`${root}/assets`, { method: "POST", body: form, headers: extraHeaders() });
+      const data = await unwrap(res);
+      return { path: data.path };
+    }
+  };
+}
+function createMemoryStorage({
+  render,
+  sendTest,
+  generate,
+  rewrite,
+  suggestSubjects,
+  importBrand,
+  brand = null,
+  assetsPath = DEFAULT_ASSETS_PATH,
+  systemVariables = DEFAULT_VARIABLES
+} = {}) {
+  const rows = /* @__PURE__ */ new Map();
+  const versions = /* @__PURE__ */ new Map();
+  const images = /* @__PURE__ */ new Map();
+  const customVariables = /* @__PURE__ */ new Map();
+  let savedBrand = cleanBrand(brand);
+  let nextId = 1;
+  let tick = Date.parse("2026-01-01T00:00:00.000Z");
+  const now = () => new Date(tick += 1e3).toISOString();
+  function toTemplate(row) {
+    return {
+      id: row.id,
+      name: row.name,
+      description: row.description,
+      subject: row.subject,
+      preheader: row.preheader,
+      revision: row.revision,
+      document: readDocument(row.documentJson),
+      mjml: row.mjml,
+      createdAt: row.createdAt,
+      updatedAt: row.updatedAt
+    };
+  }
+  function snapshot(row) {
+    const list = versions.get(String(row.id)) || [];
+    const entry = {
+      id: list.length + 1,
+      versionNumber: list.length + 1,
+      name: row.name,
+      subject: row.subject,
+      createdBy: null,
+      createdAt: row.revision,
+      documentJson: row.documentJson,
+      mjml: row.mjml
+    };
+    versions.set(String(row.id), [...list, entry]);
+    return { id: entry.id, versionNumber: entry.versionNumber };
+  }
+  function rowOf(id) {
+    const row = rows.get(String(id));
+    if (!row) throw new StorageError("Template not found", 404, "NOT_FOUND");
+    return row;
+  }
+  const storage = {
+    async list() {
+      return [...rows.values()].sort((a, b) => (b.updatedAt || b.createdAt).localeCompare(a.updatedAt || a.createdAt)).map((row) => {
+        const { document: _d, mjml: _m, ...summary } = toTemplate(row);
+        return summary;
+      });
+    },
+    async load(id) {
+      return toTemplate(rowOf(id));
+    },
+    async remove(id) {
+      rowOf(id);
+      rows.delete(String(id));
+      versions.delete(String(id));
+    },
+    async create(payload) {
+      if (!payload.name?.trim()) throw new StorageError("Name required", 400, "NAME_REQUIRED");
+      const at = now();
+      const row = {
+        id: nextId++,
+        name: payload.name.trim(),
+        description: payload.description ?? null,
+        subject: payload.subject ?? null,
+        preheader: payload.preheader ?? null,
+        documentJson: JSON.stringify(readDocument(payload.document)),
+        mjml: payload.mjml,
+        createdAt: at,
+        updatedAt: null,
+        revision: at
+      };
+      rows.set(String(row.id), row);
+      snapshot(row);
+      return { template: toTemplate(row), warnings: [] };
+    },
+    async duplicate(id) {
+      const source = rowOf(id);
+      return storage.create({
+        name: `${source.name} (copy)`,
+        description: source.description,
+        subject: source.subject,
+        preheader: source.preheader,
+        document: readDocument(source.documentJson),
+        mjml: source.mjml
+      });
+    },
+    async save(id, payload) {
+      const row = rowOf(id);
+      if (payload.revision && payload.revision !== row.revision) {
+        throw new StorageError("Template changed in the meantime \u2014 reload it before saving", 409, "CONFLICT");
+      }
+      const at = now();
+      Object.assign(row, {
+        ...payload.name !== void 0 ? { name: payload.name } : {},
+        ...payload.description !== void 0 ? { description: payload.description } : {},
+        ...payload.subject !== void 0 ? { subject: payload.subject } : {},
+        ...payload.preheader !== void 0 ? { preheader: payload.preheader } : {},
+        documentJson: JSON.stringify(readDocument(payload.document)),
+        mjml: payload.mjml,
+        updatedAt: at,
+        revision: at
+      });
+      const version = payload.createVersion ? snapshot(row) : null;
+      const { document: _omit, ...template } = toTemplate(row);
+      return { template, warnings: [], version };
+    },
+    async listVersions(id) {
+      rowOf(id);
+      return [...versions.get(String(id)) || []].reverse().map(({ documentJson: _d, mjml: _m, ...v }) => v);
+    },
+    async getVersion(id, versionId) {
+      const entry = (versions.get(String(id)) || []).find((v) => String(v.id) === String(versionId));
+      if (!entry) throw new StorageError("Version not found", 404, "NOT_FOUND");
+      const { documentJson, ...version } = entry;
+      return { ...version, document: readDocument(documentJson) };
+    },
+    async uploadImage(file) {
+      assertUploadable(file);
+      const digest = await crypto.subtle.digest("SHA-256", await file.arrayBuffer());
+      const hex = [...new Uint8Array(digest)].map((b) => b.toString(16).padStart(2, "0")).join("");
+      const path = `${assetsPath}${hex.slice(0, 32)}.${IMAGE_TYPES[file.type]}`;
+      images.set(path, file);
+      return { path };
+    },
+    async listVariables() {
+      return [...customVariables.values()].map((v) => ({ ...v }));
+    },
+    async saveVariable(input, { create = false } = {}) {
+      const existing = [...systemVariables, ...customVariables.values()];
+      if (!create && !customVariables.has(String(input?.key))) {
+        throw new StorageError("Variable not found", 404, "NOT_FOUND");
+      }
+      const base = create ? {} : customVariables.get(String(input.key));
+      const { variable, errors } = validateCustomVariable({ ...base, ...input }, { existing, editing: create ? null : input.key });
+      if (errors) throw new StorageError(Object.values(errors)[0], 400, "INVALID_VARIABLE");
+      customVariables.set(variable.key, variable);
+      return { ...variable };
+    },
+    async deleteVariable(key) {
+      if (!customVariables.delete(String(key))) throw new StorageError("Variable not found", 404, "NOT_FOUND");
+    },
+    async loadBrand() {
+      return { ...savedBrand };
+    },
+    async saveBrand(value) {
+      savedBrand = cleanBrand(value);
+      return { ...savedBrand };
+    },
+    ...importBrand ? { importBrand } : {},
+    ...render ? { render } : {},
+    ...sendTest ? { sendTest } : {},
+    ...generate ? { generate } : {},
+    ...rewrite ? { rewrite } : {},
+    ...suggestSubjects ? { suggestSubjects } : {},
+    dump: () => ({
+      rows: [...rows.values()],
+      versions: Object.fromEntries(versions),
+      images: [...images.keys()],
+      variables: [...customVariables.values()],
+      brand: savedBrand
+    })
+  };
+  return storage;
+}
+
+// src/ui/primitives/fields.jsx
+import { forwardRef } from "react";
+import { Label as LabelPrimitive } from "radix-ui";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var Input = forwardRef(function Input2({ className, type, ...props }, ref) {
+  return /* @__PURE__ */ jsx5(
+    "input",
+    {
+      ref,
+      type,
+      "data-slot": "input",
+      className: cn(
+        "eb:h-8 eb:w-full eb:min-w-0 eb:rounded-lg2 eb:border eb:border-border-strong eb:bg-surface-75 eb:px-3 eb:py-1 eb:text-[13px] eb:text-foreground eb:shadow-xs eb:transition-[color,box-shadow] eb:outline-none eb:placeholder:text-foreground-muted eb:selection:bg-primary eb:selection:text-primary-foreground eb:disabled:pointer-events-none eb:disabled:cursor-not-allowed eb:disabled:opacity-50",
+        "eb:focus-visible:border-ring eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50",
+        "eb:aria-invalid:border-destructive eb:aria-invalid:ring-destructive/20",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var Textarea = forwardRef(function Textarea2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx5(
+    "textarea",
+    {
+      ref,
+      "data-slot": "textarea",
+      className: cn(
+        "eb:flex eb:field-sizing-content eb:min-h-16 eb:w-full eb:rounded-lg2 eb:border eb:border-border-strong eb:bg-surface-75 eb:px-3 eb:py-2 eb:text-[13px] eb:text-foreground eb:shadow-xs eb:transition-[color,box-shadow] eb:outline-none eb:placeholder:text-foreground-muted eb:focus-visible:border-ring eb:focus-visible:ring-[3px] eb:focus-visible:ring-ring/50 eb:aria-invalid:border-destructive eb:aria-invalid:ring-destructive/20 eb:disabled:cursor-not-allowed eb:disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+});
+function Label({ className, ...props }) {
+  return /* @__PURE__ */ jsx5(
+    LabelPrimitive.Root,
+    {
+      "data-slot": "label",
+      className: cn(
+        "eb:flex eb:items-center eb:gap-2 eb:text-[13px] eb:leading-none eb:font-medium eb:text-foreground eb:select-none eb:peer-disabled:cursor-not-allowed eb:peer-disabled:opacity-50",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+// src/features/preview/PreviewButton.jsx
+import { useMemo as useMemo2, useState as useState2 } from "react";
+import { AlertTriangle, CheckCircle2 as CheckCircle22, Eye, Info as Info2, Loader2, Monitor, Moon, RefreshCw, Smartphone, Sun } from "lucide-react";
+
+// src/core/scrollbars.js
+var FRAME_SCROLLBAR_CSS = `
+::-webkit-scrollbar{width:5.6px;height:5.6px;background:transparent}
+::-webkit-scrollbar-button{display:none;width:0;height:0}
+::-webkit-scrollbar-track,::-webkit-scrollbar-track-piece,::-webkit-scrollbar-corner{background:transparent;border:0;box-shadow:none}
+::-webkit-scrollbar-thumb{background-color:rgba(156,163,175,.45);border:1.4px solid transparent;background-clip:content-box;border-radius:9999px;min-height:2rem;min-width:2rem}
+::-webkit-scrollbar-thumb:hover{background-color:rgba(107,114,128,.7)}
+@supports not selector(::-webkit-scrollbar){*{scrollbar-width:thin;scrollbar-color:rgba(156,163,175,.45) transparent}}
+@media (hover:hover) and (pointer:fine){
+::-webkit-scrollbar-thumb{background-color:transparent}
+*:hover::-webkit-scrollbar-thumb{background-color:rgba(156,163,175,.45)}
+*:hover::-webkit-scrollbar-thumb:hover{background-color:rgba(107,114,128,.7)}
+@supports not selector(::-webkit-scrollbar){*{scrollbar-color:transparent transparent}*:hover{scrollbar-color:rgba(156,163,175,.45) transparent}}
+}`;
+
+// src/features/preview/PreviewButton.jsx
+import { Fragment, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var LEVEL_ICON = { warning: AlertTriangle, info: Info2 };
+function QualityList({ quality = [], warnings = [] }) {
+  const { t } = useUi();
+  if (!quality.length && !warnings.length) {
+    return /* @__PURE__ */ jsxs4("p", { className: "eb:flex eb:items-center eb:gap-1.5 eb:text-[12px] eb:text-foreground-lighter", children: [
+      /* @__PURE__ */ jsx6(CheckCircle22, { className: "eb:size-3.5 eb:text-success", "aria-hidden": "true" }),
+      t("Nothing to fix.")
+    ] });
+  }
+  return /* @__PURE__ */ jsxs4("ul", { className: "eb:space-y-1.5", "aria-label": t("Points to check"), children: [
+    quality.map((issue) => {
+      const Icon = LEVEL_ICON[issue.level] || Info2;
+      return /* @__PURE__ */ jsxs4("li", { className: "eb:flex eb:items-start eb:gap-1.5 eb:text-[12px] eb:text-foreground", children: [
+        /* @__PURE__ */ jsx6(
+          Icon,
+          {
+            className: cn(
+              "eb:mt-0.5 eb:size-3.5 eb:shrink-0",
+              issue.level === "warning" ? "eb:text-warning" : "eb:text-foreground-muted"
+            ),
+            "aria-hidden": "true"
+          }
+        ),
+        issue.message
+      ] }, issue.code);
+    }),
+    warnings.slice(0, 5).map((w, i) => /* @__PURE__ */ jsxs4("li", { className: "eb:flex eb:items-start eb:gap-1.5 eb:text-[12px] eb:text-foreground-lighter", children: [
+      /* @__PURE__ */ jsx6(Info2, { className: "eb:mt-0.5 eb:size-3.5 eb:shrink-0 eb:text-foreground-muted", "aria-hidden": "true" }),
+      "MJML: ",
+      w.message
+    ] }, `mjml-${i}`))
+  ] });
+}
+var PREVIEW_SCROLLBAR_CSS = `<style data-preview-scrollbar>${FRAME_SCROLLBAR_CSS}</style>`;
+var withPreviewScrollbars = (html) => !html ? "" : /<\/head>/i.test(html) ? html.replace(/<\/head>/i, `${PREVIEW_SCROLLBAR_CSS}</head>`) : PREVIEW_SCROLLBAR_CSS + html;
+function EmailPreview({ html, loading = false, error = null, device = "desktop", onDeviceChange, onRefresh, hint = true }) {
+  const { t } = useUi();
+  const isMobile = device === "mobile";
+  const [scheme, setScheme] = useState2("light");
+  const dark = scheme === "dark";
+  const srcDoc = useMemo2(() => withPreviewScrollbars(dark ? simulateDarkMode(html) : html), [html, dark]);
+  return /* @__PURE__ */ jsxs4("div", { className: "eb:flex eb:h-full eb:min-h-0 eb:flex-col", children: [
+    /* @__PURE__ */ jsxs4("div", { className: "eb:mb-2 eb:flex eb:shrink-0 eb:flex-wrap eb:items-center eb:gap-2", children: [
+      /* @__PURE__ */ jsx6(Tabs, { value: device, onValueChange: (value) => onDeviceChange?.(value), children: /* @__PURE__ */ jsxs4(TabsList, { "aria-label": t("Device"), children: [
+        /* @__PURE__ */ jsxs4(TabsTrigger, { value: "desktop", children: [
+          /* @__PURE__ */ jsx6(Monitor, {}),
+          t("Desktop")
+        ] }),
+        /* @__PURE__ */ jsxs4(TabsTrigger, { value: "mobile", children: [
+          /* @__PURE__ */ jsx6(Smartphone, {}),
+          t("Mobile")
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsx6(Tabs, { value: scheme, onValueChange: setScheme, children: /* @__PURE__ */ jsxs4(TabsList, { "aria-label": t("Color scheme"), children: [
+        /* @__PURE__ */ jsx6(TabsTrigger, { value: "light", "aria-label": t("Light mode"), title: t("Light mode"), children: /* @__PURE__ */ jsx6(Sun, {}) }),
+        /* @__PURE__ */ jsx6(TabsTrigger, { value: "dark", "aria-label": t("Dark mode"), title: t("Dark mode"), children: /* @__PURE__ */ jsx6(Moon, {}) })
+      ] }) }),
+      /* @__PURE__ */ jsx6("span", { className: "eb:flex-1" }),
+      onRefresh && /* @__PURE__ */ jsxs4(Button, { variant: "outline", size: "sm-compact", onClick: onRefresh, disabled: loading, children: [
+        loading ? /* @__PURE__ */ jsx6(Loader2, { className: "eb:animate-spin" }) : /* @__PURE__ */ jsx6(RefreshCw, {}),
+        t("Refresh")
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx6("div", { className: "eb:min-h-0 eb:flex-1 eb:overflow-auto eb:rounded-lg2 eb:border eb:border-border eb:bg-surface-75 eb:p-3", children: error ? /* @__PURE__ */ jsx6("div", { className: "eb:flex eb:h-full eb:items-center eb:justify-center eb:p-6 eb:text-center eb:text-[13px] eb:text-destructive", children: error }) : !srcDoc ? /* @__PURE__ */ jsx6("div", { className: "eb:flex eb:h-full eb:items-center eb:justify-center eb:p-6 eb:text-center eb:text-[13px] eb:text-foreground-lighter", children: loading ? t("Rendering\u2026") : t("Nothing to show yet.") }) : (
+      // Narrows and widens like the editor's canvas (width .35s ease).
+      /* @__PURE__ */ jsx6(
+        "div",
+        {
+          className: cn(
+            "eb:mx-auto eb:max-w-full eb:transition-[width,box-shadow] eb:duration-[350ms] eb:ease-in-out eb:motion-reduce:transition-none",
+            isMobile && "eb:shadow-sm"
+          ),
+          style: { width: isMobile ? EMAIL_MOBILE_WIDTH : "100%", background: dark ? DARK_PAGE : "#ffffff" },
+          "data-device": device,
+          "data-scheme": scheme,
+          children: /* @__PURE__ */ jsx6(
+            "iframe",
+            {
+              sandbox: "",
+              srcDoc,
+              title: t("Email preview"),
+              className: "eb:block eb:w-full eb:border-0 eb:transition-[height] eb:duration-[350ms] eb:ease-in-out eb:motion-reduce:transition-none",
+              style: { height: isMobile ? 760 : 900, background: dark ? DARK_PAGE : "#ffffff" }
+            }
+          )
+        }
+      )
+    ) }),
+    dark ? /* @__PURE__ */ jsx6("p", { className: "eb:mt-2 eb:shrink-0 eb:text-[11px] eb:leading-relaxed eb:text-foreground-lighter", "data-testid": "eb-dark-hint", children: t("Dark mode as Gmail and Outlook apps show it: light backgrounds turn dark, dark text turns light, images stay as they are.") }) : hint && /* @__PURE__ */ jsx6("p", { className: "eb:mt-2 eb:shrink-0 eb:text-[11px] eb:leading-relaxed eb:text-foreground-lighter", children: t("Indicative preview \u2014 check it with \u201CSend test\u201D.") })
+  ] });
+}
+function PreviewButton({ context }) {
+  const { editor, ready, meta, storage } = context;
+  const { t } = useUi();
+  const [open, setOpen] = useState2(false);
+  const [device, setDevice] = useState2("desktop");
+  const [state, setState] = useState2({ loading: false, html: "", subject: null, preheader: null, warnings: [], quality: [], error: null });
+  const refresh = async () => {
+    setState((s) => ({ ...s, loading: true, error: null }));
+    try {
+      const data = await storage.render({ mjml: editor.exportMjml(), subject: meta.subject, preheader: meta.preheader });
+      setState({
+        loading: false,
+        html: data.html,
+        // Subject and preview text with their variables filled, when the backend returns them.
+        subject: data.subject ?? null,
+        preheader: data.preheader ?? null,
+        warnings: data.warnings || [],
+        quality: data.quality || [],
+        error: null
+      });
+    } catch (error) {
+      setState({ loading: false, html: "", subject: null, preheader: null, warnings: [], quality: [], error: error.message });
+    }
+  };
+  return /* @__PURE__ */ jsxs4(Fragment, { children: [
+    /* @__PURE__ */ jsxs4(
+      Button,
+      {
+        variant: "outline",
+        size: "sm-compact",
+        disabled: !ready,
+        onClick: () => {
+          setOpen(true);
+          refresh();
+        },
+        children: [
+          /* @__PURE__ */ jsx6(Eye, {}),
+          t("Preview")
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx6(Dialog, { open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxs4(DialogContent, { className: "eb:flex eb:h-[85vh] eb:max-h-[85vh] eb:flex-col eb:gap-4 eb:sm:max-w-[67.2rem]", children: [
+      /* @__PURE__ */ jsx6(DialogHeader, { children: /* @__PURE__ */ jsxs4("div", { className: "eb:flex eb:items-center eb:gap-3", children: [
+        /* @__PURE__ */ jsx6("span", { className: "eb:flex eb:size-10 eb:shrink-0 eb:items-center eb:justify-center eb:rounded-lg2 eb:bg-primary/10 eb:text-primary", children: /* @__PURE__ */ jsx6(Eye, { className: "eb:size-5" }) }),
+        /* @__PURE__ */ jsxs4("div", { children: [
+          /* @__PURE__ */ jsx6(DialogTitle, { className: "eb:text-base eb:font-normal", children: t("Email preview") }),
+          /* @__PURE__ */ jsx6(DialogDescription, { className: "eb:text-[13px]", children: t("Final rendering, variables filled with samples.") })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ jsxs4("div", { className: "eb:grid eb:min-h-0 eb:flex-1 eb:grid-cols-1 eb:gap-4 eb:md:grid-cols-[minmax(0,1fr)_260px]", children: [
+        /* @__PURE__ */ jsx6(
+          EmailPreview,
+          {
+            html: state.html,
+            loading: state.loading,
+            error: state.error,
+            device,
+            onDeviceChange: setDevice,
+            onRefresh: refresh,
+            hint: typeof storage.sendTest === "function"
+          }
+        ),
+        /* @__PURE__ */ jsxs4("aside", { className: "eb:min-h-0 eb:space-y-5 eb:overflow-y-auto", "aria-busy": state.loading, children: [
+          /* @__PURE__ */ jsxs4("section", { className: "eb:space-y-2", children: [
+            /* @__PURE__ */ jsx6(SectionLabel, { children: t("Inbox") }),
+            /* @__PURE__ */ jsxs4("div", { className: "eb:rounded-lg2 eb:border eb:border-border eb:bg-surface-75 eb:px-3 eb:py-2.5", children: [
+              /* @__PURE__ */ jsx6("p", { className: "eb:text-[13px] eb:font-medium eb:text-foreground", children: (state.subject ?? meta.subject) || t("No subject") }),
+              /* @__PURE__ */ jsx6("p", { className: "eb:text-[12px] eb:text-foreground-muted", children: (state.preheader ?? meta.preheader) || t("No preview text") })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs4("section", { className: "eb:space-y-2", children: [
+            /* @__PURE__ */ jsx6(SectionLabel, { children: t("To check") }),
+            !state.loading && !state.error && /* @__PURE__ */ jsx6(QualityList, { quality: state.quality, warnings: state.warnings })
+          ] })
+        ] })
+      ] })
+    ] }) })
+  ] });
+}
+
+// src/features/brand/useBrand.js
+import { useCallback as useCallback2, useEffect as useEffect2, useState as useState3 } from "react";
+var entries = /* @__PURE__ */ new WeakMap();
+function brandOf(storage) {
+  let entry = entries.get(storage);
+  if (entry) return entry;
+  const created = { value: {}, loaded: Promise.resolve({}), listeners: /* @__PURE__ */ new Set() };
+  created.loaded = typeof storage?.loadBrand === "function" ? Promise.resolve().then(() => storage.loadBrand()).then(
+    (brand) => cleanBrand(brand),
+    () => (
+      /** @type {Brand} */
+      {}
+    )
+  ).then((brand) => {
+    created.value = brand;
+    created.listeners.forEach((listener) => listener(brand));
+    return brand;
+  }) : created.loaded;
+  if (storage && typeof storage === "object") entries.set(storage, created);
+  return created;
+}
+function useBrand(storage) {
+  const [brand, setState] = useState3(() => brandOf(storage).value);
+  useEffect2(() => {
+    const entry = brandOf(storage);
+    setState(entry.value);
+    entry.listeners.add(setState);
+    return () => {
+      entry.listeners.delete(setState);
+    };
+  }, [storage]);
+  const setBrand = useCallback2(
+    (value) => {
+      const entry = brandOf(storage);
+      entry.value = cleanBrand(value);
+      entry.listeners.forEach((listener) => listener(entry.value));
+    },
+    [storage]
+  );
+  return { brand, setBrand };
+}
+
+// src/ui/useLayoutWidth.js
+import { useEffect as useEffect3, useState as useState4 } from "react";
+var LAYOUT_BREAKPOINTS = { wide: 1180, medium: 760 };
+function layoutFor(width) {
+  if (width >= LAYOUT_BREAKPOINTS.wide) return "wide";
+  if (width >= LAYOUT_BREAKPOINTS.medium) return "medium";
+  return "narrow";
+}
+function useLayoutWidth(ref) {
+  const [layout, setLayout] = useState4(
+    /** @type {'wide'|'medium'|'narrow'} */
+    "wide"
+  );
+  useEffect3(() => {
+    const el = ref.current;
+    if (!el || typeof ResizeObserver === "undefined") return void 0;
+    const measure = () => setLayout(layoutFor(el.getBoundingClientRect().width));
+    measure();
+    const observer = new ResizeObserver(measure);
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, [ref]);
+  return layout;
+}
+
+export {
+  socialBlock,
+  socialElementBlock,
+  cn,
+  Button,
+  Separator,
+  Skeleton,
+  SectionLabel,
+  TruncatedText,
+  Tabs,
+  TabsList,
+  TabsTrigger,
+  TooltipWrap,
+  useUi,
+  useT,
+  NoticeArea,
+  UiProvider,
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogDescription,
+  Popover,
+  PopoverTrigger,
+  PopoverContent,
+  DropdownMenu,
+  DropdownMenuTrigger,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  Select,
+  SelectValue,
+  SelectTrigger,
+  SelectContent,
+  SelectItem,
+  Input,
+  Textarea,
+  Label,
+  FRAME_SCROLLBAR_CSS,
+  EmailPreview,
+  PreviewButton,
+  createStarterMjml,
+  STARTER_MJML,
+  TEMPLATE_GALLERY,
+  buildGallery,
+  withThumbnailImages,
+  withPlaceholderImages,
+  brandOf,
+  useBrand,
+  StorageError,
+  createHttpStorage,
+  createMemoryStorage,
+  useLayoutWidth
+};
+//# sourceMappingURL=chunk-AT73Y7JA.js.map