@liveblocks/react-lexical 1.12.0-lexical4 → 2.0.0-alpha2

package/dist/active-selection.mjs

@@ -1,123 +0,0 @@
-import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import { createDOMRange, createRectsFromDOMRange } from '@lexical/selection';
-import { $getSelection, $isRangeSelection } from 'lexical';
-import * as React from 'react';
-import { useRef, useLayoutEffect, useCallback } from 'react';
-import { createPortal } from 'react-dom';
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
-
-function ActiveSelection({ styles }) {
-  const [editor] = useLexicalComposerContext();
-  const selection = useSelection();
-  if (selection === null)
-    return null;
-  const info = editor.getEditorState().read(() => {
-    return {
-      anchor: {
-        node: selection.anchor.getNode(),
-        offset: selection.anchor.offset
-      },
-      focus: {
-        node: selection.focus.getNode(),
-        offset: selection.focus.offset
-      }
-    };
-  });
-  const root = editor.getRootElement();
-  if (root === null)
-    return null;
-  const rootContainer = root.parentElement;
-  if (rootContainer === null)
-    return null;
-  return createPortal(
-    /* @__PURE__ */ React.createElement(SelectionRects, {
-      selection: info,
-      styles
-    }),
-    rootContainer
-  );
-}
-function SelectionRects({
-  selection,
-  styles = {}
-}) {
-  const [editor] = useLexicalComposerContext();
-  const divRef = useRef(null);
-  useLayoutEffect(() => {
-    const container = divRef.current;
-    if (container === null)
-      return;
-    function drawSelectionRects() {
-      if (container === null)
-        return;
-      while (container.firstChild) {
-        container.removeChild(container.firstChild);
-      }
-      const range = createDOMRange(
-        editor,
-        selection.anchor.node,
-        selection.anchor.offset,
-        selection.focus.node,
-        selection.focus.offset
-      );
-      if (range === null)
-        return;
-      const rects = createRectsFromDOMRange(editor, range);
-      for (const rect of rects) {
-        const div = document.createElement("div");
-        Object.assign(div.style, {
-          backgroundColor: "rgba(255, 212, 0, 0.14)",
-          ...styles,
-          position: "absolute",
-          top: `${rect.top - container.getBoundingClientRect().top}px`,
-          left: `${rect.left - container.getBoundingClientRect().left}px`,
-          width: `${rect.width}px`,
-          height: `${rect.height}px`,
-          pointerEvents: "none"
-        });
-        container.appendChild(div);
-      }
-    }
-    const observer = new ResizeObserver(drawSelectionRects);
-    observer.observe(container);
-    const unsubscribeFromUpdates = editor.registerUpdateListener(drawSelectionRects);
-    return () => {
-      observer.disconnect();
-      unsubscribeFromUpdates();
-    };
-  }, [selection, editor, styles]);
-  return /* @__PURE__ */ React.createElement("div", {
-    ref: divRef,
-    style: {
-      position: "absolute",
-      top: 0,
-      left: 0,
-      width: "100%",
-      height: "100%",
-      pointerEvents: "none"
-    }
-  });
-}
-function useSelection() {
-  const [editor] = useLexicalComposerContext();
-  const subscribe = useCallback(
-    (onStoreChange) => {
-      return editor.registerUpdateListener(onStoreChange);
-    },
-    [editor]
-  );
-  const getSnapshot = useCallback(() => {
-    return editor.getEditorState().read(() => {
-      const selection = $getSelection();
-      if (!$isRangeSelection(selection))
-        return null;
-      if (selection.isCollapsed())
-        return null;
-      return selection;
-    });
-  }, [editor]);
-  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
-}
-
-export { ActiveSelection };
-//# sourceMappingURL=active-selection.mjs.map

package/dist/active-selection.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"active-selection.mjs","sources":["../src/active-selection.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport { createDOMRange, createRectsFromDOMRange } from \"@lexical/selection\";\nimport type { LexicalNode, RangeSelection } from \"lexical\";\nimport { $getSelection, $isRangeSelection } from \"lexical\";\nimport * as React from \"react\";\nimport { useCallback, useLayoutEffect, useRef } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useSyncExternalStore } from \"use-sync-external-store/shim/index.js\";\n\ninterface ActiveSelectionProps {\n  styles?: Partial<CSSStyleDeclaration>;\n}\n\nexport function ActiveSelection({ styles }: ActiveSelectionProps) {\n  const [editor] = useLexicalComposerContext();\n  const selection = useSelection();\n  if (selection === null) return null;\n\n  const info = editor.getEditorState().read(() => {\n    return {\n      anchor: {\n        node: selection.anchor.getNode(),\n        offset: selection.anchor.offset,\n      },\n      focus: {\n        node: selection.focus.getNode(),\n        offset: selection.focus.offset,\n      },\n    };\n  });\n\n  const root = editor.getRootElement();\n  if (root === null) return null;\n\n  const rootContainer = root.parentElement;\n  if (rootContainer === null) return null;\n\n  return createPortal(\n    <SelectionRects selection={info} styles={styles} />,\n    rootContainer\n  );\n}\n\nfunction SelectionRects({\n  selection,\n  styles = {},\n}: {\n  selection: SelectionInfo;\n  styles?: Partial<CSSStyleDeclaration>;\n}) {\n  const [editor] = useLexicalComposerContext();\n\n  const divRef = useRef<HTMLDivElement>(null);\n\n  useLayoutEffect(() => {\n    const container = divRef.current;\n    if (container === null) return;\n\n    function drawSelectionRects() {\n      if (container === null) return;\n\n      // Remove all existing children of the container\n      while (container.firstChild) {\n        container.removeChild(container.firstChild);\n      }\n\n      const range = createDOMRange(\n        editor,\n        selection.anchor.node,\n        selection.anchor.offset,\n        selection.focus.node,\n        selection.focus.offset\n      );\n\n      if (range === null) return;\n      const rects = createRectsFromDOMRange(editor, range);\n\n      for (const rect of rects) {\n        const div = document.createElement(\"div\");\n\n        Object.assign(div.style, {\n          backgroundColor: \"rgba(255, 212, 0, 0.14)\",\n          ...styles,\n          position: \"absolute\",\n          top: `${rect.top - container.getBoundingClientRect().top}px`,\n          left: `${rect.left - container.getBoundingClientRect().left}px`,\n          width: `${rect.width}px`,\n          height: `${rect.height}px`,\n          pointerEvents: \"none\",\n        });\n\n        container.appendChild(div);\n      }\n    }\n\n    // Observe resizes of the container element to redraw the selection\n    const observer = new ResizeObserver(drawSelectionRects);\n\n    observer.observe(container);\n\n    // Listen to updates in the editor to redraw the selection\n    const unsubscribeFromUpdates =\n      editor.registerUpdateListener(drawSelectionRects);\n\n    return () => {\n      observer.disconnect();\n      unsubscribeFromUpdates();\n    };\n  }, [selection, editor, styles]);\n\n  return (\n    <div\n      ref={divRef}\n      style={{\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"100%\",\n        height: \"100%\",\n        pointerEvents: \"none\",\n      }}\n    />\n  );\n}\n\ntype SelectionInfo = {\n  anchor: {\n    node: LexicalNode;\n    offset: number;\n  };\n  focus: {\n    node: LexicalNode;\n    offset: number;\n  };\n};\n\nfunction useSelection(): RangeSelection | null {\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(() => {\n      const selection = $getSelection();\n      if (!$isRangeSelection(selection)) return null;\n\n      if (selection.isCollapsed()) return null;\n\n      return selection;\n    });\n  }, [editor]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":[],"mappings":"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"}

package/dist/floating-selection-container.js

@@ -1,157 +0,0 @@
-'use strict';
-
-var LexicalComposerContext = require('@lexical/react/LexicalComposerContext');
-var lexical = require('lexical');
-var React = require('react');
-var index_js = require('use-sync-external-store/shim/index.js');
-var reactDom = require('react-dom');
-var selection = require('@lexical/selection');
-var commentPluginProvider = require('./comments/comment-plugin-provider.js');
-
-const FloatingSelectionContainer = React.forwardRef(function FloatingSelectionContainer2(props, forwardedRef) {
-  const [editor] = LexicalComposerContext.useLexicalComposerContext();
-  const selection = useSelection();
-  if (selection === null)
-    return null;
-  if (selection.isCollapsed())
-    return null;
-  const info = editor.getEditorState().read(() => {
-    return {
-      anchor: {
-        node: selection.anchor.getNode(),
-        offset: selection.anchor.offset
-      },
-      focus: {
-        node: selection.focus.getNode(),
-        offset: selection.focus.offset
-      }
-    };
-  });
-  const root = editor.getRootElement();
-  if (root === null)
-    return null;
-  const rootContainer = root.parentElement;
-  if (rootContainer === null)
-    return null;
-  return reactDom.createPortal(
-    /* @__PURE__ */ React.createElement(FloatingSelectionContainerImpl, {
-      ...props,
-      selection: info,
-      ref: forwardedRef
-    }),
-    rootContainer
-  );
-});
-const FloatingSelectionContainerImpl = React.forwardRef(function FloatingSelectionContainer3(props, forwardedRef) {
-  const {
-    children,
-    selection: selection$1,
-    sideOffset = 0,
-    alignOffset = 0,
-    collisionPadding = 0
-  } = props;
-  const hideFloatingComposer = commentPluginProvider.useHideFloatingComposer();
-  const containerRef = React.useRef(null);
-  const divRef = React.useRef(null);
-  const [editor] = LexicalComposerContext.useLexicalComposerContext();
-  React.useImperativeHandle(
-    forwardedRef,
-    () => divRef.current
-  );
-  React.useEffect(() => {
-    return editor.registerUpdateListener(({ editorState: state, tags }) => {
-      if (tags.has("collaboration"))
-        return;
-      state.read(() => hideFloatingComposer());
-    });
-  }, [editor, hideFloatingComposer]);
-  React.useLayoutEffect(() => {
-    const content = divRef.current;
-    if (content === null)
-      return;
-    const parent = containerRef.current;
-    if (parent === null)
-      return;
-    function positionContent() {
-      const content2 = divRef.current;
-      if (content2 === null)
-        return;
-      const parent2 = content2.parentElement;
-      if (parent2 === null)
-        return;
-      const range = selection.createDOMRange(
-        editor,
-        selection$1.anchor.node,
-        selection$1.anchor.offset,
-        selection$1.focus.node,
-        selection$1.focus.offset
-      );
-      if (range === null)
-        return;
-      const rect = range.getBoundingClientRect();
-      let left = rect.left - parent2.getBoundingClientRect().left;
-      let top = rect.bottom - parent2.getBoundingClientRect().top;
-      left += alignOffset;
-      const width = content2.getBoundingClientRect().width;
-      left = left + rect.width / 2 - width / 2;
-      if (left < collisionPadding) {
-        left = collisionPadding;
-      } else if (left + width > parent2.getBoundingClientRect().right - parent2.getBoundingClientRect().left - collisionPadding) {
-        left = parent2.getBoundingClientRect().right - parent2.getBoundingClientRect().left - width - collisionPadding;
-      }
-      top += sideOffset;
-      const height = content2.getBoundingClientRect().height;
-      if (top + height > parent2.getBoundingClientRect().height - parent2.getBoundingClientRect().top + collisionPadding) {
-        top = rect.top - parent2.getBoundingClientRect().top - height;
-        top -= sideOffset;
-      }
-      content2.style.left = `${left}px`;
-      content2.style.top = `${top}px`;
-    }
-    const observer = new ResizeObserver(positionContent);
-    observer.observe(parent);
-    const unsubscribeFromUpdates = editor.registerUpdateListener(positionContent);
-    return () => {
-      observer.disconnect();
-      unsubscribeFromUpdates();
-    };
-  }, [selection$1, editor]);
-  return /* @__PURE__ */ React.createElement("div", {
-    ref: containerRef,
-    style: {
-      position: "absolute",
-      top: 0,
-      left: 0,
-      width: "100%",
-      height: "100%",
-      pointerEvents: "none"
-    }
-  }, /* @__PURE__ */ React.createElement("div", {
-    ref: divRef,
-    style: {
-      position: "absolute",
-      pointerEvents: "auto"
-    }
-  }, children));
-});
-function useSelection() {
-  const [editor] = LexicalComposerContext.useLexicalComposerContext();
-  const subscribe = React.useCallback(
-    (onStoreChange) => {
-      return editor.registerUpdateListener(onStoreChange);
-    },
-    [editor]
-  );
-  const getSnapshot = React.useCallback(() => {
-    return editor.getEditorState().read(() => {
-      const selection = lexical.$getSelection();
-      if (!lexical.$isRangeSelection(selection))
-        return null;
-      return selection;
-    });
-  }, [editor]);
-  return index_js.useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
-}
-
-exports.FloatingSelectionContainer = FloatingSelectionContainer;
-//# sourceMappingURL=floating-selection-container.js.map

package/dist/floating-selection-container.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"floating-selection-container.js","sources":["../src/floating-selection-container.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n  RangeSelection,\n  $getSelection,\n  $isRangeSelection,\n  LexicalNode,\n} from \"lexical\";\nimport React, {\n  forwardRef,\n  PropsWithChildren,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useRef,\n} from \"react\";\nimport { useSyncExternalStore } from \"use-sync-external-store/shim/index.js\";\nimport { createPortal } from \"react-dom\";\nimport { createDOMRange } from \"@lexical/selection\";\nimport { useHideFloatingComposer } from \"./comments/comment-plugin-provider\";\n\nexport interface FloatingSelectionContainerProps {\n  sideOffset?: number;\n  alignOffset?: number;\n  collisionPadding?: number;\n}\n\nexport const FloatingSelectionContainer = forwardRef<\n  HTMLDivElement | null,\n  PropsWithChildren<FloatingSelectionContainerProps>\n>(function FloatingSelectionContainer(props, forwardedRef) {\n  const [editor] = useLexicalComposerContext();\n  const selection = useSelection();\n\n  if (selection === null) return null;\n\n  if (selection.isCollapsed()) return null;\n\n  const info = editor.getEditorState().read(() => {\n    return {\n      anchor: {\n        node: selection.anchor.getNode(),\n        offset: selection.anchor.offset,\n      },\n      focus: {\n        node: selection.focus.getNode(),\n        offset: selection.focus.offset,\n      },\n    };\n  });\n\n  const root = editor.getRootElement();\n  if (root === null) return null;\n\n  const rootContainer = root.parentElement;\n  if (rootContainer === null) return null;\n\n  return createPortal(\n    <FloatingSelectionContainerImpl\n      {...props}\n      selection={info}\n      ref={forwardedRef}\n    />,\n    rootContainer\n  );\n});\n\ntype SelectionInfo = {\n  anchor: {\n    node: LexicalNode;\n    offset: number;\n  };\n  focus: {\n    node: LexicalNode;\n    offset: number;\n  };\n};\n\ninterface FloatingSelectionContainerImplProps\n  extends FloatingSelectionContainerProps {\n  selection: SelectionInfo;\n}\n\nconst FloatingSelectionContainerImpl = forwardRef<\n  HTMLDivElement | null,\n  PropsWithChildren<FloatingSelectionContainerImplProps>\n>(function FloatingSelectionContainer(props, forwardedRef) {\n  const {\n    children,\n    selection,\n    sideOffset = 0,\n    alignOffset = 0,\n    collisionPadding = 0,\n  } = props;\n\n  const hideFloatingComposer = useHideFloatingComposer();\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const divRef = useRef<HTMLDivElement>(null);\n\n  const [editor] = useLexicalComposerContext();\n\n  useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(\n    forwardedRef,\n    () => divRef.current\n  );\n\n  useEffect(() => {\n    return editor.registerUpdateListener(({ editorState: state, tags }) => {\n      // Ignore selection updates related to collaboration\n      if (tags.has(\"collaboration\")) return;\n      state.read(() => hideFloatingComposer());\n    });\n  }, [editor, hideFloatingComposer]);\n\n  useLayoutEffect(() => {\n    const content = divRef.current;\n    if (content === null) return;\n\n    const parent = containerRef.current;\n    if (parent === null) return;\n\n    function positionContent() {\n      const content = divRef.current;\n      if (content === null) return;\n\n      const parent = content.parentElement;\n      if (parent === null) return;\n\n      // Create a DOM range from the selection\n      const range = createDOMRange(\n        editor,\n        selection.anchor.node,\n        selection.anchor.offset,\n        selection.focus.node,\n        selection.focus.offset\n      );\n\n      if (range === null) return;\n\n      // Get the bounding client rect of the DOM (selection) range\n      const rect = range.getBoundingClientRect();\n\n      // Set the position of the floating container\n      let left = rect.left - parent.getBoundingClientRect().left;\n      let top = rect.bottom - parent.getBoundingClientRect().top;\n\n      // Apply the align offset\n      left += alignOffset;\n\n      // Get the width and height of the content\n      const width = content.getBoundingClientRect().width;\n      left = left + rect.width / 2 - width / 2;\n\n      // Ensure content does not overflow the container\n      if (left < collisionPadding) {\n        left = collisionPadding;\n      } else if (\n        left + width >\n        parent.getBoundingClientRect().right -\n          parent.getBoundingClientRect().left -\n          collisionPadding\n      ) {\n        left =\n          parent.getBoundingClientRect().right -\n          parent.getBoundingClientRect().left -\n          width -\n          collisionPadding;\n      }\n\n      // Apply the side offset\n      top += sideOffset;\n\n      const height = content.getBoundingClientRect().height;\n\n      if (\n        top + height >\n        parent.getBoundingClientRect().height -\n          parent.getBoundingClientRect().top +\n          collisionPadding\n      ) {\n        top = rect.top - parent.getBoundingClientRect().top - height;\n        top -= sideOffset;\n      }\n\n      content.style.left = `${left}px`;\n      content.style.top = `${top}px`;\n    }\n\n    // Observe resizes of the container element to redraw the selection\n    const observer = new ResizeObserver(positionContent);\n    observer.observe(parent);\n\n    // Listen to updates in the editor to redraw the selection\n    const unsubscribeFromUpdates =\n      editor.registerUpdateListener(positionContent);\n\n    return () => {\n      observer.disconnect();\n      unsubscribeFromUpdates();\n    };\n  }, [selection, editor]);\n\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"100%\",\n        height: \"100%\",\n        pointerEvents: \"none\",\n      }}\n    >\n      <div\n        ref={divRef}\n        style={{\n          position: \"absolute\",\n          pointerEvents: \"auto\",\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n});\n\nfunction useSelection(): RangeSelection | null {\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(() => {\n      const selection = $getSelection();\n      if (!$isRangeSelection(selection)) return null;\n\n      return selection;\n    });\n  }, [editor]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["forwardRef","FloatingSelectionContainer","useLexicalComposerContext","createPortal","selection","useHideFloatingComposer","useRef","useImperativeHandle","useEffect","useLayoutEffect","content","parent","createDOMRange","useCallback","$getSelection","$isRangeSelection","useSyncExternalStore"],"mappings":"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"}

package/dist/floating-selection-container.mjs

@@ -1,155 +0,0 @@
-import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
-import { $getSelection, $isRangeSelection } from 'lexical';
-import React__default, { forwardRef, useRef, useImperativeHandle, useEffect, useLayoutEffect, useCallback } from 'react';
-import { useSyncExternalStore } from 'use-sync-external-store/shim/index.js';
-import { createPortal } from 'react-dom';
-import { createDOMRange } from '@lexical/selection';
-import { useHideFloatingComposer } from './comments/comment-plugin-provider.mjs';
-
-const FloatingSelectionContainer = forwardRef(function FloatingSelectionContainer2(props, forwardedRef) {
-  const [editor] = useLexicalComposerContext();
-  const selection = useSelection();
-  if (selection === null)
-    return null;
-  if (selection.isCollapsed())
-    return null;
-  const info = editor.getEditorState().read(() => {
-    return {
-      anchor: {
-        node: selection.anchor.getNode(),
-        offset: selection.anchor.offset
-      },
-      focus: {
-        node: selection.focus.getNode(),
-        offset: selection.focus.offset
-      }
-    };
-  });
-  const root = editor.getRootElement();
-  if (root === null)
-    return null;
-  const rootContainer = root.parentElement;
-  if (rootContainer === null)
-    return null;
-  return createPortal(
-    /* @__PURE__ */ React__default.createElement(FloatingSelectionContainerImpl, {
-      ...props,
-      selection: info,
-      ref: forwardedRef
-    }),
-    rootContainer
-  );
-});
-const FloatingSelectionContainerImpl = forwardRef(function FloatingSelectionContainer3(props, forwardedRef) {
-  const {
-    children,
-    selection,
-    sideOffset = 0,
-    alignOffset = 0,
-    collisionPadding = 0
-  } = props;
-  const hideFloatingComposer = useHideFloatingComposer();
-  const containerRef = useRef(null);
-  const divRef = useRef(null);
-  const [editor] = useLexicalComposerContext();
-  useImperativeHandle(
-    forwardedRef,
-    () => divRef.current
-  );
-  useEffect(() => {
-    return editor.registerUpdateListener(({ editorState: state, tags }) => {
-      if (tags.has("collaboration"))
-        return;
-      state.read(() => hideFloatingComposer());
-    });
-  }, [editor, hideFloatingComposer]);
-  useLayoutEffect(() => {
-    const content = divRef.current;
-    if (content === null)
-      return;
-    const parent = containerRef.current;
-    if (parent === null)
-      return;
-    function positionContent() {
-      const content2 = divRef.current;
-      if (content2 === null)
-        return;
-      const parent2 = content2.parentElement;
-      if (parent2 === null)
-        return;
-      const range = createDOMRange(
-        editor,
-        selection.anchor.node,
-        selection.anchor.offset,
-        selection.focus.node,
-        selection.focus.offset
-      );
-      if (range === null)
-        return;
-      const rect = range.getBoundingClientRect();
-      let left = rect.left - parent2.getBoundingClientRect().left;
-      let top = rect.bottom - parent2.getBoundingClientRect().top;
-      left += alignOffset;
-      const width = content2.getBoundingClientRect().width;
-      left = left + rect.width / 2 - width / 2;
-      if (left < collisionPadding) {
-        left = collisionPadding;
-      } else if (left + width > parent2.getBoundingClientRect().right - parent2.getBoundingClientRect().left - collisionPadding) {
-        left = parent2.getBoundingClientRect().right - parent2.getBoundingClientRect().left - width - collisionPadding;
-      }
-      top += sideOffset;
-      const height = content2.getBoundingClientRect().height;
-      if (top + height > parent2.getBoundingClientRect().height - parent2.getBoundingClientRect().top + collisionPadding) {
-        top = rect.top - parent2.getBoundingClientRect().top - height;
-        top -= sideOffset;
-      }
-      content2.style.left = `${left}px`;
-      content2.style.top = `${top}px`;
-    }
-    const observer = new ResizeObserver(positionContent);
-    observer.observe(parent);
-    const unsubscribeFromUpdates = editor.registerUpdateListener(positionContent);
-    return () => {
-      observer.disconnect();
-      unsubscribeFromUpdates();
-    };
-  }, [selection, editor]);
-  return /* @__PURE__ */ React__default.createElement("div", {
-    ref: containerRef,
-    style: {
-      position: "absolute",
-      top: 0,
-      left: 0,
-      width: "100%",
-      height: "100%",
-      pointerEvents: "none"
-    }
-  }, /* @__PURE__ */ React__default.createElement("div", {
-    ref: divRef,
-    style: {
-      position: "absolute",
-      pointerEvents: "auto"
-    }
-  }, children));
-});
-function useSelection() {
-  const [editor] = useLexicalComposerContext();
-  const subscribe = useCallback(
-    (onStoreChange) => {
-      return editor.registerUpdateListener(onStoreChange);
-    },
-    [editor]
-  );
-  const getSnapshot = useCallback(() => {
-    return editor.getEditorState().read(() => {
-      const selection = $getSelection();
-      if (!$isRangeSelection(selection))
-        return null;
-      return selection;
-    });
-  }, [editor]);
-  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
-}
-
-export { FloatingSelectionContainer };
-//# sourceMappingURL=floating-selection-container.mjs.map

package/dist/floating-selection-container.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"floating-selection-container.mjs","sources":["../src/floating-selection-container.tsx"],"sourcesContent":["import { useLexicalComposerContext } from \"@lexical/react/LexicalComposerContext\";\nimport {\n  RangeSelection,\n  $getSelection,\n  $isRangeSelection,\n  LexicalNode,\n} from \"lexical\";\nimport React, {\n  forwardRef,\n  PropsWithChildren,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useLayoutEffect,\n  useRef,\n} from \"react\";\nimport { useSyncExternalStore } from \"use-sync-external-store/shim/index.js\";\nimport { createPortal } from \"react-dom\";\nimport { createDOMRange } from \"@lexical/selection\";\nimport { useHideFloatingComposer } from \"./comments/comment-plugin-provider\";\n\nexport interface FloatingSelectionContainerProps {\n  sideOffset?: number;\n  alignOffset?: number;\n  collisionPadding?: number;\n}\n\nexport const FloatingSelectionContainer = forwardRef<\n  HTMLDivElement | null,\n  PropsWithChildren<FloatingSelectionContainerProps>\n>(function FloatingSelectionContainer(props, forwardedRef) {\n  const [editor] = useLexicalComposerContext();\n  const selection = useSelection();\n\n  if (selection === null) return null;\n\n  if (selection.isCollapsed()) return null;\n\n  const info = editor.getEditorState().read(() => {\n    return {\n      anchor: {\n        node: selection.anchor.getNode(),\n        offset: selection.anchor.offset,\n      },\n      focus: {\n        node: selection.focus.getNode(),\n        offset: selection.focus.offset,\n      },\n    };\n  });\n\n  const root = editor.getRootElement();\n  if (root === null) return null;\n\n  const rootContainer = root.parentElement;\n  if (rootContainer === null) return null;\n\n  return createPortal(\n    <FloatingSelectionContainerImpl\n      {...props}\n      selection={info}\n      ref={forwardedRef}\n    />,\n    rootContainer\n  );\n});\n\ntype SelectionInfo = {\n  anchor: {\n    node: LexicalNode;\n    offset: number;\n  };\n  focus: {\n    node: LexicalNode;\n    offset: number;\n  };\n};\n\ninterface FloatingSelectionContainerImplProps\n  extends FloatingSelectionContainerProps {\n  selection: SelectionInfo;\n}\n\nconst FloatingSelectionContainerImpl = forwardRef<\n  HTMLDivElement | null,\n  PropsWithChildren<FloatingSelectionContainerImplProps>\n>(function FloatingSelectionContainer(props, forwardedRef) {\n  const {\n    children,\n    selection,\n    sideOffset = 0,\n    alignOffset = 0,\n    collisionPadding = 0,\n  } = props;\n\n  const hideFloatingComposer = useHideFloatingComposer();\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const divRef = useRef<HTMLDivElement>(null);\n\n  const [editor] = useLexicalComposerContext();\n\n  useImperativeHandle<HTMLDivElement | null, HTMLDivElement | null>(\n    forwardedRef,\n    () => divRef.current\n  );\n\n  useEffect(() => {\n    return editor.registerUpdateListener(({ editorState: state, tags }) => {\n      // Ignore selection updates related to collaboration\n      if (tags.has(\"collaboration\")) return;\n      state.read(() => hideFloatingComposer());\n    });\n  }, [editor, hideFloatingComposer]);\n\n  useLayoutEffect(() => {\n    const content = divRef.current;\n    if (content === null) return;\n\n    const parent = containerRef.current;\n    if (parent === null) return;\n\n    function positionContent() {\n      const content = divRef.current;\n      if (content === null) return;\n\n      const parent = content.parentElement;\n      if (parent === null) return;\n\n      // Create a DOM range from the selection\n      const range = createDOMRange(\n        editor,\n        selection.anchor.node,\n        selection.anchor.offset,\n        selection.focus.node,\n        selection.focus.offset\n      );\n\n      if (range === null) return;\n\n      // Get the bounding client rect of the DOM (selection) range\n      const rect = range.getBoundingClientRect();\n\n      // Set the position of the floating container\n      let left = rect.left - parent.getBoundingClientRect().left;\n      let top = rect.bottom - parent.getBoundingClientRect().top;\n\n      // Apply the align offset\n      left += alignOffset;\n\n      // Get the width and height of the content\n      const width = content.getBoundingClientRect().width;\n      left = left + rect.width / 2 - width / 2;\n\n      // Ensure content does not overflow the container\n      if (left < collisionPadding) {\n        left = collisionPadding;\n      } else if (\n        left + width >\n        parent.getBoundingClientRect().right -\n          parent.getBoundingClientRect().left -\n          collisionPadding\n      ) {\n        left =\n          parent.getBoundingClientRect().right -\n          parent.getBoundingClientRect().left -\n          width -\n          collisionPadding;\n      }\n\n      // Apply the side offset\n      top += sideOffset;\n\n      const height = content.getBoundingClientRect().height;\n\n      if (\n        top + height >\n        parent.getBoundingClientRect().height -\n          parent.getBoundingClientRect().top +\n          collisionPadding\n      ) {\n        top = rect.top - parent.getBoundingClientRect().top - height;\n        top -= sideOffset;\n      }\n\n      content.style.left = `${left}px`;\n      content.style.top = `${top}px`;\n    }\n\n    // Observe resizes of the container element to redraw the selection\n    const observer = new ResizeObserver(positionContent);\n    observer.observe(parent);\n\n    // Listen to updates in the editor to redraw the selection\n    const unsubscribeFromUpdates =\n      editor.registerUpdateListener(positionContent);\n\n    return () => {\n      observer.disconnect();\n      unsubscribeFromUpdates();\n    };\n  }, [selection, editor]);\n\n  return (\n    <div\n      ref={containerRef}\n      style={{\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"100%\",\n        height: \"100%\",\n        pointerEvents: \"none\",\n      }}\n    >\n      <div\n        ref={divRef}\n        style={{\n          position: \"absolute\",\n          pointerEvents: \"auto\",\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n});\n\nfunction useSelection(): RangeSelection | null {\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(() => {\n      const selection = $getSelection();\n      if (!$isRangeSelection(selection)) return null;\n\n      return selection;\n    });\n  }, [editor]);\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"],"names":["FloatingSelectionContainer","React","content","parent"],"mappings":"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"}