@tiptap/react 2.6.2 → 3.0.0-next.1

package/dist/index.d.ts

@@ -0,0 +1,221 @@
+import { BubbleMenuPluginProps } from '@tiptap/extension-bubble-menu';
+import * as React from 'react';
+import React__default, { DependencyList, ReactNode, HTMLProps, ForwardedRef } from 'react';
+import { EditorOptions, Editor, NodeViewRendererOptions, NodeViewRenderer } from '@tiptap/core';
+export * from '@tiptap/core';
+import { FloatingMenuPluginProps } from '@tiptap/extension-floating-menu';
+import { Node } from '@tiptap/pm/model';
+import { Decoration } from '@tiptap/pm/view';
+
+type Optional$1<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
+type BubbleMenuProps = Omit<Optional$1<BubbleMenuPluginProps, 'pluginKey'>, 'element' | 'editor'> & {
+    editor: BubbleMenuPluginProps['editor'] | null;
+    className?: string;
+    children: React__default.ReactNode;
+    updateDelay?: number;
+    resizeDelay?: number;
+    options?: BubbleMenuPluginProps['options'];
+};
+declare const BubbleMenu: (props: BubbleMenuProps) => React__default.JSX.Element;
+
+/**
+ * The options for the `useEditor` hook.
+ */
+type UseEditorOptions = Partial<EditorOptions> & {
+    /**
+     * Whether to render the editor on the first render.
+     * If client-side rendering, set this to `true`.
+     * If server-side rendering, set this to `false`.
+     * @default true
+     */
+    immediatelyRender?: boolean;
+    /**
+     * Whether to re-render the editor on each transaction.
+     * This is legacy behavior that will be removed in future versions.
+     * @default true
+     */
+    shouldRerenderOnTransaction?: boolean;
+};
+/**
+ * This hook allows you to create an editor instance.
+ * @param options The editor options
+ * @param deps The dependencies to watch for changes
+ * @returns The editor instance
+ * @example const editor = useEditor({ extensions: [...] })
+ */
+declare function useEditor(options: UseEditorOptions & {
+    immediatelyRender: true;
+}, deps?: DependencyList): Editor;
+/**
+ * This hook allows you to create an editor instance.
+ * @param options The editor options
+ * @param deps The dependencies to watch for changes
+ * @returns The editor instance
+ * @example const editor = useEditor({ extensions: [...] })
+ */
+declare function useEditor(options?: UseEditorOptions, deps?: DependencyList): Editor | null;
+
+type EditorContextValue = {
+    editor: Editor | null;
+};
+declare const EditorContext: React__default.Context<EditorContextValue>;
+declare const EditorConsumer: React__default.Consumer<EditorContextValue>;
+/**
+ * A hook to get the current editor instance.
+ */
+declare const useCurrentEditor: () => EditorContextValue;
+type EditorProviderProps = {
+    children?: ReactNode;
+    slotBefore?: ReactNode;
+    slotAfter?: ReactNode;
+} & UseEditorOptions;
+/**
+ * This is the provider component for the editor.
+ * It allows the editor to be accessible across the entire component tree
+ * with `useCurrentEditor`.
+ */
+declare function EditorProvider({ children, slotAfter, slotBefore, ...editorOptions }: EditorProviderProps): React__default.JSX.Element | null;
+
+interface EditorContentProps extends HTMLProps<HTMLDivElement> {
+    editor: Editor | null;
+    innerRef?: ForwardedRef<HTMLDivElement | null>;
+}
+declare class PureEditorContent extends React__default.Component<EditorContentProps, {
+    hasContentComponentInitialized: boolean;
+}> {
+    editorContentRef: React__default.RefObject<any>;
+    initialized: boolean;
+    unsubscribeToContentComponent?: () => void;
+    constructor(props: EditorContentProps);
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    init(): void;
+    componentWillUnmount(): void;
+    render(): React__default.JSX.Element;
+}
+declare const EditorContent: React__default.MemoExoticComponent<React__default.ForwardRefExoticComponent<Omit<EditorContentProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>>;
+
+type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>;
+type FloatingMenuProps = Omit<Optional<FloatingMenuPluginProps, 'pluginKey'>, 'element' | 'editor'> & {
+    editor: FloatingMenuPluginProps['editor'] | null;
+    className?: string;
+    children: React__default.ReactNode;
+    options?: FloatingMenuPluginProps['options'];
+};
+declare const FloatingMenu: (props: FloatingMenuProps) => React__default.JSX.Element;
+
+interface NodeViewContentProps {
+    [key: string]: any;
+    as?: React__default.ElementType;
+}
+declare const NodeViewContent: React__default.FC<NodeViewContentProps>;
+
+interface NodeViewWrapperProps {
+    [key: string]: any;
+    as?: React__default.ElementType;
+}
+declare const NodeViewWrapper: React__default.FC<NodeViewWrapperProps>;
+
+interface ReactNodeViewRendererOptions extends NodeViewRendererOptions {
+    update: ((props: {
+        oldNode: Node;
+        oldDecorations: Decoration[];
+        newNode: Node;
+        newDecorations: Decoration[];
+        updateProps: () => void;
+    }) => boolean) | null;
+    as?: string;
+    className?: string;
+    attrs?: Record<string, string>;
+}
+declare function ReactNodeViewRenderer(component: any, options?: Partial<ReactNodeViewRendererOptions>): NodeViewRenderer;
+
+interface ReactRendererOptions {
+    /**
+     * The editor instance.
+     * @type {Editor}
+     */
+    editor: Editor;
+    /**
+     * The props for the component.
+     * @type {Record<string, any>}
+     * @default {}
+     */
+    props?: Record<string, any>;
+    /**
+     * The tag name of the element.
+     * @type {string}
+     * @default 'div'
+     */
+    as?: string;
+    /**
+     * The class name of the element.
+     * @type {string}
+     * @default ''
+     * @example 'foo bar'
+     */
+    className?: string;
+    /**
+     * The attributes of the element.
+     * @type {Record<string, string>}
+     * @default {}
+     * @example { 'data-foo': 'bar' }
+     */
+    attrs?: Record<string, string>;
+}
+type ComponentType<R, P> = React__default.ComponentClass<P> | React__default.FunctionComponent<P> | React__default.ForwardRefExoticComponent<React__default.PropsWithoutRef<P> & React__default.RefAttributes<R>>;
+/**
+ * The ReactRenderer class. It's responsible for rendering React components inside the editor.
+ * @example
+ * new ReactRenderer(MyComponent, {
+ *   editor,
+ *   props: {
+ *     foo: 'bar',
+ *   },
+ *   as: 'span',
+ * })
+*/
+declare class ReactRenderer<R = unknown, P = unknown> {
+    id: string;
+    editor: Editor;
+    component: any;
+    element: Element;
+    props: Record<string, any>;
+    reactElement: React__default.ReactNode;
+    ref: R | null;
+    constructor(component: ComponentType<R, P>, { editor, props, as, className, attrs, }: ReactRendererOptions);
+    render(): void;
+    updateProps(props?: Record<string, any>): void;
+    destroy(): void;
+}
+
+type EditorStateSnapshot<TEditor extends Editor | null = Editor | null> = {
+    editor: TEditor;
+    transactionNumber: number;
+};
+type UseEditorStateOptions<TSelectorResult, TEditor extends Editor | null = Editor | null> = {
+    /**
+     * The editor instance.
+     */
+    editor: TEditor;
+    /**
+     * A selector function to determine the value to compare for re-rendering.
+     */
+    selector: (context: EditorStateSnapshot<TEditor>) => TSelectorResult;
+    /**
+     * A custom equality function to determine if the editor should re-render.
+     * @default `(a, b) => a === b`
+     */
+    equalityFn?: (a: TSelectorResult, b: TSelectorResult | null) => boolean;
+};
+declare function useEditorState<TSelectorResult>(options: UseEditorStateOptions<TSelectorResult, Editor>): TSelectorResult;
+declare function useEditorState<TSelectorResult>(options: UseEditorStateOptions<TSelectorResult, Editor | null>): TSelectorResult | null;
+
+interface ReactNodeViewContextProps {
+    onDragStart: (event: DragEvent) => void;
+    nodeViewContentRef: (element: HTMLElement | null) => void;
+}
+declare const ReactNodeViewContext: React.Context<Partial<ReactNodeViewContextProps>>;
+declare const useReactNodeView: () => Partial<ReactNodeViewContextProps>;
+
+export { BubbleMenu, type BubbleMenuProps, EditorConsumer, EditorContent, type EditorContentProps, EditorContext, type EditorContextValue, EditorProvider, type EditorProviderProps, type EditorStateSnapshot, FloatingMenu, type FloatingMenuProps, NodeViewContent, type NodeViewContentProps, NodeViewWrapper, type NodeViewWrapperProps, PureEditorContent, ReactNodeViewContext, type ReactNodeViewContextProps, ReactNodeViewRenderer, type ReactNodeViewRendererOptions, ReactRenderer, type ReactRendererOptions, type UseEditorOptions, type UseEditorStateOptions, useCurrentEditor, useEditor, useEditorState, useReactNodeView };