@blocknote/react
Version:
A "Notion-style" block-based extensible text editor built on top of Prosemirror and Tiptap.
555 lines (554 loc) • 17.1 kB
TypeScript
import { BlockNoteEditor, BlockNoteEditorOptions, BlockSchema, DefaultBlockSchema, DefaultInlineContentSchema, DefaultStyleSchema, InlineContentSchema, StyleSchema } from "@blocknote/core";
import { DependencyList } from "react";
/**
* Main hook for importing a BlockNote editor into a React project
*
* TODO: document in docs
*/
export declare const useCreateBlockNote: <BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema>(options?: Partial<BlockNoteEditorOptions<BSchema, ISchema, SSchema>>, deps?: DependencyList) => BlockNoteEditor<BSchema, ISchema, SSchema>;
/**
* @deprecated use useCreateBlockNote instead
*/
export declare const useBlockNote: <BSchema extends BlockSchema = import("@blocknote/core").BlockSchemaFromSpecs<{
paragraph: {
config: {
type: "paragraph";
content: "inline";
propSchema: {
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "paragraph";
content: "inline";
propSchema: {
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
}, any, InlineContentSchema, StyleSchema>;
};
heading: {
config: {
type: "heading";
content: "inline";
propSchema: {
level: {
default: number;
values: readonly [1, 2, 3];
};
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "heading";
content: "inline";
propSchema: {
level: {
default: number;
values: readonly [1, 2, 3];
};
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
}, any, InlineContentSchema, StyleSchema>;
};
quote: {
config: {
type: "quote";
content: "inline";
propSchema: {
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "quote";
content: "inline";
propSchema: {
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
}, any, InlineContentSchema, StyleSchema>;
};
codeBlock: {
config: {
type: "codeBlock";
content: "inline";
propSchema: {
language: {
default: string;
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "codeBlock";
content: "inline";
propSchema: {
language: {
default: string;
};
};
}, any, InlineContentSchema, StyleSchema>;
};
bulletListItem: {
config: {
type: "bulletListItem";
content: "inline";
propSchema: {
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "bulletListItem";
content: "inline";
propSchema: {
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
}, any, InlineContentSchema, StyleSchema>;
};
numberedListItem: {
config: {
type: "numberedListItem";
content: "inline";
propSchema: {
start: {
default: undefined;
type: "number";
};
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "numberedListItem";
content: "inline";
propSchema: {
start: {
default: undefined;
type: "number";
};
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
}, any, InlineContentSchema, StyleSchema>;
};
checkListItem: {
config: {
type: "checkListItem";
content: "inline";
propSchema: {
checked: {
default: false;
};
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "checkListItem";
content: "inline";
propSchema: {
checked: {
default: false;
};
backgroundColor: {
default: "default";
};
textColor: {
default: "default";
};
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
};
}, any, InlineContentSchema, StyleSchema>;
};
table: {
config: {
type: "table";
content: "table";
propSchema: {
textColor: {
default: "default";
};
};
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "table";
content: "table";
propSchema: {
textColor: {
default: "default";
};
};
}, any, InlineContentSchema, StyleSchema>;
};
file: {
config: {
type: "file";
propSchema: {
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
};
content: "none";
isFileBlock: true;
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "file";
propSchema: {
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
};
content: "none";
isFileBlock: true;
}, any, InlineContentSchema, StyleSchema>;
};
image: {
config: {
type: "image";
propSchema: {
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
showPreview: {
default: true;
};
previewWidth: {
default: undefined;
type: "number";
};
};
content: "none";
isFileBlock: true;
fileBlockAccept: string[];
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "image";
propSchema: {
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
showPreview: {
default: true;
};
previewWidth: {
default: undefined;
type: "number";
};
};
content: "none";
isFileBlock: true;
fileBlockAccept: string[];
}, any, InlineContentSchema, StyleSchema>;
};
video: {
config: {
type: "video";
propSchema: {
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
showPreview: {
default: true;
};
previewWidth: {
default: undefined;
type: "number";
};
};
content: "none";
isFileBlock: true;
fileBlockAccept: string[];
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "video";
propSchema: {
textAlignment: {
default: "left";
values: readonly ["left", "center", "right", "justify"];
};
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
showPreview: {
default: true;
};
previewWidth: {
default: undefined;
type: "number";
};
};
content: "none";
isFileBlock: true;
fileBlockAccept: string[];
}, any, InlineContentSchema, StyleSchema>;
};
audio: {
config: {
type: "audio";
propSchema: {
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
showPreview: {
default: true;
};
};
content: "none";
isFileBlock: true;
fileBlockAccept: string[];
};
implementation: import("@blocknote/core").TiptapBlockImplementation<{
type: "audio";
propSchema: {
backgroundColor: {
default: "default";
};
name: {
default: "";
};
url: {
default: "";
};
caption: {
default: "";
};
showPreview: {
default: true;
};
};
content: "none";
isFileBlock: true;
fileBlockAccept: string[];
}, any, InlineContentSchema, StyleSchema>;
};
}>, ISchema extends InlineContentSchema = import("@blocknote/core").InlineContentSchemaFromSpecs<{
text: {
config: "text";
implementation: any;
};
link: {
config: "link";
implementation: any;
};
}>, SSchema extends StyleSchema = import("@blocknote/core").StyleSchemaFromSpecs<{
bold: {
config: {
type: string;
propSchema: "boolean";
};
implementation: import("@blocknote/core").StyleImplementation;
};
italic: {
config: {
type: string;
propSchema: "boolean";
};
implementation: import("@blocknote/core").StyleImplementation;
};
underline: {
config: {
type: string;
propSchema: "boolean";
};
implementation: import("@blocknote/core").StyleImplementation;
};
strike: {
config: {
type: string;
propSchema: "boolean";
};
implementation: import("@blocknote/core").StyleImplementation;
};
code: {
config: {
type: string;
propSchema: "boolean";
};
implementation: import("@blocknote/core").StyleImplementation;
};
textColor: {
config: {
type: string;
propSchema: "string";
};
implementation: import("@blocknote/core").StyleImplementation;
};
backgroundColor: {
config: {
type: string;
propSchema: "string";
};
implementation: import("@blocknote/core").StyleImplementation;
};
}>>(options?: Partial<BlockNoteEditorOptions<BSchema, ISchema, SSchema>>, deps?: DependencyList) => BlockNoteEditor<BSchema, ISchema, SSchema>;