@blocknote/react/types/src/schema/ReactInlineContentSpec.d.ts

A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.

import { BlockNoteEditor, CustomInlineContentConfig, CustomInlineContentImplementation, InlineContentFromConfig, InlineContentSchemaWithInlineContent, InlineContentSpec, PartialCustomInlineContentFromConfig, Props, PropSchema, StyleSchema } from "@blocknote/core";
import { FC, JSX } from "react";
export type ReactCustomInlineContentRenderProps<T extends CustomInlineContentConfig, S extends StyleSchema> = {
    inlineContent: InlineContentFromConfig<T, S>;
    updateInlineContent: (update: PartialCustomInlineContentFromConfig<T, S>) => void;
    editor: BlockNoteEditor<any, InlineContentSchemaWithInlineContent<T["type"], T>, S>;
    contentRef: (node: HTMLElement | null) => void;
};
export type ReactInlineContentImplementation<T extends CustomInlineContentConfig, S extends StyleSchema> = {
    render: FC<ReactCustomInlineContentRenderProps<T, S>>;
    toExternalHTML?: FC<ReactCustomInlineContentRenderProps<T, S>>;
} & Omit<CustomInlineContentImplementation<T, S>, "render" | "toExternalHTML">;
export declare function InlineContentWrapper<IType extends string, PSchema extends PropSchema>(props: {
    children: JSX.Element;
    inlineContentType: IType;
    inlineContentProps: Props<PSchema>;
    propSchema: PSchema;
}): import("react/jsx-runtime").JSX.Element;
/**
 * Creates a custom inline content specification for use with React. This is the
 * React counterpart to the vanilla `createInlineContentSpec` and lets you define
 * custom inline content types (e.g., mentions, tags) using React components for
 * rendering.
 *
 * @param inlineContentConfig - The inline content type configuration, including
 * its `type` name, `propSchema`, and `content` mode (`"styled"` or `"none"`).
 * @param inlineContentImplementation - The React implementation, including a
 * `render` component and optionally a `toExternalHTML` component and `parse`
 * rules.
 * @returns An `InlineContentSpec` that can be passed to the editor's schema.
 */
export declare function createReactInlineContentSpec<const T extends CustomInlineContentConfig, S extends StyleSchema>(inlineContentConfig: T, inlineContentImplementation: ReactInlineContentImplementation<T, S>): InlineContentSpec<T>;