@drawnagency/primitives 0.1.56 → 0.1.58

package/dist/lib/registry.d.ts

@@ -26,6 +26,11 @@ export type SettingsFieldDef = {
     default: string;
     target?: "content" | "options";
     coerce?: "number";
+    /** When set, an empty-string ("") selection is normalized to `undefined`
+     * before the content/options split, so an optional-enum field clears cleanly
+     * (e.g. Media `dodont`, whose enum is strictly ["do","dont"]). Opt-in so other
+     * selects keep their "" value. */
+    emptyIsUndefined?: boolean;
     options: {
         label: string;
         value: string;
@@ -68,6 +73,8 @@ export interface WrapperProps {
     dirty?: boolean;
     index: number;
     isLast: boolean;
+    containerId: string;
+    isContainerBlock: boolean;
     definition: SectionDefinition;
     options?: Record<string, unknown>;
     audiences: Audience[];
@@ -79,6 +86,7 @@ export interface WrapperProps {
     onRequestInsert?: (index: number) => void;
     onDelete?: () => void;
     onMoveSection?: () => void;
+    onAddChild?: () => void;
     mainStatus?: string | null;
     contentDiffersFromMain?: boolean;
     isLocalOnly?: boolean;
@@ -96,6 +104,22 @@ export interface SectionDefinition<T = unknown> {
     getLabel?(content: T): string;
     getThumbnails?(content: T): Thumbnail[];
     navRole?: "h1" | "h2" | "h3";
+    /** content-relative field paths that hold HTML rich text (for the sanitizer). */
+    richTextFields?: readonly string[];
+    /**
+     * Option keys (under this type's `options`) that a parent container may set as a
+     * default for all children via `content.childDefaults`. v1: typed primitives only.
+     */
+    inheritableSettings?: readonly string[];
+    /**
+     * Optional grouping of `settings` fields into labeled tabs for the settings modal;
+     * presentation-only — does not change content/options routing; omitted fields fall
+     * into a trailing 'Other' tab.
+     */
+    settingsTabs?: {
+        label: string;
+        fields: string[];
+    }[];
 }
 type DefineSectionInput<S extends ZodType> = {
     type: string;
@@ -109,6 +133,17 @@ type DefineSectionInput<S extends ZodType> = {
     getLabel?(content: z.infer<S>): string;
     getThumbnails?(content: z.infer<S>): Thumbnail[];
     navRole?: "h1" | "h2" | "h3";
+    richTextFields?: readonly string[];
+    inheritableSettings?: readonly string[];
+    /**
+     * Optional grouping of `settings` fields into labeled tabs for the settings modal;
+     * presentation-only — does not change content/options routing; omitted fields fall
+     * into a trailing 'Other' tab.
+     */
+    settingsTabs?: {
+        label: string;
+        fields: string[];
+    }[];
 };
 export declare function defineSection<S extends ZodType>(def: DefineSectionInput<S>): SectionDefinition<z.infer<S>>;
 export interface SectionRegistry {
@@ -118,11 +153,15 @@ export interface SectionRegistry {
     getSchema(type: string): ZodType | undefined;
     getAllSections(): SectionDefinition[];
     getAllSchemas(): ZodType[];
+    registerRichText(type: string, fields: readonly string[]): void;
+    getRichTextFields(type: string): readonly string[];
     clearRegistry(): void;
 }
 export declare function createRegistry(): SectionRegistry;
 export declare function registerSection(def: SectionDefinition<any>): void;
 export declare function registerSchema(type: string, schema: ZodType): void;
+export declare function registerRichText(type: string, fields: readonly string[]): void;
+export declare function getRichTextFields(type: string): readonly string[];
 export declare function getSection(type: string): SectionDefinition | undefined;
 export declare function getSchema(type: string): ZodType | undefined;
 export declare function getAllSections(): SectionDefinition[];

package/dist/lib/registry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/lib/registry.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/lib/registry.ts"],"names":[],"mappings":"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"}

package/dist/lib/registry.js

@@ -0,0 +1,27 @@
+import {
+  clearRegistry,
+  createRegistry,
+  defineSection,
+  getAllSchemas,
+  getAllSections,
+  getRichTextFields,
+  getSchema,
+  getSection,
+  registerRichText,
+  registerSchema,
+  registerSection
+} from "../chunk-VKAGMEKE.js";
+import "../chunk-JSBRDJBE.js";
+export {
+  clearRegistry,
+  createRegistry,
+  defineSection,
+  getAllSchemas,
+  getAllSections,
+  getRichTextFields,
+  getSchema,
+  getSection,
+  registerRichText,
+  registerSchema,
+  registerSection
+};

package/dist/media/index.js

@@ -20,6 +20,7 @@ import {
   MediaItemSchema,
   VariantSchema
 } from "../chunk-DKOUFIP6.js";
+import "../chunk-JSBRDJBE.js";
 export {
   EXT_TO_MIME,
   ImageManifestSchema,

package/dist/schemas/auth.js

@@ -4,6 +4,7 @@ import {
   SessionSchema,
   SiteUserSchema
 } from "../chunk-LZKVV4K2.js";
+import "../chunk-JSBRDJBE.js";
 export {
   AudienceSchema,
   RoleSchema,

package/dist/schemas/block.d.ts

@@ -0,0 +1,20 @@
+import { z } from "zod";
+/**
+ * A block's participation in its parent container's layout — distinct from its
+ * content. Optional, and absent at the page root (the root is an implicit single
+ * column). Intentionally NOT strict so future keys (rowSpan, alignSelf) are
+ * forward-compatible.
+ */
+export declare const LayoutEnvelopeSchema: z.ZodObject<{
+    colSpan: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>;
+export type LayoutEnvelope = z.infer<typeof LayoutEnvelopeSchema>;
+/** v1 nesting cap: a top-level container (depth 2) may hold leaves but not containers. */
+export declare const MAX_BLOCK_DEPTH = 2;
+/** Content-agnostic: any block whose `content.children` is an array is a container. */
+export declare function getBlockChildren(block: unknown): unknown[];
+/** Depth of a block tree: a leaf is 1; a container is 1 + max(child depths). */
+export declare function blockDepth(block: unknown): number;
+/** Throws if the block tree is deeper than `max`. */
+export declare function assertMaxDepth(block: unknown, max?: number): void;
+//# sourceMappingURL=block.d.ts.map

package/dist/schemas/block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"block.d.ts","sourceRoot":"","sources":["../../src/schemas/block.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB;;iBAE/B,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC;AAElE,0FAA0F;AAC1F,eAAO,MAAM,eAAe,IAAI,CAAC;AAEjC,uFAAuF;AACvF,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,OAAO,GAAG,OAAO,EAAE,CAM1D;AAED,gFAAgF;AAChF,wBAAgB,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,CAIjD;AAED,qDAAqD;AACrD,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,GAAG,GAAE,MAAwB,GAAG,IAAI,CAKlF"}

package/dist/schemas/block.js

@@ -0,0 +1,15 @@
+import {
+  LayoutEnvelopeSchema,
+  MAX_BLOCK_DEPTH,
+  assertMaxDepth,
+  blockDepth,
+  getBlockChildren
+} from "../chunk-NSCT3AMV.js";
+import "../chunk-JSBRDJBE.js";
+export {
+  LayoutEnvelopeSchema,
+  MAX_BLOCK_DEPTH,
+  assertMaxDepth,
+  blockDepth,
+  getBlockChildren
+};

package/dist/schemas/index.js

@@ -1,12 +1,15 @@
 import {
   AudienceColorSchema,
   AudienceNameSchema,
+  MediaGridOptionsSchema,
+  slugifyAudienceName
+} from "../chunk-V7JN2DDU.js";
+import {
   DEFAULT_LINK,
   LinkTargetSchema,
   LinkValueSchema,
-  MediaGridOptionsSchema,
-  slugifyAudienceName
-} from "../chunk-7IAWF7LE.js";
+  isSafeHref
+} from "../chunk-ZU2MKPTG.js";
 import {
   AudienceSchema,
   RoleSchema,
@@ -24,18 +27,22 @@ import {
   PageStatusSchema,
   RESERVED_SLUGS,
   SectionMetaSchema,
+  SingleMediaReferenceSchema,
   SiteConfigSchema,
   TextLineSchema,
   getSectionContentSchema,
   getSectionSchema,
   normalizeSiteIndex
-} from "../chunk-KGYWQDBB.js";
+} from "../chunk-ICLXLWQ5.js";
 import {
   ImageManifestSchema,
   MediaConfigSchema,
   MediaItemSchema,
   VariantSchema
 } from "../chunk-DKOUFIP6.js";
+import "../chunk-NSCT3AMV.js";
+import "../chunk-VKAGMEKE.js";
+import "../chunk-JSBRDJBE.js";
 export {
   AudienceColorSchema,
   AudienceNameSchema,
@@ -59,12 +66,14 @@ export {
   RoleSchema,
   SectionMetaSchema,
   SessionSchema,
+  SingleMediaReferenceSchema,
   SiteConfigSchema,
   SiteUserSchema,
   TextLineSchema,
   VariantSchema,
   getSectionContentSchema,
   getSectionSchema,
+  isSafeHref,
   normalizeSiteIndex,
   slugifyAudienceName
 };

package/dist/schemas/link.d.ts

@@ -3,6 +3,13 @@ export declare const LinkTargetSchema: z.ZodEnum<{
     _self: "_self";
     _blank: "_blank";
 }>;
+/**
+ * Block dangerous href schemes (javascript:, data:, vbscript:) and protocol-
+ * relative URLs at the schema boundary. Allows empty (unset), relative paths /
+ * fragments / queries, and http(s)/mailto absolute URLs. Links are not walked by
+ * the recursive sanitizer, so this is the only XSS guard for stored link hrefs.
+ */
+export declare function isSafeHref(href: string): boolean;
 export declare const LinkValueSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
     kind: z.ZodLiteral<"external">;
     href: z.ZodString;

package/dist/schemas/link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../src/schemas/link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,eAAO,MAAM,gBAAgB;;;EAA8B,CAAC;AAE5D,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;2BAQ1B,CAAC;AAEH,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,eAAe,CAAC,CAAC;AAExD,eAAO,MAAM,YAAY,EAAE,SAA2D,CAAC"}
+{"version":3,"file":"link.d.ts","sourceRoot":"","sources":["../../src/schemas/link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,eAAO,MAAM,gBAAgB;;;EAA8B,CAAC;AAE5D;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAUhD;AAED,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;2BAQ1B,CAAC;AAEH,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,eAAe,CAAC,CAAC;AAExD,eAAO,MAAM,YAAY,EAAE,SAA2D,CAAC"}

package/dist/schemas/rich-text.d.ts

@@ -0,0 +1,9 @@
+import { z } from "zod";
+/**
+ * Marks a schema field as HTML rich text. Readability marker only — the runtime
+ * source of truth for sanitization is each block definition's `richTextFields`
+ * list (see registry). Kept as a helper so schemas read self-documentingly
+ * (`body: richText()`) and a future Zod version could make it introspectable.
+ */
+export declare function richText(): z.ZodString;
+//# sourceMappingURL=rich-text.d.ts.map

package/dist/schemas/rich-text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rich-text.d.ts","sourceRoot":"","sources":["../../src/schemas/rich-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB;;;;;GAKG;AACH,wBAAgB,QAAQ,gBAEvB"}

package/dist/schemas/sections.d.ts

@@ -1,4 +1,5 @@
 import { z } from "zod";
+import { type LayoutEnvelope } from "./block";
 export interface SectionContent<C = Record<string, unknown>> {
     type: string;
     content: C;
@@ -6,6 +7,7 @@ export interface SectionContent<C = Record<string, unknown>> {
 }
 export interface Section<C = Record<string, unknown>> extends SectionContent<C> {
     id: string;
+    layout?: LayoutEnvelope;
 }
 export declare function getSectionContentSchema(): z.ZodType<SectionContent>;
 export declare function getSectionSchema(): z.ZodType<Section>;

package/dist/schemas/sections.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sections.d.ts","sourceRoot":"","sources":["../../src/schemas/sections.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAGxB,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACzD,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IAC7E,EAAE,EAAE,MAAM,CAAC;CACZ;AAED,wBAAgB,uBAAuB,IAAI,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,CAMnE;AAED,wBAAgB,gBAAgB,IAAI,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAErD"}
+{"version":3,"file":"sections.d.ts","sourceRoot":"","sources":["../../src/schemas/sections.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAExB,OAAO,EAAwB,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAEpE,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACzD,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,CAAC,CAAC;IACX,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,OAAO,CAAC,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IAC7E,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,CAAC,EAAE,cAAc,CAAC;CACzB;AAED,wBAAgB,uBAAuB,IAAI,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,CAMnE;AAED,wBAAgB,gBAAgB,IAAI,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAIrD"}

package/dist/schemas/shared.d.ts

@@ -77,6 +77,36 @@ export declare const MediaReferenceSchema: z.ZodDiscriminatedUnion<[z.ZodObject<
     linkText: z.ZodOptional<z.ZodString>;
 }, z.core.$strip>], "type">;
 export type MediaReference = z.infer<typeof MediaReferenceSchema>;
+/** A single image or video reference — for the standalone `media` block
+ *  (excludes the grid-only doDontImage/linkedImage variants). */
+export declare const SingleMediaReferenceSchema: z.ZodDiscriminatedUnion<[z.ZodObject<{
+    imageId: z.ZodDefault<z.ZodString>;
+    caption: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodArray<z.ZodString>]>>;
+    background: z.ZodOptional<z.ZodString>;
+    invertFrom: z.ZodOptional<z.ZodString>;
+    border: z.ZodOptional<z.ZodBoolean>;
+    objectFit: z.ZodOptional<z.ZodEnum<{
+        cover: "cover";
+        contain: "contain";
+    }>>;
+    type: z.ZodLiteral<"image">;
+}, z.core.$strip>, z.ZodObject<{
+    imageId: z.ZodDefault<z.ZodString>;
+    caption: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodArray<z.ZodString>]>>;
+    background: z.ZodOptional<z.ZodString>;
+    invertFrom: z.ZodOptional<z.ZodString>;
+    border: z.ZodOptional<z.ZodBoolean>;
+    objectFit: z.ZodOptional<z.ZodEnum<{
+        cover: "cover";
+        contain: "contain";
+    }>>;
+    type: z.ZodLiteral<"video">;
+    poster: z.ZodOptional<z.ZodString>;
+    autoplay: z.ZodOptional<z.ZodBoolean>;
+    loop: z.ZodOptional<z.ZodBoolean>;
+    muted: z.ZodOptional<z.ZodBoolean>;
+}, z.core.$strip>], "type">;
+export type SingleMediaReference = z.infer<typeof SingleMediaReferenceSchema>;
 export declare const HexColorSchema: z.ZodString;
 export declare const FontNameSchema: z.ZodString;
 export declare const ColorSpaceSchema: z.ZodObject<{

package/dist/schemas/shared.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../src/schemas/shared.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAwBxB,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;2BAKzB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,cAAc,CAAC,CAAC;AAoCtD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAE/B,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC;AAGlE,eAAO,MAAM,cAAc,aAEiC,CAAC;AAO7D,eAAO,MAAM,cAAc,aAG6C,CAAC;AAEzE,eAAO,MAAM,gBAAgB;;;;;iBAQ5B,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE1D,eAAO,MAAM,eAAe;;;;;;;;iBAG1B,CAAC;AAEH,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,eAAe,CAAC,CAAC"}
+{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../src/schemas/shared.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAwBxB,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;2BAKzB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,cAAc,CAAC,CAAC;AAoCtD,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAE/B,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,oBAAoB,CAAC,CAAC;AAElE;iEACiE;AACjE,eAAO,MAAM,0BAA0B;;;;;;;;;;;;;;;;;;;;;;;;;;2BAAqD,CAAC;AAE7F,MAAM,MAAM,oBAAoB,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,0BAA0B,CAAC,CAAC;AAG9E,eAAO,MAAM,cAAc,aAEiC,CAAC;AAO7D,eAAO,MAAM,cAAc,aAG6C,CAAC;AAEzE,eAAO,MAAM,gBAAgB;;;;;iBAQ5B,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE1D,eAAO,MAAM,eAAe;;;;;;;;iBAG1B,CAAC;AAEH,MAAM,MAAM,SAAS,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,eAAe,CAAC,CAAC"}

package/dist/types/database.js

@@ -1,3 +1,5 @@
+import "../chunk-JSBRDJBE.js";
+
 // src/types/database.ts
 var Constants = {
   graphql_public: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drawnagency/primitives",
-  "version": "0.1.56",
+  "version": "0.1.58",
   "type": "module",
   "exports": {
     "./package.json": "./package.json",
@@ -16,6 +16,10 @@
       "types": "./dist/schemas/auth.d.ts",
       "default": "./dist/schemas/auth.js"
     },
+    "./schemas/block": {
+      "types": "./dist/schemas/block.d.ts",
+      "default": "./dist/schemas/block.js"
+    },
     "./schemas/link": {
       "types": "./dist/schemas/link.d.ts",
       "default": "./dist/schemas/link.js"
@@ -32,6 +36,18 @@
       "types": "./dist/lib/env.d.ts",
       "default": "./dist/lib/env.js"
     },
+    "./lib/registry": {
+      "types": "./dist/lib/registry.d.ts",
+      "default": "./dist/lib/registry.js"
+    },
+    "./lib/migrate-sections-transform": {
+      "types": "./dist/lib/migrate-sections-transform.d.ts",
+      "default": "./dist/lib/migrate-sections-transform.js"
+    },
+    "./components/sections/register-schemas": {
+      "types": "./dist/components/sections/register-schemas.d.ts",
+      "default": "./dist/components/sections/register-schemas.js"
+    },
     "./auth": {
       "types": "./dist/auth/index.d.ts",
       "default": "./dist/auth/index.js"

package/src/components/brandguide/Colors.tsx

@@ -1,7 +1,7 @@
 import { useState, useEffect } from "react";
 import { Eye, EyeOff } from "lucide-react";
 import { cn } from "../../lib/cn";
-import { gridColsClass } from "../../lib/grid";
+import { containerGridClass } from "../../lib/container-grid";
 import { EditableGrid } from "../primitives/EditableGrid";
 import { EditablePlainText } from "../primitives/EditablePlainText";
 import type { ReactNode } from "react";
@@ -119,40 +119,42 @@ function ColorsView({
         </div>
       )}
 
-      <div className={cn("grid gap-4", gridColsClass[columns] || "grid-cols-3")}>
-        {colors.map((color, i) => {
-          const hex = color.spaces[0]?.hex;
-          const contrast = getContrastClass(hex);
-          return (
-            <div key={i} className="overflow-hidden rounded-md border border-base-200">
-              <div className={cn("relative flex min-h-[80px] items-end p-3", contrast)} style={{ backgroundColor: hex || "#ccc" }}>
-                {color.name && <span className="text-sm font-bold">{color.name}</span>}
-                {copiedIndex === i && (
-                  <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",
-                  )}>
-                    Copied!
-                  </span>
-                )}
-              </div>
-              {expanded && (
-                <div className="space-y-1 bg-base-accent p-3 text-sm">
-                  {color.spaces.map((space, j) =>
-                    Object.entries(space).map(([key, value]) =>
-                      value ? (
-                        <button key={`${j}-${key}`} onClick={() => handleCopy(value, i)} className="cursor-pointer flex w-full justify-between hover:text-primary">
-                          <span className="font-medium uppercase">{key}</span>
-                          <span>{value}</span>
-                        </button>
-                      ) : null
-                    )
+      <div className="@container">
+        <div className={cn("grid gap-4", containerGridClass[columns] || containerGridClass[3])}>
+          {colors.map((color, i) => {
+            const hex = color.spaces[0]?.hex;
+            const contrast = getContrastClass(hex);
+            return (
+              <div key={i} className="overflow-hidden rounded-md border border-base-200">
+                <div className={cn("relative flex min-h-[80px] items-end p-3", contrast)} style={{ backgroundColor: hex || "#ccc" }}>
+                  {color.name && <span className="text-sm font-bold">{color.name}</span>}
+                  {copiedIndex === i && (
+                    <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",
+                    )}>
+                      Copied!
+                    </span>
                   )}
                 </div>
-              )}
-            </div>
-          );
-        })}
+                {expanded && (
+                  <div className="space-y-1 bg-base-accent p-3 text-sm">
+                    {color.spaces.map((space, j) =>
+                      Object.entries(space).map(([key, value]) =>
+                        value ? (
+                          <button key={`${j}-${key}`} onClick={() => handleCopy(value, i)} className="cursor-pointer flex w-full justify-between hover:text-primary">
+                            <span className="font-medium uppercase">{key}</span>
+                            <span>{value}</span>
+                          </button>
+                        ) : null
+                      )
+                    )}
+                  </div>
+                )}
+              </div>
+            );
+          })}
+        </div>
       </div>
     </div>
   );

package/src/components/editor/ChildBlockWrapper.tsx

@@ -0,0 +1,108 @@
+import { forwardRef, type ReactNode, type Ref } from "react";
+import type { Edge } from "@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge";
+import { CopyPlus } from "lucide-react";
+import { DragHandle } from "./DragHandle";
+import { DeleteButton } from "./DeleteButton";
+import { SettingsButton } from "./SettingsButton";
+import { ColSpanControl } from "./ColSpanControl";
+import { cn } from "../../lib/cn";
+
+export interface ChildBlockWrapperProps {
+  label: string;
+  columns: number;
+  colSpan: number;
+  closestEdge: Edge | null;
+  isDragging: boolean;
+  hasSettings: boolean;
+  /** Forwarded to the drag handle button (pragmatic-dnd dragHandle target). */
+  dragHandleRef?: Ref<HTMLButtonElement>;
+  onDelete: () => void;
+  onDuplicate: () => void;
+  onColSpanChange: (span: number) => void;
+  onOpenSettings?: () => void;
+  children: ReactNode;
+}
+
+export const ChildBlockWrapper = forwardRef<HTMLDivElement, ChildBlockWrapperProps>(
+  function ChildBlockWrapper(
+    {
+      label,
+      columns,
+      colSpan,
+      closestEdge,
+      isDragging,
+      hasSettings,
+      dragHandleRef,
+      onDelete,
+      onDuplicate,
+      onColSpanChange,
+      onOpenSettings,
+      children,
+    },
+    ref,
+  ) {
+    return (
+      <div
+        ref={ref}
+        className={cn(
+          "group/childblock relative h-full rounded-sm",
+          isDragging && "opacity-50",
+          "hover:outline hover:outline-2 hover:outline-primary/30",
+        )}
+      >
+        {/* Controls — vertical rail in the cell's LEFT gutter. Revealed on hover OR
+            focus-within, so an open col-span popover (which traps focus) keeps the rail
+            visible even when the pointer moves off the block to reach an option. */}
+        <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">
+          <span className="sr-only">{label}</span>
+          <div className="pointer-events-auto">
+            <DragHandle ref={dragHandleRef} />
+          </div>
+          <div className="pointer-events-auto">
+            <ColSpanControl colSpan={colSpan} columns={columns} onChange={onColSpanChange} />
+          </div>
+          {hasSettings && onOpenSettings && (
+            <div className="pointer-events-auto">
+              <SettingsButton onClick={onOpenSettings} />
+            </div>
+          )}
+          <div className="pointer-events-auto">
+            <button
+              type="button"
+              aria-label="Duplicate block"
+              onClick={onDuplicate}
+              className="cursor-pointer rounded p-1 text-base-contrast-light hover:text-primary"
+            >
+              <CopyPlus size={16} />
+            </button>
+          </div>
+          <div className="pointer-events-auto">
+            <DeleteButton onDelete={onDelete} />
+          </div>
+        </div>
+
+        {/* Drop-edge indicators */}
+        {closestEdge === "left" && (
+          <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" && (
+          <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" && (
+          <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" && (
+          <div data-drop-edge="bottom" className="absolute left-0 right-0 bottom-0 z-10 h-0.5 translate-y-1 bg-primary" />
+        )}
+
+        {children}
+      </div>
+    );
+  },
+);

package/src/components/editor/ColSpanControl.tsx

@@ -0,0 +1,56 @@
+import { useRef, useState } from "react";
+import { Columns3 } from "lucide-react";
+import { Popover } from "../shared/Popover";
+import { PopoverItem } from "../shared/PopoverItem";
+import { cn } from "../../lib/cn";
+
+interface ColSpanControlProps {
+  colSpan: number;
+  columns: number;
+  onChange: (span: number) => void;
+}
+
+/** Contextual col-span picker — only meaningful inside a multi-column container. */
+export function ColSpanControl({ colSpan, columns, onChange }: ColSpanControlProps) {
+  const buttonRef = useRef<HTMLButtonElement>(null);
+  const [open, setOpen] = useState(false);
+
+  if (columns <= 1) return null;
+
+  const current = Math.min(Math.max(colSpan, 1), columns);
+
+  return (
+    <div className="relative">
+      <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"
+      >
+        <Columns3 size={14} />
+      </button>
+
+      <Popover isOpen={open} onClose={() => setOpen(false)} anchorRef={buttonRef} className="min-w-28">
+        <ul role="list" className="py-1">
+          {Array.from({ length: columns }, (_, i) => i + 1).map((span) => (
+            <li key={span}>
+              <PopoverItem
+                aria-current={span === current}
+                onClick={() => {
+                  onChange(span);
+                  setOpen(false);
+                }}
+                className={cn(span === current && "font-semibold text-primary")}
+              >
+                Span {span}
+              </PopoverItem>
+            </li>
+          ))}
+        </ul>
+      </Popover>
+    </div>
+  );
+}