mnfst 0.5.220 → 0.5.222

package/lib/manifest.appwrite.data.js

@@ -2,7 +2,7 @@
 
 (function () {
 
-const MANIFEST_BUILD_VERSION = '0.5.220';
+const MANIFEST_BUILD_VERSION = '0.5.222';
 
 /* Manifest Data Sources - Appwrite Integration */
 

package/lib/manifest.css

@@ -2930,54 +2930,22 @@
 @layer utilities {
 
     /* ---- Editing UI scope ----
-       ALL chrome — region outline + label, sortable grips, movable/text outlines,
-       size-handle hairlines, the floating toolbar — lives under ONE scope:
-       [data-edit-ui], on the region itself or any ancestor (e.g. <body data-edit-ui>
-       for a whole editor view). The plugin sets it on `.authoring` regions
-       automatically; everything else opts in with the attribute. A region outside
-       the scope is just as editable — it simply carries no visual cues. */
+       ALL chrome — cursors, movable/text outlines, size-handle hairlines, drop
+       targets, the floating toolbar — lives under ONE scope: [data-edit-ui], on
+       the region itself or any ancestor (e.g. <body data-edit-ui> for a whole
+       editor view). The plugin sets it on `.authoring` regions automatically;
+       everything else opts in with the attribute. A region outside the scope is
+       just as editable — it simply carries no visual cues. */
 
     /* ---- Editable area (armed) ---- */
     :where([data-edit-armed]) {
         position: relative;
     }
 
-    /* Quiet until touched. A page covered in dashed boxes reads as a diagram of
-       itself; the affordance only has to be there when you go looking for it.
-       While an inner affordance is engaged (text caret, handle, row), the region
-       outline stands down so only the element being edited is highlighted. */
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *) {
-        outline: 1px dashed transparent;
-        outline-offset: 6px;
-        border-radius: var(--radius);
-        transition: outline-color 0.12s ease;
-    }
-
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *):is(:hover, :focus-within):not(:has([contenteditable]:is(:hover, :focus), [data-edit-handle]:is(:hover, :focus), [data-edit-sortable]:is(:hover, :focus-within), [data-edit-movable]:is(:hover, :focus))) {
-        outline-color: var(--color-line);
-    }
-
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *)::before {
-        content: attr(data-edit-label);
-        position: absolute;
-        inset-block-start: calc(-0.6em - 6px);
-        inset-inline-start: 0.5rem;
-        padding-inline: 0.3rem;
-        background: var(--color-page);
-        border-radius: 3px;
-        font-size: 0.7rem;
-        line-height: 1.2;
-        letter-spacing: 0.04em;
-        text-transform: uppercase;
-        color: var(--color-content-subtle);
-        pointer-events: none;
-        opacity: 0;
-        transition: opacity 0.12s ease;
-    }
-
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *):is(:hover, :focus-within):not(:has([contenteditable]:is(:hover, :focus), [data-edit-handle]:is(:hover, :focus), [data-edit-sortable]:is(:hover, :focus-within), [data-edit-movable]:is(:hover, :focus)))::before {
-        opacity: 1;
-    }
+    /* No default region boundary or label: a page being edited should look
+       like the page, not a diagram of its regions. The hooks remain for a real
+       editor product to draw its own — [data-edit-authoring] marks the region
+       and data-edit-label carries "key · regime". */
 
     /* ---- Reorder (pointer + keyboard; touch-action:none lets touch-drag beat scroll) ---- */
     :where([data-edit-sortable]) {
@@ -2986,31 +2954,9 @@
         transition: opacity 0.12s ease, outline-color 0.12s ease;
     }
 
-    /* The grip: the plugin's own inline drag affordance, sitting inside the row
-       at its inline start. A dot grid, revealed on approach. --edit-grip sizes
-       it; `--edit-grip-display: none` removes it entirely (a zero width alone
-       would still occupy a grid cell). No full-row outline — the grip and the
-       cursor say "draggable" without boxing the content. */
-    :where([data-edit-ui] [data-edit-sortable], [data-edit-ui][data-edit-sortable])::before {
-        content: '';
-        display: var(--edit-grip-display, inline-block);
-        vertical-align: middle;
-        align-self: center;
-        flex: 0 0 auto;
-        width: var(--edit-grip, 0.6rem);
-        height: 1rem;
-        margin-inline-end: calc(var(--edit-grip, 0.6rem) / 2);
-        background-image: radial-gradient(circle, var(--color-content-subtle) 1px, transparent 1px);
-        background-size: 0.3rem 0.3rem;
-        background-position: center;
-        opacity: 0;
-        transition: opacity 0.12s ease;
-        pointer-events: none;
-    }
-
-    :where([data-edit-ui] [data-edit-sortable], [data-edit-ui][data-edit-sortable]):is(:hover, :focus-visible)::before {
-        opacity: 0.9;
-    }
+    /* No injected grip: the row itself is the handle (grab cursor), while text
+       inside stays a text surface (text cursor, below). Rows that are pure text
+       still reorder by keyboard. */
 
     :where([data-edit-sortable], [data-edit-movable]):focus-visible {
         outline: 2px solid var(--edit-accent, var(--color-brand-content));
@@ -3033,6 +2979,14 @@
         pointer-events: none;
     }
 
+    /* Valid cross-region destinations during a drag: a dashed invitation, and
+       enough height that an EMPTY region can be dropped onto at all. */
+    :where([data-edit-drop-target]) {
+        outline: 1px dashed color-mix(in oklch, var(--edit-accent, var(--color-brand-content)) 55%, transparent);
+        outline-offset: 4px;
+        min-height: 2.5rem;
+    }
+
     /* Nothing else should react while a drag is in progress */
     :where([data-edit-dragging-in]) {
         cursor: grabbing;
@@ -3064,6 +3018,7 @@
        1px line, so focusing doesn't make the page jump a weight class. */
     :where([data-edit-ui]) :where([data-edit-armed]) [contenteditable="true"],
     :where([data-edit-ui])[data-edit-armed] [contenteditable="true"] {
+        cursor: text;
         outline: 1px solid transparent;
         outline-offset: 2px;
         border-radius: 3px;
@@ -4263,13 +4218,9 @@
 @layer components {
 
     :where([data-text-edit]) {
-        min-height: var(--text-edit-min-height, 8rem);
-        max-height: var(--text-edit-max-height, none);
+        position: relative;
         overflow-y: auto;
-        padding: var(--text-edit-padding, 0.75rem);
-        background: var(--text-edit-background, var(--color-surface-1));
-        border: 1px solid var(--color-line);
-        border-radius: var(--radius);
+        max-height: var(--text-edit-max-height, none);
         outline: none;
 
         /* Page-level styling — set by .page controls, read back by $text.page.
@@ -4280,19 +4231,45 @@
         text-align: var(--text-edit-align, start);
         color: var(--text-edit-color, inherit);
 
-        &:focus {
-            border-color: var(--color-content-subtle);
-        }
-
         /* Flagged from script: :empty never matches the <br> a contenteditable
-           keeps, and the tag holding it is not predictable after a wipe. */
+           keeps, and the tag holding it is not predictable after a wipe. The
+           placeholder OVERLAYS the first line (it is not a line of its own), so
+           the caret sits on top of it and nothing jumps when typing starts. */
         &[data-text-edit-empty]::before {
             content: attr(placeholder);
+            position: absolute;
+            inset-block-start: var(--text-edit-padding, 0.75rem);
+            inset-inline: var(--text-edit-padding, 0.75rem);
             color: var(--color-content-subtle);
             pointer-events: none;
         }
     }
 
+    /* An unstyled area has no field padding, so its placeholder hugs the line. */
+    :where([data-text-edit].unstyle)[data-text-edit-empty]::before {
+        inset-block-start: 0;
+        inset-inline: 0;
+    }
+
+    /* The FIELD look. `.unstyle` drops it so an area can sit seamlessly in a
+       page — a WYSIWYG document inherits its element's own type and colours;
+       everything above (caret custody, placeholder, commands) still works. */
+    :where([data-text-edit]:not(.unstyle)) {
+        min-height: var(--text-edit-min-height, 8rem);
+        padding: var(--text-edit-padding, 0.75rem);
+        background: var(--text-edit-background, var(--color-surface-1));
+        border: 1px solid var(--color-line);
+        border-radius: var(--radius);
+
+        /* Held while the area owns the editing session — a <select> or colour
+           control takes NATIVE focus by design, and the ring must not flicker
+           off while the writer is mid-command. */
+        &:focus,
+        &[data-text-edit-focused] {
+            border-color: var(--color-content-subtle);
+        }
+    }
+
     /* ---- Selection menu (x-text-edit-menu) ----
        Positioned by the --text-edit-selection-* variables the plugin writes to
        :root, so the default needs no script; restyle or reposition freely. */
@@ -4303,7 +4280,6 @@
         left: var(--text-edit-selection-center);
         top: var(--text-edit-selection-y);
         transform: translate(-50%, calc(-100% - 0.5rem));
-        display: flex;
         gap: 0.25rem;
         align-items: center;
         padding: 0.25rem;
@@ -4313,6 +4289,13 @@
         box-shadow: 0 8px 30px rgb(0 0 0 / 0.2);
     }
 
+    /* display only while OPEN: an author display on the base rule would beat
+       the UA's closed-popover display:none, leaving the menu floating fixed
+       over the page before any selection exists. */
+    :where([data-text-edit-menu]:popover-open) {
+        display: flex;
+    }
+
     /* Without the Popover API the attribute is inert and the menu would render
        permanently fixed on the page — hide it there; the bubble is progressive
        enhancement. (In supporting browsers a closed popover is hidden natively.) */

package/lib/manifest.data.js

@@ -2,7 +2,7 @@
 
 (function () {
 
-const MANIFEST_BUILD_VERSION = '0.5.220';
+const MANIFEST_BUILD_VERSION = '0.5.222';
 
 /* Manifest Data Sources - Configuration */
 

package/lib/manifest.edit.css

@@ -10,54 +10,22 @@
 @layer utilities {
 
     /* ---- Editing UI scope ----
-       ALL chrome — region outline + label, sortable grips, movable/text outlines,
-       size-handle hairlines, the floating toolbar — lives under ONE scope:
-       [data-edit-ui], on the region itself or any ancestor (e.g. <body data-edit-ui>
-       for a whole editor view). The plugin sets it on `.authoring` regions
-       automatically; everything else opts in with the attribute. A region outside
-       the scope is just as editable — it simply carries no visual cues. */
+       ALL chrome — cursors, movable/text outlines, size-handle hairlines, drop
+       targets, the floating toolbar — lives under ONE scope: [data-edit-ui], on
+       the region itself or any ancestor (e.g. <body data-edit-ui> for a whole
+       editor view). The plugin sets it on `.authoring` regions automatically;
+       everything else opts in with the attribute. A region outside the scope is
+       just as editable — it simply carries no visual cues. */
 
     /* ---- Editable area (armed) ---- */
     :where([data-edit-armed]) {
         position: relative;
     }
 
-    /* Quiet until touched. A page covered in dashed boxes reads as a diagram of
-       itself; the affordance only has to be there when you go looking for it.
-       While an inner affordance is engaged (text caret, handle, row), the region
-       outline stands down so only the element being edited is highlighted. */
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *) {
-        outline: 1px dashed transparent;
-        outline-offset: 6px;
-        border-radius: var(--radius);
-        transition: outline-color 0.12s ease;
-    }
-
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *):is(:hover, :focus-within):not(:has([contenteditable]:is(:hover, :focus), [data-edit-handle]:is(:hover, :focus), [data-edit-sortable]:is(:hover, :focus-within), [data-edit-movable]:is(:hover, :focus))) {
-        outline-color: var(--color-line);
-    }
-
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *)::before {
-        content: attr(data-edit-label);
-        position: absolute;
-        inset-block-start: calc(-0.6em - 6px);
-        inset-inline-start: 0.5rem;
-        padding-inline: 0.3rem;
-        background: var(--color-page);
-        border-radius: 3px;
-        font-size: 0.7rem;
-        line-height: 1.2;
-        letter-spacing: 0.04em;
-        text-transform: uppercase;
-        color: var(--color-content-subtle);
-        pointer-events: none;
-        opacity: 0;
-        transition: opacity 0.12s ease;
-    }
-
-    :where([data-edit-armed]):where([data-edit-ui], [data-edit-ui] *):is(:hover, :focus-within):not(:has([contenteditable]:is(:hover, :focus), [data-edit-handle]:is(:hover, :focus), [data-edit-sortable]:is(:hover, :focus-within), [data-edit-movable]:is(:hover, :focus)))::before {
-        opacity: 1;
-    }
+    /* No default region boundary or label: a page being edited should look
+       like the page, not a diagram of its regions. The hooks remain for a real
+       editor product to draw its own — [data-edit-authoring] marks the region
+       and data-edit-label carries "key · regime". */
 
     /* ---- Reorder (pointer + keyboard; touch-action:none lets touch-drag beat scroll) ---- */
     :where([data-edit-sortable]) {
@@ -66,31 +34,9 @@
         transition: opacity 0.12s ease, outline-color 0.12s ease;
     }
 
-    /* The grip: the plugin's own inline drag affordance, sitting inside the row
-       at its inline start. A dot grid, revealed on approach. --edit-grip sizes
-       it; `--edit-grip-display: none` removes it entirely (a zero width alone
-       would still occupy a grid cell). No full-row outline — the grip and the
-       cursor say "draggable" without boxing the content. */
-    :where([data-edit-ui] [data-edit-sortable], [data-edit-ui][data-edit-sortable])::before {
-        content: '';
-        display: var(--edit-grip-display, inline-block);
-        vertical-align: middle;
-        align-self: center;
-        flex: 0 0 auto;
-        width: var(--edit-grip, 0.6rem);
-        height: 1rem;
-        margin-inline-end: calc(var(--edit-grip, 0.6rem) / 2);
-        background-image: radial-gradient(circle, var(--color-content-subtle) 1px, transparent 1px);
-        background-size: 0.3rem 0.3rem;
-        background-position: center;
-        opacity: 0;
-        transition: opacity 0.12s ease;
-        pointer-events: none;
-    }
-
-    :where([data-edit-ui] [data-edit-sortable], [data-edit-ui][data-edit-sortable]):is(:hover, :focus-visible)::before {
-        opacity: 0.9;
-    }
+    /* No injected grip: the row itself is the handle (grab cursor), while text
+       inside stays a text surface (text cursor, below). Rows that are pure text
+       still reorder by keyboard. */
 
     :where([data-edit-sortable], [data-edit-movable]):focus-visible {
         outline: 2px solid var(--edit-accent, var(--color-brand-content));
@@ -113,6 +59,14 @@
         pointer-events: none;
     }
 
+    /* Valid cross-region destinations during a drag: a dashed invitation, and
+       enough height that an EMPTY region can be dropped onto at all. */
+    :where([data-edit-drop-target]) {
+        outline: 1px dashed color-mix(in oklch, var(--edit-accent, var(--color-brand-content)) 55%, transparent);
+        outline-offset: 4px;
+        min-height: 2.5rem;
+    }
+
     /* Nothing else should react while a drag is in progress */
     :where([data-edit-dragging-in]) {
         cursor: grabbing;
@@ -144,6 +98,7 @@
        1px line, so focusing doesn't make the page jump a weight class. */
     :where([data-edit-ui]) :where([data-edit-armed]) [contenteditable="true"],
     :where([data-edit-ui])[data-edit-armed] [contenteditable="true"] {
+        cursor: text;
         outline: 1px solid transparent;
         outline-offset: 2px;
         border-radius: 3px;

package/lib/manifest.edit.js

@@ -17,7 +17,7 @@
 
 (function () {
     const LS_KEY = 'mnfst-edit-log';
-    const SCHEMA = 6;                  // overlay schema version — bump when the delta shape changes
+    const SCHEMA = 7;                  // overlay schema version — bump when the delta shape changes
     const HISTORY_CAP = 400;           // cap the append-only log so long sessions don't grow unbounded
     const ALL_CAPS = ['sort', 'text', 'style', 'size', 'data'];   // 'data' = edit $x field values (opt-in)
     let dragged = null, autoN = 0;
@@ -367,7 +367,12 @@
         const region = key(area), path = el.getAttribute('data-edit-key');
         if (!path) return;                          // not an addressable node
         if (prop === 'text') value = sanitizeFor(el, value);
-        const before = prop === 'text' ? el._preEdit : prop === 'class' ? el._preClass : el._preStyle;
+        // _pre* comes from the focus/open listener; when an edit arrives without
+        // one (programmatic focus, scripted writes), the arm-time baseline keeps
+        // `before` truthful so undo can still reach the original.
+        const fallback = prop === 'text' ? area._baseText && area._baseText[path] : prop === 'class' ? area._baseClass && area._baseClass[path] : area._baseStyle && area._baseStyle[path];
+        const pre = prop === 'text' ? el._preEdit : prop === 'class' ? el._preClass : el._preStyle;
+        const before = pre !== undefined ? pre : fallback;
         if (before === value) return;
         log.splice(cursor); log.push({ kind: 'st-node', region, path, prop, value, before, sig: nodeSig(el) }); cursor = log.length; saveState(); refresh();
     }
@@ -421,7 +426,7 @@
             if (el.hasAttribute('data-edit-handle') || el.hasAttribute('data-edit-ghost')) continue;
             if (el.parentElement && el.parentElement.closest('[data-text-edit]')) continue;
             const cur = el.getAttribute('data-edit-key');
-            const base = cur ? cur.split('#')[0] : staticKey(el);
+            const base = cur ? ((/^([\s\S]*)#\d+$/.exec(cur) || [, cur])[1]) : staticKey(el);   // ordinal = last #digits suffix
             const n = seen[base] = (seen[base] || 0) + 1;
             const k = n > 1 ? base + '#' + n : base;
             if (cur !== k) { el.setAttribute('data-edit-key', k); if (cur) changes.push([cur, k]); }
@@ -775,6 +780,12 @@
         // opens is a real element the author can style — by default a translucent
         // copy of what is being dragged, showing exactly where it would land.
         const lift = (ev) => {
+            // Valid cross-region destinations announce themselves for the whole
+            // drag: a dashed target outline, and a min-height (via CSS) so an
+            // EMPTY region has a surface to drop onto at all.
+            if (crossOK) areas().forEach(a => {
+                if (a !== area && isActive(a) && !locked(a) && capOf(a, 'sort') && classify(a) === 'static' && topArea(a)) a.setAttribute('data-edit-drop-target', '');
+            });
             ghost = item.cloneNode(true);
             ghost.setAttribute('data-edit-ghost', '');
             ghost.setAttribute('x-ignore', '');            // a clone must not re-bind
@@ -822,6 +833,7 @@
         const settle = (cancelled) => {
             document.removeEventListener('pointermove', onMove);
             document.removeEventListener('pointerup', onUp);
+            document.removeEventListener('pointercancel', onCancel);
             document.removeEventListener('keydown', onKey, true);
             if (frame) cancelAnimationFrame(frame);
             if (!active) return;
@@ -832,6 +844,7 @@
             if (preStyle == null) item.removeAttribute('style'); else item.setAttribute('style', preStyle);
             item.removeAttribute('data-edit-dragging');
             area.removeAttribute('data-edit-dragging-in');
+            document.querySelectorAll('[data-edit-drop-target]').forEach(a => a.removeAttribute('data-edit-drop-target'));
             if (hovered !== container) hovered.removeAttribute('data-edit-dragging-in');
             ghost = null; dragged = null;
             if (cancelled) { announce('Cancelled'); return; }
@@ -845,10 +858,14 @@
             else finishReorder(area);
         };
         const onUp = () => settle(false);
-        // Escape puts it back, the way every drag is expected to be escapable.
+        // Escape puts it back, the way every drag is expected to be escapable. A
+        // cancelled pointer (OS gesture, alert, pen out of range) also reverts —
+        // otherwise the item wedges position:fixed with drop targets still lit.
+        const onCancel = () => settle(true);
         const onKey = (ev) => { if (ev.key !== 'Escape') return; ev.preventDefault(); ev.stopPropagation(); settle(true); };
         document.addEventListener('pointermove', onMove);
         document.addEventListener('pointerup', onUp);
+        document.addEventListener('pointercancel', onCancel);
         document.addEventListener('keydown', onKey, true);
     }
     function reorderOver(container, x, y) {
@@ -910,7 +927,9 @@
             const lu = unitOf(el.style.left) || 'px', tu = unitOf(el.style.top) || 'px';
             const baseL = parseFloat(cs.left) || 0, baseT = parseFloat(cs.top) || 0, sx = e.clientX, sy = e.clientY;
             const ov = showOverlay();
-            const move = (ev) => { ev.preventDefault(); el.style.left = toUnit(baseL + (ev.clientX - sx), lu, el, parent, 'w') + lu; el.style.top = toUnit(baseT + (ev.clientY - sy), tu, el, parent, 'h') + tu; };
+            // Clamped to the containing block: a freeform card must not leave its canvas.
+            const maxL = () => Math.max(0, parent.clientWidth - el.offsetWidth), maxT = () => Math.max(0, parent.clientHeight - el.offsetHeight);
+            const move = (ev) => { ev.preventDefault(); el.style.left = toUnit(Math.min(maxL(), Math.max(0, baseL + (ev.clientX - sx))), lu, el, parent, 'w') + lu; el.style.top = toUnit(Math.min(maxT(), Math.max(0, baseT + (ev.clientY - sy))), tu, el, parent, 'h') + tu; };
             const up = () => { document.removeEventListener('pointermove', move); document.removeEventListener('pointerup', up); hideOverlay(ov); commitStyle(area, el); };
             document.addEventListener('pointermove', move); document.addEventListener('pointerup', up);
         });
@@ -921,8 +940,9 @@
             if (!el._moveTimer) el._preStyle = el.getAttribute('style') || '';   // baseline at start of a key burst
             const step = e.shiftKey ? 16 : 4, cs = getComputedStyle(el), parent = el.offsetParent || el.parentElement;
             const lu = unitOf(el.style.left) || 'px', tu = unitOf(el.style.top) || 'px';
-            if (d[0]) el.style.left = toUnit((parseFloat(cs.left) || 0) + d[0] * step, lu, el, parent, 'w') + lu;
-            if (d[1]) el.style.top = toUnit((parseFloat(cs.top) || 0) + d[1] * step, tu, el, parent, 'h') + tu;
+            const maxL = Math.max(0, parent.clientWidth - el.offsetWidth), maxT = Math.max(0, parent.clientHeight - el.offsetHeight);
+            if (d[0]) el.style.left = toUnit(Math.min(maxL, Math.max(0, (parseFloat(cs.left) || 0) + d[0] * step)), lu, el, parent, 'w') + lu;
+            if (d[1]) el.style.top = toUnit(Math.min(maxT, Math.max(0, (parseFloat(cs.top) || 0) + d[1] * step)), tu, el, parent, 'h') + tu;
             clearTimeout(el._moveTimer); el._moveTimer = setTimeout(() => { el._moveTimer = null; commitStyle(area, el); }, 350);
         });
     }
@@ -1042,6 +1062,7 @@
     // own caret placement; a second click still collapses to a caret for fine edits.
     function selectAllIn(el) {
         requestAnimationFrame(() => {
+            if (dragged || grabbed) return;              // reordering, not editing
             if (document.activeElement !== el) return;
             try { const r = document.createRange(); r.selectNodeContents(el); const s = window.getSelection(); s.removeAllRanges(); s.addRange(r); } catch { }
         });
@@ -1066,14 +1087,19 @@
     // STATIC: literal leaves only (skip bound nodes; those belong to data/component).
     function armText(area) {
         armRichText(area);
-        area.querySelectorAll('*').forEach(el => {
-            if (el.children.length || !el.textContent.trim() || el.closest('template') || el.hasAttribute('data-edit-handle')) return;
+        // A region whose root IS the text — <p x-edit.text="note">…</p> — has no
+        // descendant leaves; the area itself is the editable leaf.
+        const nodes = [...area.querySelectorAll('*')];
+        if (!realChildren(area).length) nodes.unshift(area);   // size handles are children too
+        nodes.forEach(el => {
+            if (realChildren(el).length || !el.textContent.trim() || el.closest('template') || el.hasAttribute('data-edit-handle')) return;
             if (el.closest('[data-text-edit]')) return;                 // the rich editor owns this subtree
             if (!capOf(el, 'text') || el.hasAttribute('x-text') || el.hasAttribute('x-html')) return;
             el.setAttribute('contenteditable', 'true');
             if (el._textBound) return; el._textBound = true;
-            el.addEventListener('focus', () => { el._preEdit = el.innerHTML.trim(); const d = el.closest('[draggable="true"]'); if (d) d.setAttribute('draggable', 'false'); selectAllIn(el); });
-            el.addEventListener('blur', () => { const d = el.closest('[data-edit-area] [draggable="false"]'); if (d) d.setAttribute('draggable', 'true'); commitStaticNode(regionOf(el) || area, el, 'text', el.innerHTML.trim()); });   // live region: the element may have moved since arming
+            el.addEventListener('focus', () => { el._preEdit = el.innerHTML.trim(); selectAllIn(el); });
+            el.addEventListener('keydown', (e) => { if (e.key === 'Escape') { e.preventDefault(); e.stopPropagation(); el.blur(); } });   // Escape finishes the edit, like the rich editor
+            el.addEventListener('blur', () => commitStaticNode(regionOf(el) || area, el, 'text', el.innerHTML.trim()));   // live region: the element may have moved since arming
         });
     }
 
@@ -1321,7 +1347,9 @@
             if (k) {
                 // Keep the tally in step so a new element never claims an ordinal
                 // an existing one already holds.
-                const [base, n] = k.split('#');
+                // The ordinal is the LAST #digits suffix — authored text may contain '#'.
+                const m = /^([\s\S]*)#(\d+)$/.exec(k);
+                const base = m ? m[1] : k, n = m ? m[2] : undefined;
                 seen[base] = Math.max(seen[base] || 0, n ? +n : 1);
             } else {
                 const base = el.tagName + ':' + (el.textContent || '').replace(/\s+/g, ' ').trim().slice(0, 24);
@@ -1332,6 +1360,7 @@
             el.setAttribute('data-edit-path', pathOf(el, area));   // still what the source writer navigates by
             if (!(k in area._baseClass)) area._baseClass[k] = el.getAttribute('class') || '';
             if (!(k in area._baseStyle)) area._baseStyle[k] = el.getAttribute('style') || '';
+            if (!(k in area._baseText) && !el.children.length) area._baseText[k] = el.innerHTML.trim();
         };
         markEl(area);
         // Stop at a rich editor: its internals are its own, and marking them would
@@ -1360,6 +1389,15 @@
         [area, ...area.querySelectorAll('[data-edit-area]')].forEach(c => { if (capOf(c, 'sort') && !locked(c)) makeSortable(c); });
         [area, ...area.querySelectorAll('[data-edit-area]')].forEach(c => { if (ownsCap(c, 'size')) armSize(c); });
         if (kind === 'component') armComponent(area); else armText(area);
+        if (!area._dndBound) {
+            area._dndBound = true;
+            // Native HTML5 drag (a text selection, an image, a link) must never
+            // start inside a region: it drops SELECTED TEXT into neighbouring
+            // editable leaves, silently merging elements. All region dragging is
+            // pointer-based.
+            area.addEventListener('dragstart', (e) => { if (isActive(area)) e.preventDefault(); });
+            area.addEventListener('drop', (e) => { if (isActive(area)) e.preventDefault(); });   // nothing drops INTO a region either (an OS image drop would merge into a leaf)
+        }
         if (!area._ctxBound) {
             area._ctxBound = true;
             // One binding for the whole area: report the block, and fall back to the

package/lib/manifest.integrity.json

@@ -1,6 +1,6 @@
 {
   "manifest.appwrite.auth.js": "sha384-X30RFvbwT9qEIaMsMUumnW54ZzcnY5aY9QQeXPG8/0sI6VAbAw3+FZ6iuZb6b4cu",
-  "manifest.appwrite.data.js": "sha384-Jkz5STB1ohrl5QaEQwCd2YMK6O4pP9byt+0WjJEHTKGKBZhm3HhKTFLh41TeGrtP",
+  "manifest.appwrite.data.js": "sha384-dSnLE73aoJkrLXQ3EYSNgmMLJ8WZn6dGcZOKx6bY007Qnl/vY2JK75q/leiZXe7s",
   "manifest.appwrite.presences.js": "sha384-JyVDWFT69b7Svq8J8p9tNWe2v9PZNQBY5UyhtOl1vnuHFAX0CRQ3MA9SiKq5wzNh",
   "manifest.bindings.js": "sha384-lPtMf8Ykaic9gNVZKq8Scia1881ZeMAyxer3WCIkUNwwrgzGBWto1OXADUwjvORF",
   "manifest.charts.js": "sha384-gEAv/98+29RbhvNkiNWTNyBPbLTFr2Ld15wLu29FLCL57j1cwGChRrL9Pfk7dBtT",
@@ -11,12 +11,12 @@
   "manifest.combobox.js": "sha384-MILTkrgsTzsYUjGo4ZuADqV85Xs4GmfB4xexfe9vbJMIoQTZ42W4zs+DTaVSPEsx",
   "manifest.components.js": "sha384-4bc3HgPvF9DHMiOG08w+nWXI7Hho01RuAPAUL9xyLxOiS2igeZpulCVcvr5aT9v6",
   "manifest.computed.js": "sha384-GYML/e81gQfN+iDbqhPUgny8bINCyL+SrbTofoGk4hlCnLLjv51mCv42JMqq+ku5",
-  "manifest.data.js": "sha384-k0e3ledccuEmpafn1D3VhSRjUi4LMru+0n434LfInWUxthmbUFTgeGBwJgCxE1fs",
+  "manifest.data.js": "sha384-ixpU7pvJhlPBvT7in0HonHQLdNOabbpqik6IVsMNNzAY3UhCVAf8BRno2niTkZK1",
   "manifest.datepicker.js": "sha384-XnbeURni2X91ozVzatQcSjYYIS4MoW12dBRJnYAGBr0nCQ624heH5s+xtQSpLZX6",
   "manifest.defer.js": "sha384-WcCf8YQ1bKIXCLSZ24a0bJwepbYntYc8TzQM50hklo5VMIH8AtzDnwl6WU4prRv1",
   "manifest.device.js": "sha384-g+txmrEszYtuOvRelTp/c1wSNR2AtllVI9rx5NPPD7DzhVUnMNughonZykv2xlBW",
   "manifest.dropdowns.js": "sha384-0ilj9AvRph0LacIBJSqwpu1fvPRn5gcWbhIG1SOpaoM/Q8idMbKBLupwM+5O0UaX",
-  "manifest.edit.js": "sha384-vlFa+vfuiz5ff/md0JDQ16NuAq6ekggHgxbO+QG2ugMAvwTH055Z20mwuIr9BtNR",
+  "manifest.edit.js": "sha384-63ym+1EWz+JKvwwH3v2XlR4q5alha/ShMiIJsbDbDS7eVymu5zgghsh8JRVeax+V",
   "manifest.export.js": "sha384-Rx6XvqBZc4apzP/FwcDr6yIln4/zNa08Q4ZqBZcEqUz1aNZQfl4h0+Ae7mqCQyuG",
   "manifest.icons.js": "sha384-kKOINpX70YzNO3FvkV6umrmO3f0KIu0DNbwB+ej55a7y/lhU7v/myQtXL0bwCTbt",
   "manifest.localization.js": "sha384-EImsIw8Z3l13V5eH9ZJF/yfsOfIvR1oPRNSArANkPji7V8O3IRf6zMwsNiAGj3Hk",
@@ -28,10 +28,10 @@
   "manifest.slides.js": "sha384-3uRTkyK9XPLmnxI2+igZlpi4EyPlU/7IHj5j3BZJJ2KN455vXyk99fiXV3feO/XY",
   "manifest.status.js": "sha384-MBO345ab7H6Uq1X2dZLt4Ge1Gcra+Z2qYApvlAeIV8CJhDDJrz2FPXpp+Kcp8zcM",
   "manifest.svg.js": "sha384-qr/8H9+2cIhSXNbRWRtIdrDlTOxKlNJqwEefHvCYoiBNW/kKhPTFa109Orv/EBnb",
-  "manifest.sw.js": "sha384-ImJzl1bWd3CdD0Z9L9+6wlU0WevaZnYJ7florX4kagSvDkfWs4LmjvOB/YkbRcI3",
+  "manifest.sw.js": "sha384-P5M9kT06bquAyIK8aLQK6ujNn5rnaJ2Lw8f/ZsDx1yLVPWYeIOwa6Y06eEWmc5ry",
   "manifest.tabs.js": "sha384-OIIcyaQnGS0eNYk4zgAFEDboNYect7THvUd9D0V6nqCeDOxQcoiqLrBEmmWVTTet",
   "manifest.tailwind.js": "sha384-r/Jvqb+Piz21jUts10BbVAJoKkShOdJRVFpywyi4HPIi/OfOJq5CtPyWAPbdkMgt",
-  "manifest.text.edit.js": "sha384-qsph2bNsRnH8ucy9qmaNs9MsWbA6yMm21zgfNIxcC3eLG+PIJfhSfLygfzuDJ0IF",
+  "manifest.text.edit.js": "sha384-RzOvLQE8GbmI6gntAwiotDewYT/08OHcd7sJ5hLon8e8u1Xbq1D7VfEGuaRVd2CE",
   "manifest.toasts.js": "sha384-/OV32LLMJl0Iw8NoNQJ+5lgntLxjIJq/YNj5JAKS/+nUhVx4MMB9h1FOqP7zuj2M",
   "manifest.tooltips.js": "sha384-uXVVQADl6pY2Pj9i/UaSclZN7dzbKhLkmevv7Ad0+wXR8LgqodALNFrc5jZJjlwm",
   "manifest.url.parameters.js": "sha384-J2aSVBOPsoqsbafHndrWLHEDpKb4AKJAoQnVmKA4gZh5P/8HHjFWHO/lkusmG84l",