@blocknote/core 0.38.0 → 0.39.1-capitol

package/types/src/index.d.ts

@@ -7,33 +7,10 @@ export * from "./api/getBlockInfoFromPos.js";
 export * from "./api/getBlocksChangedByTransaction.js";
 export * from "./api/nodeUtil.js";
 export * from "./api/pmUtil.js";
-export * from "./blocks/AudioBlockContent/AudioBlockContent.js";
-export * from "./blocks/CodeBlockContent/CodeBlockContent.js";
-export * from "./blocks/defaultBlockHelpers.js";
-export * from "./blocks/defaultBlocks.js";
-export * from "./blocks/defaultBlockTypeGuards.js";
-export * from "./blocks/defaultProps.js";
-export * from "./blocks/FileBlockContent/FileBlockContent.js";
-export * from "./blocks/FileBlockContent/helpers/parse/parseEmbedElement.js";
-export * from "./blocks/FileBlockContent/helpers/parse/parseFigureElement.js";
-export * from "./blocks/FileBlockContent/helpers/render/createAddFileButton.js";
-export * from "./blocks/FileBlockContent/helpers/render/createFileBlockWrapper.js";
-export * from "./blocks/FileBlockContent/helpers/render/createFileNameWithIcon.js";
-export * from "./blocks/FileBlockContent/helpers/render/createResizableFileBlockWrapper.js";
-export * from "./blocks/FileBlockContent/helpers/toExternalHTML/createFigureWithCaption.js";
-export * from "./blocks/FileBlockContent/helpers/toExternalHTML/createLinkWithCaption.js";
-export * from "./blocks/FileBlockContent/uploadToTmpFilesDotOrg_DEV_ONLY.js";
-export * from "./blocks/ImageBlockContent/ImageBlockContent.js";
-export * from "./blocks/PageBreakBlockContent/getPageBreakSlashMenuItems.js";
-export * from "./blocks/PageBreakBlockContent/PageBreakBlockContent.js";
-export * from "./blocks/PageBreakBlockContent/schema.js";
-export * from "./blocks/ToggleWrapper/createToggleWrapper.js";
-export { EMPTY_CELL_HEIGHT, EMPTY_CELL_WIDTH, } from "./blocks/TableBlockContent/TableExtension.js";
-export * from "./blocks/VideoBlockContent/VideoBlockContent.js";
+export * from "./blocks/index.js";
 export * from "./editor/BlockNoteEditor.js";
 export * from "./editor/BlockNoteExtension.js";
 export * from "./editor/BlockNoteExtensions.js";
-export * from "./editor/BlockNoteSchema.js";
 export * from "./editor/defaultColors.js";
 export * from "./editor/selectionTypes.js";
 export * from "./exporter/index.js";
@@ -56,7 +33,7 @@ export * from "./util/combineByGroup.js";
 export * from "./util/string.js";
 export * from "./util/table.js";
 export * from "./util/typescript.js";
-export type { CodeBlockOptions } from "./blocks/CodeBlockContent/CodeBlockContent.js";
+export type { CodeBlockOptions } from "./blocks/Code/block.js";
 export { assertEmpty, UnreachableCaseError } from "./util/typescript.js";
 export * from "./util/EventEmitter.js";
 export { selectedFragmentToHTML } from "./api/clipboard/toClipboard/copyExtension.js";

package/types/src/schema/blocks/createSpec.d.ts

@@ -1,39 +1,19 @@
 import { Editor } from "@tiptap/core";
 import { TagParseRule } from "@tiptap/pm/model";
-import { NodeView, ViewMutationRecord } from "@tiptap/pm/view";
-import type { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
-import { InlineContentSchema } from "../inlineContent/types.js";
-import { StyleSchema } from "../styles/types.js";
-import { BlockConfig, BlockFromConfig, BlockSchemaWithBlock, PartialBlockFromConfig } from "./types.js";
-export type CustomBlockConfig = BlockConfig & {
-    content: "inline" | "none";
-};
-export type CustomBlockImplementation<T extends CustomBlockConfig, I extends InlineContentSchema, S extends StyleSchema> = {
-    render: (
-    /**
-     * The custom block to render
-     */
-    block: BlockFromConfig<T, I, S>, 
-    /**
-     * The BlockNote editor instance
-     * This is typed generically. If you want an editor with your custom schema, you need to
-     * cast it manually, e.g.: `const e = editor as BlockNoteEditor<typeof mySchema>;`
-     */
-    editor: BlockNoteEditor<BlockSchemaWithBlock<T["type"], T>, I, S>) => {
-        dom: HTMLElement;
-        contentDOM?: HTMLElement;
-        ignoreMutation?: (mutation: ViewMutationRecord) => boolean;
-        destroy?: () => void;
-    };
-    toExternalHTML?: (block: BlockFromConfig<T, I, S>, editor: BlockNoteEditor<BlockSchemaWithBlock<T["type"], T>, I, S>) => {
-        dom: HTMLElement;
-        contentDOM?: HTMLElement;
-    };
-    parse?: (el: HTMLElement) => PartialBlockFromConfig<T, I, S>["props"] | undefined;
-};
+import { NodeView } from "@tiptap/pm/view";
+import { BlockNoteExtension } from "../../editor/BlockNoteExtension.js";
+import { PropSchema } from "../propTypes.js";
+import { BlockConfig, BlockImplementation, BlockSpec, LooseBlockSpec } from "./types.js";
 export declare function applyNonSelectableBlockFix(nodeView: NodeView, editor: Editor): void;
-export declare function getParseRules(config: BlockConfig, customParseFunction: CustomBlockImplementation<any, any, any>["parse"]): TagParseRule[];
-export declare function createBlockSpec<T extends CustomBlockConfig, I extends InlineContentSchema, S extends StyleSchema>(blockConfig: T, blockImplementation: CustomBlockImplementation<NoInfer<T>, I, S>): {
-    config: T;
-    implementation: import("./types.js").TiptapBlockImplementation<T, any, InlineContentSchema, StyleSchema>;
-};
+export declare function getParseRules<TName extends string, TProps extends PropSchema, TContent extends "inline" | "none" | "table">(config: BlockConfig<TName, TProps, TContent>, implementation: BlockImplementation<TName, TProps, TContent>): TagParseRule[];
+export declare function addNodeAndExtensionsToSpec<TName extends string, TProps extends PropSchema, TContent extends "inline" | "none" | "table">(blockConfig: BlockConfig<TName, TProps, TContent>, blockImplementation: BlockImplementation<TName, TProps, TContent>, extensions?: BlockNoteExtension<any>[], priority?: number): LooseBlockSpec<TName, TProps, TContent>;
+/**
+ * Helper function to create a block config.
+ */
+export declare function createBlockConfig<TCallback extends (options: Partial<Record<string, any>>) => BlockConfig<any, any, any>, TOptions extends Parameters<TCallback>[0], TName extends ReturnType<TCallback>["type"], TProps extends ReturnType<TCallback>["propSchema"], TContent extends ReturnType<TCallback>["content"]>(callback: TCallback): TOptions extends undefined ? () => BlockConfig<TName, TProps, TContent> : (options: TOptions) => BlockConfig<TName, TProps, TContent>;
+/**
+ * Helper function to create a block definition.
+ * Can accept either functions that return the required objects, or the objects directly.
+ */
+export declare function createBlockSpec<const TName extends string, const TProps extends PropSchema, const TContent extends "inline" | "none", const TOptions extends Partial<Record<string, any>> | undefined = undefined>(blockConfigOrCreator: BlockConfig<TName, TProps, TContent>, blockImplementationOrCreator: BlockImplementation<TName, TProps, TContent> | (TOptions extends undefined ? () => BlockImplementation<TName, TProps, TContent> : (options: Partial<TOptions>) => BlockImplementation<TName, TProps, TContent>), extensionsOrCreator?: BlockNoteExtension<any>[] | (TOptions extends undefined ? () => BlockNoteExtension<any>[] : (options: Partial<TOptions>) => BlockNoteExtension<any>[])): (options?: Partial<TOptions>) => BlockSpec<TName, TProps, TContent>;
+export declare function createBlockSpec<const TName extends string, const TProps extends PropSchema, const TContent extends "inline" | "none", const BlockConf extends BlockConfig<TName, TProps, TContent>, const TOptions extends Partial<Record<string, any>>>(blockCreator: (options: Partial<TOptions>) => BlockConf, blockImplementationOrCreator: BlockImplementation<BlockConf["type"], BlockConf["propSchema"], BlockConf["content"]> | (TOptions extends undefined ? () => BlockImplementation<BlockConf["type"], BlockConf["propSchema"], BlockConf["content"]> : (options: Partial<TOptions>) => BlockImplementation<BlockConf["type"], BlockConf["propSchema"], BlockConf["content"]>), extensionsOrCreator?: BlockNoteExtension<any>[] | (TOptions extends undefined ? () => BlockNoteExtension<any>[] : (options: Partial<TOptions>) => BlockNoteExtension<any>[])): (options?: Partial<TOptions>) => BlockSpec<BlockConf["type"], BlockConf["propSchema"], BlockConf["content"]>;

package/types/src/schema/blocks/internal.d.ts

@@ -1,45 +1,23 @@
-import { Attributes, Editor, Extension, Node, NodeConfig } from "@tiptap/core";
+import { Attributes, Editor, Node } from "@tiptap/core";
 import type { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
+import { BlockNoteExtension } from "../../editor/BlockNoteExtension.js";
 import { InlineContentSchema } from "../inlineContent/types.js";
 import { PropSchema, Props } from "../propTypes.js";
 import { StyleSchema } from "../styles/types.js";
-import { BlockConfig, BlockSchemaFromSpecs, BlockSchemaWithBlock, BlockSpecs, SpecificBlock, TiptapBlockImplementation } from "./types.js";
+import { BlockConfig, BlockSchemaWithBlock, LooseBlockSpec, SpecificBlock } from "./types.js";
 export declare function propsToAttributes(propSchema: PropSchema): Attributes;
-export declare function getBlockFromPos<BType extends string, Config extends BlockConfig, BSchema extends BlockSchemaWithBlock<BType, Config>, I extends InlineContentSchema, S extends StyleSchema>(getPos: (() => number) | boolean, editor: BlockNoteEditor<BSchema, I, S>, tipTapEditor: Editor, type: BType): SpecificBlock<BSchema, BType, I, S>;
+export declare function getBlockFromPos<BType extends string, Config extends BlockConfig, BSchema extends BlockSchemaWithBlock<BType, Config>, I extends InlineContentSchema, S extends StyleSchema>(getPos: () => number | undefined, editor: BlockNoteEditor<BSchema, I, S>, tipTapEditor: Editor, type: BType): SpecificBlock<BSchema, BType, I, S>;
 export declare function wrapInBlockStructure<BType extends string, PSchema extends PropSchema>(element: {
-    dom: HTMLElement;
+    dom: HTMLElement | DocumentFragment;
     contentDOM?: HTMLElement;
     destroy?: () => void;
-}, blockType: BType, blockProps: Props<PSchema>, propSchema: PSchema, isFileBlock?: boolean, domAttributes?: Record<string, string>): {
+}, blockType: BType, blockProps: Partial<Props<PSchema>>, propSchema: PSchema, isFileBlock?: boolean, domAttributes?: Record<string, string>): {
     dom: HTMLElement;
     contentDOM?: HTMLElement;
     destroy?: () => void;
 };
-type StronglyTypedTipTapNode<Name extends string, Content extends "inline*" | "tableRow+" | "blockContainer+" | "column column+" | ""> = Node & {
-    name: Name;
-    config: {
-        content: Content;
-    };
-};
-export declare function createStronglyTypedTiptapNode<Name extends string, Content extends "inline*" | "tableRow+" | "blockContainer+" | "column column+" | "">(config: NodeConfig & {
-    name: Name;
-    content: Content;
-}): StronglyTypedTipTapNode<Name, Content>;
-export declare function createInternalBlockSpec<T extends BlockConfig>(config: T, implementation: TiptapBlockImplementation<T, any, InlineContentSchema, StyleSchema>): {
-    config: T;
-    implementation: TiptapBlockImplementation<T, any, InlineContentSchema, StyleSchema>;
-};
-export declare function createBlockSpecFromStronglyTypedTiptapNode<T extends Node, P extends PropSchema>(node: T, propSchema: P, requiredExtensions?: Array<Extension | Node>): {
-    config: {
-        type: T["name"];
-        content: T["config"]["content"] extends "inline*" ? "inline" : T["config"]["content"] extends "tableRow+" ? "table" : "none";
-        propSchema: P;
-    };
-    implementation: TiptapBlockImplementation<{
-        type: T["name"];
-        content: T["config"]["content"] extends "inline*" ? "inline" : T["config"]["content"] extends "tableRow+" ? "table" : "none";
-        propSchema: P;
-    }, any, InlineContentSchema, StyleSchema>;
-};
-export declare function getBlockSchemaFromSpecs<T extends BlockSpecs>(specs: T): BlockSchemaFromSpecs<T>;
-export {};
+export declare function createBlockSpecFromTiptapNode<const T extends {
+    node: Node;
+    type: string;
+    content: "inline" | "table" | "none";
+}, P extends PropSchema>(config: T, propSchema: P, extensions?: BlockNoteExtension<any>[]): LooseBlockSpec<T["type"], P, T["content"]>;

package/types/src/schema/blocks/types.d.ts

@@ -1,6 +1,9 @@
 /** Define the main block types **/
-import type { Extension, Node } from "@tiptap/core";
+import type { Node, NodeViewRendererProps } from "@tiptap/core";
+import type { Fragment, Schema } from "prosemirror-model";
+import type { ViewMutationRecord } from "prosemirror-view";
 import type { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
+import type { BlockNoteExtension } from "../../editor/BlockNoteExtension.js";
 import type { InlineContent, InlineContentSchema, PartialInlineContent } from "../inlineContent/types.js";
 import type { PropSchema, Props } from "../propTypes.js";
 import type { StyleSchema } from "../styles/types.js";
@@ -8,58 +11,88 @@ export type BlockNoteDOMElement = "editor" | "block" | "blockGroup" | "blockCont
 export type BlockNoteDOMAttributes = Partial<{
     [DOMElement in BlockNoteDOMElement]: Record<string, string>;
 }>;
-export type FileBlockConfig = {
-    type: string;
-    readonly propSchema: PropSchema & {
-        caption: {
-            default: "";
-        };
-        name: {
-            default: "";
-        };
-        url?: {
-            default: "";
-        };
-        showPreview?: {
-            default: boolean;
-        };
-        previewWidth?: {
-            default: undefined;
-            type: "number";
-        };
-    };
-    content: "none";
-    isSelectable?: boolean;
-    isFileBlock: true;
+export interface BlockConfigMeta {
+    /**
+     * Defines which keyboard shortcut should be used to insert a hard break into the block's inline content.
+     * @default "shift+enter"
+     */
+    hardBreakShortcut?: "shift+enter" | "enter" | "none";
+    /**
+     * Whether the block is selectable
+     */
+    selectable?: boolean;
+    /**
+     * The accept mime types for the file block
+     */
     fileBlockAccept?: string[];
+    /**
+     * Whether the block is a {@link https://prosemirror.net/docs/ref/#model.NodeSpec.code} block
+     */
+    code?: boolean;
+    /**
+     * Whether the block is a {@link https://prosemirror.net/docs/ref/#model.NodeSpec.defining} block
+     */
+    defining?: boolean;
+    /**
+     * Whether the block is a {@link https://prosemirror.net/docs/ref/#model.NodeSpec.isolating} block
+     */
+    isolating?: boolean;
+}
+/**
+ * BlockConfig contains the "schema" info about a Block type
+ * i.e. what props it supports, what content it supports, etc.
+ */
+export interface BlockConfig<T extends string = string, PS extends PropSchema = PropSchema, C extends "inline" | "none" | "table" = "inline" | "none" | "table"> {
+    /**
+     * The type of the block (unique identifier within a schema)
+     */
+    type: T;
+    /**
+     * The properties that the block supports
+     * @todo will be zod schema in the future
+     */
+    readonly propSchema: PS;
+    /**
+     * The content that the block supports
+     */
+    content: C;
+}
+export type CustomBlockConfig<T extends string = string, PS extends PropSchema = PropSchema, C extends "inline" | "none" = "inline" | "none"> = BlockConfig<T, PS, C>;
+export type BlockSpec<T extends string = string, PS extends PropSchema = PropSchema, C extends "inline" | "none" | "table" = "inline" | "none" | "table"> = {
+    config: BlockConfig<T, PS, C>;
+    implementation: BlockImplementation<T, PS, C>;
+    extensions?: BlockNoteExtension<any>[];
 };
-export type BlockConfig = {
-    type: string;
-    readonly propSchema: PropSchema;
-    content: "inline" | "none" | "table";
-    isSelectable?: boolean;
-    isFileBlock?: false;
-    hardBreakShortcut?: "shift+enter" | "enter" | "none";
-} | FileBlockConfig;
-export type TiptapBlockImplementation<T extends BlockConfig, B extends BlockSchema, I extends InlineContentSchema, S extends StyleSchema> = {
-    requiredExtensions?: Array<Extension | Node>;
-    node: Node;
-    toInternalHTML: (block: BlockFromConfigNoChildren<T, I, S> & {
-        children: BlockNoDefaults<B, I, S>[];
-    }, editor: BlockNoteEditor<B, I, S>) => {
-        dom: HTMLElement;
-        contentDOM?: HTMLElement;
-    };
-    toExternalHTML: (block: BlockFromConfigNoChildren<T, I, S> & {
-        children: BlockNoDefaults<B, I, S>[];
-    }, editor: BlockNoteEditor<B, I, S>) => {
-        dom: HTMLElement;
-        contentDOM?: HTMLElement;
+/**
+ * This allows de-coupling the types that we display to users versus the types we expose internally.
+ *
+ * This prevents issues with type-inference across parameters that Typescript cannot handle.
+ * Specifically, the blocks shape cannot be properly inferred to a specific type like we expose to the user.
+ */
+export type LooseBlockSpec<T extends string = string, PS extends PropSchema = PropSchema, C extends "inline" | "none" | "table" = "inline" | "none" | "table"> = {
+    config: BlockConfig<T, PS, C>;
+    implementation: Omit<BlockImplementation<T, PS, C>, "render" | "toExternalHTML"> & {
+        render: (
+        /**
+         * The custom block to render
+         */
+        block: any, 
+        /**
+         * The BlockNote editor instance
+         */
+        editor: BlockNoteEditor<any>) => {
+            dom: HTMLElement | DocumentFragment;
+            contentDOM?: HTMLElement;
+            ignoreMutation?: (mutation: ViewMutationRecord) => boolean;
+            destroy?: () => void;
+        };
+        toExternalHTML?: (block: any, editor: BlockNoteEditor<any>) => {
+            dom: HTMLElement | DocumentFragment;
+            contentDOM?: HTMLElement;
+        } | undefined;
+        node: Node;
     };
-};
-export type BlockSpec<T extends BlockConfig, B extends BlockSchema, I extends InlineContentSchema, S extends StyleSchema> = {
-    config: T;
-    implementation: TiptapBlockImplementation<NoInfer<T>, B, I, S>;
+    extensions?: BlockNoteExtension<any>[];
 };
 type NamesMatch<Blocks extends Record<string, BlockConfig>> = Blocks extends {
     [Type in keyof Blocks]: Type extends string ? Blocks[Type] extends {
@@ -67,13 +100,45 @@ type NamesMatch<Blocks extends Record<string, BlockConfig>> = Blocks extends {
     } ? Blocks[Type] : never : never;
 } ? Blocks : never;
 export type BlockSchema = NamesMatch<Record<string, BlockConfig>>;
-export type BlockSpecs = Record<string, BlockSpec<any, any, InlineContentSchema, StyleSchema>>;
-export type BlockImplementations = Record<string, TiptapBlockImplementation<any, any, any, any>>;
-export type BlockSchemaFromSpecs<T extends BlockSpecs> = {
-    [K in keyof T]: T[K]["config"];
+export type BlockSpecs = {
+    [k in string]: {
+        config: BlockSpec<k>["config"];
+        implementation: Omit<BlockSpec<k>["implementation"], "render" | "toExternalHTML"> & {
+            render: (
+            /**
+             * The custom block to render
+             */
+            block: any, 
+            /**
+             * The BlockNote editor instance
+             */
+            editor: BlockNoteEditor<any>) => {
+                dom: HTMLElement | DocumentFragment;
+                contentDOM?: HTMLElement;
+                ignoreMutation?: (mutation: ViewMutationRecord) => boolean;
+                destroy?: () => void;
+            };
+            toExternalHTML?: (block: any, editor: BlockNoteEditor<any>) => {
+                dom: HTMLElement | DocumentFragment;
+                contentDOM?: HTMLElement;
+            } | undefined;
+        };
+        extensions?: BlockNoteExtension<any>[];
+    };
+};
+export type BlockImplementations = Record<string, BlockImplementation<any, any>>;
+export type BlockSchemaFromSpecs<BS extends BlockSpecs> = {
+    [K in keyof BS]: BS[K]["config"];
 };
-export type BlockSchemaWithBlock<BType extends string, C extends BlockConfig> = {
-    [k in BType]: C;
+export type BlockSpecsFromSchema<BS extends BlockSchema> = {
+    [K in keyof BS]: {
+        config: BlockConfig<BS[K]["type"], BS[K]["propSchema"], BS[K]["content"]>;
+        implementation: BlockImplementation<BS[K]["type"], BS[K]["propSchema"], BS[K]["content"]>;
+        extensions?: BlockNoteExtension<any>[];
+    };
+};
+export type BlockSchemaWithBlock<T extends string, C extends BlockConfig> = {
+    [k in T]: C;
 };
 export type TableCellProps = {
     backgroundColor: string;
@@ -138,7 +203,7 @@ type PartialBlockFromConfigNoChildren<B extends BlockConfig, I extends InlineCon
     id?: string;
     type?: B["type"];
     props?: Partial<Props<B["propSchema"]>>;
-    content?: B["content"] extends "inline" ? PartialInlineContent<I, S> : B["content"] extends "table" ? PartialTableContent<I, S> : undefined;
+    content?: B["content"] extends "inline" ? PartialInlineContent<I, S> : B["content"] extends "table" ? PartialTableContent<I, S> : B["content"] extends "none" ? undefined : never;
 };
 type PartialBlocksWithoutChildren<BSchema extends BlockSchema, I extends InlineContentSchema, S extends StyleSchema> = {
     [BType in keyof BSchema]: PartialBlockFromConfigNoChildren<BSchema[BType], I, S>;
@@ -155,4 +220,63 @@ export type PartialBlockFromConfig<B extends BlockConfig, I extends InlineConten
 export type BlockIdentifier = {
     id: string;
 } | string;
+export type BlockImplementation<TName extends string = string, TProps extends PropSchema = PropSchema, TContent extends "inline" | "none" | "table" = "inline" | "none" | "table"> = {
+    /**
+     * Metadata
+     */
+    meta?: BlockConfigMeta;
+    /**
+     * A function that converts the block into a DOM element
+     */
+    render: (this: Record<string, never> | ({
+        blockContentDOMAttributes: Record<string, string>;
+    } & ({
+        renderType: "nodeView";
+        props: NodeViewRendererProps;
+    } | {
+        renderType: "dom";
+        props: undefined;
+    })), 
+    /**
+     * The custom block to render
+     */
+    block: BlockFromConfig<BlockConfig<TName, TProps, TContent>, any, any>, 
+    /**
+     * The BlockNote editor instance
+     */
+    editor: BlockNoteEditor<Record<TName, BlockConfig<TName, TProps, TContent>>>) => {
+        dom: HTMLElement | DocumentFragment;
+        contentDOM?: HTMLElement;
+        ignoreMutation?: (mutation: ViewMutationRecord) => boolean;
+        destroy?: () => void;
+    };
+    /**
+     * Exports block to external HTML. If not defined, the output will be the same
+     * as `render(...).dom`.
+     */
+    toExternalHTML?: (this: Partial<{
+        blockContentDOMAttributes: Record<string, string>;
+    }>, block: BlockFromConfig<BlockConfig<TName, TProps, TContent>, any, any>, editor: BlockNoteEditor<Record<TName, BlockConfig<TName, TProps, TContent>>>) => {
+        dom: HTMLElement | DocumentFragment;
+        contentDOM?: HTMLElement;
+    } | undefined;
+    /**
+     * Parses an external HTML element into a block of this type when it returns the block props object, otherwise undefined
+     */
+    parse?: (el: HTMLElement) => Partial<Props<TProps>> | undefined;
+    /**
+     * The blocks that this block should run before.
+     * This is used to determine the order in which blocks are parsed
+     */
+    runsBefore?: string[];
+    /**
+     * Advanced parsing function that controls how content within the block is parsed.
+     * This is not recommended to use, and is only useful for advanced use cases.
+     */
+    parseContent?: (options: {
+        el: HTMLElement;
+        schema: Schema;
+    }) => Fragment;
+};
+export type CustomBlockImplementation<T extends string = string, PS extends PropSchema = PropSchema, C extends "inline" | "none" = "inline" | "none"> = BlockImplementation<T, PS, C>;
 export {};

package/types/src/schema/index.d.ts

@@ -8,3 +8,4 @@ export * from "./propTypes.js";
 export * from "./styles/createSpec.js";
 export * from "./styles/internal.js";
 export * from "./styles/types.js";
+export * from "./schema.js";

package/types/src/schema/inlineContent/createSpec.d.ts

@@ -1,13 +1,28 @@
 import { TagParseRule } from "@tiptap/pm/model";
 import type { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
+import { Props } from "../propTypes.js";
 import { StyleSchema } from "../styles/types.js";
 import { CustomInlineContentConfig, InlineContentFromConfig, InlineContentSpec, PartialCustomInlineContentFromConfig } from "./types.js";
 export type CustomInlineContentImplementation<T extends CustomInlineContentConfig, S extends StyleSchema> = {
+    meta?: {
+        draggable?: boolean;
+    };
+    /**
+     * Parses an external HTML element into a inline content of this type when it returns the block props object, otherwise undefined
+     */
+    parse?: (el: HTMLElement) => Partial<Props<T["propSchema"]>> | undefined;
+    /**
+     * Renders an inline content to DOM elements
+     */
     render: (
     /**
      * The custom inline content to render
      */
-    inlineContent: InlineContentFromConfig<T, S>, updateInlineContent: (update: PartialCustomInlineContentFromConfig<T, S>) => void, 
+    inlineContent: InlineContentFromConfig<T, S>, 
+    /**
+     * A callback that allows overriding the inline content element
+     */
+    updateInlineContent: (update: PartialCustomInlineContentFromConfig<T, S>) => void, 
     /**
      * The BlockNote editor instance
      * This is typed generically. If you want an editor with your custom schema, you need to
@@ -16,7 +31,26 @@ export type CustomInlineContentImplementation<T extends CustomInlineContentConfi
     editor: BlockNoteEditor<any, any, S>) => {
         dom: HTMLElement;
         contentDOM?: HTMLElement;
+        destroy?: () => void;
     };
+    /**
+     * Renders an inline content to external HTML elements for use outside the editor
+     * If not provided, falls back to the render method
+     */
+    toExternalHTML?: (
+    /**
+     * The custom inline content to render
+     */
+    inlineContent: InlineContentFromConfig<T, S>, 
+    /**
+     * The BlockNote editor instance
+     * This is typed generically. If you want an editor with your custom schema, you need to
+     * cast it manually, e.g.: `const e = editor as BlockNoteEditor<typeof mySchema>;`
+     */
+    editor: BlockNoteEditor<any, any, S>) => {
+        dom: HTMLElement | DocumentFragment;
+        contentDOM?: HTMLElement;
+    } | undefined;
 };
-export declare function getInlineContentParseRules(config: CustomInlineContentConfig): TagParseRule[];
+export declare function getInlineContentParseRules<C extends CustomInlineContentConfig>(config: C, customParseFunction?: CustomInlineContentImplementation<C, any>["parse"]): TagParseRule[];
 export declare function createInlineContentSpec<T extends CustomInlineContentConfig, S extends StyleSchema>(inlineContentConfig: T, inlineContentImplementation: CustomInlineContentImplementation<T, S>): InlineContentSpec<T>;

package/types/src/schema/inlineContent/internal.d.ts

@@ -1,6 +1,6 @@
 import { KeyboardShortcutCommand, Node } from "@tiptap/core";
 import { PropSchema, Props } from "../propTypes.js";
-import { CustomInlineContentConfig, InlineContentConfig, InlineContentImplementation, InlineContentSchemaFromSpecs, InlineContentSpecs } from "./types.js";
+import { CustomInlineContentConfig, InlineContentImplementation, InlineContentSchemaFromSpecs, InlineContentSpec, InlineContentSpecs } from "./types.js";
 export declare function addInlineContentAttributes<IType extends string, PSchema extends PropSchema>(element: {
     dom: HTMLElement;
     contentDOM?: HTMLElement;
@@ -11,18 +11,10 @@ export declare function addInlineContentAttributes<IType extends string, PSchema
 export declare function addInlineContentKeyboardShortcuts<T extends CustomInlineContentConfig>(config: T): {
     [p: string]: KeyboardShortcutCommand;
 };
-export declare function createInternalInlineContentSpec<T extends InlineContentConfig>(config: T, implementation: InlineContentImplementation<T>): {
-    config: T;
-    implementation: InlineContentImplementation<T>;
-};
-export declare function createInlineContentSpecFromTipTapNode<T extends Node, P extends PropSchema>(node: T, propSchema: P): {
-    config: {
-        type: T["name"];
-        propSchema: P;
-        content: "none" | "styled";
-    };
-    implementation: {
-        node: Node;
-    };
-};
+export declare function createInternalInlineContentSpec<const T extends CustomInlineContentConfig>(config: T, implementation: InlineContentImplementation<NoInfer<T>>): InlineContentSpec<T>;
+export declare function createInlineContentSpecFromTipTapNode<T extends Node, P extends PropSchema>(node: T, propSchema: P, implementation: Omit<InlineContentImplementation<CustomInlineContentConfig>, "node">): InlineContentSpec<{
+    readonly type: T["name"];
+    readonly propSchema: P;
+    readonly content: "none" | "styled";
+}>;
 export declare function getInlineContentSchemaFromSpecs<T extends InlineContentSpecs>(specs: T): InlineContentSchemaFromSpecs<T>;

package/types/src/schema/inlineContent/types.d.ts

@@ -1,15 +1,29 @@
 import { Node } from "@tiptap/core";
 import { PropSchema, Props } from "../propTypes.js";
 import { StyleSchema, Styles } from "../styles/types.js";
+import { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
+import { ViewMutationRecord } from "prosemirror-view";
 export type CustomInlineContentConfig = {
     type: string;
     content: "styled" | "none";
-    draggable?: boolean;
     readonly propSchema: PropSchema;
 };
 export type InlineContentConfig = CustomInlineContentConfig | "text" | "link";
 export type InlineContentImplementation<T extends InlineContentConfig> = T extends "link" | "text" ? undefined : {
+    meta?: {
+        draggable?: boolean;
+    };
     node: Node;
+    toExternalHTML?: (inlineContent: any, editor: BlockNoteEditor<any, any, any>) => {
+        dom: HTMLElement | DocumentFragment;
+        contentDOM?: HTMLElement;
+    } | undefined;
+    render: (inlineContent: any, updateInlineContent: (update: any) => void, editor: BlockNoteEditor<any, any, any>) => {
+        dom: HTMLElement | DocumentFragment;
+        contentDOM?: HTMLElement;
+        ignoreMutation?: (mutation: ViewMutationRecord) => boolean;
+        destroy?: () => void;
+    };
 };
 export type InlineContentSchemaWithInlineContent<IType extends string, C extends InlineContentConfig> = {
     [k in IType]: C;

package/types/src/schema/propTypes.d.ts

@@ -8,19 +8,19 @@ export type PropSpec<PType extends boolean | number | string> = {
 };
 export type PropSchema = Record<string, PropSpec<boolean | number | string>>;
 export type Props<PSchema extends PropSchema> = {
-    [PName in keyof PSchema]: (PSchema[PName] extends {
+    [PName in keyof PSchema]: (NonNullable<PSchema[PName]> extends {
         default: boolean;
     } | {
         type: "boolean";
-    } ? PSchema[PName]["values"] extends readonly boolean[] ? PSchema[PName]["values"][number] : boolean : PSchema[PName] extends {
+    } ? NonNullable<PSchema[PName]>["values"] extends readonly boolean[] ? NonNullable<PSchema[PName]>["values"][number] : boolean : NonNullable<PSchema[PName]> extends {
         default: number;
     } | {
         type: "number";
-    } ? PSchema[PName]["values"] extends readonly number[] ? PSchema[PName]["values"][number] : number : PSchema[PName] extends {
+    } ? NonNullable<PSchema[PName]>["values"] extends readonly number[] ? NonNullable<PSchema[PName]>["values"][number] : number : NonNullable<PSchema[PName]> extends {
         default: string;
     } | {
         type: "string";
-    } ? PSchema[PName]["values"] extends readonly string[] ? PSchema[PName]["values"][number] : string : never) extends infer T ? PSchema[PName] extends {
+    } ? NonNullable<PSchema[PName]>["values"] extends readonly string[] ? NonNullable<PSchema[PName]>["values"][number] : string : never) extends infer T ? PSchema[PName] extends {
         optional: true;
     } ? T | undefined : T : never;
 };

package/types/src/schema/schema.d.ts

@@ -0,0 +1,40 @@
+import { BlockNoteEditor } from "../editor/BlockNoteEditor.js";
+import { BlockNoDefaults, BlockSchema, BlockSpecs, InlineContentConfig, InlineContentSchema, InlineContentSpec, InlineContentSpecs, LooseBlockSpec, PartialBlockNoDefaults, StyleSchema, StyleSpecs } from "./index.js";
+export declare class CustomBlockNoteSchema<BSchema extends BlockSchema, ISchema extends InlineContentSchema, SSchema extends StyleSchema> {
+    private opts;
+    readonly BlockNoteEditor: BlockNoteEditor<BSchema, ISchema, SSchema>;
+    readonly Block: BlockNoDefaults<BSchema, ISchema, SSchema>;
+    readonly PartialBlock: PartialBlockNoDefaults<BSchema, ISchema, SSchema>;
+    inlineContentSpecs: InlineContentSpecs;
+    styleSpecs: StyleSpecs;
+    blockSpecs: {
+        [K in keyof BSchema]: K extends string ? LooseBlockSpec<K, BSchema[K]["propSchema"], BSchema[K]["content"]> : never;
+    };
+    blockSchema: BSchema;
+    inlineContentSchema: ISchema;
+    styleSchema: SSchema;
+    constructor(opts: {
+        blockSpecs: BlockSpecs;
+        inlineContentSpecs: InlineContentSpecs;
+        styleSpecs: StyleSpecs;
+    });
+    private init;
+    /**
+     * Adds additional block specs to the current schema in a builder pattern.
+     * This method allows extending the schema after it has been created.
+     *
+     * @param additionalBlockSpecs - Additional block specs to add to the schema
+     * @returns The current schema instance for chaining
+     */
+    extend<AdditionalBlockSpecs extends BlockSpecs = Record<string, never>, AdditionalInlineContentSpecs extends Record<string, InlineContentSpec<InlineContentConfig>> = Record<string, never>, AdditionalStyleSpecs extends StyleSpecs = Record<string, never>>(opts: {
+        blockSpecs?: AdditionalBlockSpecs;
+        inlineContentSpecs?: AdditionalInlineContentSpecs;
+        styleSpecs?: AdditionalStyleSpecs;
+    }): CustomBlockNoteSchema<AdditionalBlockSpecs extends undefined | Record<string, never> ? BSchema : BSchema & {
+        [K in keyof AdditionalBlockSpecs]: K extends string ? AdditionalBlockSpecs[K]["config"] : never;
+    }, AdditionalInlineContentSpecs extends undefined | Record<string, never> ? ISchema : ISchema & {
+        [K in keyof AdditionalInlineContentSpecs]: AdditionalInlineContentSpecs[K]["config"];
+    }, AdditionalStyleSpecs extends undefined | Record<string, never> ? SSchema : SSchema & {
+        [K in keyof AdditionalStyleSpecs]: AdditionalStyleSpecs[K]["config"];
+    }>;
+}