@liveblocks/react-lexical 3.9.1 → 3.9.2-tiptap1

package/dist/create-rects-from-dom-range.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"create-rects-from-dom-range.cjs","sources":["../src/create-rects-from-dom-range.ts"],"sourcesContent":["/**\n * MIT License\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n * \n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n * \n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport type { LexicalEditor } from \"lexical\";\n\n/**\n * Creates DOMRects, generally used to help the editor find a specific location on the screen.\n * @param editor - The lexical editor\n * @param range - A fragment of a document that can contain nodes and parts of text nodes.\n * @returns The selectionRects as an array.\n */\nexport function createRectsFromDOMRange(\n  editor: LexicalEditor,\n  range: Range\n): Array<ClientRect> {\n  const rootElement = editor.getRootElement();\n\n  if (rootElement === null) {\n    return [];\n  }\n  const rootRect = rootElement.getBoundingClientRect();\n  const computedStyle = getComputedStyle(rootElement);\n  const rootPadding =\n    parseFloat(computedStyle.paddingLeft) +\n    parseFloat(computedStyle.paddingRight);\n  const selectionRects = Array.from(range.getClientRects());\n  let selectionRectsLength = selectionRects.length;\n  //sort rects from top left to bottom right.\n  selectionRects.sort((a, b) => {\n    const top = a.top - b.top;\n    // Some rects match position closely, but not perfectly,\n    // so we give a 3px tolerance.\n    if (Math.abs(top) <= 3) {\n      return a.left - b.left;\n    }\n    return top;\n  });\n  let prevRect;\n  for (let i = 0; i < selectionRectsLength; i++) {\n    const selectionRect = selectionRects[i];\n    // Exclude rects that overlap preceding Rects in the sorted list.\n    const isOverlappingRect =\n      prevRect &&\n      prevRect.top <= selectionRect.top &&\n      prevRect.top + prevRect.height > selectionRect.top &&\n      prevRect.left + prevRect.width > selectionRect.left;\n    // Exclude selections that span the entire element\n    const selectionSpansElement =\n      selectionRect.width + rootPadding === rootRect.width;\n    if (isOverlappingRect || selectionSpansElement) {\n      selectionRects.splice(i--, 1);\n      selectionRectsLength--;\n      continue;\n    }\n    prevRect = selectionRect;\n  }\n  return selectionRects;\n}\n"],"names":[],"mappings":";;AA+BgB,SAAA,uBAAA,CACd,QACA,KACmB,EAAA;AACnB,EAAM,MAAA,WAAA,GAAc,OAAO,cAAe,EAAA,CAAA;AAE1C,EAAA,IAAI,gBAAgB,IAAM,EAAA;AACxB,IAAA,OAAO,EAAC,CAAA;AAAA,GACV;AACA,EAAM,MAAA,QAAA,GAAW,YAAY,qBAAsB,EAAA,CAAA;AACnD,EAAM,MAAA,aAAA,GAAgB,iBAAiB,WAAW,CAAA,CAAA;AAClD,EAAA,MAAM,cACJ,UAAW,CAAA,aAAA,CAAc,WAAW,CACpC,GAAA,UAAA,CAAW,cAAc,YAAY,CAAA,CAAA;AACvC,EAAA,MAAM,cAAiB,GAAA,KAAA,CAAM,IAAK,CAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA;AACxD,EAAA,IAAI,uBAAuB,cAAe,CAAA,MAAA,CAAA;AAE1C,EAAe,cAAA,CAAA,IAAA,CAAK,CAAC,CAAA,EAAG,CAAM,KAAA;AAC5B,IAAM,MAAA,GAAA,GAAM,CAAE,CAAA,GAAA,GAAM,CAAE,CAAA,GAAA,CAAA;AAGtB,IAAA,IAAI,IAAK,CAAA,GAAA,CAAI,GAAG,CAAA,IAAK,CAAG,EAAA;AACtB,MAAO,OAAA,CAAA,CAAE,OAAO,CAAE,CAAA,IAAA,CAAA;AAAA,KACpB;AACA,IAAO,OAAA,GAAA,CAAA;AAAA,GACR,CAAA,CAAA;AACD,EAAI,IAAA,QAAA,CAAA;AACJ,EAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAI,GAAA,oBAAA,EAAsB,CAAK,EAAA,EAAA;AAC7C,IAAA,MAAM,gBAAgB,cAAe,CAAA,CAAA,CAAA,CAAA;AAErC,IAAA,MAAM,oBACJ,QACA,IAAA,QAAA,CAAS,GAAO,IAAA,aAAA,CAAc,OAC9B,QAAS,CAAA,GAAA,GAAM,QAAS,CAAA,MAAA,GAAS,cAAc,GAC/C,IAAA,QAAA,CAAS,IAAO,GAAA,QAAA,CAAS,QAAQ,aAAc,CAAA,IAAA,CAAA;AAEjD,IAAA,MAAM,qBACJ,GAAA,aAAA,CAAc,KAAQ,GAAA,WAAA,KAAgB,QAAS,CAAA,KAAA,CAAA;AACjD,IAAA,IAAI,qBAAqB,qBAAuB,EAAA;AAC9C,MAAe,cAAA,CAAA,MAAA,CAAO,KAAK,CAAC,CAAA,CAAA;AAC5B,MAAA,oBAAA,EAAA,CAAA;AACA,MAAA,SAAA;AAAA,KACF;AACA,IAAW,QAAA,GAAA,aAAA,CAAA;AAAA,GACb;AACA,EAAO,OAAA,cAAA,CAAA;AACT;;;;"}
+{"version":3,"file":"create-rects-from-dom-range.cjs","sources":["../src/create-rects-from-dom-range.ts"],"sourcesContent":["/**\n * MIT License\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n * \n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n * \n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport type { LexicalEditor } from \"lexical\";\n\n/**\n * Creates DOMRects, generally used to help the editor find a specific location on the screen.\n * @param editor - The lexical editor\n * @param range - A fragment of a document that can contain nodes and parts of text nodes.\n * @returns The selectionRects as an array.\n */\nexport function createRectsFromDOMRange(\n  editor: LexicalEditor,\n  range: Range\n): Array<ClientRect> {\n  const rootElement = editor.getRootElement();\n\n  if (rootElement === null) {\n    return [];\n  }\n  const rootRect = rootElement.getBoundingClientRect();\n  const computedStyle = getComputedStyle(rootElement);\n  const rootPadding =\n    parseFloat(computedStyle.paddingLeft) +\n    parseFloat(computedStyle.paddingRight);\n  const selectionRects = Array.from(range.getClientRects());\n  let selectionRectsLength = selectionRects.length;\n  //sort rects from top left to bottom right.\n  selectionRects.sort((a, b) => {\n    const top = a.top - b.top;\n    // Some rects match position closely, but not perfectly,\n    // so we give a 3px tolerance.\n    if (Math.abs(top) <= 3) {\n      return a.left - b.left;\n    }\n    return top;\n  });\n  let prevRect;\n  for (let i = 0; i < selectionRectsLength; i++) {\n    const selectionRect = selectionRects[i];\n    // Exclude rects that overlap preceding Rects in the sorted list.\n    const isOverlappingRect =\n      prevRect &&\n      prevRect.top <= selectionRect.top &&\n      prevRect.top + prevRect.height > selectionRect.top &&\n      prevRect.left + prevRect.width > selectionRect.left;\n    // Exclude selections that span the entire element\n    const selectionSpansElement =\n      selectionRect.width + rootPadding === rootRect.width;\n    if (isOverlappingRect || selectionSpansElement) {\n      selectionRects.splice(i--, 1);\n      selectionRectsLength--;\n      continue;\n    }\n    prevRect = selectionRect;\n  }\n  return selectionRects;\n}\n"],"names":[],"mappings":";;AA+BgB,SAAA,uBAAA,CACd,QACA,KACmB,EAAA;AACnB,EAAM,MAAA,WAAA,GAAc,OAAO,cAAe,EAAA,CAAA;AAE1C,EAAA,IAAI,gBAAgB,IAAM,EAAA;AACxB,IAAA,OAAO,EAAC,CAAA;AAAA,GACV;AACA,EAAM,MAAA,QAAA,GAAW,YAAY,qBAAsB,EAAA,CAAA;AACnD,EAAM,MAAA,aAAA,GAAgB,iBAAiB,WAAW,CAAA,CAAA;AAClD,EAAA,MAAM,cACJ,UAAW,CAAA,aAAA,CAAc,WAAW,CACpC,GAAA,UAAA,CAAW,cAAc,YAAY,CAAA,CAAA;AACvC,EAAA,MAAM,cAAiB,GAAA,KAAA,CAAM,IAAK,CAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA;AACxD,EAAA,IAAI,uBAAuB,cAAe,CAAA,MAAA,CAAA;AAE1C,EAAe,cAAA,CAAA,IAAA,CAAK,CAAC,CAAA,EAAG,CAAM,KAAA;AAC5B,IAAM,MAAA,GAAA,GAAM,CAAE,CAAA,GAAA,GAAM,CAAE,CAAA,GAAA,CAAA;AAGtB,IAAA,IAAI,IAAK,CAAA,GAAA,CAAI,GAAG,CAAA,IAAK,CAAG,EAAA;AACtB,MAAO,OAAA,CAAA,CAAE,OAAO,CAAE,CAAA,IAAA,CAAA;AAAA,KACpB;AACA,IAAO,OAAA,GAAA,CAAA;AAAA,GACR,CAAA,CAAA;AACD,EAAI,IAAA,QAAA,CAAA;AACJ,EAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAI,GAAA,oBAAA,EAAsB,CAAK,EAAA,EAAA;AAC7C,IAAM,MAAA,aAAA,GAAgB,eAAe,CAAC,CAAA,CAAA;AAEtC,IAAA,MAAM,oBACJ,QACA,IAAA,QAAA,CAAS,GAAO,IAAA,aAAA,CAAc,OAC9B,QAAS,CAAA,GAAA,GAAM,QAAS,CAAA,MAAA,GAAS,cAAc,GAC/C,IAAA,QAAA,CAAS,IAAO,GAAA,QAAA,CAAS,QAAQ,aAAc,CAAA,IAAA,CAAA;AAEjD,IAAA,MAAM,qBACJ,GAAA,aAAA,CAAc,KAAQ,GAAA,WAAA,KAAgB,QAAS,CAAA,KAAA,CAAA;AACjD,IAAA,IAAI,qBAAqB,qBAAuB,EAAA;AAC9C,MAAe,cAAA,CAAA,MAAA,CAAO,KAAK,CAAC,CAAA,CAAA;AAC5B,MAAA,oBAAA,EAAA,CAAA;AACA,MAAA,SAAA;AAAA,KACF;AACA,IAAW,QAAA,GAAA,aAAA,CAAA;AAAA,GACb;AACA,EAAO,OAAA,cAAA,CAAA;AACT;;;;"}

package/dist/create-rects-from-dom-range.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-rects-from-dom-range.js","sources":["../src/create-rects-from-dom-range.ts"],"sourcesContent":["/**\n * MIT License\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n * \n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n * \n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport type { LexicalEditor } from \"lexical\";\n\n/**\n * Creates DOMRects, generally used to help the editor find a specific location on the screen.\n * @param editor - The lexical editor\n * @param range - A fragment of a document that can contain nodes and parts of text nodes.\n * @returns The selectionRects as an array.\n */\nexport function createRectsFromDOMRange(\n  editor: LexicalEditor,\n  range: Range\n): Array<ClientRect> {\n  const rootElement = editor.getRootElement();\n\n  if (rootElement === null) {\n    return [];\n  }\n  const rootRect = rootElement.getBoundingClientRect();\n  const computedStyle = getComputedStyle(rootElement);\n  const rootPadding =\n    parseFloat(computedStyle.paddingLeft) +\n    parseFloat(computedStyle.paddingRight);\n  const selectionRects = Array.from(range.getClientRects());\n  let selectionRectsLength = selectionRects.length;\n  //sort rects from top left to bottom right.\n  selectionRects.sort((a, b) => {\n    const top = a.top - b.top;\n    // Some rects match position closely, but not perfectly,\n    // so we give a 3px tolerance.\n    if (Math.abs(top) <= 3) {\n      return a.left - b.left;\n    }\n    return top;\n  });\n  let prevRect;\n  for (let i = 0; i < selectionRectsLength; i++) {\n    const selectionRect = selectionRects[i];\n    // Exclude rects that overlap preceding Rects in the sorted list.\n    const isOverlappingRect =\n      prevRect &&\n      prevRect.top <= selectionRect.top &&\n      prevRect.top + prevRect.height > selectionRect.top &&\n      prevRect.left + prevRect.width > selectionRect.left;\n    // Exclude selections that span the entire element\n    const selectionSpansElement =\n      selectionRect.width + rootPadding === rootRect.width;\n    if (isOverlappingRect || selectionSpansElement) {\n      selectionRects.splice(i--, 1);\n      selectionRectsLength--;\n      continue;\n    }\n    prevRect = selectionRect;\n  }\n  return selectionRects;\n}\n"],"names":[],"mappings":"AA+BgB,SAAA,uBAAA,CACd,QACA,KACmB,EAAA;AACnB,EAAM,MAAA,WAAA,GAAc,OAAO,cAAe,EAAA,CAAA;AAE1C,EAAA,IAAI,gBAAgB,IAAM,EAAA;AACxB,IAAA,OAAO,EAAC,CAAA;AAAA,GACV;AACA,EAAM,MAAA,QAAA,GAAW,YAAY,qBAAsB,EAAA,CAAA;AACnD,EAAM,MAAA,aAAA,GAAgB,iBAAiB,WAAW,CAAA,CAAA;AAClD,EAAA,MAAM,cACJ,UAAW,CAAA,aAAA,CAAc,WAAW,CACpC,GAAA,UAAA,CAAW,cAAc,YAAY,CAAA,CAAA;AACvC,EAAA,MAAM,cAAiB,GAAA,KAAA,CAAM,IAAK,CAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA;AACxD,EAAA,IAAI,uBAAuB,cAAe,CAAA,MAAA,CAAA;AAE1C,EAAe,cAAA,CAAA,IAAA,CAAK,CAAC,CAAA,EAAG,CAAM,KAAA;AAC5B,IAAM,MAAA,GAAA,GAAM,CAAE,CAAA,GAAA,GAAM,CAAE,CAAA,GAAA,CAAA;AAGtB,IAAA,IAAI,IAAK,CAAA,GAAA,CAAI,GAAG,CAAA,IAAK,CAAG,EAAA;AACtB,MAAO,OAAA,CAAA,CAAE,OAAO,CAAE,CAAA,IAAA,CAAA;AAAA,KACpB;AACA,IAAO,OAAA,GAAA,CAAA;AAAA,GACR,CAAA,CAAA;AACD,EAAI,IAAA,QAAA,CAAA;AACJ,EAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAI,GAAA,oBAAA,EAAsB,CAAK,EAAA,EAAA;AAC7C,IAAA,MAAM,gBAAgB,cAAe,CAAA,CAAA,CAAA,CAAA;AAErC,IAAA,MAAM,oBACJ,QACA,IAAA,QAAA,CAAS,GAAO,IAAA,aAAA,CAAc,OAC9B,QAAS,CAAA,GAAA,GAAM,QAAS,CAAA,MAAA,GAAS,cAAc,GAC/C,IAAA,QAAA,CAAS,IAAO,GAAA,QAAA,CAAS,QAAQ,aAAc,CAAA,IAAA,CAAA;AAEjD,IAAA,MAAM,qBACJ,GAAA,aAAA,CAAc,KAAQ,GAAA,WAAA,KAAgB,QAAS,CAAA,KAAA,CAAA;AACjD,IAAA,IAAI,qBAAqB,qBAAuB,EAAA;AAC9C,MAAe,cAAA,CAAA,MAAA,CAAO,KAAK,CAAC,CAAA,CAAA;AAC5B,MAAA,oBAAA,EAAA,CAAA;AACA,MAAA,SAAA;AAAA,KACF;AACA,IAAW,QAAA,GAAA,aAAA,CAAA;AAAA,GACb;AACA,EAAO,OAAA,cAAA,CAAA;AACT;;;;"}
+{"version":3,"file":"create-rects-from-dom-range.js","sources":["../src/create-rects-from-dom-range.ts"],"sourcesContent":["/**\n * MIT License\n * Copyright (c) Meta Platforms, Inc. and affiliates.\n\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n * \n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n * \n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport type { LexicalEditor } from \"lexical\";\n\n/**\n * Creates DOMRects, generally used to help the editor find a specific location on the screen.\n * @param editor - The lexical editor\n * @param range - A fragment of a document that can contain nodes and parts of text nodes.\n * @returns The selectionRects as an array.\n */\nexport function createRectsFromDOMRange(\n  editor: LexicalEditor,\n  range: Range\n): Array<ClientRect> {\n  const rootElement = editor.getRootElement();\n\n  if (rootElement === null) {\n    return [];\n  }\n  const rootRect = rootElement.getBoundingClientRect();\n  const computedStyle = getComputedStyle(rootElement);\n  const rootPadding =\n    parseFloat(computedStyle.paddingLeft) +\n    parseFloat(computedStyle.paddingRight);\n  const selectionRects = Array.from(range.getClientRects());\n  let selectionRectsLength = selectionRects.length;\n  //sort rects from top left to bottom right.\n  selectionRects.sort((a, b) => {\n    const top = a.top - b.top;\n    // Some rects match position closely, but not perfectly,\n    // so we give a 3px tolerance.\n    if (Math.abs(top) <= 3) {\n      return a.left - b.left;\n    }\n    return top;\n  });\n  let prevRect;\n  for (let i = 0; i < selectionRectsLength; i++) {\n    const selectionRect = selectionRects[i];\n    // Exclude rects that overlap preceding Rects in the sorted list.\n    const isOverlappingRect =\n      prevRect &&\n      prevRect.top <= selectionRect.top &&\n      prevRect.top + prevRect.height > selectionRect.top &&\n      prevRect.left + prevRect.width > selectionRect.left;\n    // Exclude selections that span the entire element\n    const selectionSpansElement =\n      selectionRect.width + rootPadding === rootRect.width;\n    if (isOverlappingRect || selectionSpansElement) {\n      selectionRects.splice(i--, 1);\n      selectionRectsLength--;\n      continue;\n    }\n    prevRect = selectionRect;\n  }\n  return selectionRects;\n}\n"],"names":[],"mappings":"AA+BgB,SAAA,uBAAA,CACd,QACA,KACmB,EAAA;AACnB,EAAM,MAAA,WAAA,GAAc,OAAO,cAAe,EAAA,CAAA;AAE1C,EAAA,IAAI,gBAAgB,IAAM,EAAA;AACxB,IAAA,OAAO,EAAC,CAAA;AAAA,GACV;AACA,EAAM,MAAA,QAAA,GAAW,YAAY,qBAAsB,EAAA,CAAA;AACnD,EAAM,MAAA,aAAA,GAAgB,iBAAiB,WAAW,CAAA,CAAA;AAClD,EAAA,MAAM,cACJ,UAAW,CAAA,aAAA,CAAc,WAAW,CACpC,GAAA,UAAA,CAAW,cAAc,YAAY,CAAA,CAAA;AACvC,EAAA,MAAM,cAAiB,GAAA,KAAA,CAAM,IAAK,CAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA;AACxD,EAAA,IAAI,uBAAuB,cAAe,CAAA,MAAA,CAAA;AAE1C,EAAe,cAAA,CAAA,IAAA,CAAK,CAAC,CAAA,EAAG,CAAM,KAAA;AAC5B,IAAM,MAAA,GAAA,GAAM,CAAE,CAAA,GAAA,GAAM,CAAE,CAAA,GAAA,CAAA;AAGtB,IAAA,IAAI,IAAK,CAAA,GAAA,CAAI,GAAG,CAAA,IAAK,CAAG,EAAA;AACtB,MAAO,OAAA,CAAA,CAAE,OAAO,CAAE,CAAA,IAAA,CAAA;AAAA,KACpB;AACA,IAAO,OAAA,GAAA,CAAA;AAAA,GACR,CAAA,CAAA;AACD,EAAI,IAAA,QAAA,CAAA;AACJ,EAAA,KAAA,IAAS,CAAI,GAAA,CAAA,EAAG,CAAI,GAAA,oBAAA,EAAsB,CAAK,EAAA,EAAA;AAC7C,IAAM,MAAA,aAAA,GAAgB,eAAe,CAAC,CAAA,CAAA;AAEtC,IAAA,MAAM,oBACJ,QACA,IAAA,QAAA,CAAS,GAAO,IAAA,aAAA,CAAc,OAC9B,QAAS,CAAA,GAAA,GAAM,QAAS,CAAA,MAAA,GAAS,cAAc,GAC/C,IAAA,QAAA,CAAS,IAAO,GAAA,QAAA,CAAS,QAAQ,aAAc,CAAA,IAAA,CAAA;AAEjD,IAAA,MAAM,qBACJ,GAAA,aAAA,CAAc,KAAQ,GAAA,WAAA,KAAgB,QAAS,CAAA,KAAA,CAAA;AACjD,IAAA,IAAI,qBAAqB,qBAAuB,EAAA;AAC9C,MAAe,cAAA,CAAA,MAAA,CAAO,KAAK,CAAC,CAAA,CAAA;AAC5B,MAAA,oBAAA,EAAA,CAAA;AACA,MAAA,SAAA;AAAA,KACF;AACA,IAAW,QAAA,GAAA,aAAA,CAAA;AAAA,GACb;AACA,EAAO,OAAA,cAAA,CAAA;AACT;;;;"}

package/dist/liveblocks-config.cjs

@@ -11,6 +11,7 @@ function liveblocksConfig(editorConfig) {
     ...editorConfig,
     nodes,
     editorState: null
+    // explicitly null because CollabProvider requires it
   };
 }
 

package/dist/liveblocks-config.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"liveblocks-config.cjs","sources":["../src/liveblocks-config.ts"],"sourcesContent":["import type { InitialConfigType } from \"@lexical/react/LexicalComposer\";\n\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\n\n/**\n * Function that takes a Lexical editor config and modifies it to add the necessary\n * `nodes` and `theme` to make `LiveblocksPlugin` works correctly.\n *\n * @example\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport function liveblocksConfig(\n  editorConfig: Omit<InitialConfigType, \"editorState\">\n) {\n  const nodes = [...(editorConfig.nodes ?? [])];\n\n  nodes.push(ThreadMarkNode, MentionNode, GroupMentionNode);\n\n  return {\n    ...editorConfig,\n    nodes,\n    editorState: null, // explicitly null because CollabProvider requires it\n  };\n}\n"],"names":["ThreadMarkNode","MentionNode","GroupMentionNode"],"mappings":";;;;;;AAqCO,SAAS,iBACd,YACA,EAAA;AACA,EAAA,MAAM,QAAQ,CAAC,GAAI,YAAa,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AAE5C,EAAM,KAAA,CAAA,IAAA,CAAKA,6BAAgB,EAAAC,uBAAA,EAAaC,iCAAgB,CAAA,CAAA;AAExD,EAAO,OAAA;AAAA,IACL,GAAG,YAAA;AAAA,IACH,KAAA;AAAA,IACA,WAAa,EAAA,IAAA;AAAA,GACf,CAAA;AACF;;;;"}
+{"version":3,"file":"liveblocks-config.cjs","sources":["../src/liveblocks-config.ts"],"sourcesContent":["import type { InitialConfigType } from \"@lexical/react/LexicalComposer\";\n\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\n\n/**\n * Function that takes a Lexical editor config and modifies it to add the necessary\n * `nodes` and `theme` to make `LiveblocksPlugin` works correctly.\n *\n * @example\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport function liveblocksConfig(\n  editorConfig: Omit<InitialConfigType, \"editorState\">\n) {\n  const nodes = [...(editorConfig.nodes ?? [])];\n\n  nodes.push(ThreadMarkNode, MentionNode, GroupMentionNode);\n\n  return {\n    ...editorConfig,\n    nodes,\n    editorState: null, // explicitly null because CollabProvider requires it\n  };\n}\n"],"names":["ThreadMarkNode","MentionNode","GroupMentionNode"],"mappings":";;;;;;AAqCO,SAAS,iBACd,YACA,EAAA;AACA,EAAA,MAAM,QAAQ,CAAC,GAAI,YAAa,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AAE5C,EAAM,KAAA,CAAA,IAAA,CAAKA,6BAAgB,EAAAC,uBAAA,EAAaC,iCAAgB,CAAA,CAAA;AAExD,EAAO,OAAA;AAAA,IACL,GAAG,YAAA;AAAA,IACH,KAAA;AAAA,IACA,WAAa,EAAA,IAAA;AAAA;AAAA,GACf,CAAA;AACF;;;;"}

package/dist/liveblocks-config.js

@@ -9,6 +9,7 @@ function liveblocksConfig(editorConfig) {
     ...editorConfig,
     nodes,
     editorState: null
+    // explicitly null because CollabProvider requires it
   };
 }
 

package/dist/liveblocks-config.js.map

@@ -1 +1 @@
-{"version":3,"file":"liveblocks-config.js","sources":["../src/liveblocks-config.ts"],"sourcesContent":["import type { InitialConfigType } from \"@lexical/react/LexicalComposer\";\n\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\n\n/**\n * Function that takes a Lexical editor config and modifies it to add the necessary\n * `nodes` and `theme` to make `LiveblocksPlugin` works correctly.\n *\n * @example\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport function liveblocksConfig(\n  editorConfig: Omit<InitialConfigType, \"editorState\">\n) {\n  const nodes = [...(editorConfig.nodes ?? [])];\n\n  nodes.push(ThreadMarkNode, MentionNode, GroupMentionNode);\n\n  return {\n    ...editorConfig,\n    nodes,\n    editorState: null, // explicitly null because CollabProvider requires it\n  };\n}\n"],"names":[],"mappings":";;;;AAqCO,SAAS,iBACd,YACA,EAAA;AACA,EAAA,MAAM,QAAQ,CAAC,GAAI,YAAa,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AAE5C,EAAM,KAAA,CAAA,IAAA,CAAK,cAAgB,EAAA,WAAA,EAAa,gBAAgB,CAAA,CAAA;AAExD,EAAO,OAAA;AAAA,IACL,GAAG,YAAA;AAAA,IACH,KAAA;AAAA,IACA,WAAa,EAAA,IAAA;AAAA,GACf,CAAA;AACF;;;;"}
+{"version":3,"file":"liveblocks-config.js","sources":["../src/liveblocks-config.ts"],"sourcesContent":["import type { InitialConfigType } from \"@lexical/react/LexicalComposer\";\n\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\n\n/**\n * Function that takes a Lexical editor config and modifies it to add the necessary\n * `nodes` and `theme` to make `LiveblocksPlugin` works correctly.\n *\n * @example\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport function liveblocksConfig(\n  editorConfig: Omit<InitialConfigType, \"editorState\">\n) {\n  const nodes = [...(editorConfig.nodes ?? [])];\n\n  nodes.push(ThreadMarkNode, MentionNode, GroupMentionNode);\n\n  return {\n    ...editorConfig,\n    nodes,\n    editorState: null, // explicitly null because CollabProvider requires it\n  };\n}\n"],"names":[],"mappings":";;;;AAqCO,SAAS,iBACd,YACA,EAAA;AACA,EAAA,MAAM,QAAQ,CAAC,GAAI,YAAa,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA;AAE5C,EAAM,KAAA,CAAA,IAAA,CAAK,cAAgB,EAAA,WAAA,EAAa,gBAAgB,CAAA,CAAA;AAExD,EAAO,OAAA;AAAA,IACL,GAAG,YAAA;AAAA,IACH,KAAA;AAAA,IACA,WAAa,EAAA,IAAA;AAAA;AAAA,GACf,CAAA;AACF;;;;"}

package/dist/liveblocks-plugin-provider.cjs

@@ -96,9 +96,10 @@ const LiveblocksPlugin = ({
     },
     [setFloating, setContainerRef]
   );
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
         ref: handleFloatingRef,
         className: "lb-root lb-lexical-cursors",
         style: {
@@ -108,21 +109,23 @@ const LiveblocksPlugin = ({
           transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
           minWidth: "max-content"
         }
-      }),
-      self && /* @__PURE__ */ jsxRuntime.jsx(LexicalCollaborationPlugin.CollaborationPlugin, {
+      }
+    ),
+    self && /* @__PURE__ */ jsxRuntime.jsx(
+      LexicalCollaborationPlugin.CollaborationPlugin,
+      {
         id: room.id,
         providerFactory,
         username: self.info?.name ?? "",
         cursorColor: self.info?.color,
         cursorsContainerRef: containerRef,
         shouldBootstrap: true
-      }, room.id),
-      isResolveMentionSuggestionsDefined && /* @__PURE__ */ jsxRuntime.jsx(mentionPlugin.MentionPlugin, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(commentPluginProvider.CommentPluginProvider, {
-        children
-      })
-    ]
-  });
+      },
+      room.id
+    ),
+    isResolveMentionSuggestionsDefined && /* @__PURE__ */ jsxRuntime.jsx(mentionPlugin.MentionPlugin, {}),
+    /* @__PURE__ */ jsxRuntime.jsx(commentPluginProvider.CommentPluginProvider, { children })
+  ] });
 };
 
 exports.LiveblocksPlugin = LiveblocksPlugin;

package/dist/liveblocks-plugin-provider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"liveblocks-plugin-provider.cjs","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useReportTextEditor,\n  useResolveMentionSuggestions,\n  useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\nimport { useRootElement } from \"./use-root-element\";\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n  const yjsProvider = useYjsProvider();\n\n  const getSnapshot = useCallback(() => {\n    const status = yjsProvider?.getStatus();\n    return status === \"synchronizing\" || status === \"synchronized\";\n  }, [yjsProvider]);\n\n  const subscribe = useCallback(\n    (callback: () => void) => {\n      if (yjsProvider === undefined) return () => {};\n      yjsProvider.on(\"status\", callback);\n      return () => {\n        yjsProvider.off(\"status\", callback);\n      };\n    },\n    [yjsProvider]\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n  children?: ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport const LiveblocksPlugin = ({\n  children,\n}: LiveblocksPluginProps): JSX.Element => {\n  const isResolveMentionSuggestionsDefined =\n    useResolveMentionSuggestions() !== undefined;\n  const [editor] = useLexicalComposerContext();\n  const room = useRoom();\n\n  if (!editor.hasNodes([ThreadMarkNode, MentionNode, GroupMentionNode])) {\n    throw new Error(\n      \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n    );\n  }\n\n  const [containerRef, setContainerRef] = useState<\n    MutableRefObject<HTMLDivElement | null> | undefined\n  >(undefined);\n\n  const {\n    refs: { setReference, setFloating },\n    strategy,\n    x,\n    y,\n  } = useFloating({\n    strategy: \"fixed\",\n    placement: \"bottom\",\n    whileElementsMounted: (...args) => {\n      return autoUpdate(...args, {\n        animationFrame: true,\n      });\n    },\n  });\n\n  // Warn users if initialConfig.editorState, set on the composer, is not null\n  useEffect(() => {\n    // only in dev mode\n    if (process.env.NODE_ENV !== \"production\") {\n      // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n      if (!editor.getEditorState().isEmpty()) {\n        console.warn(\n          \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n        );\n      }\n    }\n\n    // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n  // Get user info or allow override from props\n  const self = useSelf();\n\n  const providerFactory = useCallback(\n    (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n      const provider = getYjsProviderForRoom(room);\n      yjsDocMap.set(id, provider.getYDoc());\n\n      return provider as Provider;\n    },\n    [room]\n  );\n\n  const root = useRootElement();\n\n  useLayoutEffect(() => {\n    if (root === null) return;\n    setReference({\n      getBoundingClientRect: () => root.getBoundingClientRect(),\n    });\n  }, [setReference, root]);\n\n  const handleFloatingRef = useCallback(\n    (node: HTMLDivElement) => {\n      setFloating(node);\n      setContainerRef({ current: node });\n    },\n    [setFloating, setContainerRef]\n  );\n\n  return (\n    <>\n      <div\n        ref={handleFloatingRef}\n        className=\"lb-root lb-lexical-cursors\"\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        }}\n      />\n\n      {self && (\n        <CollaborationPlugin\n          // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n          // without implementing `reload` event\n          key={room.id}\n          id={room.id}\n          providerFactory={providerFactory}\n          username={self.info?.name ?? \"\"} // use empty string to prevent random name\n          cursorColor={self.info?.color as string | undefined}\n          cursorsContainerRef={containerRef}\n          shouldBootstrap={true}\n        />\n      )}\n\n      {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n      <CommentPluginProvider>{children}</CommentPluginProvider>\n    </>\n  );\n};\n"],"names":["useYjsProvider","useCallback","useSyncExternalStore","useResolveMentionSuggestions","useLexicalComposerContext","useRoom","ThreadMarkNode","MentionNode","GroupMentionNode","useState","useFloating","autoUpdate","useEffect","useReportTextEditor","TextEditorType","useSelf","getYjsProviderForRoom","useRootElement","useLayoutEffect","jsxs","Fragment","jsx","CollaborationPlugin","MentionPlugin","CommentPluginProvider"],"mappings":"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"}
+{"version":3,"file":"liveblocks-plugin-provider.cjs","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useReportTextEditor,\n  useResolveMentionSuggestions,\n  useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\nimport { useRootElement } from \"./use-root-element\";\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n  const yjsProvider = useYjsProvider();\n\n  const getSnapshot = useCallback(() => {\n    const status = yjsProvider?.getStatus();\n    return status === \"synchronizing\" || status === \"synchronized\";\n  }, [yjsProvider]);\n\n  const subscribe = useCallback(\n    (callback: () => void) => {\n      if (yjsProvider === undefined) return () => {};\n      yjsProvider.on(\"status\", callback);\n      return () => {\n        yjsProvider.off(\"status\", callback);\n      };\n    },\n    [yjsProvider]\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n  children?: ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport const LiveblocksPlugin = ({\n  children,\n}: LiveblocksPluginProps): JSX.Element => {\n  const isResolveMentionSuggestionsDefined =\n    useResolveMentionSuggestions() !== undefined;\n  const [editor] = useLexicalComposerContext();\n  const room = useRoom();\n\n  if (!editor.hasNodes([ThreadMarkNode, MentionNode, GroupMentionNode])) {\n    throw new Error(\n      \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n    );\n  }\n\n  const [containerRef, setContainerRef] = useState<\n    MutableRefObject<HTMLDivElement | null> | undefined\n  >(undefined);\n\n  const {\n    refs: { setReference, setFloating },\n    strategy,\n    x,\n    y,\n  } = useFloating({\n    strategy: \"fixed\",\n    placement: \"bottom\",\n    whileElementsMounted: (...args) => {\n      return autoUpdate(...args, {\n        animationFrame: true,\n      });\n    },\n  });\n\n  // Warn users if initialConfig.editorState, set on the composer, is not null\n  useEffect(() => {\n    // only in dev mode\n    if (process.env.NODE_ENV !== \"production\") {\n      // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n      if (!editor.getEditorState().isEmpty()) {\n        console.warn(\n          \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n        );\n      }\n    }\n\n    // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n  // Get user info or allow override from props\n  const self = useSelf();\n\n  const providerFactory = useCallback(\n    (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n      const provider = getYjsProviderForRoom(room);\n      yjsDocMap.set(id, provider.getYDoc());\n\n      return provider as Provider;\n    },\n    [room]\n  );\n\n  const root = useRootElement();\n\n  useLayoutEffect(() => {\n    if (root === null) return;\n    setReference({\n      getBoundingClientRect: () => root.getBoundingClientRect(),\n    });\n  }, [setReference, root]);\n\n  const handleFloatingRef = useCallback(\n    (node: HTMLDivElement) => {\n      setFloating(node);\n      setContainerRef({ current: node });\n    },\n    [setFloating, setContainerRef]\n  );\n\n  return (\n    <>\n      <div\n        ref={handleFloatingRef}\n        className=\"lb-root lb-lexical-cursors\"\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        }}\n      />\n\n      {self && (\n        <CollaborationPlugin\n          // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n          // without implementing `reload` event\n          key={room.id}\n          id={room.id}\n          providerFactory={providerFactory}\n          username={self.info?.name ?? \"\"} // use empty string to prevent random name\n          cursorColor={self.info?.color as string | undefined}\n          cursorsContainerRef={containerRef}\n          shouldBootstrap={true}\n        />\n      )}\n\n      {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n      <CommentPluginProvider>{children}</CommentPluginProvider>\n    </>\n  );\n};\n"],"names":["useYjsProvider","useCallback","useSyncExternalStore","useResolveMentionSuggestions","useLexicalComposerContext","useRoom","ThreadMarkNode","MentionNode","GroupMentionNode","useState","useFloating","autoUpdate","useEffect","useReportTextEditor","TextEditorType","useSelf","getYjsProviderForRoom","useRootElement","useLayoutEffect","jsxs","Fragment","jsx","CollaborationPlugin","MentionPlugin","CommentPluginProvider"],"mappings":"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"}

package/dist/liveblocks-plugin-provider.js

@@ -94,9 +94,10 @@ const LiveblocksPlugin = ({
     },
     [setFloating, setContainerRef]
   );
-  return /* @__PURE__ */ jsxs(Fragment, {
-    children: [
-      /* @__PURE__ */ jsx("div", {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
         ref: handleFloatingRef,
         className: "lb-root lb-lexical-cursors",
         style: {
@@ -106,21 +107,23 @@ const LiveblocksPlugin = ({
           transform: `translate3d(${Math.round(x)}px, ${Math.round(y)}px, 0)`,
           minWidth: "max-content"
         }
-      }),
-      self && /* @__PURE__ */ jsx(CollaborationPlugin, {
+      }
+    ),
+    self && /* @__PURE__ */ jsx(
+      CollaborationPlugin,
+      {
         id: room.id,
         providerFactory,
         username: self.info?.name ?? "",
         cursorColor: self.info?.color,
         cursorsContainerRef: containerRef,
         shouldBootstrap: true
-      }, room.id),
-      isResolveMentionSuggestionsDefined && /* @__PURE__ */ jsx(MentionPlugin, {}),
-      /* @__PURE__ */ jsx(CommentPluginProvider, {
-        children
-      })
-    ]
-  });
+      },
+      room.id
+    ),
+    isResolveMentionSuggestionsDefined && /* @__PURE__ */ jsx(MentionPlugin, {}),
+    /* @__PURE__ */ jsx(CommentPluginProvider, { children })
+  ] });
 };
 
 export { LiveblocksPlugin, useIsEditorReady };

package/dist/liveblocks-plugin-provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"liveblocks-plugin-provider.js","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useReportTextEditor,\n  useResolveMentionSuggestions,\n  useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\nimport { useRootElement } from \"./use-root-element\";\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n  const yjsProvider = useYjsProvider();\n\n  const getSnapshot = useCallback(() => {\n    const status = yjsProvider?.getStatus();\n    return status === \"synchronizing\" || status === \"synchronized\";\n  }, [yjsProvider]);\n\n  const subscribe = useCallback(\n    (callback: () => void) => {\n      if (yjsProvider === undefined) return () => {};\n      yjsProvider.on(\"status\", callback);\n      return () => {\n        yjsProvider.off(\"status\", callback);\n      };\n    },\n    [yjsProvider]\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n  children?: ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport const LiveblocksPlugin = ({\n  children,\n}: LiveblocksPluginProps): JSX.Element => {\n  const isResolveMentionSuggestionsDefined =\n    useResolveMentionSuggestions() !== undefined;\n  const [editor] = useLexicalComposerContext();\n  const room = useRoom();\n\n  if (!editor.hasNodes([ThreadMarkNode, MentionNode, GroupMentionNode])) {\n    throw new Error(\n      \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n    );\n  }\n\n  const [containerRef, setContainerRef] = useState<\n    MutableRefObject<HTMLDivElement | null> | undefined\n  >(undefined);\n\n  const {\n    refs: { setReference, setFloating },\n    strategy,\n    x,\n    y,\n  } = useFloating({\n    strategy: \"fixed\",\n    placement: \"bottom\",\n    whileElementsMounted: (...args) => {\n      return autoUpdate(...args, {\n        animationFrame: true,\n      });\n    },\n  });\n\n  // Warn users if initialConfig.editorState, set on the composer, is not null\n  useEffect(() => {\n    // only in dev mode\n    if (process.env.NODE_ENV !== \"production\") {\n      // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n      if (!editor.getEditorState().isEmpty()) {\n        console.warn(\n          \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n        );\n      }\n    }\n\n    // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n  // Get user info or allow override from props\n  const self = useSelf();\n\n  const providerFactory = useCallback(\n    (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n      const provider = getYjsProviderForRoom(room);\n      yjsDocMap.set(id, provider.getYDoc());\n\n      return provider as Provider;\n    },\n    [room]\n  );\n\n  const root = useRootElement();\n\n  useLayoutEffect(() => {\n    if (root === null) return;\n    setReference({\n      getBoundingClientRect: () => root.getBoundingClientRect(),\n    });\n  }, [setReference, root]);\n\n  const handleFloatingRef = useCallback(\n    (node: HTMLDivElement) => {\n      setFloating(node);\n      setContainerRef({ current: node });\n    },\n    [setFloating, setContainerRef]\n  );\n\n  return (\n    <>\n      <div\n        ref={handleFloatingRef}\n        className=\"lb-root lb-lexical-cursors\"\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        }}\n      />\n\n      {self && (\n        <CollaborationPlugin\n          // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n          // without implementing `reload` event\n          key={room.id}\n          id={room.id}\n          providerFactory={providerFactory}\n          username={self.info?.name ?? \"\"} // use empty string to prevent random name\n          cursorColor={self.info?.color as string | undefined}\n          cursorsContainerRef={containerRef}\n          shouldBootstrap={true}\n        />\n      )}\n\n      {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n      <CommentPluginProvider>{children}</CommentPluginProvider>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"liveblocks-plugin-provider.js","sources":["../src/liveblocks-plugin-provider.tsx"],"sourcesContent":["import { autoUpdate, useFloating } from \"@floating-ui/react-dom\";\nimport { CollaborationPlugin } from \"@lexical/react/LexicalCollaborationPlugin\";\nimport { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport type { Provider } from \"@lexical/yjs\";\nimport { TextEditorType } from \"@liveblocks/core\";\nimport { useRoom, useSelf } from \"@liveblocks/react\";\nimport {\n  useLayoutEffect,\n  useReportTextEditor,\n  useResolveMentionSuggestions,\n  useYjsProvider,\n} from \"@liveblocks/react/_private\";\nimport { getYjsProviderForRoom } from \"@liveblocks/yjs\";\nimport type { MutableRefObject, ReactNode } from \"react\";\nimport { useCallback, useEffect, useState, useSyncExternalStore } from \"react\";\nimport type { Doc } from \"yjs\";\n\nimport { CommentPluginProvider } from \"./comments/comment-plugin-provider\";\nimport { ThreadMarkNode } from \"./comments/thread-mark-node\";\nimport { GroupMentionNode } from \"./mentions/group-mention-node\";\nimport { MentionNode } from \"./mentions/mention-node\";\nimport { MentionPlugin } from \"./mentions/mention-plugin\";\nimport { useRootElement } from \"./use-root-element\";\n\n/**\n * Returns whether the editor has loaded the initial text contents from the\n * server and is ready to be used.\n */\nexport function useIsEditorReady(): boolean {\n  const yjsProvider = useYjsProvider();\n\n  const getSnapshot = useCallback(() => {\n    const status = yjsProvider?.getStatus();\n    return status === \"synchronizing\" || status === \"synchronized\";\n  }, [yjsProvider]);\n\n  const subscribe = useCallback(\n    (callback: () => void) => {\n      if (yjsProvider === undefined) return () => {};\n      yjsProvider.on(\"status\", callback);\n      return () => {\n        yjsProvider.off(\"status\", callback);\n      };\n    },\n    [yjsProvider]\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\nexport type LiveblocksPluginProps = {\n  children?: ReactNode;\n};\n\n/**\n * Liveblocks plugin for Lexical that adds collaboration to your editor.\n *\n * `LiveblocksPlugin` should always be nested inside `LexicalComposer`.\n *\n * @example\n *\n * import { LexicalComposer } from \"@lexical/react/LexicalComposer\";\n * import { RichTextPlugin } from \"@lexical/react/LexicalRichTextPlugin\";\n * import { ContentEditable } from \"@lexical/react/LexicalContentEditable\";\n * import { LexicalErrorBoundary } from \"@lexical/react/LexicalErrorBoundary\";\n * import { liveblocksConfig, LiveblocksPlugin } from \"@liveblocks/react-lexical\";\n *\n * const initialConfig = liveblocksConfig({\n *   namespace: \"MyEditor\",\n *   theme: {},\n *   nodes: [],\n *   onError: (err) => console.error(err),\n * });\n *\n * function Editor() {\n *   return (\n *     <LexicalComposer initialConfig={initialConfig}>\n *       <LiveblocksPlugin />\n *       <RichTextPlugin\n *         contentEditable={<ContentEditable />}\n *         placeholder={<div>Enter some text...</div>}\n *         ErrorBoundary={LexicalErrorBoundary}\n *       />\n *     </LexicalComposer>\n *   );\n * }\n */\nexport const LiveblocksPlugin = ({\n  children,\n}: LiveblocksPluginProps): JSX.Element => {\n  const isResolveMentionSuggestionsDefined =\n    useResolveMentionSuggestions() !== undefined;\n  const [editor] = useLexicalComposerContext();\n  const room = useRoom();\n\n  if (!editor.hasNodes([ThreadMarkNode, MentionNode, GroupMentionNode])) {\n    throw new Error(\n      \"LiveblocksPlugin requires Lexical configuration to be wrapped in the `liveblocksConfig(options)` function. For more information: https://liveblocks.io/docs/api-reference/liveblocks-react-lexical#liveblocksConfig\"\n    );\n  }\n\n  const [containerRef, setContainerRef] = useState<\n    MutableRefObject<HTMLDivElement | null> | undefined\n  >(undefined);\n\n  const {\n    refs: { setReference, setFloating },\n    strategy,\n    x,\n    y,\n  } = useFloating({\n    strategy: \"fixed\",\n    placement: \"bottom\",\n    whileElementsMounted: (...args) => {\n      return autoUpdate(...args, {\n        animationFrame: true,\n      });\n    },\n  });\n\n  // Warn users if initialConfig.editorState, set on the composer, is not null\n  useEffect(() => {\n    // only in dev mode\n    if (process.env.NODE_ENV !== \"production\") {\n      // A user should not even be set an emptyState, but when passing null, getEditorState still has initial empty state\n      if (!editor.getEditorState().isEmpty()) {\n        console.warn(\n          \"Warning: LiveblocksPlugin: editorState in initialConfig detected, but must be null.\"\n        );\n      }\n    }\n\n    // we know editor is already defined as we're inside LexicalComposer, and we only want this running the first time\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  useReportTextEditor(TextEditorType.Lexical, \"root\");\n\n  // Get user info or allow override from props\n  const self = useSelf();\n\n  const providerFactory = useCallback(\n    (id: string, yjsDocMap: Map<string, Doc>): Provider => {\n      const provider = getYjsProviderForRoom(room);\n      yjsDocMap.set(id, provider.getYDoc());\n\n      return provider as Provider;\n    },\n    [room]\n  );\n\n  const root = useRootElement();\n\n  useLayoutEffect(() => {\n    if (root === null) return;\n    setReference({\n      getBoundingClientRect: () => root.getBoundingClientRect(),\n    });\n  }, [setReference, root]);\n\n  const handleFloatingRef = useCallback(\n    (node: HTMLDivElement) => {\n      setFloating(node);\n      setContainerRef({ current: node });\n    },\n    [setFloating, setContainerRef]\n  );\n\n  return (\n    <>\n      <div\n        ref={handleFloatingRef}\n        className=\"lb-root lb-lexical-cursors\"\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        }}\n      />\n\n      {self && (\n        <CollaborationPlugin\n          // Setting the key allows us to reset the internal Y.doc used by useYjsCollaboration\n          // without implementing `reload` event\n          key={room.id}\n          id={room.id}\n          providerFactory={providerFactory}\n          username={self.info?.name ?? \"\"} // use empty string to prevent random name\n          cursorColor={self.info?.color as string | undefined}\n          cursorsContainerRef={containerRef}\n          shouldBootstrap={true}\n        />\n      )}\n\n      {isResolveMentionSuggestionsDefined && <MentionPlugin />}\n      <CommentPluginProvider>{children}</CommentPluginProvider>\n    </>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/mentions/group-mention-node.cjs

@@ -10,15 +10,10 @@ function GroupMention({
   mention,
   nodeKey
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(mentionComponent.Mention, {
-    nodeKey,
-    children: [
-      core.MENTION_CHARACTER,
-      /* @__PURE__ */ jsxRuntime.jsx(_private.Group, {
-        groupId: mention.id
-      })
-    ]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(mentionComponent.Mention, { nodeKey, children: [
+    core.MENTION_CHARACTER,
+    /* @__PURE__ */ jsxRuntime.jsx(_private.Group, { groupId: mention.id })
+  ] });
 }
 class GroupMentionNode extends lexical.DecoratorNode {
   __id;
@@ -121,10 +116,7 @@ class GroupMentionNode extends lexical.DecoratorNode {
       kind: "group",
       userIds: this.getUserIds()
     };
-    return /* @__PURE__ */ jsxRuntime.jsx(GroupMention, {
-      mention,
-      nodeKey: this.getKey()
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(GroupMention, { mention, nodeKey: this.getKey() });
   }
 }
 function $isGroupMentionNode(node) {

package/dist/mentions/group-mention-node.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"group-mention-node.cjs","sources":["../../src/mentions/group-mention-node.tsx"],"sourcesContent":["import {\n  createInboxNotificationId,\n  type GroupMentionData,\n  MENTION_CHARACTER,\n} from \"@liveblocks/core\";\nimport { Group } from \"@liveblocks/react-ui/_private\";\nimport type {\n  DOMConversionMap,\n  DOMExportOutput,\n  LexicalNode,\n  NodeKey,\n  SerializedLexicalNode,\n  Spread,\n} from \"lexical\";\nimport { $applyNodeReplacement, DecoratorNode } from \"lexical\";\nimport type { JSX } from \"react\";\n\nimport { Mention } from \"./mention-component\";\n\nexport type SerializedGroupMentionNode = Spread<\n  {\n    groupId: string;\n    userIds?: string[];\n  },\n  SerializedLexicalNode\n>;\n\nfunction GroupMention({\n  mention,\n  nodeKey,\n}: {\n  mention: GroupMentionData;\n  nodeKey: string;\n}) {\n  return (\n    <Mention nodeKey={nodeKey}>\n      {MENTION_CHARACTER}\n      <Group groupId={mention.id} />\n    </Mention>\n  );\n}\n\nexport class GroupMentionNode extends DecoratorNode<JSX.Element> {\n  __id: string;\n  __groupId: string;\n  __userIds: string[] | undefined;\n\n  constructor(\n    id: string,\n    groupId: string,\n    userIds: string[] | undefined,\n    key?: NodeKey\n  ) {\n    super(key);\n    this.__id = id;\n    this.__groupId = groupId;\n    this.__userIds = userIds;\n  }\n\n  static getType(): string {\n    return \"lb-group-mention\";\n  }\n\n  static clone(node: GroupMentionNode): GroupMentionNode {\n    return new GroupMentionNode(\n      node.__id,\n      node.__groupId,\n      node.__userIds,\n      node.__key\n    );\n  }\n\n  createDOM(): HTMLElement {\n    const element = document.createElement(\"span\");\n    element.style.display = \"inline-block\";\n    element.style.userSelect = \"none\";\n    return element;\n  }\n\n  updateDOM(): boolean {\n    return false;\n  }\n\n  static importDom(): DOMConversionMap<HTMLElement> | null {\n    return {\n      span: () => ({\n        conversion: (element) => {\n          const groupId = element.getAttribute(\"data-lexical-lb-group-mention\");\n\n          if (!groupId) {\n            return null;\n          }\n\n          const userIdsAttribute = element.getAttribute(\n            \"data-lexical-lb-user-ids\"\n          );\n          let userIds: string[] | undefined;\n\n          if (userIdsAttribute) {\n            try {\n              const parsedUserIds = JSON.parse(userIdsAttribute) as string[];\n\n              if (Array.isArray(parsedUserIds)) {\n                userIds = parsedUserIds;\n              }\n            } catch {\n              // Invalid userIds attribute\n            }\n          }\n\n          const node = $createGroupMentionNode(groupId, userIds);\n          return { node };\n        },\n        priority: 1,\n      }),\n    };\n  }\n\n  exportDOM(): DOMExportOutput {\n    const element = document.createElement(\"span\");\n    element.setAttribute(\"data-lexical-lb-group-mention\", this.getGroupId());\n    element.setAttribute(\n      \"data-lexical-lb-group-mention-users\",\n      JSON.stringify(this.getUserIds())\n    );\n    element.textContent = this.getTextContent();\n    return { element };\n  }\n\n  static importJSON(\n    serializedNode: SerializedGroupMentionNode\n  ): GroupMentionNode {\n    const node = $createGroupMentionNode(\n      serializedNode.groupId,\n      serializedNode.userIds\n    );\n    return node;\n  }\n\n  exportJSON(): SerializedGroupMentionNode {\n    return {\n      groupId: this.__groupId,\n      userIds: this.__userIds,\n      type: \"lb-group-mention\",\n      version: 1,\n    };\n  }\n\n  getGroupId(): string {\n    const self = this.getLatest();\n    return self.__groupId;\n  }\n\n  getId(): string {\n    const self = this.getLatest();\n    return self.__id;\n  }\n\n  getUserIds(): string[] | undefined {\n    const self = this.getLatest();\n    return self.__userIds;\n  }\n\n  decorate(): JSX.Element {\n    const mention: GroupMentionData = {\n      id: this.getGroupId(),\n      kind: \"group\",\n      userIds: this.getUserIds(),\n    };\n\n    return <GroupMention mention={mention} nodeKey={this.getKey()} />;\n  }\n}\n\nexport function $isGroupMentionNode(\n  node: LexicalNode | null | undefined\n): node is GroupMentionNode {\n  return node instanceof GroupMentionNode;\n}\n\nexport function $createGroupMentionNode(\n  groupId: string,\n  userIds: string[] | undefined\n): GroupMentionNode {\n  const node = new GroupMentionNode(\n    createInboxNotificationId(),\n    groupId,\n    userIds\n  );\n  return $applyNodeReplacement(node);\n}\n"],"names":["jsxs","Mention","MENTION_CHARACTER","jsx","Group","DecoratorNode","createInboxNotificationId","$applyNodeReplacement"],"mappings":"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"}
+{"version":3,"file":"group-mention-node.cjs","sources":["../../src/mentions/group-mention-node.tsx"],"sourcesContent":["import {\n  createInboxNotificationId,\n  type GroupMentionData,\n  MENTION_CHARACTER,\n} from \"@liveblocks/core\";\nimport { Group } from \"@liveblocks/react-ui/_private\";\nimport type {\n  DOMConversionMap,\n  DOMExportOutput,\n  LexicalNode,\n  NodeKey,\n  SerializedLexicalNode,\n  Spread,\n} from \"lexical\";\nimport { $applyNodeReplacement, DecoratorNode } from \"lexical\";\nimport type { JSX } from \"react\";\n\nimport { Mention } from \"./mention-component\";\n\nexport type SerializedGroupMentionNode = Spread<\n  {\n    groupId: string;\n    userIds?: string[];\n  },\n  SerializedLexicalNode\n>;\n\nfunction GroupMention({\n  mention,\n  nodeKey,\n}: {\n  mention: GroupMentionData;\n  nodeKey: string;\n}) {\n  return (\n    <Mention nodeKey={nodeKey}>\n      {MENTION_CHARACTER}\n      <Group groupId={mention.id} />\n    </Mention>\n  );\n}\n\nexport class GroupMentionNode extends DecoratorNode<JSX.Element> {\n  __id: string;\n  __groupId: string;\n  __userIds: string[] | undefined;\n\n  constructor(\n    id: string,\n    groupId: string,\n    userIds: string[] | undefined,\n    key?: NodeKey\n  ) {\n    super(key);\n    this.__id = id;\n    this.__groupId = groupId;\n    this.__userIds = userIds;\n  }\n\n  static getType(): string {\n    return \"lb-group-mention\";\n  }\n\n  static clone(node: GroupMentionNode): GroupMentionNode {\n    return new GroupMentionNode(\n      node.__id,\n      node.__groupId,\n      node.__userIds,\n      node.__key\n    );\n  }\n\n  createDOM(): HTMLElement {\n    const element = document.createElement(\"span\");\n    element.style.display = \"inline-block\";\n    element.style.userSelect = \"none\";\n    return element;\n  }\n\n  updateDOM(): boolean {\n    return false;\n  }\n\n  static importDom(): DOMConversionMap<HTMLElement> | null {\n    return {\n      span: () => ({\n        conversion: (element) => {\n          const groupId = element.getAttribute(\"data-lexical-lb-group-mention\");\n\n          if (!groupId) {\n            return null;\n          }\n\n          const userIdsAttribute = element.getAttribute(\n            \"data-lexical-lb-user-ids\"\n          );\n          let userIds: string[] | undefined;\n\n          if (userIdsAttribute) {\n            try {\n              const parsedUserIds = JSON.parse(userIdsAttribute) as string[];\n\n              if (Array.isArray(parsedUserIds)) {\n                userIds = parsedUserIds;\n              }\n            } catch {\n              // Invalid userIds attribute\n            }\n          }\n\n          const node = $createGroupMentionNode(groupId, userIds);\n          return { node };\n        },\n        priority: 1,\n      }),\n    };\n  }\n\n  exportDOM(): DOMExportOutput {\n    const element = document.createElement(\"span\");\n    element.setAttribute(\"data-lexical-lb-group-mention\", this.getGroupId());\n    element.setAttribute(\n      \"data-lexical-lb-group-mention-users\",\n      JSON.stringify(this.getUserIds())\n    );\n    element.textContent = this.getTextContent();\n    return { element };\n  }\n\n  static importJSON(\n    serializedNode: SerializedGroupMentionNode\n  ): GroupMentionNode {\n    const node = $createGroupMentionNode(\n      serializedNode.groupId,\n      serializedNode.userIds\n    );\n    return node;\n  }\n\n  exportJSON(): SerializedGroupMentionNode {\n    return {\n      groupId: this.__groupId,\n      userIds: this.__userIds,\n      type: \"lb-group-mention\",\n      version: 1,\n    };\n  }\n\n  getGroupId(): string {\n    const self = this.getLatest();\n    return self.__groupId;\n  }\n\n  getId(): string {\n    const self = this.getLatest();\n    return self.__id;\n  }\n\n  getUserIds(): string[] | undefined {\n    const self = this.getLatest();\n    return self.__userIds;\n  }\n\n  decorate(): JSX.Element {\n    const mention: GroupMentionData = {\n      id: this.getGroupId(),\n      kind: \"group\",\n      userIds: this.getUserIds(),\n    };\n\n    return <GroupMention mention={mention} nodeKey={this.getKey()} />;\n  }\n}\n\nexport function $isGroupMentionNode(\n  node: LexicalNode | null | undefined\n): node is GroupMentionNode {\n  return node instanceof GroupMentionNode;\n}\n\nexport function $createGroupMentionNode(\n  groupId: string,\n  userIds: string[] | undefined\n): GroupMentionNode {\n  const node = new GroupMentionNode(\n    createInboxNotificationId(),\n    groupId,\n    userIds\n  );\n  return $applyNodeReplacement(node);\n}\n"],"names":["jsxs","Mention","MENTION_CHARACTER","jsx","Group","DecoratorNode","createInboxNotificationId","$applyNodeReplacement"],"mappings":"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"}

package/dist/mentions/group-mention-node.js

@@ -8,15 +8,10 @@ function GroupMention({
   mention,
   nodeKey
 }) {
-  return /* @__PURE__ */ jsxs(Mention, {
-    nodeKey,
-    children: [
-      MENTION_CHARACTER,
-      /* @__PURE__ */ jsx(Group, {
-        groupId: mention.id
-      })
-    ]
-  });
+  return /* @__PURE__ */ jsxs(Mention, { nodeKey, children: [
+    MENTION_CHARACTER,
+    /* @__PURE__ */ jsx(Group, { groupId: mention.id })
+  ] });
 }
 class GroupMentionNode extends DecoratorNode {
   __id;
@@ -119,10 +114,7 @@ class GroupMentionNode extends DecoratorNode {
       kind: "group",
       userIds: this.getUserIds()
     };
-    return /* @__PURE__ */ jsx(GroupMention, {
-      mention,
-      nodeKey: this.getKey()
-    });
+    return /* @__PURE__ */ jsx(GroupMention, { mention, nodeKey: this.getKey() });
   }
 }
 function $isGroupMentionNode(node) {

package/dist/mentions/group-mention-node.js.map

@@ -1 +1 @@
-{"version":3,"file":"group-mention-node.js","sources":["../../src/mentions/group-mention-node.tsx"],"sourcesContent":["import {\n  createInboxNotificationId,\n  type GroupMentionData,\n  MENTION_CHARACTER,\n} from \"@liveblocks/core\";\nimport { Group } from \"@liveblocks/react-ui/_private\";\nimport type {\n  DOMConversionMap,\n  DOMExportOutput,\n  LexicalNode,\n  NodeKey,\n  SerializedLexicalNode,\n  Spread,\n} from \"lexical\";\nimport { $applyNodeReplacement, DecoratorNode } from \"lexical\";\nimport type { JSX } from \"react\";\n\nimport { Mention } from \"./mention-component\";\n\nexport type SerializedGroupMentionNode = Spread<\n  {\n    groupId: string;\n    userIds?: string[];\n  },\n  SerializedLexicalNode\n>;\n\nfunction GroupMention({\n  mention,\n  nodeKey,\n}: {\n  mention: GroupMentionData;\n  nodeKey: string;\n}) {\n  return (\n    <Mention nodeKey={nodeKey}>\n      {MENTION_CHARACTER}\n      <Group groupId={mention.id} />\n    </Mention>\n  );\n}\n\nexport class GroupMentionNode extends DecoratorNode<JSX.Element> {\n  __id: string;\n  __groupId: string;\n  __userIds: string[] | undefined;\n\n  constructor(\n    id: string,\n    groupId: string,\n    userIds: string[] | undefined,\n    key?: NodeKey\n  ) {\n    super(key);\n    this.__id = id;\n    this.__groupId = groupId;\n    this.__userIds = userIds;\n  }\n\n  static getType(): string {\n    return \"lb-group-mention\";\n  }\n\n  static clone(node: GroupMentionNode): GroupMentionNode {\n    return new GroupMentionNode(\n      node.__id,\n      node.__groupId,\n      node.__userIds,\n      node.__key\n    );\n  }\n\n  createDOM(): HTMLElement {\n    const element = document.createElement(\"span\");\n    element.style.display = \"inline-block\";\n    element.style.userSelect = \"none\";\n    return element;\n  }\n\n  updateDOM(): boolean {\n    return false;\n  }\n\n  static importDom(): DOMConversionMap<HTMLElement> | null {\n    return {\n      span: () => ({\n        conversion: (element) => {\n          const groupId = element.getAttribute(\"data-lexical-lb-group-mention\");\n\n          if (!groupId) {\n            return null;\n          }\n\n          const userIdsAttribute = element.getAttribute(\n            \"data-lexical-lb-user-ids\"\n          );\n          let userIds: string[] | undefined;\n\n          if (userIdsAttribute) {\n            try {\n              const parsedUserIds = JSON.parse(userIdsAttribute) as string[];\n\n              if (Array.isArray(parsedUserIds)) {\n                userIds = parsedUserIds;\n              }\n            } catch {\n              // Invalid userIds attribute\n            }\n          }\n\n          const node = $createGroupMentionNode(groupId, userIds);\n          return { node };\n        },\n        priority: 1,\n      }),\n    };\n  }\n\n  exportDOM(): DOMExportOutput {\n    const element = document.createElement(\"span\");\n    element.setAttribute(\"data-lexical-lb-group-mention\", this.getGroupId());\n    element.setAttribute(\n      \"data-lexical-lb-group-mention-users\",\n      JSON.stringify(this.getUserIds())\n    );\n    element.textContent = this.getTextContent();\n    return { element };\n  }\n\n  static importJSON(\n    serializedNode: SerializedGroupMentionNode\n  ): GroupMentionNode {\n    const node = $createGroupMentionNode(\n      serializedNode.groupId,\n      serializedNode.userIds\n    );\n    return node;\n  }\n\n  exportJSON(): SerializedGroupMentionNode {\n    return {\n      groupId: this.__groupId,\n      userIds: this.__userIds,\n      type: \"lb-group-mention\",\n      version: 1,\n    };\n  }\n\n  getGroupId(): string {\n    const self = this.getLatest();\n    return self.__groupId;\n  }\n\n  getId(): string {\n    const self = this.getLatest();\n    return self.__id;\n  }\n\n  getUserIds(): string[] | undefined {\n    const self = this.getLatest();\n    return self.__userIds;\n  }\n\n  decorate(): JSX.Element {\n    const mention: GroupMentionData = {\n      id: this.getGroupId(),\n      kind: \"group\",\n      userIds: this.getUserIds(),\n    };\n\n    return <GroupMention mention={mention} nodeKey={this.getKey()} />;\n  }\n}\n\nexport function $isGroupMentionNode(\n  node: LexicalNode | null | undefined\n): node is GroupMentionNode {\n  return node instanceof GroupMentionNode;\n}\n\nexport function $createGroupMentionNode(\n  groupId: string,\n  userIds: string[] | undefined\n): GroupMentionNode {\n  const node = new GroupMentionNode(\n    createInboxNotificationId(),\n    groupId,\n    userIds\n  );\n  return $applyNodeReplacement(node);\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"group-mention-node.js","sources":["../../src/mentions/group-mention-node.tsx"],"sourcesContent":["import {\n  createInboxNotificationId,\n  type GroupMentionData,\n  MENTION_CHARACTER,\n} from \"@liveblocks/core\";\nimport { Group } from \"@liveblocks/react-ui/_private\";\nimport type {\n  DOMConversionMap,\n  DOMExportOutput,\n  LexicalNode,\n  NodeKey,\n  SerializedLexicalNode,\n  Spread,\n} from \"lexical\";\nimport { $applyNodeReplacement, DecoratorNode } from \"lexical\";\nimport type { JSX } from \"react\";\n\nimport { Mention } from \"./mention-component\";\n\nexport type SerializedGroupMentionNode = Spread<\n  {\n    groupId: string;\n    userIds?: string[];\n  },\n  SerializedLexicalNode\n>;\n\nfunction GroupMention({\n  mention,\n  nodeKey,\n}: {\n  mention: GroupMentionData;\n  nodeKey: string;\n}) {\n  return (\n    <Mention nodeKey={nodeKey}>\n      {MENTION_CHARACTER}\n      <Group groupId={mention.id} />\n    </Mention>\n  );\n}\n\nexport class GroupMentionNode extends DecoratorNode<JSX.Element> {\n  __id: string;\n  __groupId: string;\n  __userIds: string[] | undefined;\n\n  constructor(\n    id: string,\n    groupId: string,\n    userIds: string[] | undefined,\n    key?: NodeKey\n  ) {\n    super(key);\n    this.__id = id;\n    this.__groupId = groupId;\n    this.__userIds = userIds;\n  }\n\n  static getType(): string {\n    return \"lb-group-mention\";\n  }\n\n  static clone(node: GroupMentionNode): GroupMentionNode {\n    return new GroupMentionNode(\n      node.__id,\n      node.__groupId,\n      node.__userIds,\n      node.__key\n    );\n  }\n\n  createDOM(): HTMLElement {\n    const element = document.createElement(\"span\");\n    element.style.display = \"inline-block\";\n    element.style.userSelect = \"none\";\n    return element;\n  }\n\n  updateDOM(): boolean {\n    return false;\n  }\n\n  static importDom(): DOMConversionMap<HTMLElement> | null {\n    return {\n      span: () => ({\n        conversion: (element) => {\n          const groupId = element.getAttribute(\"data-lexical-lb-group-mention\");\n\n          if (!groupId) {\n            return null;\n          }\n\n          const userIdsAttribute = element.getAttribute(\n            \"data-lexical-lb-user-ids\"\n          );\n          let userIds: string[] | undefined;\n\n          if (userIdsAttribute) {\n            try {\n              const parsedUserIds = JSON.parse(userIdsAttribute) as string[];\n\n              if (Array.isArray(parsedUserIds)) {\n                userIds = parsedUserIds;\n              }\n            } catch {\n              // Invalid userIds attribute\n            }\n          }\n\n          const node = $createGroupMentionNode(groupId, userIds);\n          return { node };\n        },\n        priority: 1,\n      }),\n    };\n  }\n\n  exportDOM(): DOMExportOutput {\n    const element = document.createElement(\"span\");\n    element.setAttribute(\"data-lexical-lb-group-mention\", this.getGroupId());\n    element.setAttribute(\n      \"data-lexical-lb-group-mention-users\",\n      JSON.stringify(this.getUserIds())\n    );\n    element.textContent = this.getTextContent();\n    return { element };\n  }\n\n  static importJSON(\n    serializedNode: SerializedGroupMentionNode\n  ): GroupMentionNode {\n    const node = $createGroupMentionNode(\n      serializedNode.groupId,\n      serializedNode.userIds\n    );\n    return node;\n  }\n\n  exportJSON(): SerializedGroupMentionNode {\n    return {\n      groupId: this.__groupId,\n      userIds: this.__userIds,\n      type: \"lb-group-mention\",\n      version: 1,\n    };\n  }\n\n  getGroupId(): string {\n    const self = this.getLatest();\n    return self.__groupId;\n  }\n\n  getId(): string {\n    const self = this.getLatest();\n    return self.__id;\n  }\n\n  getUserIds(): string[] | undefined {\n    const self = this.getLatest();\n    return self.__userIds;\n  }\n\n  decorate(): JSX.Element {\n    const mention: GroupMentionData = {\n      id: this.getGroupId(),\n      kind: \"group\",\n      userIds: this.getUserIds(),\n    };\n\n    return <GroupMention mention={mention} nodeKey={this.getKey()} />;\n  }\n}\n\nexport function $isGroupMentionNode(\n  node: LexicalNode | null | undefined\n): node is GroupMentionNode {\n  return node instanceof GroupMentionNode;\n}\n\nexport function $createGroupMentionNode(\n  groupId: string,\n  userIds: string[] | undefined\n): GroupMentionNode {\n  const node = new GroupMentionNode(\n    createInboxNotificationId(),\n    groupId,\n    userIds\n  );\n  return $applyNodeReplacement(node);\n}\n"],"names":[],"mappings":"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"}

package/dist/mentions/mention-component.cjs

@@ -22,14 +22,17 @@ const Mention = react.forwardRef(
       },
       [editor, nodeKey]
     );
-    return /* @__PURE__ */ jsxRuntime.jsx("span", {
-      onClick: handleClick,
-      "data-selected": isSelected ? "" : void 0,
-      className: _private.cn("lb-root lb-mention lb-lexical-mention", className),
-      ref: forwardedRef,
-      ...props,
-      children
-    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        onClick: handleClick,
+        "data-selected": isSelected ? "" : void 0,
+        className: _private.cn("lb-root lb-mention lb-lexical-mention", className),
+        ref: forwardedRef,
+        ...props,
+        children
+      }
+    );
   }
 );
 function $isNodeSelected(key) {

package/dist/mentions/mention-component.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"mention-component.cjs","sources":["../../src/mentions/mention-component.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { cn } from \"@liveblocks/react-ui/_private\";\nimport type { NodeKey } from \"lexical\";\nimport { $createNodeSelection, $getNodeByKey, $setSelection } from \"lexical\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n} from \"react\";\nimport { useCallback, useSyncExternalStore } from \"react\";\n\ninterface MentionProps extends ComponentPropsWithoutRef<\"span\"> {\n  nodeKey: NodeKey;\n}\n\nexport const Mention = forwardRef<HTMLSpanElement, MentionProps>(\n  ({ nodeKey, children, className, ...props }, forwardedRef) => {\n    const [editor] = useLexicalComposerContext();\n    const isSelected = useIsNodeSelected(nodeKey);\n\n    const handleClick = useCallback(\n      (event: MouseEvent) => {\n        editor.update(() => {\n          event.stopPropagation();\n          event.preventDefault();\n\n          const selection = $createNodeSelection();\n          selection.add(nodeKey);\n          $setSelection(selection);\n        });\n      },\n      [editor, nodeKey]\n    );\n\n    return (\n      <span\n        onClick={handleClick}\n        data-selected={isSelected ? \"\" : undefined}\n        className={cn(\"lb-root lb-mention lb-lexical-mention\", className)}\n        ref={forwardedRef}\n        {...props}\n      >\n        {children}\n      </span>\n    );\n  }\n);\n\nfunction $isNodeSelected(key: NodeKey): boolean {\n  const node = $getNodeByKey(key);\n  if (node === null) return false;\n  return node.isSelected();\n}\n\nfunction useIsNodeSelected(key: NodeKey) {\n  const [editor] = useLexicalComposerContext();\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void) => {\n      return editor.registerUpdateListener(onStoreChange);\n    },\n    [editor]\n  );\n\n  const getSnapshot = useCallback(() => {\n    return editor.getEditorState().read(() => $isNodeSelected(key));\n  }, [editor, key]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["forwardRef","useLexicalComposerContext","useCallback","$createNodeSelection","$setSelection","jsx","cn","$getNodeByKey","useSyncExternalStore"],"mappings":";;;;;;;;AAeO,MAAM,OAAU,GAAAA,gBAAA;AAAA,EACrB,CAAC,EAAE,OAAA,EAAS,UAAU,SAAc,EAAA,GAAA,KAAA,IAAS,YAAiB,KAAA;AAC5D,IAAM,MAAA,CAAC,MAAM,CAAA,GAAIC,gDAA0B,EAAA,CAAA;AAC3C,IAAM,MAAA,UAAA,GAAa,kBAAkB,OAAO,CAAA,CAAA;AAE5C,IAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,MAClB,CAAC,KAAsB,KAAA;AACrB,QAAA,MAAA,CAAO,OAAO,MAAM;AAClB,UAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,UAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,UAAA,MAAM,YAAYC,4BAAqB,EAAA,CAAA;AACvC,UAAA,SAAA,CAAU,IAAI,OAAO,CAAA,CAAA;AACrB,UAAAC,qBAAA,CAAc,SAAS,CAAA,CAAA;AAAA,SACxB,CAAA,CAAA;AAAA,OACH;AAAA,MACA,CAAC,QAAQ,OAAO,CAAA;AAAA,KAClB,CAAA;AAEA,IAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,MACC,OAAS,EAAA,WAAA;AAAA,MACT,eAAA,EAAe,aAAa,EAAK,GAAA,KAAA,CAAA;AAAA,MACjC,SAAA,EAAWC,WAAG,CAAA,uCAAA,EAAyC,SAAS,CAAA;AAAA,MAChE,GAAK,EAAA,YAAA;AAAA,MACJ,GAAG,KAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,gBAAgB,GAAuB,EAAA;AAC9C,EAAM,MAAA,IAAA,GAAOC,sBAAc,GAAG,CAAA,CAAA;AAC9B,EAAA,IAAI,IAAS,KAAA,IAAA;AAAM,IAAO,OAAA,KAAA,CAAA;AAC1B,EAAA,OAAO,KAAK,UAAW,EAAA,CAAA;AACzB,CAAA;AAEA,SAAS,kBAAkB,GAAc,EAAA;AACvC,EAAM,MAAA,CAAC,MAAM,CAAA,GAAIN,gDAA0B,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAAC,iBAAA;AAAA,IAChB,CAAC,aAA8B,KAAA;AAC7B,MAAO,OAAA,MAAA,CAAO,uBAAuB,aAAa,CAAA,CAAA;AAAA,KACpD;AAAA,IACA,CAAC,MAAM,CAAA;AAAA,GACT,CAAA;AAEA,EAAM,MAAA,WAAA,GAAcA,kBAAY,MAAM;AACpC,IAAA,OAAO,OAAO,cAAe,EAAA,CAAE,KAAK,MAAM,eAAA,CAAgB,GAAG,CAAC,CAAA,CAAA;AAAA,GAC7D,EAAA,CAAC,MAAQ,EAAA,GAAG,CAAC,CAAA,CAAA;AAEhB,EAAO,OAAAM,0BAAA,CAAqB,SAAW,EAAA,WAAA,EAAa,WAAW,CAAA,CAAA;AACjE;;;;"}
+{"version":3,"file":"mention-component.cjs","sources":["../../src/mentions/mention-component.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { cn } from \"@liveblocks/react-ui/_private\";\nimport type { NodeKey } from \"lexical\";\nimport { $createNodeSelection, $getNodeByKey, $setSelection } from \"lexical\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n} from \"react\";\nimport { useCallback, useSyncExternalStore } from \"react\";\n\ninterface MentionProps extends ComponentPropsWithoutRef<\"span\"> {\n  nodeKey: NodeKey;\n}\n\nexport const Mention = forwardRef<HTMLSpanElement, MentionProps>(\n  ({ nodeKey, children, className, ...props }, forwardedRef) => {\n    const [editor] = useLexicalComposerContext();\n    const isSelected = useIsNodeSelected(nodeKey);\n\n    const handleClick = useCallback(\n      (event: MouseEvent) => {\n        editor.update(() => {\n          event.stopPropagation();\n          event.preventDefault();\n\n          const selection = $createNodeSelection();\n          selection.add(nodeKey);\n          $setSelection(selection);\n        });\n      },\n      [editor, nodeKey]\n    );\n\n    return (\n      <span\n        onClick={handleClick}\n        data-selected={isSelected ? \"\" : undefined}\n        className={cn(\"lb-root lb-mention lb-lexical-mention\", className)}\n        ref={forwardedRef}\n        {...props}\n      >\n        {children}\n      </span>\n    );\n  }\n);\n\nfunction $isNodeSelected(key: NodeKey): boolean {\n  const node = $getNodeByKey(key);\n  if (node === null) return false;\n  return node.isSelected();\n}\n\nfunction useIsNodeSelected(key: NodeKey) {\n  const [editor] = useLexicalComposerContext();\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void) => {\n      return editor.registerUpdateListener(onStoreChange);\n    },\n    [editor]\n  );\n\n  const getSnapshot = useCallback(() => {\n    return editor.getEditorState().read(() => $isNodeSelected(key));\n  }, [editor, key]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["forwardRef","useLexicalComposerContext","useCallback","$createNodeSelection","$setSelection","jsx","cn","$getNodeByKey","useSyncExternalStore"],"mappings":";;;;;;;;AAeO,MAAM,OAAU,GAAAA,gBAAA;AAAA,EACrB,CAAC,EAAE,OAAS,EAAA,QAAA,EAAU,WAAW,GAAG,KAAA,IAAS,YAAiB,KAAA;AAC5D,IAAM,MAAA,CAAC,MAAM,CAAA,GAAIC,gDAA0B,EAAA,CAAA;AAC3C,IAAM,MAAA,UAAA,GAAa,kBAAkB,OAAO,CAAA,CAAA;AAE5C,IAAA,MAAM,WAAc,GAAAC,iBAAA;AAAA,MAClB,CAAC,KAAsB,KAAA;AACrB,QAAA,MAAA,CAAO,OAAO,MAAM;AAClB,UAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,UAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,UAAA,MAAM,YAAYC,4BAAqB,EAAA,CAAA;AACvC,UAAA,SAAA,CAAU,IAAI,OAAO,CAAA,CAAA;AACrB,UAAAC,qBAAA,CAAc,SAAS,CAAA,CAAA;AAAA,SACxB,CAAA,CAAA;AAAA,OACH;AAAA,MACA,CAAC,QAAQ,OAAO,CAAA;AAAA,KAClB,CAAA;AAEA,IACE,uBAAAC,cAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,eAAA,EAAe,aAAa,EAAK,GAAA,KAAA,CAAA;AAAA,QACjC,SAAA,EAAWC,WAAG,CAAA,uCAAA,EAAyC,SAAS,CAAA;AAAA,QAChE,GAAK,EAAA,YAAA;AAAA,QACJ,GAAG,KAAA;AAAA,QAEH,QAAA;AAAA,OAAA;AAAA,KACH,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,gBAAgB,GAAuB,EAAA;AAC9C,EAAM,MAAA,IAAA,GAAOC,sBAAc,GAAG,CAAA,CAAA;AAC9B,EAAA,IAAI,IAAS,KAAA,IAAA;AAAM,IAAO,OAAA,KAAA,CAAA;AAC1B,EAAA,OAAO,KAAK,UAAW,EAAA,CAAA;AACzB,CAAA;AAEA,SAAS,kBAAkB,GAAc,EAAA;AACvC,EAAM,MAAA,CAAC,MAAM,CAAA,GAAIN,gDAA0B,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAAC,iBAAA;AAAA,IAChB,CAAC,aAA8B,KAAA;AAC7B,MAAO,OAAA,MAAA,CAAO,uBAAuB,aAAa,CAAA,CAAA;AAAA,KACpD;AAAA,IACA,CAAC,MAAM,CAAA;AAAA,GACT,CAAA;AAEA,EAAM,MAAA,WAAA,GAAcA,kBAAY,MAAM;AACpC,IAAA,OAAO,OAAO,cAAe,EAAA,CAAE,KAAK,MAAM,eAAA,CAAgB,GAAG,CAAC,CAAA,CAAA;AAAA,GAC7D,EAAA,CAAC,MAAQ,EAAA,GAAG,CAAC,CAAA,CAAA;AAEhB,EAAO,OAAAM,0BAAA,CAAqB,SAAW,EAAA,WAAA,EAAa,WAAW,CAAA,CAAA;AACjE;;;;"}

package/dist/mentions/mention-component.js

@@ -20,14 +20,17 @@ const Mention = forwardRef(
       },
       [editor, nodeKey]
     );
-    return /* @__PURE__ */ jsx("span", {
-      onClick: handleClick,
-      "data-selected": isSelected ? "" : void 0,
-      className: cn("lb-root lb-mention lb-lexical-mention", className),
-      ref: forwardedRef,
-      ...props,
-      children
-    });
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        onClick: handleClick,
+        "data-selected": isSelected ? "" : void 0,
+        className: cn("lb-root lb-mention lb-lexical-mention", className),
+        ref: forwardedRef,
+        ...props,
+        children
+      }
+    );
   }
 );
 function $isNodeSelected(key) {

package/dist/mentions/mention-component.js.map

@@ -1 +1 @@
-{"version":3,"file":"mention-component.js","sources":["../../src/mentions/mention-component.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { cn } from \"@liveblocks/react-ui/_private\";\nimport type { NodeKey } from \"lexical\";\nimport { $createNodeSelection, $getNodeByKey, $setSelection } from \"lexical\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n} from \"react\";\nimport { useCallback, useSyncExternalStore } from \"react\";\n\ninterface MentionProps extends ComponentPropsWithoutRef<\"span\"> {\n  nodeKey: NodeKey;\n}\n\nexport const Mention = forwardRef<HTMLSpanElement, MentionProps>(\n  ({ nodeKey, children, className, ...props }, forwardedRef) => {\n    const [editor] = useLexicalComposerContext();\n    const isSelected = useIsNodeSelected(nodeKey);\n\n    const handleClick = useCallback(\n      (event: MouseEvent) => {\n        editor.update(() => {\n          event.stopPropagation();\n          event.preventDefault();\n\n          const selection = $createNodeSelection();\n          selection.add(nodeKey);\n          $setSelection(selection);\n        });\n      },\n      [editor, nodeKey]\n    );\n\n    return (\n      <span\n        onClick={handleClick}\n        data-selected={isSelected ? \"\" : undefined}\n        className={cn(\"lb-root lb-mention lb-lexical-mention\", className)}\n        ref={forwardedRef}\n        {...props}\n      >\n        {children}\n      </span>\n    );\n  }\n);\n\nfunction $isNodeSelected(key: NodeKey): boolean {\n  const node = $getNodeByKey(key);\n  if (node === null) return false;\n  return node.isSelected();\n}\n\nfunction useIsNodeSelected(key: NodeKey) {\n  const [editor] = useLexicalComposerContext();\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void) => {\n      return editor.registerUpdateListener(onStoreChange);\n    },\n    [editor]\n  );\n\n  const getSnapshot = useCallback(() => {\n    return editor.getEditorState().read(() => $isNodeSelected(key));\n  }, [editor, key]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":[],"mappings":";;;;;;AAeO,MAAM,OAAU,GAAA,UAAA;AAAA,EACrB,CAAC,EAAE,OAAA,EAAS,UAAU,SAAc,EAAA,GAAA,KAAA,IAAS,YAAiB,KAAA;AAC5D,IAAM,MAAA,CAAC,MAAM,CAAA,GAAI,yBAA0B,EAAA,CAAA;AAC3C,IAAM,MAAA,UAAA,GAAa,kBAAkB,OAAO,CAAA,CAAA;AAE5C,IAAA,MAAM,WAAc,GAAA,WAAA;AAAA,MAClB,CAAC,KAAsB,KAAA;AACrB,QAAA,MAAA,CAAO,OAAO,MAAM;AAClB,UAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,UAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,UAAA,MAAM,YAAY,oBAAqB,EAAA,CAAA;AACvC,UAAA,SAAA,CAAU,IAAI,OAAO,CAAA,CAAA;AACrB,UAAA,aAAA,CAAc,SAAS,CAAA,CAAA;AAAA,SACxB,CAAA,CAAA;AAAA,OACH;AAAA,MACA,CAAC,QAAQ,OAAO,CAAA;AAAA,KAClB,CAAA;AAEA,IAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,MACC,OAAS,EAAA,WAAA;AAAA,MACT,eAAA,EAAe,aAAa,EAAK,GAAA,KAAA,CAAA;AAAA,MACjC,SAAA,EAAW,EAAG,CAAA,uCAAA,EAAyC,SAAS,CAAA;AAAA,MAChE,GAAK,EAAA,YAAA;AAAA,MACJ,GAAG,KAAA;AAAA,MAEH,QAAA;AAAA,KACH,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,gBAAgB,GAAuB,EAAA;AAC9C,EAAM,MAAA,IAAA,GAAO,cAAc,GAAG,CAAA,CAAA;AAC9B,EAAA,IAAI,IAAS,KAAA,IAAA;AAAM,IAAO,OAAA,KAAA,CAAA;AAC1B,EAAA,OAAO,KAAK,UAAW,EAAA,CAAA;AACzB,CAAA;AAEA,SAAS,kBAAkB,GAAc,EAAA;AACvC,EAAM,MAAA,CAAC,MAAM,CAAA,GAAI,yBAA0B,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,aAA8B,KAAA;AAC7B,MAAO,OAAA,MAAA,CAAO,uBAAuB,aAAa,CAAA,CAAA;AAAA,KACpD;AAAA,IACA,CAAC,MAAM,CAAA;AAAA,GACT,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,OAAO,OAAO,cAAe,EAAA,CAAE,KAAK,MAAM,eAAA,CAAgB,GAAG,CAAC,CAAA,CAAA;AAAA,GAC7D,EAAA,CAAC,MAAQ,EAAA,GAAG,CAAC,CAAA,CAAA;AAEhB,EAAO,OAAA,oBAAA,CAAqB,SAAW,EAAA,WAAA,EAAa,WAAW,CAAA,CAAA;AACjE;;;;"}
+{"version":3,"file":"mention-component.js","sources":["../../src/mentions/mention-component.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { cn } from \"@liveblocks/react-ui/_private\";\nimport type { NodeKey } from \"lexical\";\nimport { $createNodeSelection, $getNodeByKey, $setSelection } from \"lexical\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n} from \"react\";\nimport { useCallback, useSyncExternalStore } from \"react\";\n\ninterface MentionProps extends ComponentPropsWithoutRef<\"span\"> {\n  nodeKey: NodeKey;\n}\n\nexport const Mention = forwardRef<HTMLSpanElement, MentionProps>(\n  ({ nodeKey, children, className, ...props }, forwardedRef) => {\n    const [editor] = useLexicalComposerContext();\n    const isSelected = useIsNodeSelected(nodeKey);\n\n    const handleClick = useCallback(\n      (event: MouseEvent) => {\n        editor.update(() => {\n          event.stopPropagation();\n          event.preventDefault();\n\n          const selection = $createNodeSelection();\n          selection.add(nodeKey);\n          $setSelection(selection);\n        });\n      },\n      [editor, nodeKey]\n    );\n\n    return (\n      <span\n        onClick={handleClick}\n        data-selected={isSelected ? \"\" : undefined}\n        className={cn(\"lb-root lb-mention lb-lexical-mention\", className)}\n        ref={forwardedRef}\n        {...props}\n      >\n        {children}\n      </span>\n    );\n  }\n);\n\nfunction $isNodeSelected(key: NodeKey): boolean {\n  const node = $getNodeByKey(key);\n  if (node === null) return false;\n  return node.isSelected();\n}\n\nfunction useIsNodeSelected(key: NodeKey) {\n  const [editor] = useLexicalComposerContext();\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void) => {\n      return editor.registerUpdateListener(onStoreChange);\n    },\n    [editor]\n  );\n\n  const getSnapshot = useCallback(() => {\n    return editor.getEditorState().read(() => $isNodeSelected(key));\n  }, [editor, key]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":[],"mappings":";;;;;;AAeO,MAAM,OAAU,GAAA,UAAA;AAAA,EACrB,CAAC,EAAE,OAAS,EAAA,QAAA,EAAU,WAAW,GAAG,KAAA,IAAS,YAAiB,KAAA;AAC5D,IAAM,MAAA,CAAC,MAAM,CAAA,GAAI,yBAA0B,EAAA,CAAA;AAC3C,IAAM,MAAA,UAAA,GAAa,kBAAkB,OAAO,CAAA,CAAA;AAE5C,IAAA,MAAM,WAAc,GAAA,WAAA;AAAA,MAClB,CAAC,KAAsB,KAAA;AACrB,QAAA,MAAA,CAAO,OAAO,MAAM;AAClB,UAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AACtB,UAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AAErB,UAAA,MAAM,YAAY,oBAAqB,EAAA,CAAA;AACvC,UAAA,SAAA,CAAU,IAAI,OAAO,CAAA,CAAA;AACrB,UAAA,aAAA,CAAc,SAAS,CAAA,CAAA;AAAA,SACxB,CAAA,CAAA;AAAA,OACH;AAAA,MACA,CAAC,QAAQ,OAAO,CAAA;AAAA,KAClB,CAAA;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,OAAS,EAAA,WAAA;AAAA,QACT,eAAA,EAAe,aAAa,EAAK,GAAA,KAAA,CAAA;AAAA,QACjC,SAAA,EAAW,EAAG,CAAA,uCAAA,EAAyC,SAAS,CAAA;AAAA,QAChE,GAAK,EAAA,YAAA;AAAA,QACJ,GAAG,KAAA;AAAA,QAEH,QAAA;AAAA,OAAA;AAAA,KACH,CAAA;AAAA,GAEJ;AACF,EAAA;AAEA,SAAS,gBAAgB,GAAuB,EAAA;AAC9C,EAAM,MAAA,IAAA,GAAO,cAAc,GAAG,CAAA,CAAA;AAC9B,EAAA,IAAI,IAAS,KAAA,IAAA;AAAM,IAAO,OAAA,KAAA,CAAA;AAC1B,EAAA,OAAO,KAAK,UAAW,EAAA,CAAA;AACzB,CAAA;AAEA,SAAS,kBAAkB,GAAc,EAAA;AACvC,EAAM,MAAA,CAAC,MAAM,CAAA,GAAI,yBAA0B,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,aAA8B,KAAA;AAC7B,MAAO,OAAA,MAAA,CAAO,uBAAuB,aAAa,CAAA,CAAA;AAAA,KACpD;AAAA,IACA,CAAC,MAAM,CAAA;AAAA,GACT,CAAA;AAEA,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,OAAO,OAAO,cAAe,EAAA,CAAE,KAAK,MAAM,eAAA,CAAgB,GAAG,CAAC,CAAA,CAAA;AAAA,GAC7D,EAAA,CAAC,MAAQ,EAAA,GAAG,CAAC,CAAA,CAAA;AAEhB,EAAO,OAAA,oBAAA,CAAqB,SAAW,EAAA,WAAA,EAAa,WAAW,CAAA,CAAA;AACjE;;;;"}

package/dist/mentions/mention-node.cjs

@@ -70,18 +70,10 @@ class MentionNode extends lexical.DecoratorNode {
     return self.__id;
   }
   decorate() {
-    return /* @__PURE__ */ jsxRuntime.jsxs(mentionComponent.Mention, {
-      nodeKey: this.getKey(),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", {
-          className: "lb-mention-symbol",
-          children: core.MENTION_CHARACTER
-        }),
-        /* @__PURE__ */ jsxRuntime.jsx(_private.User, {
-          userId: this.getUserId()
-        })
-      ]
-    });
+    return /* @__PURE__ */ jsxRuntime.jsxs(mentionComponent.Mention, { nodeKey: this.getKey(), children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "lb-mention-symbol", children: core.MENTION_CHARACTER }),
+      /* @__PURE__ */ jsxRuntime.jsx(_private.User, { userId: this.getUserId() })
+    ] });
   }
   getTextContent() {
     return core.MENTION_CHARACTER + this.getUserId();