@open-mercato/core 0.8.1-develop.7296.1.2111d779db → 0.8.1-develop.7441.1.b42958b98c

package/dist/modules/forms/backend/forms/[id]/studio/canvas/FormCanvas.js

@@ -0,0 +1,196 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { SortableContext, verticalListSortingStrategy } from "@dnd-kit/sortable";
+import { Alert } from "@open-mercato/ui/primitives/alert";
+import { Button } from "@open-mercato/ui/primitives/button";
+import {
+  linearizeFields,
+  UNGROUPED_SECTION_KEY
+} from "../schema-helpers.js";
+import { fieldDraggableId, FieldRow } from "./FieldRow.js";
+import {
+  SectionContainer,
+  SectionGridBody,
+  sectionDraggableId
+} from "./SectionContainer.js";
+import {
+  partitionPages,
+  resolveSectionViews
+} from "../../../../../services/form-version-compiler.js";
+import { computeRowLayout, readSpan } from "./row-layout.js";
+function FormCanvas({
+  schema,
+  selectedKey,
+  onSelectField,
+  onSelectSection,
+  onDeleteField,
+  onDeleteSection,
+  onMoveField,
+  onMoveSection,
+  onAdoptUngrouped,
+  onSectionTitleCommit,
+  focusSectionTitleKey,
+  onSectionTitleFocusConsumed,
+  activeLocale,
+  activeDropTarget,
+  resizeState,
+  onFieldResizeStart,
+  onFieldResizePreview,
+  onFieldResizeCommit,
+  gridRefs,
+  t
+}) {
+  const sections = React.useMemo(
+    () => resolveSectionViews(schema),
+    [schema]
+  );
+  const pages = React.useMemo(() => partitionPages(sections), [sections]);
+  const fields = React.useMemo(() => linearizeFields(schema), [schema]);
+  const claimedFields = new Set(sections.flatMap((section) => section.fieldKeys));
+  const ungroupedFields = fields.filter((entry) => !entry.sectionKey || !claimedFields.has(entry.key));
+  const sectionIds = sections.map((section) => sectionDraggableId(section.key));
+  const localGridRefs = React.useRef(/* @__PURE__ */ new Map());
+  const effectiveGridRefs = gridRefs ?? localGridRefs;
+  const registerGridRef = React.useCallback(
+    (sectionKey) => (node) => {
+      const map = effectiveGridRefs.current;
+      if (node) {
+        map.set(sectionKey, node);
+      } else {
+        map.delete(sectionKey);
+      }
+    },
+    [effectiveGridRefs]
+  );
+  if (sections.length === 0 && Object.keys(schema.properties).length === 0) {
+    return /* @__PURE__ */ jsxs(Alert, { children: [
+      /* @__PURE__ */ jsx("h3", { className: "font-medium", children: t("forms.studio.canvas.firstRun.title") }),
+      /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm", children: t("forms.studio.canvas.firstRun.body") })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsx(SortableContext, { items: sectionIds, strategy: verticalListSortingStrategy, children: sections.map((section, sectionIndex) => {
+      const pageIndex = pages.findIndex((page) => page.sectionKeys.includes(section.key));
+      const isFirstOfPage = pageIndex >= 0 && pages[pageIndex]?.sectionKeys[0] === section.key;
+      const fieldKeys = section.fieldKeys.filter((fieldKey) => schema.properties[fieldKey]);
+      const getSectionRect = () => {
+        const node = effectiveGridRefs.current.get(section.key);
+        return node ? node.getBoundingClientRect() : null;
+      };
+      return /* @__PURE__ */ jsx(
+        SectionContainer,
+        {
+          view: section,
+          isSelected: selectedKey?.kind === "section" && selectedKey.key === section.key,
+          onSelect: onSelectSection,
+          onDelete: onDeleteSection,
+          onMove: onMoveSection,
+          onTitleCommit: onSectionTitleCommit,
+          activeLocale,
+          pageIndex: isFirstOfPage ? pageIndex : null,
+          pageChipLabel: isFirstOfPage && pages.length > 1 ? t("forms.studio.canvas.page.chipLabel", { n: String(pageIndex + 1) }) : null,
+          emptyDropCopy: t("forms.studio.canvas.dropHere.field"),
+          titlePlaceholder: t("forms.studio.canvas.section.title.placeholder"),
+          deleteAriaLabel: t("forms.studio.canvas.section.delete.ariaLabel"),
+          dragHandleAriaLabel: t("forms.studio.canvas.section.dragHandle"),
+          moveUpAriaLabel: t("forms.studio.canvas.section.moveUp"),
+          moveDownAriaLabel: t("forms.studio.canvas.section.moveDown"),
+          canMoveUp: sectionIndex > 0,
+          canMoveDown: sectionIndex < sections.length - 1,
+          dropIndicator: activeDropTarget?.kind === "sortable" && activeDropTarget.id === sectionDraggableId(section.key) ? activeDropTarget.position : null,
+          t,
+          isFocusedForTitleEdit: focusSectionTitleKey === section.key,
+          onTitleEditConsumed: onSectionTitleFocusConsumed,
+          children: /* @__PURE__ */ jsx(
+            SortableContext,
+            {
+              items: fieldKeys.map((fieldKey) => fieldDraggableId(fieldKey)),
+              strategy: verticalListSortingStrategy,
+              children: (() => {
+                const spans = {};
+                for (const fieldKey of fieldKeys) {
+                  spans[fieldKey] = readSpan(schema.properties[fieldKey]?.["x-om-grid-span"]);
+                }
+                const layoutPlan = computeRowLayout({
+                  fieldKeys,
+                  spans,
+                  columns: section.columns
+                });
+                const renderField = (fieldKey, fieldIndex) => /* @__PURE__ */ jsx(
+                  FieldRow,
+                  {
+                    fieldKey,
+                    node: schema.properties[fieldKey],
+                    isSelected: selectedKey?.kind === "field" && selectedKey.key === fieldKey,
+                    onSelect: onSelectField,
+                    onDelete: onDeleteField,
+                    onMove: onMoveField,
+                    canMoveUp: fieldIndex > 0,
+                    canMoveDown: fieldIndex < fieldKeys.length - 1,
+                    dropIndicator: activeDropTarget?.kind === "sortable" && activeDropTarget.id === fieldDraggableId(fieldKey) ? activeDropTarget.position : null,
+                    dropIndicatorGap: section.gap,
+                    columns: section.columns,
+                    gap: section.gap,
+                    getSectionRect,
+                    onResizeStart: (key, startSpan) => onFieldResizeStart?.({ fieldKey: key, sectionKey: section.key, startSpan }),
+                    onResizePreview: (key, previewSpan) => onFieldResizePreview?.({ fieldKey: key, previewSpan }),
+                    onResizeCommit: (key, finalSpan) => onFieldResizeCommit?.({ fieldKey: key, finalSpan }),
+                    activeLocale,
+                    t
+                  },
+                  fieldKey
+                );
+                const sectionDropTarget = activeDropTarget && activeDropTarget.kind !== "sortable" && activeDropTarget.sectionKey === section.key ? activeDropTarget : null;
+                const sectionResize = resizeState && resizeState.sectionKey === section.key ? resizeState : null;
+                return /* @__PURE__ */ jsx(
+                  SectionGridBody,
+                  {
+                    view: section,
+                    isEmpty: fieldKeys.length === 0,
+                    emptyCopy: t("forms.studio.canvas.dropHere.field"),
+                    layoutPlan,
+                    renderField,
+                    gridDropTarget: sectionDropTarget,
+                    resizingFieldKey: sectionResize?.fieldKey ?? null,
+                    resizingPreviewSpan: sectionResize?.previewSpan ?? null,
+                    gridRef: registerGridRef(section.key),
+                    children: fieldKeys.map((fieldKey, fieldIndex) => renderField(fieldKey, fieldIndex))
+                  }
+                );
+              })()
+            }
+          )
+        },
+        section.key
+      );
+    }) }),
+    ungroupedFields.length > 0 ? /* @__PURE__ */ jsxs("section", { className: "rounded-lg border border-dashed border-border bg-muted/20 p-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "mb-3 flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-foreground", children: t("forms.studio.canvas.ungrouped.heading.label") }),
+        /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: onAdoptUngrouped, children: t("forms.studio.canvas.ungrouped.adopt.button") })
+      ] }),
+      /* @__PURE__ */ jsx("div", { "data-section-key": UNGROUPED_SECTION_KEY, className: "space-y-2", children: ungroupedFields.map((entry, index) => /* @__PURE__ */ jsx(
+        FieldRow,
+        {
+          fieldKey: entry.key,
+          node: schema.properties[entry.key],
+          isSelected: selectedKey?.kind === "field" && selectedKey.key === entry.key,
+          onSelect: onSelectField,
+          onDelete: onDeleteField,
+          onMove: onMoveField,
+          canMoveUp: index > 0,
+          canMoveDown: index < ungroupedFields.length - 1,
+          dropIndicator: null,
+          activeLocale,
+          t
+        },
+        entry.key
+      )) })
+    ] }) : null
+  ] });
+}
+export {
+  FormCanvas
+};
+//# sourceMappingURL=FormCanvas.js.map

package/dist/modules/forms/backend/forms/[id]/studio/canvas/FormCanvas.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/modules/forms/backend/forms/%5Bid%5D/studio/canvas/FormCanvas.tsx"],
+  "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'\nimport { Alert } from '@open-mercato/ui/primitives/alert'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport type { TranslateFn } from '@open-mercato/shared/lib/i18n/context'\nimport {\n  linearizeFields,\n  UNGROUPED_SECTION_KEY,\n  type FormSchema,\n} from '../schema-helpers'\nimport type { ActiveDropTarget, StudioSelection } from '../types'\nimport { fieldDraggableId, FieldRow } from './FieldRow'\nimport {\n  SectionContainer,\n  SectionGridBody,\n  sectionDraggableId,\n} from './SectionContainer'\nimport {\n  partitionPages,\n  resolveSectionViews,\n} from '../../../../../services/form-version-compiler'\nimport { computeRowLayout, readSpan } from './row-layout'\n\nexport type FieldResizeState = {\n  fieldKey: string\n  sectionKey: string\n  startSpan: 1 | 2 | 3 | 4\n  previewSpan: 1 | 2 | 3 | 4\n} | null\n\nexport function FormCanvas({\n  schema,\n  selectedKey,\n  onSelectField,\n  onSelectSection,\n  onDeleteField,\n  onDeleteSection,\n  onMoveField,\n  onMoveSection,\n  onAdoptUngrouped,\n  onSectionTitleCommit,\n  focusSectionTitleKey,\n  onSectionTitleFocusConsumed,\n  activeLocale,\n  activeDropTarget,\n  resizeState,\n  onFieldResizeStart,\n  onFieldResizePreview,\n  onFieldResizeCommit,\n  gridRefs,\n  t,\n}: {\n  schema: FormSchema\n  selectedKey: StudioSelection\n  onSelectField: (fieldKey: string) => void\n  onSelectSection: (sectionKey: string) => void\n  onDeleteField: (fieldKey: string) => void\n  onDeleteSection: (sectionKey: string) => void\n  onMoveField: (fieldKey: string, direction: 'up' | 'down') => void\n  onMoveSection: (sectionKey: string, direction: 'up' | 'down') => void\n  onAdoptUngrouped: () => void\n  onSectionTitleCommit: (sectionKey: string, title: string) => void\n  focusSectionTitleKey: string | null\n  onSectionTitleFocusConsumed: () => void\n  activeLocale: string\n  t: TranslateFn\n  activeDropTarget?: ActiveDropTarget\n  resizeState?: FieldResizeState\n  onFieldResizeStart?: (input: { fieldKey: string; sectionKey: string; startSpan: 1 | 2 | 3 | 4 }) => void\n  onFieldResizePreview?: (input: { fieldKey: string; previewSpan: 1 | 2 | 3 | 4 }) => void\n  onFieldResizeCommit?: (input: { fieldKey: string; finalSpan: 1 | 2 | 3 | 4 }) => void\n  // Phase 4 \u2014 optional ref-prop ownership: when supplied, FormCanvas writes\n  // each section's grid node into this Map so parent components can measure\n  // section width (e.g., to size the drag overlay). Falls back to a private\n  // ref when not provided so resize-from-FieldRow keeps working in isolation.\n  gridRefs?: React.MutableRefObject<Map<string, HTMLDivElement | null>>\n}) {\n  const sections = React.useMemo(\n    () => resolveSectionViews(schema as Record<string, unknown>),\n    [schema],\n  )\n  const pages = React.useMemo(() => partitionPages(sections), [sections])\n  const fields = React.useMemo(() => linearizeFields(schema), [schema])\n  const claimedFields = new Set(sections.flatMap((section) => section.fieldKeys))\n  const ungroupedFields = fields.filter((entry) => !entry.sectionKey || !claimedFields.has(entry.key))\n  const sectionIds = sections.map((section) => sectionDraggableId(section.key))\n  const localGridRefs = React.useRef<Map<string, HTMLDivElement | null>>(new Map())\n  const effectiveGridRefs = gridRefs ?? localGridRefs\n  const registerGridRef = React.useCallback(\n    (sectionKey: string) => (node: HTMLDivElement | null) => {\n      const map = effectiveGridRefs.current\n      if (node) {\n        map.set(sectionKey, node)\n      } else {\n        map.delete(sectionKey)\n      }\n    },\n    [effectiveGridRefs],\n  )\n\n  if (sections.length === 0 && Object.keys(schema.properties).length === 0) {\n    return (\n      <Alert>\n        <h3 className=\"font-medium\">{t('forms.studio.canvas.firstRun.title')}</h3>\n        <p className=\"mt-1 text-sm\">{t('forms.studio.canvas.firstRun.body')}</p>\n      </Alert>\n    )\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      <SortableContext items={sectionIds} strategy={verticalListSortingStrategy}>\n        {sections.map((section, sectionIndex) => {\n          const pageIndex = pages.findIndex((page) => page.sectionKeys.includes(section.key))\n          const isFirstOfPage =\n            pageIndex >= 0 && pages[pageIndex]?.sectionKeys[0] === section.key\n          const fieldKeys = section.fieldKeys.filter((fieldKey) => schema.properties[fieldKey])\n          const getSectionRect = () => {\n            const node = effectiveGridRefs.current.get(section.key)\n            return node ? node.getBoundingClientRect() : null\n          }\n          return (\n            <SectionContainer\n              key={section.key}\n              view={section}\n              isSelected={selectedKey?.kind === 'section' && selectedKey.key === section.key}\n              onSelect={onSelectSection}\n              onDelete={onDeleteSection}\n              onMove={onMoveSection}\n              onTitleCommit={onSectionTitleCommit}\n              activeLocale={activeLocale}\n              pageIndex={isFirstOfPage ? pageIndex : null}\n              pageChipLabel={isFirstOfPage && pages.length > 1\n                ? t('forms.studio.canvas.page.chipLabel', { n: String(pageIndex + 1) })\n                : null}\n              emptyDropCopy={t('forms.studio.canvas.dropHere.field')}\n              titlePlaceholder={t('forms.studio.canvas.section.title.placeholder')}\n              deleteAriaLabel={t('forms.studio.canvas.section.delete.ariaLabel')}\n              dragHandleAriaLabel={t('forms.studio.canvas.section.dragHandle')}\n              moveUpAriaLabel={t('forms.studio.canvas.section.moveUp')}\n              moveDownAriaLabel={t('forms.studio.canvas.section.moveDown')}\n              canMoveUp={sectionIndex > 0}\n              canMoveDown={sectionIndex < sections.length - 1}\n              dropIndicator={\n                activeDropTarget?.kind === 'sortable' &&\n                activeDropTarget.id === sectionDraggableId(section.key)\n                  ? activeDropTarget.position\n                  : null\n              }\n              t={t}\n              isFocusedForTitleEdit={focusSectionTitleKey === section.key}\n              onTitleEditConsumed={onSectionTitleFocusConsumed}\n            >\n              <SortableContext\n                items={fieldKeys.map((fieldKey) => fieldDraggableId(fieldKey))}\n                strategy={verticalListSortingStrategy}\n              >\n                {(() => {\n                  const spans: Record<string, number | undefined> = {}\n                  for (const fieldKey of fieldKeys) {\n                    spans[fieldKey] = readSpan(schema.properties[fieldKey]?.['x-om-grid-span'])\n                  }\n                  const layoutPlan = computeRowLayout({\n                    fieldKeys,\n                    spans,\n                    columns: section.columns,\n                  })\n                  const renderField = (fieldKey: string, fieldIndex: number) => (\n                    <FieldRow\n                      key={fieldKey}\n                      fieldKey={fieldKey}\n                      node={schema.properties[fieldKey]}\n                      isSelected={selectedKey?.kind === 'field' && selectedKey.key === fieldKey}\n                      onSelect={onSelectField}\n                      onDelete={onDeleteField}\n                      onMove={onMoveField}\n                      canMoveUp={fieldIndex > 0}\n                      canMoveDown={fieldIndex < fieldKeys.length - 1}\n                      dropIndicator={\n                        activeDropTarget?.kind === 'sortable' &&\n                        activeDropTarget.id === fieldDraggableId(fieldKey)\n                          ? activeDropTarget.position\n                          : null\n                      }\n                      dropIndicatorGap={section.gap}\n                      columns={section.columns}\n                      gap={section.gap}\n                      getSectionRect={getSectionRect}\n                      onResizeStart={(key, startSpan) =>\n                        onFieldResizeStart?.({ fieldKey: key, sectionKey: section.key, startSpan })\n                      }\n                      onResizePreview={(key, previewSpan) =>\n                        onFieldResizePreview?.({ fieldKey: key, previewSpan })\n                      }\n                      onResizeCommit={(key, finalSpan) =>\n                        onFieldResizeCommit?.({ fieldKey: key, finalSpan })\n                      }\n                      activeLocale={activeLocale}\n                      t={t}\n                    />\n                  )\n                  const sectionDropTarget =\n                    activeDropTarget &&\n                    activeDropTarget.kind !== 'sortable' &&\n                    activeDropTarget.sectionKey === section.key\n                      ? activeDropTarget\n                      : null\n                  const sectionResize =\n                    resizeState && resizeState.sectionKey === section.key ? resizeState : null\n                  return (\n                    <SectionGridBody\n                      view={section}\n                      isEmpty={fieldKeys.length === 0}\n                      emptyCopy={t('forms.studio.canvas.dropHere.field')}\n                      layoutPlan={layoutPlan}\n                      renderField={renderField}\n                      gridDropTarget={sectionDropTarget}\n                      resizingFieldKey={sectionResize?.fieldKey ?? null}\n                      resizingPreviewSpan={sectionResize?.previewSpan ?? null}\n                      gridRef={registerGridRef(section.key)}\n                    >\n                      {fieldKeys.map((fieldKey, fieldIndex) => renderField(fieldKey, fieldIndex))}\n                    </SectionGridBody>\n                  )\n                })()}\n              </SortableContext>\n            </SectionContainer>\n          )\n        })}\n      </SortableContext>\n      {ungroupedFields.length > 0 ? (\n        <section className=\"rounded-lg border border-dashed border-border bg-muted/20 p-4\">\n          <div className=\"mb-3 flex items-center justify-between gap-2\">\n            <h3 className=\"text-sm font-semibold text-foreground\">\n              {t('forms.studio.canvas.ungrouped.heading.label')}\n            </h3>\n            <Button type=\"button\" variant=\"outline\" size=\"sm\" onClick={onAdoptUngrouped}>\n              {t('forms.studio.canvas.ungrouped.adopt.button')}\n            </Button>\n          </div>\n          <div data-section-key={UNGROUPED_SECTION_KEY} className=\"space-y-2\">\n            {ungroupedFields.map((entry, index) => (\n              <FieldRow\n                key={entry.key}\n                fieldKey={entry.key}\n                node={schema.properties[entry.key]}\n                isSelected={selectedKey?.kind === 'field' && selectedKey.key === entry.key}\n                onSelect={onSelectField}\n                onDelete={onDeleteField}\n                onMove={onMoveField}\n                canMoveUp={index > 0}\n                canMoveDown={index < ungroupedFields.length - 1}\n                dropIndicator={null}\n                activeLocale={activeLocale}\n                t={t}\n              />\n            ))}\n          </div>\n        </section>\n      ) : null}\n    </div>\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/modules/forms/backend/forms/[id]/studio/canvas/GridSlot.js

@@ -0,0 +1,151 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useDroppable } from "@dnd-kit/core";
+const SECTION_DROP_PREFIX = "section-drop:";
+function sectionDropId(sectionKey, columnIndex = null) {
+  return `${SECTION_DROP_PREFIX}${sectionKey}${columnIndex === null ? "" : `:${columnIndex}`}`;
+}
+function sectionCellDropId(sectionKey, rowIndex, columnIndex) {
+  return `${SECTION_DROP_PREFIX}${sectionKey}:row:${rowIndex}:col:${columnIndex}`;
+}
+function sectionColGapDropId(sectionKey, rowIndex, columnIndex) {
+  return `${SECTION_DROP_PREFIX}${sectionKey}:row:${rowIndex}:gap:${columnIndex}`;
+}
+function sectionRowGapDropId(sectionKey, rowIndex) {
+  return `${SECTION_DROP_PREFIX}${sectionKey}:row-gap:${rowIndex}`;
+}
+function parseIntStrict(value) {
+  if (value === void 0) return null;
+  const parsed = Number.parseInt(value, 10);
+  return Number.isFinite(parsed) ? parsed : null;
+}
+function parseSectionDropId(id) {
+  if (!id.startsWith(SECTION_DROP_PREFIX)) return null;
+  const raw = id.slice(SECTION_DROP_PREFIX.length);
+  if (!raw) return null;
+  const parts = raw.split(":");
+  const sectionKey = parts[0];
+  if (!sectionKey) return null;
+  if (parts.length === 1) {
+    return { kind: "legacy", sectionKey, columnIndex: null };
+  }
+  if (parts[1] === "row-gap") {
+    const rowIndex = parseIntStrict(parts[2]);
+    if (rowIndex === null) return null;
+    return { kind: "row-gap", sectionKey, rowIndex };
+  }
+  if (parts[1] === "row" && parts.length === 5) {
+    const rowIndex = parseIntStrict(parts[2]);
+    const tag = parts[3];
+    const columnIndex = parseIntStrict(parts[4]);
+    if (rowIndex === null || columnIndex === null) return null;
+    if (tag === "col") {
+      return { kind: "cell", sectionKey, rowIndex, columnIndex };
+    }
+    if (tag === "gap") {
+      return { kind: "col-gap", sectionKey, rowIndex, columnIndex };
+    }
+    return null;
+  }
+  if (parts.length === 2) {
+    const columnIndex = parseIntStrict(parts[1]);
+    return { kind: "legacy", sectionKey, columnIndex: columnIndex === null ? null : columnIndex };
+  }
+  return null;
+}
+function GridSlot({
+  sectionKey,
+  columnIndex = null,
+  isEmpty = false,
+  copy
+}) {
+  const { isOver, setNodeRef } = useDroppable({ id: sectionDropId(sectionKey, columnIndex) });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: setNodeRef,
+      className: [
+        "rounded-md border border-dashed p-3 text-center text-xs text-muted-foreground transition-colors",
+        isEmpty ? "min-h-20" : "min-h-10",
+        isOver ? "border-primary bg-primary/10 text-foreground ring-1 ring-primary/30" : "border-border bg-muted/20"
+      ].join(" "),
+      children: copy
+    }
+  );
+}
+function SectionCellSlot({
+  sectionKey,
+  rowIndex,
+  columnIndex,
+  copy
+}) {
+  const { isOver, setNodeRef } = useDroppable({
+    id: sectionCellDropId(sectionKey, rowIndex, columnIndex)
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: setNodeRef,
+      "data-cell-row": rowIndex,
+      "data-cell-col": columnIndex,
+      className: [
+        "rounded-md border border-dashed p-3 text-center text-xs text-muted-foreground transition-colors min-h-10",
+        isOver ? "border-primary bg-primary/10 text-foreground ring-1 ring-primary/30" : "border-border bg-muted/20"
+      ].join(" "),
+      children: copy
+    }
+  );
+}
+function SectionColGapDrop({
+  sectionKey,
+  rowIndex,
+  columnIndex,
+  edge
+}) {
+  const { setNodeRef } = useDroppable({
+    id: sectionColGapDropId(sectionKey, rowIndex, columnIndex)
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: setNodeRef,
+      "aria-hidden": "true",
+      "data-col-gap-row": rowIndex,
+      "data-col-gap-col": columnIndex,
+      className: [
+        "pointer-events-none absolute top-0 bottom-0 w-2",
+        edge === "left" ? "-left-1" : "-right-1"
+      ].join(" ")
+    }
+  );
+}
+function SectionRowGapDrop({
+  sectionKey,
+  rowIndex
+}) {
+  const { setNodeRef } = useDroppable({
+    id: sectionRowGapDropId(sectionKey, rowIndex)
+  });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: setNodeRef,
+      "aria-hidden": "true",
+      "data-row-gap": rowIndex,
+      className: "pointer-events-none col-span-full h-0"
+    }
+  );
+}
+export {
+  GridSlot,
+  SECTION_DROP_PREFIX,
+  SectionCellSlot,
+  SectionColGapDrop,
+  SectionRowGapDrop,
+  parseSectionDropId,
+  sectionCellDropId,
+  sectionColGapDropId,
+  sectionDropId,
+  sectionRowGapDropId
+};
+//# sourceMappingURL=GridSlot.js.map

package/dist/modules/forms/backend/forms/[id]/studio/canvas/GridSlot.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../../src/modules/forms/backend/forms/%5Bid%5D/studio/canvas/GridSlot.tsx"],
+  "sourcesContent": ["'use client'\n\nimport { useDroppable } from '@dnd-kit/core'\n\nexport const SECTION_DROP_PREFIX = 'section-drop:'\n\nexport function sectionDropId(sectionKey: string, columnIndex: number | null = null): string {\n  return `${SECTION_DROP_PREFIX}${sectionKey}${columnIndex === null ? '' : `:${columnIndex}`}`\n}\n\nexport function sectionCellDropId(sectionKey: string, rowIndex: number, columnIndex: number): string {\n  return `${SECTION_DROP_PREFIX}${sectionKey}:row:${rowIndex}:col:${columnIndex}`\n}\n\nexport function sectionColGapDropId(sectionKey: string, rowIndex: number, columnIndex: number): string {\n  return `${SECTION_DROP_PREFIX}${sectionKey}:row:${rowIndex}:gap:${columnIndex}`\n}\n\nexport function sectionRowGapDropId(sectionKey: string, rowIndex: number): string {\n  return `${SECTION_DROP_PREFIX}${sectionKey}:row-gap:${rowIndex}`\n}\n\nexport type ParsedSectionDrop =\n  | { kind: 'legacy'; sectionKey: string; columnIndex: number | null }\n  | { kind: 'cell'; sectionKey: string; rowIndex: number; columnIndex: number }\n  | { kind: 'col-gap'; sectionKey: string; rowIndex: number; columnIndex: number }\n  | { kind: 'row-gap'; sectionKey: string; rowIndex: number }\n\nfunction parseIntStrict(value: string | undefined): number | null {\n  if (value === undefined) return null\n  const parsed = Number.parseInt(value, 10)\n  return Number.isFinite(parsed) ? parsed : null\n}\n\nexport function parseSectionDropId(id: string): ParsedSectionDrop | null {\n  if (!id.startsWith(SECTION_DROP_PREFIX)) return null\n  const raw = id.slice(SECTION_DROP_PREFIX.length)\n  if (!raw) return null\n  const parts = raw.split(':')\n  const sectionKey = parts[0]\n  if (!sectionKey) return null\n\n  if (parts.length === 1) {\n    return { kind: 'legacy', sectionKey, columnIndex: null }\n  }\n\n  if (parts[1] === 'row-gap') {\n    const rowIndex = parseIntStrict(parts[2])\n    if (rowIndex === null) return null\n    return { kind: 'row-gap', sectionKey, rowIndex }\n  }\n\n  if (parts[1] === 'row' && parts.length === 5) {\n    const rowIndex = parseIntStrict(parts[2])\n    const tag = parts[3]\n    const columnIndex = parseIntStrict(parts[4])\n    if (rowIndex === null || columnIndex === null) return null\n    if (tag === 'col') {\n      return { kind: 'cell', sectionKey, rowIndex, columnIndex }\n    }\n    if (tag === 'gap') {\n      return { kind: 'col-gap', sectionKey, rowIndex, columnIndex }\n    }\n    return null\n  }\n\n  if (parts.length === 2) {\n    const columnIndex = parseIntStrict(parts[1])\n    return { kind: 'legacy', sectionKey, columnIndex: columnIndex === null ? null : columnIndex }\n  }\n\n  return null\n}\n\nexport function GridSlot({\n  sectionKey,\n  columnIndex = null,\n  isEmpty = false,\n  copy,\n}: {\n  sectionKey: string\n  columnIndex?: number | null\n  isEmpty?: boolean\n  copy: string\n}) {\n  const { isOver, setNodeRef } = useDroppable({ id: sectionDropId(sectionKey, columnIndex) })\n  return (\n    <div\n      ref={setNodeRef}\n      className={[\n        'rounded-md border border-dashed p-3 text-center text-xs text-muted-foreground transition-colors',\n        isEmpty ? 'min-h-20' : 'min-h-10',\n        isOver ? 'border-primary bg-primary/10 text-foreground ring-1 ring-primary/30' : 'border-border bg-muted/20',\n      ].join(' ')}\n    >\n      {copy}\n    </div>\n  )\n}\n\nexport function SectionCellSlot({\n  sectionKey,\n  rowIndex,\n  columnIndex,\n  copy,\n}: {\n  sectionKey: string\n  rowIndex: number\n  columnIndex: number\n  copy: string\n}) {\n  const { isOver, setNodeRef } = useDroppable({\n    id: sectionCellDropId(sectionKey, rowIndex, columnIndex),\n  })\n  return (\n    <div\n      ref={setNodeRef}\n      data-cell-row={rowIndex}\n      data-cell-col={columnIndex}\n      className={[\n        'rounded-md border border-dashed p-3 text-center text-xs text-muted-foreground transition-colors min-h-10',\n        isOver ? 'border-primary bg-primary/10 text-foreground ring-1 ring-primary/30' : 'border-border bg-muted/20',\n      ].join(' ')}\n    >\n      {copy}\n    </div>\n  )\n}\n\nexport function SectionColGapDrop({\n  sectionKey,\n  rowIndex,\n  columnIndex,\n  edge,\n}: {\n  sectionKey: string\n  rowIndex: number\n  columnIndex: number\n  edge: 'left' | 'right'\n}) {\n  const { setNodeRef } = useDroppable({\n    id: sectionColGapDropId(sectionKey, rowIndex, columnIndex),\n  })\n  return (\n    <div\n      ref={setNodeRef}\n      aria-hidden=\"true\"\n      data-col-gap-row={rowIndex}\n      data-col-gap-col={columnIndex}\n      className={[\n        'pointer-events-none absolute top-0 bottom-0 w-2',\n        edge === 'left' ? '-left-1' : '-right-1',\n      ].join(' ')}\n    />\n  )\n}\n\nexport function SectionRowGapDrop({\n  sectionKey,\n  rowIndex,\n}: {\n  sectionKey: string\n  rowIndex: number\n}) {\n  const { setNodeRef } = useDroppable({\n    id: sectionRowGapDropId(sectionKey, rowIndex),\n  })\n  return (\n    <div\n      ref={setNodeRef}\n      aria-hidden=\"true\"\n      data-row-gap={rowIndex}\n      className=\"pointer-events-none col-span-full h-0\"\n    />\n  )\n}\n"],
+  "mappings": "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",
+  "names": []
+}