@elytracms/studio 0.0.1

package/dist/components/builder/property-inspector.js

@@ -0,0 +1,233 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { EyeOff } from 'lucide-react';
+import { useEffect, useState } from 'react';
+import { conditionOperatorSchema, staticProp } from '@elytracms/project-graph';
+import { pathFromToken } from '@elytracms/data-binding';
+import { manifestSlots } from '@elytracms/component-registry';
+import { fieldValueValidator } from '@elytracms/cms-core';
+import { getStudioRegistry } from '@elytracms/studio/lib/registry';
+import { useData } from '@elytracms/studio/lib/data';
+import { Badge, Button, Code, Field, Input, InspectorSection, PanelHeader, Row, Select, Spacer, Stack, Text, } from '@elytracms/studio/ui';
+import { humanizeName } from '@elytracms/studio/lib/utils';
+import { componentDisplayName, conditionOperatorLabel } from '@elytracms/studio/lib/persona/labels';
+import { FieldControl } from '../cms/field-control';
+import { useBuilder } from './builder-store';
+import { LayoutSection, layoutManagedPropNames } from './layout-inspector';
+export function PropertyInspector() {
+    const builder = useBuilder();
+    const studio = getStudioRegistry();
+    const node = builder.selectedNode;
+    if (!node) {
+        return (_jsx("div", { className: "grid h-full place-items-center p-6 text-center", children: _jsx(Text, { size: "sm", tone: "muted", children: "Select a node in the tree or canvas to edit its properties." }) }));
+    }
+    const manifest = studio.registry.getManifest(node.componentId);
+    return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsxs(PanelHeader, { children: [_jsx(Text, { size: "sm", weight: "semibold", children: "Inspector" }), _jsx(Spacer, {}), _jsx(Code, { tone: "muted", title: node.componentId, children: componentDisplayName(node.componentId, manifest) })] }), _jsx("div", { className: "min-h-0 flex-1 overflow-auto", children: _jsx(SettingsTab, { node: node, manifest: manifest }) })] }));
+}
+/** The full property surface: node identity, static props, condition, slots. */
+function SettingsTab({ node, manifest, }) {
+    // Container layout props render in the dedicated Layout section (EC-162),
+    // not as a second set of generic controls.
+    const layoutManaged = new Set(layoutManagedPropNames(node));
+    // EC-190: `blocks` props are slots (named child regions), edited via the page
+    // tree / composition surface, not as a scalar control — so they show in the
+    // Slots section, not Props.
+    const props = manifest
+        ? Object.entries(manifest.props).filter(([name, spec]) => !layoutManaged.has(name) && spec.type !== 'blocks')
+        : [];
+    const slots = manifest ? manifestSlots(manifest) : [];
+    return (_jsxs(_Fragment, { children: [_jsx(LayoutSection, { node: node }), !manifest ? (_jsxs("div", { className: "p-3", children: [_jsx(Badge, { variant: "error", children: "unknown component" }), _jsx(Text, { size: "xs", tone: "muted", className: "mt-2", children: "No manifest is registered for this component, so its props can't be edited." })] })) : (_jsx(InspectorSection, { title: "Props", children: props.length === 0 ? (_jsx(Text, { size: "xs", tone: "subtle", children: "No editable props." })) : (_jsx(Stack, { gap: "4", children: props.map(([name, spec]) => (
+                    // Key by node id so per-node local control state never leaks
+                    // across a selection change to a same-named prop.
+                    _jsx(PropField, { node: node, name: name, spec: spec }, `${node.id}:${name}`))) })) })), _jsx(InspectorSection, { title: "Condition", children: _jsx(ConditionEditor, { node: node }) }), slots.length > 0 ? (_jsxs(InspectorSection, { title: "Slots", children: [_jsx(Stack, { gap: "1", children: slots.map((slot) => {
+                            const count = node.slots?.[slot.name]?.length ?? 0;
+                            const missing = slot.required && count === 0;
+                            return (_jsxs(Row, { gap: "2", children: [_jsx(Text, { size: "xs", title: slot.name, children: humanizeName(slot.name) }), slot.required ? (_jsx(Badge, { variant: missing ? 'error' : 'outline', children: "required" })) : null, _jsx(Spacer, {}), _jsx(Text, { size: "xs", tone: "subtle", mono: true, children: count })] }, slot.name));
+                        }) }), _jsx(Text, { size: "xs", tone: "subtle", className: "mt-2", children: "Add or reorder slot children from the page tree." })] })) : null] }));
+}
+function PropField({ node, name, spec }) {
+    const value = node.props?.[name];
+    return (_jsx(Field, { label: spec.form?.label ?? name, htmlFor: `prop-${node.id}-${name}`, children: _jsx(StaticControl, { node: node, name: name, spec: spec, value: value }) }));
+}
+function controlKind(spec) {
+    switch (spec.type) {
+        case 'boolean':
+            return 'boolean';
+        case 'number':
+            return 'number';
+        case 'select':
+            return 'select';
+        case 'richText':
+            return 'richtext';
+        // EC-195: an `asset`-typed prop (e.g. the Image `src`) picks from the asset
+        // library — never a raw asset id typed into a text box (the EC-192 persona).
+        case 'asset':
+            return 'asset';
+        // EC-253: an `object`/repeater prop reuses the CMS repeater control below.
+        case 'object':
+            return 'object';
+        // EC-262: a `relation`-typed prop (e.g. a ProductGrid's `category`) reuses the
+        // CMS relation picker — never a text box that stringifies the ref to "[object Object]".
+        case 'relation':
+            return 'relation';
+        case 'text': {
+            const c = spec.form?.control;
+            if (c === 'textarea')
+                return 'textarea';
+            if (c === 'color')
+                return 'color';
+            if (c === 'json')
+                return 'json';
+            return 'text';
+        }
+        default:
+            return 'text';
+    }
+}
+function StaticControl({ node, name, spec, value, }) {
+    const builder = useBuilder();
+    const current = value?.kind === 'static' ? value.value : spec.default;
+    const id = `prop-${node.id}-${name}`;
+    const coalesceKey = `${node.id}:${name}`;
+    function set(v) {
+        builder.dispatch({ type: 'setProp', id: node.id, name, value: staticProp(v), coalesceKey });
+    }
+    function clear() {
+        builder.dispatch({ type: 'removeProp', id: node.id, name });
+    }
+    // EC-190: validate with the prop's field-def value validator (was `spec.schema.safeParse`).
+    const valid = current === undefined || fieldValueValidator({ ...spec, name })(current);
+    // EC-190: derive the editor control from the field `type` + optional `form.control`.
+    const kind = controlKind(spec);
+    // Select options live on the `select` field-def (was `spec.control.options`).
+    const options = spec.type === 'select' ? spec.options : [];
+    let control;
+    if (kind === 'boolean') {
+        control = (_jsxs("label", { className: "flex h-8 items-center gap-2 text-sm", children: [_jsx("input", { id: id, type: "checkbox", checked: current === true, onChange: (e) => set(e.target.checked), className: "size-4 accent-primary" }), _jsx(Text, { size: "sm", tone: "muted", children: current === true ? 'true' : 'false' })] }));
+    }
+    else if (kind === 'select') {
+        control = (_jsx(Select, { id: id, value: String(current ?? ''), onChange: (e) => {
+                // EC-190: select option values are strings (field-def `options`).
+                const opt = options.find((o) => o.value === e.target.value);
+                set(opt ? opt.value : e.target.value);
+            }, children: options.map((opt) => (_jsx("option", { value: opt.value, children: opt.label ?? opt.value }, opt.value))) }));
+    }
+    else if (kind === 'number') {
+        control = _jsx(NumberControl, { id: id, current: current, onSet: set, onClear: clear });
+    }
+    else if (kind === 'json') {
+        control = _jsx(JsonControl, { id: id, current: current, onSet: set });
+    }
+    else if (kind === 'color') {
+        control = (_jsxs(Row, { gap: "2", children: [_jsx("input", { id: id, type: "color", value: typeof current === 'string' && /^#[0-9a-f]{6}$/i.test(current) ? current : '#000000', onChange: (e) => set(e.target.value), className: "h-8 w-10 shrink-0 rounded-md border border-input bg-background" }), _jsx(Input, { value: typeof current === 'string' ? current : '', onChange: (e) => set(e.target.value) })] }));
+    }
+    else if (kind === 'textarea' || kind === 'richtext') {
+        control = (_jsx("textarea", { id: id, rows: 2, value: typeof current === 'string' ? current : '', onChange: (e) => set(e.target.value), className: "flex w-full rounded-md border border-input bg-background px-2.5 py-1.5 text-sm text-foreground shadow-sm focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/40 outline-none" }));
+    }
+    else if (kind === 'asset' || kind === 'object' || kind === 'relation') {
+        // EC-195/EC-253/EC-262: reuse the CMS field control. `asset` = library picker +
+        // preview; `object` = the nested/repeater form; `relation` = the document picker
+        // (resolves the ref to its title, instead of stringifying it to "[object Object]").
+        // All edit a structured static prop value through the same shared control documents use.
+        control = (_jsx(FieldControl, { id: id, field: { ...spec, name }, value: current, onChange: (v) => (v === undefined || v === null ? clear() : set(v)), readOnly: false }));
+    }
+    else {
+        control = (_jsx(Input, { id: id, value: typeof current === 'string' ? current : String(current ?? ''), onChange: (e) => set(e.target.value) }));
+    }
+    return (_jsxs(Stack, { gap: "1", children: [control, !valid ? (_jsx(Text, { size: "xs", className: "text-destructive", children: "Value doesn't match the prop schema \u2014 the canvas falls back to the default." })) : null] }));
+}
+/** Number input with a local buffer: commits only finite values, never NaN; empty clears the prop. */
+function NumberControl({ id, current, onSet, onClear, }) {
+    const [raw, setRaw] = useState(typeof current === 'number' ? String(current) : '');
+    useEffect(() => {
+        setRaw(typeof current === 'number' ? String(current) : '');
+    }, [current]);
+    return (_jsx(Input, { id: id, type: "number", value: raw, onChange: (e) => {
+            const v = e.target.value;
+            setRaw(v);
+            if (v.trim() === '') {
+                onClear();
+                return;
+            }
+            const n = Number(v);
+            if (Number.isFinite(n))
+                onSet(n);
+        } }));
+}
+/** JSON textarea with a local buffer: commits only when the text parses; flags parse errors. */
+function JsonControl({ id, current, onSet, }) {
+    const [raw, setRaw] = useState(() => JSON.stringify(current ?? null));
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        setRaw(JSON.stringify(current ?? null));
+        setError(null);
+    }, [current]);
+    return (_jsxs(Stack, { gap: "1", children: [_jsx("textarea", { id: id, rows: 3, value: raw, onChange: (e) => {
+                    const v = e.target.value;
+                    setRaw(v);
+                    try {
+                        onSet(JSON.parse(v));
+                        setError(null);
+                    }
+                    catch {
+                        setError('Invalid JSON');
+                    }
+                }, className: "flex w-full rounded-md border border-input bg-background px-2.5 py-1.5 font-mono text-xs text-foreground shadow-sm focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/40 outline-none" }), error ? (_jsx(Text, { size: "xs", className: "text-destructive", children: error })) : null] }));
+}
+/** Plain-language label for a stored data path ("item 1 → title") — no raw syntax. */
+function friendlyPathLabel(token) {
+    const path = pathFromToken(token);
+    if (path === undefined)
+        return 'this data';
+    if (path.length === 0)
+        return 'Everything';
+    return path
+        .map((seg) => (/^\d+$/.test(seg) ? `entry ${Number(seg) + 1}` : humanizeName(seg)))
+        .join(' → ');
+}
+/** Edit a node's render condition (EC-088): source field + operator + comparison value. */
+function ConditionEditor({ node }) {
+    const builder = useBuilder();
+    const data = useData();
+    const condition = node.condition;
+    const firstSource = data.sources[0];
+    if (!condition) {
+        return (_jsxs(Stack, { gap: "2", children: [_jsx(Text, { size: "xs", tone: "subtle", children: "This node always renders. Add a condition to gate it on a data value." }), _jsxs(Button, { size: "sm", variant: "outline", className: "w-fit", disabled: !firstSource, onClick: () => firstSource &&
+                        builder.dispatch({
+                            type: 'setCondition',
+                            id: node.id,
+                            condition: {
+                                source: { sourceId: firstSource.id, token: '/', mode: 'value' },
+                                operator: 'truthy',
+                            },
+                        }), children: [_jsx(EyeOff, {}), " Add condition"] })] }));
+    }
+    const updateCondition = (patch) => builder.dispatch({ type: 'setCondition', id: node.id, condition: { ...condition, ...patch } });
+    const updateSource = (patch) => updateCondition({ source: { ...condition.source, ...patch } });
+    const tokens = data.tokensOf(condition.source.sourceId);
+    const source = data.getSource(condition.source.sourceId);
+    const needsValue = !['truthy', 'exists'].includes(condition.operator);
+    const result = data.resolveCondition(condition);
+    const pass = result.kind === 'condition' ? result.pass : false;
+    const issue = result.kind === 'issue' ? result.issue : null;
+    return (_jsxs(Stack, { gap: "2", children: [_jsx(Field, { label: "Source", htmlFor: `cond-src-${node.id}`, children: _jsxs(Select, { id: `cond-src-${node.id}`, value: condition.source.sourceId, onChange: (e) => updateSource({ sourceId: e.target.value, token: '/' }), children: [data.sources.map((s) => (_jsx("option", { value: s.id, children: s.label }, s.id))), !source ? (_jsx("option", { value: condition.source.sourceId, title: condition.source.sourceId, children: "Missing data source" })) : null] }) }), _jsxs(Row, { gap: "2", children: [_jsx(Field, { label: "Field", htmlFor: `cond-token-${node.id}`, className: "min-w-0 flex-1", children: _jsxs(Select, { id: `cond-token-${node.id}`, value: condition.source.token, onChange: (e) => updateSource({ token: e.target.value }), children: [tokens.map((t) => (_jsx("option", { value: t, children: friendlyPathLabel(t) }, t))), !tokens.includes(condition.source.token) ? (_jsx("option", { value: condition.source.token, children: friendlyPathLabel(condition.source.token) })) : null] }) }), _jsx(Field, { label: "Operator", htmlFor: `cond-op-${node.id}`, className: "w-28", children: _jsx(Select, { id: `cond-op-${node.id}`, value: condition.operator, onChange: (e) => updateCondition({ operator: e.target.value }), children: conditionOperatorSchema.options.map((op) => (_jsx("option", { value: op, title: op, children: conditionOperatorLabel(op) }, op))) }) })] }), needsValue ? (_jsx(Field, { label: "Compare to", htmlFor: `cond-val-${node.id}`, children: _jsx(Input, { id: `cond-val-${node.id}`, value: condition.value === undefined ? '' : String(condition.value), onChange: (e) => updateCondition({ value: coerceScalar(e.target.value) }), placeholder: "value", className: "font-mono text-xs" }) })) : null, _jsxs(Row, { gap: "2", children: [issue ? (_jsx(Badge, { variant: "error", children: "broken" })) : pass ? (_jsx(Badge, { variant: "success", children: "renders" })) : (_jsxs(Badge, { variant: "warning", children: [_jsx(EyeOff, { className: "size-3" }), " hidden"] })), _jsx(Text, { size: "xs", tone: "muted", className: "min-w-0 flex-1 truncate", children: issue
+                            ? issue.message
+                            : pass
+                                ? 'Condition passes — node renders.'
+                                : 'Condition fails — node is hidden on the canvas.' }), _jsx(Spacer, {}), _jsx(Button, { size: "sm", variant: "ghost", className: "text-destructive hover:text-destructive", onClick: () => builder.dispatch({ type: 'setCondition', id: node.id, condition: undefined }), children: "Remove" })] })] }));
+}
+/** Parse a comparison-value string into a number/boolean/null when it looks like one. */
+function coerceScalar(raw) {
+    if (raw === '')
+        return '';
+    if (raw === 'true')
+        return true;
+    if (raw === 'false')
+        return false;
+    if (raw === 'null')
+        return null;
+    const n = Number(raw);
+    if (raw.trim() !== '' && Number.isFinite(n))
+        return n;
+    return raw;
+}
+//# sourceMappingURL=property-inspector.js.map

package/dist/components/builder/property-inspector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"property-inspector.js","sourceRoot":"","sources":["../../../src/components/builder/property-inspector.tsx"],"names":[],"mappings":"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"}

package/dist/components/builder/rich-text-toolbar.d.ts

@@ -0,0 +1,4 @@
+export declare function RichTextToolbar({ doc, host }: {
+    doc: Document;
+    host: HTMLElement;
+}): import("react").ReactPortal | null;

package/dist/components/builder/rich-text-toolbar.js

@@ -0,0 +1,104 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+const TOOLBAR_OFFSET_PX = 8;
+function selectionState(doc, host) {
+    const selection = doc.getSelection();
+    if (!selection || selection.rangeCount === 0 || selection.isCollapsed)
+        return null;
+    if (!host.contains(selection.anchorNode) || !host.contains(selection.focusNode))
+        return null;
+    const rect = selection.getRangeAt(0).getBoundingClientRect();
+    if (rect.width === 0 && rect.height === 0)
+        return null;
+    const anchor = selection.anchorNode;
+    const anchorElement = anchor instanceof Element ? anchor : anchor?.parentElement;
+    const link = anchorElement?.closest('a') ?? null;
+    return {
+        left: rect.left + rect.width / 2,
+        top: rect.top,
+        bold: doc.queryCommandState('bold'),
+        italic: doc.queryCommandState('italic'),
+        linkHref: link?.getAttribute('href') ?? null,
+    };
+}
+export function RichTextToolbar({ doc, host }) {
+    const [state, setState] = useState(null);
+    const [linkOpen, setLinkOpen] = useState(false);
+    const [linkDraft, setLinkDraft] = useState('');
+    const savedRangeRef = useRef(null);
+    const refresh = useCallback(() => {
+        setState(selectionState(doc, host));
+    }, [doc, host]);
+    useEffect(() => {
+        refresh();
+        doc.addEventListener('selectionchange', refresh);
+        return () => doc.removeEventListener('selectionchange', refresh);
+    }, [doc, refresh]);
+    // Close a stale link editor when the selection leaves the host entirely.
+    useEffect(() => {
+        if (!state && !linkOpen)
+            setLinkDraft('');
+    }, [state, linkOpen]);
+    const exec = useCallback((command, value) => {
+        doc.execCommand(command, false, value);
+        refresh();
+    }, [doc, refresh]);
+    const openLinkEditor = useCallback(() => {
+        const selection = doc.getSelection();
+        if (selection && selection.rangeCount > 0) {
+            savedRangeRef.current = selection.getRangeAt(0).cloneRange();
+        }
+        setLinkDraft(state?.linkHref ?? '');
+        setLinkOpen(true);
+    }, [doc, state]);
+    const applyLink = useCallback((href) => {
+        const selection = doc.getSelection();
+        const saved = savedRangeRef.current;
+        if (saved && selection) {
+            selection.removeAllRanges();
+            selection.addRange(saved);
+        }
+        const trimmed = href.trim();
+        if (trimmed.length > 0)
+            exec('createLink', trimmed);
+        else
+            exec('unlink');
+        setLinkOpen(false);
+        savedRangeRef.current = null;
+        host.focus({ preventScroll: true });
+    }, [doc, exec, host]);
+    const closeLinkEditor = useCallback(() => {
+        setLinkOpen(false);
+        savedRangeRef.current = null;
+        host.focus({ preventScroll: true });
+    }, [host]);
+    if (!state && !linkOpen)
+        return null;
+    const left = state?.left ?? savedRangeRef.current?.getBoundingClientRect().left ?? 0;
+    const top = state?.top ?? savedRangeRef.current?.getBoundingClientRect().top ?? 0;
+    return createPortal(_jsx("div", { "data-ec-rt-toolbar": "", role: "toolbar", "aria-label": "Text formatting", className: "ec-rt-toolbar", style: {
+            position: 'fixed',
+            left: Math.max(8, left),
+            top: Math.max(8, top - TOOLBAR_OFFSET_PX),
+            transform: 'translate(-50%, -100%)',
+            zIndex: 50,
+        }, onMouseDown: (e) => {
+            // Keep the host's selection/focus — except for the link input.
+            if (!e.target.closest('input'))
+                e.preventDefault();
+        }, children: linkOpen ? (_jsxs("form", { className: "ec-rt-toolbar-row", onSubmit: (e) => {
+                e.preventDefault();
+                applyLink(linkDraft);
+            }, children: [_jsx("input", { autoFocus: true, type: "text", value: linkDraft, placeholder: "https://\u2026 (empty removes)", "aria-label": "Link URL", onChange: (e) => setLinkDraft(e.target.value), onKeyDown: (e) => {
+                        if (e.key === 'Escape') {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            closeLinkEditor();
+                        }
+                    }, className: "ec-rt-toolbar-input" }), _jsx("button", { type: "submit", className: "ec-rt-toolbar-btn", "aria-label": "Apply link", children: "Set" })] })) : (_jsxs("div", { className: "ec-rt-toolbar-row", children: [_jsx(MarkButton, { label: "Bold", active: state?.bold ?? false, onClick: () => exec('bold'), children: "B" }), _jsx(MarkButton, { label: "Italic", active: state?.italic ?? false, onClick: () => exec('italic'), children: "I" }), _jsx(MarkButton, { label: "Link", active: state !== null && state.linkHref !== null, onClick: openLinkEditor, children: "Link" }), state !== null && state.linkHref !== null ? (_jsx(MarkButton, { label: "Remove link", active: false, onClick: () => exec('unlink'), children: "Unlink" })) : null] })) }), doc.body);
+}
+function MarkButton({ label, active, onClick, children, }) {
+    return (_jsx("button", { type: "button", "aria-label": label, "aria-pressed": active, title: label, onClick: onClick, className: "ec-rt-toolbar-btn", "data-active": active || undefined, children: children }));
+}
+//# sourceMappingURL=rich-text-toolbar.js.map

package/dist/components/builder/rich-text-toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rich-text-toolbar.js","sourceRoot":"","sources":["../../../src/components/builder/rich-text-toolbar.tsx"],"names":[],"mappings":"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"}

package/dist/components/builder/spacing-handles.d.ts

@@ -0,0 +1,22 @@
+import type { ComponentNode } from '@elytracms/project-graph';
+import type { GapStep } from '@elytracms/studio/lib/dnd/gap-drag';
+/**
+ * Tokenized spacing handles (EC-163, vision §3.1 / AD-10): when a Stack/Grid
+ * container is selected on the canvas, draggable gap handles appear between
+ * its children, axis-aware via the shared `containerFlowAxis`. Dragging snaps
+ * through the EC-161 spacing-token scale (`lib/dnd/gap-drag` — pure math, no
+ * pixel value can escape it) with a live plain-language label (the layout
+ * inspector's vocabulary). The drag previews imperatively on the rendered
+ * element; releasing commits exactly ONE builder dispatch — `setProp` with the
+ * token, or `removeProp` for "no gap", the identical values the inspector's
+ * gap select writes — so one undo restores, and the graph stays the single
+ * source of truth. Esc mid-drag cancels: preview reverts, nothing dispatches.
+ */
+/** Plain-language label for a gap step — the inspector's vocabulary. */
+export declare function gapStepLabel(step: GapStep): string;
+/** True when the node is a container with at least two children to space. */
+export declare function hasSpacingHandles(node: ComponentNode | null): node is ComponentNode;
+export declare function SpacingHandles({ doc, node }: {
+    doc: Document;
+    node: ComponentNode;
+}): import("react").ReactPortal;

package/dist/components/builder/spacing-handles.js

@@ -0,0 +1,213 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { DEFAULT_SLOT, isLayoutContainerNode, staticProp } from '@elytracms/project-graph';
+import { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules';
+import { containerGapStep, gapHandleSpots, gapStepCss, gapStepFromDrag, } from '@elytracms/studio/lib/dnd/gap-drag';
+import { useBuilder } from './builder-store';
+import { GAP_LABELS, GAP_NONE_LABEL } from './layout-inspector';
+/**
+ * Tokenized spacing handles (EC-163, vision §3.1 / AD-10): when a Stack/Grid
+ * container is selected on the canvas, draggable gap handles appear between
+ * its children, axis-aware via the shared `containerFlowAxis`. Dragging snaps
+ * through the EC-161 spacing-token scale (`lib/dnd/gap-drag` — pure math, no
+ * pixel value can escape it) with a live plain-language label (the layout
+ * inspector's vocabulary). The drag previews imperatively on the rendered
+ * element; releasing commits exactly ONE builder dispatch — `setProp` with the
+ * token, or `removeProp` for "no gap", the identical values the inspector's
+ * gap select writes — so one undo restores, and the graph stays the single
+ * source of truth. Esc mid-drag cancels: preview reverts, nothing dispatches.
+ */
+/** Plain-language label for a gap step — the inspector's vocabulary. */
+export function gapStepLabel(step) {
+    return step === null ? GAP_NONE_LABEL : GAP_LABELS[step];
+}
+/** The container's rendered element (the Stack/Grid div carrying the gap style). */
+function containerElementFor(doc, nodeId) {
+    const wrapper = doc.querySelector(`[data-ec-node-id="${nodeId}"]`);
+    return wrapper?.querySelector(':scope > [data-ec-primitive]') ?? null;
+}
+/**
+ * Measure the handle spots between the container's rendered children. The
+ * graph-level flow axis (`containerFlowAxis`) is tried first; when the
+ * rendered layout disagrees — a stacking Grid below the mobile breakpoint
+ * lays its "columns" out vertically — the cross axis is measured instead, so
+ * handles always sit in the gaps the editor actually sees.
+ */
+function measureSpots(doc, nodeId, flowAxis) {
+    const container = containerElementFor(doc, nodeId);
+    const win = doc.defaultView;
+    if (!container || !win)
+        return { spots: [], axis: flowAxis };
+    const children = Array.from(container.querySelectorAll(':scope > [data-ec-node-id]'));
+    if (children.length < 2)
+        return { spots: [], axis: flowAxis };
+    const rects = children.map((el) => {
+        const r = el.getBoundingClientRect();
+        return { left: r.left + win.scrollX, top: r.top + win.scrollY, width: r.width, height: r.height };
+    });
+    const along = gapHandleSpots(rects, flowAxis);
+    if (along.length > 0)
+        return { spots: along, axis: flowAxis };
+    const cross = flowAxis === 'horizontal' ? 'vertical' : 'horizontal';
+    const across = gapHandleSpots(rects, cross);
+    return across.length > 0 ? { spots: across, axis: cross } : { spots: [], axis: flowAxis };
+}
+/** True when the node is a container with at least two children to space. */
+export function hasSpacingHandles(node) {
+    return (node !== null &&
+        isLayoutContainerNode(node) &&
+        (node.slots?.[DEFAULT_SLOT]?.length ?? 0) >= 2);
+}
+const HANDLE_THICKNESS = 14;
+const HANDLE_BAR = 4;
+const HANDLE_MAX_LENGTH = 48;
+export function SpacingHandles({ doc, node }) {
+    const builder = useBuilder();
+    const { dispatch } = builder;
+    const flowAxis = containerFlowAxis(node);
+    const [measured, setMeasured] = useState({ spots: [], axis: flowAxis });
+    const [drag, setDrag] = useState(null);
+    const dragRef = useRef(null);
+    // The container's pre-drag inline gap, restored on cancel/commit (the graph
+    // re-render owns the committed value; the preview is imperative-only).
+    const inlineGapRef = useRef('');
+    // Re-measure when the graph, selection, drag preview, or iframe size change.
+    useLayoutEffect(() => {
+        const measure = () => setMeasured(measureSpots(doc, node.id, flowAxis));
+        measure();
+        const win = doc.defaultView;
+        win?.addEventListener('resize', measure);
+        return () => win?.removeEventListener('resize', measure);
+    }, [doc, node, flowAxis, builder.present, builder.viewport, drag?.step]);
+    const { spots, axis } = measured;
+    const applyPreview = useCallback((step) => {
+        const container = containerElementFor(doc, node.id);
+        if (container)
+            container.style.gap = gapStepCss(step);
+    }, [doc, node.id]);
+    const finish = useCallback((mode) => {
+        const active = dragRef.current;
+        if (!active)
+            return;
+        dragRef.current = null;
+        setDrag(null);
+        // Drop the imperative preview; the rendered graph value takes over.
+        const container = containerElementFor(doc, node.id);
+        if (container)
+            container.style.gap = inlineGapRef.current;
+        if (mode === 'commit' && active.step !== active.startStep) {
+            // Exactly one dispatch — one operations command, one undo step — and
+            // the identical prop value the inspector's gap select produces.
+            if (active.step === null) {
+                dispatch({ type: 'removeProp', id: node.id, name: 'gap' });
+            }
+            else {
+                dispatch({ type: 'setProp', id: node.id, name: 'gap', value: staticProp(active.step) });
+            }
+        }
+    }, [doc, node.id, dispatch]);
+    // Esc cancels mid-drag — listen on both documents (focus may sit either side
+    // of the iframe boundary while the pointer is captured).
+    useEffect(() => {
+        if (!drag)
+            return;
+        const onKeyDown = (e) => {
+            if (e.key === 'Escape') {
+                e.preventDefault();
+                e.stopPropagation();
+                finish('cancel');
+            }
+        };
+        doc.addEventListener('keydown', onKeyDown, true);
+        document.addEventListener('keydown', onKeyDown, true);
+        return () => {
+            doc.removeEventListener('keydown', onKeyDown, true);
+            document.removeEventListener('keydown', onKeyDown, true);
+        };
+    }, [drag, doc, finish]);
+    // Cleanup on unmount/selection change mid-drag: revert, never dispatch.
+    useEffect(() => () => finish('cancel'), [finish]);
+    const onPointerDown = (spot) => (e) => {
+        if (e.button !== 0)
+            return;
+        e.preventDefault();
+        e.stopPropagation();
+        const startStep = containerGapStep(node);
+        const container = containerElementFor(doc, node.id);
+        inlineGapRef.current = container?.style.gap ?? '';
+        try {
+            e.currentTarget.setPointerCapture(e.pointerId);
+        }
+        catch {
+            // Synthetic pointer events (tests, automation) have no active pointer
+            // to capture; move/up still arrive via the handle's own listeners.
+        }
+        const next = {
+            index: spot.index,
+            startStep,
+            step: startStep,
+            startCoord: axis === 'horizontal' ? e.clientX : e.clientY,
+            labelX: spot.x,
+            labelY: spot.y,
+        };
+        dragRef.current = next;
+        setDrag(next);
+    };
+    const onPointerMove = (e) => {
+        const active = dragRef.current;
+        if (!active)
+            return;
+        const win = doc.defaultView;
+        const coord = axis === 'horizontal' ? e.clientX : e.clientY;
+        const step = gapStepFromDrag(active.startStep, coord - active.startCoord);
+        const next = {
+            ...active,
+            step,
+            labelX: e.clientX + (win?.scrollX ?? 0),
+            labelY: e.clientY + (win?.scrollY ?? 0),
+        };
+        dragRef.current = next;
+        setDrag(next);
+        applyPreview(step);
+    };
+    const horizontal = axis === 'horizontal';
+    return createPortal(_jsxs("div", { "data-ec-spacing-handles": "", children: [spots.map((spot) => {
+                const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH);
+                const active = drag?.index === spot.index;
+                return (_jsx("div", { "data-ec-gap-handle": spot.index, role: "separator", "aria-label": `Gap after child ${spot.index + 1}`, "aria-orientation": horizontal ? 'vertical' : 'horizontal', onPointerDown: onPointerDown(spot), onPointerMove: onPointerMove, onPointerUp: () => finish('commit'), onPointerCancel: () => finish('cancel'), style: {
+                        position: 'absolute',
+                        left: spot.x - (horizontal ? HANDLE_THICKNESS / 2 : length / 2),
+                        top: spot.y - (horizontal ? length / 2 : HANDLE_THICKNESS / 2),
+                        width: horizontal ? HANDLE_THICKNESS : length,
+                        height: horizontal ? length : HANDLE_THICKNESS,
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        cursor: horizontal ? 'col-resize' : 'row-resize',
+                        zIndex: 40,
+                        touchAction: 'none',
+                    }, children: _jsx("div", { style: {
+                            width: horizontal ? HANDLE_BAR : '100%',
+                            height: horizontal ? '100%' : HANDLE_BAR,
+                            borderRadius: 999,
+                            backgroundColor: active ? '#5b8cff' : 'rgba(91, 140, 255, 0.65)',
+                            boxShadow: '0 0 0 1px rgba(8, 12, 24, 0.55)',
+                        } }) }, spot.index));
+            }), drag ? (_jsx("div", { "data-ec-gap-label": "", style: {
+                    position: 'absolute',
+                    left: drag.labelX + 12,
+                    top: drag.labelY + 12,
+                    zIndex: 50,
+                    pointerEvents: 'none',
+                    padding: '2px 8px',
+                    borderRadius: 6,
+                    fontSize: 11,
+                    fontWeight: 600,
+                    whiteSpace: 'nowrap',
+                    color: '#fff',
+                    backgroundColor: '#5b8cff',
+                    boxShadow: '0 2px 8px rgba(8, 12, 24, 0.4)',
+                }, children: gapStepLabel(drag.step) })) : null] }), doc.body);
+}
+//# sourceMappingURL=spacing-handles.js.map