@elytracms/studio 0.0.88 → 0.0.91

package/dist/components/builder/reuse.js.map

@@ -1 +1 @@
-{"version":3,"file":"reuse.js","sourceRoot":"","sources":["../../../src/components/builder/reuse.ts"],"names":[],"mappings":"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","sourcesContent":["import { manifestPropFields } from '@elytracms/core/component-registry'\nimport type { ComponentManifest } from '@elytracms/core/component-registry'\nimport { readDocumentRef, seedDefaults, titleFieldOf } from '@elytracms/core/cms-core'\nimport type { CollectionDef, DocumentRef } from '@elytracms/core/cms-core'\nimport { editBlockRoots, isStaticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport type { CustomizationIssue, CustomizationMessageRef } from '@elytracms/core/studio-core'\nimport { slugify } from '@elytracms/studio/lib/utils'\n\n/**\n * The reuse capability (EC-282): the engine-generic description of how a project\n * models reusable elements. **AD-a (EC-467): reusable elements are SINGULAR per\n * project** — exactly one embed component and exactly one reusable collection.\n * Multiple reuse collections are deliberately not supported, which is why this is\n * one value and never a list.\n *\n * The capability is normally DERIVED from config (manifests + collections) — no\n * declaration needed, so a consumer that already has a transcluding embed gets the\n * in-canvas gestures for free (the EC-296 \"works automatically\" pattern). The\n * derivation predicate for a \"reusable embed\" component: it contributes no slots of\n * its own and has exactly ONE `relation` prop (cardinality `one`) whose target\n * collection holds a `blocks` field — i.e. it embeds a single document and renders\n * that document's composition by transclusion (EC-254/EC-281). For Konditorei that\n * is uniquely `project.Reusable` → `element` → `reusable.content`.\n *\n * EC-462 — the predicate additionally DISQUALIFIES a candidate whose own manifest\n * explicitly declares its relation prop to be something other than an embed\n * pointer. The shape test alone proved unsound the moment a relation prop's\n * target collection gains a `blocks` field of its own (a category/page with a\n * canvas — a completely natural content shape): the EC-276 sprint's ProductGrid\n * and the demo's OptionBox were both claimed as \"the embed\", so their ordinary\n * relation picks rendered the reusable-element placeholder, grew Detach/Make-\n * reusable gestures, and fed embed-worded publish-integrity issues. Two\n * explicit-declaration disqualifiers close the observed class:\n *\n * - a manifest with a `listing` declaration is a QUERY host (EC-255) — its\n *   relation prop is the query's filter source (`listing.filter.fromProp`),\n *   never a transclusion pointer;\n * - a relation prop with `form.hidden` (predicate or `true`) is conditional/\n *   auxiliary — EC-394 strips a hidden relation's ref at publish, so it cannot\n *   coherently be what the component transcludes.\n *\n * Both read only the CANDIDATE manifest's own declarations (never the target's\n * contents) and can only EXCLUDE, so a genuine pure embed (which declares\n * neither) is always kept. EC-462's residual — a bare unconditional\n * single-relation display component (e.g. a page teaser) is at rest\n * indistinguishable from a genuine embed — is closed by EC-467's optional\n * {@link StudioReuseConfig} declaration: a project that hits ambiguity declares\n * its way out, and the ambiguity is LOUD instead of silently disabling the\n * gestures. See {@link resolveReuse}.\n */\nexport interface ReuseCapability {\n  /** The embed component, e.g. `project.Reusable`. */\n  embedComponentId: string\n  /** The embed's relation prop that points at the reusable document, e.g. `element`. */\n  relationProp: string\n  /** The collection reusable documents live in, e.g. `reusable`. */\n  collectionId: string\n  /** The collection's composition field the embed transcludes, e.g. `content`. */\n  contentField: string\n  /** Whether that field holds a single block or a list. */\n  contentCardinality: 'one' | 'many'\n}\n\n/**\n * EC-467 (AD-b) — the OPTIONAL studio-config declaration of the reuse embed:\n * `defineStudio({ reuse: { component: 'project.Reusable' } })`. See\n * {@link import('../app-views/studio-config').StudioConfig.reuse} for the\n * consumer-facing contract; this is the shape {@link resolveReuse} consumes.\n *\n * One identifier is enough because the rest DERIVES from it (its single-document\n * relation prop → that prop's target collection → that collection's `blocks`\n * field), and because reusable elements are singular per project (AD-a).\n */\nexport interface StudioReuseConfig {\n  /** The embed component's registry id, e.g. `'project.Reusable'`. */\n  component: string\n  /**\n   * Which relation prop points at the reusable document. Needed ONLY when the\n   * declared component legitimately has more than one single-document relation\n   * prop — otherwise the sole one is derived.\n   */\n  relationProp?: string\n}\n\n/**\n * EC-467 — the resolution of the project's reuse capability: the capability (or\n * `null`), plus the config issues a developer must SEE.\n *\n * The issues ride the EC-236 {@link CustomizationIssue} surface (`point: 'reuse'`),\n * exactly like the sidebar's and the field renderers' — so they render at the\n * studio rail foot on every surface, which is the studio's home for\n * project-CONFIGURATION problems (the document-scoped Issues pane is the wrong\n * home: this is not a content problem in one document).\n *\n * EC-478: each issue carries a `messageRef` (catalog key + identifier values)\n * alongside its prebuilt English, so the rail foot renders it in the active UI\n * locale. This module stays pure — it names a key, it never calls `translate`;\n * `lib/persona/labels.ts` resolves it at the render site. That is what makes the\n * whole list localize together, which is the mixed-language outcome EC-467\n * declined to create by localizing only its own half.\n */\nexport interface ReuseResolution {\n  capability: ReuseCapability | null\n  /** Empty whenever the capability is unambiguous — including \"this project has none\". */\n  issues: CustomizationIssue[]\n}\n\n/** The customization point name stamped onto every reuse issue (EC-236 locator). */\nconst REUSE_POINT = 'reuse'\n\n/** A `relation` prop of a manifest, normalized for both resolution paths. */\ninterface RelationProp {\n  name: string\n  /** The target collection id; `undefined` when the manifest declares none. */\n  target: string | undefined\n  multiple: boolean\n  /** EC-462: `form.hidden` present and not literally `false` (predicate or `true`). */\n  conditional: boolean\n}\n\n/** Every `relation` prop of a manifest, in declaration order. */\nfunction relationPropsOf(manifest: ComponentManifest): RelationProp[] {\n  const props: RelationProp[] = []\n  for (const field of manifestPropFields(manifest)) {\n    if (field.type !== 'relation') continue\n    const hidden = field.form?.hidden\n    props.push({\n      name: field.name,\n      target: field.target,\n      multiple: field.multiple === true,\n      conditional: hidden !== undefined && hidden !== false,\n    })\n  }\n  return props\n}\n\n/**\n * The relation props a DECLARED embed could plausibly transclude through: targeted\n * and cardinality-one. A cardinality-`many` (or targetless) relation is excluded\n * structurally, not heuristically — an embed transcludes exactly one document and\n * {@link makeEmbedNode} writes exactly one `{collection,id}`, which a list-valued\n * or target-less prop cannot hold.\n */\nfunction embeddableRelationProps(manifest: ComponentManifest): TargetedRelationProp[] {\n  return relationPropsOf(manifest).filter(\n    (r): r is TargetedRelationProp => r.target !== undefined && !r.multiple,\n  )\n}\ntype TargetedRelationProp = RelationProp & { target: string }\n\n/** The collection's first composition field — what an embed of it transcludes. */\nfunction blocksFieldOf(collection: CollectionDef) {\n  const field = collection.fields.find((f) => f.type === 'blocks')\n  return field?.type === 'blocks' ? field : undefined\n}\n\n/**\n * The catalog keys for the reuse config issues (EC-478), in the `builder.reuse.config.*`\n * namespace. Named here so the producer and the catalog-parity test agree on one list.\n */\nconst REUSE_KEYS = {\n  unknownComponent: 'builder.reuse.config.unknownComponent',\n  noRelationProp: 'builder.reuse.config.noRelationProp',\n  unknownRelationProp: 'builder.reuse.config.unknownRelationProp',\n  ambiguousRelationProp: 'builder.reuse.config.ambiguousRelationProp',\n  unknownCollection: 'builder.reuse.config.unknownCollection',\n  noBlocksField: 'builder.reuse.config.noBlocksField',\n  ambiguousInference: 'builder.reuse.config.ambiguousInference',\n} as const\n\nfunction reuseIssue(\n  code: CustomizationIssue['code'],\n  severity: CustomizationIssue['severity'],\n  message: string,\n  messageRef: CustomizationMessageRef,\n  id?: string,\n): CustomizationIssue {\n  return {\n    code,\n    severity,\n    message,\n    messageRef,\n    point: REUSE_POINT,\n    ...(id === undefined ? {} : { id }),\n  }\n}\n\n/** `\"a\", \"b\"` — a readable list of prop/component ids for an issue message. */\nfunction quotedList(names: readonly string[]): string {\n  return names.map((name) => `\"${name}\"`).join(', ')\n}\n\n/**\n * The components whose SHAPE makes them plausible reuse embeds (the zero-config\n * heuristic + EC-462's disqualifiers), in manifest order. Exported for the tests\n * and for issue copy; the resolution rule lives in {@link resolveReuse}.\n */\nexport function inferredEmbedCandidates(\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n): ReuseCapability[] {\n  const matches: ReuseCapability[] = []\n  for (const manifest of manifests) {\n    if (manifest.slots.length > 0) continue\n    // EC-462: a `listing` manifest is a query host by its own declaration — its\n    // relation prop is the filter source, never an embed pointer.\n    if (manifest.listing) continue\n    // The heuristic requires the relation to be UNAMBIGUOUS within the manifest:\n    // exactly ONE relation prop of any kind, which must then be targeted,\n    // cardinality-one and unconditional. (Counting all relation props — not just\n    // the embeddable ones — is deliberate: a component with a second, list-valued\n    // relation is not the single-purpose shape the heuristic is allowed to claim.)\n    const relations = relationPropsOf(manifest)\n    const relation = relations.length === 1 ? relations[0]! : undefined\n    if (!relation || relation.target === undefined || relation.multiple || relation.conditional)\n      continue\n    const collection = collections.find((c) => c.id === relation.target)\n    if (!collection) continue\n    const blocksField = blocksFieldOf(collection)\n    if (!blocksField) continue\n    matches.push({\n      embedComponentId: manifest.id,\n      relationProp: relation.name,\n      collectionId: collection.id,\n      contentField: blocksField.name,\n      contentCardinality: blocksField.multiple === false ? 'one' : 'many',\n    })\n  }\n  return matches\n}\n\n/**\n * Resolve the DECLARED embed (EC-467, AD-b). An explicit declaration is the\n * developer's authority, so the inference disqualifiers are NOT applied here: a\n * declared component may have slots, may declare `listing`, and its relation prop\n * may be `form.hidden` — those exist to stop the engine GUESSING, not to overrule\n * a stated intent. Only structural impossibilities are issues (see AD-c row 2):\n * an unknown component id, no usable relation prop (or an ambiguous set with no\n * `relationProp`), an undefined target collection, or a target with no `blocks`\n * field — each of which would leave nothing coherent to transclude.\n */\nfunction resolveDeclaredReuse(\n  declaration: StudioReuseConfig,\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n): ReuseResolution {\n  const { component, relationProp } = declaration\n  const fail = (message: string, messageRef: CustomizationMessageRef): ReuseResolution => ({\n    capability: null,\n    issues: [reuseIssue('invalid-override', 'error', message, messageRef, component)],\n  })\n\n  const manifest = manifests.find((m) => m.id === component)\n  if (!manifest) {\n    return {\n      capability: null,\n      issues: [\n        reuseIssue(\n          'unknown-override-target',\n          'error',\n          `Reusable elements: studio config declares reuse.component \"${component}\", which is not a registered component. Fix the id, or remove the reuse block to let the studio infer the embed.`,\n          { key: REUSE_KEYS.unknownComponent, vars: { component } },\n          component,\n        ),\n      ],\n    }\n  }\n\n  const relations = embeddableRelationProps(manifest)\n  if (relations.length === 0) {\n    return fail(\n      `Reusable elements: the declared embed \"${component}\" has no single-document relation prop, so it cannot point at a reusable document. An embed needs one relation prop with cardinality one.`,\n      { key: REUSE_KEYS.noRelationProp, vars: { component } },\n    )\n  }\n  const names = relations.map((r) => r.name)\n  let relation: TargetedRelationProp\n  if (relationProp !== undefined) {\n    const named = relations.find((r) => r.name === relationProp)\n    if (!named) {\n      return fail(\n        `Reusable elements: the declared embed \"${component}\" has no single-document relation prop named \"${relationProp}\". Its relation props are: ${quotedList(names)}.`,\n        {\n          key: REUSE_KEYS.unknownRelationProp,\n          vars: { component, relationProp, props: quotedList(names) },\n        },\n      )\n    }\n    relation = named\n  } else if (relations.length === 1) {\n    relation = relations[0]!\n  } else {\n    return fail(\n      `Reusable elements: the declared embed \"${component}\" has ${relations.length} single-document relation props (${quotedList(names)}) — add reuse.relationProp to say which one points at the reusable document.`,\n      {\n        key: REUSE_KEYS.ambiguousRelationProp,\n        vars: { component, count: relations.length, props: quotedList(names) },\n      },\n    )\n  }\n\n  const collection = collections.find((c) => c.id === relation.target)\n  if (!collection) {\n    return fail(\n      `Reusable elements: \"${component}.${relation.name}\" targets the collection \"${relation.target}\", which this project does not define.`,\n      {\n        key: REUSE_KEYS.unknownCollection,\n        vars: { component, relationProp: relation.name, collection: relation.target },\n      },\n    )\n  }\n  const blocksField = blocksFieldOf(collection)\n  if (!blocksField) {\n    return fail(\n      `Reusable elements: the collection \"${collection.id}\" behind \"${component}.${relation.name}\" has no blocks (composition) field, so there is nothing for the embed to transclude.`,\n      {\n        key: REUSE_KEYS.noBlocksField,\n        vars: { component, relationProp: relation.name, collection: collection.id },\n      },\n    )\n  }\n\n  return {\n    capability: {\n      embedComponentId: manifest.id,\n      relationProp: relation.name,\n      collectionId: collection.id,\n      contentField: blocksField.name,\n      contentCardinality: blocksField.multiple === false ? 'one' : 'many',\n    },\n    issues: [],\n  }\n}\n\n/**\n * Resolve the project's ONE reuse capability (AD-a) plus any config issues —\n * EC-467's full matrix (AD-c):\n *\n * | Declaration | Candidates | Result |\n * | --- | --- | --- |\n * | present, resolves | any | the declared capability, no issue |\n * | present, does not resolve | any | `null` + an ERROR issue (misconfiguration) |\n * | absent | exactly 1 | that candidate, no issue (the zero-config default) |\n * | absent | 2 or more | `null` + a WARNING issue naming every candidate |\n * | absent | 0 | `null`, **no issue** — a project need not use reusable elements |\n *\n * Severity is the honest split: a declaration that cannot resolve is broken\n * config the developer asked for (error); inference ambiguity is nothing broken —\n * the engine declines to guess and asks for one line (warning). Both disable the\n * gestures, and both render identically in the rail's issue list.\n *\n * The zero-candidate row is deliberately silent: crying wolf at every project\n * that has no reusable elements would train developers to ignore the surface.\n */\nexport function resolveReuse(\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n  declaration?: StudioReuseConfig,\n): ReuseResolution {\n  if (declaration) return resolveDeclaredReuse(declaration, manifests, collections)\n\n  const candidates = inferredEmbedCandidates(manifests, collections)\n  if (candidates.length === 1) return { capability: candidates[0]!, issues: [] }\n  if (candidates.length === 0) return { capability: null, issues: [] }\n  return {\n    capability: null,\n    issues: [\n      reuseIssue(\n        'ambiguous-inference',\n        'warning',\n        `Reusable elements: ${candidates.length} components have the reusable-embed shape (${quotedList(\n          candidates.map((c) => c.embedComponentId),\n        )}). A project has exactly one reusable-element embed, so the studio will not guess — declare it in studio.config as reuse: { component: '<id>' }. Until then the reuse gestures are off.`,\n        {\n          key: REUSE_KEYS.ambiguousInference,\n          vars: {\n            count: candidates.length,\n            components: quotedList(candidates.map((c) => c.embedComponentId)),\n          },\n        },\n      ),\n    ],\n  }\n}\n\n/**\n * The project's reuse capability alone, or `null` when it is absent, ambiguous, or\n * misdeclared — for callers that act on the capability and do not surface config\n * issues themselves (the publish-integrity walk). The issues are surfaced ONCE, by\n * the shell rail; see {@link resolveReuse}.\n */\nexport function resolveReuseCapability(\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n  declaration?: StudioReuseConfig,\n): ReuseCapability | null {\n  return resolveReuse(manifests, collections, declaration).capability\n}\n\n/** A slug for `name`, suffixed `-2`/`-3`/… until it is free among `taken`. */\nexport function uniqueSlug(name: string, taken: ReadonlySet<string>): string {\n  const base = slugify(name) || 'element'\n  let id = base\n  for (let n = 2; taken.has(id); n += 1) id = `${base}-${n}`\n  return id\n}\n\n/**\n * The values for a new reusable document promoted from `node` (EC-282): seeded\n * defaults, the given `name` on the title field, the node on the content field,\n * and a collision-safe slug on any UNIQUE text field (e.g. Konditorei's\n * `internalId`) so the created document is publish-valid without hardcoding that\n * field's name. Other required fields, if any, are completed by the editor when\n * they open the new reusable.\n */\nexport function buildReusableValues(\n  collection: CollectionDef,\n  capability: ReuseCapability,\n  name: string,\n  node: ComponentNode,\n  existing: readonly { values?: Record<string, unknown> }[],\n): Record<string, unknown> {\n  const values: Record<string, unknown> = { ...seedDefaults(collection) }\n  const titleField = titleFieldOf(collection)?.name\n  if (titleField) values[titleField] = name\n  for (const field of collection.fields) {\n    if (\n      field.type === 'text' &&\n      field.validation?.unique === true &&\n      field.name !== titleField &&\n      field.name !== capability.contentField\n    ) {\n      const taken = new Set(\n        existing\n          .map((d) => d.values?.[field.name])\n          .filter((v): v is string => typeof v === 'string'),\n      )\n      values[field.name] = uniqueSlug(name, taken)\n    }\n  }\n  // EC-576: the converged v2 sequence holding the tagged node, through the core\n  // write path — never the pre-0.0.84 bare node/array. Cardinality is a\n  // constraint over that one shape, not a second shape (EC-500 D2).\n  values[capability.contentField] = editBlockRoots(undefined, () => [node])\n  return values\n}\n\n/**\n * The document a reuse-embed `node` targets (EC-300), or null when `node` is not the\n * embed component or has no static pick yet. Lets the canvas detect a HARD reference\n * whose target doesn't resolve (→ placeholder) without reaching into prop internals.\n */\nexport function reuseEmbedRef(node: ComponentNode, capability: ReuseCapability): DocumentRef | null {\n  if (node.componentId !== capability.embedComponentId) return null\n  const prop = node.props?.[capability.relationProp]\n  const ref = isStaticProp(prop) ? readDocumentRef(prop.value) : undefined\n  return ref ?? null\n}\n\n/**\n * Every reuse-embed target ref in a composition `blocks` value, at any depth\n * (EC-300) — the hard references a publish-integrity check walks to find\n * unpublished targets. Recurses slots; order is document order. Duplicates are\n * kept (the caller dedupes by key if needed).\n */\nexport function collectEmbedRefs(\n  blocks: readonly ComponentNode[],\n  capability: ReuseCapability,\n): DocumentRef[] {\n  const refs: DocumentRef[] = []\n  const visit = (node: ComponentNode): void => {\n    const ref = reuseEmbedRef(node, capability)\n    if (ref) refs.push(ref)\n    for (const children of Object.values(node.slots ?? {})) for (const child of children) visit(child)\n  }\n  for (const node of blocks) visit(node)\n  return refs\n}\n\n/** The `Reusable` embed node referencing the new document (id minted by the action). */\nexport function makeEmbedNode(capability: ReuseCapability, documentId: string): ComponentNode {\n  return {\n    id: 'reuse-embed',\n    componentId: capability.embedComponentId,\n    props: {\n      [capability.relationProp]: {\n        kind: 'static',\n        value: { collection: capability.collectionId, id: documentId },\n      },\n    },\n  }\n}\n"]}
+{"version":3,"file":"reuse.js","sourceRoot":"","sources":["../../../src/components/builder/reuse.ts"],"names":[],"mappings":"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","sourcesContent":["import { manifestPropFields, manifestSlots } from '@elytracms/core/component-registry'\nimport type { ComponentManifest } from '@elytracms/core/component-registry'\nimport { itemLimit, readDocumentRef, seedDefaults, titleFieldOf, writeField } from '@elytracms/core/cms-core'\nimport type { CmsDocument, CollectionDef, DocumentRef, LocaleConfig } from '@elytracms/core/cms-core'\nimport { editBlockRoots, isStaticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport type { CustomizationIssue, CustomizationMessageRef } from '@elytracms/core/studio-core'\nimport { slugify } from '@elytracms/studio/lib/utils'\n\n/**\n * The reuse capability (EC-282): the engine-generic description of how a project\n * models reusable elements. **AD-a (EC-467): reusable elements are SINGULAR per\n * project** — exactly one embed component and exactly one reusable collection.\n * Multiple reuse collections are deliberately not supported, which is why this is\n * one value and never a list.\n *\n * The capability is normally DERIVED from config (manifests + collections) — no\n * declaration needed, so a consumer that already has a transcluding embed gets the\n * in-canvas gestures for free (the EC-296 \"works automatically\" pattern). The\n * derivation predicate for a \"reusable embed\" component: it contributes no slots of\n * its own and has exactly ONE `relation` prop (cardinality `one`) whose target\n * collection holds a `blocks` field — i.e. it embeds a single document and renders\n * that document's composition by transclusion (EC-254/EC-281). For Konditorei that\n * is uniquely `project.Reusable` → `element` → `reusable.content`.\n *\n * EC-462 — the predicate additionally DISQUALIFIES a candidate whose own manifest\n * explicitly declares its relation prop to be something other than an embed\n * pointer. The shape test alone proved unsound the moment a relation prop's\n * target collection gains a `blocks` field of its own (a category/page with a\n * canvas — a completely natural content shape): the EC-276 sprint's ProductGrid\n * and the demo's OptionBox were both claimed as \"the embed\", so their ordinary\n * relation picks rendered the reusable-element placeholder, grew Detach/Make-\n * reusable gestures, and fed embed-worded publish-integrity issues. Two\n * explicit-declaration disqualifiers close the observed class:\n *\n * - a manifest with a `listing` declaration is a QUERY host (EC-255) — its\n *   relation prop feeds the query (a `{ prop }` operand of `listing.where`),\n *   never a transclusion pointer;\n * - a relation prop with `form.hidden` (predicate or `true`) is conditional/\n *   auxiliary — EC-394 strips a hidden relation's ref at publish, so it cannot\n *   coherently be what the component transcludes.\n *\n * Both read only the CANDIDATE manifest's own declarations (never the target's\n * contents) and can only EXCLUDE, so a genuine pure embed (which declares\n * neither) is always kept. EC-462's residual — a bare unconditional\n * single-relation display component (e.g. a page teaser) is at rest\n * indistinguishable from a genuine embed — is closed by EC-467's optional\n * {@link StudioReuseConfig} declaration: a project that hits ambiguity declares\n * its way out, and the ambiguity is LOUD instead of silently disabling the\n * gestures. See {@link resolveReuse}.\n */\nexport interface ReuseCapability {\n  /** The embed component, e.g. `project.Reusable`. */\n  embedComponentId: string\n  /** The embed's relation prop that points at the reusable document, e.g. `element`. */\n  relationProp: string\n  /** The collection reusable documents live in, e.g. `reusable`. */\n  collectionId: string\n  /** The collection's composition field the embed transcludes, e.g. `content`. */\n  contentField: string\n  /** Whether that field holds a single block or a list. */\n  contentCardinality: 'one' | 'many'\n}\n\n/**\n * EC-467 (AD-b) — the OPTIONAL studio-config declaration of the reuse embed:\n * `defineStudio({ reuse: { component: 'project.Reusable' } })`. See\n * {@link import('../app-views/studio-config').StudioConfig.reuse} for the\n * consumer-facing contract; this is the shape {@link resolveReuse} consumes.\n *\n * One identifier is enough because the rest DERIVES from it (its single-document\n * relation prop → that prop's target collection → that collection's `blocks`\n * field), and because reusable elements are singular per project (AD-a).\n */\nexport interface StudioReuseConfig {\n  /** The embed component's registry id, e.g. `'project.Reusable'`. */\n  component: string\n  /**\n   * Which relation prop points at the reusable document. Needed ONLY when the\n   * declared component legitimately has more than one single-document relation\n   * prop — otherwise the sole one is derived.\n   */\n  relationProp?: string\n}\n\n/**\n * EC-467 — the resolution of the project's reuse capability: the capability (or\n * `null`), plus the config issues a developer must SEE.\n *\n * The issues ride the EC-236 {@link CustomizationIssue} surface (`point: 'reuse'`),\n * exactly like the sidebar's and the field renderers' — so they render at the\n * studio rail foot on every surface, which is the studio's home for\n * project-CONFIGURATION problems (the document-scoped Issues pane is the wrong\n * home: this is not a content problem in one document).\n *\n * EC-478: each issue carries a `messageRef` (catalog key + identifier values)\n * alongside its prebuilt English, so the rail foot renders it in the active UI\n * locale. This module stays pure — it names a key, it never calls `translate`;\n * `lib/persona/labels.ts` resolves it at the render site. That is what makes the\n * whole list localize together, which is the mixed-language outcome EC-467\n * declined to create by localizing only its own half.\n */\nexport interface ReuseResolution {\n  capability: ReuseCapability | null\n  /** Empty whenever the capability is unambiguous — including \"this project has none\". */\n  issues: CustomizationIssue[]\n}\n\n/** The customization point name stamped onto every reuse issue (EC-236 locator). */\nconst REUSE_POINT = 'reuse'\n\n/** A `relation` prop of a manifest, normalized for both resolution paths. */\ninterface RelationProp {\n  name: string\n  /** The target collection id; `undefined` when the manifest declares none. */\n  target: string | undefined\n  multiple: boolean\n  /** EC-462: `form.hidden` present and not literally `false` (predicate or `true`). */\n  conditional: boolean\n}\n\n/** Every `relation` prop of a manifest, in declaration order. */\nfunction relationPropsOf(manifest: ComponentManifest): RelationProp[] {\n  const props: RelationProp[] = []\n  for (const field of manifestPropFields(manifest)) {\n    if (field.type !== 'relation') continue\n    const hidden = field.form?.hidden\n    props.push({\n      name: field.name,\n      target: field.target,\n      multiple: field.multiple === true,\n      conditional: hidden !== undefined && hidden !== false,\n    })\n  }\n  return props\n}\n\n/**\n * The relation props a DECLARED embed could plausibly transclude through: targeted\n * and cardinality-one. A cardinality-`many` (or targetless) relation is excluded\n * structurally, not heuristically — an embed transcludes exactly one document and\n * {@link makeEmbedNode} writes exactly one `{collection,id}`, which a list-valued\n * or target-less prop cannot hold.\n */\nfunction embeddableRelationProps(manifest: ComponentManifest): TargetedRelationProp[] {\n  return relationPropsOf(manifest).filter(\n    (r): r is TargetedRelationProp => r.target !== undefined && !r.multiple,\n  )\n}\ntype TargetedRelationProp = RelationProp & { target: string }\n\n/** The collection's first composition field — what an embed of it transcludes. */\nfunction blocksFieldOf(collection: CollectionDef) {\n  const field = collection.fields.find((f) => f.type === 'blocks')\n  return field?.type === 'blocks' ? field : undefined\n}\n\n/**\n * The catalog keys for the reuse config issues (EC-478), in the `builder.reuse.config.*`\n * namespace. Named here so the producer and the catalog-parity test agree on one list.\n */\nconst REUSE_KEYS = {\n  unknownComponent: 'builder.reuse.config.unknownComponent',\n  noRelationProp: 'builder.reuse.config.noRelationProp',\n  unknownRelationProp: 'builder.reuse.config.unknownRelationProp',\n  ambiguousRelationProp: 'builder.reuse.config.ambiguousRelationProp',\n  unknownCollection: 'builder.reuse.config.unknownCollection',\n  noBlocksField: 'builder.reuse.config.noBlocksField',\n  ambiguousInference: 'builder.reuse.config.ambiguousInference',\n} as const\n\nfunction reuseIssue(\n  code: CustomizationIssue['code'],\n  severity: CustomizationIssue['severity'],\n  message: string,\n  messageRef: CustomizationMessageRef,\n  id?: string,\n): CustomizationIssue {\n  return {\n    code,\n    severity,\n    message,\n    messageRef,\n    point: REUSE_POINT,\n    ...(id === undefined ? {} : { id }),\n  }\n}\n\n/** `\"a\", \"b\"` — a readable list of prop/component ids for an issue message. */\nfunction quotedList(names: readonly string[]): string {\n  return names.map((name) => `\"${name}\"`).join(', ')\n}\n\n/**\n * The components whose SHAPE makes them plausible reuse embeds (the zero-config\n * heuristic + EC-462's disqualifiers), in manifest order. Exported for the tests\n * and for issue copy; the resolution rule lives in {@link resolveReuse}.\n */\nexport function inferredEmbedCandidates(\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n): ReuseCapability[] {\n  const matches: ReuseCapability[] = []\n  for (const manifest of manifests) {\n    // EC-591 (COMPOSITION #15): the DERIVED slots — a `blocks` prop is a child\n    // region (`manifestSlots`), so a manifest with `slots: []` and a blocks prop is\n    // NOT slot-less; reading raw `manifest.slots` inferred it as a reuse embed.\n    if (manifestSlots(manifest).length > 0) continue\n    // EC-462: a `listing` manifest is a query host by its own declaration — its\n    // relation prop is the filter source, never an embed pointer.\n    if (manifest.listing) continue\n    // The heuristic requires the relation to be UNAMBIGUOUS within the manifest:\n    // exactly ONE relation prop of any kind, which must then be targeted,\n    // cardinality-one and unconditional. (Counting all relation props — not just\n    // the embeddable ones — is deliberate: a component with a second, list-valued\n    // relation is not the single-purpose shape the heuristic is allowed to claim.)\n    const relations = relationPropsOf(manifest)\n    const relation = relations.length === 1 ? relations[0]! : undefined\n    if (!relation || relation.target === undefined || relation.multiple || relation.conditional)\n      continue\n    const collection = collections.find((c) => c.id === relation.target)\n    if (!collection) continue\n    const blocksField = blocksFieldOf(collection)\n    if (!blocksField) continue\n    matches.push({\n      embedComponentId: manifest.id,\n      relationProp: relation.name,\n      collectionId: collection.id,\n      contentField: blocksField.name,\n      contentCardinality: itemLimit(blocksField) === 1 ? 'one' : 'many',\n    })\n  }\n  return matches\n}\n\n/**\n * Resolve the DECLARED embed (EC-467, AD-b). An explicit declaration is the\n * developer's authority, so the inference disqualifiers are NOT applied here: a\n * declared component may have slots, may declare `listing`, and its relation prop\n * may be `form.hidden` — those exist to stop the engine GUESSING, not to overrule\n * a stated intent. Only structural impossibilities are issues (see AD-c row 2):\n * an unknown component id, no usable relation prop (or an ambiguous set with no\n * `relationProp`), an undefined target collection, or a target with no `blocks`\n * field — each of which would leave nothing coherent to transclude.\n */\nfunction resolveDeclaredReuse(\n  declaration: StudioReuseConfig,\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n): ReuseResolution {\n  const { component, relationProp } = declaration\n  const fail = (message: string, messageRef: CustomizationMessageRef): ReuseResolution => ({\n    capability: null,\n    issues: [reuseIssue('invalid-override', 'error', message, messageRef, component)],\n  })\n\n  const manifest = manifests.find((m) => m.id === component)\n  if (!manifest) {\n    return {\n      capability: null,\n      issues: [\n        reuseIssue(\n          'unknown-override-target',\n          'error',\n          `Reusable elements: studio config declares reuse.component \"${component}\", which is not a registered component. Fix the id, or remove the reuse block to let the studio infer the embed.`,\n          { key: REUSE_KEYS.unknownComponent, vars: { component } },\n          component,\n        ),\n      ],\n    }\n  }\n\n  const relations = embeddableRelationProps(manifest)\n  if (relations.length === 0) {\n    return fail(\n      `Reusable elements: the declared embed \"${component}\" has no single-document relation prop, so it cannot point at a reusable document. An embed needs one relation prop with cardinality one.`,\n      { key: REUSE_KEYS.noRelationProp, vars: { component } },\n    )\n  }\n  const names = relations.map((r) => r.name)\n  let relation: TargetedRelationProp\n  if (relationProp !== undefined) {\n    const named = relations.find((r) => r.name === relationProp)\n    if (!named) {\n      return fail(\n        `Reusable elements: the declared embed \"${component}\" has no single-document relation prop named \"${relationProp}\". Its relation props are: ${quotedList(names)}.`,\n        {\n          key: REUSE_KEYS.unknownRelationProp,\n          vars: { component, relationProp, props: quotedList(names) },\n        },\n      )\n    }\n    relation = named\n  } else if (relations.length === 1) {\n    relation = relations[0]!\n  } else {\n    return fail(\n      `Reusable elements: the declared embed \"${component}\" has ${relations.length} single-document relation props (${quotedList(names)}) — add reuse.relationProp to say which one points at the reusable document.`,\n      {\n        key: REUSE_KEYS.ambiguousRelationProp,\n        vars: { component, count: relations.length, props: quotedList(names) },\n      },\n    )\n  }\n\n  const collection = collections.find((c) => c.id === relation.target)\n  if (!collection) {\n    return fail(\n      `Reusable elements: \"${component}.${relation.name}\" targets the collection \"${relation.target}\", which this project does not define.`,\n      {\n        key: REUSE_KEYS.unknownCollection,\n        vars: { component, relationProp: relation.name, collection: relation.target },\n      },\n    )\n  }\n  const blocksField = blocksFieldOf(collection)\n  if (!blocksField) {\n    return fail(\n      `Reusable elements: the collection \"${collection.id}\" behind \"${component}.${relation.name}\" has no blocks (composition) field, so there is nothing for the embed to transclude.`,\n      {\n        key: REUSE_KEYS.noBlocksField,\n        vars: { component, relationProp: relation.name, collection: collection.id },\n      },\n    )\n  }\n\n  return {\n    capability: {\n      embedComponentId: manifest.id,\n      relationProp: relation.name,\n      collectionId: collection.id,\n      contentField: blocksField.name,\n      contentCardinality: itemLimit(blocksField) === 1 ? 'one' : 'many',\n    },\n    issues: [],\n  }\n}\n\n/**\n * Resolve the project's ONE reuse capability (AD-a) plus any config issues —\n * EC-467's full matrix (AD-c):\n *\n * | Declaration | Candidates | Result |\n * | --- | --- | --- |\n * | present, resolves | any | the declared capability, no issue |\n * | present, does not resolve | any | `null` + an ERROR issue (misconfiguration) |\n * | absent | exactly 1 | that candidate, no issue (the zero-config default) |\n * | absent | 2 or more | `null` + a WARNING issue naming every candidate |\n * | absent | 0 | `null`, **no issue** — a project need not use reusable elements |\n *\n * Severity is the honest split: a declaration that cannot resolve is broken\n * config the developer asked for (error); inference ambiguity is nothing broken —\n * the engine declines to guess and asks for one line (warning). Both disable the\n * gestures, and both render identically in the rail's issue list.\n *\n * The zero-candidate row is deliberately silent: crying wolf at every project\n * that has no reusable elements would train developers to ignore the surface.\n */\nexport function resolveReuse(\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n  declaration?: StudioReuseConfig,\n): ReuseResolution {\n  if (declaration) return resolveDeclaredReuse(declaration, manifests, collections)\n\n  const candidates = inferredEmbedCandidates(manifests, collections)\n  if (candidates.length === 1) return { capability: candidates[0]!, issues: [] }\n  if (candidates.length === 0) return { capability: null, issues: [] }\n  return {\n    capability: null,\n    issues: [\n      reuseIssue(\n        'ambiguous-inference',\n        'warning',\n        `Reusable elements: ${candidates.length} components have the reusable-embed shape (${quotedList(\n          candidates.map((c) => c.embedComponentId),\n        )}). A project has exactly one reusable-element embed, so the studio will not guess — declare it in studio.config as reuse: { component: '<id>' }. Until then the reuse gestures are off.`,\n        {\n          key: REUSE_KEYS.ambiguousInference,\n          vars: {\n            count: candidates.length,\n            components: quotedList(candidates.map((c) => c.embedComponentId)),\n          },\n        },\n      ),\n    ],\n  }\n}\n\n/**\n * The project's reuse capability alone, or `null` when it is absent, ambiguous, or\n * misdeclared — for callers that act on the capability and do not surface config\n * issues themselves (the publish-integrity walk). The issues are surfaced ONCE, by\n * the shell rail; see {@link resolveReuse}.\n */\nexport function resolveReuseCapability(\n  manifests: readonly ComponentManifest[],\n  collections: readonly CollectionDef[],\n  declaration?: StudioReuseConfig,\n): ReuseCapability | null {\n  return resolveReuse(manifests, collections, declaration).capability\n}\n\n/** A slug for `name`, suffixed `-2`/`-3`/… until it is free among `taken`. */\nexport function uniqueSlug(name: string, taken: ReadonlySet<string>): string {\n  const base = slugify(name) || 'element'\n  let id = base\n  for (let n = 2; taken.has(id); n += 1) id = `${base}-${n}`\n  return id\n}\n\n/**\n * The values for a new reusable document promoted from `node` (EC-282): seeded\n * defaults, the given `name` on the title field, the node on the content field,\n * and a collision-safe slug on any UNIQUE text field (e.g. Konditorei's\n * `internalId`) so the created document is publish-valid without hardcoding that\n * field's name. Other required fields, if any, are completed by the editor when\n * they open the new reusable.\n *\n * EC-580: every write goes through core's `writeField` in the project's DEFAULT\n * locale — the new document is created in its default bucket, so a localized title\n * or content field lands under `localized[default]`, never on the shared bag.\n */\nexport function buildReusableValues(\n  collection: CollectionDef,\n  capability: ReuseCapability,\n  name: string,\n  node: ComponentNode,\n  existing: readonly { values?: Record<string, unknown> }[],\n  locales: LocaleConfig,\n): Pick<CmsDocument, 'values' | 'localized'> {\n  const at = locales.default\n  let doc: CmsDocument = { collection: collection.id, id: '', ...seedDefaults(collection, locales) }\n  const titleField = titleFieldOf(collection)?.name\n  if (titleField) doc = writeField(collection, doc, titleField, at, name)\n  for (const field of collection.fields) {\n    if (\n      field.type === 'text' &&\n      field.validation?.unique === true &&\n      field.name !== titleField &&\n      field.name !== capability.contentField\n    ) {\n      const taken = new Set(\n        existing\n          .map((d) => d.values?.[field.name])\n          .filter((v): v is string => typeof v === 'string'),\n      )\n      doc = writeField(collection, doc, field.name, at, uniqueSlug(name, taken))\n    }\n  }\n  // EC-576: the converged v2 sequence holding the tagged node, through the core\n  // write path — never the pre-0.0.84 bare node/array. Cardinality is a\n  // constraint over that one shape, not a second shape (EC-500 D2).\n  doc = writeField(collection, doc, capability.contentField, at, editBlockRoots(undefined, () => [node]))\n  return { values: doc.values, ...(doc.localized !== undefined ? { localized: doc.localized } : {}) }\n}\n\n/**\n * The document a reuse-embed `node` targets (EC-300), or null when `node` is not the\n * embed component or has no static pick yet. Lets the canvas detect a HARD reference\n * whose target doesn't resolve (→ placeholder) without reaching into prop internals.\n */\nexport function reuseEmbedRef(node: ComponentNode, capability: ReuseCapability): DocumentRef | null {\n  if (node.componentId !== capability.embedComponentId) return null\n  const prop = node.props?.[capability.relationProp]\n  const ref = isStaticProp(prop) ? readDocumentRef(prop.value) : undefined\n  return ref ?? null\n}\n\n/**\n * Every reuse-embed target ref in a composition `blocks` value, at any depth\n * (EC-300) — the hard references a publish-integrity check walks to find\n * unpublished targets. Recurses slots; order is document order. Duplicates are\n * kept (the caller dedupes by key if needed).\n */\nexport function collectEmbedRefs(\n  blocks: readonly ComponentNode[],\n  capability: ReuseCapability,\n): DocumentRef[] {\n  const refs: DocumentRef[] = []\n  const visit = (node: ComponentNode): void => {\n    const ref = reuseEmbedRef(node, capability)\n    if (ref) refs.push(ref)\n    for (const children of Object.values(node.slots ?? {})) for (const child of children) visit(child)\n  }\n  for (const node of blocks) visit(node)\n  return refs\n}\n\n/** The `Reusable` embed node referencing the new document (id minted by the action). */\nexport function makeEmbedNode(capability: ReuseCapability, documentId: string): ComponentNode {\n  return {\n    id: 'reuse-embed',\n    componentId: capability.embedComponentId,\n    props: {\n      [capability.relationProp]: {\n        kind: 'static',\n        value: { collection: capability.collectionId, id: documentId },\n      },\n    },\n  }\n}\n"]}

package/dist/components/builder/selection-overlay.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentNode } from '@elytracms/core/project-graph';
+import type { ComponentNode, LayoutContainerIds } from '@elytracms/core/project-graph';
 import type { InsertAffordanceApi } from './insert-affordance-context.js';
 import type { InsertPosition } from './insert-context.js';
 import type { AffordanceAnchor, FrameBarPlacement } from './canvas-overlay-geometry.js';
@@ -89,4 +89,4 @@ export declare function SelectionOverlay({ doc, editing }: {
  * rect yet or no insertable position. Exported as the pure core of the overlay's
  * affordance derivation (EC-435 AD-1: called for the selected node only).
  */
-export declare function affordanceGroup(present: ComponentNode, nodeId: string | null, rect: Rect | null, affordance: InsertAffordanceApi): AffordanceGroupView | null;
+export declare function affordanceGroup(present: ComponentNode, layout: LayoutContainerIds, nodeId: string | null, rect: Rect | null, affordance: InsertAffordanceApi): AffordanceGroupView | null;

package/dist/components/builder/selection-overlay.js

@@ -219,7 +219,7 @@ export function SelectionOverlay({ doc, editing }) {
     // A group is drawn only for a node with insertable positions, and only when no
     // drag/inline edit is live; with no provider above (component preview), none.
     const selectedAffordance = affordance && !dragging && !editing
-        ? affordanceGroup(present, selectedId, drawSelected ? geometry.selected : null, affordance)
+        ? affordanceGroup(present, builder.layout, selectedId, drawSelected ? geometry.selected : null, affordance)
         : null;
     return createPortal(_jsx(SelectionOverlayView, { selected: selectedView, hovered: drawHover ? geometry.hovered : null, affordance: selectedAffordance, propHighlight: highlight ? geometry.propHighlight : null, onMoveUp: () => run('moveUp'), onMoveDown: () => run('moveDown'), onDuplicate: () => run('duplicate'), onDelete: () => run('delete') }), doc.body);
 }
@@ -230,13 +230,13 @@ export function SelectionOverlay({ doc, editing }) {
  * rect yet or no insertable position. Exported as the pure core of the overlay's
  * affordance derivation (EC-435 AD-1: called for the selected node only).
  */
-export function affordanceGroup(present, nodeId, rect, affordance) {
+export function affordanceGroup(present, layout, nodeId, rect, affordance) {
     if (!nodeId || !rect)
         return null;
     const positions = affordance.positionsFor(nodeId);
     if (positions.length === 0)
         return null;
-    const flow = containerFlowAxis(getParentInfo(present, nodeId)?.parent);
+    const flow = containerFlowAxis(getParentInfo(present, nodeId)?.parent, layout);
     return {
         nodeId,
         items: positions.map((position) => ({ position, ...placeAffordance(rect, position, flow) })),

package/dist/components/builder/selection-overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-overlay.js","sourceRoot":"","sources":["../../../src/components/builder/selection-overlay.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useLayoutEffect, useState } from 'react'\nimport type { CSSProperties, ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\nimport { getNode, getParentInfo } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { translate, useUiLocale } from '@elytracms/studio/lib/i18n'\nimport { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport { useBuilder } from './builder-store'\nimport { activeDrag, onDragSessionEnd, onDragSessionStart } from './drag-session'\nimport { useInsertAffordance } from './insert-affordance-context'\nimport type { InsertAffordanceApi } from './insert-affordance-context'\nimport type { InsertPosition } from './insert-context'\nimport type { AffordanceAnchor, FrameBarPlacement, FrameControlKind } from './canvas-overlay-geometry'\nimport {\n  FRAME_BAR_HEIGHT,\n  frameControlAction,\n  frameControlsFor,\n  placeAffordance,\n  placeFrameBar,\n} from './canvas-overlay-geometry'\nimport {\n  createRectTracker,\n  measureNodeRect,\n  measurePropRect,\n  rectsEqual,\n  scheduleFrame,\n  subscribeCanvasLayout,\n} from './canvas-rect-tracking'\nimport type { Rect } from './canvas-rect-tracking'\nimport { usePropSync } from './prop-sync-context'\nimport { nodeDisplayTitle } from './node-title'\n\n/**\n * Canvas selection/hover overlay (EC-404) — a topmost layer portaled into the\n * iframe `body` that draws the selection and hover frames ABOVE the page from\n * measured node rects, so a full-bleed background or a higher-`z-index` sibling\n * can never paint over them (the structural fix for the in-document inset\n * outline the findings batch flagged). The selected frame carries a compact tag:\n * the component's display name plus move-up / move-down / duplicate / delete\n * controls that dispatch the EXISTING tree actions.\n *\n * EC-414 AD-B chrome contract: everything here is `ec-*` classes / `data-ec-*`\n * attributes / inline geometry only, styled by `canvas-chrome-css.ts`, with the\n * `.ec-chrome` containment recipe on the root; no studio Tailwind utilities and\n * no studio React UI primitives cross into the iframe. The rect-tracking core\n * ({@link createRectTracker}) is a pure, reusable module — EC-405 rides this\n * overlay layer next, and EC-406 can share the tracking.\n */\n\n/** The overlay's full measured geometry (both frames + the bar placement). */\nexport interface OverlayGeometry {\n  selected: Rect | null\n  /** Chrome-bar placement for the selected frame (null when nothing to draw). */\n  selectedBar: FrameBarPlacement | null\n  hovered: Rect | null\n  /** EC-408: the focused prop's marker rect (reverse highlight), or null. */\n  propHighlight: Rect | null\n}\n\nconst EMPTY_GEOMETRY: OverlayGeometry = {\n  selected: null,\n  selectedBar: null,\n  hovered: null,\n  propHighlight: null,\n}\n\nfunction barsEqual(a: FrameBarPlacement | null, b: FrameBarPlacement | null): boolean {\n  if (a === null || b === null) return a === b\n  return a.top === b.top && a.left === b.left && a.placement === b.placement\n}\n\nfunction geometryEquals(a: OverlayGeometry, b: OverlayGeometry): boolean {\n  return (\n    rectsEqual(a.selected, b.selected) &&\n    rectsEqual(a.hovered, b.hovered) &&\n    rectsEqual(a.propHighlight, b.propHighlight) &&\n    barsEqual(a.selectedBar, b.selectedBar)\n  )\n}\n\n/** A drawn selection frame plus its control enablement. */\nexport interface SelectionFrameView {\n  rect: Rect\n  bar: FrameBarPlacement\n  label: string\n  canMoveUp: boolean\n  canMoveDown: boolean\n}\n\n/** One \"+\" affordance button: its position and its placed anchor point. */\nexport interface AffordanceItemView extends AffordanceAnchor {\n  position: InsertPosition\n}\n\n/**\n * The affordance buttons for one node — grouped so a single `onInsert` binds\n * the node id the inserts target. EC-435 AD-1: only the SELECTED node ever\n * carries affordances (they appear/disappear with the frame bar, like the rest\n * of the chrome) — hover draws its frame and nothing else, so a selected\n * Stack's spacing handles never share a gap with a hovered child's \"+\".\n */\nexport interface AffordanceGroupView {\n  nodeId: string\n  items: AffordanceItemView[]\n  onInsert: (position: InsertPosition) => void\n}\n\nexport interface SelectionOverlayViewProps {\n  selected: SelectionFrameView | null\n  hovered: Rect | null\n  /** The SELECTED node's insertion affordances (EC-405/EC-435); null when none or suppressed (drag/editing). */\n  affordance: AffordanceGroupView | null\n  /** EC-408: the focused prop's marker rect (reverse highlight), or null. */\n  propHighlight?: Rect | null\n  onMoveUp: () => void\n  onMoveDown: () => void\n  onDuplicate: () => void\n  onDelete: () => void\n}\n\nfunction frameStyle(rect: Rect): CSSProperties {\n  return { left: rect.left, top: rect.top, width: rect.width, height: rect.height }\n}\n\nconst AFFORDANCE_LABELS: Record<InsertPosition, string> = {\n  before: 'builder.canvas.insertBefore',\n  after: 'builder.canvas.insertAfter',\n  into: 'builder.canvas.insertInto',\n}\n\n/**\n * The overlay's rendered markup, portal-free so the AD-D chrome contract test\n * can walk it with `renderToStaticMarkup`: every class is `ec-*`, the root\n * carries the `.ec-chrome` containment recipe, geometry is inline (no `var()`).\n */\nexport function SelectionOverlayView(props: SelectionOverlayViewProps) {\n  const { selected, hovered, affordance, propHighlight } = props\n  return (\n    <div className=\"ec-chrome ec-overlay\" data-ec-overlay=\"\">\n      {/* EC-408 reverse highlight: a quiet filled tint on the focused prop's\n          element, drawn UNDER the selection frame so its border stays crisp. */}\n      {propHighlight ? (\n        <div className=\"ec-overlay-prop\" data-ec-prop-highlight=\"\" style={frameStyle(propHighlight)} />\n      ) : null}\n      {hovered ? <div className=\"ec-overlay-frame\" data-ec-hover=\"\" style={frameStyle(hovered)} /> : null}\n      {affordance\n        ? affordance.items.map((item) => (\n            <AddButton key={item.position} item={item} onInsert={() => affordance.onInsert(item.position)} />\n          ))\n        : null}\n      {selected ? (\n        <>\n          <div className=\"ec-overlay-frame\" data-ec-selected=\"\" style={frameStyle(selected.rect)} />\n          <div\n            className=\"ec-overlay-bar\"\n            data-ec-frame-bar=\"\"\n            data-ec-placement={selected.bar.placement}\n            style={{ left: selected.bar.left, top: selected.bar.top }}\n          >\n            <span className=\"ec-overlay-label\" title={selected.label}>\n              {selected.label}\n            </span>\n            <span className=\"ec-overlay-sep\" aria-hidden=\"true\" />\n            <FrameButton\n              label={translate('builder.pageTree.moveUp')}\n              disabled={!selected.canMoveUp}\n              onClick={props.onMoveUp}\n            >\n              <OverlayIcon kind=\"moveUp\" />\n            </FrameButton>\n            <FrameButton\n              label={translate('builder.pageTree.moveDown')}\n              disabled={!selected.canMoveDown}\n              onClick={props.onMoveDown}\n            >\n              <OverlayIcon kind=\"moveDown\" />\n            </FrameButton>\n            <FrameButton label={translate('common.duplicate')} onClick={props.onDuplicate}>\n              <OverlayIcon kind=\"duplicate\" />\n            </FrameButton>\n            <FrameButton label={translate('common.delete')} onClick={props.onDelete}>\n              <OverlayIcon kind=\"delete\" />\n            </FrameButton>\n          </div>\n        </>\n      ) : null}\n    </div>\n  )\n}\n\nfunction FrameButton({\n  label,\n  disabled,\n  onClick,\n  children,\n}: {\n  label: string\n  disabled?: boolean\n  onClick: () => void\n  children: ReactNode\n}) {\n  return (\n    <button\n      type=\"button\"\n      className=\"ec-overlay-btn\"\n      aria-label={label}\n      title={label}\n      disabled={disabled}\n      // Keep the click on the control: it must not fall through to the canvas\n      // selection listener (the bar sits over the page) nor start a text drag.\n      onMouseDown={(e) => e.preventDefault()}\n      onClick={(e) => {\n        e.preventDefault()\n        e.stopPropagation()\n        onClick()\n      }}\n    >\n      {children}\n    </button>\n  )\n}\n\n/**\n * A \"+\" insertion affordance (EC-405): a small round button centered on a block\n * boundary (before/after edge, or the center of an empty container). Centered on\n * its anchor by the chrome CSS `translate(-50%,-50%)`; `pointer-events` re-enabled\n * on the button while the overlay root stays click-through. The gesture guards\n * mirror `FrameButton` — the press must not fall through to the canvas selection\n * listener nor start a native drag.\n */\nfunction AddButton({ item, onInsert }: { item: AffordanceItemView; onInsert: () => void }) {\n  const label = translate(AFFORDANCE_LABELS[item.position])\n  return (\n    <button\n      type=\"button\"\n      className=\"ec-overlay-add\"\n      data-ec-affordance={item.position}\n      aria-label={label}\n      title={label}\n      style={{ left: item.left, top: item.top }}\n      onMouseDown={(e) => e.preventDefault()}\n      onClick={(e) => {\n        e.preventDefault()\n        e.stopPropagation()\n        onInsert()\n      }}\n    >\n      <svg\n        width={14}\n        height={14}\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth={1.8}\n        strokeLinecap=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M8 3.5v9M3.5 8h9\" />\n      </svg>\n    </button>\n  )\n}\n\n/** Hand-rolled inline icons — no `class` attribute (chrome contract). */\nfunction OverlayIcon({ kind }: { kind: FrameControlKind }) {\n  const common = {\n    width: 13,\n    height: 13,\n    viewBox: '0 0 16 16',\n    fill: 'none',\n    stroke: 'currentColor',\n    strokeWidth: 1.6,\n    strokeLinecap: 'round' as const,\n    strokeLinejoin: 'round' as const,\n    'aria-hidden': true,\n  }\n  switch (kind) {\n    case 'moveUp':\n      return (\n        <svg {...common}>\n          <path d=\"M4 10l4-4 4 4\" />\n        </svg>\n      )\n    case 'moveDown':\n      return (\n        <svg {...common}>\n          <path d=\"M4 6l4 4 4-4\" />\n        </svg>\n      )\n    case 'duplicate':\n      return (\n        <svg {...common}>\n          <rect x=\"6\" y=\"6\" width=\"8\" height=\"8\" rx=\"1.5\" />\n          <path d=\"M10 6V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2\" />\n        </svg>\n      )\n    case 'delete':\n      return (\n        <svg {...common}>\n          <path d=\"M3 4.5h10\" />\n          <path d=\"M6.5 4.5V3a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v1.5\" />\n          <path d=\"M5 4.5l.5 8a1 1 0 0 0 1 .9h3a1 1 0 0 0 1-.9l.5-8\" />\n        </svg>\n      )\n  }\n}\n\n/**\n * The live overlay: tracks the selected + hovered node rects (glued through\n * scroll/resize/async layout via {@link subscribeCanvasLayout} + a coalescing\n * {@link createRectTracker}) and portals the frames into the iframe `body`.\n * Suppressed for the composition root (no frame around the whole page — mirrors\n * the tree, which offers the root no actions) and while an inline text/rich-text\n * edit is live (the `[data-ec-editing]` outline owns that state).\n */\nexport function SelectionOverlay({ doc, editing }: { doc: Document; editing: boolean }) {\n  const builder = useBuilder()\n  const { present, selectedId, hoveredId, dispatch } = builder\n  const studio = getStudioRegistry()\n  const affordance = useInsertAffordance()\n  const propSync = usePropSync()\n  const uiLocale = useUiLocale()\n  const [geometry, setGeometry] = useState<OverlayGeometry>(EMPTY_GEOMETRY)\n\n  // EC-408 reverse highlight: the focused prop's marker, but only for the\n  // selected node (the inspector only shows that node's props) and never while\n  // inline-editing (the [data-ec-editing] outline owns the node then).\n  const highlight =\n    propSync?.highlighted && propSync.highlighted.nodeId === selectedId && !editing\n      ? propSync.highlighted\n      : null\n  const highlightNodeId = highlight?.nodeId ?? null\n  const highlightPropName = highlight?.propName ?? null\n\n  // EC-405 scope 4: insertion affordances hide while ANY drag is live (the\n  // DnD before/after/into indicators own the \"where it lands\" story then).\n  const [dragging, setDragging] = useState(() => activeDrag() !== null)\n  useEffect(() => {\n    const offStart = onDragSessionStart(() => setDragging(true))\n    const offEnd = onDragSessionEnd(() => setDragging(false))\n    return () => {\n      offStart()\n      offEnd()\n    }\n  }, [])\n\n  // The selected node's controls/label come from the graph; the root and a\n  // never-found selection draw nothing. Hover never frames the currently\n  // selected node (one frame at a time) nor the root.\n  const selectedNode = selectedId && !editing ? getNode(present, selectedId) : null\n  const controls = selectedNode ? frameControlsFor(present, selectedId!) : null\n  const drawSelected = selectedNode !== null && controls !== null && !controls.isRoot\n  const hoveredNode = hoveredId && hoveredId !== selectedId ? getNode(present, hoveredId) : null\n  const drawHover = hoveredNode !== null && !frameControlsFor(present, hoveredId!).isRoot\n\n  useLayoutEffect(() => {\n    const win = doc.defaultView\n    if (!win) return\n    const selId = drawSelected ? selectedId : null\n    const hovId = drawHover ? hoveredId : null\n    const measure = (): OverlayGeometry => {\n      const selected = measureNodeRect(doc, selId)\n      const hovered = measureNodeRect(doc, hovId)\n      return {\n        selected,\n        selectedBar: selected ? placeFrameBar(selected, { barHeight: FRAME_BAR_HEIGHT, docTop: win.scrollY }) : null,\n        hovered,\n        propHighlight: measurePropRect(doc, highlightNodeId, highlightPropName),\n      }\n    }\n    const targets = (): Element[] => {\n      const out: Element[] = []\n      for (const id of [selId, hovId]) {\n        if (!id) continue\n        const el = doc.querySelector(`[data-ec-node-id=\"${id}\"]`)\n        if (el) out.push(el)\n      }\n      // Track the highlighted marker element too, so it re-glues on async layout.\n      if (highlightNodeId) {\n        const wrapper = doc.querySelector(`[data-ec-node-id=\"${highlightNodeId}\"]`)\n        if (wrapper) out.push(wrapper)\n      }\n      return out\n    }\n    // Coalesce on the PARENT window's frame loop (not the iframe's): this\n    // component + its state live in the parent React tree, and the iframe's rAF\n    // is throttled/paused whenever the preview is offscreen or backgrounded. The\n    // compound rAF+timeout scheduler (scheduleFrame) keeps the flush paint-\n    // aligned on screen while guaranteeing it still runs when rAF is paused.\n    const host = win.parent ?? window\n    const tracker = createRectTracker<OverlayGeometry>({\n      measure,\n      equals: geometryEquals,\n      onChange: setGeometry,\n      schedule: (flush) => scheduleFrame(host, flush),\n      subscribe: (invalidate) => subscribeCanvasLayout(doc, targets, invalidate),\n    })\n    return () => tracker.dispose()\n    // Re-subscribe when the tracked ids / graph / highlighted prop change so the\n    // ResizeObserver re-points at the current (possibly remounted) wrappers and\n    // the measure closure reads the current highlight target.\n  }, [doc, drawSelected, drawHover, selectedId, hoveredId, present, highlightNodeId, highlightPropName])\n\n  // EC-407: the frame label shares the tree row's resolution — the SAME\n  // nodeDisplayTitle.primary the selected row shows (instance title when\n  // derivable, else the localized component name).\n  const label = selectedNode\n    ? nodeDisplayTitle(studio.registry.getManifest(selectedNode.componentId), selectedNode, uiLocale).primary\n    : ''\n\n  const selectedView: SelectionFrameView | null =\n    drawSelected && geometry.selected && geometry.selectedBar && controls\n      ? {\n          rect: geometry.selected,\n          bar: geometry.selectedBar,\n          label,\n          canMoveUp: controls.canMoveUp,\n          canMoveDown: controls.canMoveDown,\n        }\n      : null\n\n  const run = (kind: FrameControlKind): void => {\n    if (!selectedId) return\n    dispatch(frameControlAction(kind, selectedId))\n  }\n\n  // EC-405/EC-435 AD-1: the \"+\" affordances render for the SELECTED node only,\n  // with the rest of its frame chrome — computed from the SAME measured rect the\n  // selection frame uses. Hover never carries affordances (that used to land \"+\"\n  // buttons inside a selected Stack's gaps, colliding with the spacing handles).\n  // A group is drawn only for a node with insertable positions, and only when no\n  // drag/inline edit is live; with no provider above (component preview), none.\n  const selectedAffordance: AffordanceGroupView | null =\n    affordance && !dragging && !editing\n      ? affordanceGroup(present, selectedId, drawSelected ? geometry.selected : null, affordance)\n      : null\n\n  return createPortal(\n    <SelectionOverlayView\n      selected={selectedView}\n      hovered={drawHover ? geometry.hovered : null}\n      affordance={selectedAffordance}\n      propHighlight={highlight ? geometry.propHighlight : null}\n      onMoveUp={() => run('moveUp')}\n      onMoveDown={() => run('moveDown')}\n      onDuplicate={() => run('duplicate')}\n      onDelete={() => run('delete')}\n    />,\n    doc.body,\n  )\n}\n\n/**\n * Build the affordance group for one node from its measured rect: the insertable\n * positions the provider allows (slot rules already applied), each placed on the\n * node's boundary along the parent's flow axis. Returns `null` when there is no\n * rect yet or no insertable position. Exported as the pure core of the overlay's\n * affordance derivation (EC-435 AD-1: called for the selected node only).\n */\nexport function affordanceGroup(\n  present: ComponentNode,\n  nodeId: string | null,\n  rect: Rect | null,\n  affordance: InsertAffordanceApi,\n): AffordanceGroupView | null {\n  if (!nodeId || !rect) return null\n  const positions = affordance.positionsFor(nodeId)\n  if (positions.length === 0) return null\n  const flow = containerFlowAxis(getParentInfo(present, nodeId)?.parent)\n  return {\n    nodeId,\n    items: positions.map((position) => ({ position, ...placeAffordance(rect, position, flow) })),\n    onInsert: (position) => affordance.openAt(nodeId, position),\n  }\n}\n"]}
+{"version":3,"file":"selection-overlay.js","sourceRoot":"","sources":["../../../src/components/builder/selection-overlay.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useLayoutEffect, useState } from 'react'\nimport type { CSSProperties, ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\nimport { getNode, getParentInfo } from '@elytracms/core/project-graph'\nimport type { ComponentNode, LayoutContainerIds } from '@elytracms/core/project-graph'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { translate, useUiLocale } from '@elytracms/studio/lib/i18n'\nimport { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport { useBuilder } from './builder-store'\nimport { activeDrag, onDragSessionEnd, onDragSessionStart } from './drag-session'\nimport { useInsertAffordance } from './insert-affordance-context'\nimport type { InsertAffordanceApi } from './insert-affordance-context'\nimport type { InsertPosition } from './insert-context'\nimport type { AffordanceAnchor, FrameBarPlacement, FrameControlKind } from './canvas-overlay-geometry'\nimport {\n  FRAME_BAR_HEIGHT,\n  frameControlAction,\n  frameControlsFor,\n  placeAffordance,\n  placeFrameBar,\n} from './canvas-overlay-geometry'\nimport {\n  createRectTracker,\n  measureNodeRect,\n  measurePropRect,\n  rectsEqual,\n  scheduleFrame,\n  subscribeCanvasLayout,\n} from './canvas-rect-tracking'\nimport type { Rect } from './canvas-rect-tracking'\nimport { usePropSync } from './prop-sync-context'\nimport { nodeDisplayTitle } from './node-title'\n\n/**\n * Canvas selection/hover overlay (EC-404) — a topmost layer portaled into the\n * iframe `body` that draws the selection and hover frames ABOVE the page from\n * measured node rects, so a full-bleed background or a higher-`z-index` sibling\n * can never paint over them (the structural fix for the in-document inset\n * outline the findings batch flagged). The selected frame carries a compact tag:\n * the component's display name plus move-up / move-down / duplicate / delete\n * controls that dispatch the EXISTING tree actions.\n *\n * EC-414 AD-B chrome contract: everything here is `ec-*` classes / `data-ec-*`\n * attributes / inline geometry only, styled by `canvas-chrome-css.ts`, with the\n * `.ec-chrome` containment recipe on the root; no studio Tailwind utilities and\n * no studio React UI primitives cross into the iframe. The rect-tracking core\n * ({@link createRectTracker}) is a pure, reusable module — EC-405 rides this\n * overlay layer next, and EC-406 can share the tracking.\n */\n\n/** The overlay's full measured geometry (both frames + the bar placement). */\nexport interface OverlayGeometry {\n  selected: Rect | null\n  /** Chrome-bar placement for the selected frame (null when nothing to draw). */\n  selectedBar: FrameBarPlacement | null\n  hovered: Rect | null\n  /** EC-408: the focused prop's marker rect (reverse highlight), or null. */\n  propHighlight: Rect | null\n}\n\nconst EMPTY_GEOMETRY: OverlayGeometry = {\n  selected: null,\n  selectedBar: null,\n  hovered: null,\n  propHighlight: null,\n}\n\nfunction barsEqual(a: FrameBarPlacement | null, b: FrameBarPlacement | null): boolean {\n  if (a === null || b === null) return a === b\n  return a.top === b.top && a.left === b.left && a.placement === b.placement\n}\n\nfunction geometryEquals(a: OverlayGeometry, b: OverlayGeometry): boolean {\n  return (\n    rectsEqual(a.selected, b.selected) &&\n    rectsEqual(a.hovered, b.hovered) &&\n    rectsEqual(a.propHighlight, b.propHighlight) &&\n    barsEqual(a.selectedBar, b.selectedBar)\n  )\n}\n\n/** A drawn selection frame plus its control enablement. */\nexport interface SelectionFrameView {\n  rect: Rect\n  bar: FrameBarPlacement\n  label: string\n  canMoveUp: boolean\n  canMoveDown: boolean\n}\n\n/** One \"+\" affordance button: its position and its placed anchor point. */\nexport interface AffordanceItemView extends AffordanceAnchor {\n  position: InsertPosition\n}\n\n/**\n * The affordance buttons for one node — grouped so a single `onInsert` binds\n * the node id the inserts target. EC-435 AD-1: only the SELECTED node ever\n * carries affordances (they appear/disappear with the frame bar, like the rest\n * of the chrome) — hover draws its frame and nothing else, so a selected\n * Stack's spacing handles never share a gap with a hovered child's \"+\".\n */\nexport interface AffordanceGroupView {\n  nodeId: string\n  items: AffordanceItemView[]\n  onInsert: (position: InsertPosition) => void\n}\n\nexport interface SelectionOverlayViewProps {\n  selected: SelectionFrameView | null\n  hovered: Rect | null\n  /** The SELECTED node's insertion affordances (EC-405/EC-435); null when none or suppressed (drag/editing). */\n  affordance: AffordanceGroupView | null\n  /** EC-408: the focused prop's marker rect (reverse highlight), or null. */\n  propHighlight?: Rect | null\n  onMoveUp: () => void\n  onMoveDown: () => void\n  onDuplicate: () => void\n  onDelete: () => void\n}\n\nfunction frameStyle(rect: Rect): CSSProperties {\n  return { left: rect.left, top: rect.top, width: rect.width, height: rect.height }\n}\n\nconst AFFORDANCE_LABELS: Record<InsertPosition, string> = {\n  before: 'builder.canvas.insertBefore',\n  after: 'builder.canvas.insertAfter',\n  into: 'builder.canvas.insertInto',\n}\n\n/**\n * The overlay's rendered markup, portal-free so the AD-D chrome contract test\n * can walk it with `renderToStaticMarkup`: every class is `ec-*`, the root\n * carries the `.ec-chrome` containment recipe, geometry is inline (no `var()`).\n */\nexport function SelectionOverlayView(props: SelectionOverlayViewProps) {\n  const { selected, hovered, affordance, propHighlight } = props\n  return (\n    <div className=\"ec-chrome ec-overlay\" data-ec-overlay=\"\">\n      {/* EC-408 reverse highlight: a quiet filled tint on the focused prop's\n          element, drawn UNDER the selection frame so its border stays crisp. */}\n      {propHighlight ? (\n        <div className=\"ec-overlay-prop\" data-ec-prop-highlight=\"\" style={frameStyle(propHighlight)} />\n      ) : null}\n      {hovered ? <div className=\"ec-overlay-frame\" data-ec-hover=\"\" style={frameStyle(hovered)} /> : null}\n      {affordance\n        ? affordance.items.map((item) => (\n            <AddButton key={item.position} item={item} onInsert={() => affordance.onInsert(item.position)} />\n          ))\n        : null}\n      {selected ? (\n        <>\n          <div className=\"ec-overlay-frame\" data-ec-selected=\"\" style={frameStyle(selected.rect)} />\n          <div\n            className=\"ec-overlay-bar\"\n            data-ec-frame-bar=\"\"\n            data-ec-placement={selected.bar.placement}\n            style={{ left: selected.bar.left, top: selected.bar.top }}\n          >\n            <span className=\"ec-overlay-label\" title={selected.label}>\n              {selected.label}\n            </span>\n            <span className=\"ec-overlay-sep\" aria-hidden=\"true\" />\n            <FrameButton\n              label={translate('builder.pageTree.moveUp')}\n              disabled={!selected.canMoveUp}\n              onClick={props.onMoveUp}\n            >\n              <OverlayIcon kind=\"moveUp\" />\n            </FrameButton>\n            <FrameButton\n              label={translate('builder.pageTree.moveDown')}\n              disabled={!selected.canMoveDown}\n              onClick={props.onMoveDown}\n            >\n              <OverlayIcon kind=\"moveDown\" />\n            </FrameButton>\n            <FrameButton label={translate('common.duplicate')} onClick={props.onDuplicate}>\n              <OverlayIcon kind=\"duplicate\" />\n            </FrameButton>\n            <FrameButton label={translate('common.delete')} onClick={props.onDelete}>\n              <OverlayIcon kind=\"delete\" />\n            </FrameButton>\n          </div>\n        </>\n      ) : null}\n    </div>\n  )\n}\n\nfunction FrameButton({\n  label,\n  disabled,\n  onClick,\n  children,\n}: {\n  label: string\n  disabled?: boolean\n  onClick: () => void\n  children: ReactNode\n}) {\n  return (\n    <button\n      type=\"button\"\n      className=\"ec-overlay-btn\"\n      aria-label={label}\n      title={label}\n      disabled={disabled}\n      // Keep the click on the control: it must not fall through to the canvas\n      // selection listener (the bar sits over the page) nor start a text drag.\n      onMouseDown={(e) => e.preventDefault()}\n      onClick={(e) => {\n        e.preventDefault()\n        e.stopPropagation()\n        onClick()\n      }}\n    >\n      {children}\n    </button>\n  )\n}\n\n/**\n * A \"+\" insertion affordance (EC-405): a small round button centered on a block\n * boundary (before/after edge, or the center of an empty container). Centered on\n * its anchor by the chrome CSS `translate(-50%,-50%)`; `pointer-events` re-enabled\n * on the button while the overlay root stays click-through. The gesture guards\n * mirror `FrameButton` — the press must not fall through to the canvas selection\n * listener nor start a native drag.\n */\nfunction AddButton({ item, onInsert }: { item: AffordanceItemView; onInsert: () => void }) {\n  const label = translate(AFFORDANCE_LABELS[item.position])\n  return (\n    <button\n      type=\"button\"\n      className=\"ec-overlay-add\"\n      data-ec-affordance={item.position}\n      aria-label={label}\n      title={label}\n      style={{ left: item.left, top: item.top }}\n      onMouseDown={(e) => e.preventDefault()}\n      onClick={(e) => {\n        e.preventDefault()\n        e.stopPropagation()\n        onInsert()\n      }}\n    >\n      <svg\n        width={14}\n        height={14}\n        viewBox=\"0 0 16 16\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth={1.8}\n        strokeLinecap=\"round\"\n        aria-hidden=\"true\"\n      >\n        <path d=\"M8 3.5v9M3.5 8h9\" />\n      </svg>\n    </button>\n  )\n}\n\n/** Hand-rolled inline icons — no `class` attribute (chrome contract). */\nfunction OverlayIcon({ kind }: { kind: FrameControlKind }) {\n  const common = {\n    width: 13,\n    height: 13,\n    viewBox: '0 0 16 16',\n    fill: 'none',\n    stroke: 'currentColor',\n    strokeWidth: 1.6,\n    strokeLinecap: 'round' as const,\n    strokeLinejoin: 'round' as const,\n    'aria-hidden': true,\n  }\n  switch (kind) {\n    case 'moveUp':\n      return (\n        <svg {...common}>\n          <path d=\"M4 10l4-4 4 4\" />\n        </svg>\n      )\n    case 'moveDown':\n      return (\n        <svg {...common}>\n          <path d=\"M4 6l4 4 4-4\" />\n        </svg>\n      )\n    case 'duplicate':\n      return (\n        <svg {...common}>\n          <rect x=\"6\" y=\"6\" width=\"8\" height=\"8\" rx=\"1.5\" />\n          <path d=\"M10 6V4a1 1 0 0 0-1-1H3a1 1 0 0 0-1 1v6a1 1 0 0 0 1 1h2\" />\n        </svg>\n      )\n    case 'delete':\n      return (\n        <svg {...common}>\n          <path d=\"M3 4.5h10\" />\n          <path d=\"M6.5 4.5V3a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v1.5\" />\n          <path d=\"M5 4.5l.5 8a1 1 0 0 0 1 .9h3a1 1 0 0 0 1-.9l.5-8\" />\n        </svg>\n      )\n  }\n}\n\n/**\n * The live overlay: tracks the selected + hovered node rects (glued through\n * scroll/resize/async layout via {@link subscribeCanvasLayout} + a coalescing\n * {@link createRectTracker}) and portals the frames into the iframe `body`.\n * Suppressed for the composition root (no frame around the whole page — mirrors\n * the tree, which offers the root no actions) and while an inline text/rich-text\n * edit is live (the `[data-ec-editing]` outline owns that state).\n */\nexport function SelectionOverlay({ doc, editing }: { doc: Document; editing: boolean }) {\n  const builder = useBuilder()\n  const { present, selectedId, hoveredId, dispatch } = builder\n  const studio = getStudioRegistry()\n  const affordance = useInsertAffordance()\n  const propSync = usePropSync()\n  const uiLocale = useUiLocale()\n  const [geometry, setGeometry] = useState<OverlayGeometry>(EMPTY_GEOMETRY)\n\n  // EC-408 reverse highlight: the focused prop's marker, but only for the\n  // selected node (the inspector only shows that node's props) and never while\n  // inline-editing (the [data-ec-editing] outline owns the node then).\n  const highlight =\n    propSync?.highlighted && propSync.highlighted.nodeId === selectedId && !editing\n      ? propSync.highlighted\n      : null\n  const highlightNodeId = highlight?.nodeId ?? null\n  const highlightPropName = highlight?.propName ?? null\n\n  // EC-405 scope 4: insertion affordances hide while ANY drag is live (the\n  // DnD before/after/into indicators own the \"where it lands\" story then).\n  const [dragging, setDragging] = useState(() => activeDrag() !== null)\n  useEffect(() => {\n    const offStart = onDragSessionStart(() => setDragging(true))\n    const offEnd = onDragSessionEnd(() => setDragging(false))\n    return () => {\n      offStart()\n      offEnd()\n    }\n  }, [])\n\n  // The selected node's controls/label come from the graph; the root and a\n  // never-found selection draw nothing. Hover never frames the currently\n  // selected node (one frame at a time) nor the root.\n  const selectedNode = selectedId && !editing ? getNode(present, selectedId) : null\n  const controls = selectedNode ? frameControlsFor(present, selectedId!) : null\n  const drawSelected = selectedNode !== null && controls !== null && !controls.isRoot\n  const hoveredNode = hoveredId && hoveredId !== selectedId ? getNode(present, hoveredId) : null\n  const drawHover = hoveredNode !== null && !frameControlsFor(present, hoveredId!).isRoot\n\n  useLayoutEffect(() => {\n    const win = doc.defaultView\n    if (!win) return\n    const selId = drawSelected ? selectedId : null\n    const hovId = drawHover ? hoveredId : null\n    const measure = (): OverlayGeometry => {\n      const selected = measureNodeRect(doc, selId)\n      const hovered = measureNodeRect(doc, hovId)\n      return {\n        selected,\n        selectedBar: selected ? placeFrameBar(selected, { barHeight: FRAME_BAR_HEIGHT, docTop: win.scrollY }) : null,\n        hovered,\n        propHighlight: measurePropRect(doc, highlightNodeId, highlightPropName),\n      }\n    }\n    const targets = (): Element[] => {\n      const out: Element[] = []\n      for (const id of [selId, hovId]) {\n        if (!id) continue\n        const el = doc.querySelector(`[data-ec-node-id=\"${id}\"]`)\n        if (el) out.push(el)\n      }\n      // Track the highlighted marker element too, so it re-glues on async layout.\n      if (highlightNodeId) {\n        const wrapper = doc.querySelector(`[data-ec-node-id=\"${highlightNodeId}\"]`)\n        if (wrapper) out.push(wrapper)\n      }\n      return out\n    }\n    // Coalesce on the PARENT window's frame loop (not the iframe's): this\n    // component + its state live in the parent React tree, and the iframe's rAF\n    // is throttled/paused whenever the preview is offscreen or backgrounded. The\n    // compound rAF+timeout scheduler (scheduleFrame) keeps the flush paint-\n    // aligned on screen while guaranteeing it still runs when rAF is paused.\n    const host = win.parent ?? window\n    const tracker = createRectTracker<OverlayGeometry>({\n      measure,\n      equals: geometryEquals,\n      onChange: setGeometry,\n      schedule: (flush) => scheduleFrame(host, flush),\n      subscribe: (invalidate) => subscribeCanvasLayout(doc, targets, invalidate),\n    })\n    return () => tracker.dispose()\n    // Re-subscribe when the tracked ids / graph / highlighted prop change so the\n    // ResizeObserver re-points at the current (possibly remounted) wrappers and\n    // the measure closure reads the current highlight target.\n  }, [doc, drawSelected, drawHover, selectedId, hoveredId, present, highlightNodeId, highlightPropName])\n\n  // EC-407: the frame label shares the tree row's resolution — the SAME\n  // nodeDisplayTitle.primary the selected row shows (instance title when\n  // derivable, else the localized component name).\n  const label = selectedNode\n    ? nodeDisplayTitle(studio.registry.getManifest(selectedNode.componentId), selectedNode, uiLocale).primary\n    : ''\n\n  const selectedView: SelectionFrameView | null =\n    drawSelected && geometry.selected && geometry.selectedBar && controls\n      ? {\n          rect: geometry.selected,\n          bar: geometry.selectedBar,\n          label,\n          canMoveUp: controls.canMoveUp,\n          canMoveDown: controls.canMoveDown,\n        }\n      : null\n\n  const run = (kind: FrameControlKind): void => {\n    if (!selectedId) return\n    dispatch(frameControlAction(kind, selectedId))\n  }\n\n  // EC-405/EC-435 AD-1: the \"+\" affordances render for the SELECTED node only,\n  // with the rest of its frame chrome — computed from the SAME measured rect the\n  // selection frame uses. Hover never carries affordances (that used to land \"+\"\n  // buttons inside a selected Stack's gaps, colliding with the spacing handles).\n  // A group is drawn only for a node with insertable positions, and only when no\n  // drag/inline edit is live; with no provider above (component preview), none.\n  const selectedAffordance: AffordanceGroupView | null =\n    affordance && !dragging && !editing\n      ? affordanceGroup(present, builder.layout, selectedId, drawSelected ? geometry.selected : null, affordance)\n      : null\n\n  return createPortal(\n    <SelectionOverlayView\n      selected={selectedView}\n      hovered={drawHover ? geometry.hovered : null}\n      affordance={selectedAffordance}\n      propHighlight={highlight ? geometry.propHighlight : null}\n      onMoveUp={() => run('moveUp')}\n      onMoveDown={() => run('moveDown')}\n      onDuplicate={() => run('duplicate')}\n      onDelete={() => run('delete')}\n    />,\n    doc.body,\n  )\n}\n\n/**\n * Build the affordance group for one node from its measured rect: the insertable\n * positions the provider allows (slot rules already applied), each placed on the\n * node's boundary along the parent's flow axis. Returns `null` when there is no\n * rect yet or no insertable position. Exported as the pure core of the overlay's\n * affordance derivation (EC-435 AD-1: called for the selected node only).\n */\nexport function affordanceGroup(\n  present: ComponentNode,\n  layout: LayoutContainerIds,\n  nodeId: string | null,\n  rect: Rect | null,\n  affordance: InsertAffordanceApi,\n): AffordanceGroupView | null {\n  if (!nodeId || !rect) return null\n  const positions = affordance.positionsFor(nodeId)\n  if (positions.length === 0) return null\n  const flow = containerFlowAxis(getParentInfo(present, nodeId)?.parent, layout)\n  return {\n    nodeId,\n    items: positions.map((position) => ({ position, ...placeAffordance(rect, position, flow) })),\n    onInsert: (position) => affordance.openAt(nodeId, position),\n  }\n}\n"]}

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

@@ -1,4 +1,4 @@
-import type { ComponentNode } from '@elytracms/core/project-graph';
+import type { ComponentNode, LayoutContainerIds } from '@elytracms/core/project-graph';
 import type { FlowAxis } from '@elytracms/studio/lib/dnd/drop-rules';
 import type { GapRect, GapStep } from '@elytracms/studio/lib/dnd/gap-drag';
 import type { FrameScheduler, RectTracker } from './canvas-rect-tracking.js';
@@ -91,7 +91,7 @@ export declare function createSpacingTracker(doc: Document, nodeId: string, flow
  * graph children, so requiring ≥2 graph children can never wrongly hide handles
  * that a fresh DOM measure would show.
  */
-export declare function hasSpacingHandles(node: ComponentNode | null): node is ComponentNode;
+export declare function hasSpacingHandles(node: ComponentNode | null, layout: LayoutContainerIds): node is ComponentNode;
 /** Everything the portal-free handle markup needs (chrome contract surface). */
 export interface SpacingHandlesViewProps {
     spots: HandleSpotView[];

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

@@ -152,9 +152,9 @@ export function createSpacingTracker(doc, nodeId, flowAxis, host, onChange) {
  * graph children, so requiring ≥2 graph children can never wrongly hide handles
  * that a fresh DOM measure would show.
  */
-export function hasSpacingHandles(node) {
+export function hasSpacingHandles(node, layout) {
     return (node !== null &&
-        isLayoutContainerNode(node) &&
+        isLayoutContainerNode(node, layout) &&
         (node.slots?.[DEFAULT_SLOT]?.length ?? 0) >= 2);
 }
 const HANDLE_THICKNESS = 14;
@@ -239,7 +239,7 @@ export function SpacingHandlesView(props) {
 export function SpacingHandles({ doc, node }) {
     const builder = useBuilder();
     const { dispatch } = builder;
-    const flowAxis = containerFlowAxis(node);
+    const flowAxis = containerFlowAxis(node, builder.layout);
     const [measured, setMeasured] = useState(() => ({ spots: [], axis: flowAxis }));
     const [drag, setDrag] = useState(null);
     const dragRef = useRef(null);

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

@@ -1 +1 @@
-{"version":3,"file":"spacing-handles.js","sourceRoot":"","sources":["../../../src/components/builder/spacing-handles.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { DEFAULT_SLOT, isLayoutContainerNode, staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport type { FlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport {\n  containerGapStep,\n  gapHandleSpots,\n  gapStepCss,\n  gapStepFromDrag,\n} from '@elytracms/studio/lib/dnd/gap-drag'\nimport type { GapRect, GapStep } from '@elytracms/studio/lib/dnd/gap-drag'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useBuilder } from './builder-store'\nimport { GAP_LABEL_KEYS, GAP_NONE_LABEL_KEY } from './layout-inspector'\nimport { activeDrag, onDragSessionEnd, onDragSessionStart } from './drag-session'\nimport {\n  createRectTracker,\n  measureElementRect,\n  scheduleFrame,\n  subscribeCanvasLayout,\n} from './canvas-rect-tracking'\nimport type { FrameScheduler, RectTracker } from './canvas-rect-tracking'\n\n/**\n * Tokenized spacing handles (EC-163, vision §3.1 / AD-10): when a Stack/Grid\n * container is selected on the canvas, draggable gap handles appear between\n * its children, axis-aware via the shared `containerFlowAxis`. Dragging snaps\n * through the EC-161 spacing-token scale (`lib/dnd/gap-drag` — pure math, no\n * pixel value can escape it); the static gap tags (EC-435) stay put and read\n * the LIVE token + re-measured px during the drag (EC-438 — no\n * pointer-following label). The drag previews imperatively on the rendered\n * element; releasing commits exactly ONE builder dispatch — `setProp` with the\n * token, or `removeProp` for \"no gap\", the identical values the inspector's\n * gap select writes — so one undo restores, and the graph stays the single\n * source of truth. Esc mid-drag cancels: preview reverts, nothing dispatches.\n */\n\n/** Plain-language label for a gap step — the inspector's vocabulary. */\nexport function gapStepLabel(step: GapStep): string {\n  return step === null ? translate(GAP_NONE_LABEL_KEY) : translate(GAP_LABEL_KEYS[step])\n}\n\nexport interface HandleSpotView {\n  index: number\n  /** Document-coordinate position of the handle's center. */\n  x: number\n  y: number\n  crossStart: number\n  crossLength: number\n  /** Leading edge of the gap region along the flow axis (EC-435 hatch). */\n  gapStart: number\n  /** Rendered extent of the gap along the flow axis (0 for a closed gap). */\n  gapLength: number\n}\n\n/**\n * The hatched gap REGION for a spot (EC-435 AD-2): the rectangle between child\n * N's trailing edge and child N+1's leading edge along the flow axis, spanning\n * the pair's shared cross extent — the same measured child-rect basis the\n * handle spots come from (`gapHandleSpots`), in the same document coordinates.\n * Pure over the spot; a closed gap yields a zero-extent rect (nothing to paint).\n */\nexport function gapRegionRect(spot: HandleSpotView, axis: FlowAxis): GapRect {\n  return axis === 'horizontal'\n    ? { left: spot.gapStart, top: spot.crossStart, width: spot.gapLength, height: spot.crossLength }\n    : { left: spot.crossStart, top: spot.gapStart, width: spot.crossLength, height: spot.gapLength }\n}\n\ninterface ActiveDrag {\n  index: number\n  startStep: GapStep\n  step: GapStep\n  /** Pointer start along the flow axis (client coords). */\n  startCoord: number\n}\n\n/**\n * The container's rendered element (the Stack/Grid div carrying the gap style).\n * Resilient to legitimate intermediate wrappers between the editable\n * `[data-ec-node-id]` wrapper and the primitive (an error-boundary/provider DOM\n * node, a future decorator layer): the FIRST `[data-ec-primitive]` inside the\n * wrapper whose NEAREST node wrapper is THIS node — so it tolerates a wrapper\n * above the primitive but never descends into a CHILD node's subtree and grabs\n * that nested container's own `[data-ec-primitive]`. Mirrors `measurePropRect`'s\n * nearest-node scoping (EC-408). Today no such wrapper exists — `decorate` wraps\n * `<RenderErrorBoundary>` which renders its children with no DOM element, so the\n * primitive is a direct child — but the scoping makes 2(b) unregressable.\n */\nexport function containerElementFor(doc: Document, nodeId: string): HTMLElement | null {\n  const wrapper = doc.querySelector(`[data-ec-node-id=\"${nodeId}\"]`)\n  if (!wrapper) return null\n  for (const primitive of wrapper.querySelectorAll('[data-ec-primitive]')) {\n    if (primitive.closest('[data-ec-node-id]') === wrapper) return primitive as HTMLElement\n  }\n  return null\n}\n\n/** The container's rendered child node-wrappers — the DOM child basis. */\nfunction childWrappers(container: Element): HTMLElement[] {\n  return Array.from(container.querySelectorAll(':scope > [data-ec-node-id]')) as HTMLElement[]\n}\n\ninterface Measured {\n  spots: HandleSpotView[]\n  /** The axis the children are *rendered* along (drag direction follows it). */\n  axis: FlowAxis\n}\n\nconst EMPTY_MEASURED = (axis: FlowAxis): Measured => ({ spots: [], axis })\n\n/**\n * Measure the handle spots between the container's rendered children — the\n * SINGLE source of truth for whether handles show (spots) and where. Eligibility\n * and measurement agree on the SAME (DOM) child basis by construction: a\n * null-rendering graph child (condition-gated → no `[data-ec-node-id]` wrapper)\n * simply isn't counted, so it can neither block handles when ≥2 children render\n * nor phantom them when <2 do; kept fresh by the live tracker (EC-404) so a child\n * add/remove or resize re-runs this. The graph-level flow axis\n * (`containerFlowAxis`) is tried first; when the rendered layout disagrees — a\n * stacking Grid below the mobile breakpoint lays its \"columns\" out vertically —\n * the cross axis is measured instead, so handles always sit in the gaps the\n * editor actually sees.\n */\nexport function measureSpots(doc: Document, nodeId: string, flowAxis: FlowAxis): Measured {\n  const container = containerElementFor(doc, nodeId)\n  const win = doc.defaultView\n  if (!container || !win) return EMPTY_MEASURED(flowAxis)\n  const children = childWrappers(container)\n  if (children.length < 2) return EMPTY_MEASURED(flowAxis)\n  const rects = children.map((el) => measureElementRect(el, win))\n  const along = gapHandleSpots(rects, flowAxis)\n  if (along.length > 0) return { spots: along, axis: flowAxis }\n  const cross: FlowAxis = flowAxis === 'horizontal' ? 'vertical' : 'horizontal'\n  const across = gapHandleSpots(rects, cross)\n  return across.length > 0 ? { spots: across, axis: cross } : EMPTY_MEASURED(flowAxis)\n}\n\n/** Structural equality of two spot lists — suppresses redundant tracker emits. */\nfunction spotsEqual(a: readonly HandleSpotView[], b: readonly HandleSpotView[]): boolean {\n  if (a.length !== b.length) return false\n  for (let i = 0; i < a.length; i += 1) {\n    const x = a[i]!\n    const y = b[i]!\n    if (\n      x.index !== y.index ||\n      x.x !== y.x ||\n      x.y !== y.y ||\n      x.crossStart !== y.crossStart ||\n      x.crossLength !== y.crossLength ||\n      x.gapStart !== y.gapStart ||\n      x.gapLength !== y.gapLength\n    ) {\n      return false\n    }\n  }\n  return true\n}\n\n/** True when two measurements are equivalent (same axis, same spots). */\nexport function measuredEqual(a: Measured, b: Measured): boolean {\n  return a.axis === b.axis && spotsEqual(a.spots, b.spots)\n}\n\n/** The elements the tracker's `ResizeObserver` watches: the container + its children. */\nfunction spacingTargets(doc: Document, nodeId: string): Element[] {\n  const container = containerElementFor(doc, nodeId)\n  if (!container) return []\n  return [container, ...childWrappers(container)]\n}\n\n/**\n * Wire a live rect tracker for the spacing handles onto the shared EC-404 core:\n * `subscribeCanvasLayout` re-measures under child resize (image/font decode),\n * child add/remove (async population, conditional render — `MutationObserver`\n * `childList`), container resize, and scroll/viewport change; `scheduleFrame`\n * coalesces on the PARENT window's frame loop with the mandatory 100 ms timeout\n * backstop (the iframe's rAF is paused offscreen / never fires under automation).\n * `dispose` tears down every observer + listener — no leaks on unmount. The\n * once-only `useLayoutEffect` measure this replaces went stale the instant any of\n * those settled after first paint (EC-406 evidence).\n */\nexport function createSpacingTracker(\n  doc: Document,\n  nodeId: string,\n  flowAxis: FlowAxis,\n  host: FrameScheduler,\n  onChange: (measured: Measured) => void,\n): RectTracker {\n  return createRectTracker<Measured>({\n    measure: () => measureSpots(doc, nodeId, flowAxis),\n    equals: measuredEqual,\n    onChange,\n    schedule: (flush) => scheduleFrame(host, flush),\n    subscribe: (invalidate) => subscribeCanvasLayout(doc, () => spacingTargets(doc, nodeId), invalidate),\n  })\n}\n\n/**\n * True when the node is a layout container the handles can attach to — a cheap,\n * NECESSARY graph precondition for the mount (the authoritative \"are there ≥2\n * gaps to space\" answer is the live DOM {@link measureSpots}). Because each graph\n * child renders at most one `[data-ec-node-id]` wrapper, rendered DOM children ⊆\n * graph children, so requiring ≥2 graph children can never wrongly hide handles\n * that a fresh DOM measure would show.\n */\nexport function hasSpacingHandles(node: ComponentNode | null): node is ComponentNode {\n  return (\n    node !== null &&\n    isLayoutContainerNode(node) &&\n    (node.slots?.[DEFAULT_SLOT]?.length ?? 0) >= 2\n  )\n}\n\nconst HANDLE_THICKNESS = 14\nconst HANDLE_BAR = 4\nconst HANDLE_MAX_LENGTH = 48\n\n/** Everything the portal-free handle markup needs (chrome contract surface). */\nexport interface SpacingHandlesViewProps {\n  spots: HandleSpotView[]\n  horizontal: boolean\n  /**\n   * Token label for the container's COMMITTED gap (EC-435 AD-2) — the SAME\n   * plain-language vocabulary the layout inspector resolves (`gapStepLabel`),\n   * stamped on every hatched gap region as a static size tag while idle.\n   */\n  gapLabel: string\n  /**\n   * The live drag: the active handle index (tint) and the live step's token\n   * label — the static tags read it in place while dragging (EC-438).\n   */\n  drag: { index: number; label: string } | null\n  onPointerDown: (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => void\n  onPointerMove: (e: React.PointerEvent<HTMLDivElement>) => void\n  onPointerUp: () => void\n  onPointerCancel: () => void\n}\n\n/**\n * The spacing handles' rendered markup, portal-free so the AD-D chrome\n * contract test can walk it with `renderToStaticMarkup`. In-frame chrome\n * contract (EC-414 AD-B): `ec-*`/`data-ec-*` plus inline styles only; the root\n * carries the `.ec-chrome` containment recipe.\n *\n * EC-435 AD-2: every open gap region renders a pointer-transparent hatched\n * rectangle (diagonal accent stripes, Figma-grid style) under the handles,\n * each with a small static token-label size tag beside its handle. During a\n * gap drag the tags STAY PUT and read live (EC-438 — a gap drag previews ONE\n * container-wide gap, so every tag shows the live step's token + its own\n * re-measured px); no label follows the pointer. The gap handles remain the\n * only interactive element.\n */\nexport function SpacingHandlesView(props: SpacingHandlesViewProps) {\n  const { spots, horizontal, gapLabel, drag } = props\n  const axis: FlowAxis = horizontal ? 'horizontal' : 'vertical'\n  return (\n    <div data-ec-spacing-handles=\"\" className=\"ec-chrome\">\n      {spots.map((spot) => {\n        const region = gapRegionRect(spot, axis)\n        if (spot.gapLength < 1) return null\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-hatch={spot.index}\n            style={{\n              position: 'absolute',\n              left: region.left,\n              top: region.top,\n              width: region.width,\n              height: region.height,\n              zIndex: 10,\n              pointerEvents: 'none',\n              background:\n                'repeating-linear-gradient(45deg, rgba(91,140,255,0.28) 0px, rgba(91,140,255,0.28) 3px, rgba(91,140,255,0.06) 3px, rgba(91,140,255,0.06) 9px)',\n              boxShadow: 'inset 0 0 0 1px rgba(91,140,255,0.3)',\n            }}\n          />\n        )\n      })}\n      {spots.map((spot) => {\n        if (spot.gapLength < 1) return null\n        const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH)\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-hatch-label={spot.index}\n            style={{\n              position: 'absolute',\n              left: horizontal ? spot.x : spot.x + length / 2 + 6,\n              top: horizontal ? spot.y + length / 2 + 6 : spot.y,\n              transform: horizontal ? 'translateX(-50%)' : 'translateY(-50%)',\n              zIndex: 45,\n              pointerEvents: 'none',\n              padding: '1px 6px',\n              borderRadius: 5,\n              fontSize: 10,\n              fontWeight: 600,\n              whiteSpace: 'nowrap',\n              color: '#fff',\n              backgroundColor: 'rgba(91,140,255,0.92)',\n              boxShadow: '0 1px 4px rgba(8,12,24,0.3)',\n            }}\n          >\n            {drag ? drag.label : gapLabel} · {Math.round(spot.gapLength)}px\n          </div>\n        )\n      })}\n      {spots.map((spot) => {\n        const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH)\n        const active = drag?.index === spot.index\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-handle={spot.index}\n            role=\"separator\"\n            aria-label={translate('builder.spacing.gapAfterChild', { index: spot.index + 1 })}\n            aria-orientation={horizontal ? 'vertical' : 'horizontal'}\n            onPointerDown={props.onPointerDown(spot)}\n            onPointerMove={props.onPointerMove}\n            onPointerUp={props.onPointerUp}\n            onPointerCancel={props.onPointerCancel}\n            style={{\n              position: 'absolute',\n              left: spot.x - (horizontal ? HANDLE_THICKNESS / 2 : length / 2),\n              top: spot.y - (horizontal ? length / 2 : HANDLE_THICKNESS / 2),\n              width: horizontal ? HANDLE_THICKNESS : length,\n              height: horizontal ? length : HANDLE_THICKNESS,\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n              cursor: horizontal ? 'col-resize' : 'row-resize',\n              zIndex: 40,\n              touchAction: 'none',\n            }}\n          >\n            <div\n              style={{\n                width: horizontal ? HANDLE_BAR : '100%',\n                height: horizontal ? '100%' : HANDLE_BAR,\n                borderRadius: 999,\n                backgroundColor: active ? '#5b8cff' : 'rgba(91, 140, 255, 0.65)',\n                boxShadow: '0 0 0 1px rgba(8, 12, 24, 0.55)',\n              }}\n            />\n          </div>\n        )\n      })}\n    </div>\n  )\n}\n\nexport function SpacingHandles({ doc, node }: { doc: Document; node: ComponentNode }) {\n  const builder = useBuilder()\n  const { dispatch } = builder\n  const flowAxis = containerFlowAxis(node)\n  const [measured, setMeasured] = useState<Measured>(() => ({ spots: [], axis: flowAxis }))\n  const [drag, setDrag] = useState<ActiveDrag | null>(null)\n  const dragRef = useRef<ActiveDrag | null>(null)\n  const trackerRef = useRef<RectTracker | null>(null)\n  // The container's pre-drag inline gap, restored on cancel/commit (the graph\n  // re-render owns the committed value; the preview is imperative-only).\n  const inlineGapRef = useRef<string>('')\n\n  // Measurement lifetime (EC-406): ride the shared rect-tracking core instead of\n  // the once-only useLayoutEffect + lone resize listener that went stale. The\n  // tracker re-measures under child resize (image/font decode), child add/remove\n  // (async population, conditional render), container resize, and scroll/viewport\n  // change — every settle the old code missed. Re-subscribed on a graph/axis/\n  // viewport change so the ResizeObserver re-points at the current children.\n  useLayoutEffect(() => {\n    const win = doc.defaultView\n    if (!win) return\n    const host = (win.parent ?? win) as unknown as FrameScheduler\n    const tracker = createSpacingTracker(doc, node.id, flowAxis, host, setMeasured)\n    trackerRef.current = tracker\n    return () => {\n      tracker.dispose()\n      trackerRef.current = null\n    }\n  }, [doc, node.id, flowAxis, builder.present, builder.viewport])\n\n  // The gap-drag previews imperatively on `container.style.gap` (the tracker's\n  // MutationObserver is childList-only and ignores attribute writes, by design),\n  // so nudge a coalesced re-measure per step to keep every handle glued to the\n  // previewed gap as the children shift. Harmless off-drag (an unchanged measure\n  // emits nothing).\n  useEffect(() => {\n    trackerRef.current?.invalidate()\n  }, [drag?.step])\n\n  // Scope 4: yield the handles during an active CONTENT drag (node move/insert) —\n  // the DnD before/after/into indicators own the \"where it lands\" story then. The\n  // handles' OWN gap drag uses pointer capture, never `beginDrag`, so it does not\n  // trip this. Inline-editing suppression is handled at the canvas mount (the\n  // handles unmount while a text/rich-text session owns the node).\n  const [contentDragging, setContentDragging] = useState(() => activeDrag() !== null)\n  useEffect(() => {\n    const offStart = onDragSessionStart(() => setContentDragging(true))\n    const offEnd = onDragSessionEnd(() => setContentDragging(false))\n    return () => {\n      offStart()\n      offEnd()\n    }\n  }, [])\n\n  const { spots: measuredSpots, axis } = measured\n  const spots = contentDragging ? [] : measuredSpots\n\n  const applyPreview = useCallback(\n    (step: GapStep) => {\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = gapStepCss(step)\n    },\n    [doc, node.id],\n  )\n\n  const finish = useCallback(\n    (mode: 'commit' | 'cancel') => {\n      const active = dragRef.current\n      if (!active) return\n      dragRef.current = null\n      setDrag(null)\n      // Drop the imperative preview; the rendered graph value takes over.\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = inlineGapRef.current\n      if (mode === 'commit' && active.step !== active.startStep) {\n        // Exactly one dispatch — one operations command, one undo step — and\n        // the identical prop value the inspector's gap select produces.\n        if (active.step === null) {\n          dispatch({ type: 'removeProp', id: node.id, name: 'gap' })\n        } else {\n          dispatch({ type: 'setProp', id: node.id, name: 'gap', value: staticProp(active.step) })\n        }\n      }\n    },\n    [doc, node.id, dispatch],\n  )\n\n  // Esc cancels mid-drag — listen on both documents (focus may sit either side\n  // of the iframe boundary while the pointer is captured).\n  useEffect(() => {\n    if (!drag) return\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        e.stopPropagation()\n        finish('cancel')\n      }\n    }\n    doc.addEventListener('keydown', onKeyDown, true)\n    document.addEventListener('keydown', onKeyDown, true)\n    return () => {\n      doc.removeEventListener('keydown', onKeyDown, true)\n      document.removeEventListener('keydown', onKeyDown, true)\n    }\n  }, [drag, doc, finish])\n\n  // Cleanup on unmount/selection change mid-drag: revert, never dispatch.\n  useEffect(() => () => finish('cancel'), [finish])\n\n  const onPointerDown = (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => {\n    if (e.button !== 0) return\n    e.preventDefault()\n    e.stopPropagation()\n    const startStep = containerGapStep(node)\n    const container = containerElementFor(doc, node.id)\n    inlineGapRef.current = container?.style.gap ?? ''\n    try {\n      e.currentTarget.setPointerCapture(e.pointerId)\n    } catch {\n      // Synthetic pointer events (tests, automation) have no active pointer\n      // to capture; move/up still arrive via the handle's own listeners.\n    }\n    const next: ActiveDrag = {\n      index: spot.index,\n      startStep,\n      step: startStep,\n      startCoord: axis === 'horizontal' ? e.clientX : e.clientY,\n    }\n    dragRef.current = next\n    setDrag(next)\n  }\n\n  const onPointerMove = (e: React.PointerEvent<HTMLDivElement>) => {\n    const active = dragRef.current\n    if (!active) return\n    const coord = axis === 'horizontal' ? e.clientX : e.clientY\n    const step = gapStepFromDrag(active.startStep, coord - active.startCoord)\n    const next: ActiveDrag = { ...active, step }\n    dragRef.current = next\n    setDrag(next)\n    applyPreview(step)\n  }\n\n  const horizontal = axis === 'horizontal'\n\n  return createPortal(\n    <SpacingHandlesView\n      spots={spots}\n      horizontal={horizontal}\n      // The static size tags share ONE vocabulary with the inspector's gap\n      // select: the token label of the node's committed gap step (EC-435\n      // AD-2); during a drag they read the live step instead (EC-438).\n      gapLabel={gapStepLabel(containerGapStep(node))}\n      drag={drag ? { index: drag.index, label: gapStepLabel(drag.step) } : null}\n      onPointerDown={onPointerDown}\n      onPointerMove={onPointerMove}\n      onPointerUp={() => finish('commit')}\n      onPointerCancel={() => finish('cancel')}\n    />,\n    doc.body,\n  )\n}\n"]}
+{"version":3,"file":"spacing-handles.js","sourceRoot":"","sources":["../../../src/components/builder/spacing-handles.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACjF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AACxC,OAAO,EAAE,YAAY,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;AAE/F,OAAO,EAAE,iBAAiB,EAAE,MAAM,sCAAsC,CAAA;AAExE,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,eAAe,GAChB,MAAM,oCAAoC,CAAA;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAA;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC5C,OAAO,EAAE,cAAc,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAA;AACvE,OAAO,EAAE,UAAU,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACjF,OAAO,EACL,iBAAiB,EACjB,kBAAkB,EAClB,aAAa,EACb,qBAAqB,GACtB,MAAM,wBAAwB,CAAA;AAG/B;;;;;;;;;;;;GAYG;AAEH,wEAAwE;AACxE,MAAM,UAAU,YAAY,CAAC,IAAa;IACxC,OAAO,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAA;AACxF,CAAC;AAeD;;;;;;GAMG;AACH,MAAM,UAAU,aAAa,CAAC,IAAoB,EAAE,IAAc;IAChE,OAAO,IAAI,KAAK,YAAY;QAC1B,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,CAAC,WAAW,EAAE;QAChG,CAAC,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,UAAU,EAAE,GAAG,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE,CAAA;AACpG,CAAC;AAUD;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,mBAAmB,CAAC,GAAa,EAAE,MAAc;IAC/D,MAAM,OAAO,GAAG,GAAG,CAAC,aAAa,CAAC,qBAAqB,MAAM,IAAI,CAAC,CAAA;IAClE,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAA;IACzB,KAAK,MAAM,SAAS,IAAI,OAAO,CAAC,gBAAgB,CAAC,qBAAqB,CAAC,EAAE,CAAC;QACxE,IAAI,SAAS,CAAC,OAAO,CAAC,mBAAmB,CAAC,KAAK,OAAO;YAAE,OAAO,SAAwB,CAAA;IACzF,CAAC;IACD,OAAO,IAAI,CAAA;AACb,CAAC;AAED,0EAA0E;AAC1E,SAAS,aAAa,CAAC,SAAkB;IACvC,OAAO,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,4BAA4B,CAAC,CAAkB,CAAA;AAC9F,CAAC;AAQD,MAAM,cAAc,GAAG,CAAC,IAAc,EAAY,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,CAAA;AAE1E;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,YAAY,CAAC,GAAa,EAAE,MAAc,EAAE,QAAkB;IAC5E,MAAM,SAAS,GAAG,mBAAmB,CAAC,GAAG,EAAE,MAAM,CAAC,CAAA;IAClD,MAAM,GAAG,GAAG,GAAG,CAAC,WAAW,CAAA;IAC3B,IAAI,CAAC,SAAS,IAAI,CAAC,GAAG;QAAE,OAAO,cAAc,CAAC,QAAQ,CAAC,CAAA;IACvD,MAAM,QAAQ,GAAG,aAAa,CAAC,SAAS,CAAC,CAAA;IACzC,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC;QAAE,OAAO,cAAc,CAAC,QAAQ,CAAC,CAAA;IACxD,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,kBAAkB,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAA;IAC/D,MAAM,KAAK,GAAG,cAAc,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;IAC7C,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;QAAE,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAA;IAC7D,MAAM,KAAK,GAAa,QAAQ,KAAK,YAAY,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,CAAA;IAC7E,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,CAAA;IAC3C,OAAO,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAA;AACtF,CAAC;AAED,kFAAkF;AAClF,SAAS,UAAU,CAAC,CAA4B,EAAE,CAA4B;IAC5E,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,MAAM;QAAE,OAAO,KAAK,CAAA;IACvC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC;QACrC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAE,CAAA;QACf,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAE,CAAA;QACf,IACE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,KAAK;YACnB,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;YACX,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;YACX,CAAC,CAAC,UAAU,KAAK,CAAC,CAAC,UAAU;YAC7B,CAAC,CAAC,WAAW,KAAK,CAAC,CAAC,WAAW;YAC/B,CAAC,CAAC,QAAQ,KAAK,CAAC,CAAC,QAAQ;YACzB,CAAC,CAAC,SAAS,KAAK,CAAC,CAAC,SAAS,EAC3B,CAAC;YACD,OAAO,KAAK,CAAA;QACd,CAAC;IACH,CAAC;IACD,OAAO,IAAI,CAAA;AACb,CAAC;AAED,yEAAyE;AACzE,MAAM,UAAU,aAAa,CAAC,CAAW,EAAE,CAAW;IACpD,OAAO,CAAC,CAAC,IAAI,KAAK,CAAC,CAAC,IAAI,IAAI,UAAU,CAAC,CAAC,CAAC,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,CAAA;AAC1D,CAAC;AAED,yFAAyF;AACzF,SAAS,cAAc,CAAC,GAAa,EAAE,MAAc;IACnD,MAAM,SAAS,GAAG,mBAAmB,CAAC,GAAG,EAAE,MAAM,CAAC,CAAA;IAClD,IAAI,CAAC,SAAS;QAAE,OAAO,EAAE,CAAA;IACzB,OAAO,CAAC,SAAS,EAAE,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC,CAAA;AACjD,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,oBAAoB,CAClC,GAAa,EACb,MAAc,EACd,QAAkB,EAClB,IAAoB,EACpB,QAAsC;IAEtC,OAAO,iBAAiB,CAAW;QACjC,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC;QAClD,MAAM,EAAE,aAAa;QACrB,QAAQ;QACR,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,aAAa,CAAC,IAAI,EAAE,KAAK,CAAC;QAC/C,SAAS,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,qBAAqB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,cAAc,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,UAAU,CAAC;KACrG,CAAC,CAAA;AACJ,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,iBAAiB,CAC/B,IAA0B,EAC1B,MAA0B;IAE1B,OAAO,CACL,IAAI,KAAK,IAAI;QACb,qBAAqB,CAAC,IAAI,EAAE,MAAM,CAAC;QACnC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC,CAAC,IAAI,CAAC,CAC/C,CAAA;AACH,CAAC;AAED,MAAM,gBAAgB,GAAG,EAAE,CAAA;AAC3B,MAAM,UAAU,GAAG,CAAC,CAAA;AACpB,MAAM,iBAAiB,GAAG,EAAE,CAAA;AAuB5B;;;;;;;;;;;;;GAaG;AACH,MAAM,UAAU,kBAAkB,CAAC,KAA8B;IAC/D,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,CAAA;IACnD,MAAM,IAAI,GAAa,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU,CAAA;IAC7D,OAAO,CACL,0CAA6B,EAAE,EAAC,SAAS,EAAC,WAAW,aAClD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gBAClB,MAAM,MAAM,GAAG,aAAa,CAAC,IAAI,EAAE,IAAI,CAAC,CAAA;gBACxC,IAAI,IAAI,CAAC,SAAS,GAAG,CAAC;oBAAE,OAAO,IAAI,CAAA;gBACnC,OAAO,CACL,mCAEqB,IAAI,CAAC,KAAK,EAC7B,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,IAAI,EAAE,MAAM,CAAC,IAAI;wBACjB,GAAG,EAAE,MAAM,CAAC,GAAG;wBACf,KAAK,EAAE,MAAM,CAAC,KAAK;wBACnB,MAAM,EAAE,MAAM,CAAC,MAAM;wBACrB,MAAM,EAAE,EAAE;wBACV,aAAa,EAAE,MAAM;wBACrB,UAAU,EACR,8IAA8I;wBAChJ,SAAS,EAAE,sCAAsC;qBAClD,IAbI,IAAI,CAAC,KAAK,CAcf,CACH,CAAA;YACH,CAAC,CAAC,EACD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gBAClB,IAAI,IAAI,CAAC,SAAS,GAAG,CAAC;oBAAE,OAAO,IAAI,CAAA;gBACnC,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAA;gBAC5D,OAAO,CACL,0CAE2B,IAAI,CAAC,KAAK,EACnC,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC;wBACnD,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;wBAClD,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,kBAAkB;wBAC/D,MAAM,EAAE,EAAE;wBACV,aAAa,EAAE,MAAM;wBACrB,OAAO,EAAE,SAAS;wBAClB,YAAY,EAAE,CAAC;wBACf,QAAQ,EAAE,EAAE;wBACZ,UAAU,EAAE,GAAG;wBACf,UAAU,EAAE,QAAQ;wBACpB,KAAK,EAAE,MAAM;wBACb,eAAe,EAAE,uBAAuB;wBACxC,SAAS,EAAE,6BAA6B;qBACzC,aAEA,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,cAAK,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,WAnBvD,IAAI,CAAC,KAAK,CAoBX,CACP,CAAA;YACH,CAAC,CAAC,EACD,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;gBAClB,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAA;gBAC5D,MAAM,MAAM,GAAG,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC,KAAK,CAAA;gBACzC,OAAO,CACL,oCAEsB,IAAI,CAAC,KAAK,EAC9B,IAAI,EAAC,WAAW,gBACJ,SAAS,CAAC,+BAA+B,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,sBAC/D,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,YAAY,EACxD,aAAa,EAAE,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,EACxC,aAAa,EAAE,KAAK,CAAC,aAAa,EAClC,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,eAAe,EAAE,KAAK,CAAC,eAAe,EACtC,KAAK,EAAE;wBACL,QAAQ,EAAE,UAAU;wBACpB,IAAI,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,gBAAgB,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;wBAC/D,GAAG,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,gBAAgB,GAAG,CAAC,CAAC;wBAC9D,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM;wBAC7C,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,gBAAgB;wBAC9C,OAAO,EAAE,MAAM;wBACf,UAAU,EAAE,QAAQ;wBACpB,cAAc,EAAE,QAAQ;wBACxB,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,YAAY;wBAChD,MAAM,EAAE,EAAE;wBACV,WAAW,EAAE,MAAM;qBACpB,YAED,cACE,KAAK,EAAE;4BACL,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM;4BACvC,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU;4BACxC,YAAY,EAAE,GAAG;4BACjB,eAAe,EAAE,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,0BAA0B;4BAChE,SAAS,EAAE,iCAAiC;yBAC7C,GACD,IA/BG,IAAI,CAAC,KAAK,CAgCX,CACP,CAAA;YACH,CAAC,CAAC,IACE,CACP,CAAA;AACH,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,EAAE,GAAG,EAAE,IAAI,EAA0C;IAClF,MAAM,OAAO,GAAG,UAAU,EAAE,CAAA;IAC5B,MAAM,EAAE,QAAQ,EAAE,GAAG,OAAO,CAAA;IAC5B,MAAM,QAAQ,GAAG,iBAAiB,CAAC,IAAI,EAAE,OAAO,CAAC,MAAM,CAAC,CAAA;IACxD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAW,GAAG,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAA;IACzF,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAoB,IAAI,CAAC,CAAA;IACzD,MAAM,OAAO,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC/C,MAAM,UAAU,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAA;IACnD,4EAA4E;IAC5E,uEAAuE;IACvE,MAAM,YAAY,GAAG,MAAM,CAAS,EAAE,CAAC,CAAA;IAEvC,+EAA+E;IAC/E,4EAA4E;IAC5E,+EAA+E;IAC/E,gFAAgF;IAChF,4EAA4E;IAC5E,2EAA2E;IAC3E,eAAe,CAAC,GAAG,EAAE;QACnB,MAAM,GAAG,GAAG,GAAG,CAAC,WAAW,CAAA;QAC3B,IAAI,CAAC,GAAG;YAAE,OAAM;QAChB,MAAM,IAAI,GAAG,CAAC,GAAG,CAAC,MAAM,IAAI,GAAG,CAA8B,CAAA;QAC7D,MAAM,OAAO,GAAG,oBAAoB,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,CAAC,CAAA;QAC/E,UAAU,CAAC,OAAO,GAAG,OAAO,CAAA;QAC5B,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,OAAO,EAAE,CAAA;YACjB,UAAU,CAAC,OAAO,GAAG,IAAI,CAAA;QAC3B,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,QAAQ,EAAE,OAAO,CAAC,OAAO,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAA;IAE/D,6EAA6E;IAC7E,+EAA+E;IAC/E,6EAA6E;IAC7E,+EAA+E;IAC/E,kBAAkB;IAClB,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,OAAO,EAAE,UAAU,EAAE,CAAA;IAClC,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAA;IAEhB,gFAAgF;IAChF,gFAAgF;IAChF,gFAAgF;IAChF,4EAA4E;IAC5E,iEAAiE;IACjE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,UAAU,EAAE,KAAK,IAAI,CAAC,CAAA;IACnF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,CAAA;QACnE,MAAM,MAAM,GAAG,gBAAgB,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAA;QAChE,OAAO,GAAG,EAAE;YACV,QAAQ,EAAE,CAAA;YACV,MAAM,EAAE,CAAA;QACV,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAA;IAC/C,MAAM,KAAK,GAAG,eAAe,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,aAAa,CAAA;IAElD,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,IAAa,EAAE,EAAE;QAChB,MAAM,SAAS,GAAG,mBAAmB,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,CAAC,CAAA;QACnD,IAAI,SAAS;YAAE,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,CAAA;IACvD,CAAC,EACD,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,CAAC,CACf,CAAA;IAED,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,IAAyB,EAAE,EAAE;QAC5B,MAAM,MAAM,GAAG,OAAO,CAAC,OAAO,CAAA;QAC9B,IAAI,CAAC,MAAM;YAAE,OAAM;QACnB,OAAO,CAAC,OAAO,GAAG,IAAI,CAAA;QACtB,OAAO,CAAC,IAAI,CAAC,CAAA;QACb,oEAAoE;QACpE,MAAM,SAAS,GAAG,mBAAmB,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,CAAC,CAAA;QACnD,IAAI,SAAS;YAAE,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,YAAY,CAAC,OAAO,CAAA;QACzD,IAAI,IAAI,KAAK,QAAQ,IAAI,MAAM,CAAC,IAAI,KAAK,MAAM,CAAC,SAAS,EAAE,CAAC;YAC1D,qEAAqE;YACrE,gEAAgE;YAChE,IAAI,MAAM,CAAC,IAAI,KAAK,IAAI,EAAE,CAAC;gBACzB,QAAQ,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,CAAA;YAC5D,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,UAAU,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;YACzF,CAAC;QACH,CAAC;IACH,CAAC,EACD,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,EAAE,QAAQ,CAAC,CACzB,CAAA;IAED,6EAA6E;IAC7E,yDAAyD;IACzD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,IAAI;YAAE,OAAM;QACjB,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;YACrC,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;gBACvB,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,CAAC,CAAC,eAAe,EAAE,CAAA;gBACnB,MAAM,CAAC,QAAQ,CAAC,CAAA;YAClB,CAAC;QACH,CAAC,CAAA;QACD,GAAG,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAA;QAChD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAA;QACrD,OAAO,GAAG,EAAE;YACV,GAAG,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAA;YACnD,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,SAAS,EAAE,IAAI,CAAC,CAAA;QAC1D,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,MAAM,CAAC,CAAC,CAAA;IAEvB,wEAAwE;IACxE,SAAS,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;IAEjD,MAAM,aAAa,GAAG,CAAC,IAAoB,EAAE,EAAE,CAAC,CAAC,CAAqC,EAAE,EAAE;QACxF,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC;YAAE,OAAM;QAC1B,CAAC,CAAC,cAAc,EAAE,CAAA;QAClB,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,MAAM,SAAS,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAA;QACxC,MAAM,SAAS,GAAG,mBAAmB,CAAC,GAAG,EAAE,IAAI,CAAC,EAAE,CAAC,CAAA;QACnD,YAAY,CAAC,OAAO,GAAG,SAAS,EAAE,KAAK,CAAC,GAAG,IAAI,EAAE,CAAA;QACjD,IAAI,CAAC;YACH,CAAC,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAA;QAChD,CAAC;QAAC,MAAM,CAAC;YACP,sEAAsE;YACtE,mEAAmE;QACrE,CAAC;QACD,MAAM,IAAI,GAAe;YACvB,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,SAAS;YACT,IAAI,EAAE,SAAS;YACf,UAAU,EAAE,IAAI,KAAK,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO;SAC1D,CAAA;QACD,OAAO,CAAC,OAAO,GAAG,IAAI,CAAA;QACtB,OAAO,CAAC,IAAI,CAAC,CAAA;IACf,CAAC,CAAA;IAED,MAAM,aAAa,GAAG,CAAC,CAAqC,EAAE,EAAE;QAC9D,MAAM,MAAM,GAAG,OAAO,CAAC,OAAO,CAAA;QAC9B,IAAI,CAAC,MAAM;YAAE,OAAM;QACnB,MAAM,KAAK,GAAG,IAAI,KAAK,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAA;QAC3D,MAAM,IAAI,GAAG,eAAe,CAAC,MAAM,CAAC,SAAS,EAAE,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;QACzE,MAAM,IAAI,GAAe,EAAE,GAAG,MAAM,EAAE,IAAI,EAAE,CAAA;QAC5C,OAAO,CAAC,OAAO,GAAG,IAAI,CAAA;QACtB,OAAO,CAAC,IAAI,CAAC,CAAA;QACb,YAAY,CAAC,IAAI,CAAC,CAAA;IACpB,CAAC,CAAA;IAED,MAAM,UAAU,GAAG,IAAI,KAAK,YAAY,CAAA;IAExC,OAAO,YAAY,CACjB,KAAC,kBAAkB,IACjB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU;QACtB,qEAAqE;QACrE,mEAAmE;QACnE,iEAAiE;QACjE,QAAQ,EAAE,YAAY,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,EAC9C,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,EACzE,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EACnC,eAAe,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,GACvC,EACF,GAAG,CAAC,IAAI,CACT,CAAA;AACH,CAAC","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { DEFAULT_SLOT, isLayoutContainerNode, staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode, LayoutContainerIds } from '@elytracms/core/project-graph'\nimport { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport type { FlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport {\n  containerGapStep,\n  gapHandleSpots,\n  gapStepCss,\n  gapStepFromDrag,\n} from '@elytracms/studio/lib/dnd/gap-drag'\nimport type { GapRect, GapStep } from '@elytracms/studio/lib/dnd/gap-drag'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useBuilder } from './builder-store'\nimport { GAP_LABEL_KEYS, GAP_NONE_LABEL_KEY } from './layout-inspector'\nimport { activeDrag, onDragSessionEnd, onDragSessionStart } from './drag-session'\nimport {\n  createRectTracker,\n  measureElementRect,\n  scheduleFrame,\n  subscribeCanvasLayout,\n} from './canvas-rect-tracking'\nimport type { FrameScheduler, RectTracker } from './canvas-rect-tracking'\n\n/**\n * Tokenized spacing handles (EC-163, vision §3.1 / AD-10): when a Stack/Grid\n * container is selected on the canvas, draggable gap handles appear between\n * its children, axis-aware via the shared `containerFlowAxis`. Dragging snaps\n * through the EC-161 spacing-token scale (`lib/dnd/gap-drag` — pure math, no\n * pixel value can escape it); the static gap tags (EC-435) stay put and read\n * the LIVE token + re-measured px during the drag (EC-438 — no\n * pointer-following label). The drag previews imperatively on the rendered\n * element; releasing commits exactly ONE builder dispatch — `setProp` with the\n * token, or `removeProp` for \"no gap\", the identical values the inspector's\n * gap select writes — so one undo restores, and the graph stays the single\n * source of truth. Esc mid-drag cancels: preview reverts, nothing dispatches.\n */\n\n/** Plain-language label for a gap step — the inspector's vocabulary. */\nexport function gapStepLabel(step: GapStep): string {\n  return step === null ? translate(GAP_NONE_LABEL_KEY) : translate(GAP_LABEL_KEYS[step])\n}\n\nexport interface HandleSpotView {\n  index: number\n  /** Document-coordinate position of the handle's center. */\n  x: number\n  y: number\n  crossStart: number\n  crossLength: number\n  /** Leading edge of the gap region along the flow axis (EC-435 hatch). */\n  gapStart: number\n  /** Rendered extent of the gap along the flow axis (0 for a closed gap). */\n  gapLength: number\n}\n\n/**\n * The hatched gap REGION for a spot (EC-435 AD-2): the rectangle between child\n * N's trailing edge and child N+1's leading edge along the flow axis, spanning\n * the pair's shared cross extent — the same measured child-rect basis the\n * handle spots come from (`gapHandleSpots`), in the same document coordinates.\n * Pure over the spot; a closed gap yields a zero-extent rect (nothing to paint).\n */\nexport function gapRegionRect(spot: HandleSpotView, axis: FlowAxis): GapRect {\n  return axis === 'horizontal'\n    ? { left: spot.gapStart, top: spot.crossStart, width: spot.gapLength, height: spot.crossLength }\n    : { left: spot.crossStart, top: spot.gapStart, width: spot.crossLength, height: spot.gapLength }\n}\n\ninterface ActiveDrag {\n  index: number\n  startStep: GapStep\n  step: GapStep\n  /** Pointer start along the flow axis (client coords). */\n  startCoord: number\n}\n\n/**\n * The container's rendered element (the Stack/Grid div carrying the gap style).\n * Resilient to legitimate intermediate wrappers between the editable\n * `[data-ec-node-id]` wrapper and the primitive (an error-boundary/provider DOM\n * node, a future decorator layer): the FIRST `[data-ec-primitive]` inside the\n * wrapper whose NEAREST node wrapper is THIS node — so it tolerates a wrapper\n * above the primitive but never descends into a CHILD node's subtree and grabs\n * that nested container's own `[data-ec-primitive]`. Mirrors `measurePropRect`'s\n * nearest-node scoping (EC-408). Today no such wrapper exists — `decorate` wraps\n * `<RenderErrorBoundary>` which renders its children with no DOM element, so the\n * primitive is a direct child — but the scoping makes 2(b) unregressable.\n */\nexport function containerElementFor(doc: Document, nodeId: string): HTMLElement | null {\n  const wrapper = doc.querySelector(`[data-ec-node-id=\"${nodeId}\"]`)\n  if (!wrapper) return null\n  for (const primitive of wrapper.querySelectorAll('[data-ec-primitive]')) {\n    if (primitive.closest('[data-ec-node-id]') === wrapper) return primitive as HTMLElement\n  }\n  return null\n}\n\n/** The container's rendered child node-wrappers — the DOM child basis. */\nfunction childWrappers(container: Element): HTMLElement[] {\n  return Array.from(container.querySelectorAll(':scope > [data-ec-node-id]')) as HTMLElement[]\n}\n\ninterface Measured {\n  spots: HandleSpotView[]\n  /** The axis the children are *rendered* along (drag direction follows it). */\n  axis: FlowAxis\n}\n\nconst EMPTY_MEASURED = (axis: FlowAxis): Measured => ({ spots: [], axis })\n\n/**\n * Measure the handle spots between the container's rendered children — the\n * SINGLE source of truth for whether handles show (spots) and where. Eligibility\n * and measurement agree on the SAME (DOM) child basis by construction: a\n * null-rendering graph child (condition-gated → no `[data-ec-node-id]` wrapper)\n * simply isn't counted, so it can neither block handles when ≥2 children render\n * nor phantom them when <2 do; kept fresh by the live tracker (EC-404) so a child\n * add/remove or resize re-runs this. The graph-level flow axis\n * (`containerFlowAxis`) is tried first; when the rendered layout disagrees — a\n * stacking Grid below the mobile breakpoint lays its \"columns\" out vertically —\n * the cross axis is measured instead, so handles always sit in the gaps the\n * editor actually sees.\n */\nexport function measureSpots(doc: Document, nodeId: string, flowAxis: FlowAxis): Measured {\n  const container = containerElementFor(doc, nodeId)\n  const win = doc.defaultView\n  if (!container || !win) return EMPTY_MEASURED(flowAxis)\n  const children = childWrappers(container)\n  if (children.length < 2) return EMPTY_MEASURED(flowAxis)\n  const rects = children.map((el) => measureElementRect(el, win))\n  const along = gapHandleSpots(rects, flowAxis)\n  if (along.length > 0) return { spots: along, axis: flowAxis }\n  const cross: FlowAxis = flowAxis === 'horizontal' ? 'vertical' : 'horizontal'\n  const across = gapHandleSpots(rects, cross)\n  return across.length > 0 ? { spots: across, axis: cross } : EMPTY_MEASURED(flowAxis)\n}\n\n/** Structural equality of two spot lists — suppresses redundant tracker emits. */\nfunction spotsEqual(a: readonly HandleSpotView[], b: readonly HandleSpotView[]): boolean {\n  if (a.length !== b.length) return false\n  for (let i = 0; i < a.length; i += 1) {\n    const x = a[i]!\n    const y = b[i]!\n    if (\n      x.index !== y.index ||\n      x.x !== y.x ||\n      x.y !== y.y ||\n      x.crossStart !== y.crossStart ||\n      x.crossLength !== y.crossLength ||\n      x.gapStart !== y.gapStart ||\n      x.gapLength !== y.gapLength\n    ) {\n      return false\n    }\n  }\n  return true\n}\n\n/** True when two measurements are equivalent (same axis, same spots). */\nexport function measuredEqual(a: Measured, b: Measured): boolean {\n  return a.axis === b.axis && spotsEqual(a.spots, b.spots)\n}\n\n/** The elements the tracker's `ResizeObserver` watches: the container + its children. */\nfunction spacingTargets(doc: Document, nodeId: string): Element[] {\n  const container = containerElementFor(doc, nodeId)\n  if (!container) return []\n  return [container, ...childWrappers(container)]\n}\n\n/**\n * Wire a live rect tracker for the spacing handles onto the shared EC-404 core:\n * `subscribeCanvasLayout` re-measures under child resize (image/font decode),\n * child add/remove (async population, conditional render — `MutationObserver`\n * `childList`), container resize, and scroll/viewport change; `scheduleFrame`\n * coalesces on the PARENT window's frame loop with the mandatory 100 ms timeout\n * backstop (the iframe's rAF is paused offscreen / never fires under automation).\n * `dispose` tears down every observer + listener — no leaks on unmount. The\n * once-only `useLayoutEffect` measure this replaces went stale the instant any of\n * those settled after first paint (EC-406 evidence).\n */\nexport function createSpacingTracker(\n  doc: Document,\n  nodeId: string,\n  flowAxis: FlowAxis,\n  host: FrameScheduler,\n  onChange: (measured: Measured) => void,\n): RectTracker {\n  return createRectTracker<Measured>({\n    measure: () => measureSpots(doc, nodeId, flowAxis),\n    equals: measuredEqual,\n    onChange,\n    schedule: (flush) => scheduleFrame(host, flush),\n    subscribe: (invalidate) => subscribeCanvasLayout(doc, () => spacingTargets(doc, nodeId), invalidate),\n  })\n}\n\n/**\n * True when the node is a layout container the handles can attach to — a cheap,\n * NECESSARY graph precondition for the mount (the authoritative \"are there ≥2\n * gaps to space\" answer is the live DOM {@link measureSpots}). Because each graph\n * child renders at most one `[data-ec-node-id]` wrapper, rendered DOM children ⊆\n * graph children, so requiring ≥2 graph children can never wrongly hide handles\n * that a fresh DOM measure would show.\n */\nexport function hasSpacingHandles(\n  node: ComponentNode | null,\n  layout: LayoutContainerIds,\n): node is ComponentNode {\n  return (\n    node !== null &&\n    isLayoutContainerNode(node, layout) &&\n    (node.slots?.[DEFAULT_SLOT]?.length ?? 0) >= 2\n  )\n}\n\nconst HANDLE_THICKNESS = 14\nconst HANDLE_BAR = 4\nconst HANDLE_MAX_LENGTH = 48\n\n/** Everything the portal-free handle markup needs (chrome contract surface). */\nexport interface SpacingHandlesViewProps {\n  spots: HandleSpotView[]\n  horizontal: boolean\n  /**\n   * Token label for the container's COMMITTED gap (EC-435 AD-2) — the SAME\n   * plain-language vocabulary the layout inspector resolves (`gapStepLabel`),\n   * stamped on every hatched gap region as a static size tag while idle.\n   */\n  gapLabel: string\n  /**\n   * The live drag: the active handle index (tint) and the live step's token\n   * label — the static tags read it in place while dragging (EC-438).\n   */\n  drag: { index: number; label: string } | null\n  onPointerDown: (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => void\n  onPointerMove: (e: React.PointerEvent<HTMLDivElement>) => void\n  onPointerUp: () => void\n  onPointerCancel: () => void\n}\n\n/**\n * The spacing handles' rendered markup, portal-free so the AD-D chrome\n * contract test can walk it with `renderToStaticMarkup`. In-frame chrome\n * contract (EC-414 AD-B): `ec-*`/`data-ec-*` plus inline styles only; the root\n * carries the `.ec-chrome` containment recipe.\n *\n * EC-435 AD-2: every open gap region renders a pointer-transparent hatched\n * rectangle (diagonal accent stripes, Figma-grid style) under the handles,\n * each with a small static token-label size tag beside its handle. During a\n * gap drag the tags STAY PUT and read live (EC-438 — a gap drag previews ONE\n * container-wide gap, so every tag shows the live step's token + its own\n * re-measured px); no label follows the pointer. The gap handles remain the\n * only interactive element.\n */\nexport function SpacingHandlesView(props: SpacingHandlesViewProps) {\n  const { spots, horizontal, gapLabel, drag } = props\n  const axis: FlowAxis = horizontal ? 'horizontal' : 'vertical'\n  return (\n    <div data-ec-spacing-handles=\"\" className=\"ec-chrome\">\n      {spots.map((spot) => {\n        const region = gapRegionRect(spot, axis)\n        if (spot.gapLength < 1) return null\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-hatch={spot.index}\n            style={{\n              position: 'absolute',\n              left: region.left,\n              top: region.top,\n              width: region.width,\n              height: region.height,\n              zIndex: 10,\n              pointerEvents: 'none',\n              background:\n                'repeating-linear-gradient(45deg, rgba(91,140,255,0.28) 0px, rgba(91,140,255,0.28) 3px, rgba(91,140,255,0.06) 3px, rgba(91,140,255,0.06) 9px)',\n              boxShadow: 'inset 0 0 0 1px rgba(91,140,255,0.3)',\n            }}\n          />\n        )\n      })}\n      {spots.map((spot) => {\n        if (spot.gapLength < 1) return null\n        const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH)\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-hatch-label={spot.index}\n            style={{\n              position: 'absolute',\n              left: horizontal ? spot.x : spot.x + length / 2 + 6,\n              top: horizontal ? spot.y + length / 2 + 6 : spot.y,\n              transform: horizontal ? 'translateX(-50%)' : 'translateY(-50%)',\n              zIndex: 45,\n              pointerEvents: 'none',\n              padding: '1px 6px',\n              borderRadius: 5,\n              fontSize: 10,\n              fontWeight: 600,\n              whiteSpace: 'nowrap',\n              color: '#fff',\n              backgroundColor: 'rgba(91,140,255,0.92)',\n              boxShadow: '0 1px 4px rgba(8,12,24,0.3)',\n            }}\n          >\n            {drag ? drag.label : gapLabel} · {Math.round(spot.gapLength)}px\n          </div>\n        )\n      })}\n      {spots.map((spot) => {\n        const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH)\n        const active = drag?.index === spot.index\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-handle={spot.index}\n            role=\"separator\"\n            aria-label={translate('builder.spacing.gapAfterChild', { index: spot.index + 1 })}\n            aria-orientation={horizontal ? 'vertical' : 'horizontal'}\n            onPointerDown={props.onPointerDown(spot)}\n            onPointerMove={props.onPointerMove}\n            onPointerUp={props.onPointerUp}\n            onPointerCancel={props.onPointerCancel}\n            style={{\n              position: 'absolute',\n              left: spot.x - (horizontal ? HANDLE_THICKNESS / 2 : length / 2),\n              top: spot.y - (horizontal ? length / 2 : HANDLE_THICKNESS / 2),\n              width: horizontal ? HANDLE_THICKNESS : length,\n              height: horizontal ? length : HANDLE_THICKNESS,\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n              cursor: horizontal ? 'col-resize' : 'row-resize',\n              zIndex: 40,\n              touchAction: 'none',\n            }}\n          >\n            <div\n              style={{\n                width: horizontal ? HANDLE_BAR : '100%',\n                height: horizontal ? '100%' : HANDLE_BAR,\n                borderRadius: 999,\n                backgroundColor: active ? '#5b8cff' : 'rgba(91, 140, 255, 0.65)',\n                boxShadow: '0 0 0 1px rgba(8, 12, 24, 0.55)',\n              }}\n            />\n          </div>\n        )\n      })}\n    </div>\n  )\n}\n\nexport function SpacingHandles({ doc, node }: { doc: Document; node: ComponentNode }) {\n  const builder = useBuilder()\n  const { dispatch } = builder\n  const flowAxis = containerFlowAxis(node, builder.layout)\n  const [measured, setMeasured] = useState<Measured>(() => ({ spots: [], axis: flowAxis }))\n  const [drag, setDrag] = useState<ActiveDrag | null>(null)\n  const dragRef = useRef<ActiveDrag | null>(null)\n  const trackerRef = useRef<RectTracker | null>(null)\n  // The container's pre-drag inline gap, restored on cancel/commit (the graph\n  // re-render owns the committed value; the preview is imperative-only).\n  const inlineGapRef = useRef<string>('')\n\n  // Measurement lifetime (EC-406): ride the shared rect-tracking core instead of\n  // the once-only useLayoutEffect + lone resize listener that went stale. The\n  // tracker re-measures under child resize (image/font decode), child add/remove\n  // (async population, conditional render), container resize, and scroll/viewport\n  // change — every settle the old code missed. Re-subscribed on a graph/axis/\n  // viewport change so the ResizeObserver re-points at the current children.\n  useLayoutEffect(() => {\n    const win = doc.defaultView\n    if (!win) return\n    const host = (win.parent ?? win) as unknown as FrameScheduler\n    const tracker = createSpacingTracker(doc, node.id, flowAxis, host, setMeasured)\n    trackerRef.current = tracker\n    return () => {\n      tracker.dispose()\n      trackerRef.current = null\n    }\n  }, [doc, node.id, flowAxis, builder.present, builder.viewport])\n\n  // The gap-drag previews imperatively on `container.style.gap` (the tracker's\n  // MutationObserver is childList-only and ignores attribute writes, by design),\n  // so nudge a coalesced re-measure per step to keep every handle glued to the\n  // previewed gap as the children shift. Harmless off-drag (an unchanged measure\n  // emits nothing).\n  useEffect(() => {\n    trackerRef.current?.invalidate()\n  }, [drag?.step])\n\n  // Scope 4: yield the handles during an active CONTENT drag (node move/insert) —\n  // the DnD before/after/into indicators own the \"where it lands\" story then. The\n  // handles' OWN gap drag uses pointer capture, never `beginDrag`, so it does not\n  // trip this. Inline-editing suppression is handled at the canvas mount (the\n  // handles unmount while a text/rich-text session owns the node).\n  const [contentDragging, setContentDragging] = useState(() => activeDrag() !== null)\n  useEffect(() => {\n    const offStart = onDragSessionStart(() => setContentDragging(true))\n    const offEnd = onDragSessionEnd(() => setContentDragging(false))\n    return () => {\n      offStart()\n      offEnd()\n    }\n  }, [])\n\n  const { spots: measuredSpots, axis } = measured\n  const spots = contentDragging ? [] : measuredSpots\n\n  const applyPreview = useCallback(\n    (step: GapStep) => {\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = gapStepCss(step)\n    },\n    [doc, node.id],\n  )\n\n  const finish = useCallback(\n    (mode: 'commit' | 'cancel') => {\n      const active = dragRef.current\n      if (!active) return\n      dragRef.current = null\n      setDrag(null)\n      // Drop the imperative preview; the rendered graph value takes over.\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = inlineGapRef.current\n      if (mode === 'commit' && active.step !== active.startStep) {\n        // Exactly one dispatch — one operations command, one undo step — and\n        // the identical prop value the inspector's gap select produces.\n        if (active.step === null) {\n          dispatch({ type: 'removeProp', id: node.id, name: 'gap' })\n        } else {\n          dispatch({ type: 'setProp', id: node.id, name: 'gap', value: staticProp(active.step) })\n        }\n      }\n    },\n    [doc, node.id, dispatch],\n  )\n\n  // Esc cancels mid-drag — listen on both documents (focus may sit either side\n  // of the iframe boundary while the pointer is captured).\n  useEffect(() => {\n    if (!drag) return\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        e.stopPropagation()\n        finish('cancel')\n      }\n    }\n    doc.addEventListener('keydown', onKeyDown, true)\n    document.addEventListener('keydown', onKeyDown, true)\n    return () => {\n      doc.removeEventListener('keydown', onKeyDown, true)\n      document.removeEventListener('keydown', onKeyDown, true)\n    }\n  }, [drag, doc, finish])\n\n  // Cleanup on unmount/selection change mid-drag: revert, never dispatch.\n  useEffect(() => () => finish('cancel'), [finish])\n\n  const onPointerDown = (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => {\n    if (e.button !== 0) return\n    e.preventDefault()\n    e.stopPropagation()\n    const startStep = containerGapStep(node)\n    const container = containerElementFor(doc, node.id)\n    inlineGapRef.current = container?.style.gap ?? ''\n    try {\n      e.currentTarget.setPointerCapture(e.pointerId)\n    } catch {\n      // Synthetic pointer events (tests, automation) have no active pointer\n      // to capture; move/up still arrive via the handle's own listeners.\n    }\n    const next: ActiveDrag = {\n      index: spot.index,\n      startStep,\n      step: startStep,\n      startCoord: axis === 'horizontal' ? e.clientX : e.clientY,\n    }\n    dragRef.current = next\n    setDrag(next)\n  }\n\n  const onPointerMove = (e: React.PointerEvent<HTMLDivElement>) => {\n    const active = dragRef.current\n    if (!active) return\n    const coord = axis === 'horizontal' ? e.clientX : e.clientY\n    const step = gapStepFromDrag(active.startStep, coord - active.startCoord)\n    const next: ActiveDrag = { ...active, step }\n    dragRef.current = next\n    setDrag(next)\n    applyPreview(step)\n  }\n\n  const horizontal = axis === 'horizontal'\n\n  return createPortal(\n    <SpacingHandlesView\n      spots={spots}\n      horizontal={horizontal}\n      // The static size tags share ONE vocabulary with the inspector's gap\n      // select: the token label of the node's committed gap step (EC-435\n      // AD-2); during a drag they read the live step instead (EC-438).\n      gapLabel={gapStepLabel(containerGapStep(node))}\n      drag={drag ? { index: drag.index, label: gapStepLabel(drag.step) } : null}\n      onPointerDown={onPointerDown}\n      onPointerMove={onPointerMove}\n      onPointerUp={() => finish('commit')}\n      onPointerCancel={() => finish('cancel')}\n    />,\n    doc.body,\n  )\n}\n"]}

package/dist/components/cms/asset-field.d.ts

@@ -15,7 +15,7 @@ import type { AssetFieldDef } from '@elytracms/core/cms-core';
  * included, mounts one, `studio-project-screen.tsx`) it degrades to the labelled-badge
  * picker — no preview/upload — so it stays usable without a real library.
  */
-export declare function AssetField({ field, value, onChange, readOnly, }: {
+export declare function AssetField({ field, value: stored, onChange, readOnly, }: {
     field: AssetFieldDef;
     value: unknown;
     onChange: (value: unknown) => void;