mui-tiptap/dist/cjs/ControlledBubbleMenu.d.ts

A Material-UI (MUI) styled WYSIWYG rich text editor, using Tiptap

import { type PaperProps } from "@mui/material/Paper";
import { type PopperProps } from "@mui/material/Popper";
import { type SxProps } from "@mui/material/styles";
import { type Editor } from "@tiptap/core";
import { type ReactNode } from "react";
import { type ControlledBubbleMenuClasses } from "./ControlledBubbleMenu.classes";
export type ControlledBubbleMenuProps = Omit<PopperProps, "children" | "transition" | "open" | "anchorEl" | "container" | "disablePortal" | "placement" | "className" | "classes"> & {
    /** The editor instance. */
    editor: Editor;
    /** Whether the bubble menu is open. */
    open: PopperProps["open"];
    /** The content of the bubble menu. */
    children: ReactNode;
    /**
     * To override the anchor element to which the bubble menu is positioned.
     * By default, uses the current cursor position and selection.
     */
    anchorEl?: PopperProps["anchorEl"];
    /**
     * To override the HTML element into which the bubble menu Popper portal
     * children (DOM content) are appended. Uses MUI's Popper default if not
     * provided (the body of the top-level document object). Can be useful if you
     * have specialized stacking context or portal needs.
     *
     * Example:
     *
     *   <RichTextEditor ...>
     *     {() => (
     *       <>
     *         <MyControlledBubbleMenu container={containerRef.current} />
     *         <LinkBubbleMenu container={containerRef.current} />
     *         <TableBubbleMenu container={containerRef.current} />
     *       </>
     *     )}
     *   </RichTextEditor>
     */
    container?: PopperProps["container"];
    /**
     * If true, the `children` will be under the DOM hierarchy of the parent
     * component of the ControlledBubbleMenu.
     */
    disablePortal?: PopperProps["disablePortal"];
    /**
     * The placement to use for this bubble menu. By default "top". See
     * https://popper.js.org/docs/v2/constructors/#options (and
     * https://mui.com/material-ui/api/popper/).
     */
    placement?: PopperProps["placement"];
    /**
     * Alternate consecutive placements to try if the first placement does not
     * fit. By default tries other bottom and top placements (avoiding sides,
     * since the editor caret will tend to move horizontally as a user
     * types/interacts).
     */
    fallbackPlacements?: PopperProps["placement"][];
    /**
     * Applies virtual padding to the element when testing whether to flip the
     * placement. (i.e. if the element had the additional padding, would it exceed
     * its boundary and so need to be flipped?) See
     * https://popper.js.org/docs/v2/modifiers/flip/#padding and
     * https://popper.js.org/docs/v2/utils/detect-overflow/#padding. By default
     * 8px on all sides.
     */
    flipPadding?: number | {
        top?: number;
        right?: number;
        bottom?: number;
        left?: number;
    };
    /** Class applied to the root Popper element. */
    className?: string;
    /** Override or extend existing styles. */
    classes?: Partial<ControlledBubbleMenuClasses>;
    /** Provide custom styles. */
    sx?: SxProps;
    /**
     * Override the default props for the Paper containing the bubble menu
     * content.
     */
    PaperProps?: Partial<PaperProps>;
};
export default function ControlledBubbleMenu(inProps: ControlledBubbleMenuProps): import("react/jsx-runtime").JSX.Element;