@blocklet/editor-lite 2.6.0

package/lib/main/plugins/FloatingTextFormatToolbarPlugin/ColorPickerButton.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { $patchStyleText } from '@lexical/selection';
+import { $getSelection, $isRangeSelection } from 'lexical';
+import { useCallback, useState } from 'react';
+import ColorPicker from '../../ui/ColorPicker';
+export default function ColorPickerButton({ editor }) {
+    const [fontColor] = useState('rgb(208, 2, 27)');
+    const [bgColor] = useState('#fff');
+    const applyStyleText = useCallback((styles) => {
+        editor.update(() => {
+            const selection = $getSelection();
+            if ($isRangeSelection(selection)) {
+                $patchStyleText(selection, styles);
+            }
+        });
+    }, [editor]);
+    const onFontColorSelect = useCallback((value) => {
+        applyStyleText({ color: value });
+    }, [applyStyleText]);
+    const onBgColorSelect = useCallback((value) => {
+        applyStyleText({ 'background-color': value });
+    }, [applyStyleText]);
+    return (_jsxs(_Fragment, { children: [_jsx(ColorPicker, { buttonClassName: "popup-item spaced popup-item-color", buttonAriaLabel: "Formatting text color", buttonIconClassName: "iconify", buttonIconData: "mdi:format-color-text", color: fontColor, onChange: onFontColorSelect, title: "text color" }), _jsx(ColorPicker, { buttonClassName: "popup-item spaced popup-item-background", buttonAriaLabel: "Formatting background color", buttonIconClassName: "iconify", buttonIconData: "mdi:format-color-fill", color: bgColor, onChange: onBgColorSelect, title: "bg color" })] }));
+}

package/lib/main/plugins/FloatingTextFormatToolbarPlugin/index.css

@@ -0,0 +1,128 @@
+@container blocklet-editor (max-width: 700px) {
+  .floating-text-format-popup .popup-item-subscript,
+  .floating-text-format-popup .popup-item-superscript,
+  .floating-text-format-popup .popup-item-color,
+  .floating-text-format-popup .popup-item-background {
+    display: none !important;
+  }
+}
+
+.floating-text-format-popup {
+  display: flex;
+  padding: 4px;
+  vertical-align: middle;
+  position: absolute;
+  top: 0;
+  left: 0;
+  opacity: 0;
+  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
+  border-radius: 8px;
+  transition: opacity 0.5s;
+  will-change: transform;
+  z-index: 1201;
+}
+
+.floating-text-format-popup button.popup-item {
+  border: 0;
+  display: flex;
+  background: none;
+  border-radius: 10px;
+  padding: 8px;
+  cursor: pointer;
+  vertical-align: middle;
+}
+
+.floating-text-format-popup button.popup-item:disabled {
+  cursor: not-allowed;
+}
+
+.floating-text-format-popup button.popup-item.spaced {
+  margin-right: 2px;
+}
+
+.floating-text-format-popup button.popup-item i.format {
+  background-size: contain;
+  display: inline-block;
+  height: 18px;
+  width: 18px;
+  margin-top: 2px;
+  vertical-align: -0.25em;
+  display: flex;
+  opacity: 0.6;
+}
+
+.floating-text-format-popup button.popup-item:disabled i.format {
+  opacity: 0.2;
+}
+
+.floating-text-format-popup button.popup-item.active i {
+  opacity: 1;
+}
+
+.floating-text-format-popup select.popup-item {
+  border: 0;
+  display: flex;
+  background: none;
+  border-radius: 10px;
+  padding: 8px;
+  vertical-align: middle;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  width: 70px;
+  font-size: 14px;
+  color: #777;
+  text-overflow: ellipsis;
+}
+
+.floating-text-format-popup select.code-language {
+  text-transform: capitalize;
+  width: 130px;
+}
+
+.floating-text-format-popup .popup-item .text {
+  display: flex;
+  line-height: 20px;
+  width: 200px;
+  vertical-align: middle;
+  font-size: 14px;
+  color: #777;
+  text-overflow: ellipsis;
+  width: 70px;
+  overflow: hidden;
+  height: 20px;
+  text-align: left;
+  margin-left: 8px;
+}
+
+.floating-text-format-popup .popup-item .icon {
+  display: flex;
+  width: 20px;
+  height: 20px;
+  user-select: none;
+  line-height: 16px;
+  background-size: contain;
+}
+
+.floating-text-format-popup i.chevron-down {
+  margin-top: 3px;
+  width: 16px;
+  height: 16px;
+  display: flex;
+  user-select: none;
+}
+
+.floating-text-format-popup i.chevron-down.inside {
+  width: 16px;
+  height: 16px;
+  display: flex;
+  margin-left: -25px;
+  margin-top: 11px;
+  margin-right: 10px;
+  pointer-events: none;
+}
+
+.floating-text-format-popup .divider {
+  width: 1px;
+  background-color: #eee;
+  margin: 0 4px;
+}

package/lib/main/plugins/FloatingTextFormatToolbarPlugin/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 { type JSX } from 'react';
+import './index.css';
+export default function FloatingTextFormatToolbarPlugin({ anchorElem, }: {
+    anchorElem?: HTMLElement;
+}): JSX.Element | null;

package/lib/main/plugins/FloatingTextFormatToolbarPlugin/index.js

@@ -0,0 +1,216 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { $isCodeHighlightNode } from '@lexical/code';
+import { $isLinkNode, TOGGLE_LINK_COMMAND } from '@lexical/link';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { mergeRegister } from '@lexical/utils';
+import { $getSelection, $isRangeSelection, $isTextNode, COMMAND_PRIORITY_LOW, FORMAT_TEXT_COMMAND, SELECTION_CHANGE_COMMAND, } from 'lexical';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { createPortal } from 'react-dom';
+import { Box } from '@mui/material';
+import { getDOMRangeRect } from '../../utils/getDOMRangeRect';
+import { getSelectedNode } from '../../utils/getSelectedNode';
+import { setFloatingElemPosition } from '../../utils/setFloatingElemPosition';
+import { AideFloatingToolbarButton } from '../../../ext/AIPlugin';
+import './index.css';
+import ColorPickerButton from './ColorPickerButton';
+function TextFormatFloatingToolbar({ editor, anchorElem, isLink, isBold, isItalic, isUnderline, isCode, isStrikethrough, isSubscript, isSuperscript, }) {
+    const popupCharStylesEditorRef = useRef(null);
+    const insertLink = useCallback(() => {
+        if (!isLink) {
+            editor.dispatchCommand(TOGGLE_LINK_COMMAND, 'https://');
+        }
+        else {
+            editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
+        }
+    }, [editor, isLink]);
+    function mouseMoveListener(e) {
+        if (popupCharStylesEditorRef?.current && (e.buttons === 1 || e.buttons === 3)) {
+            popupCharStylesEditorRef.current.style.pointerEvents = 'none';
+        }
+    }
+    function mouseUpListener(e) {
+        if (popupCharStylesEditorRef?.current) {
+            popupCharStylesEditorRef.current.style.pointerEvents = 'auto';
+        }
+    }
+    useEffect(() => {
+        if (popupCharStylesEditorRef?.current) {
+            document.addEventListener('mousemove', mouseMoveListener);
+            document.addEventListener('mouseup', mouseUpListener);
+            return () => {
+                document.removeEventListener('mousemove', mouseMoveListener);
+                document.removeEventListener('mouseup', mouseUpListener);
+            };
+        }
+    }, [popupCharStylesEditorRef]);
+    const updateTextFormatFloatingToolbar = useCallback(() => {
+        const selection = $getSelection();
+        const popupCharStylesEditorElem = popupCharStylesEditorRef.current;
+        const nativeSelection = window.getSelection();
+        if (popupCharStylesEditorElem === null) {
+            return;
+        }
+        const rootElement = editor.getRootElement();
+        if (selection !== null &&
+            nativeSelection !== null &&
+            !nativeSelection.isCollapsed &&
+            rootElement !== null &&
+            rootElement.contains(nativeSelection.anchorNode)) {
+            const rangeRect = getDOMRangeRect(nativeSelection, rootElement);
+            setFloatingElemPosition(rangeRect, popupCharStylesEditorElem, anchorElem);
+        }
+    }, [editor, anchorElem]);
+    useEffect(() => {
+        const scrollerElem = anchorElem.parentElement;
+        const update = () => {
+            editor.getEditorState().read(() => {
+                updateTextFormatFloatingToolbar();
+            });
+        };
+        window.addEventListener('resize', update);
+        if (scrollerElem) {
+            scrollerElem.addEventListener('scroll', update);
+        }
+        return () => {
+            window.removeEventListener('resize', update);
+            if (scrollerElem) {
+                scrollerElem.removeEventListener('scroll', update);
+            }
+        };
+    }, [editor, updateTextFormatFloatingToolbar, anchorElem]);
+    useEffect(() => {
+        editor.getEditorState().read(() => {
+            updateTextFormatFloatingToolbar();
+        });
+        return mergeRegister(editor.registerUpdateListener((payload) => {
+            if (!payload)
+                return;
+            const { editorState } = payload;
+            editorState.read(() => {
+                updateTextFormatFloatingToolbar();
+            });
+        }), editor.registerCommand(SELECTION_CHANGE_COMMAND, () => {
+            updateTextFormatFloatingToolbar();
+            return false;
+        }, COMMAND_PRIORITY_LOW));
+    }, [editor, updateTextFormatFloatingToolbar]);
+    return (_jsx(Box, { ref: popupCharStylesEditorRef, className: "floating-text-format-popup", sx: {
+            border: 1,
+            borderColor: 'divider',
+            bgcolor: 'background.default',
+            'button.popup-item': {
+                height: 28,
+                color: 'text.primary',
+            },
+            'button.popup-item.active': {
+                bgcolor: 'action.selected',
+            },
+            '.popup-item:hover:not([disabled])': {
+                bgcolor: 'action.hover',
+            },
+            '> button': {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                '& .iconify': {
+                    fontSize: 16,
+                    opacity: 0.6,
+                },
+                '&.active': {
+                    '& .iconify': {
+                        opacity: 1,
+                    },
+                },
+            },
+        }, children: editor.isEditable() && (_jsxs(_Fragment, { children: [_jsx(AideFloatingToolbarButton, {}), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold');
+                    }, className: `popup-item spaced ${isBold ? 'active' : ''}`, "aria-label": "Format text as bold", children: _jsx("i", { className: "iconify", "data-icon": "mdi:format-bold" }) }), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic');
+                    }, className: `popup-item spaced ${isItalic ? 'active' : ''}`, "aria-label": "Format text as italics", children: _jsx("i", { className: "iconify", "data-icon": "mdi:format-italic" }) }), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline');
+                    }, className: `popup-item spaced ${isUnderline ? 'active' : ''}`, "aria-label": "Format text to underlined", children: _jsx("i", { className: "iconify", "data-icon": "mdi:format-underline" }) }), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough');
+                    }, className: `popup-item spaced popup-item-strikethrough ${isStrikethrough ? 'active' : ''}`, "aria-label": "Format text with a strikethrough", children: _jsx("i", { className: "iconify", "data-icon": "mdi:format-strikethrough-variant" }) }), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'subscript');
+                    }, className: `popup-item spaced popup-item-subscript ${isSubscript ? 'active' : ''}`, title: "Subscript", "aria-label": "Format Subscript", children: _jsx("i", { className: "iconify", "data-icon": "mdi:format-subscript" }) }), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'superscript');
+                    }, className: `popup-item spaced popup-item-superscript ${isSuperscript ? 'active' : ''}`, title: "Superscript", "aria-label": "Format Superscript", children: _jsx("i", { className: "iconify", "data-icon": "mdi:format-superscript" }) }), _jsx("button", { onClick: () => {
+                        editor.dispatchCommand(FORMAT_TEXT_COMMAND, 'code');
+                    }, className: `popup-item spaced ${isCode ? 'active' : ''}`, "aria-label": "Insert code block", children: _jsx("i", { className: "iconify", "data-icon": "mdi:code-tags" }) }), _jsx("button", { onClick: insertLink, className: `popup-item spaced ${isLink ? 'active' : ''}`, "aria-label": "Insert link", children: _jsx("i", { className: "iconify", "data-icon": "mdi:link" }) }), _jsx(ColorPickerButton, { editor: editor })] })) }));
+}
+function useFloatingTextFormatToolbar(editor, anchorElem) {
+    const [isText, setIsText] = useState(false);
+    const [isLink, setIsLink] = useState(false);
+    const [isBold, setIsBold] = useState(false);
+    const [isItalic, setIsItalic] = useState(false);
+    const [isUnderline, setIsUnderline] = useState(false);
+    const [isStrikethrough, setIsStrikethrough] = useState(false);
+    const [isSubscript, setIsSubscript] = useState(false);
+    const [isSuperscript, setIsSuperscript] = useState(false);
+    const [isCode, setIsCode] = useState(false);
+    const updatePopup = useCallback(() => {
+        editor.getEditorState().read(() => {
+            // Should not to pop up the floating toolbar when using IME input
+            if (editor.isComposing()) {
+                return;
+            }
+            const selection = $getSelection();
+            const nativeSelection = window.getSelection();
+            const rootElement = editor.getRootElement();
+            if (nativeSelection !== null &&
+                (!$isRangeSelection(selection) || rootElement === null || !rootElement.contains(nativeSelection.anchorNode))) {
+                setIsText(false);
+                return;
+            }
+            if (!$isRangeSelection(selection)) {
+                return;
+            }
+            const node = getSelectedNode(selection);
+            // Update text format
+            setIsBold(selection.hasFormat('bold'));
+            setIsItalic(selection.hasFormat('italic'));
+            setIsUnderline(selection.hasFormat('underline'));
+            setIsStrikethrough(selection.hasFormat('strikethrough'));
+            setIsSubscript(selection.hasFormat('subscript'));
+            setIsSuperscript(selection.hasFormat('superscript'));
+            setIsCode(selection.hasFormat('code'));
+            // Update links
+            const parent = node.getParent();
+            if ($isLinkNode(parent) || $isLinkNode(node)) {
+                setIsLink(true);
+            }
+            else {
+                setIsLink(false);
+            }
+            if (!$isCodeHighlightNode(selection.anchor.getNode()) && selection.getTextContent() !== '') {
+                setIsText($isTextNode(node));
+            }
+            else {
+                setIsText(false);
+            }
+        });
+    }, [editor]);
+    useEffect(() => {
+        document.addEventListener('selectionchange', updatePopup);
+        return () => {
+            document.removeEventListener('selectionchange', updatePopup);
+        };
+    }, [updatePopup]);
+    useEffect(() => {
+        return mergeRegister(editor.registerUpdateListener(() => {
+            updatePopup();
+        }), editor.registerRootListener(() => {
+            if (editor.getRootElement() === null) {
+                setIsText(false);
+            }
+        }));
+    }, [editor, updatePopup]);
+    if (!isText || isLink) {
+        return null;
+    }
+    return createPortal(_jsx(TextFormatFloatingToolbar, { editor: editor, anchorElem: anchorElem, isLink: isLink, isBold: isBold, isItalic: isItalic, isStrikethrough: isStrikethrough, isSubscript: isSubscript, isSuperscript: isSuperscript, isUnderline: isUnderline, isCode: isCode }), anchorElem);
+}
+export default function FloatingTextFormatToolbarPlugin({ anchorElem = document.body, }) {
+    const [editor] = useLexicalComposerContext();
+    return useFloatingTextFormatToolbar(editor, anchorElem);
+}

package/lib/main/plugins/HorizontalRulePlugin/index.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 default function HorizontalRulePlugin(): null;

package/lib/main/plugins/HorizontalRulePlugin/index.js

@@ -0,0 +1,30 @@
+/**
+ * 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 { $createHorizontalRuleNode, INSERT_HORIZONTAL_RULE_COMMAND } from '@lexical/react/LexicalHorizontalRuleNode';
+import { $getSelection, $isRangeSelection, COMMAND_PRIORITY_EDITOR } from 'lexical';
+import { useEffect } from 'react';
+export default function HorizontalRulePlugin() {
+    const [editor] = useLexicalComposerContext();
+    useEffect(() => {
+        return editor.registerCommand(INSERT_HORIZONTAL_RULE_COMMAND, (type) => {
+            const selection = $getSelection();
+            if (!$isRangeSelection(selection)) {
+                return false;
+            }
+            const focusNode = selection.focus.getNode();
+            if (focusNode !== null) {
+                const horizontalRuleNode = $createHorizontalRuleNode();
+                selection.insertParagraph();
+                selection.focus.getNode().getTopLevelElementOrThrow().insertBefore(horizontalRuleNode);
+            }
+            return true;
+        }, COMMAND_PRIORITY_EDITOR);
+    }, [editor]);
+    return null;
+}

package/lib/main/plugins/ImagesPlugin/index.d.ts

@@ -0,0 +1,15 @@
+import { LexicalCommand } from 'lexical';
+import { type JSX } from 'react';
+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;
+    }
+}
+export declare const isImage: (src: string) => boolean;

package/lib/main/plugins/ImagesPlugin/index.js

@@ -0,0 +1,36 @@
+/**
+ * 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 { mergeRegister } from '@lexical/utils';
+import { $createParagraphNode, $insertNodes, COMMAND_PRIORITY_EDITOR, createCommand } from 'lexical';
+import { useEffect } from 'react';
+import { $createImageNode, ImageNode } from '../../nodes/ImageNode';
+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);
+            // 插入段落再插入图片, 确保图片独自占一行 (#2505)
+            const p = $createParagraphNode();
+            $insertNodes([p, imageNode, $createParagraphNode()]);
+            p.remove();
+            return true;
+        }, COMMAND_PRIORITY_EDITOR));
+    }, [captionsEnabled, editor]);
+    return null;
+}
+const TRANSPARENT_IMAGE = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';
+const img = document.createElement('img');
+img.src = TRANSPARENT_IMAGE;
+export const isImage = (src) => {
+    return /\.(jpg|jpeg|png|gif|bmp|svg|webp|ico|tiff|tif|raw)$/i.test(src);
+};

package/lib/main/plugins/LexicalTypeaheadMenuPlugin/index.d.ts

@@ -0,0 +1,64 @@
+/**
+ * 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 { LexicalCommand, LexicalEditor, NodeKey, TextNode } from 'lexical';
+import { MutableRefObject, ReactPortal, type JSX } from 'react';
+export type QueryMatch = {
+    leadOffset: number;
+    matchingString: string;
+    replaceableString: string;
+};
+export type Resolution = {
+    match: QueryMatch;
+    getRect: () => DOMRect;
+};
+export declare const PUNCTUATION = "\\.,\\+\\*\\?\\$\\@\\|#{}\\(\\)\\^\\-\\[\\]\\\\/!%'\"~=<>_:;";
+export declare class TypeaheadOption {
+    key: string;
+    ref?: MutableRefObject<HTMLElement | null>;
+    constructor(key: string);
+    setRefElement(element: HTMLElement | null): void;
+}
+export type MenuRenderFn<TOption extends TypeaheadOption> = (anchorElementRef: MutableRefObject<HTMLElement | null>, itemProps: {
+    selectedIndex: number | null;
+    selectOptionAndCleanUp: (option: TOption) => void;
+    setHighlightedIndex: (index: number) => void;
+    options: Array<TOption>;
+}, matchingString: string) => ReactPortal | JSX.Element | null;
+export declare function getScrollParent(element: HTMLElement, includeHidden: boolean): HTMLElement | HTMLBodyElement;
+export declare function useDynamicPositioning(resolution: Resolution | null, targetElement: HTMLElement | null, onReposition: () => void, onVisibilityChange?: (isInView: boolean) => void): void;
+export declare const SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND: LexicalCommand<{
+    index: number;
+    option: TypeaheadOption;
+}>;
+export declare function useBasicTypeaheadTriggerMatch(trigger: string, { minLength, maxLength }: {
+    minLength?: number;
+    maxLength?: number;
+}): TriggerFn;
+export type TypeaheadMenuPluginProps<TOption extends TypeaheadOption> = {
+    onQueryChange: (matchingString: string | null) => void;
+    onSelectOption: (option: TOption, textNodeContainingQuery: TextNode | null, closeMenu: () => void, matchingString: string) => void;
+    options: Array<TOption>;
+    menuRenderFn: MenuRenderFn<TOption>;
+    triggerFn: TriggerFn;
+    onOpen?: (resolution: Resolution) => void;
+    onClose?: () => void;
+    anchorClassName?: string;
+};
+export type TriggerFn = (text: string, editor: LexicalEditor) => QueryMatch | null;
+export declare function LexicalTypeaheadMenuPlugin<TOption extends TypeaheadOption>({ options, onQueryChange, onSelectOption, onOpen, onClose, menuRenderFn, triggerFn, anchorClassName, }: TypeaheadMenuPluginProps<TOption>): JSX.Element | null;
+type NodeMenuPluginProps<TOption extends TypeaheadOption> = {
+    onSelectOption: (option: TOption, textNodeContainingQuery: TextNode | null, closeMenu: () => void, matchingString: string) => void;
+    options: Array<TOption>;
+    nodeKey: NodeKey | null;
+    onClose?: () => void;
+    onOpen?: (resolution: Resolution) => void;
+    menuRenderFn: MenuRenderFn<TOption>;
+    anchorClassName?: string;
+};
+export declare function LexicalNodeMenuPlugin<TOption extends TypeaheadOption>({ options, nodeKey, onClose, onOpen, onSelectOption, menuRenderFn, anchorClassName, }: NodeMenuPluginProps<TOption>): JSX.Element | null;
+export {};