@kywi-software/core 0.10.0 → 0.11.0

package/dist/admin/layout-editor/inline-text.d.ts

@@ -1,7 +1,8 @@
 /**
  * inline-text.ts
- * Which modules can be text-edited directly on the page, and how to read the
- * edited value back out of the DOM (kywi-cms#94).
+ * Which modules can be text-edited directly on the page, WHICH ELEMENT each
+ * edit binds to, and how to read the edited value back out of the DOM
+ * (kywi-cms#94, kywi-cms#145).
  *
  * The front-of-site editor makes a text-bearing module's own rendered element
  * `contenteditable` — the real `<h2>`, `<p>` or rich-text `<div>` the visitor
@@ -17,6 +18,21 @@ export interface InlineTextProp {
     /** True when the prop holds HTML (rich text) rather than a plain string. */
     html: boolean;
 }
+/**
+ * How an edit reached its element.
+ *
+ * `anchor` — the renderer marked the element with `data-kywi-prop`, so it holds
+ * that prop's copy and nothing else (see `useInlinePropAnchor`).
+ * `wrapper` — the legacy whole-module binding, allowed ONLY for a module with a
+ * single text prop (see `resolveInlineBinding` rule 3).
+ */
+export type InlineBindingKind = 'anchor' | 'wrapper';
+/** The element + prop one inline edit is bound to. */
+export interface InlineTextBindingTarget {
+    prop: InlineTextProp;
+    element: HTMLElement;
+    kind: InlineBindingKind;
+}
 /**
  * The module's *primary* text prop, or null when it has none.
  *
@@ -27,11 +43,47 @@ export interface InlineTextProp {
  * out of inline editing, where typing over the picture would be nonsense.
  */
 export declare function resolveInlineTextProp(config: ModuleConfig | null | undefined): InlineTextProp | null;
+/**
+ * EVERY text-typed prop a module declares, in declaration order.
+ *
+ * This is the config-side half of the #145 safety guard: a module with more than
+ * one of these can never be bound at the wrapper, because the wrapper renders
+ * all of them and a commit would concatenate them into whichever one was bound.
+ */
+export declare function listInlineTextProps(config: ModuleConfig | null | undefined): InlineTextProp[];
+/**
+ * Which element + prop a double-click inside `wrapper` binds — or null when
+ * there is nothing safe to bind, in which case the caller routes the gesture to
+ * the props-rail fallback (kywi-cms#118) rather than to the wrapper.
+ *
+ * The rules, in order (kywi-cms#145):
+ *
+ * 1. The anchor the gesture actually landed in. Double-clicking a card's body
+ *    edits the body, its footer edits the footer — the prop the owner pointed
+ *    at, not "the module's first prop".
+ * 2. Otherwise, an unambiguous single anchor in the module: a gesture anywhere
+ *    on a module with only one editable element can only have meant that one.
+ *    Two or more anchors and a gesture that landed on neither is genuinely
+ *    ambiguous → fallback.
+ * 3. Otherwise (a custom module with no anchors at all): the legacy whole-
+ *    wrapper binding, and ONLY when the module declares exactly one text prop —
+ *    the case where "everything the wrapper renders" and "the bound prop" cannot
+ *    disagree. This is what keeps heading/text/richText/button working for
+ *    module packs that never adopt the anchors.
+ *
+ * Anything else fails closed. A wrapper binding on a multi-text-prop module is
+ * the #145 corruption itself, so it is not reachable from here by any path.
+ */
+export declare function resolveInlineBinding(config: ModuleConfig | null | undefined, wrapper: HTMLElement, target: Element | null): InlineTextBindingTarget | null;
 /**
  * Read the edited value back out of an editing host.
  *
- * The host is the module's wrapper element, which also carries the editor's own
- * floating chrome (type chip, action cluster). Chrome is marked with
+ * For an anchored host (`data-kywi-prop`) the host IS the prop's element — it
+ * renders that prop's copy and nothing else, editor chrome included — so its
+ * content is the value, directly.
+ *
+ * For the legacy wrapper host the host also carries the editor's own floating
+ * chrome (type chip, action cluster). Chrome is marked with
  * `data-kywi-editor-chrome` and skipped, so the value comes from the module's
  * own rendered element — `innerHTML` for a rich-text prop, `textContent` for a
  * plain one.

package/dist/admin/layout-editor/inline-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"inline-text.d.ts","sourceRoot":"","sources":["../../../src/admin/layout-editor/inline-text.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAwB,MAAM,uBAAuB,CAAA;AAG/E,mDAAmD;AACnD,MAAM,WAAW,cAAc;IAC7B,sFAAsF;IACtF,IAAI,EAAE,MAAM,CAAA;IACZ,4EAA4E;IAC5E,IAAI,EAAE,OAAO,CAAA;CACd;AAaD;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,GAAG,SAAS,GAAG,cAAc,GAAG,IAAI,CASpG;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,GAAG,MAAM,CAS5E"}
+{"version":3,"file":"inline-text.d.ts","sourceRoot":"","sources":["../../../src/admin/layout-editor/inline-text.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAwB,MAAM,uBAAuB,CAAA;AAI/E,mDAAmD;AACnD,MAAM,WAAW,cAAc;IAC7B,sFAAsF;IACtF,IAAI,EAAE,MAAM,CAAA;IACZ,4EAA4E;IAC5E,IAAI,EAAE,OAAO,CAAA;CACd;AAED;;;;;;;GAOG;AACH,MAAM,MAAM,iBAAiB,GAAG,QAAQ,GAAG,SAAS,CAAA;AAEpD,sDAAsD;AACtD,MAAM,WAAW,uBAAuB;IACtC,IAAI,EAAE,cAAc,CAAA;IACpB,OAAO,EAAE,WAAW,CAAA;IACpB,IAAI,EAAE,iBAAiB,CAAA;CACxB;AAuCD;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,GAAG,SAAS,GAAG,cAAc,GAAG,IAAI,CASpG;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,GAAG,SAAS,GAAG,cAAc,EAAE,CAO7F;AAiBD;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,YAAY,GAAG,IAAI,GAAG,SAAS,EACvC,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,OAAO,GAAG,IAAI,GACrB,uBAAuB,GAAG,IAAI,CAoChC;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,OAAO,GAAG,MAAM,CAU5E"}

package/dist/admin/layout-editor/inline-text.js

@@ -1,7 +1,8 @@
 /**
  * inline-text.ts
- * Which modules can be text-edited directly on the page, and how to read the
- * edited value back out of the DOM (kywi-cms#94).
+ * Which modules can be text-edited directly on the page, WHICH ELEMENT each
+ * edit binds to, and how to read the edited value back out of the DOM
+ * (kywi-cms#94, kywi-cms#145).
  *
  * The front-of-site editor makes a text-bearing module's own rendered element
  * `contenteditable` — the real `<h2>`, `<p>` or rich-text `<div>` the visitor
@@ -9,16 +10,43 @@
  * Committing writes the SAME prop the props panel writes, through the SAME
  * `UPDATE_PROPS` action, so there is one save path and undo/redo just work.
  */
+import { INLINE_PROP_ATTR } from '../../layout/module-render-context.js';
 import { sanitizeHtml } from '../../util/sanitize.js';
 /** Prop types that hold editable copy. */
 const TEXT_PROP_TYPES = new Set(['text', 'textarea', 'richText']);
 /**
- * Modules whose first prop happens to be text-typed but must never be edited by
- * typing on the page: `html`'s `code` prop is a raw-HTML escape hatch (admin
- * only, see ADMIN_ONLY_MODULE_TYPES) where contenteditable would mangle the
- * source the author is deliberately hand-writing.
+ * Modules whose text-typed props must never be edited by typing on the page,
+ * because what the module RENDERS is not what the prop HOLDS.
+ *
+ * `html`/`embed` hold raw source an author is deliberately hand-writing;
+ * `tabs`/`carousel`/`tagCloud`/`breadcrumbs` hold JSON; `spacer` holds a CSS
+ * length; `feedDisplay`/`categoryList` hold a slug/id. Each of those is a
+ * single-text-prop module, so without this list rule 3 below would keep
+ * offering them the legacy wrapper binding — and a commit would serialize the
+ * module's rendered text over the JSON/length/slug the prop actually holds
+ * (kywi-cms#145: the same silent corruption, one class out). Double-click on
+ * these now routes to the props-rail fallback (kywi-cms#118) instead.
+ *
+ * `container` and `columns` are listed for INTENT, not because they would
+ * otherwise slip through: `container` declares two text props (`maxWidth`,
+ * `padding`) so rule 3 already rejects it, and `columns` leads with a `select`
+ * so prop resolution already rejects it. They are here so that a later prop
+ * edit to either — dropping one of the container's two, reordering the columns
+ * — cannot quietly re-open a hole.
  */
-const NOT_INLINE_EDITABLE = new Set(['html']);
+const NOT_INLINE_EDITABLE = new Set([
+    'html',
+    'embed',
+    'tabs',
+    'carousel',
+    'tagCloud',
+    'breadcrumbs',
+    'container',
+    'columns',
+    'spacer',
+    'feedDisplay',
+    'categoryList',
+]);
 /**
  * The module's *primary* text prop, or null when it has none.
  *
@@ -42,11 +70,105 @@ export function resolveInlineTextProp(config) {
         return null;
     return { name, html: definition.type === 'richText' };
 }
+/**
+ * EVERY text-typed prop a module declares, in declaration order.
+ *
+ * This is the config-side half of the #145 safety guard: a module with more than
+ * one of these can never be bound at the wrapper, because the wrapper renders
+ * all of them and a commit would concatenate them into whichever one was bound.
+ */
+export function listInlineTextProps(config) {
+    if (!config)
+        return [];
+    if (NOT_INLINE_EDITABLE.has(config.name))
+        return [];
+    const entries = Object.entries(config.props ?? {});
+    return entries
+        .filter(([, definition]) => TEXT_PROP_TYPES.has(definition.type))
+        .map(([name, definition]) => ({ name, html: definition.type === 'richText' }));
+}
+/** The prop anchors inside `wrapper` that name a text prop this module declares. */
+function anchorsWithin(wrapper, byName) {
+    const found = [];
+    // `Array.from`, not `for…of`: the package's `lib` is ["ES2022", "DOM"]
+    // without "DOM.Iterable".
+    for (const el of Array.from(wrapper.querySelectorAll(`[${INLINE_PROP_ATTR}]`))) {
+        const prop = byName.get(el.getAttribute(INLINE_PROP_ATTR) ?? '');
+        if (prop)
+            found.push({ element: el, prop });
+    }
+    return found;
+}
+/**
+ * Which element + prop a double-click inside `wrapper` binds — or null when
+ * there is nothing safe to bind, in which case the caller routes the gesture to
+ * the props-rail fallback (kywi-cms#118) rather than to the wrapper.
+ *
+ * The rules, in order (kywi-cms#145):
+ *
+ * 1. The anchor the gesture actually landed in. Double-clicking a card's body
+ *    edits the body, its footer edits the footer — the prop the owner pointed
+ *    at, not "the module's first prop".
+ * 2. Otherwise, an unambiguous single anchor in the module: a gesture anywhere
+ *    on a module with only one editable element can only have meant that one.
+ *    Two or more anchors and a gesture that landed on neither is genuinely
+ *    ambiguous → fallback.
+ * 3. Otherwise (a custom module with no anchors at all): the legacy whole-
+ *    wrapper binding, and ONLY when the module declares exactly one text prop —
+ *    the case where "everything the wrapper renders" and "the bound prop" cannot
+ *    disagree. This is what keeps heading/text/richText/button working for
+ *    module packs that never adopt the anchors.
+ *
+ * Anything else fails closed. A wrapper binding on a multi-text-prop module is
+ * the #145 corruption itself, so it is not reachable from here by any path.
+ */
+export function resolveInlineBinding(config, wrapper, target) {
+    const props = listInlineTextProps(config);
+    if (props.length === 0)
+        return null;
+    const byName = new Map(props.map(p => [p.name, p]));
+    // 1 — the anchor under the pointer.
+    if (target && (target === wrapper || wrapper.contains(target))) {
+        const anchor = target.closest(`[${INLINE_PROP_ATTR}]`);
+        if (anchor && anchor !== wrapper && wrapper.contains(anchor)) {
+            const prop = byName.get(anchor.getAttribute(INLINE_PROP_ATTR) ?? '');
+            if (prop)
+                return { prop, element: anchor, kind: 'anchor' };
+        }
+    }
+    // 2 — exactly one anchored prop in the whole module.
+    const anchors = anchorsWithin(wrapper, byName);
+    if (anchors.length === 1) {
+        const only = anchors[0];
+        return { prop: only.prop, element: only.element, kind: 'anchor' };
+    }
+    if (anchors.length > 1)
+        return null;
+    // 3 — legacy wrapper binding, single-text-prop modules only.
+    //
+    // COUPLING (kywi-cms#145 review): this rule's safety is not `props.length === 1`
+    // alone — it also rests on `resolveInlineTextProp`'s "first declared prop must
+    // be text" rule. That is what keeps `divider` (color, then a `thickness` CSS
+    // length), `countdown` (targetDate, then `label`), `navMenu` (menuSlug, …) and
+    // `component` (slug, then `componentId`) out of wrapper binding even though
+    // each declares exactly one text-typed prop: the wrapper renders a computed
+    // value, not that prop. Reordering any module's props would silently reopen
+    // wrapper binding for it, so the exact wrapper-bindable set is pinned by an
+    // invariant test over the whole registry in `__tests__/inline-text.test.tsx`.
+    const primary = resolveInlineTextProp(config);
+    if (primary && props.length === 1)
+        return { prop: primary, element: wrapper, kind: 'wrapper' };
+    return null;
+}
 /**
  * Read the edited value back out of an editing host.
  *
- * The host is the module's wrapper element, which also carries the editor's own
- * floating chrome (type chip, action cluster). Chrome is marked with
+ * For an anchored host (`data-kywi-prop`) the host IS the prop's element — it
+ * renders that prop's copy and nothing else, editor chrome included — so its
+ * content is the value, directly.
+ *
+ * For the legacy wrapper host the host also carries the editor's own floating
+ * chrome (type chip, action cluster). Chrome is marked with
  * `data-kywi-editor-chrome` and skipped, so the value comes from the module's
  * own rendered element — `innerHTML` for a rich-text prop, `textContent` for a
  * plain one.
@@ -56,8 +178,9 @@ export function resolveInlineTextProp(config) {
  * shape the public page would strip anyway.
  */
 export function readInlineTextValue(host, html) {
-    const content = Array.from(host.children).find((el) => !el.hasAttribute('data-kywi-editor-chrome'));
-    const target = content ?? host;
+    const target = host.hasAttribute(INLINE_PROP_ATTR)
+        ? host
+        : (Array.from(host.children).find((el) => !el.hasAttribute('data-kywi-editor-chrome')) ?? host);
     if (html)
         return sanitizeHtml(target.innerHTML);
     // contenteditable leaves non-breaking spaces behind where the browser padded

package/dist/admin/layout-editor/inline-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"inline-text.js","sourceRoot":"","sources":["../../../src/admin/layout-editor/inline-text.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAGH,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAA;AAUrD,0CAA0C;AAC1C,MAAM,eAAe,GAAG,IAAI,GAAG,CAAC,CAAC,MAAM,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAA;AAEjE;;;;;GAKG;AACH,MAAM,mBAAmB,GAAG,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,CAAC,CAAA;AAE7C;;;;;;;;GAQG;AACH,MAAM,UAAU,qBAAqB,CAAC,MAAuC;IAC3E,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAA;IACxB,IAAI,mBAAmB,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC;QAAE,OAAO,IAAI,CAAA;IACrD,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,CAA0C,CAAA;IAC3F,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,CAAA;IACxB,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAA;IACvB,MAAM,CAAC,IAAI,EAAE,UAAU,CAAC,GAAG,KAAK,CAAA;IAChC,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,CAAC;QAAE,OAAO,IAAI,CAAA;IACtD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,CAAC,IAAI,KAAK,UAAU,EAAE,CAAA;AACvD,CAAC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,mBAAmB,CAAC,IAAiB,EAAE,IAAa;IAClE,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAC5C,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,YAAY,CAAC,yBAAyB,CAAC,CACzB,CAAA;IAC5B,MAAM,MAAM,GAAG,OAAO,IAAI,IAAI,CAAA;IAC9B,IAAI,IAAI;QAAE,OAAO,YAAY,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;IAC/C,6EAA6E;IAC7E,4EAA4E;IAC5E,OAAO,CAAC,MAAM,CAAC,WAAW,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,CAAA;AAClE,CAAC"}
+{"version":3,"file":"inline-text.js","sourceRoot":"","sources":["../../../src/admin/layout-editor/inline-text.ts"],"names":[],"mappings":"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"}

package/dist/admin/layout-editor/module-overlay.d.ts

@@ -1,21 +1,31 @@
 import React from 'react';
 import type { OverlayAction } from './section-overlay.js';
+import type { InlineTextProp, InlineTextBindingTarget } from './inline-text.js';
 /**
- * Inline text editing for one module (kywi-cms#94). The overlay makes its own
- * wrapper — which contains the module's real rendered element — contenteditable
- * so the owner types on the page, in the page's styling. Commit reads the value
+ * Inline text editing for one module (kywi-cms#94, kywi-cms#145). The overlay
+ * makes the element that renders ONE prop contenteditable — the real `<h3>` a
+ * card's title is drawn in — so the owner types on the page, in the page's
+ * styling, and a commit can only ever write that prop. Commit reads the value
  * back out of the DOM (see `readInlineTextValue`); the parent turns that into an
  * `UPDATE_PROPS` dispatch, so the edit goes through history like any other.
+ *
+ * Which element that is is resolved per gesture rather than per module: see
+ * `resolveInlineBinding`, which the parent wires into `resolve` below.
  */
 export interface InlineTextBinding {
     /** True while THIS module is the one being text-edited. */
     active: boolean;
-    /** Whether the bound prop holds HTML (Enter inserts a line break instead of committing). */
-    html: boolean;
+    /**
+     * Resolve the element + prop a gesture at `target` binds, or null when there
+     * is nothing safe to bind — in which case the gesture falls through to
+     * `onInlineFallback` (the props rail) instead of editing anything
+     * (kywi-cms#145).
+     */
+    resolve: (wrapper: HTMLElement, target: Element | null) => InlineTextBindingTarget | null;
     /** Begin editing (double-click, or a click on an already-selected module). */
     onActivate: () => void;
-    /** Commit the value currently in `host` and end the edit. */
-    onCommit: (host: HTMLElement) => void;
+    /** Commit the value currently in `host` to `prop` and end the edit. */
+    onCommit: (host: HTMLElement, prop: InlineTextProp) => void;
     /** Abandon the edit and end it, leaving the stored props untouched. */
     onCancel: () => void;
 }
@@ -49,12 +59,15 @@ interface ModuleOverlayProps {
     /** Inline text editing binding, when this module carries a primary text prop. */
     inlineText?: InlineTextBinding | null;
     /**
-     * Double-click fallback for a module with no primary text prop (kywi-cms#118).
-     * Without a text prop to bind, double-click otherwise no-ops and reads as
-     * "dead" — this routes the gesture to the props rail instead: select the
-     * module, then focus its first field there. Only meaningful in in-place mode
-     * (see `inlineTextBindingFor`'s own `!inPlace` short-circuit); admin canvas
-     * never carries `inlineEdit`, so it never gets this either.
+     * Double-click fallback for a gesture with nothing safe to bind
+     * (kywi-cms#118, widened by kywi-cms#145). That is a module with no text prop
+     * at all, and now also one whose text props the renderer does not anchor
+     * individually — where the old wrapper binding was the corruption. Without it
+     * double-click no-ops and reads as "dead", so this routes the gesture to the
+     * props rail instead: select the module, then focus its first field there.
+     * Only meaningful in in-place mode (see `inlineTextBindingFor`'s own `!inPlace`
+     * short-circuit); admin canvas never carries `inlineEdit`, so it never gets
+     * this either.
      */
     onInlineFallback?: () => void;
     children: React.ReactNode;

package/dist/admin/layout-editor/module-overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"module-overlay.d.ts","sourceRoot":"","sources":["../../../src/admin/layout-editor/module-overlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAGzD;;;;;;GAMG;AACH,MAAM,WAAW,iBAAiB;IAChC,2DAA2D;IAC3D,MAAM,EAAE,OAAO,CAAA;IACf,4FAA4F;IAC5F,IAAI,EAAE,OAAO,CAAA;IACb,8EAA8E;IAC9E,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,6DAA6D;IAC7D,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;IACrC,uEAAuE;IACvE,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB;;;;;sDAKkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,OAAO,CAAA;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,aAAa,EAAE,CAAA;IACzB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,iFAAiF;IACjF,UAAU,CAAC,EAAE,iBAAiB,GAAG,IAAI,CAAA;IACrC;;;;;;;OAOG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EACP,SAAS,EACT,OAAe,EACf,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,GACT,EAAE,kBAAkB,2CA6MpB"}
+{"version":3,"file":"module-overlay.d.ts","sourceRoot":"","sources":["../../../src/admin/layout-editor/module-overlay.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AACzD,OAAO,KAAK,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,kBAAkB,CAAA;AAG/E;;;;;;;;;;GAUG;AACH,MAAM,WAAW,iBAAiB;IAChC,2DAA2D;IAC3D,MAAM,EAAE,OAAO,CAAA;IACf;;;;;OAKG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,GAAG,IAAI,KAAK,uBAAuB,GAAG,IAAI,CAAA;IACzF,8EAA8E;IAC9E,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,uEAAuE;IACvE,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,cAAc,KAAK,IAAI,CAAA;IAC3D,uEAAuE;IACvE,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB;;;;;sDAKkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,6DAA6D;IAC7D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,UAAU,EAAE,OAAO,CAAA;IACnB,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,OAAO,CAAC,EAAE,aAAa,EAAE,CAAA;IACzB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,iFAAiF;IACjF,UAAU,CAAC,EAAE,iBAAiB,GAAG,IAAI,CAAA;IACrC;;;;;;;;;;OAUG;IACH,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC7B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EACP,SAAS,EACT,OAAe,EACf,UAAU,EACV,UAAU,EACV,gBAAgB,EAChB,QAAQ,GACT,EAAE,kBAAkB,2CAiYpB"}

package/dist/admin/layout-editor/module-overlay.js

@@ -18,20 +18,131 @@ export function ModuleOverlay({ moduleId, instanceId, columnId, index, isSelecte
     // Escape must not commit: turning contenteditable off blurs the host, and the
     // blur handler would otherwise save the very edit the owner just abandoned.
     const cancellingRef = React.useRef(false);
+    /** The element + prop the CURRENT edit is bound to (kywi-cms#145). */
+    const boundRef = React.useRef(null);
+    // Read inside effects and event handlers, which must see the latest binding
+    // without re-running the editing effect (which would re-focus and re-place the
+    // caret) every time the parent re-creates the binding object.
+    const inlineTextRef = React.useRef(inlineText);
+    inlineTextRef.current = inlineText;
     const setRefs = React.useCallback((node) => {
         hostRef.current = node;
         setNodeRef(node);
     }, [setNodeRef]);
     const isEditing = Boolean(inlineText?.active);
-    // Focus the editing host and drop the caret at the end of the text, so typing
-    // continues the copy rather than replacing it.
+    /**
+     * Recovery counter for an edit whose element went away (kywi-cms#145 review).
+     * Bumping it re-runs the attach effect below against the DOM that is actually
+     * on the page now.
+     */
+    const [attachNonce, setAttachNonce] = React.useState(0);
+    const reattach = React.useCallback(() => setAttachNonce(n => n + 1), []);
+    /**
+     * Set once a session has failed to re-resolve and has asked to end. Without
+     * it the recovery effect and the attach effect would take turns forever on a
+     * module that genuinely has nothing left to bind.
+     */
+    const abandonedRef = React.useRef(false);
+    /**
+     * True when a live edit has no element on the page any more.
+     *
+     * The module's inner DOM can be replaced under an edit — undo emptying a
+     * heading swaps the renderer for the #134 empty state, a prop change re-keys
+     * a subtree. `contenteditable` is then sitting on a detached node: it can
+     * never fire `focusout`, so the edit can never commit, and the gesture
+     * handlers below would swallow every click as "already editing", leaving the
+     * module inert until a window-level Escape (kywi-cms#145 review).
+     */
+    function isOrphanedEdit() {
+        const bound = boundRef.current;
+        return !bound || !bound.element.isConnected;
+    }
+    /** Resolve + remember what a gesture at `target` would edit. */
+    function bind(target) {
+        const wrapper = hostRef.current;
+        const binding = inlineTextRef.current;
+        if (!wrapper || !binding)
+            return null;
+        const bound = binding.resolve(wrapper, target);
+        boundRef.current = bound;
+        return bound;
+    }
+    /**
+     * Take an orphaned session over with THIS gesture: re-resolve from where the
+     * pointer landed and re-attach. Returns false — and ends the session — when
+     * nothing resolves, so the gesture falls through to select/rail rather than
+     * being eaten by an edit that can no longer go anywhere.
+     *
+     * `bind` has already stored the answer by the time `reattach` runs, and the
+     * attach effect below is written to consume it (kywi-cms#145 review round 2):
+     * the pointer is the ONLY thing that can say which of a card's remaining
+     * anchors the owner meant, so losing it here would strand every recovery on a
+     * module with two or more of them.
+     */
+    function recoverOrphanedEdit(target) {
+        if (bind(target)) {
+            reattach();
+            return true;
+        }
+        inlineTextRef.current?.onCancel();
+        return false;
+    }
+    // Reset per session, ahead of the attach effect below (effects run in
+    // declaration order), so a session that ended in failure does not poison the
+    // next one.
+    React.useEffect(() => {
+        if (isEditing)
+            abandonedRef.current = false;
+    }, [isEditing]);
+    // Turn contenteditable on for the BOUND ELEMENT — not the wrapper, unless the
+    // wrapper is what resolution chose (kywi-cms#145) — then focus it and drop the
+    // caret at the end of the text, so typing continues the copy rather than
+    // replacing it. Imperative rather than a rendered `contentEditable` prop
+    // because the bound element belongs to the module's own renderer, not to this
+    // component's JSX.
     React.useEffect(() => {
-        if (!isEditing)
+        if (!isEditing) {
+            // Where the binding is forgotten — deliberately NOT in the cleanup below
+            // (kywi-cms#145 review round 2). React runs a cleanup BEFORE the next
+            // effect body, so clearing it there also cleared it on an `attachNonce`
+            // re-run: `recoverOrphanedEdit` resolved a binding from the gesture, the
+            // cleanup threw it away, and this body fell back to resolving with no
+            // pointer at all — which returns null, and so CANCELS the session, on any
+            // module that still has two or more anchors (rule 2 is ambiguous there).
+            // This effect only re-runs on `isEditing`/`attachNonce`, and the nonce
+            // only moves while an edit is live, so reaching here means the session
+            // itself has ended.
+            boundRef.current = null;
+            return;
+        }
+        const wrapper = hostRef.current;
+        if (!wrapper)
             return;
-        const host = hostRef.current;
-        if (!host)
+        // An activation this component did not start (the parent set `editingId`
+        // directly) has no gesture to resolve from — resolve pointer-lessly. Same
+        // for a binding whose element has since left the document (kywi-cms#145
+        // review): re-resolve rather than attach to a node nobody can see. A
+        // binding a recovering gesture just resolved passes all three checks and is
+        // used as-is, which is the point of the recovery.
+        let bound = boundRef.current;
+        if (!bound ||
+            !bound.element.isConnected ||
+            (bound.element !== wrapper && !wrapper.contains(bound.element))) {
+            bound = inlineTextRef.current?.resolve(wrapper, null) ?? null;
+            boundRef.current = bound;
+        }
+        if (!bound) {
+            // Active with nothing bindable — the module re-rendered out from under an
+            // edit, say. End the session rather than leave the owner in an "editing"
+            // module that swallows nothing and cannot be typed in.
+            abandonedRef.current = true;
+            inlineTextRef.current?.onCancel();
             return;
+        }
+        const host = bound.element;
         cancellingRef.current = false;
+        host.setAttribute('contenteditable', 'true');
+        host.setAttribute('spellcheck', 'true');
         host.focus();
         const selection = window.getSelection?.();
         if (selection && typeof document.createRange === 'function') {
@@ -41,7 +152,46 @@ export function ModuleOverlay({ moduleId, instanceId, columnId, index, isSelecte
             selection.removeAllRanges();
             selection.addRange(range);
         }
-    }, [isEditing]);
+        // A `<summary>` anchor — the accordion's title, the FAQ's question — keeps
+        // its activation behaviour while contenteditable (kywi-cms#145 review): in
+        // Chrome a click that only meant "put the caret here" also toggles the
+        // panel out from under the caret, and Space toggles as well as typing.
+        // Both reach the toggle as the CLICK event's default action (the keyboard
+        // ones through a synthesized click), so cancelling that one event stops the
+        // toggle while leaving caret placement (a mousedown default) and character
+        // insertion (a beforeinput default) alone. Deliberately not a keydown
+        // preventDefault: that would stop Space typing a space, which is the very
+        // behaviour this is here to preserve. Switching the anchor to an inner
+        // `<span>` is not an option — the published markup must stay byte-identical
+        // (layout/__tests__/inline-prop-anchors.test.tsx).
+        const suppressActivation = host.tagName === 'SUMMARY' ? (event) => event.preventDefault() : null;
+        if (suppressActivation)
+            host.addEventListener('click', suppressActivation);
+        return () => {
+            // Undo exactly what this run did to `host`, and nothing else. On a
+            // re-attach that means the OLD element goes back to being ordinary markup
+            // (suppressor and all, so a re-bind away from a `<summary>` stops
+            // swallowing its clicks) while the binding itself — which by then may be
+            // the new one a gesture resolved — is left alone; the session's binding is
+            // cleared by the `!isEditing` branch above instead.
+            if (suppressActivation)
+                host.removeEventListener('click', suppressActivation);
+            host.removeAttribute('contenteditable');
+            host.removeAttribute('spellcheck');
+        };
+    }, [isEditing, attachNonce]);
+    // The other half of the orphan recovery: no deps, so it runs after EVERY
+    // render (and after the attach effect above, which is declared first). A
+    // re-render that replaced the module's inner DOM lands here with a bound
+    // element that is no longer in the document — re-run the attach against what
+    // is there now (kywi-cms#145 review).
+    React.useEffect(() => {
+        if (!isEditing || abandonedRef.current)
+            return;
+        if (!isOrphanedEdit())
+            return;
+        reattach();
+    });
     const style = {
         transform: CSS.Transform.toString(transform),
         transition,
@@ -53,26 +203,48 @@ export function ModuleOverlay({ moduleId, instanceId, columnId, index, isSelecte
         // instead of following the link (kywi-cms#94).
         if (inPlace)
             e.preventDefault();
-        if (isEditing)
+        // A live edit swallows clicks — but only a LIVE one. An orphaned session
+        // (see `isOrphanedEdit`) must let the gesture re-bind, or the module stays
+        // inert (kywi-cms#145 review).
+        if (isEditing) {
+            if (!isOrphanedEdit())
+                return;
+            if (recoverOrphanedEdit(e.target))
+                return;
+            onSelect();
             return;
+        }
         // A click on an already-selected, text-bearing module starts typing —
-        // the second click of the "select, then edit" pattern (kywi-cms#94).
+        // the second click of the "select, then edit" pattern (kywi-cms#94). Which
+        // prop that is depends on where the click landed (kywi-cms#145); a click
+        // with nothing safe to bind just leaves the module selected, and the
+        // double-click that follows routes to the rail.
         if (inlineText && isSelected) {
-            inlineText.onActivate();
+            if (bind(e.target))
+                inlineText.onActivate();
             return;
         }
         onSelect();
     }
     function handleDoubleClick(e) {
-        if (isEditing)
-            return;
-        if (inlineText) {
+        if (isEditing) {
+            if (!isOrphanedEdit())
+                return;
+            if (recoverOrphanedEdit(e.target)) {
+                e.stopPropagation();
+                return;
+            }
+            // Nothing left to re-bind: the session has just ended, so fall through to
+            // the rail fallback below rather than eating the double-click.
+        }
+        if (inlineText && bind(e.target)) {
             e.stopPropagation();
             inlineText.onActivate();
             return;
         }
-        // No primary text prop to bind (kywi-cms#118) — route the gesture to the
-        // props rail instead of leaving it a silent no-op.
+        // Nothing safe to bind (kywi-cms#118, kywi-cms#145) — route the gesture to
+        // the props rail instead of leaving it a silent no-op, and never to the
+        // wrapper, which renders more than any one prop.
         if (onInlineFallback) {
             e.stopPropagation();
             onInlineFallback();
@@ -84,39 +256,46 @@ export function ModuleOverlay({ moduleId, instanceId, columnId, index, isSelecte
         if (e.key === 'Escape') {
             // Handled here rather than at the window: stopping propagation keeps the
             // shell's Escape handler (deselect) from also firing for the same press.
+            // Deliberately not gated on a resolved binding — Escape is the way out of
+            // an edit session however it got into trouble.
             e.preventDefault();
             e.stopPropagation();
             cancellingRef.current = true;
             inlineText.onCancel();
             return;
         }
-        if (e.key === 'Enter' && !e.shiftKey && !inlineText.html) {
+        const bound = boundRef.current;
+        if (!bound)
+            return;
+        if (e.key === 'Enter' && !e.shiftKey && !bound.prop.html) {
             // A plain-text prop is a single line — Enter means "done", not a newline.
             e.preventDefault();
             e.stopPropagation();
-            inlineText.onCommit(e.currentTarget);
+            inlineText.onCommit(bound.element, bound.prop);
         }
     }
     function handleBlur(e) {
-        if (!isEditing || !inlineText)
+        const bound = boundRef.current;
+        if (!isEditing || !inlineText || !bound)
             return;
         // Focus moving to a child (an action button) is not leaving the edit.
+        // `currentTarget` is the wrapper: React's onBlur is focusout, which bubbles,
+        // so the edit's own element reports through here whatever it is bound to.
         if (e.relatedTarget && e.currentTarget.contains(e.relatedTarget))
             return;
         if (cancellingRef.current) {
             cancellingRef.current = false;
             return;
         }
-        inlineText.onCommit(e.currentTarget);
+        inlineText.onCommit(bound.element, bound.prop);
     }
+    // No rendered `contentEditable` here: the edit is turned on imperatively, on
+    // the resolved element, by the effect above (kywi-cms#145).
     const editingProps = inlineText
         ? {
             onDoubleClick: handleDoubleClick,
             onKeyDown: handleKeyDown,
             onBlur: handleBlur,
-            ...(isEditing
-                ? { contentEditable: true, suppressContentEditableWarning: true, spellCheck: true }
-                : {}),
         }
         : onInlineFallback
             ? { onDoubleClick: handleDoubleClick }