@team-monolith/cds 0.30.2 → 0.31.0

package/dist/patterns/LexicalEditor/plugins/ImagesPlugin/InsertImageUriDialogBody.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import styled from "@emotion/styled";
+import { AlertDialogContent, AlertDialogActions } from "../../../../components/AlertDialog";
+import Input from "../../../../components/Input";
+import Button from "../../../../components/Button";
+export function InsertImageUriDialogBody(props) {
+    const { onClick } = props;
+    const [src, setSrc] = useState("");
+    const [altText, setAltText] = useState("");
+    const isDisabled = src === "";
+    return (_jsxs(_Fragment, { children: [_jsx(AlertDialogContent, { children: _jsxs(Inputs, { children: [_jsx(Input, { fullWidth: true, label: "URL", placeholder: "https://source.unsplash.com/random", color: "default", size: "medium", onChange: (e) => {
+                                setSrc(e.target.value);
+                            }, value: src }), _jsx(Input, { fullWidth: true, label: "\uC124\uBA85", placeholder: "\uC774\uBBF8\uC9C0\uC5D0 \uB300\uD55C \uC124\uBA85", color: "default", size: "medium", onChange: (e) => {
+                                setAltText(e.target.value);
+                            }, value: altText })] }) }), _jsx(AlertDialogActions, { children: _jsx(Button, { label: "\uD655\uC778", size: "large", color: "primary", disabled: isDisabled, onClick: () => onClick({ altText, src }) }) })] }));
+}
+const Inputs = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 20px;
+  margin-top: 20px;
+  margin-bottom: 10px;
+`;

package/dist/patterns/LexicalEditor/plugins/ImagesPlugin/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { LexicalCommand } from "lexical";
+import { ImagePayload } from "../../nodes/ImageNode";
+export type InsertImagePayload = Readonly<ImagePayload>;
+export declare const INSERT_IMAGE_COMMAND: LexicalCommand<InsertImagePayload>;
+export default function ImagesPlugin({ captionsEnabled, }: {
+    captionsEnabled?: boolean;
+}): JSX.Element | null;
+declare global {
+    interface DragEvent {
+        rangeOffset?: number;
+        rangeParent?: Node;
+    }
+}

package/dist/patterns/LexicalEditor/plugins/ImagesPlugin/index.js

@@ -0,0 +1,151 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+import { $wrapNodeInElement, mergeRegister } from "@lexical/utils";
+import { $createParagraphNode, $createRangeSelection, $getSelection, $insertNodes, $isNodeSelection, $isRootOrShadowRoot, $setSelection, COMMAND_PRIORITY_EDITOR, COMMAND_PRIORITY_HIGH, COMMAND_PRIORITY_LOW, createCommand, DRAGOVER_COMMAND, DRAGSTART_COMMAND, DROP_COMMAND, } from "lexical";
+import { useEffect } from "react";
+import { $createImageNode, $isImageNode, ImageNode, } from "../../nodes/ImageNode";
+const CAN_USE_DOM = typeof window !== "undefined" &&
+    typeof window.document !== "undefined" &&
+    typeof window.document.createElement !== "undefined";
+const getDOMSelection = (targetWindow) => CAN_USE_DOM ? (targetWindow || window).getSelection() : null;
+export const INSERT_IMAGE_COMMAND = createCommand("INSERT_IMAGE_COMMAND");
+export default function ImagesPlugin({ captionsEnabled, }) {
+    const [editor] = useLexicalComposerContext();
+    useEffect(() => {
+        if (!editor.hasNodes([ImageNode])) {
+            throw new Error("ImagesPlugin: ImageNode not registered on editor");
+        }
+        return mergeRegister(editor.registerCommand(INSERT_IMAGE_COMMAND, (payload) => {
+            const imageNode = $createImageNode(payload);
+            $insertNodes([imageNode]);
+            if ($isRootOrShadowRoot(imageNode.getParentOrThrow())) {
+                $wrapNodeInElement(imageNode, $createParagraphNode).selectEnd();
+            }
+            return true;
+        }, COMMAND_PRIORITY_EDITOR), editor.registerCommand(DRAGSTART_COMMAND, (event) => {
+            return onDragStart(event);
+        }, COMMAND_PRIORITY_HIGH), editor.registerCommand(DRAGOVER_COMMAND, (event) => {
+            return onDragover(event);
+        }, COMMAND_PRIORITY_LOW), editor.registerCommand(DROP_COMMAND, (event) => {
+            return onDrop(event, editor);
+        }, COMMAND_PRIORITY_HIGH));
+    }, [captionsEnabled, editor]);
+    return null;
+}
+const TRANSPARENT_IMAGE = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
+const img = document.createElement("img");
+img.src = TRANSPARENT_IMAGE;
+function onDragStart(event) {
+    const node = getImageNodeInSelection();
+    if (!node) {
+        return false;
+    }
+    const dataTransfer = event.dataTransfer;
+    if (!dataTransfer) {
+        return false;
+    }
+    dataTransfer.setData("text/plain", "_");
+    dataTransfer.setDragImage(img, 0, 0);
+    dataTransfer.setData("application/x-lexical-drag", JSON.stringify({
+        data: {
+            altText: node.__altText,
+            caption: node.__caption,
+            height: node.__height,
+            key: node.getKey(),
+            maxWidth: node.__maxWidth,
+            showCaption: node.__showCaption,
+            src: node.__src,
+            width: node.__width,
+        },
+        type: "image",
+    }));
+    return true;
+}
+function onDragover(event) {
+    const node = getImageNodeInSelection();
+    if (!node) {
+        return false;
+    }
+    if (!canDropImage(event)) {
+        event.preventDefault();
+    }
+    return true;
+}
+function onDrop(event, editor) {
+    const node = getImageNodeInSelection();
+    if (!node) {
+        return false;
+    }
+    const data = getDragImageData(event);
+    if (!data) {
+        return false;
+    }
+    event.preventDefault();
+    if (canDropImage(event)) {
+        const range = getDragSelection(event);
+        node.remove();
+        const rangeSelection = $createRangeSelection();
+        if (range !== null && range !== undefined) {
+            rangeSelection.applyDOMRange(range);
+        }
+        $setSelection(rangeSelection);
+        editor.dispatchCommand(INSERT_IMAGE_COMMAND, data);
+    }
+    return true;
+}
+function getImageNodeInSelection() {
+    const selection = $getSelection();
+    if (!$isNodeSelection(selection)) {
+        return null;
+    }
+    const nodes = selection.getNodes();
+    const node = nodes[0];
+    return $isImageNode(node) ? node : null;
+}
+function getDragImageData(event) {
+    var _a;
+    const dragData = (_a = event.dataTransfer) === null || _a === void 0 ? void 0 : _a.getData("application/x-lexical-drag");
+    if (!dragData) {
+        return null;
+    }
+    const { type, data } = JSON.parse(dragData);
+    if (type !== "image") {
+        return null;
+    }
+    return data;
+}
+function canDropImage(event) {
+    const target = event.target;
+    return !!(target &&
+        target instanceof HTMLElement &&
+        !target.closest("code, span.editor-image") &&
+        target.parentElement &&
+        target.parentElement.closest("div.ContentEditable__root"));
+}
+function getDragSelection(event) {
+    let range;
+    const target = event.target;
+    const targetWindow = target == null
+        ? null
+        : target.nodeType === 9
+            ? target.defaultView
+            : target.ownerDocument.defaultView;
+    const domSelection = getDOMSelection(targetWindow);
+    if (document.caretRangeFromPoint) {
+        range = document.caretRangeFromPoint(event.clientX, event.clientY);
+    }
+    else if (event.rangeParent && domSelection !== null) {
+        domSelection.collapse(event.rangeParent, event.rangeOffset || 0);
+        range = domSelection.getRangeAt(0);
+    }
+    else {
+        throw Error(`Cannot get the selection when dragging`);
+    }
+    return range;
+}

package/dist/patterns/LexicalEditor/plugins/ListMaxIndentLevelPlugin/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+type Props = Readonly<{
+    maxDepth: number | null | undefined;
+}>;
+export default function ListMaxIndentLevelPlugin({ maxDepth }: Props): null;
+export {};

package/dist/patterns/LexicalEditor/plugins/ListMaxIndentLevelPlugin/index.js

@@ -0,0 +1,49 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { $getListDepth, $isListItemNode, $isListNode } from "@lexical/list";
+import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
+import { $getSelection, $isElementNode, $isRangeSelection, COMMAND_PRIORITY_CRITICAL, INDENT_CONTENT_COMMAND, } from "lexical";
+import { useEffect } from "react";
+function getElementNodesInSelection(selection) {
+    const nodesInSelection = selection.getNodes();
+    if (nodesInSelection.length === 0) {
+        return new Set([
+            selection.anchor.getNode().getParentOrThrow(),
+            selection.focus.getNode().getParentOrThrow(),
+        ]);
+    }
+    return new Set(nodesInSelection.map((n) => ($isElementNode(n) ? n : n.getParentOrThrow())));
+}
+function isIndentPermitted(maxDepth) {
+    const selection = $getSelection();
+    if (!$isRangeSelection(selection)) {
+        return false;
+    }
+    const elementNodesInSelection = getElementNodesInSelection(selection);
+    let totalDepth = 0;
+    for (const elementNode of elementNodesInSelection) {
+        if ($isListNode(elementNode)) {
+            totalDepth = Math.max($getListDepth(elementNode) + 1, totalDepth);
+        }
+        else if ($isListItemNode(elementNode)) {
+            const parent = elementNode.getParent();
+            if (!$isListNode(parent)) {
+                throw new Error("ListMaxIndentLevelPlugin: A ListItemNode must have a ListNode for a parent.");
+            }
+            totalDepth = Math.max($getListDepth(parent) + 1, totalDepth);
+        }
+    }
+    return totalDepth <= maxDepth;
+}
+export default function ListMaxIndentLevelPlugin({ maxDepth }) {
+    const [editor] = useLexicalComposerContext();
+    useEffect(() => {
+        return editor.registerCommand(INDENT_CONTENT_COMMAND, () => !isIndentPermitted(maxDepth !== null && maxDepth !== void 0 ? maxDepth : 7), COMMAND_PRIORITY_CRITICAL);
+    }, [editor, maxDepth]);
+    return null;
+}

package/dist/patterns/LexicalEditor/plugins/MarkdownTransformers/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { ElementTransformer, TextMatchTransformer, Transformer } from "@lexical/markdown";
+export declare const HR: ElementTransformer;
+export declare const IMAGE: TextMatchTransformer;
+export declare const TABLE: ElementTransformer;
+export declare const CODLE_TRANSFORMERS: Array<Transformer>;

package/dist/patterns/LexicalEditor/plugins/MarkdownTransformers/index.js

@@ -0,0 +1,184 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { $convertFromMarkdownString, $convertToMarkdownString, CHECK_LIST, ELEMENT_TRANSFORMERS, TEXT_FORMAT_TRANSFORMERS, TEXT_MATCH_TRANSFORMERS, } from "@lexical/markdown";
+import { $createHorizontalRuleNode, $isHorizontalRuleNode, HorizontalRuleNode, } from "@lexical/react/LexicalHorizontalRuleNode";
+import { $createTableCellNode, $createTableNode, $createTableRowNode, $isTableCellNode, $isTableNode, $isTableRowNode, TableCellHeaderStates, TableCellNode, TableNode, TableRowNode, } from "@lexical/table";
+import { $isParagraphNode, $isTextNode } from "lexical";
+import { $createImageNode, $isImageNode, ImageNode, } from "../../nodes/ImageNode";
+export const HR = {
+    dependencies: [HorizontalRuleNode],
+    export: (node) => {
+        return $isHorizontalRuleNode(node) ? "***" : null;
+    },
+    regExp: /^(---|\*\*\*|___)\s?$/,
+    replace: (parentNode, _1, _2, isImport) => {
+        const line = $createHorizontalRuleNode();
+        // TODO: Get rid of isImport flag
+        if (isImport || parentNode.getNextSibling() != null) {
+            parentNode.replace(line);
+        }
+        else {
+            parentNode.insertBefore(line);
+        }
+        line.selectNext();
+    },
+    type: "element",
+};
+export const IMAGE = {
+    dependencies: [ImageNode],
+    export: (node) => {
+        if (!$isImageNode(node)) {
+            return null;
+        }
+        return `![${node.getAltText()}](${node.getSrc()})`;
+    },
+    importRegExp: /!(?:\[([^[]*)\])(?:\(([^(]+)\))/,
+    regExp: /!(?:\[([^[]*)\])(?:\(([^(]+)\))$/,
+    replace: (textNode, match) => {
+        const [, altText, src] = match;
+        const imageNode = $createImageNode({
+            altText,
+            maxWidth: 800,
+            src,
+        });
+        textNode.replace(imageNode);
+    },
+    trigger: ")",
+    type: "text-match",
+};
+// Very primitive table setup
+const TABLE_ROW_REG_EXP = /^(?:\|)(.+)(?:\|)\s?$/;
+const TABLE_ROW_DIVIDER_REG_EXP = /^(\| ?:?-*:? ?)+\|\s?$/;
+export const TABLE = {
+    dependencies: [TableNode, TableRowNode, TableCellNode],
+    export: (node) => {
+        if (!$isTableNode(node)) {
+            return null;
+        }
+        const output = [];
+        for (const row of node.getChildren()) {
+            const rowOutput = [];
+            if (!$isTableRowNode(row)) {
+                continue;
+            }
+            let isHeaderRow = false;
+            for (const cell of row.getChildren()) {
+                // It's TableCellNode so it's just to make flow happy
+                if ($isTableCellNode(cell)) {
+                    rowOutput.push($convertToMarkdownString(CODLE_TRANSFORMERS, cell).replace(/\n/g, "\\n"));
+                    if (cell.__headerState === TableCellHeaderStates.ROW) {
+                        isHeaderRow = true;
+                    }
+                }
+            }
+            output.push(`| ${rowOutput.join(" | ")} |`);
+            if (isHeaderRow) {
+                output.push(`| ${rowOutput.map((_) => "---").join(" | ")} |`);
+            }
+        }
+        return output.join("\n");
+    },
+    regExp: TABLE_ROW_REG_EXP,
+    replace: (parentNode, _1, match) => {
+        // Header row
+        if (TABLE_ROW_DIVIDER_REG_EXP.test(match[0])) {
+            const table = parentNode.getPreviousSibling();
+            if (!table || !$isTableNode(table)) {
+                return;
+            }
+            const rows = table.getChildren();
+            const lastRow = rows[rows.length - 1];
+            if (!lastRow || !$isTableRowNode(lastRow)) {
+                return;
+            }
+            // Add header state to row cells
+            lastRow.getChildren().forEach((cell) => {
+                if (!$isTableCellNode(cell)) {
+                    return;
+                }
+                cell.toggleHeaderStyle(TableCellHeaderStates.ROW);
+            });
+            // Remove line
+            parentNode.remove();
+            return;
+        }
+        const matchCells = mapToTableCells(match[0]);
+        if (matchCells == null) {
+            return;
+        }
+        const rows = [matchCells];
+        let sibling = parentNode.getPreviousSibling();
+        let maxCells = matchCells.length;
+        while (sibling) {
+            if (!$isParagraphNode(sibling)) {
+                break;
+            }
+            if (sibling.getChildrenSize() !== 1) {
+                break;
+            }
+            const firstChild = sibling.getFirstChild();
+            if (!$isTextNode(firstChild)) {
+                break;
+            }
+            const cells = mapToTableCells(firstChild.getTextContent());
+            if (cells == null) {
+                break;
+            }
+            maxCells = Math.max(maxCells, cells.length);
+            rows.unshift(cells);
+            const previousSibling = sibling.getPreviousSibling();
+            sibling.remove();
+            sibling = previousSibling;
+        }
+        const table = $createTableNode();
+        for (const cells of rows) {
+            const tableRow = $createTableRowNode();
+            table.append(tableRow);
+            for (let i = 0; i < maxCells; i++) {
+                tableRow.append(i < cells.length ? cells[i] : createTableCell(""));
+            }
+        }
+        const previousSibling = parentNode.getPreviousSibling();
+        if ($isTableNode(previousSibling) &&
+            getTableColumnsSize(previousSibling) === maxCells) {
+            previousSibling.append(...table.getChildren());
+            parentNode.remove();
+        }
+        else {
+            parentNode.replace(table);
+        }
+        table.selectEnd();
+    },
+    type: "element",
+};
+function getTableColumnsSize(table) {
+    const row = table.getFirstChild();
+    return $isTableRowNode(row) ? row.getChildrenSize() : 0;
+}
+const createTableCell = (textContent) => {
+    textContent = textContent.replace(/\\n/g, "\n");
+    const cell = $createTableCellNode(TableCellHeaderStates.NO_STATUS);
+    $convertFromMarkdownString(textContent, CODLE_TRANSFORMERS, cell);
+    return cell;
+};
+const mapToTableCells = (textContent) => {
+    const match = textContent.match(TABLE_ROW_REG_EXP);
+    if (!match || !match[1]) {
+        return null;
+    }
+    return match[1].split("|").map((text) => createTableCell(text));
+};
+export const CODLE_TRANSFORMERS = [
+    TABLE,
+    HR,
+    IMAGE,
+    CHECK_LIST,
+    ...ELEMENT_TRANSFORMERS,
+    ...TEXT_FORMAT_TRANSFORMERS,
+    ...TEXT_MATCH_TRANSFORMERS,
+];

package/dist/patterns/LexicalEditor/theme.d.ts

@@ -0,0 +1,24 @@
+import { Theme } from "@emotion/react";
+export declare function getTheme(theme: Theme): {
+    paragraph: string;
+    quote: string;
+    heading: {
+        h1: string;
+        h2: string;
+        h3: string;
+    };
+    link: string;
+    list: {
+        nested: {
+            listitem: string;
+        };
+        olDepth: string[];
+        ulDepth: string[];
+        listitem: string;
+    };
+    code: string;
+    text: {
+        code: string;
+        strikethrough: string;
+    };
+};

package/dist/patterns/LexicalEditor/theme.js

@@ -0,0 +1,178 @@
+import { css } from "@emotion/css";
+export function getTheme(theme) {
+    return {
+        paragraph: css `
+      color: ${theme.color.foreground.neutralBase};
+
+      /* Default/Paragraph/16px-Rg */
+      font-family: ${theme.fontFamily.ui};
+      font-size: 16px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 24px; /* 150% */
+    `,
+        quote: css `
+      color: ${theme.color.container.marbleOnContainer};
+
+      /* Default/Paragraph/14px-Rg */
+      font-family: ${theme.fontFamily.ui};
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 20px; /* 142.857% */
+
+      margin: 16px 0;
+      padding-left: 12px;
+      border-left: 2px solid ${theme.color.container.marbleContainer};
+    `,
+        heading: {
+            h1: css `
+        color: ${theme.color.foreground.neutralBase};
+
+        /* Alt/Heading/32px-Hv */
+        font-family: ${theme.fontFamily.title};
+        font-size: 32px;
+        font-style: normal;
+        font-weight: 900;
+        line-height: 40px; /* 125% */
+      `,
+            h2: css `
+        color: ${theme.color.foreground.neutralBase};
+
+        /* Default/Heading/24px-Bd */
+        font-family: ${theme.fontFamily.ui};
+        font-size: 24px;
+        font-style: normal;
+        font-weight: 700;
+        line-height: 32px; /* 133.333% */
+      `,
+            h3: css `
+        color: ${theme.color.foreground.neutralBase};
+
+        /* Default/Paragraph/18px-Bd */
+        font-family: ${theme.fontFamily.ui};
+        font-size: 18px;
+        font-style: normal;
+        font-weight: 700;
+        line-height: 28px; /* 155.556% */
+      `,
+        },
+        link: css `
+      color: ${theme.color.foreground.primary};
+      text-decoration: underline;
+      cursor: pointer;
+    `,
+        list: {
+            nested: {
+                listitem: css `
+          list-style-type: none;
+          &::before,
+          &::after {
+            display: none;
+          }
+        `,
+            },
+            olDepth: [
+                css `
+          padding: 0;
+          margin: 16px 0;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-type: upper-alpha;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-type: lower-alpha;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-type: upper-roman;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-type: lower-roman;
+          list-style-position: inside;
+        `,
+            ],
+            ulDepth: [
+                css `
+          padding: 0;
+          margin: 16px 0;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-position: inside;
+        `,
+                css `
+          padding: 0;
+          margin: 0;
+          list-style-position: inside;
+        `,
+            ],
+            listitem: css `
+        margin: 0 24px;
+
+        color: ${theme.color.foreground.neutralBase};
+
+        /* Default/Paragraph/16px-Rg */
+        font-family: ${theme.fontFamily.ui};
+        font-size: 16px;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 24px; /* 150% */
+      `,
+        },
+        code: css `
+      margin: 16px 0;
+
+      display: block;
+      padding: 4px 8px;
+      border-radius: 6px;
+      background: ${theme.color.background.neutralAlt};
+
+      color: ${theme.color.foreground.neutralBase};
+
+      /* Mono/Paragraph/14px-Rg */
+      font-family: D2Coding;
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 20px; /* 142.857% */
+    `,
+        text: {
+            code: css `
+        padding: 4px 8px;
+        border-radius: 6px;
+        background: ${theme.color.background.neutralAlt};
+
+        color: ${theme.color.foreground.neutralBase};
+        /* Mono/Paragraph/14px-Rg */
+        font-family: D2Coding;
+      `,
+            strikethrough: css `
+        text-decoration: line-through;
+      `,
+        },
+    };
+}

package/dist/patterns/LexicalEditor/utils/getDOMRangeRect.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export declare function getDOMRangeRect(nativeSelection: Selection, rootElement: HTMLElement): DOMRect;

package/dist/patterns/LexicalEditor/utils/getDOMRangeRect.js

@@ -0,0 +1,22 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export function getDOMRangeRect(nativeSelection, rootElement) {
+    const domRange = nativeSelection.getRangeAt(0);
+    let rect;
+    if (nativeSelection.anchorNode === rootElement) {
+        let inner = rootElement;
+        while (inner.firstElementChild != null) {
+            inner = inner.firstElementChild;
+        }
+        rect = inner.getBoundingClientRect();
+    }
+    else {
+        rect = domRange.getBoundingClientRect();
+    }
+    return rect;
+}

package/dist/patterns/LexicalEditor/utils/getSelectedNode.d.ts

@@ -0,0 +1,2 @@
+import { ElementNode, RangeSelection, TextNode } from "lexical";
+export declare function getSelectedNode(selection: RangeSelection): TextNode | ElementNode;