@jackuait/blok 0.10.8 → 0.10.9

package/src/components/modules/paste/handlers/base.ts

@@ -124,28 +124,56 @@ export abstract class BasePasteHandler implements PasteHandler {
         : (currentBlock?.parentId ?? null);
       const insertedByIndex: Array<Awaited<ReturnType<BlokModules['BlockManager']['paste']>>> = [];
 
-      for (const [index, pasteData] of data.entries()) {
-        /**
-         * Force each pasted block into its own Yjs undo entry so that
-         * Ctrl+Z removes them one at a time.
-         *
-         * paste() wraps insert() in withAtomicOperation() which suppresses
-         * the normal stopCapturing() from currentBlockIndexValue changes.
-         * Without this, consecutive addBlock() calls within the 500ms
-         * captureTimeout get merged into a single undo entry.
-         */
-        this.Blok.YjsManager.stopCapturing();
-        const shouldReplace = index === 0 && canReplaceCurrentBlock && BlockManager.currentBlock?.isEmpty === true;
-        const block = shouldReplace
-          ? await BlockManager.paste(pasteData.tool, pasteData.event, true)
-          : await BlockManager.paste(pasteData.tool, pasteData.event);
-
-        Caret.setToBlock(block, Caret.positions.END);
-        insertedByIndex.push(block);
-
-        this.applyPastedBlockParent(block, pasteData, insertedByIndex, BlockManager, contextParentId);
+      /**
+       * Group every pasted block's Yjs write into a single undo entry so
+       * that one Cmd+Z removes the whole paste. transactForTool sets
+       * operations.suppressStopCapturing = true before invoking the fn and
+       * restores it in a trailing microtask, which keeps the synchronous
+       * prefix of BlockManager.paste (where the currentBlockIndex setter
+       * would otherwise fire stopCapturing) inside the group.
+       *
+       * The fn is synchronous — transactForTool does not await — so the
+       * async work is kicked off inside the fn and its promise is awaited
+       * below. Between iterations we re-suppress directly on operations to
+       * keep the entire loop body inside the same undo group even after
+       * the initial close-boundary microtask has fired.
+       */
+      const operationsBridge = (BlockManager as unknown as { operations?: { suppressStopCapturing: boolean } }).operations;
+      const pasteChainRef: { current: Promise<void> } = { current: Promise.resolve() };
+
+      const runPasteLoop = (): void => {
+        pasteChainRef.current = (async (): Promise<void> => {
+          for (const [index, pasteData] of data.entries()) {
+            // Re-assert suppression on every iteration — transactForTool's
+            // close-boundary microtask may have flipped suppressStopCapturing
+            // back to false before the next paste() runs its sync prefix.
+            if (operationsBridge !== undefined) {
+              operationsBridge.suppressStopCapturing = true;
+            }
+
+            const shouldReplace = index === 0 && canReplaceCurrentBlock && BlockManager.currentBlock?.isEmpty === true;
+            const block = shouldReplace
+              ? await BlockManager.paste(pasteData.tool, pasteData.event, true)
+              : await BlockManager.paste(pasteData.tool, pasteData.event);
+
+            Caret.setToBlock(block, Caret.positions.END);
+            insertedByIndex.push(block);
+
+            this.applyPastedBlockParent(block, pasteData, insertedByIndex, BlockManager, contextParentId);
+          }
+        })();
+      };
+
+      // Older test mocks may not expose transactForTool; fall through
+      // gracefully in that case so unrelated suites keep working.
+      if (typeof BlockManager.transactForTool === 'function') {
+        BlockManager.transactForTool(runPasteLoop);
+      } else {
+        runPasteLoop();
       }
 
+      await pasteChainRef.current;
+
       BlockManager.currentBlock && Caret.setToBlock(BlockManager.currentBlock, Caret.positions.END);
 
       return;

package/src/components/modules/paste/handlers/blok-data-handler.ts

@@ -165,6 +165,28 @@ export class BlokDataHandler extends BasePasteHandler implements PasteHandler {
       Boolean(BlockManager.currentBlock?.tool.isDefault) &&
       Boolean(BlockManager.currentBlock?.isEmpty);
 
+    /**
+     * Capture the container membership of the current block BEFORE any
+     * inserts so pasted "root" blocks inherit it. Without this, pasting
+     * into a child of a callout / toggle / table cell would drop the
+     * parent link on the first pasted block and the Saver's
+     * derive-from-live-parentId fallback would emit it as a root sibling
+     * of the container — the "callout paste ejection" regression family.
+     *
+     * Mirrors the `contextParentId` logic in `BasePasteHandler.insertPasteData`
+     * for multi-item HTML/plain paste. `canReplaceCurrentBlock` is
+     * explicitly gated off inside table cells by paste/index.ts, so this
+     * capture is the only place where a table-cell paste picks up its
+     * parent id.
+     */
+    const currentBlock = BlockManager.currentBlock;
+    const childContainer = currentBlock?.holder?.querySelector('[data-blok-toggle-children]') ?? null;
+    const isInContainerTitle = childContainer !== null &&
+      !childContainer.contains(currentBlock?.currentInput ?? null);
+    const contextParentId = isInContainerTitle
+      ? (currentBlock?.id ?? null)
+      : (currentBlock?.parentId ?? null);
+
     // Set of old IDs present in this paste, used to identify parent-child pairs.
     const pastedOldIds = new Set(blocks.map(b => b.id));
 
@@ -193,59 +215,85 @@ export class BlokDataHandler extends BasePasteHandler implements PasteHandler {
      */
     const oldIdToEntry = new Map<string, { newBlock: Block; original: BlokClipboardBlock }>();
 
-    // Pass 1: insert children first so they exist with new IDs before the parent.
-    children.forEach(({ sanitized, original }) => {
-      const block = BlockManager.insert({ tool: sanitized.tool, data: sanitized.data });
-
-      oldIdToEntry.set(original.id, { newBlock: block, original });
-      Caret.setToBlock(block, Caret.positions.END);
-    });
-
-    // Build old→new string map for remapping ID references inside parent data.
-    const oldIdToNewId = new Map<string, string>();
-
-    for (const [oldId, { newBlock }] of oldIdToEntry) {
-      oldIdToNewId.set(oldId, newBlock.id);
-    }
-
-    // Pass 2: insert root blocks with child IDs remapped in their data.
-    // Skip replace when children were pre-inserted to avoid replacing a
-    // just-inserted child paragraph rather than the original empty block.
-    roots.forEach(({ sanitized, original }, idx) => {
-      const remappedData = oldIdToNewId.size > 0
-        ? remapIds(sanitized.data, oldIdToNewId) as typeof sanitized.data
-        : sanitized.data;
-
-      const block = BlockManager.insert({
-        tool: sanitized.tool,
-        data: remappedData,
-        replace: idx === 0 && shouldReplaceFirst && children.length === 0,
+    // Group every insert + setBlockParent call into a single Yjs undo entry
+    // so that one Cmd+Z removes the whole pasted set. Without this wrapper
+    // each BlockManager.insert and setBlockParent lands on its own undo
+    // stack item, and the user has to press undo N times to clear a paste.
+    const runInsertPasses = (): void => {
+      // Pass 1: insert children first so they exist with new IDs before the parent.
+      children.forEach(({ sanitized, original }) => {
+        const block = BlockManager.insert({ tool: sanitized.tool, data: sanitized.data });
+
+        oldIdToEntry.set(original.id, { newBlock: block, original });
+        Caret.setToBlock(block, Caret.positions.END);
       });
 
-      oldIdToEntry.set(original.id, { newBlock: block, original });
-      Caret.setToBlock(block, Caret.positions.END);
-    });
+      // Build old→new string map for remapping ID references inside parent data.
+      const oldIdToNewId = new Map<string, string>();
 
-    /**
-     * Restore parent-child hierarchy using the old-to-new ID mapping.
-     * Only restores relationships where both parent and child are in the pasted set.
-     */
-    for (const [, { newBlock, original }] of oldIdToEntry) {
-      if (original.parentId === undefined || original.parentId === null) {
-        continue;
+      for (const [oldId, { newBlock }] of oldIdToEntry) {
+        oldIdToNewId.set(oldId, newBlock.id);
       }
 
-      const parentEntry = oldIdToEntry.get(original.parentId);
+      // Pass 2: insert root blocks with child IDs remapped in their data.
+      // Skip replace when children were pre-inserted to avoid replacing a
+      // just-inserted child paragraph rather than the original empty block.
+      roots.forEach(({ sanitized, original }, idx) => {
+        const remappedData = oldIdToNewId.size > 0
+          ? remapIds(sanitized.data, oldIdToNewId) as typeof sanitized.data
+          : sanitized.data;
+
+        const block = BlockManager.insert({
+          tool: sanitized.tool,
+          data: remappedData,
+          replace: idx === 0 && shouldReplaceFirst && children.length === 0,
+        });
+
+        /**
+         * Wire the root block into the surrounding container membership.
+         * Only applies when the clipboard payload itself did not declare
+         * a parentId for this block (explicit clipboard hierarchy wins,
+         * since it is restored by the pass below).
+         */
+        if (contextParentId !== null && (original.parentId === undefined || original.parentId === null)) {
+          BlockManager.setBlockParent(block, contextParentId);
+        }
+
+        oldIdToEntry.set(original.id, { newBlock: block, original });
+        Caret.setToBlock(block, Caret.positions.END);
+      });
 
-      if (parentEntry === undefined) {
-        continue;
+      /**
+       * Restore parent-child hierarchy using the old-to-new ID mapping.
+       * Only restores relationships where both parent and child are in the pasted set.
+       */
+      for (const [, { newBlock, original }] of oldIdToEntry) {
+        if (original.parentId === undefined || original.parentId === null) {
+          continue;
+        }
+
+        const parentEntry = oldIdToEntry.get(original.parentId);
+
+        if (parentEntry === undefined) {
+          continue;
+        }
+
+        // Route through the canonical reparent API — it handles old-parent
+        // splice, new-parent push, DOM reparent into the container's children
+        // wrapper, collapsed-hidden state sync, and the Yjs parentId +
+        // contentIds companion writes. Direct parentId/contentIds mutations
+        // bypass every one of those and reintroduce the callout paste
+        // ejection bug family.
+        BlockManager.setBlockParent(newBlock, parentEntry.newBlock.id);
       }
+    };
 
-      newBlock.parentId = parentEntry.newBlock.id;
-
-      if (!parentEntry.newBlock.contentIds.includes(newBlock.id)) {
-        parentEntry.newBlock.contentIds = [...parentEntry.newBlock.contentIds, newBlock.id];
-      }
+    // Older test mocks may not expose transactForTool; fall through
+    // gracefully in that case so unrelated suites keep working.
+    if (typeof BlockManager.transactForTool === 'function') {
+      BlockManager.transactForTool(runInsertPasses);
+    } else {
+      runInsertPasses();
     }
   }
 }

package/src/components/modules/paste/index.ts

@@ -297,6 +297,26 @@ export class Paste extends Module {
       return;
     }
 
+    /**
+     * Layer 20: paste-during-drag bail (regression: wrong-block-dropped family).
+     *
+     * DragController captures live Block references when the drag starts and
+     * commits them in `handleDrop` on mouseup. A paste firing mid-drag would
+     * call `BlockManager.paste` / `insert` / `convertToTool`, any of which
+     * reshuffles the flat blocks array under DragController's feet — the
+     * resulting indices are stale and a later move() silently drops an
+     * unrelated block. Mirrors the Cmd+Z-during-drag guard in
+     * uiControllers/controllers/keyboard.ts handleZ.
+     *
+     * Swallow the paste so the drag completes cleanly; the user can paste
+     * after releasing the mouse.
+     */
+    if (this.Blok.DragManager?.isDragging) {
+      event.preventDefault();
+
+      return;
+    }
+
     const { BlockManager, Toolbar } = this.Blok;
 
     const currentBlock = BlockManager.setCurrentBlockByChildNode(event.target as HTMLElement);

package/src/components/modules/saver.ts

@@ -11,6 +11,7 @@ import { Module } from '../__module';
 import type { Block } from '../block';
 import { getBlokVersion, isEmpty, isObject, log, logLabeled } from '../utils';
 import { collapseToLegacy, shouldCollapseToLegacy } from '../utils/data-model-transform';
+import { validateHierarchy } from '../utils/hierarchy-invariant';
 import { sanitizeBlocks } from '../utils/sanitizer';
 import { normalizeInlineImages } from './normalizeInlineImages';
 
@@ -112,8 +113,54 @@ export class Saver extends Module {
       };
     }
 
+    /**
+     * Dangling parentId repair pass (belt-and-braces).
+     *
+     * Before deriving content[] or running hierarchy validation, walk every
+     * block and, if a block's parentId points at an id that does NOT exist in
+     * the live blocks array, clear it in-memory. This promotes the orphan to
+     * root-level — strictly better than emitting a dangling `parent` reference
+     * downstream, which produces corrupted JSON for users. This is the final
+     * exit ramp for the "container paste ejection" bug family: even if a
+     * mutation path somewhere else regresses, the saver is physically incapable
+     * of shipping output with a parent pointing to a non-existent block.
+     */
+    const blockIds = new Set(blocks.map(b => b.id));
+
+    for (const block of blocks) {
+      if (block.parentId !== null && !blockIds.has(block.parentId)) {
+        logLabeled(`Saver: cleared dangling parentId ${block.parentId} on block ${block.id}`, 'warn');
+        block.parentId = null;
+      }
+    }
+
+    /**
+     * Derive each parent's content[] from the live blocks array.
+     *
+     * `block.contentIds` is a mutable array kept in sync by hierarchy.setBlockParent,
+     * but it can drift out of sync with `block.parentId` — e.g. when hierarchical data
+     * is loaded with `parent` fields on children but no `content` on the parent,
+     * insertMany does not reconcile the two. Downstream consumers
+     * (notably collapseToLegacy's processRootCalloutItem) read `content[]` as the
+     * source of truth for nesting, and any child missing from that array gets ejected
+     * from its parent. Deriving content[] at save time from `parentId` makes the
+     * invariant `child.parentId ⇒ parent.content.includes(child)` always hold.
+     */
+    const childrenByParent = new Map<string, string[]>();
+    for (const block of blocks) {
+      if (block.parentId === null) {
+        continue;
+      }
+      const siblings = childrenByParent.get(block.parentId);
+      if (siblings === undefined) {
+        childrenByParent.set(block.parentId, [block.id]);
+      } else {
+        siblings.push(block.id);
+      }
+    }
+
     const chainData: Array<Promise<SaverValidatedData>> = blocks.map((block: Block) => {
-      return this.getSavedData(block);
+      return this.getSavedData(block, childrenByParent.get(block.id) ?? []);
     });
 
     this.lastSaveError = undefined;
@@ -147,10 +194,11 @@ export class Saver extends Module {
 
   /**
    * Saves and validates
-   * @param {Block} block - Blok's Tool
-   * @returns {ValidatedData} - Tool's validated data
+   * @param block - block to save
+   * @param derivedContentIds - content ids computed from live children's parentId
+   *        (source of truth, see doSave for rationale)
    */
-  private async getSavedData(block: Block): Promise<SaverValidatedData> {
+  private async getSavedData(block: Block, derivedContentIds: string[]): Promise<SaverValidatedData> {
     const blockData = await block.save();
     const toolName = block.name;
     const normalizedData = blockData?.data !== undefined
@@ -170,7 +218,7 @@ export class Saver extends Module {
       ...normalizedData,
       isValid,
       parentId: block.parentId,
-      contentIds: block.contentIds,
+      contentIds: derivedContentIds,
       lastEditedAt: block.lastEditedAt,
       lastEditedBy: block.lastEditedBy,
     };
@@ -249,6 +297,28 @@ export class Saver extends Module {
       ? collapseToLegacy(extractedBlocks)
       : extractedBlocks;
 
+    // Defense-in-depth: assert the parent/content invariant on the final output
+    // in test/dev builds. Any drift here means a mutation path elsewhere is
+    // leaking inconsistent state through every reconciliation layer — that is
+    // the exact failure mode behind the callout paste ejection bug family.
+    // Throwing in test flushes the regression out of any future refactor; in
+    // production we only log, so an edge-case drift never breaks user saves.
+    const violations = validateHierarchy(finalBlocks);
+
+    if (violations.length > 0) {
+      const summary = violations.map(v => v.message).join('; ');
+      const message = `Saver produced output with hierarchy drift: ${summary}`;
+      const nodeEnv = typeof process !== 'undefined' ? process.env?.NODE_ENV : undefined;
+
+      // Throw in test AND development so manual dev-time testing (yarn serve)
+      // flushes drift out immediately. Only production silently logs so an
+      // edge-case drift never breaks end-user saves.
+      if (nodeEnv === 'test' || nodeEnv === 'development') {
+        throw new Error(message);
+      }
+      logLabeled(message, 'error');
+    }
+
     return {
       time: +new Date(),
       blocks: finalBlocks,

package/src/components/modules/toolbar/index.ts

@@ -441,20 +441,24 @@ export class Toolbar extends Module<ToolbarNodes> {
 
     /**
      * Adjust toolbar button visibility based on context:
-     * - Table cell focus: settings toggler hidden (drag/settings don't apply to cells)
      * - Callout first child: both plus button and settings toggler hidden
      *   to prevent overlap with the callout's emoji icon
+     *
+     * The callout block itself still shows BOTH buttons — the actions container
+     * sits outside the block (positioned via right:100% on the left gutter) and
+     * does not overlap the emoji which is inside the block at pl-8.
+     *
+     * Note: when the toolbar resolves to a parent table block from a focused
+     * cell, the settings toggler must STAY visible — it is wired via
+     * setupDraggable() to drag the parent table, so hiding it would leave the
+     * whole table undraggable while the user edits cell text.
      */
-    const focusIsInsideCell = this.isFocusInsideTableCell();
     const isCalloutFirstChild = this.isFirstChildOfCallout(targetBlock);
-    const isCalloutBlock = targetBlock.name === 'callout';
 
-    // Hide plus button for callout blocks and their first children to avoid
-    // overlap with the callout emoji icon in the left padding area.
-    plusButton.style.display = (isCalloutFirstChild || isCalloutBlock) ? 'none' : '';
+    plusButton.style.display = isCalloutFirstChild ? 'none' : '';
 
     if (settingsToggler) {
-      settingsToggler.style.display = (focusIsInsideCell || isCalloutFirstChild) ? 'none' : '';
+      settingsToggler.style.display = isCalloutFirstChild ? 'none' : '';
     }
 
     /**
@@ -466,7 +470,8 @@ export class Toolbar extends Module<ToolbarNodes> {
      * Skip when the target is the callout itself or its first child — their toolbar
      * buttons render outside the callout's visual background area.
      */
-    const calloutBg = isCalloutFirstChild || targetBlock.name === 'callout'
+    const isCalloutBlock = targetBlock.name === 'callout';
+    const calloutBg = isCalloutFirstChild || isCalloutBlock
       ? null
       : this.getCalloutBackgroundColor(targetBlock);
 
@@ -875,70 +880,48 @@ export class Toolbar extends Module<ToolbarNodes> {
     return parent;
   }
 
-  private isFocusInsideTableCell(): boolean {
-    const active = document.activeElement;
-
-    if (!active) {
-      return false;
-    }
-
-    return active.closest('[data-blok-table-cell-blocks]') !== null;
-  }
-
   /**
-   * Updates toolbar button visibility based on whether a table cell has focus.
-   * The plus button always stays visible; the settings toggler is hidden when
-   * focus is inside a cell and restored when focus moves to a regular block.
+   * Updates toolbar button visibility based on the current hovered block.
+   * Called from the focusin listener so callout first-child state is
+   * refreshed immediately when focus moves, without waiting for the next
+   * hover/moveAndOpen cycle.
    *
-   * Called from the focusin listener so button state is updated immediately
-   * on click, without waiting for the next hover/moveAndOpen cycle.
+   * INVARIANT: the ONLY reason this method may hide the settings toggler
+   * (drag handle) is `isCalloutFirstChild` — a structural property of the
+   * block, NOT where `document.activeElement` currently is. Hiding the drag
+   * handle based on focus position inside nested content (table cells,
+   * code editors, database titles, etc.) will break dragging of the
+   * containing block while the user edits its content. Do NOT add focus-
+   * based or DOM-attribute-based hide branches here. See the arch guard
+   * test in test/unit/components/modules/toolbar/index.test.ts.
    */
-  private updateToolbarButtonsForTableCellFocus(): void {
+  private updateToolbarButtonsForCalloutFirstChild(): void {
     const { plusButton, settingsToggler } = this.nodes;
 
     if (!plusButton) {
       return;
     }
 
-    const focusIsInsideCell = this.isFocusInsideTableCell();
     const isCalloutFirstChild = this.hoveredBlock !== null && this.isFirstChildOfCallout(this.hoveredBlock);
-    const isCalloutBlock = this.hoveredBlock?.name === 'callout';
 
-    plusButton.style.display = (isCalloutFirstChild || isCalloutBlock) ? 'none' : '';
+    plusButton.style.display = isCalloutFirstChild ? 'none' : '';
 
     if (settingsToggler) {
-      settingsToggler.style.display = (focusIsInsideCell || isCalloutFirstChild) ? 'none' : '';
+      settingsToggler.style.display = isCalloutFirstChild ? 'none' : '';
     }
   }
 
   /**
-   * Re-enables pointer-events on the settings toggler (and callout drag zone) after
-   * the actions container has been set to pointer-events: none for left-edge blocks.
+   * Re-enables pointer-events on the settings toggler after the actions
+   * container has been set to pointer-events: none for left-edge blocks.
    *
-   * For callout blocks: also wires the dedicated drag zone as the drag handle and
-   * re-enables the settings toggler so the settings menu remains accessible.
-   * The emoji button (at x=32px) no longer overlaps the actions zone (x=[0,29px])
-   * because the callout uses pl-8 (32px) left padding.
-   *
-   * For all other left-edge blocks (toggle, header with arrow): simply re-enables the
-   * settings toggler so it continues to function as the drag handle.
+   * Left-edge blocks (callout, toggle, header-with-arrow) disable
+   * pointer-events on the actions container so clicks pass through to the
+   * block's own left-edge interactive element (emoji / toggle arrow). The
+   * settings toggler must remain clickable on top so it can still function
+   * as the drag handle and open the block tunes menu.
    */
-  private restoreSettingsTogglerForLeftEdgeBlock(targetBlock: Block): void {
-    if (targetBlock.name === 'callout') {
-      if (this.nodes.settingsToggler) {
-        this.nodes.settingsToggler.style.pointerEvents = 'auto';
-      }
-
-      const calloutDragZone = targetBlock.holder.querySelector<HTMLElement>('[data-callout-drag-zone]');
-
-      if (calloutDragZone) {
-        calloutDragZone.style.pointerEvents = 'auto';
-        targetBlock.setupDraggable(calloutDragZone, this.Blok.DragManager);
-      }
-
-      return;
-    }
-
+  private restoreSettingsTogglerForLeftEdgeBlock(_targetBlock: Block): void {
     if (this.nodes.settingsToggler) {
       this.nodes.settingsToggler.style.pointerEvents = 'auto';
     }
@@ -1264,15 +1247,13 @@ export class Toolbar extends Module<ToolbarNodes> {
     }
 
     /**
-     * Listen for focus changes inside the editor.
-     * When the user clicks/tabs into a table cell, hide the plus button and
-     * settings toggler. When focus moves to a regular block, restore them.
-     *
-     * This runs on every focusin event (not throttled) to ensure buttons
-     * update immediately on click — no 300ms delay.
+     * Listen for focus changes inside the editor so callout first-child
+     * button state refreshes immediately on click/tab — no 300ms delay.
+     * Drag handle visibility must NOT depend on focus position inside
+     * nested content (see updateToolbarButtonsForCalloutFirstChild doc).
      */
     this.readOnlyMutableListeners.on(this.Blok.UI.nodes.wrapper, 'focusin', () => {
-      this.updateToolbarButtonsForTableCellFocus();
+      this.updateToolbarButtonsForCalloutFirstChild();
     });
 
     /**

package/src/components/modules/uiControllers/controllers/keyboard.ts

@@ -492,6 +492,26 @@ export class KeyboardController extends Controller {
       return;
     }
 
+    /**
+     * Layer 18: block undo/redo while a drag is in progress.
+     *
+     * Regression: "wrong block dropped" family. `moveUndoStack` entries capture
+     * `fromIndex`/`toIndex` at record time. Replaying them synchronously while
+     * DragController still holds a live source/target reference mutates the
+     * flat blocks array under the drag's feet — subsequent `handleDrop` then
+     * operates on stale indices and silently drops an unrelated block.
+     *
+     * The Escape handler already guards on `DragManager.isDragging` (see
+     * handleEscape above). Mirror that here: swallow the keystroke so the
+     * drag completes cleanly, then the user can undo.
+     */
+    if (this.Blok.DragManager.isDragging) {
+      event.preventDefault();
+      event.stopPropagation();
+
+      return;
+    }
+
     // Prevent double-firing within 50ms
     const now = Date.now();