import { Injector, Type } from '@angular/core'; import { DecorationWithType, Editor, NodeView, NodeViewProps, NodeViewRenderer, NodeViewRendererOptions, NodeViewRendererProps } from '@tiptap/core'; import type { Node as ProseMirrorNode } from 'prosemirror-model'; import type { Decoration } from 'prosemirror-view'; import { TuiComponentRenderer } from './component-render'; /** * You should extend this class to create custom * Tiptap's {@link https://tiptap.dev/guide/node-views NodeView} from angular component. * It contains compulsory properties which component will get externally while NodeView's rendering. */ export declare class TuiNodeViewNgComponent implements NodeViewProps { editor: NodeViewProps['editor']; node: NodeViewProps['node']; decorations: NodeViewProps['decorations']; selected: NodeViewProps['selected']; extension: NodeViewProps['extension']; getPos: NodeViewProps['getPos']; updateAttributes: NodeViewProps['updateAttributes']; deleteNode: NodeViewProps['deleteNode']; } export interface TuiNodeViewRendererOptions extends NodeViewRendererOptions { update?: (node: ProseMirrorNode, decorations: Decoration[]) => boolean; injector: Injector; } /** * Tiptap editor proposes concept of interactive {@link https://tiptap.dev/guide/node-views NodeViews}. * It gives you opportunity to create custom complex Node inside editor. And it will look like native Tiptap's Node. * Regard it like angular component inside editor. * * This solution is adaptation of official React implementation of NodeViews. * It was copied from * {@link https://github.com/sibiraj-s/ngx-tiptap/blob/master/projects/ngx-tiptap/src/lib/NodeViewRenderer.ts ngx-tiptap} */ export declare class TuiNodeView extends NodeView, Editor, TuiNodeViewRendererOptions> { renderer: TuiComponentRenderer; contentDOMElement: HTMLElement | null; /** * @caretaker note: * Class constructor NodeView cannot be invoked without 'new' */ constructor(component: Type, props: NodeViewRendererProps, options?: Partial); mount(): void; get dom(): HTMLElement; get contentDOM(): HTMLElement | null; update(node: ProseMirrorNode, decorations: DecorationWithType[]): boolean; selectNode(): void; deselectNode(): void; destroy(): void; private maybeMoveContentDOM; } /** * @deprecated */ export declare function TuiNodeViewRenderer(component: Type, options: Partial): NodeViewRenderer;