@drawnagency/primitives 0.1.66 → 0.1.67

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

@@ -1,958 +1,28 @@
 import {
-  brandGuideSectionDefs,
-  pluralize,
-  stripHtmlToPlainText,
-  truncate
-} from "../../chunk-VEIDANEU.js";
-import {
-  DeleteButton,
-  DragHandle,
-  Popover,
-  PopoverItem,
-  SettingsButton,
-  SettingsForm,
-  buildBlockDragData,
-  buildBlockDropData,
-  canDropBlock,
-  isBlockDragData
-} from "../../chunk-2BHPWO7M.js";
+  allSectionDefs
+} from "../../chunk-4VMAZZXT.js";
+import "../../chunk-KM6HOW4H.js";
+import "../../chunk-2BHPWO7M.js";
 import "../../chunk-5THS4K5D.js";
-import {
-  EditableRichText,
-  defineHeadingSection
-} from "../../chunk-DQTKWKSK.js";
-import {
-  EditablePlainText,
-  MAX_CONTAINER_COLUMNS,
-  MediaBlock,
-  colSpanClass,
-  containerGridClass,
-  spacerHiddenClass
-} from "../../chunk-XNGG5AGI.js";
+import "../../chunk-WJ7RZ6CC.js";
+import "../../chunk-XNGG5AGI.js";
 import "../../chunk-4E66N6UV.js";
 import "../../chunk-I5737FJY.js";
 import "../../chunk-VU3XR362.js";
-import {
-  DEFAULT_LINK,
-  LinkValueSchema
-} from "../../chunk-3DCG4DNU.js";
+import "../../chunk-3DCG4DNU.js";
 import "../../chunk-WDSVHKAH.js";
-import {
-  sanitizeHtml
-} from "../../chunk-53DKVAB6.js";
+import "../../chunk-53DKVAB6.js";
 import "../../chunk-ZGFAYZWB.js";
+import "../../chunk-7EOSDFS3.js";
+import "../../chunk-TZQPOR5A.js";
+import "../../chunk-TEYTLQVH.js";
 import {
-  cn
-} from "../../chunk-7EOSDFS3.js";
-import {
-  getSectionSchema
-} from "../../chunk-TZQPOR5A.js";
-import {
-  SingleMediaReferenceSchema
-} from "../../chunk-TEYTLQVH.js";
-import {
-  defineSection,
-  getSection,
   registerRichText,
   registerSchema
 } from "../../chunk-VKAGMEKE.js";
 import "../../chunk-NSCT3AMV.js";
 import "../../chunk-JSBRDJBE.js";
 
-// src/components/sections/LinkHeading/index.tsx
-import { Heading1 } from "lucide-react";
-import { jsx } from "react/jsx-runtime";
-var LinkHeading_default = defineHeadingSection({
-  type: "link_heading",
-  label: "Link Heading",
-  icon: /* @__PURE__ */ jsx(Heading1, { size: 18 }),
-  navRole: "h1",
-  tag: "h2",
-  placeholder: "Section heading",
-  defaultHeading: "New Section"
-});
-
-// src/components/sections/SubHeading/index.tsx
-import { Heading2 } from "lucide-react";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var SubHeading_default = defineHeadingSection({
-  type: "sub_heading",
-  label: "Sub Heading",
-  icon: /* @__PURE__ */ jsx2(Heading2, { size: 18 }),
-  navRole: "h2",
-  tag: "h3",
-  placeholder: "Sub heading",
-  defaultHeading: "New Sub Heading",
-  navExclusion: true
-});
-
-// src/components/sections/SubSubHeading/index.tsx
-import { Heading3 } from "lucide-react";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var SubSubHeading_default = defineHeadingSection({
-  type: "sub_sub_heading",
-  label: "Sub Sub Heading",
-  icon: /* @__PURE__ */ jsx3(Heading3, { size: 18 }),
-  navRole: "h3",
-  tag: "h4",
-  placeholder: "Sub sub heading",
-  defaultHeading: "New Sub Sub Heading",
-  navExclusion: true
-});
-
-// src/components/sections/Prose/index.tsx
-import { z } from "zod";
-import { AlignLeft } from "lucide-react";
-
-// src/components/sections/Prose/Prose.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
-function Prose({ body, onChange }) {
-  if (onChange) {
-    return /* @__PURE__ */ jsx4("div", { className: "prose-content", children: /* @__PURE__ */ jsx4(
-      EditableRichText,
-      {
-        value: body,
-        onChange: (html) => onChange({ type: "prose", content: { body: html } }),
-        isEditMode: true,
-        preset: "rich",
-        placeholder: "Start writing..."
-      }
-    ) });
-  }
-  return /* @__PURE__ */ jsx4(
-    "div",
-    {
-      className: "prose-content",
-      dangerouslySetInnerHTML: { __html: sanitizeHtml(body) }
-    }
-  );
-}
-
-// src/components/sections/Prose/index.tsx
-import { jsx as jsx5 } from "react/jsx-runtime";
-var schema = z.object({
-  type: z.literal("prose"),
-  content: z.object({ body: z.string() })
-});
-var Prose_default = defineSection({
-  type: "prose",
-  label: "Prose",
-  icon: /* @__PURE__ */ jsx5(AlignLeft, { size: 18 }),
-  schema,
-  richTextFields: ["body"],
-  component: ({ content, onChange }) => /* @__PURE__ */ jsx5(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 z2 } from "zod";
-import { Image as ImageIcon } from "lucide-react";
-import { jsx as jsx6 } from "react/jsx-runtime";
-var schema2 = z2.object({
-  type: z2.literal("media"),
-  content: z2.object({
-    ref: SingleMediaReferenceSchema,
-    link: LinkValueSchema.optional()
-  }),
-  options: z2.object({
-    square: z2.boolean().optional(),
-    showCaption: z2.boolean().optional(),
-    border: z2.boolean().optional(),
-    objectFit: z2.enum(["cover", "contain"]).optional()
-  }).default({})
-});
-var Media_default = defineSection({
-  type: "media",
-  label: "Media",
-  icon: /* @__PURE__ */ jsx6(ImageIcon, { size: 18 }),
-  schema: schema2,
-  component: ({ content, options, onChange }) => /* @__PURE__ */ jsx6(
-    MediaBlock,
-    {
-      refValue: content.content.ref,
-      options: options ?? {},
-      link: content.content.link,
-      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" }
-  },
-  inheritableSettings: ["square", "showCaption", "border", "objectFit"],
-  settingsTabs: [
-    { label: "Display", fields: ["square", "showCaption", "border", "objectFit"] },
-    { label: "Link", fields: ["link"] }
-  ]
-});
-
-// src/components/sections/Button/index.tsx
-import { z as z3 } from "zod";
-import { RectangleHorizontal } from "lucide-react";
-
-// src/components/sections/Button/CTAButton.tsx
-import { Download } from "lucide-react";
-import { jsx as jsx7, jsxs } from "react/jsx-runtime";
-function Button({ 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__ */ jsxs("span", { className: cn(base, variant, "inline-flex items-center gap-2"), children: [
-      download && /* @__PURE__ */ jsx7(Download, { size: 16, className: "shrink-0" }),
-      /* @__PURE__ */ jsx7(
-        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__ */ jsxs(
-      "a",
-      {
-        href,
-        target,
-        download: download ? "" : void 0,
-        className: cn(base, variant, download && "inline-flex items-center gap-2"),
-        children: [
-          download && /* @__PURE__ */ jsx7(Download, { size: 16, className: "shrink-0" }),
-          text
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx7("button", { className: cn("cursor-pointer", base, variant), children: text });
-}
-
-// src/components/sections/Button/index.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
-var schema3 = z3.object({
-  type: z3.literal("button"),
-  content: z3.object({
-    text: z3.string(),
-    link: LinkValueSchema.optional(),
-    download: z3.boolean().optional()
-  })
-});
-var Button_default = defineSection({
-  type: "button",
-  label: "Button",
-  icon: /* @__PURE__ */ jsx8(RectangleHorizontal, { size: 18 }),
-  schema: schema3,
-  component: ({ content, onChange }) => /* @__PURE__ */ jsx8(
-    Button,
-    {
-      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/Container/index.tsx
-import { z as z4 } from "zod";
-import { LayoutTemplate } from "lucide-react";
-
-// src/components/sections/Container/Container.tsx
-import "react";
-
-// src/components/editor/ChildBlockWrapper.tsx
-import { forwardRef } from "react";
-import { CopyPlus } from "lucide-react";
-
-// src/components/editor/ColSpanControl.tsx
-import { useRef, useState } from "react";
-import { Columns3 } from "lucide-react";
-import { jsx as jsx9, jsxs as jsxs2 } from "react/jsx-runtime";
-function ColSpanControl({ colSpan, columns, onChange }) {
-  const buttonRef = useRef(null);
-  const [open, setOpen] = useState(false);
-  if (columns <= 1) return null;
-  const current = Math.min(Math.max(colSpan, 1), columns);
-  return /* @__PURE__ */ jsxs2("div", { className: "relative", children: [
-    /* @__PURE__ */ jsx9(
-      "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__ */ jsx9(Columns3, { size: 14 })
-      }
-    ),
-    /* @__PURE__ */ jsx9(Popover, { isOpen: open, onClose: () => setOpen(false), anchorRef: buttonRef, className: "min-w-28", children: /* @__PURE__ */ jsx9("ul", { role: "list", className: "py-1", children: Array.from({ length: columns }, (_, i) => i + 1).map((span) => /* @__PURE__ */ jsx9("li", { children: /* @__PURE__ */ jsxs2(
-      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 jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
-var ChildBlockWrapper = forwardRef(
-  function ChildBlockWrapper2({
-    label,
-    columns,
-    colSpan,
-    closestEdge,
-    isDragging,
-    hasSettings,
-    dragHandleRef,
-    onDelete,
-    onDuplicate,
-    onColSpanChange,
-    onOpenSettings,
-    children
-  }, ref) {
-    return /* @__PURE__ */ jsxs3(
-      "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__ */ jsxs3("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__ */ jsx10("span", { className: "sr-only", children: label }),
-            /* @__PURE__ */ jsx10("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx10(DragHandle, { ref: dragHandleRef }) }),
-            /* @__PURE__ */ jsx10("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx10(ColSpanControl, { colSpan, columns, onChange: onColSpanChange }) }),
-            hasSettings && onOpenSettings && /* @__PURE__ */ jsx10("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx10(SettingsButton, { onClick: onOpenSettings }) }),
-            /* @__PURE__ */ jsx10("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx10(
-              "button",
-              {
-                type: "button",
-                "aria-label": "Duplicate block",
-                onClick: onDuplicate,
-                className: "cursor-pointer rounded p-1 text-base-contrast-light hover:text-primary",
-                children: /* @__PURE__ */ jsx10(CopyPlus, { size: 16 })
-              }
-            ) }),
-            /* @__PURE__ */ jsx10("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx10(DeleteButton, { onDelete }) })
-          ] }),
-          closestEdge === "left" && /* @__PURE__ */ jsx10(
-            "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__ */ jsx10(
-            "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__ */ jsx10("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__ */ jsx10("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/hooks/useBlockDnd.ts
-import { useEffect, useRef as useRef2, useState as useState2 } from "react";
-function useBlockDnd({ blockId, containerId, index, isContainer, allowedEdges, enabled }) {
-  const dragRef = useRef2(null);
-  const handleRef = useRef2(null);
-  const [closestEdge, setClosestEdge] = useState2(null);
-  const [isDragging, setIsDragging] = useState2(false);
-  useEffect(() => {
-    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 = useRef2(null);
-  const [closestEdge, setClosestEdge] = useState2(null);
-  useEffect(() => {
-    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 jsx11, jsxs as jsxs4 } 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__ */ jsx11(
-    "div",
-    {
-      ref: dragRef,
-      className: cellClass,
-      "data-child-index": index,
-      "data-child-id": child.id,
-      children: /* @__PURE__ */ jsx11(
-        ChildBlockWrapper,
-        {
-          label,
-          columns,
-          colSpan: Math.min(child.layout?.colSpan ?? 1, columns),
-          closestEdge,
-          isDragging,
-          hasSettings,
-          dragHandleRef: handleRef,
-          onDelete,
-          onDuplicate,
-          onColSpanChange,
-          onOpenSettings,
-          children: /* @__PURE__ */ jsx11(
-            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__ */ jsx11(
-    "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__ */ jsx11("div", { className: "@container", children: /* @__PURE__ */ jsx11("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__ */ jsx11("div", { className: cellClass, children: /* @__PURE__ */ jsx11(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__ */ jsx11(
-        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__ */ jsx11(CustomForm, { ...seed, onChange: applyResult })
-        );
-      } else if (def.settings) {
-        openModal(
-          `${def.label} Settings`,
-          /* @__PURE__ */ jsx11(
-            SettingsForm,
-            {
-              schema: def.settings,
-              values: seed,
-              onChange: applyResult,
-              tabs: def.settingsTabs
-            }
-          )
-        );
-      }
-    } : void 0;
-    return /* @__PURE__ */ jsx11(
-      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__ */ jsx11("div", { className: "@container", children: /* @__PURE__ */ jsxs4("div", { className: gridClass, children: [
-    children.map(renderEditChild),
-    Array.from({ length: emptyCols }, (_, i) => /* @__PURE__ */ jsx11(
-      EmptyColumnCell,
-      {
-        containerId: container.id,
-        targetColumn: occupied + i + 1,
-        testId: "ghost-cell"
-      },
-      `ghost-${i}`
-    ))
-  ] }) });
-}
-
-// src/components/sections/Container/ContainerSettingsForm.tsx
-import { useState as useState3 } from "react";
-import { jsx as jsx12, jsxs as jsxs5 } 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] = useState3({ columns, flow });
-  const [defaults, setDefaults] = useState3(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__ */ jsxs5("div", { className: "flex flex-col gap-6", children: [
-    /* @__PURE__ */ jsxs5("fieldset", { className: "flex flex-col gap-4", children: [
-      /* @__PURE__ */ jsx12("legend", { className: "mb-2 text-sm font-semibold text-base-contrast", children: "Layout" }),
-      /* @__PURE__ */ jsx12(
-        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__ */ jsxs5("fieldset", { className: "flex flex-col gap-4 border-t border-base-200 pt-4", children: [
-      /* @__PURE__ */ jsx12("legend", { className: "mb-2 text-sm font-semibold text-base-contrast", children: "Apply to all items" }),
-      /* @__PURE__ */ jsx12(
-        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 jsx13 } from "react/jsx-runtime";
-var schema4 = z4.object({
-  type: z4.literal("container"),
-  content: z4.object({
-    columns: z4.number().int().min(1).max(MAX_CONTAINER_COLUMNS).default(1),
-    flow: z4.enum(["row", "column"]).default("row"),
-    childDefaults: z4.record(z4.string(), z4.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: z4.array(z4.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__ */ jsx13(LayoutTemplate, { size: 18 }),
-  schema: schema4,
-  component: ({ content, onChange, isEditMode, openModal }) => /* @__PURE__ */ jsx13(Container, { content, isEditMode: !!isEditMode, onChange, openModal }),
-  defaults: () => ({
-    type: "container",
-    content: { columns: 1, flow: "row", children: [] }
-  }),
-  getLabel: (content) => `Container (${pluralize(content.content.children.length, "item")})`,
-  settingsForm: ContainerSettingsForm
-});
-
-// src/components/sections/Spacer/index.tsx
-import { z as z5 } from "zod";
-import { SquareDashed } from "lucide-react";
-
-// src/components/sections/Spacer/Spacer.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
-function Spacer() {
-  return /* @__PURE__ */ jsx14("div", { "data-spacer": true, "aria-hidden": "true", className: "h-full" });
-}
-
-// src/components/sections/Spacer/index.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
-var schema5 = z5.object({
-  type: z5.literal("spacer"),
-  content: z5.object({}).default({})
-});
-var Spacer_default = defineSection({
-  type: "spacer",
-  label: "Spacer",
-  icon: /* @__PURE__ */ jsx15(SquareDashed, { size: 18 }),
-  schema: schema5,
-  component: () => /* @__PURE__ */ jsx15(Spacer, {}),
-  defaults: () => ({ type: "spacer", content: {} })
-});
-
-// src/components/sections/core-sections.ts
-var coreSectionDefs = [
-  LinkHeading_default,
-  SubHeading_default,
-  SubSubHeading_default,
-  Prose_default,
-  Media_default,
-  Button_default,
-  Container_default,
-  Spacer_default
-];
-
-// src/components/sections/all-sections.ts
-var allSectionDefs = [...coreSectionDefs, ...brandGuideSectionDefs];
-
 // src/components/sections/register-schemas.ts
 var _ensured = false;
 function ensureSchemasRegistered() {