@threadlabs/looma 0.1.16 → 0.1.18

package/editor/{chunk-OHD4OS32.js → chunk-OXFYYLUC.js}

@@ -1,6 +1,8 @@
 import {
-  TABLE_CELL_BACKGROUND_PRESETS
-} from "./chunk-CX4QDKSV.js";
+  TABLE_CELL_BACKGROUND_PRESETS,
+  filterLoomaMentionItems,
+  normalizeMentionResultLimit
+} from "./chunk-ZOUKEZ77.js";
 
 // src/extensions/preset.ts
 import { Extension as Extension7 } from "@tiptap/core";
@@ -4892,8 +4894,620 @@ var LoomaListBehavior = Extension6.create({
   }
 });
 
+// ../../node_modules/.pnpm/@tiptap+extension-mention@2.27.3_@tiptap+core@2.27.2_@tiptap+pm@2.27.2__@tiptap+pm@2.27_e4d93fc6b40c97d74d1cbe40f638e38f/node_modules/@tiptap/extension-mention/dist/index.js
+import { Node as Node16, mergeAttributes as mergeAttributes21 } from "@tiptap/core";
+import { Node as Node$1 } from "@tiptap/pm/model";
+
+// ../../node_modules/.pnpm/@tiptap+suggestion@2.27.2_@tiptap+core@2.27.2_@tiptap+pm@2.27.2__@tiptap+pm@2.27.2/node_modules/@tiptap/suggestion/dist/index.js
+import { PluginKey as PluginKey5, Plugin as Plugin5 } from "@tiptap/pm/state";
+import { DecorationSet as DecorationSet3, Decoration as Decoration3 } from "@tiptap/pm/view";
+import { escapeForRegEx } from "@tiptap/core";
+function findSuggestionMatch(config) {
+  var _a;
+  const { char, allowSpaces: allowSpacesOption, allowToIncludeChar, allowedPrefixes, startOfLine, $position } = config;
+  const allowSpaces = allowSpacesOption && !allowToIncludeChar;
+  const escapedChar = escapeForRegEx(char);
+  const suffix = new RegExp(`\\s${escapedChar}$`);
+  const prefix = startOfLine ? "^" : "";
+  const finalEscapedChar = allowToIncludeChar ? "" : escapedChar;
+  const regexp = allowSpaces ? new RegExp(`${prefix}${escapedChar}.*?(?=\\s${finalEscapedChar}|$)`, "gm") : new RegExp(`${prefix}(?:^)?${escapedChar}[^\\s${finalEscapedChar}]*`, "gm");
+  const text = ((_a = $position.nodeBefore) === null || _a === void 0 ? void 0 : _a.isText) && $position.nodeBefore.text;
+  if (!text) {
+    return null;
+  }
+  const textFrom = $position.pos - text.length;
+  const match = Array.from(text.matchAll(regexp)).pop();
+  if (!match || match.input === void 0 || match.index === void 0) {
+    return null;
+  }
+  const matchPrefix = match.input.slice(Math.max(0, match.index - 1), match.index);
+  const matchPrefixIsAllowed = new RegExp(`^[${allowedPrefixes === null || allowedPrefixes === void 0 ? void 0 : allowedPrefixes.join("")}\0]?$`).test(matchPrefix);
+  if (allowedPrefixes !== null && !matchPrefixIsAllowed) {
+    return null;
+  }
+  const from = textFrom + match.index;
+  let to = from + match[0].length;
+  if (allowSpaces && suffix.test(text.slice(to - 1, to + 1))) {
+    match[0] += " ";
+    to += 1;
+  }
+  if (from < $position.pos && to >= $position.pos) {
+    return {
+      range: {
+        from,
+        to
+      },
+      query: match[0].slice(char.length),
+      text: match[0]
+    };
+  }
+  return null;
+}
+var SuggestionPluginKey = new PluginKey5("suggestion");
+function Suggestion({ pluginKey = SuggestionPluginKey, editor, char = "@", allowSpaces = false, allowToIncludeChar = false, allowedPrefixes = [" "], startOfLine = false, decorationTag = "span", decorationClass = "suggestion", decorationContent = "", decorationEmptyClass = "is-empty", command = () => null, items = () => [], render = () => ({}), allow = () => true, findSuggestionMatch: findSuggestionMatch$1 = findSuggestionMatch }) {
+  let props;
+  const renderer = render === null || render === void 0 ? void 0 : render();
+  const plugin = new Plugin5({
+    key: pluginKey,
+    view() {
+      return {
+        update: async (view, prevState) => {
+          var _a, _b, _c, _d, _e, _f, _g;
+          const prev = (_a = this.key) === null || _a === void 0 ? void 0 : _a.getState(prevState);
+          const next = (_b = this.key) === null || _b === void 0 ? void 0 : _b.getState(view.state);
+          const moved = prev.active && next.active && prev.range.from !== next.range.from;
+          const started = !prev.active && next.active;
+          const stopped = prev.active && !next.active;
+          const changed = !started && !stopped && prev.query !== next.query;
+          const handleStart = started || moved && changed;
+          const handleChange = changed || moved;
+          const handleExit = stopped || moved && changed;
+          if (!handleStart && !handleChange && !handleExit) {
+            return;
+          }
+          const state = handleExit && !handleStart ? prev : next;
+          const decorationNode = view.dom.querySelector(`[data-decoration-id="${state.decorationId}"]`);
+          props = {
+            editor,
+            range: state.range,
+            query: state.query,
+            text: state.text,
+            items: [],
+            command: (commandProps) => {
+              return command({
+                editor,
+                range: state.range,
+                props: commandProps
+              });
+            },
+            decorationNode,
+            // virtual node for popper.js or tippy.js
+            // this can be used for building popups without a DOM node
+            clientRect: decorationNode ? () => {
+              var _a2;
+              const { decorationId } = (_a2 = this.key) === null || _a2 === void 0 ? void 0 : _a2.getState(editor.state);
+              const currentDecorationNode = view.dom.querySelector(`[data-decoration-id="${decorationId}"]`);
+              return (currentDecorationNode === null || currentDecorationNode === void 0 ? void 0 : currentDecorationNode.getBoundingClientRect()) || null;
+            } : null
+          };
+          if (handleStart) {
+            (_c = renderer === null || renderer === void 0 ? void 0 : renderer.onBeforeStart) === null || _c === void 0 ? void 0 : _c.call(renderer, props);
+          }
+          if (handleChange) {
+            (_d = renderer === null || renderer === void 0 ? void 0 : renderer.onBeforeUpdate) === null || _d === void 0 ? void 0 : _d.call(renderer, props);
+          }
+          if (handleChange || handleStart) {
+            props.items = await items({
+              editor,
+              query: state.query
+            });
+          }
+          if (handleExit) {
+            (_e = renderer === null || renderer === void 0 ? void 0 : renderer.onExit) === null || _e === void 0 ? void 0 : _e.call(renderer, props);
+          }
+          if (handleChange) {
+            (_f = renderer === null || renderer === void 0 ? void 0 : renderer.onUpdate) === null || _f === void 0 ? void 0 : _f.call(renderer, props);
+          }
+          if (handleStart) {
+            (_g = renderer === null || renderer === void 0 ? void 0 : renderer.onStart) === null || _g === void 0 ? void 0 : _g.call(renderer, props);
+          }
+        },
+        destroy: () => {
+          var _a;
+          if (!props) {
+            return;
+          }
+          (_a = renderer === null || renderer === void 0 ? void 0 : renderer.onExit) === null || _a === void 0 ? void 0 : _a.call(renderer, props);
+        }
+      };
+    },
+    state: {
+      // Initialize the plugin's internal state.
+      init() {
+        const state = {
+          active: false,
+          range: {
+            from: 0,
+            to: 0
+          },
+          query: null,
+          text: null,
+          composing: false
+        };
+        return state;
+      },
+      // Apply changes to the plugin state from a view transaction.
+      apply(transaction, prev, _oldState, state) {
+        const { isEditable } = editor;
+        const { composing } = editor.view;
+        const { selection } = transaction;
+        const { empty, from } = selection;
+        const next = { ...prev };
+        next.composing = composing;
+        if (isEditable && (empty || editor.view.composing)) {
+          if ((from < prev.range.from || from > prev.range.to) && !composing && !prev.composing) {
+            next.active = false;
+          }
+          const match = findSuggestionMatch$1({
+            char,
+            allowSpaces,
+            allowToIncludeChar,
+            allowedPrefixes,
+            startOfLine,
+            $position: selection.$from
+          });
+          const decorationId = `id_${Math.floor(Math.random() * 4294967295)}`;
+          if (match && allow({
+            editor,
+            state,
+            range: match.range,
+            isActive: prev.active
+          })) {
+            next.active = true;
+            next.decorationId = prev.decorationId ? prev.decorationId : decorationId;
+            next.range = match.range;
+            next.query = match.query;
+            next.text = match.text;
+          } else {
+            next.active = false;
+          }
+        } else {
+          next.active = false;
+        }
+        if (!next.active) {
+          next.decorationId = null;
+          next.range = { from: 0, to: 0 };
+          next.query = null;
+          next.text = null;
+        }
+        return next;
+      }
+    },
+    props: {
+      // Call the keydown hook if suggestion is active.
+      handleKeyDown(view, event) {
+        var _a;
+        const { active, range } = plugin.getState(view.state);
+        if (!active) {
+          return false;
+        }
+        return ((_a = renderer === null || renderer === void 0 ? void 0 : renderer.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(renderer, { view, event, range })) || false;
+      },
+      // Setup decorator on the currently active suggestion.
+      decorations(state) {
+        const { active, range, decorationId, query } = plugin.getState(state);
+        if (!active) {
+          return null;
+        }
+        const isEmpty = !(query === null || query === void 0 ? void 0 : query.length);
+        const classNames = [decorationClass];
+        if (isEmpty) {
+          classNames.push(decorationEmptyClass);
+        }
+        return DecorationSet3.create(state.doc, [
+          Decoration3.inline(range.from, range.to, {
+            nodeName: decorationTag,
+            class: classNames.join(" "),
+            "data-decoration-id": decorationId,
+            "data-decoration-content": decorationContent
+          })
+        ]);
+      }
+    }
+  });
+  return plugin;
+}
+
+// ../../node_modules/.pnpm/@tiptap+extension-mention@2.27.3_@tiptap+core@2.27.2_@tiptap+pm@2.27.2__@tiptap+pm@2.27_e4d93fc6b40c97d74d1cbe40f638e38f/node_modules/@tiptap/extension-mention/dist/index.js
+import { PluginKey as PluginKey6 } from "@tiptap/pm/state";
+function getSuggestionOptions({ editor: tiptapEditor, overrideSuggestionOptions, extensionName, char = "@" }) {
+  const pluginKey = new PluginKey6();
+  return {
+    editor: tiptapEditor,
+    char,
+    pluginKey,
+    command: ({ editor, range, props }) => {
+      var _a, _b, _c;
+      const nodeAfter = editor.view.state.selection.$to.nodeAfter;
+      const overrideSpace = (_a = nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.text) === null || _a === void 0 ? void 0 : _a.startsWith(" ");
+      if (overrideSpace) {
+        range.to += 1;
+      }
+      editor.chain().focus().insertContentAt(range, [
+        {
+          type: extensionName,
+          attrs: { ...props, mentionSuggestionChar: char }
+        },
+        {
+          type: "text",
+          text: " "
+        }
+      ]).run();
+      (_c = (_b = editor.view.dom.ownerDocument.defaultView) === null || _b === void 0 ? void 0 : _b.getSelection()) === null || _c === void 0 ? void 0 : _c.collapseToEnd();
+    },
+    allow: ({ state, range }) => {
+      const $from = state.doc.resolve(range.from);
+      const type = state.schema.nodes[extensionName];
+      const allow = !!$from.parent.type.contentMatch.matchType(type);
+      return allow;
+    },
+    ...overrideSuggestionOptions
+  };
+}
+function getSuggestions(options) {
+  return (options.options.suggestions.length ? options.options.suggestions : [options.options.suggestion]).map((suggestion) => getSuggestionOptions({
+    // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
+    editor: options.editor,
+    overrideSuggestionOptions: suggestion,
+    extensionName: options.name,
+    char: suggestion.char
+  }));
+}
+function getSuggestionFromChar(options, char) {
+  const suggestions = getSuggestions(options);
+  const suggestion = suggestions.find((s) => s.char === char);
+  if (suggestion) {
+    return suggestion;
+  }
+  if (suggestions.length) {
+    return suggestions[0];
+  }
+  return null;
+}
+var Mention = Node16.create({
+  name: "mention",
+  priority: 101,
+  addOptions() {
+    return {
+      HTMLAttributes: {},
+      renderText({ node, suggestion }) {
+        var _a, _b;
+        return `${(_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.char) !== null && _a !== void 0 ? _a : "@"}${(_b = node.attrs.label) !== null && _b !== void 0 ? _b : node.attrs.id}`;
+      },
+      deleteTriggerWithBackspace: false,
+      renderHTML({ options, node, suggestion }) {
+        var _a, _b;
+        return [
+          "span",
+          mergeAttributes21(this.HTMLAttributes, options.HTMLAttributes),
+          `${(_a = suggestion === null || suggestion === void 0 ? void 0 : suggestion.char) !== null && _a !== void 0 ? _a : "@"}${(_b = node.attrs.label) !== null && _b !== void 0 ? _b : node.attrs.id}`
+        ];
+      },
+      suggestions: [],
+      suggestion: {}
+    };
+  },
+  group: "inline",
+  inline: true,
+  selectable: false,
+  atom: true,
+  addAttributes() {
+    return {
+      id: {
+        default: null,
+        parseHTML: (element) => element.getAttribute("data-id"),
+        renderHTML: (attributes) => {
+          if (!attributes.id) {
+            return {};
+          }
+          return {
+            "data-id": attributes.id
+          };
+        }
+      },
+      label: {
+        default: null,
+        parseHTML: (element) => element.getAttribute("data-label"),
+        renderHTML: (attributes) => {
+          if (!attributes.label) {
+            return {};
+          }
+          return {
+            "data-label": attributes.label
+          };
+        }
+      },
+      // When there are multiple types of mentions, this attribute helps distinguish them
+      mentionSuggestionChar: {
+        default: "@",
+        parseHTML: (element) => element.getAttribute("data-mention-suggestion-char"),
+        renderHTML: (attributes) => {
+          return {
+            "data-mention-suggestion-char": attributes.mentionSuggestionChar
+          };
+        }
+      }
+    };
+  },
+  parseHTML() {
+    return [
+      {
+        tag: `span[data-type="${this.name}"]`
+      }
+    ];
+  },
+  renderHTML({ node, HTMLAttributes }) {
+    const suggestion = getSuggestionFromChar(this, node.attrs.mentionSuggestionChar);
+    if (this.options.renderLabel !== void 0) {
+      console.warn("renderLabel is deprecated use renderText and renderHTML instead");
+      return [
+        "span",
+        mergeAttributes21({ "data-type": this.name }, this.options.HTMLAttributes, HTMLAttributes),
+        this.options.renderLabel({
+          options: this.options,
+          node,
+          suggestion
+        })
+      ];
+    }
+    const mergedOptions = { ...this.options };
+    mergedOptions.HTMLAttributes = mergeAttributes21({ "data-type": this.name }, this.options.HTMLAttributes, HTMLAttributes);
+    const html = this.options.renderHTML({
+      options: mergedOptions,
+      node,
+      suggestion
+    });
+    if (typeof html === "string") {
+      return [
+        "span",
+        mergeAttributes21({ "data-type": this.name }, this.options.HTMLAttributes, HTMLAttributes),
+        html
+      ];
+    }
+    return html;
+  },
+  renderText({ node }) {
+    const args = {
+      options: this.options,
+      node,
+      suggestion: getSuggestionFromChar(this, node.attrs.mentionSuggestionChar)
+    };
+    if (this.options.renderLabel !== void 0) {
+      console.warn("renderLabel is deprecated use renderText and renderHTML instead");
+      return this.options.renderLabel(args);
+    }
+    return this.options.renderText(args);
+  },
+  addKeyboardShortcuts() {
+    return {
+      Backspace: () => this.editor.commands.command(({ tr: tr2, state }) => {
+        let isMention = false;
+        const { selection } = state;
+        const { empty, anchor } = selection;
+        if (!empty) {
+          return false;
+        }
+        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
+          if (node.type.name === this.name) {
+            isMention = true;
+            tr2.insertText(this.options.deleteTriggerWithBackspace ? "" : this.options.suggestion.char || "", pos, pos + node.nodeSize);
+            return false;
+          }
+        });
+        let mentionNode = new Node$1();
+        let mentionPos = 0;
+        state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {
+          if (node.type.name === this.name) {
+            isMention = true;
+            mentionNode = node;
+            mentionPos = pos;
+            return false;
+          }
+        });
+        if (isMention) {
+          tr2.insertText(this.options.deleteTriggerWithBackspace ? "" : mentionNode.attrs.mentionSuggestionChar, mentionPos, mentionPos + mentionNode.nodeSize);
+        }
+        return isMention;
+      })
+    };
+  },
+  addProseMirrorPlugins() {
+    return getSuggestions(this).map(Suggestion);
+  }
+});
+
+// src/extensions/mention.ts
+import { PluginKey as PluginKey7 } from "@tiptap/pm/state";
+var EMPTY_STATE = {
+  active: false,
+  items: [],
+  selectedIndex: 0,
+  query: "",
+  rect: null,
+  loading: false,
+  highlight: null,
+  select: null
+};
+var LoomaMentionSuggestionPluginKey = new PluginKey7(
+  "loomaMentionSuggestion"
+);
+var LoomaMentionNode = Mention.extend({
+  addAttributes() {
+    const parentAttributes = this.parent?.() ?? {};
+    const { mentionSuggestionChar: _trigger, ...durableAttributes } = parentAttributes;
+    return durableAttributes;
+  }
+});
+async function resolveMentionItems(source2, query, limit) {
+  try {
+    const resolved = typeof source2 === "function" ? await source2(query, { limit }) : source2 ?? [];
+    return filterLoomaMentionItems(resolved, query, limit);
+  } catch {
+    return [];
+  }
+}
+function createLoomaMentionExtension(options = {}) {
+  const limit = normalizeMentionResultLimit(options.limit);
+  const menuId = options.menuId ?? "ui-editor-mention-menu";
+  return LoomaMentionNode.configure({
+    HTMLAttributes: { class: "looma-mention" },
+    renderText: ({ node }) => `@${node.attrs.label ?? node.attrs.id}`,
+    renderHTML: ({ options: mentionOptions, node }) => [
+      "span",
+      mentionOptions.HTMLAttributes,
+      `@${node.attrs.label ?? node.attrs.id}`
+    ],
+    suggestion: {
+      pluginKey: LoomaMentionSuggestionPluginKey,
+      char: "@",
+      allowSpaces: false,
+      startOfLine: false,
+      items: ({ query }) => resolveMentionItems(options.items, query, limit),
+      render: () => {
+        let selectedIndex = 0;
+        let currentProps = null;
+        let dismissedFrom = null;
+        let a11yOwner = null;
+        const previousA11y = /* @__PURE__ */ new Map();
+        const restoreEditorA11y = () => {
+          if (!a11yOwner) return;
+          for (const [name, value] of previousA11y) {
+            if (value === null) a11yOwner.removeAttribute(name);
+            else a11yOwner.setAttribute(name, value);
+          }
+          previousA11y.clear();
+          a11yOwner = null;
+        };
+        const syncEditorA11y = (props) => {
+          const owner = props.editor.view.dom;
+          if (a11yOwner !== owner) {
+            restoreEditorA11y();
+            a11yOwner = owner;
+            for (const name of [
+              "aria-autocomplete",
+              "aria-controls",
+              "aria-expanded",
+              "aria-activedescendant"
+            ]) previousA11y.set(name, owner.getAttribute(name));
+          }
+          owner.setAttribute("aria-autocomplete", "list");
+          owner.setAttribute("aria-controls", menuId);
+          owner.setAttribute("aria-expanded", "true");
+          if (props.items[selectedIndex]) {
+            owner.setAttribute("aria-activedescendant", `${menuId}-option-${selectedIndex}`);
+          } else {
+            owner.removeAttribute("aria-activedescendant");
+          }
+        };
+        const isCurrent = (props) => {
+          const state = LoomaMentionSuggestionPluginKey.getState(
+            props.editor.state
+          );
+          return state?.active === true && state.query === props.query && state.range?.from === props.range.from && state.range?.to === props.range.to;
+        };
+        const publish = (props, loading = false) => {
+          if (!props) {
+            restoreEditorA11y();
+            options.onStateChange?.({ ...EMPTY_STATE });
+            return;
+          }
+          if (!isCurrent(props) || dismissedFrom === props.range.from) return;
+          if (!loading && props.items.length === 0) restoreEditorA11y();
+          else syncEditorA11y(props);
+          options.onStateChange?.({
+            active: true,
+            items: props.items,
+            selectedIndex,
+            query: props.query,
+            rect: props.clientRect?.() ?? null,
+            loading,
+            highlight: (index) => {
+              if (index >= 0 && index < props.items.length) {
+                selectedIndex = index;
+                syncEditorA11y(props);
+              }
+            },
+            select: (index) => {
+              const item = props.items[index];
+              if (item) props.command({ id: item.id, label: item.label });
+            }
+          });
+        };
+        return {
+          onBeforeStart: (props) => {
+            currentProps = props;
+            selectedIndex = 0;
+            publish(props, true);
+          },
+          onStart: (props) => {
+            if (!isCurrent(props) || dismissedFrom === props.range.from) return;
+            currentProps = props;
+            selectedIndex = 0;
+            publish(props);
+          },
+          onBeforeUpdate: (props) => {
+            if (dismissedFrom === props.range.from) return;
+            currentProps = props;
+            selectedIndex = 0;
+            publish(props, true);
+          },
+          onUpdate: (props) => {
+            if (!isCurrent(props) || dismissedFrom === props.range.from) return;
+            currentProps = props;
+            if (selectedIndex >= props.items.length) selectedIndex = 0;
+            publish(props);
+          },
+          onKeyDown: ({ event, range }) => {
+            if (event.key === "Escape") {
+              dismissedFrom = range.from;
+              currentProps = null;
+              publish(null);
+              return true;
+            }
+            if (!currentProps) return false;
+            if (event.key === "ArrowDown") {
+              if (currentProps.items.length === 0) return false;
+              selectedIndex = (selectedIndex + 1) % Math.max(1, currentProps.items.length);
+              publish(currentProps);
+              return true;
+            }
+            if (event.key === "ArrowUp") {
+              if (currentProps.items.length === 0) return false;
+              selectedIndex = (selectedIndex - 1 + currentProps.items.length) % Math.max(1, currentProps.items.length);
+              publish(currentProps);
+              return true;
+            }
+            if (event.key === "Enter") {
+              const item = currentProps.items[selectedIndex];
+              if (!item) return false;
+              currentProps.command({ id: item.id, label: item.label });
+              return true;
+            }
+            return false;
+          },
+          onExit: () => {
+            dismissedFrom = null;
+            currentProps = null;
+            publish(null);
+          }
+        };
+      }
+    }
+  });
+}
+
 // ../../node_modules/.pnpm/@tiptap+extension-table@2.27.2_@tiptap+core@2.27.2_@tiptap+pm@2.27.2__@tiptap+pm@2.27.2/node_modules/@tiptap/extension-table/dist/index.js
-import { findParentNodeClosestToPos, Node as Node16, mergeAttributes as mergeAttributes21, callOrReturn as callOrReturn2, getExtensionField as getExtensionField2 } from "@tiptap/core";
+import { findParentNodeClosestToPos, Node as Node17, mergeAttributes as mergeAttributes22, callOrReturn as callOrReturn2, getExtensionField as getExtensionField2 } from "@tiptap/core";
 import { TextSelection as TextSelection3 } from "@tiptap/pm/state";
 import { CellSelection, addColumnBefore, addColumnAfter, deleteColumn, addRowBefore, addRowAfter, deleteRow, deleteTable, mergeCells, splitCell, toggleHeader, toggleHeaderCell, setCellAttr, goToNextCell, fixTables, columnResizing, tableEditing } from "@tiptap/pm/tables";
 function getColStyleDeclaration(minWidth, width) {
@@ -5066,7 +5680,7 @@ var deleteTableWhenAllCellsSelected = ({ editor }) => {
   editor.commands.deleteTable();
   return true;
 };
-var Table = Node16.create({
+var Table = Node17.create({
   name: "table",
   // @ts-ignore
   addOptions() {
@@ -5093,7 +5707,7 @@ var Table = Node16.create({
     const { colgroup, tableWidth, tableMinWidth } = createColGroup(node, this.options.cellMinWidth);
     const table = [
       "table",
-      mergeAttributes21(this.options.HTMLAttributes, HTMLAttributes, {
+      mergeAttributes22(this.options.HTMLAttributes, HTMLAttributes, {
         style: tableWidth ? `width: ${tableWidth}` : `min-width: ${tableMinWidth}`
       }),
       colgroup,
@@ -5225,8 +5839,8 @@ var Table = Node16.create({
 });
 
 // ../../node_modules/.pnpm/@tiptap+extension-table-cell@2.27.2_@tiptap+core@2.27.2_@tiptap+pm@2.27.2_/node_modules/@tiptap/extension-table-cell/dist/index.js
-import { Node as Node17, mergeAttributes as mergeAttributes22 } from "@tiptap/core";
-var TableCell = Node17.create({
+import { Node as Node18, mergeAttributes as mergeAttributes23 } from "@tiptap/core";
+var TableCell = Node18.create({
   name: "tableCell",
   addOptions() {
     return {
@@ -5260,13 +5874,13 @@ var TableCell = Node17.create({
     ];
   },
   renderHTML({ HTMLAttributes }) {
-    return ["td", mergeAttributes22(this.options.HTMLAttributes, HTMLAttributes), 0];
+    return ["td", mergeAttributes23(this.options.HTMLAttributes, HTMLAttributes), 0];
   }
 });
 
 // ../../node_modules/.pnpm/@tiptap+extension-table-header@2.27.2_@tiptap+core@2.27.2_@tiptap+pm@2.27.2_/node_modules/@tiptap/extension-table-header/dist/index.js
-import { Node as Node18, mergeAttributes as mergeAttributes23 } from "@tiptap/core";
-var TableHeader = Node18.create({
+import { Node as Node19, mergeAttributes as mergeAttributes24 } from "@tiptap/core";
+var TableHeader = Node19.create({
   name: "tableHeader",
   addOptions() {
     return {
@@ -5300,7 +5914,7 @@ var TableHeader = Node18.create({
     ];
   },
   renderHTML({ HTMLAttributes }) {
-    return ["th", mergeAttributes23(this.options.HTMLAttributes, HTMLAttributes), 0];
+    return ["th", mergeAttributes24(this.options.HTMLAttributes, HTMLAttributes), 0];
   }
 });
 
@@ -5432,7 +6046,8 @@ function getDefaultEditorExtensions(options = {}) {
   const {
     placeholder = "Type \u201C/\u201D for commands, or start writing\u2026",
     linkOpenOnClick = false,
-    imageInline = false
+    imageInline = false,
+    mention = createLoomaMentionExtension()
   } = options;
   return [
     Document,
@@ -5467,6 +6082,7 @@ function getDefaultEditorExtensions(options = {}) {
       placeholder: ({ node }) => node.type.name === "paragraph" ? placeholder : "",
       emptyNodeClass: "is-editor-empty"
     }),
+    ...mention ? [mention] : [],
     LoomaTableKit,
     LoomaListBehavior
   ];
@@ -5783,228 +6399,6 @@ function handleTableOverlayAction(editor, detail) {
 
 // src/extensions/slash-command.ts
 import { Extension as Extension8 } from "@tiptap/core";
-
-// ../../node_modules/.pnpm/@tiptap+suggestion@2.27.2_@tiptap+core@2.27.2_@tiptap+pm@2.27.2__@tiptap+pm@2.27.2/node_modules/@tiptap/suggestion/dist/index.js
-import { PluginKey as PluginKey5, Plugin as Plugin5 } from "@tiptap/pm/state";
-import { DecorationSet as DecorationSet3, Decoration as Decoration3 } from "@tiptap/pm/view";
-import { escapeForRegEx } from "@tiptap/core";
-function findSuggestionMatch(config) {
-  var _a;
-  const { char, allowSpaces: allowSpacesOption, allowToIncludeChar, allowedPrefixes, startOfLine, $position } = config;
-  const allowSpaces = allowSpacesOption && !allowToIncludeChar;
-  const escapedChar = escapeForRegEx(char);
-  const suffix = new RegExp(`\\s${escapedChar}$`);
-  const prefix = startOfLine ? "^" : "";
-  const finalEscapedChar = allowToIncludeChar ? "" : escapedChar;
-  const regexp = allowSpaces ? new RegExp(`${prefix}${escapedChar}.*?(?=\\s${finalEscapedChar}|$)`, "gm") : new RegExp(`${prefix}(?:^)?${escapedChar}[^\\s${finalEscapedChar}]*`, "gm");
-  const text = ((_a = $position.nodeBefore) === null || _a === void 0 ? void 0 : _a.isText) && $position.nodeBefore.text;
-  if (!text) {
-    return null;
-  }
-  const textFrom = $position.pos - text.length;
-  const match = Array.from(text.matchAll(regexp)).pop();
-  if (!match || match.input === void 0 || match.index === void 0) {
-    return null;
-  }
-  const matchPrefix = match.input.slice(Math.max(0, match.index - 1), match.index);
-  const matchPrefixIsAllowed = new RegExp(`^[${allowedPrefixes === null || allowedPrefixes === void 0 ? void 0 : allowedPrefixes.join("")}\0]?$`).test(matchPrefix);
-  if (allowedPrefixes !== null && !matchPrefixIsAllowed) {
-    return null;
-  }
-  const from = textFrom + match.index;
-  let to = from + match[0].length;
-  if (allowSpaces && suffix.test(text.slice(to - 1, to + 1))) {
-    match[0] += " ";
-    to += 1;
-  }
-  if (from < $position.pos && to >= $position.pos) {
-    return {
-      range: {
-        from,
-        to
-      },
-      query: match[0].slice(char.length),
-      text: match[0]
-    };
-  }
-  return null;
-}
-var SuggestionPluginKey = new PluginKey5("suggestion");
-function Suggestion({ pluginKey = SuggestionPluginKey, editor, char = "@", allowSpaces = false, allowToIncludeChar = false, allowedPrefixes = [" "], startOfLine = false, decorationTag = "span", decorationClass = "suggestion", decorationContent = "", decorationEmptyClass = "is-empty", command = () => null, items = () => [], render = () => ({}), allow = () => true, findSuggestionMatch: findSuggestionMatch$1 = findSuggestionMatch }) {
-  let props;
-  const renderer = render === null || render === void 0 ? void 0 : render();
-  const plugin = new Plugin5({
-    key: pluginKey,
-    view() {
-      return {
-        update: async (view, prevState) => {
-          var _a, _b, _c, _d, _e, _f, _g;
-          const prev = (_a = this.key) === null || _a === void 0 ? void 0 : _a.getState(prevState);
-          const next = (_b = this.key) === null || _b === void 0 ? void 0 : _b.getState(view.state);
-          const moved = prev.active && next.active && prev.range.from !== next.range.from;
-          const started = !prev.active && next.active;
-          const stopped = prev.active && !next.active;
-          const changed = !started && !stopped && prev.query !== next.query;
-          const handleStart = started || moved && changed;
-          const handleChange = changed || moved;
-          const handleExit = stopped || moved && changed;
-          if (!handleStart && !handleChange && !handleExit) {
-            return;
-          }
-          const state = handleExit && !handleStart ? prev : next;
-          const decorationNode = view.dom.querySelector(`[data-decoration-id="${state.decorationId}"]`);
-          props = {
-            editor,
-            range: state.range,
-            query: state.query,
-            text: state.text,
-            items: [],
-            command: (commandProps) => {
-              return command({
-                editor,
-                range: state.range,
-                props: commandProps
-              });
-            },
-            decorationNode,
-            // virtual node for popper.js or tippy.js
-            // this can be used for building popups without a DOM node
-            clientRect: decorationNode ? () => {
-              var _a2;
-              const { decorationId } = (_a2 = this.key) === null || _a2 === void 0 ? void 0 : _a2.getState(editor.state);
-              const currentDecorationNode = view.dom.querySelector(`[data-decoration-id="${decorationId}"]`);
-              return (currentDecorationNode === null || currentDecorationNode === void 0 ? void 0 : currentDecorationNode.getBoundingClientRect()) || null;
-            } : null
-          };
-          if (handleStart) {
-            (_c = renderer === null || renderer === void 0 ? void 0 : renderer.onBeforeStart) === null || _c === void 0 ? void 0 : _c.call(renderer, props);
-          }
-          if (handleChange) {
-            (_d = renderer === null || renderer === void 0 ? void 0 : renderer.onBeforeUpdate) === null || _d === void 0 ? void 0 : _d.call(renderer, props);
-          }
-          if (handleChange || handleStart) {
-            props.items = await items({
-              editor,
-              query: state.query
-            });
-          }
-          if (handleExit) {
-            (_e = renderer === null || renderer === void 0 ? void 0 : renderer.onExit) === null || _e === void 0 ? void 0 : _e.call(renderer, props);
-          }
-          if (handleChange) {
-            (_f = renderer === null || renderer === void 0 ? void 0 : renderer.onUpdate) === null || _f === void 0 ? void 0 : _f.call(renderer, props);
-          }
-          if (handleStart) {
-            (_g = renderer === null || renderer === void 0 ? void 0 : renderer.onStart) === null || _g === void 0 ? void 0 : _g.call(renderer, props);
-          }
-        },
-        destroy: () => {
-          var _a;
-          if (!props) {
-            return;
-          }
-          (_a = renderer === null || renderer === void 0 ? void 0 : renderer.onExit) === null || _a === void 0 ? void 0 : _a.call(renderer, props);
-        }
-      };
-    },
-    state: {
-      // Initialize the plugin's internal state.
-      init() {
-        const state = {
-          active: false,
-          range: {
-            from: 0,
-            to: 0
-          },
-          query: null,
-          text: null,
-          composing: false
-        };
-        return state;
-      },
-      // Apply changes to the plugin state from a view transaction.
-      apply(transaction, prev, _oldState, state) {
-        const { isEditable } = editor;
-        const { composing } = editor.view;
-        const { selection } = transaction;
-        const { empty, from } = selection;
-        const next = { ...prev };
-        next.composing = composing;
-        if (isEditable && (empty || editor.view.composing)) {
-          if ((from < prev.range.from || from > prev.range.to) && !composing && !prev.composing) {
-            next.active = false;
-          }
-          const match = findSuggestionMatch$1({
-            char,
-            allowSpaces,
-            allowToIncludeChar,
-            allowedPrefixes,
-            startOfLine,
-            $position: selection.$from
-          });
-          const decorationId = `id_${Math.floor(Math.random() * 4294967295)}`;
-          if (match && allow({
-            editor,
-            state,
-            range: match.range,
-            isActive: prev.active
-          })) {
-            next.active = true;
-            next.decorationId = prev.decorationId ? prev.decorationId : decorationId;
-            next.range = match.range;
-            next.query = match.query;
-            next.text = match.text;
-          } else {
-            next.active = false;
-          }
-        } else {
-          next.active = false;
-        }
-        if (!next.active) {
-          next.decorationId = null;
-          next.range = { from: 0, to: 0 };
-          next.query = null;
-          next.text = null;
-        }
-        return next;
-      }
-    },
-    props: {
-      // Call the keydown hook if suggestion is active.
-      handleKeyDown(view, event) {
-        var _a;
-        const { active, range } = plugin.getState(view.state);
-        if (!active) {
-          return false;
-        }
-        return ((_a = renderer === null || renderer === void 0 ? void 0 : renderer.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(renderer, { view, event, range })) || false;
-      },
-      // Setup decorator on the currently active suggestion.
-      decorations(state) {
-        const { active, range, decorationId, query } = plugin.getState(state);
-        if (!active) {
-          return null;
-        }
-        const isEmpty = !(query === null || query === void 0 ? void 0 : query.length);
-        const classNames = [decorationClass];
-        if (isEmpty) {
-          classNames.push(decorationEmptyClass);
-        }
-        return DecorationSet3.create(state.doc, [
-          Decoration3.inline(range.from, range.to, {
-            nodeName: decorationTag,
-            class: classNames.join(" "),
-            "data-decoration-id": decorationId,
-            "data-decoration-content": decorationContent
-          })
-        ]);
-      }
-    }
-  });
-  return plugin;
-}
-
-// src/extensions/slash-command.ts
 function getDefaultSlashCommands(onOpenImagePicker) {
   return [
     {
@@ -6109,7 +6503,7 @@ function getDefaultSlashCommands(onOpenImagePicker) {
     }
   ];
 }
-var EMPTY_STATE = {
+var EMPTY_STATE2 = {
   active: false,
   items: [],
   selectedIndex: 0,
@@ -6129,7 +6523,7 @@ var LoomaSlashCommand = Extension8.create({
     let currentProps = null;
     const publish = (props) => {
       if (!props) {
-        this.options.onStateChange?.({ ...EMPTY_STATE });
+        this.options.onStateChange?.({ ...EMPTY_STATE2 });
         return;
       }
       this.options.onStateChange?.({
@@ -6214,6 +6608,8 @@ function createLoomaSlashCommandExtension(options = {}) {
 }
 
 export {
+  LoomaMentionSuggestionPluginKey,
+  createLoomaMentionExtension,
   LoomaTable,
   LoomaTableHeader,
   LoomaTableCell,