/** * 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 { MenuOption } from '@lexical/react/LexicalMenuOption'; import { SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND } from '@lexical/react/LexicalTypeaheadMenuPluginUtils'; import { type CommandListenerPriority, type LexicalEditor, type TextNode } from 'lexical'; import { type JSX, type ReactPortal, type RefObject } from 'react'; /** * Describes where a typeahead trigger matched the text before the cursor: the * `leadOffset` where the match starts, the captured `matchingString` (the query * after the trigger), and the `replaceableString` (the full matched text, * including the trigger, that should be replaced when an option is selected). */ export type MenuTextMatch = { leadOffset: number; matchingString: string; replaceableString: string; }; /** * The position and match information for an open menu: a `getRect` function that * returns the anchor rectangle the menu is positioned against, and the optional * {@link MenuTextMatch} that opened it. */ export type MenuResolution = { match?: MenuTextMatch; getRect: () => DOMRect; }; export { MenuOption }; /** * A render function for a menu's contents. It receives the anchor element ref, * the current item props (selected index, options, and helpers to select or * highlight an option), and the matching query string, and returns the menu * element (or portal) to render, or `null` to render nothing. Provide one to * fully customize a menu's appearance. */ export type MenuRenderFn = (anchorElementRef: RefObject, itemProps: { selectedIndex: number | null; selectOptionAndCleanUp: (option: TOption) => void; setHighlightedIndex: (index: number) => void; options: TOption[]; }, matchingString: string) => ReactPortal | JSX.Element | null; /** * Keeps an open menu aligned with its trigger by calling `onReposition` on * scroll, window resize, and target element resize while `resolution` is set. * Optionally calls `onVisibilityChange` when the trigger enters or leaves its * nearest scroll container's viewport. */ export declare function useDynamicPositioning(resolution: MenuResolution | null, targetElement: HTMLElement | null, onReposition: () => void, onVisibilityChange?: (isInView: boolean) => void): void; export { SCROLL_TYPEAHEAD_OPTION_INTO_VIEW_COMMAND }; export declare function LexicalMenu({ close, editor, anchorElementRef, resolution, options, menuRenderFn: menuRenderFnProp, onSelectOption, shouldSplitNodeWithQuery, commandPriority, preselectFirstItem, }: { close: () => void; editor: LexicalEditor; anchorElementRef: RefObject; resolution: MenuResolution; options: TOption[]; shouldSplitNodeWithQuery?: boolean; menuRenderFn?: MenuRenderFn; onSelectOption: (option: TOption, textNodeContainingQuery: TextNode | null, closeMenu: () => void, matchingString: string) => void; commandPriority?: CommandListenerPriority; preselectFirstItem?: boolean; }): JSX.Element | null; export declare function useMenuAnchorRef(resolution: MenuResolution | null, setResolution: (r: MenuResolution | null) => void, className?: string, parent?: HTMLElement, shouldIncludePageYOffset__EXPERIMENTAL?: boolean): RefObject; /** * Detects whether the text before the cursor should open a typeahead menu. * Given the current `text` and `editor`, it returns a {@link MenuTextMatch} * describing the match, or `null` if there is none. See * {@link useBasicTypeaheadTriggerMatch} for a common implementation. */ export type TriggerFn = (text: string, editor: LexicalEditor) => MenuTextMatch | null;