/** * 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 { DecoratorComponentProps } from './shared/types.js'; import { type AnyLexicalExtension, type LexicalEditor, type LexicalExtensionOutput } from 'lexical'; import * as React from 'react'; import { type JSX } from 'react'; import { type Container, type Root } from 'react-dom/client'; export type { DecoratorComponentProps }; /** * Payload for {@link REACT_PLUGIN_HOST_MOUNT_ROOT_COMMAND}: the React DOM `root` * that the plugin host renders into. */ export interface HostMountCommandArg { root: Root; } /** * Payload for {@link REACT_PLUGIN_HOST_MOUNT_PLUGIN_COMMAND}, describing a piece * of React content to mount into the plugin host: a unique `key`, the `element` * to render (or `null` to unmount it), and an optional `domNode` to portal it * into. */ export interface MountPluginCommandArg { key: string; element: JSX.Element | null; domNode?: Element | DocumentFragment | null; } /** * Mounts the output `Component` of a {@link ReactExtension}-based extension into * an editor's plugin host, rendering it with the given `props`. Use this to add * UI for a specific extension to an editor that was not built with * {@link LexicalExtensionComposer}. The editor must use * {@link ReactPluginHostExtension} and its host must already be mounted with * {@link mountReactPluginHost}. */ export declare function mountReactExtensionComponent(editor: LexicalEditor, opts: { extension: Extension; props: [LexicalExtensionOutput] extends [ { Component: React.ComponentType; } ] ? /** The Props from the Extension output Component */ OutputComponentProps | null : never; } & Omit): void; /** * Mounts an arbitrary React `Component` (rendered with `props`, or unmounted * when `props` is `null`) into an editor's plugin host. Use this for legacy * React plug-ins or any React content. The editor must use * {@link ReactPluginHostExtension} with its host mounted via * {@link mountReactPluginHost}. */ export declare function mountReactPluginComponent

= Record>(editor: LexicalEditor, opts: { Component: React.ComponentType

; props: (P & React.Attributes) | null; } & Omit): void; /** * Mounts a React `element` (the lowest-level entry point) into an editor's * plugin host. {@link mountReactExtensionComponent} and * {@link mountReactPluginComponent} are built on top of this. The editor must * use {@link ReactPluginHostExtension} with its host mounted via * {@link mountReactPluginHost}. */ export declare function mountReactPluginElement(editor: LexicalEditor, opts: MountPluginCommandArg): void; /** * Creates a React root in `container` and mounts the editor's React plugin host * into it. Call this once before mounting any React content with * {@link mountReactExtensionComponent}, {@link mountReactPluginComponent}, or * {@link mountReactPluginElement} on an editor using * {@link ReactPluginHostExtension}. */ export declare function mountReactPluginHost(editor: LexicalEditor, container: Container): void; /** * Command dispatched by {@link mountReactPluginHost} to mount the React plugin * host into a React root (see {@link HostMountCommandArg}). Handled by * {@link ReactPluginHostExtension}. */ export declare const REACT_PLUGIN_HOST_MOUNT_ROOT_COMMAND: import("lexical").LexicalCommand; /** * Command dispatched by the mount helpers to add, update, or remove a piece of * React content in the plugin host. Its payload is a * {@link MountPluginCommandArg}, and it is handled by * {@link ReactPluginHostExtension}. */ export declare const REACT_PLUGIN_HOST_MOUNT_PLUGIN_COMMAND: import("lexical").LexicalCommand; /** * This extension provides a React host for editors that are not built * with LexicalExtensionComposer (e.g. you are using Vanilla JS or some * other framework). * * You must use {@link mountReactPluginHost} for any React content to work. * Afterwards, you may use {@link mountReactExtensionComponent} to * render UI for a specific React Extension. * {@link mountReactPluginComponent} and * {@link mountReactPluginElement} can be used to render * legacy React plug-ins (or any React content). */ export declare const ReactPluginHostExtension: import("lexical").LexicalExtension void; mountReactPluginHost: (container: Container) => boolean; mountedPluginsStore: import("@preact/signals-core").Signal<{ plugins: Map; }>; }, unknown>;