@drawnagency/primitives 0.1.56 → 0.1.58

package/dist/components/sections/register-schemas.js

@@ -0,0 +1,4094 @@
+import {
+  getMediaProvider
+} from "../../chunk-L2JJFOXD.js";
+import {
+  DEFAULT_LINK,
+  LinkValueSchema
+} from "../../chunk-ZU2MKPTG.js";
+import {
+  cn,
+  curatedIcons,
+  getIcon,
+  sanitizeHtml,
+  toSectionId
+} from "../../chunk-RFZNNCAS.js";
+import {
+  ColorItemSchema,
+  SingleMediaReferenceSchema,
+  getSectionSchema
+} from "../../chunk-ICLXLWQ5.js";
+import "../../chunk-DKOUFIP6.js";
+import "../../chunk-NSCT3AMV.js";
+import {
+  defineSection,
+  getSection,
+  registerRichText,
+  registerSchema
+} from "../../chunk-VKAGMEKE.js";
+import "../../chunk-JSBRDJBE.js";
+
+// src/components/sections/LinkHeading/index.tsx
+import { z } from "zod";
+import { Heading1 } from "lucide-react";
+
+// src/components/primitives/EditablePlainText.tsx
+import {
+  useRef as useRef2,
+  useEffect as useEffect2,
+  useCallback as useCallback2,
+  createElement
+} from "react";
+
+// src/components/primitives/useEditablePlainText.ts
+import { useState, useEffect, useRef, useCallback } from "react";
+function useEditablePlainText({
+  value: propValue,
+  onChange,
+  multiline = false
+}) {
+  const [value, setValue] = useState(propValue);
+  const lastPropValue = useRef(propValue);
+  useEffect(() => {
+    if (propValue !== lastPropValue.current) {
+      setValue(propValue);
+      lastPropValue.current = propValue;
+    }
+  }, [propValue]);
+  const handleInput = useCallback((text) => {
+    setValue(text);
+  }, []);
+  const handleBlur = useCallback(() => {
+    if (value !== propValue) {
+      onChange(value);
+      lastPropValue.current = value;
+    }
+  }, [value, propValue, onChange]);
+  return {
+    value,
+    handleInput,
+    handleBlur,
+    shouldPreventEnter: !multiline
+  };
+}
+
+// src/components/primitives/EditablePlainText.tsx
+function EditablePlainText({
+  tag,
+  value,
+  onChange,
+  isEditMode,
+  multiline = false,
+  placeholder,
+  className,
+  ...htmlAttrs
+}) {
+  const ref = useRef2(null);
+  const {
+    value: localValue,
+    handleInput,
+    handleBlur,
+    shouldPreventEnter
+  } = useEditablePlainText({ value, onChange, multiline });
+  useEffect2(() => {
+    if (ref.current && ref.current.textContent !== localValue) {
+      ref.current.textContent = localValue;
+    }
+  }, [localValue]);
+  const onInput = useCallback2(() => {
+    if (ref.current) {
+      handleInput(ref.current.textContent || "");
+    }
+  }, [handleInput]);
+  const onKeyDown = useCallback2(
+    (e) => {
+      if (e.key === "Enter" && shouldPreventEnter) {
+        e.preventDefault();
+      }
+    },
+    [shouldPreventEnter]
+  );
+  const onPaste = useCallback2(
+    (e) => {
+      e.preventDefault();
+      const text = e.clipboardData.getData("text/plain");
+      const selection = window.getSelection();
+      if (selection && selection.rangeCount > 0) {
+        const range = selection.getRangeAt(0);
+        range.deleteContents();
+        range.insertNode(document.createTextNode(text));
+        range.collapse(false);
+        selection.removeAllRanges();
+        selection.addRange(range);
+      }
+      if (ref.current) {
+        handleInput(ref.current.textContent || "");
+      }
+    },
+    [handleInput]
+  );
+  return createElement(
+    tag,
+    {
+      ref,
+      className: isEditMode && placeholder ? `editable-placeholder ${className ?? ""}` : className,
+      contentEditable: isEditMode ? "true" : void 0,
+      suppressContentEditableWarning: isEditMode || void 0,
+      onInput: isEditMode ? onInput : void 0,
+      onBlur: isEditMode ? handleBlur : void 0,
+      onKeyDown: isEditMode ? onKeyDown : void 0,
+      onPaste: isEditMode ? onPaste : void 0,
+      "data-placeholder": isEditMode && placeholder ? placeholder : void 0,
+      ...htmlAttrs
+    },
+    value
+  );
+}
+
+// src/components/primitives/HeadingSection.tsx
+import { jsx } from "react/jsx-runtime";
+function HeadingSection({ heading, tag, placeholder, className, onChange }) {
+  return /* @__PURE__ */ jsx(
+    EditablePlainText,
+    {
+      tag,
+      value: heading,
+      onChange: onChange ?? (() => {
+      }),
+      isEditMode: !!onChange,
+      placeholder,
+      id: toSectionId(heading),
+      className: cn("scroll-mt-20", className)
+    }
+  );
+}
+
+// src/components/sections/LinkHeading/index.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var schema = z.object({
+  type: z.literal("link_heading"),
+  content: z.object({ heading: z.string() })
+});
+var LinkHeading_default = defineSection({
+  type: "link_heading",
+  label: "Link Heading",
+  icon: /* @__PURE__ */ jsx2(Heading1, { size: 18 }),
+  schema,
+  navRole: "h1",
+  component: ({ content, onChange }) => /* @__PURE__ */ jsx2(
+    HeadingSection,
+    {
+      heading: content.content.heading,
+      tag: "h2",
+      placeholder: "Section heading",
+      onChange: onChange ? (heading) => onChange({ type: "link_heading", content: { heading } }) : void 0
+    }
+  ),
+  defaults: () => ({ type: "link_heading", content: { heading: "New Section" } }),
+  getLabel: (content) => content.content.heading
+});
+
+// src/components/sections/SubHeading/index.tsx
+import { z as z2 } from "zod";
+import { Heading2 } from "lucide-react";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var schema2 = z2.object({
+  type: z2.literal("sub_heading"),
+  content: z2.object({ heading: z2.string(), excludeFromNav: z2.boolean().optional() })
+});
+var SubHeading_default = defineSection({
+  type: "sub_heading",
+  label: "Sub Heading",
+  icon: /* @__PURE__ */ jsx3(Heading2, { size: 18 }),
+  schema: schema2,
+  navRole: "h2",
+  component: ({ content, onChange }) => /* @__PURE__ */ jsx3(
+    HeadingSection,
+    {
+      heading: content.content.heading,
+      tag: "h3",
+      placeholder: "Sub heading",
+      onChange: onChange ? (heading) => onChange({ ...content, content: { ...content.content, heading } }) : void 0
+    }
+  ),
+  defaults: () => ({ type: "sub_heading", content: { heading: "New Sub Heading" } }),
+  getLabel: (content) => content.content.heading,
+  settings: {
+    excludeFromNav: { type: "checkbox", label: "Exclude from navigation", default: false, target: "content" }
+  }
+});
+
+// src/components/sections/SubSubHeading/index.tsx
+import { z as z3 } from "zod";
+import { Heading3 } from "lucide-react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var schema3 = z3.object({
+  type: z3.literal("sub_sub_heading"),
+  content: z3.object({ heading: z3.string(), excludeFromNav: z3.boolean().optional() })
+});
+var SubSubHeading_default = defineSection({
+  type: "sub_sub_heading",
+  label: "Sub Sub Heading",
+  icon: /* @__PURE__ */ jsx4(Heading3, { size: 18 }),
+  schema: schema3,
+  navRole: "h3",
+  component: ({ content, onChange }) => /* @__PURE__ */ jsx4(
+    HeadingSection,
+    {
+      heading: content.content.heading,
+      tag: "h4",
+      placeholder: "Sub sub heading",
+      onChange: onChange ? (heading) => onChange({ ...content, content: { ...content.content, heading } }) : void 0
+    }
+  ),
+  defaults: () => ({ type: "sub_sub_heading", content: { heading: "New Sub Sub Heading" } }),
+  getLabel: (content) => content.content.heading,
+  settings: {
+    excludeFromNav: { type: "checkbox", label: "Exclude from navigation", default: false, target: "content" }
+  }
+});
+
+// src/components/sections/Prose/index.tsx
+import { z as z4 } from "zod";
+import { AlignLeft } from "lucide-react";
+
+// src/components/primitives/EditableRichText.tsx
+import { useRef as useRef4, useCallback as useCallback4, useEffect as useEffect4 } from "react";
+import { EditorContent } from "@tiptap/react";
+import { BubbleMenu } from "@tiptap/react/menus";
+
+// src/components/primitives/useEditableRichText.ts
+import { useState as useState2, useRef as useRef3, useCallback as useCallback3, useEffect as useEffect3 } from "react";
+import { Editor } from "@tiptap/core";
+import Placeholder from "@tiptap/extension-placeholder";
+
+// src/components/primitives/tiptap-presets.ts
+import StarterKit from "@tiptap/starter-kit";
+import Underline from "@tiptap/extension-underline";
+import Link from "@tiptap/extension-link";
+
+// ../../node_modules/.pnpm/@tiptap+extension-paragraph@3.22.4_@tiptap+core@3.22.4_@tiptap+pm@3.22.4_/node_modules/@tiptap/extension-paragraph/dist/index.js
+import { mergeAttributes, Node } from "@tiptap/core";
+var EMPTY_PARAGRAPH_MARKDOWN = " ";
+var NBSP_CHAR = "\xA0";
+var Paragraph = Node.create({
+  name: "paragraph",
+  priority: 1e3,
+  addOptions() {
+    return {
+      HTMLAttributes: {}
+    };
+  },
+  group: "block",
+  content: "inline*",
+  parseHTML() {
+    return [{ tag: "p" }];
+  },
+  renderHTML({ HTMLAttributes }) {
+    return ["p", mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0];
+  },
+  parseMarkdown: (token, helpers) => {
+    const tokens = token.tokens || [];
+    if (tokens.length === 1 && tokens[0].type === "image") {
+      return helpers.parseChildren([tokens[0]]);
+    }
+    const content = helpers.parseInline(tokens);
+    const hasExplicitEmptyParagraphMarker = tokens.length === 1 && tokens[0].type === "text" && (tokens[0].raw === EMPTY_PARAGRAPH_MARKDOWN || tokens[0].text === EMPTY_PARAGRAPH_MARKDOWN || tokens[0].raw === NBSP_CHAR || tokens[0].text === NBSP_CHAR);
+    if (hasExplicitEmptyParagraphMarker && content.length === 1 && content[0].type === "text" && (content[0].text === EMPTY_PARAGRAPH_MARKDOWN || content[0].text === NBSP_CHAR)) {
+      return helpers.createNode("paragraph", void 0, []);
+    }
+    return helpers.createNode("paragraph", void 0, content);
+  },
+  renderMarkdown: (node, h, ctx) => {
+    var _a, _b;
+    if (!node) {
+      return "";
+    }
+    const content = Array.isArray(node.content) ? node.content : [];
+    if (content.length === 0) {
+      const previousContent = Array.isArray((_a = ctx == null ? void 0 : ctx.previousNode) == null ? void 0 : _a.content) ? ctx.previousNode.content : [];
+      const previousNodeIsEmptyParagraph = ((_b = ctx == null ? void 0 : ctx.previousNode) == null ? void 0 : _b.type) === "paragraph" && previousContent.length === 0;
+      return previousNodeIsEmptyParagraph ? EMPTY_PARAGRAPH_MARKDOWN : "";
+    }
+    return h.renderChildren(content);
+  },
+  addCommands() {
+    return {
+      setParagraph: () => ({ commands }) => {
+        return commands.setNode(this.name);
+      }
+    };
+  },
+  addKeyboardShortcuts() {
+    return {
+      "Mod-Alt-0": () => this.editor.commands.setParagraph()
+    };
+  }
+});
+var index_default = Paragraph;
+
+// src/components/primitives/CustomParagraph.ts
+var ALLOWED_CLASSES = ["large", "lead-in"];
+var CustomParagraph = index_default.extend({
+  addAttributes() {
+    return {
+      ...this.parent?.(),
+      class: {
+        default: null,
+        parseHTML: (element) => {
+          const cls = element.getAttribute("class");
+          if (cls && ALLOWED_CLASSES.includes(cls)) {
+            return cls;
+          }
+          return null;
+        },
+        renderHTML: (attributes) => {
+          if (!attributes.class) return {};
+          return { class: attributes.class };
+        }
+      }
+    };
+  }
+});
+
+// src/components/primitives/tiptap-presets.ts
+var basic = [
+  StarterKit.configure({
+    paragraph: false,
+    heading: false,
+    blockquote: false,
+    bulletList: false,
+    orderedList: false,
+    listItem: false,
+    codeBlock: false,
+    horizontalRule: false,
+    code: false,
+    strike: false
+  }),
+  CustomParagraph,
+  Underline
+];
+var rich = [
+  StarterKit.configure({
+    paragraph: false,
+    heading: { levels: [3, 4] },
+    blockquote: false,
+    codeBlock: false,
+    horizontalRule: false,
+    code: false,
+    strike: false
+  }),
+  CustomParagraph,
+  Underline,
+  // `page` protocol: stable internal-page hrefs (page://{pageId}#{sectionId})
+  // resolved to real routes at SSR — see lib/links.ts.
+  Link.configure({ openOnClick: false, protocols: ["page"] })
+];
+var presets = { basic, rich };
+
+// src/components/primitives/useEditableRichText.ts
+function useEditableRichText({
+  value,
+  onChange,
+  preset,
+  placeholder
+}) {
+  const editorRef = useRef3(null);
+  const [editor, setEditor] = useState2(null);
+  const valueRef = useRef3(value);
+  const onChangeRef = useRef3(onChange);
+  useEffect3(() => {
+    valueRef.current = value;
+  }, [value]);
+  useEffect3(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
+  const activate = useCallback3(() => {
+    if (editorRef.current) return;
+    const extensions = placeholder ? [...presets[preset], Placeholder.configure({ placeholder })] : presets[preset];
+    const ed = new Editor({
+      extensions,
+      content: valueRef.current,
+      // Commit edits to onChange on every transaction, not only on deactivate().
+      // Without this, content lives only inside TipTap until blur; clicking a
+      // Save button while the editor is still focused flushes persistence before
+      // the (150ms-delayed) blur->deactivate commit fires, silently dropping the
+      // in-progress edit. Live-committing keeps persistence in sync continuously.
+      onUpdate: ({ editor: updated }) => {
+        const html = updated.getHTML();
+        if (html !== valueRef.current) {
+          valueRef.current = html;
+          onChangeRef.current(html);
+        }
+      }
+    });
+    editorRef.current = ed;
+    setEditor(ed);
+  }, [preset, placeholder]);
+  const deactivate = useCallback3(() => {
+    const ed = editorRef.current;
+    if (!ed) return;
+    const html = ed.getHTML();
+    ed.destroy();
+    editorRef.current = null;
+    setEditor(null);
+    if (html !== valueRef.current) {
+      onChangeRef.current(html);
+    }
+  }, []);
+  useEffect3(() => {
+    return () => {
+      editorRef.current?.destroy();
+      editorRef.current = null;
+    };
+  }, []);
+  return {
+    isEditorActive: editor !== null,
+    editor,
+    activate,
+    deactivate
+  };
+}
+
+// src/components/primitives/RichTextToolbar.tsx
+import { useState as useState4 } from "react";
+import { useEditorState } from "@tiptap/react";
+
+// src/components/primitives/LinkPopover.tsx
+import { useState as useState3 } from "react";
+
+// src/components/shared/Button.tsx
+import { forwardRef } from "react";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var boxSize = {
+  sm: "rounded px-3 py-1.5 text-xs font-medium",
+  md: "rounded px-4 py-2 text-sm font-medium"
+};
+var ghostSize = {
+  sm: "text-xs font-medium",
+  md: "text-sm font-medium"
+};
+var variantClasses = {
+  primary: "bg-base-contrast text-base-accent hover:bg-base-contrast/90",
+  brand: "bg-primary text-primary-contrast hover:opacity-90",
+  secondary: "border border-base-200 text-base-contrast hover:bg-base-accent",
+  destructive: "border border-red-600 text-red-600 hover:bg-red-600 hover:text-white"
+};
+var ghostToneClasses = {
+  neutral: "text-base-contrast-light hover:text-base-contrast",
+  destructive: "text-red-600 hover:text-red-800"
+};
+var Button = forwardRef(function Button2({
+  variant = "primary",
+  size = "sm",
+  tone = "neutral",
+  fullWidth = false,
+  isLoading = false,
+  loadingLabel,
+  disabled,
+  className,
+  children,
+  ...rest
+}, ref) {
+  const isGhost = variant === "ghost";
+  const resolvedDisabled = disabled || isLoading;
+  const label = isLoading && loadingLabel ? loadingLabel : children;
+  return /* @__PURE__ */ jsx5(
+    "button",
+    {
+      ref,
+      disabled: resolvedDisabled,
+      className: cn(
+        "inline-flex items-center justify-center transition-colors",
+        isGhost ? ghostSize[size] : boxSize[size],
+        isGhost ? ghostToneClasses[tone] : variantClasses[variant],
+        fullWidth && "w-full",
+        resolvedDisabled ? "cursor-not-allowed opacity-50" : "cursor-pointer",
+        className
+      ),
+      ...rest,
+      children: label
+    }
+  );
+});
+
+// src/components/shared/PagesContext.tsx
+import { createContext, useContext } from "react";
+var PagesContext = createContext({ pages: [], getPageHeadings: () => [] });
+function usePages() {
+  return useContext(PagesContext);
+}
+
+// src/lib/links.ts
+function internalHref(pageId, anchorSectionId) {
+  return `page://${pageId}${anchorSectionId ? `#${anchorSectionId}` : ""}`;
+}
+function parseInternalHref(href) {
+  const m = /^page:\/\/([^#]+)(?:#(.+))?$/.exec(href);
+  return m ? { pageId: m[1], anchorSectionId: m[2] ?? null } : null;
+}
+
+// src/components/primitives/LinkPopover.tsx
+import { Fragment, jsx as jsx6, jsxs } from "react/jsx-runtime";
+var selectClasses = "w-full rounded border border-base-contrast/20 bg-base px-2 py-1 text-sm text-base-contrast focus:outline-none focus:ring-1 focus:ring-primary";
+function LinkPopover({ editor, onClose }) {
+  const { pages, getPageHeadings } = usePages();
+  const existingAttrs = editor.getAttributes("link");
+  const existingInternal = parseInternalHref(existingAttrs.href ?? "");
+  const [mode, setMode] = useState3(existingInternal ? "internal" : "external");
+  const [url, setUrl] = useState3(existingInternal ? "" : existingAttrs.href ?? "");
+  const [pageId, setPageId] = useState3(existingInternal?.pageId ?? "");
+  const [anchorId, setAnchorId] = useState3(existingInternal?.anchorSectionId ?? "");
+  const [openInNewTab, setOpenInNewTab] = useState3(
+    existingAttrs.target === "_blank"
+  );
+  const hasLink = Boolean(existingAttrs.href);
+  const headings = pageId ? getPageHeadings(pageId) : [];
+  const handleApply = () => {
+    if (mode === "internal") {
+      if (pageId) {
+        editor.chain().focus().extendMarkRange("link").setLink({ href: internalHref(pageId, anchorId || null), target: null }).run();
+      }
+    } else if (url.trim()) {
+      editor.chain().focus().extendMarkRange("link").setLink({ href: url.trim(), target: openInNewTab ? "_blank" : null }).run();
+    }
+    onClose();
+  };
+  const handleRemove = () => {
+    editor.chain().focus().extendMarkRange("link").unsetLink().run();
+    onClose();
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      handleApply();
+    } else if (e.key === "Escape") {
+      e.preventDefault();
+      onClose();
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex w-64 flex-col gap-2 rounded bg-base-accent p-3 shadow-lg",
+      onMouseDown: (e) => e.stopPropagation(),
+      onKeyDown: handleKeyDown,
+      children: [
+        /* @__PURE__ */ jsx6("div", { className: "flex gap-2", role: "tablist", children: ["external", "internal"].map((kind) => /* @__PURE__ */ jsx6(
+          "button",
+          {
+            type: "button",
+            role: "tab",
+            "aria-selected": mode === kind,
+            onClick: () => setMode(kind),
+            className: cn(
+              "cursor-pointer rounded border px-2 py-0.5 text-xs",
+              mode === kind ? "border-primary bg-primary text-primary-contrast" : "border-base-200 text-base-contrast"
+            ),
+            children: kind === "external" ? "External URL" : "Internal page"
+          },
+          kind
+        )) }),
+        mode === "external" ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx6(
+            "input",
+            {
+              autoFocus: true,
+              type: "url",
+              value: url,
+              onChange: (e) => setUrl(e.target.value),
+              placeholder: "https://example.com",
+              className: "rounded border border-base-contrast/20 bg-base px-2 py-1 text-sm text-base-contrast placeholder:text-base-contrast/40 focus:outline-none focus:ring-1 focus:ring-primary"
+            }
+          ),
+          /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-center gap-2 text-sm text-base-contrast", children: [
+            /* @__PURE__ */ jsx6(
+              "input",
+              {
+                type: "checkbox",
+                checked: openInNewTab,
+                onChange: (e) => setOpenInNewTab(e.target.checked),
+                className: "accent-primary"
+              }
+            ),
+            "Open in new tab"
+          ] })
+        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs(
+            "select",
+            {
+              autoFocus: true,
+              "aria-label": "Page",
+              value: pageId,
+              onChange: (e) => {
+                setPageId(e.target.value);
+                setAnchorId("");
+              },
+              className: selectClasses,
+              children: [
+                /* @__PURE__ */ jsx6("option", { value: "", children: "Select a page\u2026" }),
+                pages.map((p) => /* @__PURE__ */ jsx6("option", { value: p.id, children: p.title }, p.id))
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "select",
+            {
+              "aria-label": "Section",
+              value: anchorId,
+              disabled: !pageId,
+              onChange: (e) => setAnchorId(e.target.value),
+              className: cn(selectClasses, !pageId && "cursor-not-allowed opacity-50"),
+              children: [
+                /* @__PURE__ */ jsx6("option", { value: "", children: "None (top of page)" }),
+                headings.map((h) => /* @__PURE__ */ jsx6("option", { value: h.id, children: h.label }, h.id))
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx6(
+            Button,
+            {
+              variant: "brand",
+              size: "sm",
+              onMouseDown: (e) => {
+                e.preventDefault();
+                handleApply();
+              },
+              children: "Apply"
+            }
+          ),
+          hasLink && /* @__PURE__ */ jsx6(
+            Button,
+            {
+              variant: "secondary",
+              size: "sm",
+              onMouseDown: (e) => {
+                e.preventDefault();
+                handleRemove();
+              },
+              children: "Remove"
+            }
+          ),
+          /* @__PURE__ */ jsx6(
+            Button,
+            {
+              variant: "secondary",
+              size: "sm",
+              onMouseDown: (e) => {
+                e.preventDefault();
+                onClose();
+              },
+              children: "Cancel"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/primitives/RichTextToolbar.tsx
+import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs2 } from "react/jsx-runtime";
+function ToolbarButton({ isActive, onClick, title, children }) {
+  return /* @__PURE__ */ jsx7(
+    "button",
+    {
+      type: "button",
+      title,
+      "aria-label": title,
+      "aria-pressed": isActive,
+      onMouseDown: (e) => {
+        e.preventDefault();
+        onClick();
+      },
+      className: cn(
+        "cursor-pointer rounded px-2 py-1 text-sm font-medium transition-colors",
+        isActive ? "bg-primary text-primary-contrast" : "bg-base-accent text-base-contrast hover:opacity-80"
+      ),
+      children
+    }
+  );
+}
+function Separator() {
+  return /* @__PURE__ */ jsx7("div", { className: "mx-1 h-5 w-px bg-base-contrast/20" });
+}
+function RichTextToolbar({ editor, preset }) {
+  const [showLinkPopover, setShowLinkPopover] = useState4(false);
+  const state = useEditorState({
+    editor,
+    selector: ({ editor: ed }) => ({
+      isBold: ed.isActive("bold"),
+      isItalic: ed.isActive("italic"),
+      isUnderline: ed.isActive("underline"),
+      isLink: ed.isActive("link"),
+      isBulletList: ed.isActive("bulletList"),
+      isOrderedList: ed.isActive("orderedList"),
+      isH3: ed.isActive("heading", { level: 3 }),
+      isH4: ed.isActive("heading", { level: 4 }),
+      isLarge: ed.isActive("paragraph", { class: "large" }),
+      isLeadIn: ed.isActive("paragraph", { class: "lead-in" })
+    })
+  });
+  const toggleParagraphVariant = (cls, isCurrentlyActive) => {
+    if (isCurrentlyActive) {
+      editor.chain().focus().setNode("paragraph").run();
+    } else {
+      editor.chain().focus().setNode("paragraph", { class: cls }).run();
+    }
+  };
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      "data-testid": "rich-text-toolbar",
+      className: "flex items-center gap-1 rounded border border-base-contrast/10 bg-base-accent p-1 shadow-md",
+      children: [
+        /* @__PURE__ */ jsx7(
+          ToolbarButton,
+          {
+            isActive: state.isBold,
+            onClick: () => editor.chain().focus().toggleBold().run(),
+            title: "Bold",
+            children: /* @__PURE__ */ jsx7("strong", { children: "B" })
+          }
+        ),
+        /* @__PURE__ */ jsx7(
+          ToolbarButton,
+          {
+            isActive: state.isItalic,
+            onClick: () => editor.chain().focus().toggleItalic().run(),
+            title: "Italic",
+            children: /* @__PURE__ */ jsx7("em", { children: "I" })
+          }
+        ),
+        /* @__PURE__ */ jsx7(
+          ToolbarButton,
+          {
+            isActive: state.isUnderline,
+            onClick: () => editor.chain().focus().toggleUnderline().run(),
+            title: "Underline",
+            children: /* @__PURE__ */ jsx7("span", { className: "underline", children: "U" })
+          }
+        ),
+        preset === "rich" && /* @__PURE__ */ jsxs2(Fragment2, { children: [
+          /* @__PURE__ */ jsx7(Separator, {}),
+          /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
+            /* @__PURE__ */ jsx7(
+              ToolbarButton,
+              {
+                isActive: state.isLink || showLinkPopover,
+                onClick: () => setShowLinkPopover((prev) => !prev),
+                title: "Link",
+                children: "\u{1F517}"
+              }
+            ),
+            showLinkPopover && /* @__PURE__ */ jsx7("div", { className: "absolute left-0 top-full z-50 mt-1", children: /* @__PURE__ */ jsx7(
+              LinkPopover,
+              {
+                editor,
+                onClose: () => setShowLinkPopover(false)
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ jsx7(Separator, {}),
+          /* @__PURE__ */ jsx7(
+            ToolbarButton,
+            {
+              isActive: state.isBulletList,
+              onClick: () => editor.chain().focus().toggleBulletList().run(),
+              title: "Bullet List",
+              children: "\u2022\u2261"
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            ToolbarButton,
+            {
+              isActive: state.isOrderedList,
+              onClick: () => editor.chain().focus().toggleOrderedList().run(),
+              title: "Ordered List",
+              children: "1\u2261"
+            }
+          ),
+          /* @__PURE__ */ jsx7(Separator, {}),
+          /* @__PURE__ */ jsx7(
+            ToolbarButton,
+            {
+              isActive: state.isH3,
+              onClick: () => editor.chain().focus().toggleHeading({ level: 3 }).run(),
+              title: "Heading 3",
+              children: "H3"
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            ToolbarButton,
+            {
+              isActive: state.isH4,
+              onClick: () => editor.chain().focus().toggleHeading({ level: 4 }).run(),
+              title: "Heading 4",
+              children: "H4"
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            ToolbarButton,
+            {
+              isActive: state.isLarge,
+              onClick: () => toggleParagraphVariant("large", state.isLarge),
+              title: "Large Paragraph",
+              children: "Lg"
+            }
+          ),
+          /* @__PURE__ */ jsx7(
+            ToolbarButton,
+            {
+              isActive: state.isLeadIn,
+              onClick: () => toggleParagraphVariant("lead-in", state.isLeadIn),
+              title: "Lead-In",
+              children: "Li"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/primitives/EditableRichText.tsx
+import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
+function isContentEmpty(html) {
+  return html.replace(/<[^>]*>/g, "").trim().length === 0;
+}
+var DEFAULT_PLACEHOLDER = "Click to edit\u2026";
+function EditableRichText({
+  value,
+  onChange,
+  isEditMode,
+  preset = "rich",
+  className,
+  placeholder = DEFAULT_PLACEHOLDER
+}) {
+  const { isEditorActive, editor, activate, deactivate } = useEditableRichText({ value, onChange, preset, placeholder });
+  const wrapperRef = useRef4(null);
+  const blurTimeoutRef = useRef4(null);
+  const clickCoordsRef = useRef4(null);
+  useEffect4(() => {
+    return () => {
+      if (blurTimeoutRef.current) {
+        clearTimeout(blurTimeoutRef.current);
+      }
+    };
+  }, []);
+  useEffect4(() => {
+    if (!isEditorActive || !editor) return;
+    requestAnimationFrame(() => {
+      if (editor.isDestroyed) return;
+      const coords = clickCoordsRef.current;
+      if (coords) {
+        try {
+          const pos = editor.view.posAtCoords(coords);
+          if (pos) {
+            editor.commands.focus();
+            editor.commands.setTextSelection(pos.pos);
+          } else {
+            editor.commands.focus("end");
+          }
+        } catch {
+          editor.commands.focus("end");
+        } finally {
+          clickCoordsRef.current = null;
+        }
+      } else {
+        editor.commands.focus("end");
+      }
+    });
+  }, [isEditorActive, editor]);
+  const handleClick = useCallback4((e) => {
+    if (isEditMode && !isEditorActive) {
+      clickCoordsRef.current = { left: e.clientX, top: e.clientY };
+      activate();
+    }
+  }, [isEditMode, isEditorActive, activate]);
+  const handleFocus = useCallback4(() => {
+    if (blurTimeoutRef.current) {
+      clearTimeout(blurTimeoutRef.current);
+      blurTimeoutRef.current = null;
+    }
+  }, []);
+  const handleBlur = useCallback4(() => {
+    blurTimeoutRef.current = setTimeout(() => {
+      if (wrapperRef.current && !wrapperRef.current.contains(document.activeElement)) {
+        deactivate();
+      }
+    }, 150);
+  }, [deactivate]);
+  if (!isEditMode) {
+    return /* @__PURE__ */ jsx8(
+      "div",
+      {
+        className,
+        dangerouslySetInnerHTML: { __html: sanitizeHtml(value) }
+      }
+    );
+  }
+  if (!isEditorActive || !editor) {
+    const empty = isContentEmpty(value);
+    if (empty) {
+      return /* @__PURE__ */ jsx8("div", { className, onClick: handleClick, children: /* @__PURE__ */ jsx8("p", { className: "tiptap-placeholder", children: placeholder }) });
+    }
+    return /* @__PURE__ */ jsx8(
+      "div",
+      {
+        className,
+        onClick: handleClick,
+        dangerouslySetInnerHTML: { __html: sanitizeHtml(value) }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      ref: wrapperRef,
+      className,
+      onFocus: handleFocus,
+      onBlur: handleBlur,
+      children: [
+        /* @__PURE__ */ jsx8(
+          BubbleMenu,
+          {
+            editor,
+            className: "z-50",
+            shouldShow: ({ editor: ed, state }) => {
+              const { from, to } = state.selection;
+              return ed.isFocused && from !== to;
+            },
+            children: /* @__PURE__ */ jsx8(RichTextToolbar, { editor, preset })
+          }
+        ),
+        /* @__PURE__ */ jsx8(EditorContent, { editor })
+      ]
+    }
+  );
+}
+
+// src/components/sections/Prose/Prose.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+function Prose({ body, onChange }) {
+  if (onChange) {
+    return /* @__PURE__ */ jsx9("div", { className: "prose-content", children: /* @__PURE__ */ jsx9(
+      EditableRichText,
+      {
+        value: body,
+        onChange: (html) => onChange({ type: "prose", content: { body: html } }),
+        isEditMode: true,
+        preset: "rich",
+        placeholder: "Start writing..."
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx9(
+    "div",
+    {
+      className: "prose-content",
+      dangerouslySetInnerHTML: { __html: sanitizeHtml(body) }
+    }
+  );
+}
+
+// src/lib/text.ts
+function stripHtmlToPlainText(html) {
+  return html.replace(/<(script|style)\b[^>]*>[\s\S]*?<\/\1>/gi, "").replace(/<[^>]+>/g, " ").replace(/\s+/g, " ").trim();
+}
+function truncate(text, maxLength) {
+  if (text.length <= maxLength) return text;
+  return text.slice(0, maxLength) + "...";
+}
+
+// src/components/sections/Prose/index.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var schema4 = z4.object({
+  type: z4.literal("prose"),
+  content: z4.object({ body: z4.string() })
+});
+var Prose_default = defineSection({
+  type: "prose",
+  label: "Prose",
+  icon: /* @__PURE__ */ jsx10(AlignLeft, { size: 18 }),
+  schema: schema4,
+  richTextFields: ["body"],
+  component: ({ content, onChange }) => /* @__PURE__ */ jsx10(Prose, { body: content.content.body, onChange: onChange ? (c) => onChange(c) : void 0 }),
+  defaults: () => ({ type: "prose", content: { body: "<p></p>" } }),
+  getLabel: (content) => truncate(stripHtmlToPlainText(content.content.body), 60)
+});
+
+// src/components/sections/Media/index.tsx
+import { z as z5 } from "zod";
+import { Image as ImageIcon2 } from "lucide-react";
+
+// src/components/sections/Media/MediaBlock.tsx
+import { Check, X } from "lucide-react";
+
+// src/components/primitives/ResolvedMedia.tsx
+import { ImageIcon } from "lucide-react";
+
+// src/hooks/useResolvedMedia.ts
+import { useMemo } from "react";
+
+// src/components/shell/MediaLibraryContext.tsx
+import { createContext as createContext2, useContext as useContext2 } from "react";
+var MediaLibraryContext = createContext2(null);
+function useMediaLibrary() {
+  return useContext2(MediaLibraryContext);
+}
+
+// src/hooks/useResolvedMedia.ts
+function useResolvedMedia(imageId) {
+  const ctx = useMediaLibrary();
+  return useMemo(() => {
+    if (!imageId || !ctx) {
+      return { src: void 0, srcset: void 0, poster: void 0, alt: "", kind: "image" };
+    }
+    const { manifest, pendingItems, pendingLocalUrls, siteConfig } = ctx;
+    const sizes = siteConfig?.media?.sizes ?? [640, 1080, 1920];
+    const manifestItem = manifest.images[imageId];
+    const pendingItem = pendingItems.find((i) => i.id === imageId);
+    const item = manifestItem ?? pendingItem;
+    const alt = item?.alt ?? "";
+    const kind = item?.kind ?? "image";
+    const localUrl = pendingLocalUrls[imageId];
+    if (localUrl) {
+      return { src: localUrl, srcset: void 0, poster: void 0, alt, kind };
+    }
+    if (manifestItem) {
+      const provider = getMediaProvider();
+      const resolved = provider.resolve(manifestItem, sizes);
+      if (resolved && resolved.tag === "img") {
+        return {
+          src: resolved.src,
+          srcset: "srcSet" in resolved ? resolved.srcSet : void 0,
+          poster: void 0,
+          alt,
+          kind
+        };
+      }
+      if (resolved && resolved.tag === "video") {
+        return { src: resolved.src, srcset: void 0, poster: resolved.poster, alt, kind };
+      }
+    }
+    return { src: void 0, srcset: void 0, poster: void 0, alt, kind };
+  }, [imageId, ctx]);
+}
+
+// src/components/primitives/ResolvedMedia.tsx
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
+function ResolvedMedia({
+  imageId,
+  src: propSrc,
+  srcset: propSrcset,
+  alt: propAlt,
+  className,
+  imgClassName,
+  invertFrom
+}) {
+  const resolved = useResolvedMedia(imageId);
+  const src = propSrc || resolved.src;
+  const srcset = propSrcset || resolved.srcset;
+  const poster = resolved.poster;
+  const alt = propAlt ?? resolved.alt;
+  const kind = resolved.kind;
+  const invertClass = invertFrom === "light" ? "invert dark:invert-0" : invertFrom === "dark" ? "dark:invert" : void 0;
+  const mediaClass = cn("h-full w-full", imgClassName, invertClass);
+  return /* @__PURE__ */ jsx11("div", { className, children: src ? kind === "video" ? /* @__PURE__ */ jsx11("video", { src, poster, muted: true, playsInline: true, loop: true, autoPlay: true, className: mediaClass }) : /* @__PURE__ */ jsx11("img", { src, srcSet: srcset, alt, className: mediaClass }) : /* @__PURE__ */ jsxs4("div", { className: "flex aspect-video h-full w-full flex-col items-center justify-center gap-1 rounded bg-base-accent text-base-contrast-light/50", children: [
+    /* @__PURE__ */ jsx11(ImageIcon, { size: 24 }),
+    /* @__PURE__ */ jsx11("span", { className: "text-sm", children: "No Image" })
+  ] }) });
+}
+
+// src/components/primitives/ImageDropZone.tsx
+import { useState as useState5 } from "react";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
+var ACCEPTED = /^(image|video)\//;
+function ImageDropZone({ onImageSelected, className, children }) {
+  const mediaLibrary = useMediaLibrary();
+  const [dragging, setDragging] = useState5(false);
+  if (!mediaLibrary) return /* @__PURE__ */ jsx12(Fragment3, { children });
+  const maxFileSize = mediaLibrary.siteConfig?.media.maxFileSize;
+  const hasFiles = (e) => e.dataTransfer.types.includes("Files");
+  const handleDragOver = (e) => {
+    if (!hasFiles(e)) return;
+    e.preventDefault();
+    e.dataTransfer.dropEffect = "copy";
+    setDragging(true);
+  };
+  const handleDragLeave = (e) => {
+    if (!hasFiles(e)) return;
+    const related = e.relatedTarget;
+    if (related && e.currentTarget.contains(related)) return;
+    setDragging(false);
+  };
+  const handleDrop = (e) => {
+    if (!hasFiles(e)) return;
+    e.preventDefault();
+    e.stopPropagation();
+    setDragging(false);
+    const file = e.dataTransfer.files[0];
+    if (!file) return;
+    if (!ACCEPTED.test(file.type)) {
+      mediaLibrary.reportRejectedUploads([{ name: file.name, reason: "type" }]);
+      return;
+    }
+    if (maxFileSize && file.size > maxFileSize) {
+      mediaLibrary.reportRejectedUploads([{ name: file.name, reason: "size" }]);
+      return;
+    }
+    mediaLibrary.uploadFileWithCallback(file, onImageSelected);
+  };
+  return /* @__PURE__ */ jsxs5(
+    "div",
+    {
+      className: cn("relative", className),
+      onDragOver: handleDragOver,
+      onDragLeave: handleDragLeave,
+      onDrop: handleDrop,
+      children: [
+        children,
+        dragging && /* @__PURE__ */ jsx12("div", { className: "pointer-events-none absolute inset-0 z-10 rounded-md border-2 border-primary bg-primary/5" })
+      ]
+    }
+  );
+}
+
+// src/components/sections/Media/MediaBlock.tsx
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
+function MediaBlock({ refValue, options, link, dodont, isEditMode, onRefChange }) {
+  const mediaLibrary = useMediaLibrary();
+  const fit = refValue.objectFit ?? options.objectFit;
+  const fitClass = fit === "cover" ? "object-cover" : "object-contain";
+  const showBorder = refValue.border ?? options.border;
+  const captionStr = refValue.caption ? Array.isArray(refValue.caption) ? refValue.caption.join("\n") : refValue.caption : "";
+  const replace = onRefChange ? (imageId) => onRefChange({ ...refValue, imageId }) : void 0;
+  const resolved = /* @__PURE__ */ jsx13(
+    ResolvedMedia,
+    {
+      imageId: refValue.imageId || void 0,
+      className: "h-full w-full",
+      imgClassName: fitClass,
+      invertFrom: refValue.invertFrom
+    }
+  );
+  let media = isEditMode && replace ? /* @__PURE__ */ jsx13(ImageDropZone, { onImageSelected: replace, className: "h-full w-full", children: resolved }) : resolved;
+  if (!isEditMode && link && link.kind === "external" && link.href) {
+    media = /* @__PURE__ */ jsx13("a", { href: link.href, target: link.target, className: "group block", children: media });
+  }
+  const onImageClick = isEditMode && replace && mediaLibrary ? () => mediaLibrary.openSelectModal((imageId) => replace(imageId)) : void 0;
+  return /* @__PURE__ */ jsxs6("figure", { children: [
+    dodont && /* @__PURE__ */ jsx13("div", { className: "flex h-10 items-center justify-center pb-1", children: dodont === "do" ? /* @__PURE__ */ jsx13(Check, { size: 28, className: "text-green-600" }) : /* @__PURE__ */ jsx13(X, { size: 28, className: "text-red-600" }) }),
+    /* @__PURE__ */ jsx13(
+      "div",
+      {
+        "data-testid": "media-open-surface",
+        className: cn(
+          "overflow-hidden rounded-md",
+          showBorder && "border border-base-200",
+          options.square && "aspect-square",
+          onImageClick && "cursor-pointer"
+        ),
+        onClick: onImageClick,
+        onPointerDown: onImageClick ? (e) => e.stopPropagation() : void 0,
+        children: media
+      }
+    ),
+    options.showCaption && /* @__PURE__ */ jsx13("figcaption", { className: "mt-2 min-h-[1em] text-sm text-base-contrast-light", children: isEditMode && onRefChange ? /* @__PURE__ */ jsx13(
+      EditablePlainText,
+      {
+        tag: "span",
+        value: captionStr,
+        onChange: (caption) => onRefChange({ ...refValue, caption: caption || void 0 }),
+        isEditMode: true,
+        placeholder: "Caption",
+        className: "block min-h-[1em]"
+      }
+    ) : captionStr || " " })
+  ] });
+}
+
+// src/components/sections/Media/index.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
+var schema5 = z5.object({
+  type: z5.literal("media"),
+  content: z5.object({
+    ref: SingleMediaReferenceSchema,
+    link: LinkValueSchema.optional(),
+    dodont: z5.enum(["do", "dont"]).optional()
+  }),
+  options: z5.object({
+    square: z5.boolean().optional(),
+    showCaption: z5.boolean().optional(),
+    border: z5.boolean().optional(),
+    objectFit: z5.enum(["cover", "contain"]).optional()
+  }).default({})
+});
+var Media_default = defineSection({
+  type: "media",
+  label: "Media",
+  icon: /* @__PURE__ */ jsx14(ImageIcon2, { size: 18 }),
+  schema: schema5,
+  component: ({ content, options, onChange }) => /* @__PURE__ */ jsx14(
+    MediaBlock,
+    {
+      refValue: content.content.ref,
+      options: options ?? {},
+      link: content.content.link,
+      dodont: content.content.dodont,
+      isEditMode: !!onChange,
+      onRefChange: onChange ? (ref) => onChange({ ...content, content: { ...content.content, ref } }) : void 0
+    }
+  ),
+  defaults: () => ({
+    type: "media",
+    content: { ref: { type: "image", imageId: "" } },
+    options: {}
+  }),
+  getLabel: () => "Media",
+  getThumbnails: (content) => content.content.ref.imageId ? [{ type: "image", src: content.content.ref.imageId }] : [],
+  settings: {
+    square: { type: "checkbox", label: "Square aspect ratio", default: false },
+    showCaption: { type: "checkbox", label: "Show caption", default: false },
+    border: { type: "checkbox", label: "Border", default: false },
+    objectFit: {
+      type: "select",
+      label: "Image fit",
+      default: "contain",
+      options: [
+        { label: "Contain", value: "contain" },
+        { label: "Cover", value: "cover" }
+      ]
+    },
+    link: { type: "link", label: "Link", default: DEFAULT_LINK, target: "content" },
+    dodont: {
+      type: "select",
+      label: "Do / Don't",
+      target: "content",
+      default: "",
+      emptyIsUndefined: true,
+      options: [
+        { label: "None", value: "" },
+        { label: "Do", value: "do" },
+        { label: "Don't", value: "dont" }
+      ]
+    }
+  },
+  inheritableSettings: ["square", "showCaption", "border", "objectFit"],
+  settingsTabs: [
+    { label: "Display", fields: ["square", "showCaption", "border", "objectFit"] },
+    { label: "Link", fields: ["link"] },
+    { label: "Do / Don't", fields: ["dodont"] }
+  ]
+});
+
+// src/components/sections/Button/index.tsx
+import { z as z6 } from "zod";
+import { RectangleHorizontal } from "lucide-react";
+
+// src/components/sections/Button/CTAButton.tsx
+import { Download } from "lucide-react";
+import { jsx as jsx15, jsxs as jsxs7 } from "react/jsx-runtime";
+function Button3({ text, link, download, onChange }) {
+  const base = "inline-block rounded-md px-6 py-3 font-bold transition-colors";
+  const variant = "border-2 border-primary text-primary hover:bg-primary hover:text-primary-contrast";
+  if (onChange) {
+    return /* @__PURE__ */ jsxs7("span", { className: cn(base, variant, "inline-flex items-center gap-2"), children: [
+      download && /* @__PURE__ */ jsx15(Download, { size: 16, className: "shrink-0" }),
+      /* @__PURE__ */ jsx15(
+        EditablePlainText,
+        {
+          tag: "span",
+          value: text,
+          onChange: (newText) => onChange({ type: "button", content: { text: newText, link, download } }),
+          isEditMode: true,
+          placeholder: "Button text"
+        }
+      )
+    ] });
+  }
+  const href = link && link.kind === "external" ? link.href : "";
+  const target = link?.target;
+  if (href) {
+    return /* @__PURE__ */ jsxs7(
+      "a",
+      {
+        href,
+        target,
+        download: download ? "" : void 0,
+        className: cn(base, variant, download && "inline-flex items-center gap-2"),
+        children: [
+          download && /* @__PURE__ */ jsx15(Download, { size: 16, className: "shrink-0" }),
+          text
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx15("button", { className: cn("cursor-pointer", base, variant), children: text });
+}
+
+// src/components/sections/Button/index.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+var schema6 = z6.object({
+  type: z6.literal("button"),
+  content: z6.object({
+    text: z6.string(),
+    link: LinkValueSchema.optional(),
+    download: z6.boolean().optional()
+  })
+});
+var Button_default = defineSection({
+  type: "button",
+  label: "Button",
+  icon: /* @__PURE__ */ jsx16(RectangleHorizontal, { size: 18 }),
+  schema: schema6,
+  component: ({ content, onChange }) => /* @__PURE__ */ jsx16(
+    Button3,
+    {
+      text: content.content.text,
+      link: content.content.link,
+      download: content.content.download,
+      onChange: onChange ? (c) => onChange(c) : void 0
+    }
+  ),
+  defaults: () => ({ type: "button", content: { text: "Button" } }),
+  getLabel: (content) => content.content.text,
+  settings: {
+    link: { type: "link", label: "Link", default: DEFAULT_LINK, target: "content" },
+    download: { type: "checkbox", label: "Download link", default: false, target: "content" }
+  }
+});
+
+// src/components/sections/Colors/index.tsx
+import { z as z7 } from "zod";
+import { Palette } from "lucide-react";
+
+// src/components/brandguide/Colors.tsx
+import { useState as useState9, useEffect as useEffect7 } from "react";
+import { Eye, EyeOff } from "lucide-react";
+
+// src/lib/container-grid.ts
+var MAX_CONTAINER_COLUMNS = 6;
+var containerGridClass = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 @sm:grid-cols-2",
+  3: "grid-cols-1 @sm:grid-cols-2 @lg:grid-cols-3",
+  4: "grid-cols-1 @xs:grid-cols-2 @lg:grid-cols-4",
+  5: "grid-cols-1 @xs:grid-cols-2 @md:grid-cols-3 @xl:grid-cols-5",
+  6: "grid-cols-1 @xs:grid-cols-2 @md:grid-cols-3 @2xl:grid-cols-6"
+};
+var colSpanClass = {
+  1: { 1: "" },
+  2: { 1: "", 2: "col-span-1 @sm:col-span-2" },
+  3: { 1: "", 2: "col-span-1 @sm:col-span-2", 3: "col-span-1 @sm:col-span-2 @lg:col-span-3" },
+  4: { 1: "", 2: "col-span-1 @xs:col-span-2", 3: "col-span-1 @xs:col-span-2 @lg:col-span-3", 4: "col-span-1 @xs:col-span-2 @lg:col-span-4" },
+  5: { 1: "", 2: "col-span-1 @xs:col-span-2", 3: "col-span-1 @xs:col-span-2 @md:col-span-3", 4: "col-span-1 @xs:col-span-2 @md:col-span-3 @xl:col-span-4", 5: "col-span-1 @xs:col-span-2 @md:col-span-3 @xl:col-span-5" },
+  6: { 1: "", 2: "col-span-1 @xs:col-span-2", 3: "col-span-1 @xs:col-span-2 @md:col-span-3", 4: "col-span-1 @xs:col-span-2 @md:col-span-3 @2xl:col-span-4", 5: "col-span-1 @xs:col-span-2 @md:col-span-3 @2xl:col-span-5", 6: "col-span-1 @xs:col-span-2 @md:col-span-3 @2xl:col-span-6" }
+};
+var spacerHiddenClass = {
+  1: "hidden",
+  2: "hidden @sm:block",
+  3: "hidden @sm:block",
+  4: "hidden @xs:block",
+  5: "hidden @xs:block",
+  6: "hidden @xs:block"
+};
+
+// src/components/primitives/EditableGrid.tsx
+import { useRef as useRef6, useEffect as useEffect6, useState as useState7 } from "react";
+import { ImageIcon as ImageIcon3 } from "lucide-react";
+
+// src/components/shared/icons.tsx
+import { GripVertical, Plus, Trash2, X as X2, Settings } from "lucide-react";
+import { GripVertical as GripVertical2, Plus as Plus2, Trash2 as Trash22, X as X3, Settings as Settings2 } from "lucide-react";
+import { jsx as jsx17 } from "react/jsx-runtime";
+function DragHandle({ size = 16 }) {
+  return /* @__PURE__ */ jsx17(GripVertical, { size });
+}
+function AddIcon({ size = 14 }) {
+  return /* @__PURE__ */ jsx17(Plus, { size });
+}
+function DeleteIcon({ size = 14 }) {
+  return /* @__PURE__ */ jsx17(Trash2, { size });
+}
+function SettingsIcon({ size = 14 }) {
+  return /* @__PURE__ */ jsx17(Settings, { size });
+}
+
+// src/components/shared/IconButton.tsx
+import { forwardRef as forwardRef2 } from "react";
+import { jsx as jsx18 } from "react/jsx-runtime";
+var sizeClasses = {
+  sm: "h-chrome-sm w-chrome-sm",
+  md: "h-chrome-md w-chrome-md",
+  lg: "h-chrome-lg w-chrome-lg"
+};
+var intentClasses = {
+  default: "text-base-contrast-light hover:text-base-contrast",
+  destructive: "text-destructive hover:text-destructive-hover",
+  primary: "text-primary/60 hover:text-primary"
+};
+var IconButton = forwardRef2(
+  function IconButton2({ icon, label, size = "md", intent = "default", className, ...rest }, ref) {
+    return /* @__PURE__ */ jsx18(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: cn(
+          "cursor-pointer flex items-center justify-center rounded transition-colors",
+          sizeClasses[size],
+          intentClasses[intent],
+          className
+        ),
+        "aria-label": label,
+        ...rest,
+        children: icon
+      }
+    );
+  }
+);
+
+// src/components/primitives/useEditableCollection.ts
+import { useState as useState6, useCallback as useCallback5, useRef as useRef5, useEffect as useEffect5 } from "react";
+var nextId = 0;
+function uid() {
+  return typeof crypto !== "undefined" && typeof crypto.randomUUID === "function" ? crypto.randomUUID() : `_id_${nextId++}_${Date.now()}`;
+}
+function wrapItems(items) {
+  return items.map((data) => ({ id: uid(), data }));
+}
+function useEditableCollection({
+  items,
+  onChange,
+  createItem
+}) {
+  const [wrappedItems, setWrappedItems] = useState6(
+    () => wrapItems(items)
+  );
+  const prevItemsRef = useRef5(items);
+  useEffect5(() => {
+    if (items === prevItemsRef.current) return;
+    prevItemsRef.current = items;
+    setWrappedItems((prev) => {
+      return items.map((data, i) => {
+        if (i < prev.length) {
+          return { id: prev[i].id, data };
+        }
+        return { id: uid(), data };
+      });
+    });
+  }, [items]);
+  const onReorder = useCallback5(
+    (fromIndex, toIndex) => {
+      setWrappedItems((prev) => {
+        const next = [...prev];
+        const [moved] = next.splice(fromIndex, 1);
+        next.splice(toIndex, 0, moved);
+        onChange(next.map((w) => w.data));
+        return next;
+      });
+    },
+    [onChange]
+  );
+  const onAdd = useCallback5(() => {
+    const newItem = createItem();
+    setWrappedItems((prev) => {
+      const next = [...prev, { id: uid(), data: newItem }];
+      onChange(next.map((w) => w.data));
+      return next;
+    });
+  }, [createItem, onChange]);
+  const onInsert = useCallback5(
+    (index) => {
+      const newItem = createItem();
+      setWrappedItems((prev) => {
+        const next = [...prev];
+        next.splice(index, 0, { id: uid(), data: newItem });
+        onChange(next.map((w) => w.data));
+        return next;
+      });
+    },
+    [createItem, onChange]
+  );
+  const onRemove = useCallback5(
+    (id) => {
+      setWrappedItems((prev) => {
+        const next = prev.filter((w) => w.id !== id);
+        onChange(next.map((w) => w.data));
+        return next;
+      });
+    },
+    [onChange]
+  );
+  return { wrappedItems, onReorder, onAdd, onInsert, onRemove };
+}
+
+// src/components/primitives/EditableGrid.tsx
+import { jsx as jsx19, jsxs as jsxs8 } from "react/jsx-runtime";
+function EditableGrid({
+  items,
+  columns,
+  onChange,
+  createItem,
+  isEditMode,
+  renderItem,
+  onItemSettings,
+  onItemImageClick,
+  chromeTopClass,
+  className
+}) {
+  const { wrappedItems, onReorder, onAdd, onInsert, onRemove } = useEditableCollection({
+    items,
+    onChange,
+    createItem
+  });
+  const [dragState, setDragState] = useState7({ sourceId: null, closestEdge: null });
+  const [isDragging, setIsDragging] = useState7(false);
+  useEffect6(() => {
+    let cleanup;
+    let cancelled = false;
+    import("../../adapter-HH47ZPGM.js").then(({ monitorForElements }) => {
+      if (cancelled) return;
+      cleanup = monitorForElements({
+        onDragStart: ({ source }) => {
+          if (source.data.dragType === "grid-cell") setIsDragging(true);
+        },
+        onDrop: ({ source }) => {
+          if (source.data.dragType === "grid-cell") setIsDragging(false);
+        }
+      });
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, []);
+  if (!isEditMode) {
+    return /* @__PURE__ */ jsx19("div", { className: "@container", children: /* @__PURE__ */ jsx19("div", { className: cn("grid gap-4", containerGridClass[columns] || containerGridClass[1], className), children: wrappedItems.map((wrapped, index) => /* @__PURE__ */ jsx19("div", { children: renderItem(wrapped.data, { isEditMode: false, index }) }, wrapped.id)) }) });
+  }
+  return /* @__PURE__ */ jsx19("div", { className: "@container", children: /* @__PURE__ */ jsxs8("div", { className: cn("group/grid relative grid gap-4", containerGridClass[columns] || containerGridClass[1], className), children: [
+    wrappedItems.map((wrapped, index) => /* @__PURE__ */ jsx19(
+      GridCell,
+      {
+        id: wrapped.id,
+        index,
+        isLast: index === wrappedItems.length - 1,
+        isDragging,
+        onReorder,
+        onRemove,
+        onInsert,
+        onSettings: onItemSettings ? () => onItemSettings(index) : void 0,
+        onImageClick: onItemImageClick ? () => onItemImageClick(index) : void 0,
+        chromeTopClass,
+        dragState,
+        setDragState,
+        children: renderItem(wrapped.data, { isEditMode: true, index })
+      },
+      wrapped.id
+    )),
+    /* @__PURE__ */ jsx19(
+      IconButton,
+      {
+        icon: /* @__PURE__ */ jsx19(AddIcon, { size: 16 }),
+        label: "Add item",
+        size: "lg",
+        intent: "primary",
+        onClick: onAdd,
+        className: "absolute -bottom-6 left-1/2 z-20 -translate-x-1/2 rounded-full border border-base-200 bg-base opacity-0 transition-opacity group-hover/grid:opacity-100"
+      }
+    )
+  ] }) });
+}
+function GridCell({
+  id,
+  index,
+  isLast,
+  isDragging,
+  onReorder,
+  onRemove,
+  onInsert,
+  onSettings,
+  onImageClick,
+  chromeTopClass,
+  dragState,
+  setDragState,
+  children
+}) {
+  const cellRef = useRef6(null);
+  const handleRef = useRef6(null);
+  useEffect6(() => {
+    const cell = cellRef.current;
+    const handle = handleRef.current;
+    if (!cell || !handle) return;
+    let cleanup;
+    let cancelled = false;
+    Promise.all([
+      import("../../adapter-HH47ZPGM.js"),
+      import("../../closest-edge-EBOXL3YW.js")
+    ]).then(([{ draggable, dropTargetForElements }, { attachClosestEdge, extractClosestEdge }]) => {
+      if (cancelled) return;
+      const cleanupDraggable = draggable({
+        element: handle,
+        getInitialData: () => ({ dragType: "grid-cell", id, index }),
+        onDragStart: () => setDragState({ sourceId: id, closestEdge: null }),
+        onDrop: () => setDragState({ sourceId: null, closestEdge: null })
+      });
+      const cleanupDropTarget = dropTargetForElements({
+        element: cell,
+        canDrop: ({ source }) => source.data.dragType === "grid-cell",
+        getData: ({ input, element }) => attachClosestEdge(
+          { id, index },
+          { input, element, allowedEdges: ["left", "right"] }
+        ),
+        onDragEnter: ({ self }) => {
+          const edge = extractClosestEdge(self.data);
+          if (edge) setDragState((prev) => ({ ...prev, closestEdge: { id, edge } }));
+        },
+        onDrag: ({ self }) => {
+          const edge = extractClosestEdge(self.data);
+          if (edge) setDragState((prev) => ({ ...prev, closestEdge: { id, edge } }));
+        },
+        onDragLeave: () => {
+          setDragState((prev) => prev.closestEdge?.id === id ? { ...prev, closestEdge: null } : prev);
+        },
+        onDrop: ({ source, self }) => {
+          const fromIndex = source.data.index;
+          const edge = extractClosestEdge(self.data);
+          let toIndex = index;
+          if (edge === "right") toIndex = index + 1;
+          if (fromIndex < toIndex) toIndex--;
+          if (fromIndex !== toIndex) {
+            onReorder(fromIndex, toIndex);
+          }
+        }
+      });
+      cleanup = () => {
+        cleanupDraggable();
+        cleanupDropTarget();
+      };
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, [id, index, onReorder, setDragState]);
+  const isCellDragging = dragState.sourceId === id;
+  const showLeftEdge = dragState.closestEdge?.id === id && dragState.closestEdge.edge === "left" && dragState.sourceId !== id;
+  const showRightEdge = dragState.closestEdge?.id === id && dragState.closestEdge.edge === "right" && dragState.sourceId !== id;
+  return /* @__PURE__ */ jsxs8(
+    "div",
+    {
+      ref: cellRef,
+      className: cn(
+        "group/cell relative",
+        isCellDragging && "opacity-50"
+      ),
+      children: [
+        showLeftEdge && /* @__PURE__ */ jsx19("div", { className: "absolute top-0 bottom-0 left-0 z-10 w-0.5 -translate-x-2 bg-primary" }),
+        showRightEdge && /* @__PURE__ */ jsx19("div", { className: "absolute top-0 right-0 bottom-0 z-10 w-0.5 translate-x-2 bg-primary" }),
+        !isDragging && !isLast && /* @__PURE__ */ jsx19(
+          IconButton,
+          {
+            icon: /* @__PURE__ */ jsx19(AddIcon, { size: 12 }),
+            label: "Insert item",
+            size: "sm",
+            intent: "primary",
+            onClick: () => onInsert(index + 1),
+            className: "absolute top-1/2 -right-2 z-20 -translate-y-1/2 translate-x-1/2 rounded-full border border-base-200 bg-base opacity-0 group-hover/cell:opacity-100"
+          }
+        ),
+        /* @__PURE__ */ jsx19(
+          IconButton,
+          {
+            ref: handleRef,
+            icon: /* @__PURE__ */ jsx19(DragHandle, { size: 16 }),
+            label: "Drag to reorder",
+            className: cn("absolute left-1.5 z-10 cursor-grab bg-base/80 opacity-0 shadow-sm group-hover/cell:opacity-100 no-hover:opacity-100", chromeTopClass || "top-1.5"),
+            tabIndex: -1
+          }
+        ),
+        /* @__PURE__ */ jsxs8("div", { className: cn("absolute right-1.5 z-10 flex items-center gap-1 opacity-0 group-hover/cell:opacity-100 no-hover:opacity-100", chromeTopClass || "top-1.5"), children: [
+          onImageClick && /* @__PURE__ */ jsx19(
+            IconButton,
+            {
+              icon: /* @__PURE__ */ jsx19(ImageIcon3, { size: 16 }),
+              label: "Change image",
+              onClick: onImageClick,
+              className: "bg-base/80 shadow-sm"
+            }
+          ),
+          onSettings && /* @__PURE__ */ jsx19(
+            IconButton,
+            {
+              icon: /* @__PURE__ */ jsx19(SettingsIcon, { size: 16 }),
+              label: "Item settings",
+              onClick: onSettings,
+              className: "bg-base/80 shadow-sm"
+            }
+          ),
+          /* @__PURE__ */ jsx19(
+            IconButton,
+            {
+              icon: /* @__PURE__ */ jsx19(DeleteIcon, { size: 16 }),
+              label: "Delete item",
+              intent: "destructive",
+              onClick: () => onRemove(id),
+              className: "bg-base/80 shadow-sm"
+            }
+          )
+        ] }),
+        children
+      ]
+    }
+  );
+}
+
+// src/components/brandguide/ColorSwatchSettings.tsx
+import { useState as useState8 } from "react";
+
+// src/components/shared/Input.tsx
+import { forwardRef as forwardRef3, useId } from "react";
+
+// src/components/shared/FormLabel.tsx
+import { jsx as jsx20 } from "react/jsx-runtime";
+function FormLabel({ htmlFor, children, className }) {
+  return /* @__PURE__ */ jsx20(
+    "label",
+    {
+      htmlFor,
+      className: cn("mb-1.5 block text-sm font-medium text-base-contrast", className),
+      children
+    }
+  );
+}
+
+// src/components/shared/Input.tsx
+import { jsx as jsx21, jsxs as jsxs9 } from "react/jsx-runtime";
+var Input = forwardRef3(function Input2({ label, value, onChange, type = "text", className, disabled, error, ...rest }, ref) {
+  const id = useId();
+  const errorId = `${id}-error`;
+  return /* @__PURE__ */ jsxs9("div", { className, children: [
+    /* @__PURE__ */ jsx21(FormLabel, { htmlFor: id, children: label }),
+    /* @__PURE__ */ jsx21(
+      "input",
+      {
+        ref,
+        id,
+        type,
+        value,
+        onChange: (e) => onChange(e.target.value),
+        disabled,
+        "aria-invalid": error ? true : void 0,
+        "aria-describedby": error ? errorId : void 0,
+        className: cn(
+          "w-full rounded border bg-base px-3 py-2 text-sm text-base-contrast focus:outline-none focus:ring-1",
+          error ? "border-red-600 focus:border-red-600 focus:ring-red-600" : "border-base-200 focus:border-base-contrast focus:ring-base-contrast",
+          disabled && "cursor-not-allowed opacity-50"
+        ),
+        ...rest
+      }
+    ),
+    error && /* @__PURE__ */ jsx21("p", { id: errorId, className: "mt-1 text-xs text-red-600", children: error })
+  ] });
+});
+
+// src/components/brandguide/ColorSwatchSettings.tsx
+import { jsx as jsx22, jsxs as jsxs10 } from "react/jsx-runtime";
+function mergeSpaces(spaces) {
+  return Object.assign({}, ...spaces);
+}
+function ColorSwatchSettings({ color, onChange }) {
+  const [localColor, setLocalColor] = useState8(() => ({
+    ...color,
+    spaces: [mergeSpaces(color.spaces)]
+  }));
+  const space = localColor.spaces[0] || {};
+  const update = (updated) => {
+    setLocalColor(updated);
+    onChange(updated);
+  };
+  const updateSpace = (key, value) => {
+    const newSpace = { ...space, [key]: value || void 0 };
+    update({ ...localColor, spaces: [newSpace] });
+  };
+  return /* @__PURE__ */ jsxs10("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsx22(
+      Input,
+      {
+        label: "Name",
+        value: localColor.name || "",
+        onChange: (name) => update({ ...localColor, name })
+      }
+    ),
+    ["hex", "rgb", "cmyk", "pantone"].map((key) => /* @__PURE__ */ jsx22(
+      Input,
+      {
+        label: key.toUpperCase(),
+        value: space[key] || "",
+        onChange: (value) => updateSpace(key, value)
+      },
+      key
+    ))
+  ] });
+}
+
+// src/components/brandguide/Colors.tsx
+import { jsx as jsx23, jsxs as jsxs11 } from "react/jsx-runtime";
+function getContrastClass(hex) {
+  if (!hex) return "text-white";
+  const h = hex.replace("#", "");
+  if (h.length < 6) return "text-white";
+  const r = parseInt(h.substring(0, 2), 16);
+  const g = parseInt(h.substring(2, 4), 16);
+  const b = parseInt(h.substring(4, 6), 16);
+  const yiq = (r * 299 + g * 587 + b * 114) / 1e3;
+  return yiq >= 128 ? "text-black" : "text-white";
+}
+var createColorItem = () => ({
+  name: "",
+  spaces: [{ hex: "#cccccc" }]
+});
+function buildContent(colors, options) {
+  const { label, columns, collapsing, showLabel } = options;
+  return {
+    type: "colors",
+    content: { colors },
+    ...label || columns || collapsing !== void 0 || showLabel !== void 0 ? { options: { label, columns, collapsing, showLabel } } : {}
+  };
+}
+function Colors({ colors, columns = 3, label, collapsing, showLabel = true, onChange, openModal }) {
+  if (onChange && openModal) {
+    return /* @__PURE__ */ jsx23(
+      ColorsEditable,
+      {
+        colors,
+        columns,
+        label,
+        collapsing,
+        showLabel,
+        onChange,
+        openModal
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx23(ColorsView, { colors, columns, label, collapsing, showLabel });
+}
+function ColorsView({
+  colors,
+  columns,
+  label,
+  collapsing,
+  showLabel
+}) {
+  const [expanded, setExpanded] = useState9(!collapsing);
+  const [copiedIndex, setCopiedIndex] = useState9(null);
+  const handleCopy = (value, colorIndex) => {
+    if (navigator.clipboard?.writeText) {
+      navigator.clipboard.writeText(value);
+    } else {
+      const ta = document.createElement("textarea");
+      ta.value = value;
+      ta.style.position = "fixed";
+      ta.style.opacity = "0";
+      document.body.appendChild(ta);
+      ta.select();
+      document.execCommand("copy");
+      document.body.removeChild(ta);
+    }
+    setCopiedIndex(colorIndex);
+    setTimeout(() => setCopiedIndex(null), 1500);
+  };
+  return /* @__PURE__ */ jsxs11("div", { children: [
+    (showLabel && !!label || collapsing) && /* @__PURE__ */ jsxs11("div", { className: "mb-4 flex items-center gap-2", children: [
+      showLabel && !!label && /* @__PURE__ */ jsx23("span", { className: "text-lg font-bold", children: label }),
+      collapsing && /* @__PURE__ */ jsxs11(
+        "button",
+        {
+          onClick: () => setExpanded(!expanded),
+          className: "cursor-pointer ml-auto flex items-center gap-1.5 text-sm text-base-contrast-light hover:text-base-contrast",
+          children: [
+            /* @__PURE__ */ jsx23("span", { children: expanded ? "Hide Details" : "Show Details" }),
+            expanded ? /* @__PURE__ */ jsx23(EyeOff, { size: 16 }) : /* @__PURE__ */ jsx23(Eye, { size: 16 })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx23("div", { className: "@container", children: /* @__PURE__ */ jsx23("div", { className: cn("grid gap-4", containerGridClass[columns] || containerGridClass[3]), children: colors.map((color, i) => {
+      const hex = color.spaces[0]?.hex;
+      const contrast = getContrastClass(hex);
+      return /* @__PURE__ */ jsxs11("div", { className: "overflow-hidden rounded-md border border-base-200", children: [
+        /* @__PURE__ */ jsxs11("div", { className: cn("relative flex min-h-[80px] items-end p-3", contrast), style: { backgroundColor: hex || "#ccc" }, children: [
+          color.name && /* @__PURE__ */ jsx23("span", { className: "text-sm font-bold", children: color.name }),
+          copiedIndex === i && /* @__PURE__ */ jsx23("span", { className: cn(
+            "absolute top-2 right-2 rounded-full px-2.5 py-0.5 text-xs font-medium",
+            getContrastClass(hex) === "text-black" ? "bg-black/15 text-black" : "bg-white/25 text-white"
+          ), children: "Copied!" })
+        ] }),
+        expanded && /* @__PURE__ */ jsx23("div", { className: "space-y-1 bg-base-accent p-3 text-sm", children: color.spaces.map(
+          (space, j) => Object.entries(space).map(
+            ([key, value]) => value ? /* @__PURE__ */ jsxs11("button", { onClick: () => handleCopy(value, i), className: "cursor-pointer flex w-full justify-between hover:text-primary", children: [
+              /* @__PURE__ */ jsx23("span", { className: "font-medium uppercase", children: key }),
+              /* @__PURE__ */ jsx23("span", { children: value })
+            ] }, `${j}-${key}`) : null
+          )
+        ) })
+      ] }, i);
+    }) }) })
+  ] });
+}
+function ColorsEditable({
+  colors,
+  columns,
+  label,
+  collapsing,
+  showLabel,
+  onChange,
+  openModal
+}) {
+  const [expanded, setExpanded] = useState9(!collapsing);
+  const options = { label, columns, collapsing, showLabel };
+  useEffect7(() => {
+    setExpanded(!collapsing);
+  }, [collapsing]);
+  const handleItemSettings = (index) => {
+    const color = colors[index];
+    openModal(
+      "Color Settings",
+      /* @__PURE__ */ jsx23(ColorSwatchSettings, { color, onChange: (updated) => {
+        const newColors = colors.map((c, i) => i === index ? updated : c);
+        onChange(buildContent(newColors, options));
+      } })
+    );
+  };
+  return /* @__PURE__ */ jsxs11("div", { children: [
+    (showLabel && !!label || collapsing) && /* @__PURE__ */ jsxs11("div", { className: "mb-4 flex items-center gap-2", children: [
+      showLabel && !!label && /* @__PURE__ */ jsx23(
+        EditablePlainText,
+        {
+          tag: "span",
+          value: label,
+          onChange: (newLabel) => onChange(buildContent(colors, { ...options, label: newLabel })),
+          isEditMode: true,
+          className: "text-lg font-bold"
+        }
+      ),
+      collapsing && /* @__PURE__ */ jsxs11(
+        "button",
+        {
+          onClick: () => setExpanded(!expanded),
+          className: "cursor-pointer ml-auto flex items-center gap-1.5 text-sm text-base-contrast-light hover:text-base-contrast",
+          children: [
+            /* @__PURE__ */ jsx23("span", { children: expanded ? "Hide Details" : "Show Details" }),
+            expanded ? /* @__PURE__ */ jsx23(EyeOff, { size: 16 }) : /* @__PURE__ */ jsx23(Eye, { size: 16 })
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx23(
+      EditableGrid,
+      {
+        items: colors,
+        columns,
+        onChange: (newColors) => onChange(buildContent(newColors, options)),
+        createItem: createColorItem,
+        isEditMode: true,
+        onItemSettings: handleItemSettings,
+        renderItem: (color, { index }) => /* @__PURE__ */ jsx23(
+          ColorSwatchEditable,
+          {
+            color,
+            index,
+            colors,
+            options,
+            onChange,
+            expanded
+          }
+        )
+      }
+    )
+  ] });
+}
+function ColorSwatchEditable({
+  color,
+  index,
+  colors,
+  options,
+  onChange,
+  expanded
+}) {
+  const hex = color.spaces[0]?.hex;
+  const contrast = getContrastClass(hex);
+  const updateColor = (updated) => {
+    const newColors = colors.map((c, i) => i === index ? updated : c);
+    onChange(buildContent(newColors, options));
+  };
+  return /* @__PURE__ */ jsxs11("div", { className: "overflow-hidden rounded-md border border-base-200", children: [
+    /* @__PURE__ */ jsx23("div", { className: cn("flex min-h-[80px] items-end p-3", contrast), style: { backgroundColor: hex || "#ccc" }, children: /* @__PURE__ */ jsx23(
+      EditablePlainText,
+      {
+        tag: "span",
+        value: color.name || "",
+        onChange: (name) => updateColor({ ...color, name }),
+        isEditMode: true,
+        placeholder: "Color name",
+        className: "text-sm font-bold"
+      }
+    ) }),
+    expanded && /* @__PURE__ */ jsx23("div", { className: "space-y-1 bg-base-accent p-3 text-sm", children: color.spaces.map(
+      (space, j) => Object.entries(space).map(
+        ([key, value]) => value ? /* @__PURE__ */ jsxs11("div", { className: "flex w-full justify-between", children: [
+          /* @__PURE__ */ jsx23("span", { className: "font-medium uppercase", children: key }),
+          /* @__PURE__ */ jsx23("span", { children: value })
+        ] }, `${j}-${key}`) : null
+      )
+    ) })
+  ] });
+}
+
+// src/components/sections/Colors/index.tsx
+import { jsx as jsx24 } from "react/jsx-runtime";
+var schema7 = z7.object({
+  type: z7.literal("colors"),
+  content: z7.object({ colors: z7.array(ColorItemSchema) }),
+  options: z7.object({
+    label: z7.string().optional(),
+    columns: z7.number().int().min(2).max(4).optional(),
+    collapsing: z7.boolean().optional(),
+    showLabel: z7.boolean().optional()
+  }).optional()
+});
+var Colors_default = defineSection({
+  type: "colors",
+  label: "Colors",
+  icon: /* @__PURE__ */ jsx24(Palette, { size: 18 }),
+  schema: schema7,
+  component: ({ content, options, onChange, openModal }) => /* @__PURE__ */ jsx24(
+    Colors,
+    {
+      colors: content.content.colors,
+      columns: options?.columns,
+      label: options?.label,
+      collapsing: options?.collapsing,
+      showLabel: options?.showLabel,
+      onChange: onChange ? (c) => onChange(c) : void 0,
+      openModal
+    }
+  ),
+  defaults: () => ({
+    type: "colors",
+    content: { colors: [{ spaces: [{ hex: "#000000" }] }] }
+  }),
+  getLabel: (content) => {
+    const n = content.content.colors.length;
+    return `${n} color${n === 1 ? "" : "s"}`;
+  },
+  getThumbnails: (content) => content.content.colors.filter((c) => c.spaces[0]?.hex).map((c) => ({ type: "color", value: c.spaces[0].hex })),
+  settings: {
+    columns: {
+      type: "select",
+      label: "Columns",
+      default: "3",
+      coerce: "number",
+      options: [{ label: "2", value: "2" }, { label: "3", value: "3" }, { label: "4", value: "4" }]
+    },
+    label: { type: "text", label: "Label", default: "", placeholder: "Color Section Label" },
+    showLabel: { type: "checkbox", label: "Show label", default: true },
+    collapsing: { type: "checkbox", label: "Collapsing layout", default: false }
+  }
+});
+
+// src/components/sections/IconList/index.tsx
+import { z as z8 } from "zod";
+import { List } from "lucide-react";
+
+// src/components/sections/IconList/IconList.tsx
+import { useRef as useRef8, useEffect as useEffect9, useState as useState11, useCallback as useCallback6 } from "react";
+import { CopyPlus, Pencil } from "lucide-react";
+
+// src/components/primitives/IconPicker.tsx
+import { useEffect as useEffect8, useRef as useRef7, useState as useState10 } from "react";
+import { Check as Check2, X as X4 } from "lucide-react";
+import { Fragment as Fragment4, jsx as jsx25, jsxs as jsxs12 } from "react/jsx-runtime";
+function IconPicker({
+  selected,
+  onSelect,
+  onClose,
+  showRemove = true,
+  allowDoDont = false,
+  dodont,
+  onSelectDoDont
+}) {
+  const panelRef = useRef7(null);
+  const [mode, setMode] = useState10(dodont ? "dodont" : "none");
+  useEffect8(() => {
+    function handleMouseDown(e) {
+      if (panelRef.current && !panelRef.current.contains(e.target)) {
+        onClose();
+      }
+    }
+    document.addEventListener("mousedown", handleMouseDown);
+    return () => document.removeEventListener("mousedown", handleMouseDown);
+  }, [onClose]);
+  const showDoDont = allowDoDont && mode === "dodont";
+  return /* @__PURE__ */ jsxs12(
+    "div",
+    {
+      ref: panelRef,
+      className: "absolute z-50 w-56 rounded-lg border border-base-200 bg-base p-2 shadow-lg",
+      children: [
+        allowDoDont && /* @__PURE__ */ jsxs12("div", { role: "tablist", "aria-label": "Icon mode", className: "mb-2 flex gap-1 rounded-md bg-base-200 p-0.5", children: [
+          /* @__PURE__ */ jsx25(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-label": "None",
+              "aria-selected": mode === "none",
+              className: cn(
+                "cursor-pointer flex-1 rounded px-2 py-1 text-xs font-medium transition-colors",
+                mode === "none" ? "bg-base text-base-contrast shadow-sm" : "text-base-contrast-light hover:text-base-contrast"
+              ),
+              onClick: () => {
+                setMode("none");
+                onSelectDoDont?.(void 0);
+              },
+              children: "None"
+            }
+          ),
+          /* @__PURE__ */ jsx25(
+            "button",
+            {
+              type: "button",
+              role: "tab",
+              "aria-label": "Do / Don't",
+              "aria-selected": mode === "dodont",
+              className: cn(
+                "cursor-pointer flex-1 rounded px-2 py-1 text-xs font-medium transition-colors",
+                mode === "dodont" ? "bg-base text-base-contrast shadow-sm" : "text-base-contrast-light hover:text-base-contrast"
+              ),
+              onClick: () => setMode("dodont"),
+              children: "Do / Don't"
+            }
+          )
+        ] }),
+        showDoDont ? /* @__PURE__ */ jsxs12("div", { className: "grid grid-cols-2 gap-2", children: [
+          /* @__PURE__ */ jsxs12(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Do",
+              className: cn(
+                "cursor-pointer flex flex-col items-center justify-center gap-1 rounded py-2 transition-colors",
+                "text-green-600 hover:bg-base-accent",
+                dodont === "do" && "ring-2 ring-primary bg-base-accent"
+              ),
+              onClick: () => onSelectDoDont?.("do"),
+              children: [
+                /* @__PURE__ */ jsx25(Check2, { size: 20 }),
+                /* @__PURE__ */ jsx25("span", { className: "text-xs font-medium", children: "Do" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs12(
+            "button",
+            {
+              type: "button",
+              "aria-label": "Don't",
+              className: cn(
+                "cursor-pointer flex flex-col items-center justify-center gap-1 rounded py-2 transition-colors",
+                "text-red-600 hover:bg-base-accent",
+                dodont === "dont" && "ring-2 ring-primary bg-base-accent"
+              ),
+              onClick: () => onSelectDoDont?.("dont"),
+              children: [
+                /* @__PURE__ */ jsx25(X4, { size: 20 }),
+                /* @__PURE__ */ jsx25("span", { className: "text-xs font-medium", children: "Don't" })
+              ]
+            }
+          )
+        ] }) : /* @__PURE__ */ jsxs12(Fragment4, { children: [
+          /* @__PURE__ */ jsx25("div", { className: "grid grid-cols-5 gap-1", children: curatedIcons.map((entry) => {
+            const Icon = entry.icon;
+            const isSelected = selected === entry.id;
+            return /* @__PURE__ */ jsx25(
+              "button",
+              {
+                "aria-label": entry.label,
+                className: cn(
+                  "cursor-pointer flex h-9 w-9 items-center justify-center rounded transition-colors",
+                  "text-base-contrast-light hover:bg-base-accent hover:text-base-contrast",
+                  isSelected && "ring-2 ring-primary bg-base-accent text-primary"
+                ),
+                onClick: () => onSelect(entry.id),
+                children: /* @__PURE__ */ jsx25(Icon, { size: 18 })
+              },
+              entry.id
+            );
+          }) }),
+          showRemove && /* @__PURE__ */ jsx25(
+            "button",
+            {
+              className: "cursor-pointer mt-2 w-full rounded px-2 py-1.5 text-center text-xs text-base-contrast-light hover:bg-base-accent hover:text-base-contrast",
+              onClick: () => onSelect(null),
+              children: "Remove icon"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/sections/IconList/IconList.tsx
+import { jsx as jsx26, jsxs as jsxs13 } from "react/jsx-runtime";
+function IconList({
+  items,
+  icon = null,
+  showLabel = true,
+  stackText = false,
+  labelClassName = "font-bold text-base-contrast",
+  textClassName = "text-base-contrast-light",
+  iconClassName = "text-primary",
+  onChange,
+  onItemsChange
+}) {
+  const isEditMode = !!onChange || !!onItemsChange;
+  const emitItems = useCallback6(
+    (newItems) => {
+      onChange?.({
+        type: "icon_list",
+        content: { items: newItems },
+        options: { icon, showLabel, stackText }
+      });
+      onItemsChange?.(newItems);
+    },
+    [onChange, onItemsChange, icon, showLabel, stackText]
+  );
+  if (!isEditMode) {
+    return /* @__PURE__ */ jsx26(
+      ViewIconList,
+      {
+        items,
+        defaultIcon: icon,
+        showLabel,
+        stackText,
+        labelClassName,
+        textClassName,
+        iconClassName
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx26(
+    EditIconList,
+    {
+      items,
+      defaultIcon: icon,
+      showLabel,
+      stackText,
+      labelClassName,
+      textClassName,
+      iconClassName,
+      onItemsChange: emitItems
+    }
+  );
+}
+function resolveIcon(item, defaultIcon) {
+  if (item.dodont === "do") return getIcon("check") ?? null;
+  if (item.dodont === "dont") return getIcon("x") ?? null;
+  const id = item.icon ?? defaultIcon;
+  return id ? getIcon(id) : null;
+}
+function resolveIconColor(item, iconClassName) {
+  if (item.dodont === "do") return "text-green-600";
+  if (item.dodont === "dont") return "text-red-600";
+  return iconClassName;
+}
+function ViewIconList({
+  items,
+  defaultIcon,
+  showLabel,
+  stackText,
+  labelClassName,
+  textClassName,
+  iconClassName
+}) {
+  const hasAnyIcon = items.some((item) => resolveIcon(item, defaultIcon));
+  return /* @__PURE__ */ jsx26("div", { className: "grid gap-4 pb-4", children: items.map((item, i) => {
+    const iconEntry = resolveIcon(item, defaultIcon);
+    const iconColor = resolveIconColor(item, iconClassName);
+    return /* @__PURE__ */ jsxs13(
+      "div",
+      {
+        className: cn(
+          "grid gap-x-3",
+          hasAnyIcon ? "grid-cols-[24px_1fr]" : "grid-cols-1"
+        ),
+        children: [
+          hasAnyIcon && /* @__PURE__ */ jsx26(
+            "div",
+            {
+              "data-testid": "icon-list-icon",
+              className: cn("flex items-start pt-0.5", iconColor),
+              children: iconEntry && /* @__PURE__ */ jsx26(iconEntry.icon, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ jsxs13(
+            "div",
+            {
+              "data-testid": "icon-list-content",
+              className: stackText ? "flex flex-col" : void 0,
+              children: [
+                showLabel && /* @__PURE__ */ jsxs13("span", { className: labelClassName, children: [
+                  item.label,
+                  !stackText && " "
+                ] }),
+                /* @__PURE__ */ jsx26("span", { className: textClassName, children: item.text })
+              ]
+            }
+          )
+        ]
+      },
+      i
+    );
+  }) });
+}
+function EditIconList({
+  items,
+  defaultIcon,
+  showLabel,
+  stackText,
+  labelClassName,
+  textClassName,
+  iconClassName,
+  onItemsChange
+}) {
+  const { wrappedItems, onReorder, onAdd, onRemove } = useEditableCollection({
+    items,
+    onChange: onItemsChange,
+    createItem: () => ({ label: "", text: "" })
+  });
+  const [dragState, setDragState] = useState11({ sourceId: null, targetId: null });
+  const updateItem = useCallback6(
+    (index, patch) => {
+      const updated = wrappedItems.map(
+        (w, i) => i === index ? { ...w.data, ...patch } : w.data
+      );
+      onItemsChange(updated);
+    },
+    [wrappedItems, onItemsChange]
+  );
+  const duplicateItem = useCallback6(
+    (index) => {
+      const copy = { ...wrappedItems[index].data };
+      const next = [
+        ...wrappedItems.slice(0, index + 1).map((w) => w.data),
+        copy,
+        ...wrappedItems.slice(index + 1).map((w) => w.data)
+      ];
+      onItemsChange(next);
+    },
+    [wrappedItems, onItemsChange]
+  );
+  const hasAnyIcon = true;
+  return /* @__PURE__ */ jsxs13("div", { className: "group/list relative grid gap-4 pb-4", children: [
+    wrappedItems.map((wrapped, index) => /* @__PURE__ */ jsx26(
+      EditableRow,
+      {
+        id: wrapped.id,
+        index,
+        item: wrapped.data,
+        defaultIcon,
+        hasAnyIcon,
+        showLabel,
+        stackText,
+        labelClassName,
+        textClassName,
+        iconClassName,
+        dragState,
+        setDragState,
+        onReorder,
+        onRemove,
+        onUpdateItem: (patch) => updateItem(index, patch),
+        onDuplicate: () => duplicateItem(index)
+      },
+      wrapped.id
+    )),
+    /* @__PURE__ */ jsx26(
+      TrailingDropZone,
+      {
+        index: wrappedItems.length,
+        dragState,
+        setDragState,
+        onReorder
+      }
+    ),
+    /* @__PURE__ */ jsx26(
+      IconButton,
+      {
+        icon: /* @__PURE__ */ jsx26(AddIcon, { size: 16 }),
+        label: "Add item",
+        size: "lg",
+        intent: "primary",
+        onClick: onAdd,
+        className: "absolute -bottom-6 left-1/2 z-20 -translate-x-1/2 rounded-full border border-base-200 bg-base opacity-0 transition-opacity group-hover/list:opacity-100"
+      }
+    )
+  ] });
+}
+function EditableRow({
+  id,
+  index,
+  item,
+  defaultIcon,
+  hasAnyIcon,
+  showLabel,
+  stackText,
+  labelClassName,
+  textClassName,
+  iconClassName,
+  dragState,
+  setDragState,
+  onReorder,
+  onRemove,
+  onUpdateItem,
+  onDuplicate
+}) {
+  const rowRef = useRef8(null);
+  const handleRef = useRef8(null);
+  const [iconHover, setIconHover] = useState11(false);
+  const [pickerOpen, setPickerOpen] = useState11(false);
+  const [editingSuppressed, setEditingSuppressed] = useState11(false);
+  const iconEntry = resolveIcon(item, defaultIcon);
+  const effectiveIconId = item.icon ?? defaultIcon ?? null;
+  const iconColor = resolveIconColor(item, iconClassName);
+  useEffect9(() => {
+    const row = rowRef.current;
+    const handle = handleRef.current;
+    if (!row || !handle) return;
+    let cleanup;
+    let cancelled = false;
+    import("../../adapter-HH47ZPGM.js").then(({ draggable, dropTargetForElements }) => {
+      if (cancelled) return;
+      const cleanupDraggable = draggable({
+        element: handle,
+        getInitialData: () => ({ dragType: "icon-list-row", id, index }),
+        onDragStart: () => setDragState({ sourceId: id, targetId: null }),
+        onDrop: () => setDragState({ sourceId: null, targetId: null })
+      });
+      const cleanupDropTarget = dropTargetForElements({
+        element: row,
+        canDrop: ({ source }) => source.data.dragType === "icon-list-row",
+        getData: () => ({ id, index }),
+        onDragEnter: () => setDragState((prev) => ({ ...prev, targetId: id })),
+        onDragLeave: () => setDragState(
+          (prev) => prev.targetId === id ? { ...prev, targetId: null } : prev
+        ),
+        onDrop: ({ source }) => {
+          const fromIndex = source.data.index;
+          if (fromIndex !== index) onReorder(fromIndex, index);
+        }
+      });
+      cleanup = () => {
+        cleanupDraggable();
+        cleanupDropTarget();
+      };
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, [id, index, onReorder, setDragState]);
+  const isDropTarget = dragState.targetId === id && dragState.sourceId !== id;
+  const onEditableActivity = (e) => {
+    const t = e.target;
+    if (t.matches?.("input, textarea, [contenteditable], [contenteditable='true']")) {
+      setEditingSuppressed(true);
+    }
+  };
+  return /* @__PURE__ */ jsxs13(
+    "div",
+    {
+      ref: rowRef,
+      className: cn(
+        "group/row relative grid gap-x-3",
+        hasAnyIcon ? "grid-cols-[24px_1fr]" : "grid-cols-1",
+        isDropTarget && "border-t-2 border-primary"
+      ),
+      onFocusCapture: onEditableActivity,
+      onInput: onEditableActivity,
+      onMouseMove: () => setEditingSuppressed(false),
+      children: [
+        hasAnyIcon && /* @__PURE__ */ jsxs13(
+          "div",
+          {
+            "data-testid": "icon-list-icon",
+            className: cn("relative flex items-start pt-0.5", iconColor),
+            onMouseEnter: () => setIconHover(true),
+            onMouseLeave: () => setIconHover(false),
+            children: [
+              /* @__PURE__ */ jsx26(
+                "button",
+                {
+                  className: "cursor-pointer transition-opacity hover:opacity-70",
+                  "aria-label": "Change icon",
+                  onClick: () => setPickerOpen((prev) => !prev),
+                  children: iconHover && !pickerOpen ? /* @__PURE__ */ jsx26(Pencil, { size: 18, className: "text-base-contrast-light" }) : iconEntry ? /* @__PURE__ */ jsx26(iconEntry.icon, { size: 18 }) : /* @__PURE__ */ jsx26("span", { className: "flex h-[18px] w-[18px] items-center justify-center rounded-sm border border-dashed border-base-contrast-light/40" })
+                }
+              ),
+              pickerOpen && /* @__PURE__ */ jsx26("div", { className: "absolute top-full left-0 z-50 mt-1", children: /* @__PURE__ */ jsx26(
+                IconPicker,
+                {
+                  selected: effectiveIconId,
+                  showRemove: true,
+                  allowDoDont: true,
+                  dodont: item.dodont,
+                  onSelect: (newIcon) => {
+                    onUpdateItem({ icon: newIcon ?? void 0, dodont: void 0 });
+                    setPickerOpen(false);
+                    setIconHover(false);
+                  },
+                  onSelectDoDont: (v) => {
+                    onUpdateItem({ dodont: v });
+                    if (v !== void 0) {
+                      setPickerOpen(false);
+                      setIconHover(false);
+                    }
+                  },
+                  onClose: () => {
+                    setPickerOpen(false);
+                    setIconHover(false);
+                  }
+                }
+              ) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs13("div", { className: stackText ? "flex flex-col" : void 0, children: [
+          showLabel && /* @__PURE__ */ jsx26(
+            EditablePlainText,
+            {
+              tag: "span",
+              value: item.label,
+              onChange: (label) => onUpdateItem({ label }),
+              isEditMode: true,
+              placeholder: "Label",
+              className: cn(labelClassName, !stackText && "mr-1")
+            }
+          ),
+          /* @__PURE__ */ jsx26(
+            EditablePlainText,
+            {
+              tag: "span",
+              value: item.text,
+              onChange: (text) => onUpdateItem({ text }),
+              isEditMode: true,
+              placeholder: "Text",
+              className: textClassName
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs13(
+          "div",
+          {
+            className: cn(
+              "absolute right-1 top-1 z-10 flex items-center gap-1",
+              editingSuppressed ? "opacity-0 pointer-events-none" : "opacity-0 group-hover/row:opacity-100 no-hover:opacity-100"
+            ),
+            children: [
+              /* @__PURE__ */ jsx26(
+                IconButton,
+                {
+                  ref: handleRef,
+                  icon: /* @__PURE__ */ jsx26(DragHandle, { size: 14 }),
+                  label: "Drag to reorder",
+                  size: "sm",
+                  className: "cursor-grab rounded bg-base/80 p-1 shadow-sm text-base-contrast-light/80 hover:text-base-contrast active:cursor-grabbing",
+                  tabIndex: -1
+                }
+              ),
+              /* @__PURE__ */ jsx26(
+                "button",
+                {
+                  "aria-label": "Duplicate item",
+                  onClick: onDuplicate,
+                  className: "cursor-pointer rounded bg-base/80 p-1 shadow-sm text-base-contrast-light hover:text-primary",
+                  children: /* @__PURE__ */ jsx26(CopyPlus, { size: 14 })
+                }
+              ),
+              /* @__PURE__ */ jsx26(
+                IconButton,
+                {
+                  icon: /* @__PURE__ */ jsx26(DeleteIcon, { size: 14 }),
+                  label: "Delete item",
+                  size: "sm",
+                  intent: "destructive",
+                  onClick: () => onRemove(id),
+                  className: "bg-base/80 shadow-sm"
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function TrailingDropZone({
+  index,
+  dragState,
+  setDragState,
+  onReorder
+}) {
+  const ref = useRef8(null);
+  const trailingId = "__trailing__";
+  useEffect9(() => {
+    const el = ref.current;
+    if (!el) return;
+    let cleanup;
+    let cancelled = false;
+    import("../../adapter-HH47ZPGM.js").then(({ dropTargetForElements }) => {
+      if (cancelled) return;
+      cleanup = dropTargetForElements({
+        element: el,
+        canDrop: ({ source }) => source.data.dragType === "icon-list-row",
+        getData: () => ({ id: trailingId, index }),
+        onDragEnter: () => setDragState((prev) => ({ ...prev, targetId: trailingId })),
+        onDragLeave: () => setDragState(
+          (prev) => prev.targetId === trailingId ? { ...prev, targetId: null } : prev
+        ),
+        onDrop: ({ source }) => {
+          const fromIndex = source.data.index;
+          if (fromIndex !== index - 1) onReorder(fromIndex, index - 1);
+        }
+      });
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, [index, onReorder, setDragState]);
+  const isDropTarget = dragState.targetId === trailingId && dragState.sourceId !== null;
+  return /* @__PURE__ */ jsx26(
+    "div",
+    {
+      ref,
+      className: cn("absolute bottom-0 left-0 right-0 h-4", isDropTarget && "border-t-2 border-primary")
+    }
+  );
+}
+
+// src/components/sections/IconList/IconListSettings.tsx
+import { useState as useState12 } from "react";
+
+// src/components/shared/Checkbox.tsx
+import { useId as useId2 } from "react";
+import { Check as Check3 } from "lucide-react";
+import { jsx as jsx27, jsxs as jsxs14 } from "react/jsx-runtime";
+function Checkbox({
+  checked,
+  onChange,
+  label,
+  description,
+  disabled,
+  className,
+  startAdornment,
+  align = "start"
+}) {
+  const id = useId2();
+  return /* @__PURE__ */ jsxs14(
+    "label",
+    {
+      htmlFor: id,
+      className: cn(
+        "flex cursor-pointer gap-3 select-none hover:opacity-80",
+        align === "start" ? "items-start" : "items-center",
+        disabled && "cursor-not-allowed opacity-50",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs14(
+          "span",
+          {
+            className: cn(
+              "relative flex h-5 w-5 shrink-0 items-center justify-center",
+              align === "start" && "mt-0.5"
+            ),
+            children: [
+              /* @__PURE__ */ jsx27(
+                "input",
+                {
+                  id,
+                  type: "checkbox",
+                  checked,
+                  disabled,
+                  onChange: (e) => onChange(e.target.checked),
+                  className: "sr-only"
+                }
+              ),
+              /* @__PURE__ */ jsx27(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: cn(
+                    "flex h-5 w-5 items-center justify-center rounded border transition-colors",
+                    checked ? "border-primary bg-primary text-primary-contrast" : "border-base-300 bg-base hover:border-primary",
+                    disabled && "pointer-events-none"
+                  ),
+                  children: checked && /* @__PURE__ */ jsx27(Check3, { size: 14, strokeWidth: 3 })
+                }
+              )
+            ]
+          }
+        ),
+        startAdornment,
+        /* @__PURE__ */ jsxs14("div", { className: "text-sm", children: [
+          /* @__PURE__ */ jsx27("span", { className: "font-medium text-base-contrast", children: label }),
+          description && /* @__PURE__ */ jsx27("span", { className: "block text-base-contrast-light", children: description })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/sections/IconList/IconListSettings.tsx
+import { jsx as jsx28, jsxs as jsxs15 } from "react/jsx-runtime";
+function IconListSettings({
+  icon: initialIcon,
+  showLabel: initialShowLabel,
+  stackText: initialStackText,
+  onChange
+}) {
+  const [icon, setIcon] = useState12(initialIcon);
+  const [showLabel, setShowLabel] = useState12(initialShowLabel);
+  const [stackText, setStackText] = useState12(initialStackText);
+  const [pickerOpen, setPickerOpen] = useState12(false);
+  const emit = (overrides) => onChange({ content: {}, options: { icon, showLabel, stackText, ...overrides } });
+  const showIcons = icon !== null;
+  const iconEntry = icon ? getIcon(icon) : null;
+  return /* @__PURE__ */ jsxs15("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs15("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx28(FormLabel, { htmlFor: "icon-picker-btn", children: "Default Icon" }),
+      /* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs15(
+          "button",
+          {
+            id: "icon-picker-btn",
+            className: "cursor-pointer flex items-center gap-2 rounded border border-base-200 px-3 py-1.5 text-sm text-base-contrast-light hover:border-primary hover:text-primary",
+            onClick: () => setPickerOpen((prev) => !prev),
+            children: [
+              iconEntry && /* @__PURE__ */ jsx28(iconEntry.icon, { size: 16 }),
+              /* @__PURE__ */ jsx28("span", { children: iconEntry?.label ?? "None" })
+            ]
+          }
+        ),
+        icon && /* @__PURE__ */ jsx28(
+          "button",
+          {
+            className: "cursor-pointer text-xs text-base-contrast-light hover:text-base-contrast",
+            onClick: () => {
+              setIcon(null);
+              emit({ icon: null });
+            },
+            children: "Clear"
+          }
+        )
+      ] }),
+      pickerOpen && /* @__PURE__ */ jsx28("div", { className: "absolute top-full left-0 z-50 mt-1", children: /* @__PURE__ */ jsx28(
+        IconPicker,
+        {
+          selected: icon,
+          onSelect: (newIcon) => {
+            if (newIcon !== null) {
+              setIcon(newIcon);
+              emit({ icon: newIcon });
+            }
+            setPickerOpen(false);
+          },
+          onClose: () => setPickerOpen(false)
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsx28(
+      Checkbox,
+      {
+        checked: showLabel,
+        onChange: (v) => {
+          setShowLabel(v);
+          emit({ showLabel: v });
+        },
+        label: "Show labels"
+      }
+    ),
+    showLabel && /* @__PURE__ */ jsx28(
+      Checkbox,
+      {
+        checked: stackText,
+        onChange: (v) => {
+          setStackText(v);
+          emit({ stackText: v });
+        },
+        label: "Stack label above text"
+      }
+    )
+  ] });
+}
+
+// src/components/sections/IconList/index.tsx
+import { jsx as jsx29 } from "react/jsx-runtime";
+var schema8 = z8.object({
+  type: z8.literal("icon_list"),
+  content: z8.object({
+    items: z8.array(z8.object({ label: z8.string(), text: z8.string(), icon: z8.string().optional(), dodont: z8.enum(["do", "dont"]).optional() }))
+  }),
+  options: z8.object({
+    icon: z8.string().nullable().optional(),
+    showLabel: z8.boolean().optional(),
+    stackText: z8.boolean().optional()
+  }).optional()
+});
+var IconList_default = defineSection({
+  type: "icon_list",
+  label: "Icon List",
+  icon: /* @__PURE__ */ jsx29(List, { size: 18 }),
+  schema: schema8,
+  component: ({ content, options, onChange }) => /* @__PURE__ */ jsx29(
+    IconList,
+    {
+      items: content.content.items,
+      icon: options?.icon,
+      showLabel: options?.showLabel,
+      stackText: options?.stackText,
+      onChange: onChange ? (c) => onChange(c) : void 0
+    }
+  ),
+  defaults: () => ({
+    type: "icon_list",
+    content: { items: [{ label: "", text: "" }] }
+  }),
+  getLabel: (content) => {
+    const n = content.content.items.length;
+    return `${n} icon${n === 1 ? "" : "s"}`;
+  },
+  settingsForm: IconListSettings
+});
+
+// src/components/sections/Container/index.tsx
+import { z as z9 } from "zod";
+import { LayoutTemplate } from "lucide-react";
+
+// src/components/sections/Container/Container.tsx
+import "react";
+
+// src/components/editor/ChildBlockWrapper.tsx
+import { forwardRef as forwardRef6 } from "react";
+import { CopyPlus as CopyPlus2 } from "lucide-react";
+
+// src/components/editor/DragHandle.tsx
+import { forwardRef as forwardRef4 } from "react";
+
+// src/components/shared/Tooltip.tsx
+import { jsx as jsx30, jsxs as jsxs16 } from "react/jsx-runtime";
+function Tooltip({ content, children, className }) {
+  return /* @__PURE__ */ jsxs16("div", { className: cn("group/tooltip relative inline-flex", className), children: [
+    children,
+    /* @__PURE__ */ jsx30(
+      "span",
+      {
+        className: "pointer-events-none absolute left-1/2 top-full z-50 mt-1.5 -translate-x-1/2 opacity-0 transition-opacity delay-300 group-hover/tooltip:opacity-100",
+        role: "tooltip",
+        children: /* @__PURE__ */ jsx30("span", { className: "block whitespace-nowrap rounded bg-tooltip px-2 py-1 text-center text-xs leading-relaxed text-tooltip-muted", children: content })
+      }
+    )
+  ] });
+}
+function Kbd({ children }) {
+  return /* @__PURE__ */ jsx30("strong", { className: "text-tooltip-contrast", children });
+}
+
+// src/components/editor/DragHandle.tsx
+import { Fragment as Fragment5, jsx as jsx31, jsxs as jsxs17 } from "react/jsx-runtime";
+var DragHandle2 = forwardRef4(function DragHandle3(_, ref) {
+  return /* @__PURE__ */ jsx31(Tooltip, { content: /* @__PURE__ */ jsxs17(Fragment5, { children: [
+    /* @__PURE__ */ jsx31(Kbd, { children: "Drag" }),
+    " to move"
+  ] }), children: /* @__PURE__ */ jsx31(
+    IconButton,
+    {
+      ref,
+      icon: /* @__PURE__ */ jsx31(DragHandle, { size: 18 }),
+      label: "Drag to reorder section",
+      className: "pointer-events-auto cursor-grab active:cursor-grabbing rounded-md text-base-contrast-light/80 hover:bg-base-contrast-light/10 hover:text-base-contrast",
+      tabIndex: -1
+    }
+  ) });
+});
+
+// src/components/editor/DeleteButton.tsx
+import { jsx as jsx32 } from "react/jsx-runtime";
+function DeleteButton({ onDelete }) {
+  return /* @__PURE__ */ jsx32(
+    IconButton,
+    {
+      icon: /* @__PURE__ */ jsx32(DeleteIcon, { size: 16 }),
+      label: "Delete section",
+      intent: "destructive",
+      onClick: onDelete,
+      className: "pointer-events-auto"
+    }
+  );
+}
+
+// src/components/editor/SettingsButton.tsx
+import { jsx as jsx33 } from "react/jsx-runtime";
+function SettingsButton({ onClick }) {
+  return /* @__PURE__ */ jsx33(
+    IconButton,
+    {
+      icon: /* @__PURE__ */ jsx33(SettingsIcon, { size: 16 }),
+      label: "Section settings",
+      onClick,
+      className: "pointer-events-auto"
+    }
+  );
+}
+
+// src/components/editor/ColSpanControl.tsx
+import { useRef as useRef10, useState as useState14 } from "react";
+import { Columns3 } from "lucide-react";
+
+// src/components/shared/Popover.tsx
+import { useEffect as useEffect11, useLayoutEffect, useRef as useRef9, useState as useState13 } from "react";
+
+// src/hooks/useFocusTrap.ts
+import { useEffect as useEffect10 } from "react";
+var FOCUSABLE_SELECTOR = [
+  "a[href]",
+  "button:not([disabled])",
+  "input:not([disabled])",
+  "select:not([disabled])",
+  "textarea:not([disabled])",
+  '[tabindex]:not([tabindex="-1"])'
+].join(", ");
+function useFocusTrap(ref, active) {
+  useEffect10(() => {
+    if (!active || !ref.current) return;
+    const container = ref.current;
+    const previouslyFocused = document.activeElement;
+    const getFocusable = () => Array.from(container.querySelectorAll(FOCUSABLE_SELECTOR));
+    const focusable = getFocusable();
+    if (focusable.length > 0) {
+      focusable[0].focus();
+    }
+    const handleKeyDown = (e) => {
+      if (e.key !== "Tab") return;
+      const elements = getFocusable();
+      if (elements.length === 0) return;
+      const first = elements[0];
+      const last = elements[elements.length - 1];
+      if (e.shiftKey) {
+        if (document.activeElement === first) {
+          e.preventDefault();
+          last.focus();
+        }
+      } else {
+        if (document.activeElement === last) {
+          e.preventDefault();
+          first.focus();
+        }
+      }
+    };
+    container.addEventListener("keydown", handleKeyDown);
+    return () => {
+      container.removeEventListener("keydown", handleKeyDown);
+      if (previouslyFocused && document.body.contains(previouslyFocused)) {
+        previouslyFocused.focus();
+      }
+    };
+  }, [active, ref]);
+}
+
+// src/components/shared/Popover.tsx
+import { jsx as jsx34 } from "react/jsx-runtime";
+function Popover({
+  isOpen,
+  onClose,
+  anchorRef,
+  children,
+  align = "auto",
+  className
+}) {
+  const panelRef = useRef9(null);
+  const [resolvedAlign, setResolvedAlign] = useState13("start");
+  useFocusTrap(panelRef, isOpen);
+  useLayoutEffect(() => {
+    if (!isOpen || align !== "auto") {
+      if (!isOpen) setResolvedAlign("start");
+      return;
+    }
+    const panel = panelRef.current;
+    if (!panel) return;
+    panel.style.left = "0";
+    panel.style.right = "auto";
+    const rect = panel.getBoundingClientRect();
+    if (rect.right > window.innerWidth) {
+      setResolvedAlign("end");
+    } else {
+      setResolvedAlign("start");
+    }
+    panel.style.left = "";
+    panel.style.right = "";
+  }, [isOpen, align]);
+  useEffect11(() => {
+    if (!isOpen) return;
+    function onKeyDown(e) {
+      if (e.key === "Escape") onClose();
+    }
+    function onMouseDown(e) {
+      const target = e.target;
+      if (panelRef.current?.contains(target)) return;
+      if (anchorRef.current?.contains(target)) return;
+      onClose();
+    }
+    document.addEventListener("keydown", onKeyDown);
+    document.addEventListener("mousedown", onMouseDown);
+    return () => {
+      document.removeEventListener("keydown", onKeyDown);
+      document.removeEventListener("mousedown", onMouseDown);
+    };
+  }, [isOpen, onClose, anchorRef]);
+  if (!isOpen) return null;
+  const effectiveAlign = align === "auto" ? resolvedAlign : align;
+  return /* @__PURE__ */ jsx34(
+    "div",
+    {
+      ref: panelRef,
+      role: "dialog",
+      "aria-modal": "false",
+      className: cn(
+        "absolute top-full z-50 mt-1 rounded-md border border-base-200 bg-base shadow-lg",
+        effectiveAlign === "end" ? "right-0" : "left-0",
+        className
+      ),
+      children
+    }
+  );
+}
+
+// src/components/shared/PopoverItem.tsx
+import { forwardRef as forwardRef5 } from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
+var PopoverItem = forwardRef5(
+  function PopoverItem2({ className, children, ...rest }, ref) {
+    return /* @__PURE__ */ jsx35(
+      "button",
+      {
+        ref,
+        type: "button",
+        className: cn(
+          "flex w-full cursor-pointer items-center gap-3 px-3 py-1.5 text-left text-xs hover:bg-base-accent",
+          className
+        ),
+        ...rest,
+        children
+      }
+    );
+  }
+);
+
+// src/components/editor/ColSpanControl.tsx
+import { jsx as jsx36, jsxs as jsxs18 } from "react/jsx-runtime";
+function ColSpanControl({ colSpan, columns, onChange }) {
+  const buttonRef = useRef10(null);
+  const [open, setOpen] = useState14(false);
+  if (columns <= 1) return null;
+  const current = Math.min(Math.max(colSpan, 1), columns);
+  return /* @__PURE__ */ jsxs18("div", { className: "relative", children: [
+    /* @__PURE__ */ jsx36(
+      "button",
+      {
+        ref: buttonRef,
+        type: "button",
+        "aria-label": "Column span",
+        "aria-haspopup": "true",
+        "aria-expanded": open,
+        onClick: () => setOpen((v) => !v),
+        className: "pointer-events-auto inline-flex cursor-pointer items-center gap-1 rounded p-1 text-xs text-base-contrast-light hover:text-primary",
+        children: /* @__PURE__ */ jsx36(Columns3, { size: 14 })
+      }
+    ),
+    /* @__PURE__ */ jsx36(Popover, { isOpen: open, onClose: () => setOpen(false), anchorRef: buttonRef, className: "min-w-28", children: /* @__PURE__ */ jsx36("ul", { role: "list", className: "py-1", children: Array.from({ length: columns }, (_, i) => i + 1).map((span) => /* @__PURE__ */ jsx36("li", { children: /* @__PURE__ */ jsxs18(
+      PopoverItem,
+      {
+        "aria-current": span === current,
+        onClick: () => {
+          onChange(span);
+          setOpen(false);
+        },
+        className: cn(span === current && "font-semibold text-primary"),
+        children: [
+          "Span ",
+          span
+        ]
+      }
+    ) }, span)) }) })
+  ] });
+}
+
+// src/components/editor/ChildBlockWrapper.tsx
+import { jsx as jsx37, jsxs as jsxs19 } from "react/jsx-runtime";
+var ChildBlockWrapper = forwardRef6(
+  function ChildBlockWrapper2({
+    label,
+    columns,
+    colSpan,
+    closestEdge,
+    isDragging,
+    hasSettings,
+    dragHandleRef,
+    onDelete,
+    onDuplicate,
+    onColSpanChange,
+    onOpenSettings,
+    children
+  }, ref) {
+    return /* @__PURE__ */ jsxs19(
+      "div",
+      {
+        ref,
+        className: cn(
+          "group/childblock relative h-full rounded-sm",
+          isDragging && "opacity-50",
+          "hover:outline hover:outline-2 hover:outline-primary/30"
+        ),
+        children: [
+          /* @__PURE__ */ jsxs19("div", { className: "absolute top-0 left-0 -translate-x-full z-20 flex flex-col items-center gap-1 opacity-0 transition-opacity group-hover/childblock:opacity-100 group-focus-within/childblock:opacity-100 pointer-events-none", children: [
+            /* @__PURE__ */ jsx37("span", { className: "sr-only", children: label }),
+            /* @__PURE__ */ jsx37("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx37(DragHandle2, { ref: dragHandleRef }) }),
+            /* @__PURE__ */ jsx37("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx37(ColSpanControl, { colSpan, columns, onChange: onColSpanChange }) }),
+            hasSettings && onOpenSettings && /* @__PURE__ */ jsx37("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx37(SettingsButton, { onClick: onOpenSettings }) }),
+            /* @__PURE__ */ jsx37("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx37(
+              "button",
+              {
+                type: "button",
+                "aria-label": "Duplicate block",
+                onClick: onDuplicate,
+                className: "cursor-pointer rounded p-1 text-base-contrast-light hover:text-primary",
+                children: /* @__PURE__ */ jsx37(CopyPlus2, { size: 16 })
+              }
+            ) }),
+            /* @__PURE__ */ jsx37("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx37(DeleteButton, { onDelete }) })
+          ] }),
+          closestEdge === "left" && /* @__PURE__ */ jsx37(
+            "div",
+            {
+              "data-drop-edge": "left",
+              className: "absolute bottom-0 left-0 top-0 z-10 w-0.5 -translate-x-1 bg-primary"
+            }
+          ),
+          closestEdge === "right" && /* @__PURE__ */ jsx37(
+            "div",
+            {
+              "data-drop-edge": "right",
+              className: "absolute bottom-0 right-0 top-0 z-10 w-0.5 translate-x-1 bg-primary"
+            }
+          ),
+          closestEdge === "top" && /* @__PURE__ */ jsx37("div", { "data-drop-edge": "top", className: "absolute left-0 right-0 top-0 z-10 h-0.5 -translate-y-1 bg-primary" }),
+          closestEdge === "bottom" && /* @__PURE__ */ jsx37("div", { "data-drop-edge": "bottom", className: "absolute left-0 right-0 bottom-0 z-10 h-0.5 translate-y-1 bg-primary" }),
+          children
+        ]
+      }
+    );
+  }
+);
+
+// src/components/editor/SettingsForm.tsx
+import { useId as useId4, useState as useState16 } from "react";
+
+// src/components/shared/Select.tsx
+import { useId as useId3 } from "react";
+import { ChevronDown } from "lucide-react";
+import { jsx as jsx38, jsxs as jsxs20 } from "react/jsx-runtime";
+function Select({
+  label,
+  value,
+  onChange,
+  options,
+  disabled,
+  className,
+  selectClassName
+}) {
+  const id = useId3();
+  return /* @__PURE__ */ jsxs20("div", { className, children: [
+    label && /* @__PURE__ */ jsx38(FormLabel, { htmlFor: id, children: label }),
+    /* @__PURE__ */ jsxs20("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx38(
+        "select",
+        {
+          id,
+          value,
+          onChange: (e) => onChange(e.target.value),
+          disabled,
+          className: cn(
+            "w-full appearance-none rounded border border-base-200 bg-base py-2 pr-8 pl-3 text-sm text-base-contrast",
+            "focus:border-base-contrast focus:outline-none focus:ring-1 focus:ring-base-contrast",
+            disabled && "cursor-not-allowed opacity-50",
+            selectClassName
+          ),
+          children: options.map((opt) => /* @__PURE__ */ jsx38("option", { value: opt.value, children: opt.label }, opt.value))
+        }
+      ),
+      /* @__PURE__ */ jsx38(
+        ChevronDown,
+        {
+          size: 14,
+          className: "pointer-events-none absolute right-2.5 top-1/2 -translate-y-1/2 text-base-contrast-light"
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/components/shared/LinkField.tsx
+import { Fragment as Fragment6, jsx as jsx39, jsxs as jsxs21 } from "react/jsx-runtime";
+var TARGET_OPTIONS = [
+  { label: "Same tab (_self)", value: "_self" },
+  { label: "New tab (_blank)", value: "_blank" }
+];
+function LinkField({ label, value, onChange }) {
+  const { pages, getPageHeadings } = usePages();
+  const isInternal = value.kind === "internal";
+  function setMode(kind) {
+    if (kind === value.kind) return;
+    onChange(kind === "external" ? { kind: "external", href: "", target: value.target } : { kind: "internal", pageId: "", anchorSectionId: null, target: "_self" });
+  }
+  const pageId = isInternal ? value.pageId : "";
+  const headings = pageId ? getPageHeadings(pageId) : [];
+  return /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-3", children: [
+    /* @__PURE__ */ jsx39(FormLabel, { children: label }),
+    /* @__PURE__ */ jsx39("div", { className: "flex gap-2", role: "tablist", children: ["external", "internal"].map((kind) => /* @__PURE__ */ jsx39(
+      "button",
+      {
+        type: "button",
+        role: "tab",
+        "aria-selected": value.kind === kind,
+        onClick: () => setMode(kind),
+        className: cn(
+          "cursor-pointer rounded border px-3 py-1 text-sm capitalize",
+          value.kind === kind ? "border-primary bg-primary text-primary-contrast" : "border-base-200 text-base-contrast"
+        ),
+        children: kind === "external" ? "External URL" : "Internal page"
+      },
+      kind
+    )) }),
+    value.kind === "external" ? /* @__PURE__ */ jsx39(
+      Input,
+      {
+        label: "URL",
+        value: value.href,
+        placeholder: "https://...",
+        onChange: (href) => onChange({ kind: "external", href, target: value.target })
+      }
+    ) : /* @__PURE__ */ jsxs21(Fragment6, { children: [
+      /* @__PURE__ */ jsx39(
+        Select,
+        {
+          label: "Page",
+          value: value.pageId,
+          options: [{ label: "Select a page\u2026", value: "" }, ...pages.map((p) => ({ label: p.title, value: p.id }))],
+          onChange: (pid) => onChange({ kind: "internal", pageId: pid, anchorSectionId: null, target: value.target })
+        }
+      ),
+      /* @__PURE__ */ jsx39(
+        Select,
+        {
+          label: "Section",
+          value: value.anchorSectionId ?? "",
+          disabled: !pageId,
+          options: [{ label: "None (top of page)", value: "" }, ...headings.map((h) => ({ label: h.label, value: h.id }))],
+          onChange: (anchor) => onChange({ kind: "internal", pageId, anchorSectionId: anchor || null, target: value.target })
+        }
+      )
+    ] }),
+    value.kind === "external" && /* @__PURE__ */ jsx39(
+      Select,
+      {
+        label: "Opens in",
+        value: value.target,
+        options: TARGET_OPTIONS,
+        onChange: (t) => onChange({ ...value, target: t })
+      }
+    )
+  ] });
+}
+
+// src/components/shared/Tabs.tsx
+import { useState as useState15 } from "react";
+import { jsx as jsx40, jsxs as jsxs22 } from "react/jsx-runtime";
+function Tabs({ tabs, defaultTabId, activeTabId, onTabChange, fullBleedTabBar }) {
+  const [uncontrolledId, setUncontrolledId] = useState15(defaultTabId ?? tabs[0]?.id);
+  const isControlled = activeTabId !== void 0;
+  const activeId = isControlled ? activeTabId : uncontrolledId;
+  const activeTab = tabs.find((t) => t.id === activeId) ?? tabs[0];
+  function handleSelect(id) {
+    if (!isControlled) setUncontrolledId(id);
+    onTabChange?.(id);
+  }
+  return /* @__PURE__ */ jsxs22("div", { className: "flex flex-1 flex-col overflow-hidden", children: [
+    /* @__PURE__ */ jsx40("div", { className: cn("border-b border-base-200", fullBleedTabBar && "-mx-6 px-6"), children: /* @__PURE__ */ jsx40("div", { className: "flex", role: "tablist", children: tabs.map((tab) => /* @__PURE__ */ jsx40(
+      "button",
+      {
+        type: "button",
+        role: "tab",
+        "aria-selected": activeTab?.id === tab.id,
+        onClick: () => handleSelect(tab.id),
+        className: cn(
+          "cursor-pointer px-4 py-2 text-sm font-medium border-b-2 -mb-px",
+          activeTab?.id === tab.id ? "border-brand text-brand" : "border-transparent text-base-contrast-light hover:text-base-contrast"
+        ),
+        children: tab.label
+      },
+      tab.id
+    )) }) }),
+    /* @__PURE__ */ jsx40("div", { role: "tabpanel", children: activeTab?.content })
+  ] });
+}
+
+// src/components/editor/SettingsForm.tsx
+import { jsx as jsx41, jsxs as jsxs23 } from "react/jsx-runtime";
+function resolveValues(schema11, values) {
+  const resolved = {};
+  for (const [key, field] of Object.entries(schema11)) {
+    resolved[key] = values[key] ?? field.default;
+  }
+  return resolved;
+}
+function coerceValue(field, value) {
+  if (field.type === "select" && "coerce" in field && field.coerce === "number") {
+    return Number(value);
+  }
+  return value;
+}
+function normalizeEmpty(field, value) {
+  if (field.type === "select" && "emptyIsUndefined" in field && field.emptyIsUndefined && value === "") {
+    return void 0;
+  }
+  return value;
+}
+function splitByTarget(schema11, allValues) {
+  const content = {};
+  const options = {};
+  for (const [key, field] of Object.entries(schema11)) {
+    const value = normalizeEmpty(field, coerceValue(field, allValues[key]));
+    const target = field.target ?? "options";
+    if (target === "content") {
+      content[key] = value;
+    } else {
+      options[key] = value;
+    }
+  }
+  return { content, options };
+}
+function RangeField({
+  field,
+  value,
+  onChange
+}) {
+  const id = useId4();
+  return /* @__PURE__ */ jsxs23("div", { children: [
+    /* @__PURE__ */ jsx41(FormLabel, { htmlFor: id, children: field.label }),
+    /* @__PURE__ */ jsx41(
+      "input",
+      {
+        id,
+        type: "range",
+        min: field.min,
+        max: field.max,
+        step: field.step,
+        value,
+        onChange: (e) => onChange(Number(e.target.value)),
+        className: cn(
+          "w-full accent-primary"
+        )
+      }
+    )
+  ] });
+}
+function renderField(key, field, value, handleFieldChange) {
+  switch (field.type) {
+    case "text":
+      return /* @__PURE__ */ jsx41(
+        Input,
+        {
+          label: field.label,
+          value: String(value ?? ""),
+          placeholder: field.placeholder,
+          onChange: (v) => handleFieldChange(key, v)
+        },
+        key
+      );
+    case "number":
+      return /* @__PURE__ */ jsx41(
+        Input,
+        {
+          label: field.label,
+          type: "number",
+          value: String(value ?? ""),
+          onChange: (v) => handleFieldChange(key, v === "" ? "" : Number(v))
+        },
+        key
+      );
+    case "checkbox":
+      return /* @__PURE__ */ jsx41(
+        Checkbox,
+        {
+          label: field.label,
+          checked: Boolean(value),
+          onChange: (checked) => handleFieldChange(key, checked)
+        },
+        key
+      );
+    case "select":
+      return /* @__PURE__ */ jsx41(
+        Select,
+        {
+          label: field.label,
+          value: String(value ?? ""),
+          options: field.options,
+          onChange: (v) => handleFieldChange(key, v)
+        },
+        key
+      );
+    case "range":
+      return /* @__PURE__ */ jsx41(
+        RangeField,
+        {
+          field,
+          value: Number(value ?? field.min),
+          onChange: (v) => handleFieldChange(key, v)
+        },
+        key
+      );
+    case "link":
+      return /* @__PURE__ */ jsx41(
+        LinkField,
+        {
+          label: field.label,
+          value: value ?? field.default,
+          onChange: (v) => handleFieldChange(key, v)
+        },
+        key
+      );
+    default:
+      return null;
+  }
+}
+function SettingsForm({ schema: schema11, values, onChange, tabs }) {
+  const [local, setLocal] = useState16(() => resolveValues(schema11, values));
+  function handleFieldChange(key, newValue) {
+    const next = { ...local, [key]: newValue };
+    setLocal(next);
+    onChange(splitByTarget(schema11, next));
+  }
+  if (tabs) {
+    const fields = (keys) => keys.filter((key) => key in schema11).map((key) => renderField(key, schema11[key], local[key], handleFieldChange));
+    const listed = new Set(tabs.flatMap((t) => t.fields));
+    const otherKeys = Object.keys(schema11).filter((key) => !listed.has(key));
+    const tabItems = [
+      ...tabs.map((t) => ({ id: t.label, label: t.label, content: /* @__PURE__ */ jsx41("div", { className: "flex flex-col gap-4", children: fields(t.fields) }) })),
+      ...otherKeys.length > 0 ? [{ id: "__other__", label: "Other", content: /* @__PURE__ */ jsx41("div", { className: "flex flex-col gap-4", children: fields(otherKeys) }) }] : []
+    ];
+    return /* @__PURE__ */ jsx41(Tabs, { tabs: tabItems, fullBleedTabBar: true });
+  }
+  return /* @__PURE__ */ jsx41("div", { className: "flex flex-col gap-4", children: Object.entries(schema11).map(([key, field]) => renderField(key, field, local[key], handleFieldChange)) });
+}
+
+// src/hooks/useBlockDnd.ts
+import { useEffect as useEffect12, useRef as useRef11, useState as useState17 } from "react";
+
+// src/lib/block-dnd.ts
+var ROOT_CONTAINER_ID = "__root__";
+function buildBlockDragData(args) {
+  return { dragType: "block", ...args };
+}
+function buildBlockDropData(args) {
+  return { ...args };
+}
+function isBlockDragData(data) {
+  return data.dragType === "block";
+}
+function canDropBlock(source, dropContainerId) {
+  if (source.blockId === dropContainerId) return false;
+  if (source.isContainer && dropContainerId !== ROOT_CONTAINER_ID) return false;
+  return true;
+}
+
+// src/hooks/useBlockDnd.ts
+function useBlockDnd({ blockId, containerId, index, isContainer, allowedEdges, enabled }) {
+  const dragRef = useRef11(null);
+  const handleRef = useRef11(null);
+  const [closestEdge, setClosestEdge] = useState17(null);
+  const [isDragging, setIsDragging] = useState17(false);
+  useEffect12(() => {
+    const element = dragRef.current;
+    const handle = handleRef.current;
+    if (!element || !enabled) return;
+    let cleanup;
+    let cancelled = false;
+    Promise.all([
+      import("../../adapter-HH47ZPGM.js"),
+      import("../../closest-edge-EBOXL3YW.js")
+    ]).then(([{ draggable, dropTargetForElements }, { attachClosestEdge, extractClosestEdge }]) => {
+      if (cancelled) return;
+      const cleanupDraggable = draggable({
+        element,
+        dragHandle: handle ?? void 0,
+        getInitialData: () => buildBlockDragData({ blockId, containerId, index, isContainer }),
+        onGenerateDragPreview: () => {
+          element.style.opacity = "0.4";
+          requestAnimationFrame(() => {
+            element.style.opacity = "";
+          });
+        },
+        onDragStart: () => setIsDragging(true),
+        onDrop: () => setIsDragging(false)
+      });
+      const cleanupDrop = dropTargetForElements({
+        element,
+        canDrop: ({ source }) => isBlockDragData(source.data) && canDropBlock(source.data, containerId),
+        getData: ({ input, element: el }) => attachClosestEdge(buildBlockDropData({ dropContainerId: containerId, index }), {
+          input,
+          element: el,
+          allowedEdges
+        }),
+        onDrag: ({ self, source, location }) => {
+          const innermost = location.current.dropTargets[0]?.element === self.element;
+          if (!innermost || !isBlockDragData(source.data) || source.data.blockId === blockId) {
+            setClosestEdge(null);
+            return;
+          }
+          setClosestEdge(extractClosestEdge(self.data));
+        },
+        onDragLeave: () => setClosestEdge(null),
+        onDrop: () => setClosestEdge(null)
+      });
+      cleanup = () => {
+        cleanupDraggable();
+        cleanupDrop();
+      };
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, [blockId, containerId, index, isContainer, enabled, allowedEdges]);
+  return { dragRef, handleRef, closestEdge, isDragging };
+}
+function useBlockDropZone({ containerId, index, toColumn, allowedEdges, enabled }) {
+  const dropRef = useRef11(null);
+  const [closestEdge, setClosestEdge] = useState17(null);
+  useEffect12(() => {
+    const element = dropRef.current;
+    if (!element || !enabled) return;
+    let cleanup;
+    let cancelled = false;
+    Promise.all([
+      import("../../adapter-HH47ZPGM.js"),
+      import("../../closest-edge-EBOXL3YW.js")
+    ]).then(([{ dropTargetForElements }, { attachClosestEdge, extractClosestEdge }]) => {
+      if (cancelled) return;
+      cleanup = dropTargetForElements({
+        element,
+        canDrop: ({ source }) => isBlockDragData(source.data) && canDropBlock(source.data, containerId),
+        getData: ({ input, element: el }) => attachClosestEdge(buildBlockDropData({ dropContainerId: containerId, index, toColumn }), {
+          input,
+          element: el,
+          allowedEdges
+        }),
+        onDrag: ({ self, source, location }) => {
+          const innermost = location.current.dropTargets[0]?.element === self.element;
+          if (!innermost || !isBlockDragData(source.data)) {
+            setClosestEdge(null);
+            return;
+          }
+          setClosestEdge(extractClosestEdge(self.data));
+        },
+        onDragLeave: () => setClosestEdge(null),
+        onDrop: () => setClosestEdge(null)
+      });
+    });
+    return () => {
+      cancelled = true;
+      cleanup?.();
+    };
+  }, [containerId, index, toColumn, enabled, allowedEdges]);
+  return { dropRef, closestEdge };
+}
+
+// src/lib/container-ops.ts
+function getContainerChildren(block) {
+  const content = block.content;
+  return Array.isArray(content?.children) ? content.children : [];
+}
+function withChildren(container, children) {
+  return { ...container, content: { ...container.content, children } };
+}
+function containerColumns(container) {
+  const n = container.content?.columns;
+  return typeof n === "number" && n >= 1 ? n : 1;
+}
+function removeChildAt(container, index) {
+  const children = getContainerChildren(container);
+  if (index < 0 || index >= children.length) return { container, removed: null };
+  const next = [...children];
+  const [removed] = next.splice(index, 1);
+  return { container: withChildren(container, next), removed };
+}
+function duplicateChildAt(container, index, newId2) {
+  const children = getContainerChildren(container);
+  if (index < 0 || index >= children.length) return container;
+  const clone = { ...JSON.parse(JSON.stringify(children[index])), id: newId2() };
+  const next = [...children];
+  next.splice(index + 1, 0, clone);
+  return withChildren(container, next);
+}
+function setChildColSpan(container, index, span) {
+  const children = getContainerChildren(container);
+  if (index < 0 || index >= children.length) return container;
+  const clamped = Math.max(1, Math.min(span, containerColumns(container)));
+  const next = children.map((child, i) => {
+    if (i !== index) return child;
+    if (clamped <= 1) {
+      const { layout: _drop, ...rest } = child;
+      return rest;
+    }
+    return { ...child, layout: { ...child.layout, colSpan: clamped } };
+  });
+  return withChildren(container, next);
+}
+function effectiveSpan(child, columns) {
+  return isSpacer(child) ? 1 : Math.min(child.layout?.colSpan ?? 1, columns);
+}
+function isSpacer(child) {
+  return child.type === "spacer";
+}
+function occupiedColumns(children, columns) {
+  return children.reduce((sum, c) => sum + effectiveSpan(c, columns), 0);
+}
+function trimTrailingSpacers(container) {
+  const children = getContainerChildren(container);
+  let end = children.length;
+  while (end > 0 && isSpacer(children[end - 1])) end--;
+  if (end === children.length) return container;
+  return withChildren(container, children.slice(0, end));
+}
+
+// src/components/sections/Container/Container.tsx
+import { jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
+var ROW_EDGES = ["left", "right"];
+var COL_EDGES = ["top", "bottom"];
+function ContainerChild({
+  containerId,
+  index,
+  child,
+  columns,
+  flow,
+  cellClass,
+  label,
+  hasSettings,
+  mergedOptions,
+  isEditMode,
+  ChildComp,
+  onDelete,
+  onDuplicate,
+  onColSpanChange,
+  onOpenSettings,
+  onChildContentChange,
+  openModal
+}) {
+  const isContainer = Array.isArray(child.content?.children);
+  const { dragRef, handleRef, closestEdge, isDragging } = useBlockDnd({
+    blockId: child.id ?? `child-${index}`,
+    containerId,
+    index,
+    isContainer,
+    allowedEdges: flow === "column" ? COL_EDGES : ROW_EDGES,
+    enabled: true
+  });
+  return /* @__PURE__ */ jsx42(
+    "div",
+    {
+      ref: dragRef,
+      className: cellClass,
+      "data-child-index": index,
+      "data-child-id": child.id,
+      children: /* @__PURE__ */ jsx42(
+        ChildBlockWrapper,
+        {
+          label,
+          columns,
+          colSpan: Math.min(child.layout?.colSpan ?? 1, columns),
+          closestEdge,
+          isDragging,
+          hasSettings,
+          dragHandleRef: handleRef,
+          onDelete,
+          onDuplicate,
+          onColSpanChange,
+          onOpenSettings,
+          children: /* @__PURE__ */ jsx42(
+            ChildComp,
+            {
+              content: child,
+              options: mergedOptions,
+              isEditMode,
+              onChange: onChildContentChange,
+              openModal
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function EmptyColumnCell({
+  containerId,
+  targetColumn,
+  testId
+}) {
+  const { dropRef, closestEdge } = useBlockDropZone({
+    containerId,
+    index: 0,
+    toColumn: targetColumn,
+    allowedEdges: ROW_EDGES,
+    enabled: true
+  });
+  const active = closestEdge !== null;
+  return /* @__PURE__ */ jsx42(
+    "div",
+    {
+      ref: dropRef,
+      "data-empty-dropzone": true,
+      "data-testid": testId,
+      "data-target-column": targetColumn,
+      className: cn(
+        "flex min-h-20 items-center justify-center rounded-md border-2 border-dashed text-xs text-base-contrast-light/50",
+        active ? "border-primary" : "border-base-200"
+      ),
+      children: "Empty"
+    }
+  );
+}
+function newId() {
+  return typeof crypto !== "undefined" && typeof crypto.randomUUID === "function" ? crypto.randomUUID() : `child-${Math.random().toString(36).slice(2)}-${Date.now()}`;
+}
+function Container({ content, isEditMode, onChange, openModal }) {
+  const { columns, flow, childDefaults, children } = content.content;
+  const editable = isEditMode && !!onChange;
+  const container = {
+    id: content.id ?? "container",
+    type: "container",
+    content: content.content
+  };
+  const emit = (nextSection) => onChange?.({ ...content, content: nextSection.content });
+  const updateChild = (index, childContent) => {
+    const next = children.map((c, i) => i === index ? childContent : c);
+    onChange?.({ ...content, content: { ...content.content, children: next } });
+  };
+  const gridClass = cn(
+    "grid",
+    "gap-8",
+    containerGridClass[columns] ?? "grid-cols-1",
+    flow === "column" && "grid-flow-col"
+  );
+  if (!editable) {
+    return /* @__PURE__ */ jsx42("div", { className: "@container", children: /* @__PURE__ */ jsx42("div", { className: gridClass, children: children.map((child, index) => {
+      const def = getSection(child.type);
+      if (!def) return null;
+      const Child = def.component;
+      const span = child.layout?.colSpan ?? 1;
+      const childOptions = "options" in child ? child.options : void 0;
+      const mergedOptions = { ...childDefaults ?? {}, ...childOptions ?? {} };
+      const cellClass = cn(
+        colSpanClass[columns]?.[Math.min(span, columns)] || void 0,
+        child.type === "spacer" && spacerHiddenClass[columns]
+      );
+      return /* @__PURE__ */ jsx42("div", { className: cellClass, children: /* @__PURE__ */ jsx42(Child, { content: child, options: mergedOptions, isEditMode }) }, child.id ?? index);
+    }) }) });
+  }
+  function columnStartOf(index) {
+    let c = 0;
+    for (let i = 0; i < index; i++) {
+      c += isSpacer(children[i]) ? 1 : Math.min(children[i].layout?.colSpan ?? 1, columns);
+    }
+    return c + 1;
+  }
+  function renderEditChild(child, index) {
+    const def = getSection(child.type);
+    if (!def) return null;
+    if (isSpacer(child)) {
+      return /* @__PURE__ */ jsx42(
+        EmptyColumnCell,
+        {
+          containerId: container.id,
+          targetColumn: columnStartOf(index),
+          testId: "spacer-cell"
+        },
+        child.id ?? index
+      );
+    }
+    const span = child.layout?.colSpan ?? 1;
+    const childOptions = "options" in child ? child.options : void 0;
+    const mergedOptions = { ...childDefaults ?? {}, ...childOptions ?? {} };
+    const cellClass = colSpanClass[columns]?.[Math.min(span, columns)] || void 0;
+    const hasSettings = !!(def.settings || def.settingsForm) && !!openModal;
+    const onOpenSettings = hasSettings && openModal ? () => {
+      const childOpts = childOptions ?? {};
+      const childContent = child.content ?? {};
+      const seed = { ...childContent, ...childOpts };
+      const applyResult = (result) => updateChild(index, {
+        ...child,
+        content: { ...child.content, ...result.content },
+        options: { ...childOpts, ...result.options }
+      });
+      if (def.settingsForm) {
+        const CustomForm = def.settingsForm;
+        openModal(
+          `${def.label} Settings`,
+          /* @__PURE__ */ jsx42(CustomForm, { ...seed, onChange: applyResult })
+        );
+      } else if (def.settings) {
+        openModal(
+          `${def.label} Settings`,
+          /* @__PURE__ */ jsx42(
+            SettingsForm,
+            {
+              schema: def.settings,
+              values: seed,
+              onChange: applyResult,
+              tabs: def.settingsTabs
+            }
+          )
+        );
+      }
+    } : void 0;
+    return /* @__PURE__ */ jsx42(
+      ContainerChild,
+      {
+        containerId: container.id,
+        index,
+        child,
+        columns,
+        flow,
+        cellClass,
+        label: def.label,
+        hasSettings,
+        mergedOptions,
+        isEditMode,
+        ChildComp: def.component,
+        onDelete: () => emit(trimTrailingSpacers(removeChildAt(container, index).container)),
+        onDuplicate: () => emit(duplicateChildAt(container, index, newId)),
+        onColSpanChange: (s) => emit(setChildColSpan(container, index, s)),
+        onOpenSettings,
+        onChildContentChange: (c) => updateChild(index, c),
+        openModal
+      },
+      child.id ?? index
+    );
+  }
+  const occupied = occupiedColumns(children, columns);
+  const emptyCols = occupied < columns ? columns - occupied : 0;
+  return /* @__PURE__ */ jsx42("div", { className: "@container", children: /* @__PURE__ */ jsxs24("div", { className: gridClass, children: [
+    children.map(renderEditChild),
+    Array.from({ length: emptyCols }, (_, i) => /* @__PURE__ */ jsx42(
+      EmptyColumnCell,
+      {
+        containerId: container.id,
+        targetColumn: occupied + i + 1,
+        testId: "ghost-cell"
+      },
+      `ghost-${i}`
+    ))
+  ] }) });
+}
+
+// src/components/sections/Container/ContainerSettingsForm.tsx
+import { useState as useState18 } from "react";
+import { jsx as jsx43, jsxs as jsxs25 } from "react/jsx-runtime";
+function inheritableSchema(children) {
+  const out = {};
+  for (const child of children) {
+    const def = getSection(child.type);
+    if (!def?.settings || !def.inheritableSettings) continue;
+    for (const key of def.inheritableSettings) {
+      const field = def.settings[key];
+      if (field && !out[key]) out[key] = field;
+    }
+  }
+  return out;
+}
+function ContainerSettingsForm({
+  columns = 1,
+  flow = "row",
+  childDefaults = {},
+  children = [],
+  onChange
+}) {
+  const [layout, setLayout] = useState18({ columns, flow });
+  const [defaults, setDefaults] = useState18(childDefaults);
+  const childSchema = inheritableSchema(children);
+  const hasChildDefaults = Object.keys(childSchema).length > 0;
+  function emit(nextLayout, nextDefaults) {
+    onChange({ content: { ...nextLayout, childDefaults: nextDefaults }, options: {} });
+  }
+  const layoutSchema = {
+    columns: {
+      type: "select",
+      label: "Columns",
+      default: String(layout.columns),
+      target: "content",
+      coerce: "number",
+      options: Array.from({ length: MAX_CONTAINER_COLUMNS }, (_, i) => ({
+        label: String(i + 1),
+        value: String(i + 1)
+      }))
+    },
+    flow: {
+      type: "select",
+      label: "Flow",
+      default: layout.flow,
+      target: "content",
+      options: [
+        { label: "Rows (wrap across)", value: "row" },
+        { label: "Columns (fill down)", value: "column" }
+      ]
+    }
+  };
+  return /* @__PURE__ */ jsxs25("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ jsxs25("fieldset", { className: "flex flex-col gap-4", children: [
+      /* @__PURE__ */ jsx43("legend", { className: "mb-2 text-sm font-semibold text-base-contrast", children: "Layout" }),
+      /* @__PURE__ */ jsx43(
+        SettingsForm,
+        {
+          schema: layoutSchema,
+          values: { columns: String(layout.columns), flow: layout.flow },
+          onChange: (result) => {
+            const next = {
+              columns: Number(result.content.columns ?? layout.columns),
+              flow: String(result.content.flow ?? layout.flow)
+            };
+            setLayout(next);
+            emit(next, defaults);
+          }
+        }
+      )
+    ] }),
+    hasChildDefaults && /* @__PURE__ */ jsxs25("fieldset", { className: "flex flex-col gap-4 border-t border-base-200 pt-4", children: [
+      /* @__PURE__ */ jsx43("legend", { className: "mb-2 text-sm font-semibold text-base-contrast", children: "Apply to all items" }),
+      /* @__PURE__ */ jsx43(
+        SettingsForm,
+        {
+          schema: childSchema,
+          values: defaults,
+          onChange: (result) => {
+            const next = { ...defaults, ...result.options };
+            setDefaults(next);
+            emit(layout, next);
+          }
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/components/sections/Container/index.tsx
+import { jsx as jsx44 } from "react/jsx-runtime";
+var schema9 = z9.object({
+  type: z9.literal("container"),
+  content: z9.object({
+    columns: z9.number().int().min(1).max(MAX_CONTAINER_COLUMNS).default(1),
+    flow: z9.enum(["row", "column"]).default("row"),
+    childDefaults: z9.record(z9.string(), z9.unknown()).optional(),
+    // Recursive: children are full blocks. z.lazy defers evaluation to parse
+    // time, by which point every section schema (incl. container) is registered.
+    children: z9.array(z9.lazy(() => getSectionSchema())).default([])
+  }).transform((c) => ({
+    ...c,
+    children: c.children.map(
+      (child) => child.layout?.colSpan && child.layout.colSpan > c.columns ? { ...child, layout: { ...child.layout, colSpan: c.columns } } : child
+    )
+  }))
+});
+var Container_default = defineSection({
+  type: "container",
+  label: "Container",
+  icon: /* @__PURE__ */ jsx44(LayoutTemplate, { size: 18 }),
+  schema: schema9,
+  component: ({ content, onChange, isEditMode, openModal }) => /* @__PURE__ */ jsx44(Container, { content, isEditMode: !!isEditMode, onChange, openModal }),
+  defaults: () => ({
+    type: "container",
+    content: { columns: 1, flow: "row", children: [] }
+  }),
+  getLabel: (content) => {
+    const n = content.content.children.length;
+    return `Container (${n} item${n === 1 ? "" : "s"})`;
+  },
+  settingsForm: ContainerSettingsForm
+});
+
+// src/components/sections/Spacer/index.tsx
+import { z as z10 } from "zod";
+import { SquareDashed } from "lucide-react";
+
+// src/components/sections/Spacer/Spacer.tsx
+import { jsx as jsx45 } from "react/jsx-runtime";
+function Spacer() {
+  return /* @__PURE__ */ jsx45("div", { "data-spacer": true, "aria-hidden": "true", className: "h-full" });
+}
+
+// src/components/sections/Spacer/index.tsx
+import { jsx as jsx46 } from "react/jsx-runtime";
+var schema10 = z10.object({
+  type: z10.literal("spacer"),
+  content: z10.object({}).default({})
+});
+var Spacer_default = defineSection({
+  type: "spacer",
+  label: "Spacer",
+  icon: /* @__PURE__ */ jsx46(SquareDashed, { size: 18 }),
+  schema: schema10,
+  component: () => /* @__PURE__ */ jsx46(Spacer, {}),
+  defaults: () => ({ type: "spacer", content: {} })
+});
+
+// src/components/sections/all-sections.ts
+var allSectionDefs = [
+  LinkHeading_default,
+  SubHeading_default,
+  SubSubHeading_default,
+  Prose_default,
+  Media_default,
+  Button_default,
+  Colors_default,
+  IconList_default,
+  Container_default,
+  Spacer_default
+];
+
+// src/components/sections/register-schemas.ts
+var _ensured = false;
+function ensureSchemasRegistered() {
+  if (!_ensured) {
+    allSectionDefs.forEach((def) => {
+      registerSchema(def.type, def.schema);
+      if (def.richTextFields) registerRichText(def.type, def.richTextFields);
+    });
+    _ensured = true;
+  }
+  return allSectionDefs.length;
+}
+export {
+  ensureSchemasRegistered
+};