@liveblocks/react-tiptap 2.18.2 → 2.18.4-uns1

package/dist/mentions/MentionExtension.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionExtension.js","sources":["../../src/mentions/MentionExtension.ts"],"sourcesContent":["import { createInboxNotificationId } from \"@liveblocks/core\";\nimport {\n  combineTransactionSteps,\n  Extension,\n  getChangedRanges,\n} from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Slice } from \"@tiptap/pm/model\";\nimport { Plugin } from \"@tiptap/pm/state\";\nimport { ReactRenderer } from \"@tiptap/react\";\nimport Suggestion from \"@tiptap/suggestion\";\nimport { ySyncPluginKey } from \"y-prosemirror\";\n\nimport {\n  LIVEBLOCKS_MENTION_EXTENSION,\n  LIVEBLOCKS_MENTION_KEY,\n  LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n  LIVEBLOCKS_MENTION_PASTE_KEY,\n  LIVEBLOCKS_MENTION_TYPE,\n} from \"../types\";\nimport { getMentionsFromNode, mapFragment } from \"../utils\";\nimport { MentionNode } from \"./MentionNode\";\nimport type { MentionsListHandle, MentionsListProps } from \"./MentionsList\";\nimport { MentionsList } from \"./MentionsList\";\n\n/**\n *\n * Handles creating new notificationIds when notifications are pasted\n *\n * @returns Plugin\n */\nconst mentionPasteHandler = (): Plugin => {\n  return new Plugin({\n    key: LIVEBLOCKS_MENTION_PASTE_KEY,\n    props: {\n      transformPasted: (slice) => {\n        const getNewNotificationIds = (node: ProseMirrorNode) => {\n          // If this is a mention node, we need to get a new notificatio id\n          if (node.type.name === LIVEBLOCKS_MENTION_TYPE) {\n            return node.type.create(\n              { ...node.attrs, notificationId: createInboxNotificationId() },\n              node.content\n            );\n          }\n          return node.copy(node.content);\n        };\n        const fragment = mapFragment(slice.content, getNewNotificationIds);\n        return new Slice(fragment, slice.openStart, slice.openEnd);\n      },\n    },\n  });\n};\n\nexport type MentionExtensionOptions = {\n  onCreateMention: (userId: string, notificationId: string) => void;\n  onDeleteMention: (notificationId: string) => void;\n};\n/**\n *\n * The purpose of this plugin is to create inbox notifications when a mention is\n *\n * @returns Plugin (from @tiptap/core)\n */\nconst notifier = ({\n  onCreateMention,\n  onDeleteMention,\n}: MentionExtensionOptions): Plugin => {\n  return new Plugin({\n    key: LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n    appendTransaction: (transactions, oldState, newState) => {\n      const docChanges =\n        transactions.some((transaction) => transaction.docChanged) &&\n        !oldState.doc.eq(newState.doc);\n      // don't run if there was no change\n      if (!docChanges) {\n        return;\n      }\n      // don't run if from collab\n      if (\n        transactions.some((transaction) => transaction.getMeta(ySyncPluginKey))\n      ) {\n        return;\n      }\n      const transform = combineTransactionSteps(oldState.doc, [\n        ...transactions,\n      ]);\n      const changes = getChangedRanges(transform);\n\n      changes.forEach(({ newRange, oldRange }) => {\n        const newMentions = getMentionsFromNode(newState.doc, newRange);\n        const oldMentions = getMentionsFromNode(oldState.doc, oldRange);\n        if (oldMentions.length || newMentions.length) {\n          // create new mentions\n          newMentions.forEach((mention) => {\n            if (!oldMentions.includes(mention)) {\n              onCreateMention(mention.userId, mention.notificationId);\n            }\n          });\n          // delete old mentions\n          oldMentions.forEach((mention) => {\n            if (!newMentions.includes(mention)) {\n              onDeleteMention(mention.notificationId);\n            }\n          });\n        }\n      });\n\n      return undefined;\n    },\n  });\n};\n\nexport const MentionExtension = Extension.create<MentionExtensionOptions>({\n  name: LIVEBLOCKS_MENTION_EXTENSION,\n\n  priority: 101,\n  addOptions() {\n    return {\n      onCreateMention: () => {},\n      onDeleteMention: () => {},\n    };\n  },\n\n  addExtensions() {\n    return [MentionNode];\n  },\n\n  addProseMirrorPlugins() {\n    return [\n      Suggestion({\n        editor: this.editor,\n        char: \"@\",\n        pluginKey: LIVEBLOCKS_MENTION_KEY,\n        command: ({ editor, range, props }) => {\n          // increase range.to by one when the next node is of type \"text\"\n          // and starts with a space character\n          const nodeAfter = editor.view.state.selection.$to.nodeAfter;\n          const overrideSpace = nodeAfter?.text?.startsWith(\" \");\n\n          if (overrideSpace) {\n            range.to += 1;\n          }\n\n          editor\n            .chain()\n            .focus()\n            .insertContentAt(range, [\n              {\n                type: LIVEBLOCKS_MENTION_TYPE,\n                attrs: props as Record<string, string>,\n              },\n              {\n                type: \"text\",\n                text: \" \",\n              },\n            ])\n            .run();\n\n          // get reference to `window` object from editor element, to support cross-frame JS usage\n          editor.view.dom.ownerDocument.defaultView\n            ?.getSelection()\n            ?.collapseToEnd();\n        },\n        allow: ({ state, range }) => {\n          const $from = state.doc.resolve(range.from);\n          const type = state.schema.nodes[LIVEBLOCKS_MENTION_TYPE];\n          const allow = !!$from.parent.type.contentMatch.matchType(type);\n\n          return allow;\n        },\n        allowSpaces: true,\n        items: () => [], // we'll let the mentions list component do this\n        render: () => {\n          let component: ReactRenderer<MentionsListHandle, MentionsListProps>;\n          return {\n            onStart: (props) => {\n              component = new ReactRenderer<\n                MentionsListHandle,\n                MentionsListProps\n              >(MentionsList, {\n                props,\n                editor: props.editor,\n              });\n\n              if (!props.clientRect) {\n                return;\n              }\n\n              document.body.appendChild(component.element);\n            },\n\n            onUpdate(props) {\n              component.updateProps(props);\n            },\n\n            onKeyDown(props) {\n              if (props.event.key === \"Escape\") {\n                component.updateProps({\n                  ...props,\n                  hide: true,\n                });\n                return true;\n              }\n              return component.ref?.onKeyDown(props) ?? false;\n            },\n\n            onExit() {\n              document.body.removeChild(component.element);\n              component.destroy();\n            },\n          };\n        },\n      }),\n      notifier(this.options),\n      mentionPasteHandler(),\n    ];\n  },\n});\n"],"names":["Plugin","LIVEBLOCKS_MENTION_PASTE_KEY","LIVEBLOCKS_MENTION_TYPE","createInboxNotificationId","mapFragment","Slice","LIVEBLOCKS_MENTION_NOTIFIER_KEY","ySyncPluginKey","combineTransactionSteps","getChangedRanges","getMentionsFromNode","Extension","LIVEBLOCKS_MENTION_EXTENSION","MentionNode","LIVEBLOCKS_MENTION_KEY","ReactRenderer","MentionsList"],"mappings":"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"}
+{"version":3,"file":"MentionExtension.js","sources":["../../src/mentions/MentionExtension.ts"],"sourcesContent":["import { createInboxNotificationId } from \"@liveblocks/core\";\nimport {\n  combineTransactionSteps,\n  Extension,\n  getChangedRanges,\n} from \"@tiptap/core\";\nimport type { Node as ProseMirrorNode } from \"@tiptap/pm/model\";\nimport { Slice } from \"@tiptap/pm/model\";\nimport { Plugin } from \"@tiptap/pm/state\";\nimport { ReactRenderer } from \"@tiptap/react\";\nimport Suggestion from \"@tiptap/suggestion\";\nimport { ySyncPluginKey } from \"y-prosemirror\";\n\nimport {\n  LIVEBLOCKS_MENTION_EXTENSION,\n  LIVEBLOCKS_MENTION_KEY,\n  LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n  LIVEBLOCKS_MENTION_PASTE_KEY,\n  LIVEBLOCKS_MENTION_TYPE,\n} from \"../types\";\nimport { getMentionsFromNode, mapFragment } from \"../utils\";\nimport { MentionNode } from \"./MentionNode\";\nimport type { MentionsListHandle, MentionsListProps } from \"./MentionsList\";\nimport { MentionsList } from \"./MentionsList\";\n\n/**\n *\n * Handles creating new notificationIds when notifications are pasted\n *\n * @returns Plugin\n */\nconst mentionPasteHandler = (): Plugin => {\n  return new Plugin({\n    key: LIVEBLOCKS_MENTION_PASTE_KEY,\n    props: {\n      transformPasted: (slice) => {\n        const getNewNotificationIds = (node: ProseMirrorNode) => {\n          // If this is a mention node, we need to get a new notificatio id\n          if (node.type.name === LIVEBLOCKS_MENTION_TYPE) {\n            return node.type.create(\n              { ...node.attrs, notificationId: createInboxNotificationId() },\n              node.content\n            );\n          }\n          return node.copy(node.content);\n        };\n        const fragment = mapFragment(slice.content, getNewNotificationIds);\n        return new Slice(fragment, slice.openStart, slice.openEnd);\n      },\n    },\n  });\n};\n\nexport type MentionExtensionOptions = {\n  onCreateMention: (userId: string, notificationId: string) => void;\n  onDeleteMention: (notificationId: string) => void;\n};\n/**\n *\n * The purpose of this plugin is to create inbox notifications when a mention is\n *\n * @returns Plugin (from @tiptap/core)\n */\nconst notifier = ({\n  onCreateMention,\n  onDeleteMention,\n}: MentionExtensionOptions): Plugin => {\n  return new Plugin({\n    key: LIVEBLOCKS_MENTION_NOTIFIER_KEY,\n    appendTransaction: (transactions, oldState, newState) => {\n      const docChanges =\n        transactions.some((transaction) => transaction.docChanged) &&\n        !oldState.doc.eq(newState.doc);\n      // don't run if there was no change\n      if (!docChanges) {\n        return;\n      }\n      // don't run if from collab\n      if (\n        transactions.some((transaction) => transaction.getMeta(ySyncPluginKey))\n      ) {\n        return;\n      }\n      const transform = combineTransactionSteps(oldState.doc, [\n        ...transactions,\n      ]);\n      const changes = getChangedRanges(transform);\n\n      changes.forEach(({ newRange, oldRange }) => {\n        const newMentions = getMentionsFromNode(newState.doc, newRange);\n        const oldMentions = getMentionsFromNode(oldState.doc, oldRange);\n        if (oldMentions.length || newMentions.length) {\n          // create new mentions\n          newMentions.forEach((mention) => {\n            if (!oldMentions.includes(mention)) {\n              onCreateMention(mention.userId, mention.notificationId);\n            }\n          });\n          // delete old mentions\n          oldMentions.forEach((mention) => {\n            if (!newMentions.includes(mention)) {\n              onDeleteMention(mention.notificationId);\n            }\n          });\n        }\n      });\n\n      return undefined;\n    },\n  });\n};\n\nexport const MentionExtension = Extension.create<MentionExtensionOptions>({\n  name: LIVEBLOCKS_MENTION_EXTENSION,\n\n  priority: 101,\n  addOptions() {\n    return {\n      onCreateMention: () => {},\n      onDeleteMention: () => {},\n    };\n  },\n\n  addExtensions() {\n    return [MentionNode];\n  },\n\n  addProseMirrorPlugins() {\n    return [\n      Suggestion({\n        editor: this.editor,\n        char: \"@\",\n        pluginKey: LIVEBLOCKS_MENTION_KEY,\n        command: ({ editor, range, props }) => {\n          // increase range.to by one when the next node is of type \"text\"\n          // and starts with a space character\n          const nodeAfter = editor.view.state.selection.$to.nodeAfter;\n          const overrideSpace = nodeAfter?.text?.startsWith(\" \");\n\n          if (overrideSpace) {\n            range.to += 1;\n          }\n\n          editor\n            .chain()\n            .focus()\n            .insertContentAt(range, [\n              {\n                type: LIVEBLOCKS_MENTION_TYPE,\n                attrs: props as Record<string, string>,\n              },\n              {\n                type: \"text\",\n                text: \" \",\n              },\n            ])\n            .run();\n\n          // get reference to `window` object from editor element, to support cross-frame JS usage\n          editor.view.dom.ownerDocument.defaultView\n            ?.getSelection()\n            ?.collapseToEnd();\n        },\n        allow: ({ state, range }) => {\n          const $from = state.doc.resolve(range.from);\n          const type = state.schema.nodes[LIVEBLOCKS_MENTION_TYPE];\n          const allow = !!$from.parent.type.contentMatch.matchType(type);\n\n          return allow;\n        },\n        allowSpaces: true,\n        items: () => [], // we'll let the mentions list component do this\n        render: () => {\n          let component: ReactRenderer<MentionsListHandle, MentionsListProps>;\n          return {\n            onStart: (props) => {\n              component = new ReactRenderer<\n                MentionsListHandle,\n                MentionsListProps\n              >(MentionsList, {\n                props,\n                editor: props.editor,\n              });\n\n              if (!props.clientRect) {\n                return;\n              }\n\n              document.body.appendChild(component.element);\n            },\n\n            onUpdate(props) {\n              component.updateProps(props);\n            },\n\n            onKeyDown(props) {\n              if (props.event.key === \"Escape\") {\n                component.updateProps({\n                  ...props,\n                  hide: true,\n                });\n                return true;\n              }\n              return component.ref?.onKeyDown(props) ?? false;\n            },\n\n            onExit() {\n              document.body.removeChild(component.element);\n              component.destroy();\n            },\n          };\n        },\n      }),\n      notifier(this.options),\n      mentionPasteHandler(),\n    ];\n  },\n});\n"],"names":[],"mappings":"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"}

package/dist/mentions/{MentionNode.mjs → MentionNode.cjs}

@@ -1,10 +1,12 @@
-import { Node, mergeAttributes } from '@tiptap/core';
-import { ReactNodeViewRenderer } from '@tiptap/react';
-import { LIVEBLOCKS_MENTION_TYPE } from '../types.mjs';
-import { Mention } from './Mention.mjs';
+'use strict';
 
-const MentionNode = Node.create({
-  name: LIVEBLOCKS_MENTION_TYPE,
+var core = require('@tiptap/core');
+var react = require('@tiptap/react');
+var types = require('../types.cjs');
+var Mention = require('./Mention.cjs');
+
+const MentionNode = core.Node.create({
+  name: types.LIVEBLOCKS_MENTION_TYPE,
   group: "inline",
   inline: true,
   selectable: true,
@@ -18,10 +20,10 @@ const MentionNode = Node.create({
     ];
   },
   renderHTML({ HTMLAttributes }) {
-    return ["liveblocks-mention", mergeAttributes(HTMLAttributes)];
+    return ["liveblocks-mention", core.mergeAttributes(HTMLAttributes)];
   },
   addNodeView() {
-    return ReactNodeViewRenderer(Mention, {
+    return react.ReactNodeViewRenderer(Mention.Mention, {
       contentDOMElementTag: "span"
     });
   },
@@ -74,5 +76,5 @@ const MentionNode = Node.create({
   }
 });
 
-export { MentionNode };
-//# sourceMappingURL=MentionNode.mjs.map
+exports.MentionNode = MentionNode;
+//# sourceMappingURL=MentionNode.cjs.map

package/dist/mentions/{MentionNode.mjs.map → MentionNode.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"MentionNode.mjs","sources":["../../src/mentions/MentionNode.ts"],"sourcesContent":["import { mergeAttributes, Node } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"../types\";\nimport { Mention } from \"./Mention\";\n\nexport const MentionNode = Node.create<never, never>({\n  name: LIVEBLOCKS_MENTION_TYPE,\n  group: \"inline\",\n  inline: true,\n  selectable: true,\n  atom: true,\n\n  priority: 101,\n  parseHTML() {\n    return [\n      {\n        tag: \"liveblocks-mention\",\n      },\n    ];\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(Mention, {\n      contentDOMElementTag: \"span\",\n    });\n  },\n\n  addAttributes() {\n    return {\n      id: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.id) {\n            return {};\n          }\n\n          return {\n            \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n      notificationId: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.notificationId) {\n            return {};\n          }\n\n          return {\n            \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n    };\n  },\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        this.editor.commands.command(({ tr, state }) => {\n          let isMention = false;\n          const { selection } = state;\n          const { empty, anchor } = selection;\n\n          if (!empty) {\n            return false;\n          }\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true;\n              tr.insertText(\"\", pos, pos + node.nodeSize);\n            }\n          });\n\n          return isMention;\n        }),\n    };\n  },\n});\n"],"names":[],"mappings":";;;;;AAMa,MAAA,WAAA,GAAc,KAAK,MAAqB,CAAA;AAAA,EACnD,IAAM,EAAA,uBAAA;AAAA,EACN,KAAO,EAAA,QAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,UAAY,EAAA,IAAA;AAAA,EACZ,IAAM,EAAA,IAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,SAAY,GAAA;AACV,IAAO,OAAA;AAAA,MACL;AAAA,QACE,GAAK,EAAA,oBAAA;AAAA,OACP;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EAEA,UAAA,CAAW,EAAE,cAAA,EAAkB,EAAA;AAC7B,IAAA,OAAO,CAAC,oBAAA,EAAsB,eAAgB,CAAA,cAAc,CAAC,CAAA,CAAA;AAAA,GAC/D;AAAA,EAEA,WAAc,GAAA;AACZ,IAAA,OAAO,sBAAsB,OAAS,EAAA;AAAA,MACpC,oBAAsB,EAAA,MAAA;AAAA,KACvB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,aAAgB,GAAA;AACd,IAAO,OAAA;AAAA,MACL,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,SAAS,CAAA;AAAA,QACtD,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,EAAI,EAAA;AAClB,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,WAAW,UAAW,CAAA,EAAA;AAAA,WACxB,CAAA;AAAA,SACF;AAAA,OACF;AAAA,MACA,cAAgB,EAAA;AAAA,QACd,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,sBAAsB,CAAA;AAAA,QACnE,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,cAAgB,EAAA;AAC9B,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,wBAAwB,UAAW,CAAA,cAAA;AAAA,WACrC,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EACA,oBAAuB,GAAA;AACrB,IAAO,OAAA;AAAA,MACL,SAAA,EAAW,MACT,IAAA,CAAK,MAAO,CAAA,QAAA,CAAS,QAAQ,CAAC,EAAE,EAAI,EAAA,KAAA,EAAY,KAAA;AAC9C,QAAA,IAAI,SAAY,GAAA,KAAA,CAAA;AAChB,QAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AACtB,QAAM,MAAA,EAAE,KAAO,EAAA,MAAA,EAAW,GAAA,SAAA,CAAA;AAE1B,QAAA,IAAI,CAAC,KAAO,EAAA;AACV,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAEA,QAAA,KAAA,CAAM,IAAI,YAAa,CAAA,MAAA,GAAS,GAAG,MAAQ,EAAA,CAAC,MAAM,GAAQ,KAAA;AACxD,UAAA,IAAI,IAAK,CAAA,IAAA,CAAK,IAAS,KAAA,IAAA,CAAK,IAAM,EAAA;AAChC,YAAY,SAAA,GAAA,IAAA,CAAA;AACZ,YAAA,EAAA,CAAG,UAAW,CAAA,EAAA,EAAI,GAAK,EAAA,GAAA,GAAM,KAAK,QAAQ,CAAA,CAAA;AAAA,WAC5C;AAAA,SACD,CAAA,CAAA;AAED,QAAO,OAAA,SAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACL,CAAA;AAAA,GACF;AACF,CAAC;;;;"}
+{"version":3,"file":"MentionNode.cjs","sources":["../../src/mentions/MentionNode.ts"],"sourcesContent":["import { mergeAttributes, Node } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"../types\";\nimport { Mention } from \"./Mention\";\n\nexport const MentionNode = Node.create<never, never>({\n  name: LIVEBLOCKS_MENTION_TYPE,\n  group: \"inline\",\n  inline: true,\n  selectable: true,\n  atom: true,\n\n  priority: 101,\n  parseHTML() {\n    return [\n      {\n        tag: \"liveblocks-mention\",\n      },\n    ];\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(Mention, {\n      contentDOMElementTag: \"span\",\n    });\n  },\n\n  addAttributes() {\n    return {\n      id: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.id) {\n            return {};\n          }\n\n          return {\n            \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n      notificationId: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.notificationId) {\n            return {};\n          }\n\n          return {\n            \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n    };\n  },\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        this.editor.commands.command(({ tr, state }) => {\n          let isMention = false;\n          const { selection } = state;\n          const { empty, anchor } = selection;\n\n          if (!empty) {\n            return false;\n          }\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true;\n              tr.insertText(\"\", pos, pos + node.nodeSize);\n            }\n          });\n\n          return isMention;\n        }),\n    };\n  },\n});\n"],"names":["Node","LIVEBLOCKS_MENTION_TYPE","mergeAttributes","ReactNodeViewRenderer","Mention"],"mappings":";;;;;;;AAMa,MAAA,WAAA,GAAcA,UAAK,MAAqB,CAAA;AAAA,EACnD,IAAM,EAAAC,6BAAA;AAAA,EACN,KAAO,EAAA,QAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,UAAY,EAAA,IAAA;AAAA,EACZ,IAAM,EAAA,IAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,SAAY,GAAA;AACV,IAAO,OAAA;AAAA,MACL;AAAA,QACE,GAAK,EAAA,oBAAA;AAAA,OACP;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EAEA,UAAA,CAAW,EAAE,cAAA,EAAkB,EAAA;AAC7B,IAAA,OAAO,CAAC,oBAAA,EAAsBC,oBAAgB,CAAA,cAAc,CAAC,CAAA,CAAA;AAAA,GAC/D;AAAA,EAEA,WAAc,GAAA;AACZ,IAAA,OAAOC,4BAAsBC,eAAS,EAAA;AAAA,MACpC,oBAAsB,EAAA,MAAA;AAAA,KACvB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,aAAgB,GAAA;AACd,IAAO,OAAA;AAAA,MACL,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,SAAS,CAAA;AAAA,QACtD,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,EAAI,EAAA;AAClB,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,WAAW,UAAW,CAAA,EAAA;AAAA,WACxB,CAAA;AAAA,SACF;AAAA,OACF;AAAA,MACA,cAAgB,EAAA;AAAA,QACd,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,sBAAsB,CAAA;AAAA,QACnE,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,cAAgB,EAAA;AAC9B,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,wBAAwB,UAAW,CAAA,cAAA;AAAA,WACrC,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EACA,oBAAuB,GAAA;AACrB,IAAO,OAAA;AAAA,MACL,SAAA,EAAW,MACT,IAAA,CAAK,MAAO,CAAA,QAAA,CAAS,QAAQ,CAAC,EAAE,EAAI,EAAA,KAAA,EAAY,KAAA;AAC9C,QAAA,IAAI,SAAY,GAAA,KAAA,CAAA;AAChB,QAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AACtB,QAAM,MAAA,EAAE,KAAO,EAAA,MAAA,EAAW,GAAA,SAAA,CAAA;AAE1B,QAAA,IAAI,CAAC,KAAO,EAAA;AACV,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAEA,QAAA,KAAA,CAAM,IAAI,YAAa,CAAA,MAAA,GAAS,GAAG,MAAQ,EAAA,CAAC,MAAM,GAAQ,KAAA;AACxD,UAAA,IAAI,IAAK,CAAA,IAAA,CAAK,IAAS,KAAA,IAAA,CAAK,IAAM,EAAA;AAChC,YAAY,SAAA,GAAA,IAAA,CAAA;AACZ,YAAA,EAAA,CAAG,UAAW,CAAA,EAAA,EAAI,GAAK,EAAA,GAAA,GAAM,KAAK,QAAQ,CAAA,CAAA;AAAA,WAC5C;AAAA,SACD,CAAA,CAAA;AAED,QAAO,OAAA,SAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACL,CAAA;AAAA,GACF;AACF,CAAC;;;;"}

package/dist/mentions/MentionNode.js

@@ -1,12 +1,10 @@
-'use strict';
+import { Node, mergeAttributes } from '@tiptap/core';
+import { ReactNodeViewRenderer } from '@tiptap/react';
+import { LIVEBLOCKS_MENTION_TYPE } from '../types.js';
+import { Mention } from './Mention.js';
 
-var core = require('@tiptap/core');
-var react = require('@tiptap/react');
-var types = require('../types.js');
-var Mention = require('./Mention.js');
-
-const MentionNode = core.Node.create({
-  name: types.LIVEBLOCKS_MENTION_TYPE,
+const MentionNode = Node.create({
+  name: LIVEBLOCKS_MENTION_TYPE,
   group: "inline",
   inline: true,
   selectable: true,
@@ -20,10 +18,10 @@ const MentionNode = core.Node.create({
     ];
   },
   renderHTML({ HTMLAttributes }) {
-    return ["liveblocks-mention", core.mergeAttributes(HTMLAttributes)];
+    return ["liveblocks-mention", mergeAttributes(HTMLAttributes)];
   },
   addNodeView() {
-    return react.ReactNodeViewRenderer(Mention.Mention, {
+    return ReactNodeViewRenderer(Mention, {
       contentDOMElementTag: "span"
     });
   },
@@ -76,5 +74,5 @@ const MentionNode = core.Node.create({
   }
 });
 
-exports.MentionNode = MentionNode;
+export { MentionNode };
 //# sourceMappingURL=MentionNode.js.map

package/dist/mentions/MentionNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionNode.js","sources":["../../src/mentions/MentionNode.ts"],"sourcesContent":["import { mergeAttributes, Node } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"../types\";\nimport { Mention } from \"./Mention\";\n\nexport const MentionNode = Node.create<never, never>({\n  name: LIVEBLOCKS_MENTION_TYPE,\n  group: \"inline\",\n  inline: true,\n  selectable: true,\n  atom: true,\n\n  priority: 101,\n  parseHTML() {\n    return [\n      {\n        tag: \"liveblocks-mention\",\n      },\n    ];\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(Mention, {\n      contentDOMElementTag: \"span\",\n    });\n  },\n\n  addAttributes() {\n    return {\n      id: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.id) {\n            return {};\n          }\n\n          return {\n            \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n      notificationId: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.notificationId) {\n            return {};\n          }\n\n          return {\n            \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n    };\n  },\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        this.editor.commands.command(({ tr, state }) => {\n          let isMention = false;\n          const { selection } = state;\n          const { empty, anchor } = selection;\n\n          if (!empty) {\n            return false;\n          }\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true;\n              tr.insertText(\"\", pos, pos + node.nodeSize);\n            }\n          });\n\n          return isMention;\n        }),\n    };\n  },\n});\n"],"names":["Node","LIVEBLOCKS_MENTION_TYPE","mergeAttributes","ReactNodeViewRenderer","Mention"],"mappings":";;;;;;;AAMa,MAAA,WAAA,GAAcA,UAAK,MAAqB,CAAA;AAAA,EACnD,IAAM,EAAAC,6BAAA;AAAA,EACN,KAAO,EAAA,QAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,UAAY,EAAA,IAAA;AAAA,EACZ,IAAM,EAAA,IAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,SAAY,GAAA;AACV,IAAO,OAAA;AAAA,MACL;AAAA,QACE,GAAK,EAAA,oBAAA;AAAA,OACP;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EAEA,UAAA,CAAW,EAAE,cAAA,EAAkB,EAAA;AAC7B,IAAA,OAAO,CAAC,oBAAA,EAAsBC,oBAAgB,CAAA,cAAc,CAAC,CAAA,CAAA;AAAA,GAC/D;AAAA,EAEA,WAAc,GAAA;AACZ,IAAA,OAAOC,4BAAsBC,eAAS,EAAA;AAAA,MACpC,oBAAsB,EAAA,MAAA;AAAA,KACvB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,aAAgB,GAAA;AACd,IAAO,OAAA;AAAA,MACL,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,SAAS,CAAA;AAAA,QACtD,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,EAAI,EAAA;AAClB,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,WAAW,UAAW,CAAA,EAAA;AAAA,WACxB,CAAA;AAAA,SACF;AAAA,OACF;AAAA,MACA,cAAgB,EAAA;AAAA,QACd,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,sBAAsB,CAAA;AAAA,QACnE,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,cAAgB,EAAA;AAC9B,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,wBAAwB,UAAW,CAAA,cAAA;AAAA,WACrC,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EACA,oBAAuB,GAAA;AACrB,IAAO,OAAA;AAAA,MACL,SAAA,EAAW,MACT,IAAA,CAAK,MAAO,CAAA,QAAA,CAAS,QAAQ,CAAC,EAAE,EAAI,EAAA,KAAA,EAAY,KAAA;AAC9C,QAAA,IAAI,SAAY,GAAA,KAAA,CAAA;AAChB,QAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AACtB,QAAM,MAAA,EAAE,KAAO,EAAA,MAAA,EAAW,GAAA,SAAA,CAAA;AAE1B,QAAA,IAAI,CAAC,KAAO,EAAA;AACV,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAEA,QAAA,KAAA,CAAM,IAAI,YAAa,CAAA,MAAA,GAAS,GAAG,MAAQ,EAAA,CAAC,MAAM,GAAQ,KAAA;AACxD,UAAA,IAAI,IAAK,CAAA,IAAA,CAAK,IAAS,KAAA,IAAA,CAAK,IAAM,EAAA;AAChC,YAAY,SAAA,GAAA,IAAA,CAAA;AACZ,YAAA,EAAA,CAAG,UAAW,CAAA,EAAA,EAAI,GAAK,EAAA,GAAA,GAAM,KAAK,QAAQ,CAAA,CAAA;AAAA,WAC5C;AAAA,SACD,CAAA,CAAA;AAED,QAAO,OAAA,SAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACL,CAAA;AAAA,GACF;AACF,CAAC;;;;"}
+{"version":3,"file":"MentionNode.js","sources":["../../src/mentions/MentionNode.ts"],"sourcesContent":["import { mergeAttributes, Node } from \"@tiptap/core\";\nimport { ReactNodeViewRenderer } from \"@tiptap/react\";\n\nimport { LIVEBLOCKS_MENTION_TYPE } from \"../types\";\nimport { Mention } from \"./Mention\";\n\nexport const MentionNode = Node.create<never, never>({\n  name: LIVEBLOCKS_MENTION_TYPE,\n  group: \"inline\",\n  inline: true,\n  selectable: true,\n  atom: true,\n\n  priority: 101,\n  parseHTML() {\n    return [\n      {\n        tag: \"liveblocks-mention\",\n      },\n    ];\n  },\n\n  renderHTML({ HTMLAttributes }) {\n    return [\"liveblocks-mention\", mergeAttributes(HTMLAttributes)];\n  },\n\n  addNodeView() {\n    return ReactNodeViewRenderer(Mention, {\n      contentDOMElementTag: \"span\",\n    });\n  },\n\n  addAttributes() {\n    return {\n      id: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.id) {\n            return {};\n          }\n\n          return {\n            \"data-id\": attributes.id as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n      notificationId: {\n        default: null,\n        parseHTML: (element) => element.getAttribute(\"data-notification-id\"),\n        renderHTML: (attributes) => {\n          if (!attributes.notificationId) {\n            return {};\n          }\n\n          return {\n            \"data-notification-id\": attributes.notificationId as string, // \"as\" typing because TipTap doesn't have a way to type attributes\n          };\n        },\n      },\n    };\n  },\n  addKeyboardShortcuts() {\n    return {\n      Backspace: () =>\n        this.editor.commands.command(({ tr, state }) => {\n          let isMention = false;\n          const { selection } = state;\n          const { empty, anchor } = selection;\n\n          if (!empty) {\n            return false;\n          }\n\n          state.doc.nodesBetween(anchor - 1, anchor, (node, pos) => {\n            if (node.type.name === this.name) {\n              isMention = true;\n              tr.insertText(\"\", pos, pos + node.nodeSize);\n            }\n          });\n\n          return isMention;\n        }),\n    };\n  },\n});\n"],"names":[],"mappings":";;;;;AAMa,MAAA,WAAA,GAAc,KAAK,MAAqB,CAAA;AAAA,EACnD,IAAM,EAAA,uBAAA;AAAA,EACN,KAAO,EAAA,QAAA;AAAA,EACP,MAAQ,EAAA,IAAA;AAAA,EACR,UAAY,EAAA,IAAA;AAAA,EACZ,IAAM,EAAA,IAAA;AAAA,EAEN,QAAU,EAAA,GAAA;AAAA,EACV,SAAY,GAAA;AACV,IAAO,OAAA;AAAA,MACL;AAAA,QACE,GAAK,EAAA,oBAAA;AAAA,OACP;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EAEA,UAAA,CAAW,EAAE,cAAA,EAAkB,EAAA;AAC7B,IAAA,OAAO,CAAC,oBAAA,EAAsB,eAAgB,CAAA,cAAc,CAAC,CAAA,CAAA;AAAA,GAC/D;AAAA,EAEA,WAAc,GAAA;AACZ,IAAA,OAAO,sBAAsB,OAAS,EAAA;AAAA,MACpC,oBAAsB,EAAA,MAAA;AAAA,KACvB,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,aAAgB,GAAA;AACd,IAAO,OAAA;AAAA,MACL,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,SAAS,CAAA;AAAA,QACtD,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,EAAI,EAAA;AAClB,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,WAAW,UAAW,CAAA,EAAA;AAAA,WACxB,CAAA;AAAA,SACF;AAAA,OACF;AAAA,MACA,cAAgB,EAAA;AAAA,QACd,OAAS,EAAA,IAAA;AAAA,QACT,SAAW,EAAA,CAAC,OAAY,KAAA,OAAA,CAAQ,aAAa,sBAAsB,CAAA;AAAA,QACnE,UAAA,EAAY,CAAC,UAAe,KAAA;AAC1B,UAAI,IAAA,CAAC,WAAW,cAAgB,EAAA;AAC9B,YAAA,OAAO,EAAC,CAAA;AAAA,WACV;AAEA,UAAO,OAAA;AAAA,YACL,wBAAwB,UAAW,CAAA,cAAA;AAAA,WACrC,CAAA;AAAA,SACF;AAAA,OACF;AAAA,KACF,CAAA;AAAA,GACF;AAAA,EACA,oBAAuB,GAAA;AACrB,IAAO,OAAA;AAAA,MACL,SAAA,EAAW,MACT,IAAA,CAAK,MAAO,CAAA,QAAA,CAAS,QAAQ,CAAC,EAAE,EAAI,EAAA,KAAA,EAAY,KAAA;AAC9C,QAAA,IAAI,SAAY,GAAA,KAAA,CAAA;AAChB,QAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AACtB,QAAM,MAAA,EAAE,KAAO,EAAA,MAAA,EAAW,GAAA,SAAA,CAAA;AAE1B,QAAA,IAAI,CAAC,KAAO,EAAA;AACV,UAAO,OAAA,KAAA,CAAA;AAAA,SACT;AAEA,QAAA,KAAA,CAAM,IAAI,YAAa,CAAA,MAAA,GAAS,GAAG,MAAQ,EAAA,CAAC,MAAM,GAAQ,KAAA;AACxD,UAAA,IAAI,IAAK,CAAA,IAAA,CAAK,IAAS,KAAA,IAAA,CAAK,IAAM,EAAA;AAChC,YAAY,SAAA,GAAA,IAAA,CAAA;AACZ,YAAA,EAAA,CAAG,UAAW,CAAA,EAAA,EAAI,GAAK,EAAA,GAAA,GAAM,KAAK,QAAQ,CAAA,CAAA;AAAA,WAC5C;AAAA,SACD,CAAA,CAAA;AAED,QAAO,OAAA,SAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACL,CAAA;AAAA,GACF;AACF,CAAC;;;;"}

package/dist/mentions/{MentionsList.mjs → MentionsList.cjs}

@@ -1,19 +1,21 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useFloating, flip, offset, hide, shift, limitShift, size, autoUpdate } from '@floating-ui/react-dom';
-import { createInboxNotificationId } from '@liveblocks/core';
-import { useUser, useRoom } from '@liveblocks/react';
-import { useMentionSuggestions, useLayoutEffect } from '@liveblocks/react/_private';
-import { useOverrides } from '@liveblocks/react-ui';
-import { forwardRef, useState, useEffect, useImperativeHandle } from 'react';
-import { Avatar } from './Avatar.mjs';
+'use strict';
 
-const User = forwardRef(
+var jsxRuntime = require('react/jsx-runtime');
+var reactDom = require('@floating-ui/react-dom');
+var core = require('@liveblocks/core');
+var react$1 = require('@liveblocks/react');
+var _private = require('@liveblocks/react/_private');
+var reactUi = require('@liveblocks/react-ui');
+var react = require('react');
+var Avatar = require('./Avatar.cjs');
+
+const User = react.forwardRef(
   function User2(props, forwardedRef) {
     const { userId, className, ...spanProps } = props;
-    const { user, isLoading } = useUser(userId);
-    const $ = useOverrides();
+    const { user, isLoading } = react$1.useUser(userId);
+    const $ = reactUi.useOverrides();
     const name = user === void 0 || user === null ? $.USER_UNKNOWN : user.name;
-    return /* @__PURE__ */ jsx("span", {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", {
       className,
       "data-loading": isLoading ? "" : void 0,
       ref: forwardedRef,
@@ -23,37 +25,37 @@ const User = forwardRef(
   }
 );
 const SUGGESTIONS_COLLISION_PADDING = 10;
-const MentionsList = forwardRef(
+const MentionsList = react.forwardRef(
   (props, ref) => {
-    const [selectedIndex, setSelectedIndex] = useState(0);
-    const room = useRoom();
-    const suggestions = useMentionSuggestions(room.id, props.query);
+    const [selectedIndex, setSelectedIndex] = react.useState(0);
+    const room = react$1.useRoom();
+    const suggestions = _private.useMentionSuggestions(room.id, props.query);
     const { onMouseEnter, onClick } = props;
     const {
       refs: { setReference, setFloating },
       strategy,
       x,
       y
-    } = useFloating({
+    } = reactDom.useFloating({
       strategy: "fixed",
       placement: "top-start",
       middleware: [
-        flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),
-        offset(10),
-        hide({ padding: SUGGESTIONS_COLLISION_PADDING }),
-        shift({
+        reactDom.flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),
+        reactDom.offset(10),
+        reactDom.hide({ padding: SUGGESTIONS_COLLISION_PADDING }),
+        reactDom.shift({
           padding: SUGGESTIONS_COLLISION_PADDING,
-          limiter: limitShift()
+          limiter: reactDom.limitShift()
         }),
-        size({ padding: SUGGESTIONS_COLLISION_PADDING })
+        reactDom.size({ padding: SUGGESTIONS_COLLISION_PADDING })
       ],
       whileElementsMounted: (...args) => {
-        return autoUpdate(...args, {
+        return reactDom.autoUpdate(...args, {
           animationFrame: true
         });
       }
     });
-    useLayoutEffect(() => {
+    _private.useLayoutEffect(() => {
       setReference({
         getBoundingClientRect: props.clientRect
       });
@@ -63,7 +65,7 @@ const MentionsList = forwardRef(
       if (item) {
         props.command({
           id: item,
-          notificationId: createInboxNotificationId()
+          notificationId: core.createInboxNotificationId()
         });
       }
     };
@@ -78,8 +80,8 @@ const MentionsList = forwardRef(
     const enterHandler = () => {
       selectItem(selectedIndex);
     };
-    useEffect(() => setSelectedIndex(0), [suggestions]);
-    useImperativeHandle(ref, () => ({
+    react.useEffect(() => setSelectedIndex(0), [suggestions]);
+    react.useImperativeHandle(ref, () => ({
       onKeyDown: ({ event }) => {
         if (event.key === "ArrowUp") {
           upHandler();
@@ -111,7 +113,7 @@ const MentionsList = forwardRef(
     if (suggestions === void 0 || suggestions.length === 0) {
       return null;
     }
-    return /* @__PURE__ */ jsx("div", {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", {
       className: "lb-root lb-portal lb-elevation lb-tiptap-suggestions lb-tiptap-mention-suggestions",
       ref: setFloating,
       style: {
@@ -122,20 +124,20 @@ const MentionsList = forwardRef(
         minWidth: "max-content",
         display: props.hide ? "none" : "block"
       },
-      children: /* @__PURE__ */ jsx("div", {
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
         className: "lb-tiptap-suggestions-list lb-tiptap-mention-suggestions-list",
-        children: suggestions.map((item, index) => /* @__PURE__ */ jsxs("div", {
+        children: suggestions.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
           className: "lb-tiptap-suggestions-list-item lb-tiptap-mention-suggestion",
           role: "option",
           "data-highlighted": index === selectedIndex || void 0,
           onMouseEnter: handleMouseEnter(index),
           onClick: handleClick(index),
           children: [
-            /* @__PURE__ */ jsx(Avatar, {
+            /* @__PURE__ */ jsxRuntime.jsx(Avatar.Avatar, {
               userId: item,
               className: "lb-tiptap-mention-suggestion-avatar"
             }),
-            /* @__PURE__ */ jsx(User, {
+            /* @__PURE__ */ jsxRuntime.jsx(User, {
               userId: item,
               className: "lb-tiptap-mention-suggestion-user"
             })
@@ -146,5 +148,7 @@ const MentionsList = forwardRef(
   }
 );
 
-export { MentionsList, SUGGESTIONS_COLLISION_PADDING, User };
-//# sourceMappingURL=MentionsList.mjs.map
+exports.MentionsList = MentionsList;
+exports.SUGGESTIONS_COLLISION_PADDING = SUGGESTIONS_COLLISION_PADDING;
+exports.User = User;
+//# sourceMappingURL=MentionsList.cjs.map

package/dist/mentions/{MentionsList.mjs.map → MentionsList.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"MentionsList.mjs","sources":["../../src/mentions/MentionsList.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  hide,\n  limitShift,\n  offset,\n  shift,\n  size,\n  useFloating,\n} from \"@floating-ui/react-dom\";\nimport { createInboxNotificationId } from \"@liveblocks/core\";\nimport { useRoom, useUser } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport type { HTMLAttributes, MouseEvent } from \"react\";\nimport { forwardRef, useEffect, useImperativeHandle, useState } from \"react\";\n\nimport { Avatar } from \"./Avatar\";\n\nexport interface UserProps\n  extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n  userId: string;\n}\n\nexport const User = forwardRef<HTMLSpanElement, UserProps>(\n  function User(props, forwardedRef) {\n    const { userId, className, ...spanProps } = props;\n\n    const { user, isLoading } = useUser(userId);\n    const $ = useOverrides();\n\n    const name =\n      user === undefined || user === null ? $.USER_UNKNOWN : user.name;\n\n    return (\n      <span\n        className={className}\n        data-loading={isLoading ? \"\" : undefined}\n        ref={forwardedRef}\n        {...spanProps}\n      >\n        {isLoading ? null : name}\n      </span>\n    );\n  }\n);\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nexport interface MentionsListProps extends HTMLAttributes<HTMLDivElement> {\n  query: string;\n  command: (otps: { id: string; notificationId: string }) => void;\n  clientRect: () => DOMRect;\n  hide: boolean;\n}\n\nexport type MentionsListHandle = {\n  onKeyDown: ({ event }: { event: KeyboardEvent }) => boolean;\n};\n\nexport const MentionsList = forwardRef<MentionsListHandle, MentionsListProps>(\n  (props, ref) => {\n    const [selectedIndex, setSelectedIndex] = useState(0);\n    const room = useRoom();\n    const suggestions = useMentionSuggestions(room.id, props.query);\n    const { onMouseEnter, onClick } = props;\n    const {\n      refs: { setReference, setFloating },\n      strategy,\n      x,\n      y,\n    } = useFloating({\n      strategy: \"fixed\",\n      placement: \"top-start\",\n      middleware: [\n        flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n        offset(10),\n        hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n        shift({\n          padding: SUGGESTIONS_COLLISION_PADDING,\n          limiter: limitShift(),\n        }),\n        size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n      ],\n      whileElementsMounted: (...args) => {\n        return autoUpdate(...args, {\n          animationFrame: true,\n        });\n      },\n    });\n\n    useLayoutEffect(() => {\n      setReference({\n        getBoundingClientRect: props.clientRect,\n      });\n    }, [setReference, props.clientRect]);\n\n    const selectItem = (index: number) => {\n      const item = (suggestions ?? [])[index];\n      if (item) {\n        props.command({\n          id: item,\n          notificationId: createInboxNotificationId(),\n        });\n      }\n    };\n\n    const upHandler = () => {\n      setSelectedIndex(\n        (selectedIndex + (suggestions?.length ?? 0) - 1) %\n          (suggestions?.length ?? 0)\n      );\n    };\n\n    const downHandler = () => {\n      setSelectedIndex((selectedIndex + 1) % (suggestions?.length ?? 0));\n    };\n\n    const enterHandler = () => {\n      selectItem(selectedIndex);\n    };\n\n    useEffect(() => setSelectedIndex(0), [suggestions]);\n\n    useImperativeHandle(ref, () => ({\n      onKeyDown: ({ event }: { event: KeyboardEvent }) => {\n        if (event.key === \"ArrowUp\") {\n          upHandler();\n          return true;\n        }\n\n        if (event.key === \"ArrowDown\") {\n          downHandler();\n          return true;\n        }\n\n        if (event.key === \"Enter\") {\n          enterHandler();\n          return true;\n        }\n\n        return false;\n      },\n    }));\n\n    const handleClick =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onClick?.(event);\n\n        if (event.isDefaultPrevented()) return;\n        selectItem(index);\n      };\n    const handleMouseEnter =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onMouseEnter?.(event);\n\n        if (event.isDefaultPrevented()) return;\n\n        setSelectedIndex(index);\n      };\n\n    if (suggestions === undefined || suggestions.length === 0) {\n      return null;\n    }\n\n    return (\n      <div\n        className=\"lb-root lb-portal lb-elevation lb-tiptap-suggestions lb-tiptap-mention-suggestions\"\n        ref={setFloating}\n        style={{\n          position: strategy,\n          top: 0,\n          left: 0,\n          transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n          minWidth: \"max-content\",\n          display: props.hide ? \"none\" : \"block\",\n        }}\n      >\n        <div className=\"lb-tiptap-suggestions-list lb-tiptap-mention-suggestions-list\">\n          {suggestions.map((item, index) => (\n            <div\n              className=\"lb-tiptap-suggestions-list-item lb-tiptap-mention-suggestion\"\n              key={index}\n              role=\"option\"\n              data-highlighted={index === selectedIndex || undefined}\n              onMouseEnter={handleMouseEnter(index)}\n              onClick={handleClick(index)}\n            >\n              <Avatar\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-avatar\"\n              />\n              <User\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-user\"\n              />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":["User"],"mappings":";;;;;;;;;AA2BO,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,SAASA,KAAK,CAAA,KAAA,EAAO,YAAc,EAAA;AACjC,IAAA,MAAM,EAAE,MAAA,EAAQ,SAAc,EAAA,GAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAE5C,IAAA,MAAM,EAAE,IAAA,EAAM,SAAU,EAAA,GAAI,QAAQ,MAAM,CAAA,CAAA;AAC1C,IAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AAEvB,IAAA,MAAM,OACJ,IAAS,KAAA,KAAA,CAAA,IAAa,SAAS,IAAO,GAAA,CAAA,CAAE,eAAe,IAAK,CAAA,IAAA,CAAA;AAE9D,IAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,MACC,SAAA;AAAA,MACA,cAAA,EAAc,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,MAC/B,GAAK,EAAA,YAAA;AAAA,MACJ,GAAG,SAAA;AAAA,MAEH,sBAAY,IAAO,GAAA,IAAA;AAAA,KACtB,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEO,MAAM,6BAAgC,GAAA,GAAA;AAatC,MAAM,YAAe,GAAA,UAAA;AAAA,EAC1B,CAAC,OAAO,GAAQ,KAAA;AACd,IAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAI,SAAS,CAAC,CAAA,CAAA;AACpD,IAAA,MAAM,OAAO,OAAQ,EAAA,CAAA;AACrB,IAAA,MAAM,WAAc,GAAA,qBAAA,CAAsB,IAAK,CAAA,EAAA,EAAI,MAAM,KAAK,CAAA,CAAA;AAC9D,IAAM,MAAA,EAAE,YAAc,EAAA,OAAA,EAAY,GAAA,KAAA,CAAA;AAClC,IAAM,MAAA;AAAA,MACJ,IAAA,EAAM,EAAE,YAAA,EAAc,WAAY,EAAA;AAAA,MAClC,QAAA;AAAA,MACA,CAAA;AAAA,MACA,CAAA;AAAA,QACE,WAAY,CAAA;AAAA,MACd,QAAU,EAAA,OAAA;AAAA,MACV,SAAW,EAAA,WAAA;AAAA,MACX,UAAY,EAAA;AAAA,QACV,KAAK,EAAE,OAAA,EAAS,6BAA+B,EAAA,SAAA,EAAW,OAAO,CAAA;AAAA,QACjE,OAAO,EAAE,CAAA;AAAA,QACT,IAAK,CAAA,EAAE,OAAS,EAAA,6BAAA,EAA+B,CAAA;AAAA,QAC/C,KAAM,CAAA;AAAA,UACJ,OAAS,EAAA,6BAAA;AAAA,UACT,SAAS,UAAW,EAAA;AAAA,SACrB,CAAA;AAAA,QACD,IAAK,CAAA,EAAE,OAAS,EAAA,6BAAA,EAA+B,CAAA;AAAA,OACjD;AAAA,MACA,oBAAA,EAAsB,IAAI,IAAS,KAAA;AACjC,QAAO,OAAA,UAAA,CAAW,GAAG,IAAM,EAAA;AAAA,UACzB,cAAgB,EAAA,IAAA;AAAA,SACjB,CAAA,CAAA;AAAA,OACH;AAAA,KACD,CAAA,CAAA;AAED,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAa,YAAA,CAAA;AAAA,QACX,uBAAuB,KAAM,CAAA,UAAA;AAAA,OAC9B,CAAA,CAAA;AAAA,KACA,EAAA,CAAC,YAAc,EAAA,KAAA,CAAM,UAAU,CAAC,CAAA,CAAA;AAEnC,IAAM,MAAA,UAAA,GAAa,CAAC,KAAkB,KAAA;AACpC,MAAM,MAAA,IAAA,GAAA,CAAQ,WAAe,IAAA,EAAI,EAAA,KAAA,CAAA,CAAA;AACjC,MAAA,IAAI,IAAM,EAAA;AACR,QAAA,KAAA,CAAM,OAAQ,CAAA;AAAA,UACZ,EAAI,EAAA,IAAA;AAAA,UACJ,gBAAgB,yBAA0B,EAAA;AAAA,SAC3C,CAAA,CAAA;AAAA,OACH;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,YAAY,MAAM;AACtB,MAAA,gBAAA;AAAA,QAAA,CACG,iBAAiB,WAAa,EAAA,MAAA,IAAU,CAAK,CAAA,GAAA,CAAA,KAC3C,aAAa,MAAU,IAAA,CAAA,CAAA;AAAA,OAC5B,CAAA;AAAA,KACF,CAAA;AAEA,IAAA,MAAM,cAAc,MAAM;AACxB,MAAA,gBAAA,CAAA,CAAkB,aAAgB,GAAA,CAAA,KAAM,WAAa,EAAA,MAAA,IAAU,CAAE,CAAA,CAAA,CAAA;AAAA,KACnE,CAAA;AAEA,IAAA,MAAM,eAAe,MAAM;AACzB,MAAA,UAAA,CAAW,aAAa,CAAA,CAAA;AAAA,KAC1B,CAAA;AAEA,IAAA,SAAA,CAAU,MAAM,gBAAiB,CAAA,CAAC,CAAG,EAAA,CAAC,WAAW,CAAC,CAAA,CAAA;AAElD,IAAA,mBAAA,CAAoB,KAAK,OAAO;AAAA,MAC9B,SAAW,EAAA,CAAC,EAAE,KAAA,EAAsC,KAAA;AAClD,QAAI,IAAA,KAAA,CAAM,QAAQ,SAAW,EAAA;AAC3B,UAAU,SAAA,EAAA,CAAA;AACV,UAAO,OAAA,IAAA,CAAA;AAAA,SACT;AAEA,QAAI,IAAA,KAAA,CAAM,QAAQ,WAAa,EAAA;AAC7B,UAAY,WAAA,EAAA,CAAA;AACZ,UAAO,OAAA,IAAA,CAAA;AAAA,SACT;AAEA,QAAI,IAAA,KAAA,CAAM,QAAQ,OAAS,EAAA;AACzB,UAAa,YAAA,EAAA,CAAA;AACb,UAAO,OAAA,IAAA,CAAA;AAAA,SACT;AAEA,QAAO,OAAA,KAAA,CAAA;AAAA,OACT;AAAA,KACA,CAAA,CAAA,CAAA;AAEF,IAAA,MAAM,WACJ,GAAA,CAAC,KAAkB,KAAA,CAAC,KAAsC,KAAA;AACxD,MAAA,OAAA,GAAU,KAAK,CAAA,CAAA;AAEf,MAAA,IAAI,MAAM,kBAAmB,EAAA;AAAG,QAAA,OAAA;AAChC,MAAA,UAAA,CAAW,KAAK,CAAA,CAAA;AAAA,KAClB,CAAA;AACF,IAAA,MAAM,gBACJ,GAAA,CAAC,KAAkB,KAAA,CAAC,KAAsC,KAAA;AACxD,MAAA,YAAA,GAAe,KAAK,CAAA,CAAA;AAEpB,MAAA,IAAI,MAAM,kBAAmB,EAAA;AAAG,QAAA,OAAA;AAEhC,MAAA,gBAAA,CAAiB,KAAK,CAAA,CAAA;AAAA,KACxB,CAAA;AAEF,IAAA,IAAI,WAAgB,KAAA,KAAA,CAAA,IAAa,WAAY,CAAA,MAAA,KAAW,CAAG,EAAA;AACzD,MAAO,OAAA,IAAA,CAAA;AAAA,KACT;AAEA,IAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,MACC,SAAU,EAAA,oFAAA;AAAA,MACV,GAAK,EAAA,WAAA;AAAA,MACL,KAAO,EAAA;AAAA,QACL,QAAU,EAAA,QAAA;AAAA,QACV,GAAK,EAAA,CAAA;AAAA,QACL,IAAM,EAAA,CAAA;AAAA,QACN,SAAA,EAAW,eAAe,IAAK,CAAA,KAAA,CAAM,CAAC,CAAQ,CAAA,IAAA,EAAA,IAAA,CAAK,MAAM,CAAC,CAAA,CAAA,MAAA,CAAA;AAAA,QAC1D,QAAU,EAAA,aAAA;AAAA,QACV,OAAA,EAAS,KAAM,CAAA,IAAA,GAAO,MAAS,GAAA,OAAA;AAAA,OACjC;AAAA,MAEA,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,QAAI,SAAU,EAAA,+DAAA;AAAA,QACZ,QAAY,EAAA,WAAA,CAAA,GAAA,CAAI,CAAC,IAAA,EAAM,0BACrB,IAAA,CAAA,KAAA,EAAA;AAAA,UACC,SAAU,EAAA,8DAAA;AAAA,UAEV,IAAK,EAAA,QAAA;AAAA,UACL,kBAAA,EAAkB,UAAU,aAAiB,IAAA,KAAA,CAAA;AAAA,UAC7C,YAAA,EAAc,iBAAiB,KAAK,CAAA;AAAA,UACpC,OAAA,EAAS,YAAY,KAAK,CAAA;AAAA,UAE1B,QAAA,EAAA;AAAA,4BAAC,GAAA,CAAA,MAAA,EAAA;AAAA,cACC,MAAQ,EAAA,IAAA;AAAA,cACR,SAAU,EAAA,qCAAA;AAAA,aACZ,CAAA;AAAA,4BACC,GAAA,CAAA,IAAA,EAAA;AAAA,cACC,MAAQ,EAAA,IAAA;AAAA,cACR,SAAU,EAAA,mCAAA;AAAA,aACZ,CAAA;AAAA,WAAA;AAAA,SAAA,EAbK,KAcP,CACD,CAAA;AAAA,OACH,CAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
+{"version":3,"file":"MentionsList.cjs","sources":["../../src/mentions/MentionsList.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  hide,\n  limitShift,\n  offset,\n  shift,\n  size,\n  useFloating,\n} from \"@floating-ui/react-dom\";\nimport { createInboxNotificationId } from \"@liveblocks/core\";\nimport { useRoom, useUser } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport type { HTMLAttributes, MouseEvent } from \"react\";\nimport { forwardRef, useEffect, useImperativeHandle, useState } from \"react\";\n\nimport { Avatar } from \"./Avatar\";\n\nexport interface UserProps\n  extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n  userId: string;\n}\n\nexport const User = forwardRef<HTMLSpanElement, UserProps>(\n  function User(props, forwardedRef) {\n    const { userId, className, ...spanProps } = props;\n\n    const { user, isLoading } = useUser(userId);\n    const $ = useOverrides();\n\n    const name =\n      user === undefined || user === null ? $.USER_UNKNOWN : user.name;\n\n    return (\n      <span\n        className={className}\n        data-loading={isLoading ? \"\" : undefined}\n        ref={forwardedRef}\n        {...spanProps}\n      >\n        {isLoading ? null : name}\n      </span>\n    );\n  }\n);\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nexport interface MentionsListProps extends HTMLAttributes<HTMLDivElement> {\n  query: string;\n  command: (otps: { id: string; notificationId: string }) => void;\n  clientRect: () => DOMRect;\n  hide: boolean;\n}\n\nexport type MentionsListHandle = {\n  onKeyDown: ({ event }: { event: KeyboardEvent }) => boolean;\n};\n\nexport const MentionsList = forwardRef<MentionsListHandle, MentionsListProps>(\n  (props, ref) => {\n    const [selectedIndex, setSelectedIndex] = useState(0);\n    const room = useRoom();\n    const suggestions = useMentionSuggestions(room.id, props.query);\n    const { onMouseEnter, onClick } = props;\n    const {\n      refs: { setReference, setFloating },\n      strategy,\n      x,\n      y,\n    } = useFloating({\n      strategy: \"fixed\",\n      placement: \"top-start\",\n      middleware: [\n        flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n        offset(10),\n        hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n        shift({\n          padding: SUGGESTIONS_COLLISION_PADDING,\n          limiter: limitShift(),\n        }),\n        size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n      ],\n      whileElementsMounted: (...args) => {\n        return autoUpdate(...args, {\n          animationFrame: true,\n        });\n      },\n    });\n\n    useLayoutEffect(() => {\n      setReference({\n        getBoundingClientRect: props.clientRect,\n      });\n    }, [setReference, props.clientRect]);\n\n    const selectItem = (index: number) => {\n      const item = (suggestions ?? [])[index];\n      if (item) {\n        props.command({\n          id: item,\n          notificationId: createInboxNotificationId(),\n        });\n      }\n    };\n\n    const upHandler = () => {\n      setSelectedIndex(\n        (selectedIndex + (suggestions?.length ?? 0) - 1) %\n          (suggestions?.length ?? 0)\n      );\n    };\n\n    const downHandler = () => {\n      setSelectedIndex((selectedIndex + 1) % (suggestions?.length ?? 0));\n    };\n\n    const enterHandler = () => {\n      selectItem(selectedIndex);\n    };\n\n    useEffect(() => setSelectedIndex(0), [suggestions]);\n\n    useImperativeHandle(ref, () => ({\n      onKeyDown: ({ event }: { event: KeyboardEvent }) => {\n        if (event.key === \"ArrowUp\") {\n          upHandler();\n          return true;\n        }\n\n        if (event.key === \"ArrowDown\") {\n          downHandler();\n          return true;\n        }\n\n        if (event.key === \"Enter\") {\n          enterHandler();\n          return true;\n        }\n\n        return false;\n      },\n    }));\n\n    const handleClick =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onClick?.(event);\n\n        if (event.isDefaultPrevented()) return;\n        selectItem(index);\n      };\n    const handleMouseEnter =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onMouseEnter?.(event);\n\n        if (event.isDefaultPrevented()) return;\n\n        setSelectedIndex(index);\n      };\n\n    if (suggestions === undefined || suggestions.length === 0) {\n      return null;\n    }\n\n    return (\n      <div\n        className=\"lb-root lb-portal lb-elevation lb-tiptap-suggestions lb-tiptap-mention-suggestions\"\n        ref={setFloating}\n        style={{\n          position: strategy,\n          top: 0,\n          left: 0,\n          transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n          minWidth: \"max-content\",\n          display: props.hide ? \"none\" : \"block\",\n        }}\n      >\n        <div className=\"lb-tiptap-suggestions-list lb-tiptap-mention-suggestions-list\">\n          {suggestions.map((item, index) => (\n            <div\n              className=\"lb-tiptap-suggestions-list-item lb-tiptap-mention-suggestion\"\n              key={index}\n              role=\"option\"\n              data-highlighted={index === selectedIndex || undefined}\n              onMouseEnter={handleMouseEnter(index)}\n              onClick={handleClick(index)}\n            >\n              <Avatar\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-avatar\"\n              />\n              <User\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-user\"\n              />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","User","useUser","useOverrides","jsx","useState","useRoom","useMentionSuggestions","useFloating","flip","offset","hide","shift","limitShift","size","autoUpdate","useLayoutEffect","createInboxNotificationId","useEffect","useImperativeHandle","jsxs","Avatar"],"mappings":"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"}

package/dist/mentions/MentionsList.js

@@ -1,21 +1,19 @@
-'use strict';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useFloating, flip, offset, hide, shift, limitShift, size, autoUpdate } from '@floating-ui/react-dom';
+import { createInboxNotificationId } from '@liveblocks/core';
+import { useUser, useRoom } from '@liveblocks/react';
+import { useMentionSuggestions, useLayoutEffect } from '@liveblocks/react/_private';
+import { useOverrides } from '@liveblocks/react-ui';
+import { forwardRef, useState, useEffect, useImperativeHandle } from 'react';
+import { Avatar } from './Avatar.js';
 
-var jsxRuntime = require('react/jsx-runtime');
-var reactDom = require('@floating-ui/react-dom');
-var core = require('@liveblocks/core');
-var react$1 = require('@liveblocks/react');
-var _private = require('@liveblocks/react/_private');
-var reactUi = require('@liveblocks/react-ui');
-var react = require('react');
-var Avatar = require('./Avatar.js');
-
-const User = react.forwardRef(
+const User = forwardRef(
   function User2(props, forwardedRef) {
     const { userId, className, ...spanProps } = props;
-    const { user, isLoading } = react$1.useUser(userId);
-    const $ = reactUi.useOverrides();
+    const { user, isLoading } = useUser(userId);
+    const $ = useOverrides();
     const name = user === void 0 || user === null ? $.USER_UNKNOWN : user.name;
-    return /* @__PURE__ */ jsxRuntime.jsx("span", {
+    return /* @__PURE__ */ jsx("span", {
       className,
       "data-loading": isLoading ? "" : void 0,
       ref: forwardedRef,
@@ -25,37 +23,37 @@ const User = react.forwardRef(
   }
 );
 const SUGGESTIONS_COLLISION_PADDING = 10;
-const MentionsList = react.forwardRef(
+const MentionsList = forwardRef(
   (props, ref) => {
-    const [selectedIndex, setSelectedIndex] = react.useState(0);
-    const room = react$1.useRoom();
-    const suggestions = _private.useMentionSuggestions(room.id, props.query);
+    const [selectedIndex, setSelectedIndex] = useState(0);
+    const room = useRoom();
+    const suggestions = useMentionSuggestions(room.id, props.query);
     const { onMouseEnter, onClick } = props;
     const {
       refs: { setReference, setFloating },
       strategy,
       x,
       y
-    } = reactDom.useFloating({
+    } = useFloating({
       strategy: "fixed",
       placement: "top-start",
       middleware: [
-        reactDom.flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),
-        reactDom.offset(10),
-        reactDom.hide({ padding: SUGGESTIONS_COLLISION_PADDING }),
-        reactDom.shift({
+        flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),
+        offset(10),
+        hide({ padding: SUGGESTIONS_COLLISION_PADDING }),
+        shift({
           padding: SUGGESTIONS_COLLISION_PADDING,
-          limiter: reactDom.limitShift()
+          limiter: limitShift()
         }),
-        reactDom.size({ padding: SUGGESTIONS_COLLISION_PADDING })
+        size({ padding: SUGGESTIONS_COLLISION_PADDING })
       ],
       whileElementsMounted: (...args) => {
-        return reactDom.autoUpdate(...args, {
+        return autoUpdate(...args, {
           animationFrame: true
         });
       }
     });
-    _private.useLayoutEffect(() => {
+    useLayoutEffect(() => {
       setReference({
         getBoundingClientRect: props.clientRect
       });
@@ -65,7 +63,7 @@ const MentionsList = react.forwardRef(
       if (item) {
         props.command({
           id: item,
-          notificationId: core.createInboxNotificationId()
+          notificationId: createInboxNotificationId()
         });
       }
     };
@@ -80,8 +78,8 @@ const MentionsList = react.forwardRef(
     const enterHandler = () => {
       selectItem(selectedIndex);
     };
-    react.useEffect(() => setSelectedIndex(0), [suggestions]);
-    react.useImperativeHandle(ref, () => ({
+    useEffect(() => setSelectedIndex(0), [suggestions]);
+    useImperativeHandle(ref, () => ({
       onKeyDown: ({ event }) => {
         if (event.key === "ArrowUp") {
           upHandler();
@@ -113,7 +111,7 @@ const MentionsList = react.forwardRef(
     if (suggestions === void 0 || suggestions.length === 0) {
       return null;
     }
-    return /* @__PURE__ */ jsxRuntime.jsx("div", {
+    return /* @__PURE__ */ jsx("div", {
       className: "lb-root lb-portal lb-elevation lb-tiptap-suggestions lb-tiptap-mention-suggestions",
       ref: setFloating,
       style: {
@@ -124,20 +122,20 @@ const MentionsList = react.forwardRef(
         minWidth: "max-content",
         display: props.hide ? "none" : "block"
       },
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+      children: /* @__PURE__ */ jsx("div", {
         className: "lb-tiptap-suggestions-list lb-tiptap-mention-suggestions-list",
-        children: suggestions.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs("div", {
+        children: suggestions.map((item, index) => /* @__PURE__ */ jsxs("div", {
           className: "lb-tiptap-suggestions-list-item lb-tiptap-mention-suggestion",
           role: "option",
           "data-highlighted": index === selectedIndex || void 0,
           onMouseEnter: handleMouseEnter(index),
           onClick: handleClick(index),
           children: [
-            /* @__PURE__ */ jsxRuntime.jsx(Avatar.Avatar, {
+            /* @__PURE__ */ jsx(Avatar, {
               userId: item,
               className: "lb-tiptap-mention-suggestion-avatar"
             }),
-            /* @__PURE__ */ jsxRuntime.jsx(User, {
+            /* @__PURE__ */ jsx(User, {
               userId: item,
               className: "lb-tiptap-mention-suggestion-user"
             })
@@ -148,7 +146,5 @@ const MentionsList = react.forwardRef(
   }
 );
 
-exports.MentionsList = MentionsList;
-exports.SUGGESTIONS_COLLISION_PADDING = SUGGESTIONS_COLLISION_PADDING;
-exports.User = User;
+export { MentionsList, SUGGESTIONS_COLLISION_PADDING, User };
 //# sourceMappingURL=MentionsList.js.map

package/dist/mentions/MentionsList.js.map

@@ -1 +1 @@
-{"version":3,"file":"MentionsList.js","sources":["../../src/mentions/MentionsList.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  hide,\n  limitShift,\n  offset,\n  shift,\n  size,\n  useFloating,\n} from \"@floating-ui/react-dom\";\nimport { createInboxNotificationId } from \"@liveblocks/core\";\nimport { useRoom, useUser } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport type { HTMLAttributes, MouseEvent } from \"react\";\nimport { forwardRef, useEffect, useImperativeHandle, useState } from \"react\";\n\nimport { Avatar } from \"./Avatar\";\n\nexport interface UserProps\n  extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n  userId: string;\n}\n\nexport const User = forwardRef<HTMLSpanElement, UserProps>(\n  function User(props, forwardedRef) {\n    const { userId, className, ...spanProps } = props;\n\n    const { user, isLoading } = useUser(userId);\n    const $ = useOverrides();\n\n    const name =\n      user === undefined || user === null ? $.USER_UNKNOWN : user.name;\n\n    return (\n      <span\n        className={className}\n        data-loading={isLoading ? \"\" : undefined}\n        ref={forwardedRef}\n        {...spanProps}\n      >\n        {isLoading ? null : name}\n      </span>\n    );\n  }\n);\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nexport interface MentionsListProps extends HTMLAttributes<HTMLDivElement> {\n  query: string;\n  command: (otps: { id: string; notificationId: string }) => void;\n  clientRect: () => DOMRect;\n  hide: boolean;\n}\n\nexport type MentionsListHandle = {\n  onKeyDown: ({ event }: { event: KeyboardEvent }) => boolean;\n};\n\nexport const MentionsList = forwardRef<MentionsListHandle, MentionsListProps>(\n  (props, ref) => {\n    const [selectedIndex, setSelectedIndex] = useState(0);\n    const room = useRoom();\n    const suggestions = useMentionSuggestions(room.id, props.query);\n    const { onMouseEnter, onClick } = props;\n    const {\n      refs: { setReference, setFloating },\n      strategy,\n      x,\n      y,\n    } = useFloating({\n      strategy: \"fixed\",\n      placement: \"top-start\",\n      middleware: [\n        flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n        offset(10),\n        hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n        shift({\n          padding: SUGGESTIONS_COLLISION_PADDING,\n          limiter: limitShift(),\n        }),\n        size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n      ],\n      whileElementsMounted: (...args) => {\n        return autoUpdate(...args, {\n          animationFrame: true,\n        });\n      },\n    });\n\n    useLayoutEffect(() => {\n      setReference({\n        getBoundingClientRect: props.clientRect,\n      });\n    }, [setReference, props.clientRect]);\n\n    const selectItem = (index: number) => {\n      const item = (suggestions ?? [])[index];\n      if (item) {\n        props.command({\n          id: item,\n          notificationId: createInboxNotificationId(),\n        });\n      }\n    };\n\n    const upHandler = () => {\n      setSelectedIndex(\n        (selectedIndex + (suggestions?.length ?? 0) - 1) %\n          (suggestions?.length ?? 0)\n      );\n    };\n\n    const downHandler = () => {\n      setSelectedIndex((selectedIndex + 1) % (suggestions?.length ?? 0));\n    };\n\n    const enterHandler = () => {\n      selectItem(selectedIndex);\n    };\n\n    useEffect(() => setSelectedIndex(0), [suggestions]);\n\n    useImperativeHandle(ref, () => ({\n      onKeyDown: ({ event }: { event: KeyboardEvent }) => {\n        if (event.key === \"ArrowUp\") {\n          upHandler();\n          return true;\n        }\n\n        if (event.key === \"ArrowDown\") {\n          downHandler();\n          return true;\n        }\n\n        if (event.key === \"Enter\") {\n          enterHandler();\n          return true;\n        }\n\n        return false;\n      },\n    }));\n\n    const handleClick =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onClick?.(event);\n\n        if (event.isDefaultPrevented()) return;\n        selectItem(index);\n      };\n    const handleMouseEnter =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onMouseEnter?.(event);\n\n        if (event.isDefaultPrevented()) return;\n\n        setSelectedIndex(index);\n      };\n\n    if (suggestions === undefined || suggestions.length === 0) {\n      return null;\n    }\n\n    return (\n      <div\n        className=\"lb-root lb-portal lb-elevation lb-tiptap-suggestions lb-tiptap-mention-suggestions\"\n        ref={setFloating}\n        style={{\n          position: strategy,\n          top: 0,\n          left: 0,\n          transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n          minWidth: \"max-content\",\n          display: props.hide ? \"none\" : \"block\",\n        }}\n      >\n        <div className=\"lb-tiptap-suggestions-list lb-tiptap-mention-suggestions-list\">\n          {suggestions.map((item, index) => (\n            <div\n              className=\"lb-tiptap-suggestions-list-item lb-tiptap-mention-suggestion\"\n              key={index}\n              role=\"option\"\n              data-highlighted={index === selectedIndex || undefined}\n              onMouseEnter={handleMouseEnter(index)}\n              onClick={handleClick(index)}\n            >\n              <Avatar\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-avatar\"\n              />\n              <User\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-user\"\n              />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":["forwardRef","User","useUser","useOverrides","jsx","useState","useRoom","useMentionSuggestions","useFloating","flip","offset","hide","shift","limitShift","size","autoUpdate","useLayoutEffect","createInboxNotificationId","useEffect","useImperativeHandle","jsxs","Avatar"],"mappings":"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"}
+{"version":3,"file":"MentionsList.js","sources":["../../src/mentions/MentionsList.tsx"],"sourcesContent":["import {\n  autoUpdate,\n  flip,\n  hide,\n  limitShift,\n  offset,\n  shift,\n  size,\n  useFloating,\n} from \"@floating-ui/react-dom\";\nimport { createInboxNotificationId } from \"@liveblocks/core\";\nimport { useRoom, useUser } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useMentionSuggestions,\n} from \"@liveblocks/react/_private\";\nimport { useOverrides } from \"@liveblocks/react-ui\";\nimport type { HTMLAttributes, MouseEvent } from \"react\";\nimport { forwardRef, useEffect, useImperativeHandle, useState } from \"react\";\n\nimport { Avatar } from \"./Avatar\";\n\nexport interface UserProps\n  extends Omit<HTMLAttributes<HTMLSpanElement>, \"children\"> {\n  userId: string;\n}\n\nexport const User = forwardRef<HTMLSpanElement, UserProps>(\n  function User(props, forwardedRef) {\n    const { userId, className, ...spanProps } = props;\n\n    const { user, isLoading } = useUser(userId);\n    const $ = useOverrides();\n\n    const name =\n      user === undefined || user === null ? $.USER_UNKNOWN : user.name;\n\n    return (\n      <span\n        className={className}\n        data-loading={isLoading ? \"\" : undefined}\n        ref={forwardedRef}\n        {...spanProps}\n      >\n        {isLoading ? null : name}\n      </span>\n    );\n  }\n);\n\nexport const SUGGESTIONS_COLLISION_PADDING = 10;\n\nexport interface MentionsListProps extends HTMLAttributes<HTMLDivElement> {\n  query: string;\n  command: (otps: { id: string; notificationId: string }) => void;\n  clientRect: () => DOMRect;\n  hide: boolean;\n}\n\nexport type MentionsListHandle = {\n  onKeyDown: ({ event }: { event: KeyboardEvent }) => boolean;\n};\n\nexport const MentionsList = forwardRef<MentionsListHandle, MentionsListProps>(\n  (props, ref) => {\n    const [selectedIndex, setSelectedIndex] = useState(0);\n    const room = useRoom();\n    const suggestions = useMentionSuggestions(room.id, props.query);\n    const { onMouseEnter, onClick } = props;\n    const {\n      refs: { setReference, setFloating },\n      strategy,\n      x,\n      y,\n    } = useFloating({\n      strategy: \"fixed\",\n      placement: \"top-start\",\n      middleware: [\n        flip({ padding: SUGGESTIONS_COLLISION_PADDING, crossAxis: false }),\n        offset(10),\n        hide({ padding: SUGGESTIONS_COLLISION_PADDING }),\n        shift({\n          padding: SUGGESTIONS_COLLISION_PADDING,\n          limiter: limitShift(),\n        }),\n        size({ padding: SUGGESTIONS_COLLISION_PADDING }),\n      ],\n      whileElementsMounted: (...args) => {\n        return autoUpdate(...args, {\n          animationFrame: true,\n        });\n      },\n    });\n\n    useLayoutEffect(() => {\n      setReference({\n        getBoundingClientRect: props.clientRect,\n      });\n    }, [setReference, props.clientRect]);\n\n    const selectItem = (index: number) => {\n      const item = (suggestions ?? [])[index];\n      if (item) {\n        props.command({\n          id: item,\n          notificationId: createInboxNotificationId(),\n        });\n      }\n    };\n\n    const upHandler = () => {\n      setSelectedIndex(\n        (selectedIndex + (suggestions?.length ?? 0) - 1) %\n          (suggestions?.length ?? 0)\n      );\n    };\n\n    const downHandler = () => {\n      setSelectedIndex((selectedIndex + 1) % (suggestions?.length ?? 0));\n    };\n\n    const enterHandler = () => {\n      selectItem(selectedIndex);\n    };\n\n    useEffect(() => setSelectedIndex(0), [suggestions]);\n\n    useImperativeHandle(ref, () => ({\n      onKeyDown: ({ event }: { event: KeyboardEvent }) => {\n        if (event.key === \"ArrowUp\") {\n          upHandler();\n          return true;\n        }\n\n        if (event.key === \"ArrowDown\") {\n          downHandler();\n          return true;\n        }\n\n        if (event.key === \"Enter\") {\n          enterHandler();\n          return true;\n        }\n\n        return false;\n      },\n    }));\n\n    const handleClick =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onClick?.(event);\n\n        if (event.isDefaultPrevented()) return;\n        selectItem(index);\n      };\n    const handleMouseEnter =\n      (index: number) => (event: MouseEvent<HTMLDivElement>) => {\n        onMouseEnter?.(event);\n\n        if (event.isDefaultPrevented()) return;\n\n        setSelectedIndex(index);\n      };\n\n    if (suggestions === undefined || suggestions.length === 0) {\n      return null;\n    }\n\n    return (\n      <div\n        className=\"lb-root lb-portal lb-elevation lb-tiptap-suggestions lb-tiptap-mention-suggestions\"\n        ref={setFloating}\n        style={{\n          position: strategy,\n          top: 0,\n          left: 0,\n          transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,\n          minWidth: \"max-content\",\n          display: props.hide ? \"none\" : \"block\",\n        }}\n      >\n        <div className=\"lb-tiptap-suggestions-list lb-tiptap-mention-suggestions-list\">\n          {suggestions.map((item, index) => (\n            <div\n              className=\"lb-tiptap-suggestions-list-item lb-tiptap-mention-suggestion\"\n              key={index}\n              role=\"option\"\n              data-highlighted={index === selectedIndex || undefined}\n              onMouseEnter={handleMouseEnter(index)}\n              onClick={handleClick(index)}\n            >\n              <Avatar\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-avatar\"\n              />\n              <User\n                userId={item}\n                className=\"lb-tiptap-mention-suggestion-user\"\n              />\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  }\n);\n"],"names":["User"],"mappings":"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"}