@domternal/vanilla 0.15.0 → 1.0.0

package/README.md

@@ -4,9 +4,10 @@
 [![MIT License](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/domternal/domternal/blob/main/LICENSE)
 
 Framework-free DOM components for the [Domternal](https://domternal.dev) editor.
-Each component is a class you instantiate against a host element:
-`DomternalEditor`, `DomternalToolbar`, `DomternalBubbleMenu`, `DomternalFloatingMenu`,
-`DomternalEmojiPicker`, and `DomternalNotionColorPicker`. Every class extends
+Most are classes you instantiate against a host element: `DomternalEditor`,
+`DomternalToolbar`, `DomternalBubbleMenu`, `DomternalFloatingMenu`, and
+`DomternalEmojiPicker`. `DomternalNotionColorPicker` is the exception: it takes only an
+options object and resolves its own `.dm-editor` host from the editor. Every class extends
 `EventTarget`, exposes plain getters and mutator methods, dispatches `CustomEvent`s for state
 changes, and tears down with an idempotent `destroy()`. Use it in Astro, Svelte, Solid,
 Lit, Web Components, or plain HTML - anywhere without a framework runtime.
@@ -21,8 +22,8 @@ Lit, Web Components, or plain HTML - anywhere without a framework runtime.
 pnpm add @domternal/core @domternal/theme @domternal/vanilla
 ```
 
-`@domternal/core` is a peer dependency. `@domternal/theme` supplies the editor styles
-(import it once in your app).
+`@domternal/core` (>=1.0.0) is a peer dependency. `@domternal/theme` supplies the editor
+styles (import it once in your app).
 
 ## Usage
 
@@ -70,6 +71,24 @@ The matching mount points:
 > SSR. Module-scope imports stay SSR-safe, so gate instantiation behind a client-side
 > entry point (e.g. an Astro `<script>` block or `client:only`).
 
+## Options
+
+`DomternalEditorOptions`, the second constructor argument:
+
+| Option | Type | Default | Description |
+|---|---|---|---|
+| `extensions` | `AnyExtension[]` | `[]` | Extensions merged on top of `DEFAULT_EXTENSIONS`. |
+| `history` | `boolean` | `true` | Whether the built-in History extension is loaded. Turn it off when an extension brings its own undo. |
+| `content` | `Content` | `''` | Initial content, HTML string or JSON. |
+| `editable` | `boolean` | `true` | Whether the editor is editable. |
+| `preset` | `'classic' \| 'notion'` | `'classic'` | `'notion'` paints `dm-notion-mode` on the `.dm-editor` host and switches preset-aware extensions to their Notion behavior. Create-time only. |
+| `autofocus` | `FocusPosition` | `false` | Where to place the caret on mount. |
+| `outputFormat` | `'html' \| 'json'` | `'html'` | Format hint for host frameworks comparing controlled content. Does not change editor behavior. |
+
+`onCreate`, `onUpdate`, `onSelectionChange`, `onFocus`, `onBlur`, and `onDestroy` callbacks are
+accepted alongside them, and the same moments are dispatched on the instance as `create`,
+`update`, `selectionchange`, `focus`, `blur`, and `destroy` `CustomEvent`s.
+
 ## Exports
 
 - `DomternalEditor` / `DomternalEditorOptions` - wraps core's `Editor`, plus

package/dist/index.d.ts

@@ -1,4 +1,5 @@
-import { PluginKey, IconSet, Editor, AnyExtension, Content, EditorPreset, FocusPosition, JSONContent, ToolbarController, ToolbarLayoutEntry, ToolbarButton, ToolbarDropdown, BubbleMenuOptions, FloatingMenuController, FloatingMenuOptions, FloatingMenuItemsOverride, FloatingMenuKeymap } from '@domternal/core';
+import { PluginKey, IconSet, AnyExtension, Editor, Content, EditorPreset, FocusPosition, JSONContent, ToolbarController, ToolbarLayoutEntry, ToolbarButton, ToolbarDropdown, BubbleMenuOptions, BubbleContexts, FloatingMenuController, FloatingMenuOptions, FloatingMenuItemsOverride, FloatingMenuKeymap } from '@domternal/core';
+export { BubbleMenuItem, BubbleMenuSeparator, BubbleItemMaps as ItemMaps, ResolvedPosShape, SelectionShape, buildBubbleItemMaps as buildItemMaps, detectBubbleContext as detectContext, filterBubbleItemsBySchema as filterBySchema, getBubbleFormatItems as getFormatItems, isInsideTableCell, resolveBubbleNames as resolveNames } from '@domternal/core';
 
 /**
  * SSR-safe environment check.
@@ -440,85 +441,6 @@ declare function getComputedStyleAtCursor(editor: Editor, prop: string): string
  */
 declare function getInlineStyleAtCursor(editor: Editor, prop: string): string | null;
 
-interface ResolvedPosShape {
-    parent: {
-        type: {
-            name: string;
-            spec: {
-                marks?: string;
-            };
-        };
-    };
-    depth: number;
-    node: (depth: number) => {
-        type: {
-            name: string;
-        };
-    };
-}
-interface SelectionShape {
-    empty: boolean;
-    $from: ResolvedPosShape;
-    $to: ResolvedPosShape;
-    node?: {
-        type: {
-            name: string;
-        };
-    };
-}
-interface BubbleMenuSeparator {
-    type: 'separator';
-    name: string;
-}
-type BubbleMenuItem = ToolbarButton | ToolbarDropdown | BubbleMenuSeparator;
-interface ItemMaps {
-    itemMap: Map<string, ToolbarButton>;
-    dropdownMap: Map<string, ToolbarDropdown>;
-    /** Bubble defaults indexed by context name (e.g. 'text', 'codeBlock'). */
-    bubbleDefaults: Map<string, BubbleMenuItem[]>;
-}
-/**
- * Walks `editor.toolbarItems` and indexes them by name. Dropdowns are kept
- * separately so the bubble menu can resolve them by name (e.g. text-align).
- */
-declare function buildItemMaps(editor: Editor): ItemMaps;
-/**
- * Resolve a name array to BubbleMenuItems via the item/dropdown maps.
- * Dropdowns take priority over buttons sharing the same name. Pipe `|`
- * tokens become separator entries.
- */
-declare function resolveNames(names: string[], itemMap: Map<string, ToolbarButton>, dropdownMap: Map<string, ToolbarDropdown>): BubbleMenuItem[];
-/**
- * All `format`-group buttons sorted by priority (used by `context: true`
- * shorthand to show "all format marks for this context").
- */
-declare function getFormatItems(itemMap: Map<string, ToolbarButton>): ToolbarButton[];
-/**
- * Determine the active bubble-menu context based on the selection. Returns
- * `null` when no context matches (menu should not show).
- *
- * Resolution order:
- * 1. CellSelection (`$anchorCell`) - no menu inside table cell selections
- * 2. NodeSelection (image, HR, etc.) - return the node's type name
- * 3. Empty selection - no context (caret-only)
- * 4. Inside a table cell - return 'table' (when from/to share a cell)
- * 5. `$from.parent.type.name` if listed in contexts
- * 6. 'text' if the parent allows marks
- */
-declare function detectContext(selection: SelectionShape, ctxs: Record<string, string[] | true | null>): string | null;
-/**
- * Filter items by what the schema actually allows in the given context.
- * E.g. inside a `codeBlock` node, marks like Bold/Italic aren't permitted.
- *
- * Pass-through for 'text' and 'table' contexts (schema check would be
- * lossy there because marks are allowed but some items still apply).
- */
-declare function filterBySchema(editor: Editor, contextName: string, schemaItems: ToolbarButton[]): ToolbarButton[];
-/**
- * Detect whether `$pos` is inside a table cell (cell or header).
- */
-declare function isInsideTableCell($pos: ResolvedPosShape): boolean;
-
 /**
  * Live state for the bubble-menu trailing buttons.
  *
@@ -576,7 +498,7 @@ interface DomternalBubbleMenuOptions extends CustomContentOption {
      * to item name list, `true` (show all format items), or `null` (no menu for
      * this context). Defaults to `defaultBubbleContexts(editor)`.
      */
-    contexts?: Record<string, string[] | true | null>;
+    contexts?: BubbleContexts;
     /** Custom icon overrides. Falls back to default Phosphor icons for unmapped keys. */
     icons?: IconSet;
 }
@@ -666,7 +588,7 @@ declare class DomternalBubbleMenu extends EventTarget {
      * plugin at construction; this only changes WHICH items render once the
      * menu is visible.
      */
-    setContexts(contexts: Record<string, string[] | true | null> | undefined): void;
+    setContexts(contexts: BubbleContexts | undefined): void;
     /** Replace the icon set. `undefined` restores default Phosphor icons. */
     setIcons(icons: IconSet | undefined): void;
     /** Close any open dropdown (text-align). No-op if nothing is open. */
@@ -878,4 +800,4 @@ declare class DomternalEmojiPicker extends EventTarget {
     destroy(): void;
 }
 
-export { type BubbleMenuItem, type BubbleMenuSeparator, type BubbleMenuTrailingState, type CustomContentOption, DEFAULT_EXTENSIONS, DROPDOWN_CARET, DomternalBubbleMenu, type DomternalBubbleMenuOptions, DomternalEditor, type DomternalEditorOptions, DomternalEmojiPicker, type DomternalEmojiPickerOptions, DomternalFloatingMenu, type DomternalFloatingMenuOptions, DomternalNotionColorPicker, type DomternalNotionColorPickerOptions, DomternalToolbar, type DomternalToolbarOptions, type EmojiPickerItem, INITIAL_TRAILING_STATE, type IconCache, type ItemMaps, type ResolvedPosShape, type SelectionShape, assertBrowser, buildItemMaps, computeTrailingState, createIconCache, createPluginKey, detectContext, filterBySchema, getComputedStyleAtCursor, getFormatItems, getInlineStyleAtCursor, getTooltip, isBrowser, isInsideTableCell, renderIconInto, resolveIcon, resolveNames, subscribe };
+export { type BubbleMenuTrailingState, type CustomContentOption, DEFAULT_EXTENSIONS, DROPDOWN_CARET, DomternalBubbleMenu, type DomternalBubbleMenuOptions, DomternalEditor, type DomternalEditorOptions, DomternalEmojiPicker, type DomternalEmojiPickerOptions, DomternalFloatingMenu, type DomternalFloatingMenuOptions, DomternalNotionColorPicker, type DomternalNotionColorPickerOptions, DomternalToolbar, type DomternalToolbarOptions, type EmojiPickerItem, INITIAL_TRAILING_STATE, type IconCache, assertBrowser, computeTrailingState, createIconCache, createPluginKey, getComputedStyleAtCursor, getInlineStyleAtCursor, getTooltip, isBrowser, renderIconInto, resolveIcon, subscribe };

package/dist/index.js

@@ -1,4 +1,5 @@
-import { Document, Paragraph, Text, BaseKeymap, History, PluginKey, defaultIcons, Editor, ToolbarController, positionFloatingOnce, refocusEditorAfterCommand, defaultBubbleContexts, createBubbleMenuPlugin, createFloatingMenuPlugin, FloatingMenuController, positionFloating } from '@domternal/core';
+import { Document, Paragraph, Text, BaseKeymap, History, PluginKey, defaultIcons, Editor, ToolbarController, positionFloatingOnce, refocusEditorAfterCommand, resolveBubbleNames, defaultBubbleContexts, buildBubbleItemMaps, createBubbleMenuPlugin, createBubbleShouldShow, resolveBubbleMenuItems, createFloatingMenuPlugin, FloatingMenuController, positionFloating } from '@domternal/core';
+export { buildBubbleItemMaps as buildItemMaps, detectBubbleContext as detectContext, filterBubbleItemsBySchema as filterBySchema, getBubbleFormatItems as getFormatItems, isInsideTableCell, resolveBubbleNames as resolveNames } from '@domternal/core';
 
 // src/shared/isBrowser.ts
 var isBrowser = typeof window !== "undefined" && typeof document !== "undefined";
@@ -889,129 +890,6 @@ var DomternalToolbar = class extends EventTarget {
   }
 };
 
-// src/bubble-menu/itemResolver.ts
-function buildItemMaps(editor) {
-  const itemMap = /* @__PURE__ */ new Map();
-  const dropdownMap = /* @__PURE__ */ new Map();
-  for (const item of editor.toolbarItems) {
-    if (item.type === "button") {
-      itemMap.set(item.name, item);
-    } else if (item.type === "dropdown") {
-      dropdownMap.set(item.name, item);
-      for (const sub of item.items) {
-        itemMap.set(sub.name, sub);
-      }
-    }
-  }
-  return {
-    itemMap,
-    dropdownMap,
-    bubbleDefaults: buildBubbleDefaults(editor)
-  };
-}
-function buildBubbleDefaults(editor) {
-  const byCtx = /* @__PURE__ */ new Map();
-  const addItem = (btn) => {
-    const ctx = btn["bubbleMenu"];
-    if (!ctx) return;
-    let arr = byCtx.get(ctx);
-    if (!arr) {
-      arr = [];
-      byCtx.set(ctx, arr);
-    }
-    arr.push(btn);
-  };
-  for (const item of editor.toolbarItems) {
-    if (item.type === "button") addItem(item);
-    else if (item.type === "dropdown") {
-      for (const sub of item.items) addItem(sub);
-    }
-  }
-  const result = /* @__PURE__ */ new Map();
-  for (const [ctx, ctxItems] of byCtx) {
-    ctxItems.sort((a, b) => (b.priority ?? 100) - (a.priority ?? 100));
-    const list = [];
-    let lastGroup;
-    let sepIdx = 0;
-    for (const item of ctxItems) {
-      if (lastGroup !== void 0 && item.group !== lastGroup) {
-        list.push({ type: "separator", name: `bsep-${String(sepIdx++)}` });
-      }
-      list.push(item);
-      lastGroup = item.group;
-    }
-    result.set(ctx, list);
-  }
-  return result;
-}
-function resolveNames(names, itemMap, dropdownMap) {
-  const result = [];
-  let sepIdx = 0;
-  for (const name of names) {
-    if (name === "|") {
-      result.push({ type: "separator", name: `sep-${String(sepIdx++)}` });
-      continue;
-    }
-    const dropdown = dropdownMap.get(name);
-    if (dropdown) {
-      result.push(dropdown);
-      continue;
-    }
-    const item = itemMap.get(name);
-    if (item) result.push(item);
-  }
-  return result;
-}
-function getFormatItems(itemMap) {
-  return Array.from(itemMap.values()).filter((item) => item.group === "format").sort((a, b) => (b.priority ?? 100) - (a.priority ?? 100));
-}
-function detectContext(selection, ctxs) {
-  if ("$anchorCell" in selection) return null;
-  if (selection.node) return selection.node.type.name;
-  if (selection.empty) return null;
-  const fromCell = findCellNode(selection.$from);
-  if (fromCell) {
-    const toCell = findCellNode(selection.$to);
-    if (toCell && fromCell !== toCell) return null;
-    return "table";
-  }
-  const fromName = selection.$from.parent.type.name;
-  if (fromName in ctxs) return fromName;
-  if ("text" in ctxs && selection.$from.parent.type.spec.marks !== "") return "text";
-  const toName = selection.$to.parent.type.name;
-  if (toName in ctxs) return toName;
-  if ("text" in ctxs && selection.$to.parent.type.spec.marks !== "") return "text";
-  return null;
-}
-function filterBySchema(editor, contextName, schemaItems) {
-  if (contextName === "text" || contextName === "table") return schemaItems;
-  const schema = editor.state.schema;
-  if (!schema) return schemaItems;
-  const nodeType = schema.nodes[contextName];
-  if (!nodeType) return schemaItems;
-  return schemaItems.filter((item) => {
-    const markName = typeof item.isActive === "string" ? item.isActive : null;
-    if (!markName) return true;
-    const markType = schema.marks[markName];
-    if (!markType) return true;
-    return nodeType.allowsMarkType(markType);
-  });
-}
-function isInsideTableCell($pos) {
-  for (let d = $pos.depth; d > 0; d--) {
-    const name = $pos.node(d).type.name;
-    if (name === "tableCell" || name === "tableHeader") return true;
-  }
-  return false;
-}
-function findCellNode(pos) {
-  for (let d = pos.depth; d > 0; d--) {
-    const node = pos.node(d);
-    if (node.type.name === "tableCell" || node.type.name === "tableHeader") return node;
-  }
-  return null;
-}
-
 // src/bubble-menu/trailingState.ts
 var INITIAL_TRAILING_STATE = {
   isNodeSelection: false,
@@ -1189,7 +1067,7 @@ var DomternalBubbleMenu = class extends EventTarget {
     if (this.#destroyed) return;
     this.#explicitItems = items;
     if (this.#maps) {
-      this.#defaultItemList = items ? resolveNames(items, this.#maps.itemMap, this.#maps.dropdownMap) : resolveNames(["bold", "italic", "underline"], this.#maps.itemMap, this.#maps.dropdownMap);
+      this.#defaultItemList = items ? resolveBubbleNames(items, this.#maps.itemMap, this.#maps.dropdownMap) : resolveBubbleNames(["bold", "italic", "underline"], this.#maps.itemMap, this.#maps.dropdownMap);
     }
     this.#updateResolvedItems();
     this.#updateStates();
@@ -1246,9 +1124,9 @@ var DomternalBubbleMenu = class extends EventTarget {
     const exts = ed.extensionManager.extensions;
     this.#hasNotionColorPicker = exts.some((e) => e.name === "notionColorPicker");
     this.#hasBlockContextMenu = exts.some((e) => e.name === "blockContextMenu");
-    this.#maps = buildItemMaps(ed);
+    this.#maps = buildBubbleItemMaps(ed);
     this.#effectiveContexts = this.#explicitContexts ?? (this.#explicitItems ? void 0 : defaultBubbleContexts(ed));
-    this.#defaultItemList = this.#explicitItems ? resolveNames(this.#explicitItems, this.#maps.itemMap, this.#maps.dropdownMap) : resolveNames(["bold", "italic", "underline"], this.#maps.itemMap, this.#maps.dropdownMap);
+    this.#defaultItemList = this.#explicitItems ? resolveBubbleNames(this.#explicitItems, this.#maps.itemMap, this.#maps.dropdownMap) : resolveBubbleNames(["bold", "italic", "underline"], this.#maps.itemMap, this.#maps.dropdownMap);
     const shouldShow = this.#shouldShowOpt ?? this.#buildDefaultShouldShow();
     const plugin = createBubbleMenuPlugin({
       pluginKey: this.#pluginKey,
@@ -1280,76 +1158,28 @@ var DomternalBubbleMenu = class extends EventTarget {
     this.#render();
   }
   #buildDefaultShouldShow() {
-    const contexts = this.#effectiveContexts;
-    const defaults = this.#maps?.bubbleDefaults;
-    if (contexts) {
-      return ({ state }) => {
-        const ctx = detectContext(
-          state.selection,
-          contexts
-        );
-        if (!ctx) return false;
-        if (ctx in contexts) {
-          const val = contexts[ctx];
-          if (val === null) return false;
-          return val === true || Array.isArray(val) && val.length > 0;
-        }
-        return defaults?.has(ctx) ?? false;
-      };
-    }
-    return ({ state }) => {
-      const sel = state.selection;
-      if (sel.empty) return false;
-      if (sel.node) return defaults?.has(sel.node.type.name) ?? false;
-      if (isInsideTableCell(sel.$from)) return false;
-      return sel.$from.parent.type.spec.marks !== "" || sel.$to.parent.type.spec.marks !== "";
-    };
+    const maps = this.#maps;
+    if (!maps) return () => false;
+    return createBubbleShouldShow(maps, this.#effectiveContexts);
   }
   // === State updates (called per transaction) ===
+  /**
+   * One call per transaction, into the resolver core owns. Every renderer
+   * asks the same question and has to get the same answer, so the answer is
+   * not written here.
+   */
   #updateResolvedItems() {
-    if (!this.#maps) return;
-    const ed = this.#editor;
-    const contexts = this.#effectiveContexts;
-    if (contexts) {
-      const ctx = detectContext(
-        ed.state.selection,
-        contexts
-      );
-      if (!ctx) {
-        this.#resolvedItems = [];
-        return;
-      }
-      if (ctx in contexts) {
-        const val = contexts[ctx];
-        if (val === null || Array.isArray(val) && val.length === 0) {
-          this.#resolvedItems = [];
-          return;
-        }
-        if (val === true) {
-          this.#resolvedItems = filterBySchema(ed, ctx, getFormatItems(this.#maps.itemMap));
-          return;
-        }
-        if (Array.isArray(val)) {
-          const resolved = resolveNames(val, this.#maps.itemMap, this.#maps.dropdownMap);
-          const buttons = resolved.filter(
-            (i) => i.type !== "separator"
-          );
-          const allowed = new Set(filterBySchema(ed, ctx, buttons).map((b) => b.name));
-          this.#resolvedItems = resolved.filter(
-            (i) => i.type === "separator" || allowed.has(i.name)
-          );
-          return;
-        }
-      }
-      this.#resolvedItems = this.#maps.bubbleDefaults.get(ctx) ?? [];
+    const maps = this.#maps;
+    if (!maps) {
+      this.#resolvedItems = [];
       return;
     }
-    const sel = ed.state.selection;
-    if (sel.node && this.#maps.bubbleDefaults.has(sel.node.type.name)) {
-      this.#resolvedItems = this.#maps.bubbleDefaults.get(sel.node.type.name) ?? [];
-    } else {
-      this.#resolvedItems = this.#defaultItemList;
-    }
+    this.#resolvedItems = resolveBubbleMenuItems({
+      editor: this.#editor,
+      maps,
+      contexts: this.#effectiveContexts,
+      fallbackItems: this.#defaultItemList
+    });
   }
   #updateStates() {
     const ed = this.#editor;
@@ -1445,12 +1275,18 @@ var DomternalBubbleMenu = class extends EventTarget {
       }
     }
     const t = this.#trailing;
-    if (t.showColorPickerButton && !t.isNodeSelection) {
-      this.host.appendChild(this.#createSeparator("trailing-sep-color"));
+    const showColor = t.showColorPickerButton && !t.isNodeSelection;
+    const showBlock = t.showBlockMenuButton && !t.isNodeSelection;
+    if (showColor) {
+      if (this.#resolvedItems.length > 0) {
+        this.host.appendChild(this.#createSeparator("trailing-sep-color"));
+      }
       this.host.appendChild(this.#createColorTrigger());
     }
-    if (t.showBlockMenuButton && !t.isNodeSelection) {
-      this.host.appendChild(this.#createSeparator("trailing-sep-block"));
+    if (showBlock) {
+      if (this.#resolvedItems.length > 0 || showColor) {
+        this.host.appendChild(this.#createSeparator("trailing-sep-block"));
+      }
       this.host.appendChild(this.#createBlockMenuTrigger());
     }
     if (this.#customContent) {
@@ -1977,6 +1813,14 @@ var DomternalFloatingMenu = class extends EventTarget {
     }
   }
 };
+function paletteFromExtensionOptions(options) {
+  if (typeof options !== "object" || options === null || !("palette" in options)) return [];
+  const palette = options.palette;
+  if (!Array.isArray(palette) || !palette.every((token) => typeof token === "string")) {
+    return [];
+  }
+  return [...palette];
+}
 var TOKEN_LABELS = {
   gray: "Gray",
   brown: "Brown",
@@ -2053,8 +1897,7 @@ var DomternalNotionColorPicker = class extends EventTarget {
     const ext = this.#editor.extensionManager.extensions.find(
       (e) => e.name === "notionColorPicker"
     );
-    const extOpts = ext?.options ?? null;
-    this.#palette = extOpts?.palette ? [...extOpts.palette] : [];
+    this.#palette = paletteFromExtensionOptions(ext?.options);
     this.#onOpen = (...args) => {
       const detail = args[0];
       const incoming = detail?.anchorElement;
@@ -2135,9 +1978,7 @@ var DomternalNotionColorPicker = class extends EventTarget {
     this.#editor.commands.setTextColorToken(token);
     this.#syncFromSelection();
     this.#updateActiveClasses();
-    this.dispatchEvent(
-      new CustomEvent("apply", { detail: { kind: "text", token } })
-    );
+    this.dispatchEvent(new CustomEvent("apply", { detail: { kind: "text", token } }));
   }
   /** Apply a background color token to the current selection. Picker stays open. */
   applyBg(token) {
@@ -2145,9 +1986,7 @@ var DomternalNotionColorPicker = class extends EventTarget {
     this.#editor.commands.setBackgroundColorToken(token);
     this.#syncFromSelection();
     this.#updateActiveClasses();
-    this.dispatchEvent(
-      new CustomEvent("apply", { detail: { kind: "bg", token } })
-    );
+    this.dispatchEvent(new CustomEvent("apply", { detail: { kind: "bg", token } }));
   }
   /** Display label for a palette token (title-case fallback). */
   tokenLabel(token) {
@@ -2357,9 +2196,7 @@ var DomternalNotionColorPicker = class extends EventTarget {
           return rect;
         }
         if (this.#anchorBubbleMenu?.isConnected) {
-          const fresh = this.#anchorBubbleMenu.querySelector(
-            ".dm-ncp-trigger"
-          );
+          const fresh = this.#anchorBubbleMenu.querySelector(".dm-ncp-trigger");
           if (fresh) {
             this.#anchor = fresh;
             const rect = fresh.getBoundingClientRect();
@@ -2429,15 +2266,13 @@ var DomternalNotionColorPicker = class extends EventTarget {
   #onPanelKeydown(event) {
     const cols = 5;
     if (!this.#panel) return;
-    const swatches = Array.from(
-      this.#panel.querySelectorAll(".dm-ncp-swatch")
-    );
+    const swatches = Array.from(this.#panel.querySelectorAll(".dm-ncp-swatch"));
     if (!swatches.length) return;
     const active = document.activeElement;
     if (!(active instanceof HTMLElement)) return;
     const idx = swatches.indexOf(active);
     if (idx === -1) return;
-    let next = idx;
+    let next;
     switch (event.key) {
       case "ArrowRight":
         event.preventDefault();
@@ -2664,11 +2499,7 @@ var DomternalEmojiPicker = class extends EventTarget {
     return panel;
   }
   #renderPanelChildren() {
-    return [
-      this.#renderSearch(),
-      this.#renderTabs(),
-      this.#renderGrid()
-    ];
+    return [this.#renderSearch(), this.#renderTabs(), this.#renderGrid()];
   }
   #renderSearch() {
     const wrapper = document.createElement("div");
@@ -2783,9 +2614,7 @@ var DomternalEmojiPicker = class extends EventTarget {
    */
   #setSearchQuery(value) {
     this.#searchQuery = value;
-    const input = this.#panel?.querySelector(
-      ".dm-emoji-picker-search input"
-    );
+    const input = this.#panel?.querySelector(".dm-emoji-picker-search input");
     if (input && input.value !== value) input.value = value;
   }
   /** Replace grid contents only (used when searchQuery changes). */
@@ -2849,9 +2678,7 @@ var DomternalEmojiPicker = class extends EventTarget {
   #onGridKeydown(event) {
     const grid = this.#panel?.querySelector(".dm-emoji-picker-grid");
     if (!grid) return;
-    const swatches = Array.from(
-      grid.querySelectorAll(".dm-emoji-swatch")
-    );
+    const swatches = Array.from(grid.querySelectorAll(".dm-emoji-swatch"));
     if (!swatches.length) return;
     const active = document.activeElement;
     const idx = active instanceof HTMLElement ? swatches.indexOf(active) : -1;
@@ -2863,7 +2690,7 @@ var DomternalEmojiPicker = class extends EventTarget {
       return;
     }
     const cols = 8;
-    let next = idx;
+    let next;
     switch (event.key) {
       case "ArrowRight":
         event.preventDefault();
@@ -2901,9 +2728,7 @@ var DomternalEmojiPicker = class extends EventTarget {
           offsetValue: 4
         });
       }
-      const input = this.#panel.querySelector(
-        ".dm-emoji-picker-search input"
-      );
+      const input = this.#panel.querySelector(".dm-emoji-picker-search input");
       input?.focus({ preventScroll: true });
     });
   }
@@ -2942,6 +2767,6 @@ var DomternalEmojiPicker = class extends EventTarget {
   }
 };
 
-export { DEFAULT_EXTENSIONS, DROPDOWN_CARET, DomternalBubbleMenu, DomternalEditor, DomternalEmojiPicker, DomternalFloatingMenu, DomternalNotionColorPicker, DomternalToolbar, INITIAL_TRAILING_STATE, assertBrowser, buildItemMaps, computeTrailingState, createIconCache, createPluginKey, detectContext, filterBySchema, getComputedStyleAtCursor, getFormatItems, getInlineStyleAtCursor, getTooltip, isBrowser, isInsideTableCell, renderIconInto, resolveIcon, resolveNames, subscribe };
+export { DEFAULT_EXTENSIONS, DROPDOWN_CARET, DomternalBubbleMenu, DomternalEditor, DomternalEmojiPicker, DomternalFloatingMenu, DomternalNotionColorPicker, DomternalToolbar, INITIAL_TRAILING_STATE, assertBrowser, computeTrailingState, createIconCache, createPluginKey, getComputedStyleAtCursor, getInlineStyleAtCursor, getTooltip, isBrowser, renderIconInto, resolveIcon, subscribe };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map