@blocknote/core 0.24.2 → 0.25.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (141) hide show
  1. package/dist/blocknote.cjs +12 -0
  2. package/dist/blocknote.cjs.map +1 -0
  3. package/dist/blocknote.js +4754 -3514
  4. package/dist/blocknote.js.map +1 -1
  5. package/dist/comments.cjs +2 -0
  6. package/dist/comments.cjs.map +1 -0
  7. package/dist/comments.js +593 -0
  8. package/dist/comments.js.map +1 -0
  9. package/dist/style.css +1 -1
  10. package/dist/tsconfig.tsbuildinfo +1 -1
  11. package/dist/webpack-stats.json +1 -1
  12. package/package.json +39 -26
  13. package/src/api/blockManipulation/commands/insertBlocks/__snapshots__/insertBlocks.test.ts.snap +1022 -378
  14. package/src/api/blockManipulation/commands/mergeBlocks/__snapshots__/mergeBlocks.test.ts.snap +730 -270
  15. package/src/api/blockManipulation/commands/moveBlocks/__snapshots__/moveBlocks.test.ts.snap +3100 -1260
  16. package/src/api/blockManipulation/commands/removeBlocks/__snapshots__/removeBlocks.test.ts.snap +438 -162
  17. package/src/api/blockManipulation/commands/replaceBlocks/__snapshots__/replaceBlocks.test.ts.snap +1168 -432
  18. package/src/api/blockManipulation/commands/splitBlock/__snapshots__/splitBlock.test.ts.snap +930 -378
  19. package/src/api/blockManipulation/commands/updateBlock/__snapshots__/updateBlock.test.ts.snap +2485 -1015
  20. package/src/api/blockManipulation/commands/updateBlock/updateBlock.test.ts +28 -1
  21. package/src/api/blockManipulation/commands/updateBlock/updateBlock.ts +1 -1
  22. package/src/api/blockManipulation/selections/__snapshots__/selection.test.ts.snap +292 -108
  23. package/src/api/blockManipulation/setupTestEnv.ts +14 -1
  24. package/src/api/blockManipulation/tables/tables.test.ts +1987 -0
  25. package/src/api/blockManipulation/tables/tables.ts +887 -0
  26. package/src/api/clipboard/__snapshots__/external/pasteEndOfParagraph.html +66 -24
  27. package/src/api/clipboard/__snapshots__/external/pasteEndOfParagraphText.html +66 -24
  28. package/src/api/clipboard/__snapshots__/external/pasteImage.html +66 -24
  29. package/src/api/clipboard/__snapshots__/external/pasteParagraphInCustomBlock.html +66 -24
  30. package/src/api/clipboard/__snapshots__/external/pasteTable.html +132 -48
  31. package/src/api/clipboard/__snapshots__/external/pasteTableInExistingTable.html +136 -44
  32. package/src/api/clipboard/toClipboard/copyExtension.ts +2 -3
  33. package/src/api/exporters/html/__snapshots__/table/headerCols/external.html +1 -0
  34. package/src/api/exporters/html/__snapshots__/table/headerCols/internal.html +1 -0
  35. package/src/api/exporters/html/__snapshots__/table/headerRows/external.html +1 -0
  36. package/src/api/exporters/html/__snapshots__/table/headerRows/internal.html +1 -0
  37. package/src/api/exporters/html/__snapshots__/table/headersRows/external.html +1 -0
  38. package/src/api/exporters/html/__snapshots__/table/headersRows/internal.html +1 -0
  39. package/src/api/exporters/html/__snapshots__/table/mixedCellColors/external.html +1 -0
  40. package/src/api/exporters/html/__snapshots__/table/mixedCellColors/internal.html +1 -0
  41. package/src/api/exporters/html/__snapshots__/table/mixedRowspansAndColspans/external.html +1 -0
  42. package/src/api/exporters/html/__snapshots__/table/mixedRowspansAndColspans/internal.html +1 -0
  43. package/src/api/exporters/markdown/__snapshots__/table/headerCols/markdown.md +4 -0
  44. package/src/api/exporters/markdown/__snapshots__/table/headerRows/markdown.md +4 -0
  45. package/src/api/exporters/markdown/__snapshots__/table/mixedCellColors/markdown.md +5 -0
  46. package/src/api/exporters/markdown/__snapshots__/table/mixedRowspansAndColspans/markdown.md +5 -0
  47. package/src/api/nodeConversions/__snapshots__/nodeConversions.test.ts.snap +985 -20
  48. package/src/api/nodeConversions/blockToNode.ts +63 -20
  49. package/src/api/nodeConversions/nodeToBlock.ts +75 -13
  50. package/src/api/parsers/html/__snapshots__/parse-notion-html.json +145 -54
  51. package/src/api/testUtil/cases/defaultSchema.ts +782 -9
  52. package/src/api/testUtil/partialBlockTestUtil.ts +39 -4
  53. package/src/blocks/TableBlockContent/TableBlockContent.ts +11 -5
  54. package/src/blocks/defaultBlockTypeGuards.ts +8 -0
  55. package/src/comments/index.ts +9 -0
  56. package/src/comments/models/User.ts +8 -0
  57. package/src/comments/threadstore/DefaultThreadStoreAuth.ts +106 -0
  58. package/src/comments/threadstore/ThreadStore.ts +134 -0
  59. package/src/comments/threadstore/ThreadStoreAuth.ts +13 -0
  60. package/src/comments/threadstore/TipTapThreadStore.ts +292 -0
  61. package/src/comments/threadstore/yjs/RESTYjsThreadStore.ts +144 -0
  62. package/src/comments/threadstore/yjs/YjsThreadStore.test.ts +294 -0
  63. package/src/comments/threadstore/yjs/YjsThreadStore.ts +340 -0
  64. package/src/comments/threadstore/yjs/YjsThreadStoreBase.ts +48 -0
  65. package/src/comments/threadstore/yjs/yjsHelpers.ts +121 -0
  66. package/src/comments/types.ts +117 -0
  67. package/src/editor/Block.css +16 -8
  68. package/src/editor/BlockNoteEditor.ts +269 -92
  69. package/src/editor/BlockNoteExtensions.ts +24 -1
  70. package/src/editor/BlockNoteTipTapEditor.ts +5 -1
  71. package/src/editor/editor.css +17 -0
  72. package/src/extensions/BackgroundColor/BackgroundColorExtension.ts +1 -1
  73. package/src/extensions/Comments/CommentMark.ts +61 -0
  74. package/src/extensions/Comments/CommentsPlugin.ts +301 -0
  75. package/src/extensions/Comments/userstore/UserStore.ts +72 -0
  76. package/src/extensions/FormattingToolbar/FormattingToolbarPlugin.ts +9 -5
  77. package/src/extensions/LinkToolbar/LinkToolbarPlugin.ts +3 -3
  78. package/src/extensions/ShowSelection/ShowSelectionPlugin.ts +52 -0
  79. package/src/extensions/TableHandles/TableHandlesPlugin.ts +409 -57
  80. package/src/extensions/TextAlignment/TextAlignmentExtension.ts +2 -0
  81. package/src/extensions/TextColor/TextColorExtension.ts +1 -1
  82. package/src/i18n/locales/ar.ts +23 -0
  83. package/src/i18n/locales/de.ts +15 -0
  84. package/src/i18n/locales/en.ts +25 -1
  85. package/src/i18n/locales/es.ts +16 -1
  86. package/src/i18n/locales/fr.ts +23 -0
  87. package/src/i18n/locales/hr.ts +18 -0
  88. package/src/i18n/locales/is.ts +24 -1
  89. package/src/i18n/locales/it.ts +15 -0
  90. package/src/i18n/locales/ja.ts +23 -0
  91. package/src/i18n/locales/ko.ts +23 -0
  92. package/src/i18n/locales/nl.ts +23 -0
  93. package/src/i18n/locales/no.ts +23 -0
  94. package/src/i18n/locales/pl.ts +23 -0
  95. package/src/i18n/locales/pt.ts +23 -0
  96. package/src/i18n/locales/ru.ts +23 -0
  97. package/src/i18n/locales/uk.ts +23 -0
  98. package/src/i18n/locales/vi.ts +23 -0
  99. package/src/i18n/locales/zh.ts +23 -0
  100. package/src/index.ts +6 -4
  101. package/src/schema/blocks/types.ts +32 -2
  102. package/src/util/browser.ts +1 -1
  103. package/src/util/table.ts +107 -0
  104. package/types/src/api/blockManipulation/tables/tables.d.ts +343 -0
  105. package/types/src/api/blockManipulation/tables/tables.test.d.ts +1 -0
  106. package/types/src/api/clipboard/toClipboard/copyExtension.d.ts +1 -1
  107. package/types/src/blocks/TableBlockContent/TableBlockContent.d.ts +1 -2
  108. package/types/src/blocks/defaultBlockTypeGuards.d.ts +3 -0
  109. package/types/src/comments/index.d.ts +9 -0
  110. package/types/src/comments/models/User.d.ts +8 -0
  111. package/types/src/comments/threadstore/DefaultThreadStoreAuth.d.ts +47 -0
  112. package/types/src/comments/threadstore/ThreadStore.d.ts +121 -0
  113. package/types/src/comments/threadstore/ThreadStoreAuth.d.ts +12 -0
  114. package/types/src/comments/threadstore/TipTapThreadStore.d.ts +97 -0
  115. package/types/src/comments/threadstore/yjs/RESTYjsThreadStore.d.ts +83 -0
  116. package/types/src/comments/threadstore/yjs/YjsThreadStore.d.ts +79 -0
  117. package/types/src/comments/threadstore/yjs/YjsThreadStore.test.d.ts +1 -0
  118. package/types/src/comments/threadstore/yjs/YjsThreadStoreBase.d.ts +15 -0
  119. package/types/src/comments/threadstore/yjs/yjsHelpers.d.ts +13 -0
  120. package/types/src/comments/types.d.ts +109 -0
  121. package/types/src/editor/BlockNoteEditor.d.ts +146 -66
  122. package/types/src/editor/BlockNoteExtensions.d.ts +4 -0
  123. package/types/src/extensions/Collaboration/createCollaborationExtensions.d.ts +1 -1
  124. package/types/src/extensions/Comments/CommentMark.d.ts +2 -0
  125. package/types/src/extensions/Comments/CommentsPlugin.d.ts +49 -0
  126. package/types/src/extensions/Comments/userstore/UserStore.d.ts +31 -0
  127. package/types/src/extensions/ShowSelection/ShowSelectionPlugin.d.ts +15 -0
  128. package/types/src/extensions/TableHandles/TableHandlesPlugin.d.ts +66 -1
  129. package/types/src/i18n/locales/de.d.ts +15 -0
  130. package/types/src/i18n/locales/en.d.ts +20 -0
  131. package/types/src/i18n/locales/es.d.ts +15 -0
  132. package/types/src/i18n/locales/hr.d.ts +18 -0
  133. package/types/src/i18n/locales/it.d.ts +15 -0
  134. package/types/src/index.d.ts +5 -4
  135. package/types/src/pm-nodes/BlockContainer.d.ts +2 -2
  136. package/types/src/pm-nodes/BlockGroup.d.ts +2 -2
  137. package/types/src/schema/blocks/types.d.ts +23 -2
  138. package/types/src/util/browser.d.ts +1 -1
  139. package/types/src/util/table.d.ts +12 -0
  140. package/dist/blocknote.umd.cjs +0 -11
  141. package/dist/blocknote.umd.cjs.map +0 -1
@@ -0,0 +1,83 @@
1
+ import * as Y from "yjs";
2
+ import { CommentBody } from "../../types.js";
3
+ import { ThreadStoreAuth } from "../ThreadStoreAuth.js";
4
+ import { YjsThreadStoreBase } from "./YjsThreadStoreBase.js";
5
+ /**
6
+ * This is a REST-based implementation of the YjsThreadStoreBase.
7
+ * It Reads data directly from the underlying document (same as YjsThreadStore),
8
+ * but for Writes, it sends data to a REST API that should:
9
+ * - check the user has the correct permissions to make the desired changes
10
+ * - apply the updates to the underlying Yjs document
11
+ *
12
+ * (see https://github.com/TypeCellOS/BlockNote-demo-nextjs-hocuspocus)
13
+ *
14
+ * The reason we still use the Yjs document as underlying storage is that it makes it easy to
15
+ * sync updates in real-time to other collaborators.
16
+ * (but technically, you could also implement a different storage altogether
17
+ * and not store the thread related data in the Yjs document)
18
+ */
19
+ export declare class RESTYjsThreadStore extends YjsThreadStoreBase {
20
+ private readonly BASE_URL;
21
+ private readonly headers;
22
+ constructor(BASE_URL: string, headers: Record<string, string>, threadsYMap: Y.Map<any>, auth: ThreadStoreAuth);
23
+ private doRequest;
24
+ addThreadToDocument: (options: {
25
+ threadId: string;
26
+ selection: {
27
+ prosemirror: {
28
+ head: number;
29
+ anchor: number;
30
+ };
31
+ yjs: {
32
+ head: any;
33
+ anchor: any;
34
+ };
35
+ };
36
+ }) => Promise<any>;
37
+ createThread: (options: {
38
+ initialComment: {
39
+ body: CommentBody;
40
+ metadata?: any;
41
+ };
42
+ metadata?: any;
43
+ }) => Promise<any>;
44
+ addComment: (options: {
45
+ comment: {
46
+ body: CommentBody;
47
+ metadata?: any;
48
+ };
49
+ threadId: string;
50
+ }) => Promise<any>;
51
+ updateComment: (options: {
52
+ comment: {
53
+ body: CommentBody;
54
+ metadata?: any;
55
+ };
56
+ threadId: string;
57
+ commentId: string;
58
+ }) => Promise<any>;
59
+ deleteComment: (options: {
60
+ threadId: string;
61
+ commentId: string;
62
+ softDelete?: boolean;
63
+ }) => Promise<any>;
64
+ deleteThread: (options: {
65
+ threadId: string;
66
+ }) => Promise<any>;
67
+ resolveThread: (options: {
68
+ threadId: string;
69
+ }) => Promise<any>;
70
+ unresolveThread: (options: {
71
+ threadId: string;
72
+ }) => Promise<any>;
73
+ addReaction: (options: {
74
+ threadId: string;
75
+ commentId: string;
76
+ emoji: string;
77
+ }) => Promise<any>;
78
+ deleteReaction: (options: {
79
+ threadId: string;
80
+ commentId: string;
81
+ emoji: string;
82
+ }) => Promise<any>;
83
+ }
@@ -0,0 +1,79 @@
1
+ import * as Y from "yjs";
2
+ import { CommentBody, ThreadData } from "../../types.js";
3
+ import { ThreadStoreAuth } from "../ThreadStoreAuth.js";
4
+ import { YjsThreadStoreBase } from "./YjsThreadStoreBase.js";
5
+ /**
6
+ * This is a Yjs-based implementation of the ThreadStore interface.
7
+ *
8
+ * It reads and writes thread / comments information directly to the underlying Yjs Document.
9
+ *
10
+ * @important While this is the easiest to add to your app, there are two challenges:
11
+ * - The user needs to be able to write to the Yjs document to store the information.
12
+ * So a user without write access to the Yjs document cannot leave any comments.
13
+ * - Even with write access, the operations are not secure. Unless your Yjs server
14
+ * guards against malicious operations, it's technically possible for one user to make changes to another user's comments, etc.
15
+ * (even though these options are not visible in the UI, a malicious user can make unauthorized changes to the underlying Yjs document)
16
+ */
17
+ export declare class YjsThreadStore extends YjsThreadStoreBase {
18
+ private readonly userId;
19
+ constructor(userId: string, threadsYMap: Y.Map<any>, auth: ThreadStoreAuth);
20
+ private transact;
21
+ createThread: (options: {
22
+ initialComment: {
23
+ body: CommentBody;
24
+ metadata?: any;
25
+ };
26
+ metadata?: any;
27
+ }) => Promise<ThreadData>;
28
+ addThreadToDocument: undefined;
29
+ addComment: (options: {
30
+ comment: {
31
+ body: CommentBody;
32
+ metadata?: any;
33
+ };
34
+ threadId: string;
35
+ }) => Promise<{
36
+ type: "comment";
37
+ id: string;
38
+ userId: string;
39
+ createdAt: Date;
40
+ updatedAt: Date;
41
+ reactions: import("../../types.js").CommentReactionData[];
42
+ metadata: any;
43
+ } & {
44
+ deletedAt?: undefined;
45
+ body: any;
46
+ }>;
47
+ updateComment: (options: {
48
+ comment: {
49
+ body: CommentBody;
50
+ metadata?: any;
51
+ };
52
+ threadId: string;
53
+ commentId: string;
54
+ }) => Promise<void>;
55
+ deleteComment: (options: {
56
+ threadId: string;
57
+ commentId: string;
58
+ softDelete?: boolean | undefined;
59
+ }) => Promise<void>;
60
+ deleteThread: (options: {
61
+ threadId: string;
62
+ }) => Promise<void>;
63
+ resolveThread: (options: {
64
+ threadId: string;
65
+ }) => Promise<void>;
66
+ unresolveThread: (options: {
67
+ threadId: string;
68
+ }) => Promise<void>;
69
+ addReaction: (options: {
70
+ threadId: string;
71
+ commentId: string;
72
+ emoji: string;
73
+ }) => Promise<void>;
74
+ deleteReaction: (options: {
75
+ threadId: string;
76
+ commentId: string;
77
+ emoji: string;
78
+ }) => Promise<void>;
79
+ }
@@ -0,0 +1,15 @@
1
+ import * as Y from "yjs";
2
+ import { ThreadData } from "../../types.js";
3
+ import { ThreadStore } from "../ThreadStore.js";
4
+ import { ThreadStoreAuth } from "../ThreadStoreAuth.js";
5
+ /**
6
+ * This is an abstract class that only implements the READ methods required by the ThreadStore interface.
7
+ * The data is read from a Yjs Map.
8
+ */
9
+ export declare abstract class YjsThreadStoreBase extends ThreadStore {
10
+ protected readonly threadsYMap: Y.Map<any>;
11
+ constructor(threadsYMap: Y.Map<any>, auth: ThreadStoreAuth);
12
+ getThread(threadId: string): ThreadData;
13
+ getThreads(): Map<string, ThreadData>;
14
+ subscribe(cb: (threads: Map<string, ThreadData>) => void): () => void;
15
+ }
@@ -0,0 +1,13 @@
1
+ import * as Y from "yjs";
2
+ import { CommentData, ThreadData } from "../../types.js";
3
+ export declare function commentToYMap(comment: CommentData): Y.Map<any>;
4
+ export declare function threadToYMap(thread: ThreadData): Y.Map<unknown>;
5
+ type SingleUserCommentReactionData = {
6
+ emoji: string;
7
+ createdAt: Date;
8
+ userId: string;
9
+ };
10
+ export declare function yMapToReaction(yMap: Y.Map<any>): SingleUserCommentReactionData;
11
+ export declare function yMapToComment(yMap: Y.Map<any>): CommentData;
12
+ export declare function yMapToThread(yMap: Y.Map<any>): ThreadData;
13
+ export {};
@@ -0,0 +1,109 @@
1
+ /**
2
+ * The body of a comment. This actually is a BlockNote document (array of blocks)
3
+ */
4
+ export type CommentBody = any;
5
+ /**
6
+ * A reaction to a comment.
7
+ */
8
+ export type CommentReactionData = {
9
+ /**
10
+ * The emoji that was reacted to the comment.
11
+ */
12
+ emoji: string;
13
+ /**
14
+ * The date the first user reacted to the comment with this emoji.
15
+ */
16
+ createdAt: Date;
17
+ /**
18
+ * The user ids of the users that have reacted to the comment with this emoji
19
+ */
20
+ userIds: string[];
21
+ };
22
+ /**
23
+ * Information about a comment.
24
+ */
25
+ export type CommentData = {
26
+ type: "comment";
27
+ /**
28
+ * The unique identifier for the comment.
29
+ */
30
+ id: string;
31
+ /**
32
+ * The user id of the author of the comment.
33
+ */
34
+ userId: string;
35
+ /**
36
+ * The date when the comment was created.
37
+ */
38
+ createdAt: Date;
39
+ /**
40
+ * The date when the comment was last updated.
41
+ */
42
+ updatedAt: Date;
43
+ /**
44
+ * The reactions (emoji reactions) to the comment.
45
+ */
46
+ reactions: CommentReactionData[];
47
+ /**
48
+ * You can use this store any additional information about the comment.
49
+ */
50
+ metadata: any;
51
+ } & ({
52
+ /**
53
+ * The date when the comment was deleted. This applies only for "soft deletes",
54
+ * otherwise the comment is removed entirely.
55
+ */
56
+ deletedAt: Date;
57
+ /**
58
+ * The body of the comment is undefined if the comment is deleted.
59
+ */
60
+ body: undefined;
61
+ } | {
62
+ /**
63
+ * In case of a non-deleted comment, this is not set
64
+ */
65
+ deletedAt?: never;
66
+ /**
67
+ * The body of the comment.
68
+ */
69
+ body: CommentBody;
70
+ });
71
+ /**
72
+ * Information about a thread. A thread holds a list of comments.
73
+ */
74
+ export type ThreadData = {
75
+ type: "thread";
76
+ /**
77
+ * The unique identifier for the thread.
78
+ */
79
+ id: string;
80
+ /**
81
+ * The date when the thread was created.
82
+ */
83
+ createdAt: Date;
84
+ /**
85
+ * The date when the thread was last updated.
86
+ */
87
+ updatedAt: Date;
88
+ /**
89
+ * The comments in the thread.
90
+ */
91
+ comments: CommentData[];
92
+ /**
93
+ * Whether the thread has been marked as resolved.
94
+ */
95
+ resolved: boolean;
96
+ /**
97
+ * The date when the thread was marked as resolved.
98
+ */
99
+ resolvedUpdatedAt?: Date;
100
+ /**
101
+ * You can use this store any additional information about the thread.
102
+ */
103
+ metadata: any;
104
+ /**
105
+ * The date when the thread was deleted. (or undefined if it is not deleted)
106
+ * This only applies for "soft deletes", otherwise the thread is removed entirely.
107
+ */
108
+ deletedAt?: Date;
109
+ };
@@ -2,6 +2,7 @@ import { AnyExtension, EditorOptions } from "@tiptap/core";
2
2
  import { Node, Schema } from "prosemirror-model";
3
3
  import * as Y from "yjs";
4
4
  import { Block, DefaultBlockSchema, DefaultInlineContentSchema, DefaultStyleSchema, PartialBlock } from "../blocks/defaultBlocks.js";
5
+ import type { CommentsPlugin } from "../extensions/Comments/CommentsPlugin.js";
5
6
  import { FilePanelProsemirrorPlugin } from "../extensions/FilePanel/FilePanelPlugin.js";
6
7
  import { FormattingToolbarProsemirrorPlugin } from "../extensions/FormattingToolbar/FormattingToolbarPlugin.js";
7
8
  import { LinkToolbarProsemirrorPlugin } from "../extensions/LinkToolbar/LinkToolbarPlugin.js";
@@ -17,7 +18,9 @@ import { BlockNoteTipTapEditor } from "./BlockNoteTipTapEditor.js";
17
18
  import { Dictionary } from "../i18n/dictionary.js";
18
19
  import { Plugin, Transaction } from "@tiptap/pm/state";
19
20
  import { EditorView } from "prosemirror-view";
21
+ import type { ThreadStore, User } from "../comments/index.js";
20
22
  import "../style.css";
23
+ import { EventEmitter } from "../util/EventEmitter.js";
21
24
  export type BlockNoteExtensionFactory = (editor: BlockNoteEditor<any, any, any>) => BlockNoteExtension;
22
25
  export type BlockNoteExtension = AnyExtension | {
23
26
  plugin: Plugin;
@@ -29,51 +32,6 @@ export type BlockNoteEditorOptions<BSchema extends BlockSchema, ISchema extends
29
32
  * @default true
30
33
  */
31
34
  animations?: boolean;
32
- /**
33
- * Disable internal extensions (based on keys / extension name)
34
- */
35
- disableExtensions: string[];
36
- /**
37
- * A dictionary object containing translations for the editor.
38
- */
39
- dictionary?: Dictionary & Record<string, any>;
40
- /**
41
- * @deprecated, provide placeholders via dictionary instead
42
- */
43
- placeholders: Record<string | "default" | "emptyDocument", string | undefined>;
44
- /**
45
- * An object containing attributes that should be added to HTML elements of the editor.
46
- *
47
- * @example { editor: { class: "my-editor-class" } }
48
- */
49
- domAttributes: Partial<BlockNoteDOMAttributes>;
50
- /**
51
- * The content that should be in the editor when it's created, represented as an array of partial block objects.
52
- */
53
- initialContent: PartialBlock<NoInfer<BSchema>, NoInfer<ISchema>, NoInfer<SSchema>>[];
54
- /**
55
- * Use default BlockNote font and reset the styles of <p> <li> <h1> elements etc., that are used in BlockNote.
56
- *
57
- * @default true
58
- */
59
- defaultStyles: boolean;
60
- schema: BlockNoteSchema<BSchema, ISchema, SSchema>;
61
- /**
62
- * The `uploadFile` method is what the editor uses when files need to be uploaded (for example when selecting an image to upload).
63
- * This method should set when creating the editor as this is application-specific.
64
- *
65
- * `undefined` means the application doesn't support file uploads.
66
- *
67
- * @param file The file that should be uploaded.
68
- * @returns The URL of the uploaded file OR an object containing props that should be set on the file block (such as an id)
69
- */
70
- uploadFile: (file: File, blockId?: string) => Promise<string | Record<string, any>>;
71
- /**
72
- * Resolve a URL of a file block to one that can be displayed or downloaded. This can be used for creating authenticated URL or
73
- * implementing custom protocols / schemes
74
- * @returns The URL that's
75
- */
76
- resolveFileUrl: (url: string) => Promise<string>;
77
35
  /**
78
36
  * When enabled, allows for collaboration between multiple users.
79
37
  */
@@ -105,23 +63,51 @@ export type BlockNoteEditorOptions<BSchema extends BlockSchema, ISchema extends
105
63
  */
106
64
  showCursorLabels?: "always" | "activity";
107
65
  };
66
+ comments: {
67
+ threadStore: ThreadStore;
68
+ };
108
69
  /**
109
- * additional tiptap options, undocumented
70
+ * Use default BlockNote font and reset the styles of <p> <li> <h1> elements etc., that are used in BlockNote.
71
+ *
72
+ * @default true
110
73
  */
111
- _tiptapOptions: Partial<EditorOptions>;
74
+ defaultStyles: boolean;
112
75
  /**
113
- * (experimental) add extra prosemirror plugins or tiptap extensions to the editor
76
+ * A dictionary object containing translations for the editor.
114
77
  */
115
- _extensions: Record<string, BlockNoteExtension | BlockNoteExtensionFactory>;
116
- trailingBlock?: boolean;
78
+ dictionary?: Dictionary & Record<string, any>;
117
79
  /**
118
- * Boolean indicating whether the editor is in headless mode.
119
- * Headless mode means we can use features like importing / exporting blocks,
120
- * but there's no underlying editor (UI) instantiated.
80
+ * Disable internal extensions (based on keys / extension name)
81
+ */
82
+ disableExtensions: string[];
83
+ /**
84
+ * An object containing attributes that should be added to HTML elements of the editor.
121
85
  *
122
- * You probably don't need to set this manually, but use the `server-util` package instead that uses this option internally
86
+ * @example { editor: { class: "my-editor-class" } }
123
87
  */
124
- _headless: boolean;
88
+ domAttributes: Partial<BlockNoteDOMAttributes>;
89
+ dropCursor?: (opts: {
90
+ editor: BlockNoteEditor<NoInfer<BSchema>, NoInfer<ISchema>, NoInfer<SSchema>>;
91
+ color?: string | false;
92
+ width?: number;
93
+ class?: string;
94
+ }) => Plugin;
95
+ /**
96
+ * The content that should be in the editor when it's created, represented as an array of partial block objects.
97
+ */
98
+ initialContent: PartialBlock<NoInfer<BSchema>, NoInfer<ISchema>, NoInfer<SSchema>>[];
99
+ /**
100
+ * @deprecated, provide placeholders via dictionary instead
101
+ */
102
+ placeholders: Record<string | "default" | "emptyDocument", string | undefined>;
103
+ /**
104
+ * Resolve a URL of a file block to one that can be displayed or downloaded. This can be used for creating authenticated URL or
105
+ * implementing custom protocols / schemes
106
+ * @returns The URL that's
107
+ */
108
+ resolveFileUrl: (url: string) => Promise<string>;
109
+ resolveUsers: (userIds: string[]) => Promise<User[]>;
110
+ schema: BlockNoteSchema<BSchema, ISchema, SSchema>;
125
111
  /**
126
112
  * A flag indicating whether to set an HTML ID for every block
127
113
  *
@@ -131,7 +117,14 @@ export type BlockNoteEditorOptions<BSchema extends BlockSchema, ISchema extends
131
117
  * (note that the id is always set on the `data-id` attribute)
132
118
  */
133
119
  setIdAttribute?: boolean;
134
- dropCursor?: (opts: any) => Plugin;
120
+ /**
121
+ * The detection mode for showing the side menu - "viewport" always shows the
122
+ * side menu for the block next to the mouse cursor, while "editor" only shows
123
+ * it when hovering the editor or the side menu itself.
124
+ *
125
+ * @default "viewport"
126
+ */
127
+ sideMenuDetection: "viewport" | "editor";
135
128
  /**
136
129
  Select desired behavior when pressing `Tab` (or `Shift-Tab`). Specifically,
137
130
  what should happen when a user has selected multiple blocks while a toolbar
@@ -147,17 +140,70 @@ export type BlockNoteEditorOptions<BSchema extends BlockSchema, ISchema extends
147
140
  */
148
141
  tabBehavior: "prefer-navigate-ui" | "prefer-indent";
149
142
  /**
150
- * The detection mode for showing the side menu - "viewport" always shows the
151
- * side menu for the block next to the mouse cursor, while "editor" only shows
152
- * it when hovering the editor or the side menu itself.
143
+ * Allows enabling / disabling features of tables.
144
+ */
145
+ tables?: {
146
+ /**
147
+ * Whether to allow splitting and merging cells within a table.
148
+ *
149
+ * @default false
150
+ */
151
+ splitCells?: boolean;
152
+ /**
153
+ * Whether to allow changing the background color of cells.
154
+ *
155
+ * @default false
156
+ */
157
+ cellBackgroundColor?: boolean;
158
+ /**
159
+ * Whether to allow changing the text color of cells.
160
+ *
161
+ * @default false
162
+ */
163
+ cellTextColor?: boolean;
164
+ /**
165
+ * Whether to allow changing cells into headers.
166
+ *
167
+ * @default false
168
+ */
169
+ headers?: boolean;
170
+ };
171
+ trailingBlock?: boolean;
172
+ /**
173
+ * The `uploadFile` method is what the editor uses when files need to be uploaded (for example when selecting an image to upload).
174
+ * This method should set when creating the editor as this is application-specific.
153
175
  *
154
- * @default "viewport"
176
+ * `undefined` means the application doesn't support file uploads.
177
+ *
178
+ * @param file The file that should be uploaded.
179
+ * @returns The URL of the uploaded file OR an object containing props that should be set on the file block (such as an id)
155
180
  */
156
- sideMenuDetection: "viewport" | "editor";
181
+ uploadFile: (file: File, blockId?: string) => Promise<string | Record<string, any>>;
182
+ /**
183
+ * additional tiptap options, undocumented
184
+ */
185
+ _tiptapOptions: Partial<EditorOptions>;
186
+ /**
187
+ * (experimental) add extra prosemirror plugins or tiptap extensions to the editor
188
+ */
189
+ _extensions: Record<string, BlockNoteExtension | BlockNoteExtensionFactory>;
190
+ /**
191
+ * Boolean indicating whether the editor is in headless mode.
192
+ * Headless mode means we can use features like importing / exporting blocks,
193
+ * but there's no underlying editor (UI) instantiated.
194
+ *
195
+ * You probably don't need to set this manually, but use the `server-util` package instead that uses this option internally
196
+ */
197
+ _headless: boolean;
157
198
  };
158
- export declare class BlockNoteEditor<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema> {
199
+ export declare class BlockNoteEditor<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema> extends EventEmitter<{
200
+ create: void;
201
+ }> {
159
202
  protected readonly options: Partial<BlockNoteEditorOptions<any, any, any>>;
160
- private readonly _pmSchema;
203
+ /**
204
+ * The underlying prosemirror schema
205
+ */
206
+ readonly pmSchema: Schema;
161
207
  /**
162
208
  * extensions that are added to the editor, can be tiptap extensions or prosemirror plugins
163
209
  */
@@ -202,6 +248,8 @@ export declare class BlockNoteEditor<BSchema extends BlockSchema = DefaultBlockS
202
248
  readonly suggestionMenus: SuggestionMenuProseMirrorPlugin<BSchema, ISchema, SSchema>;
203
249
  readonly filePanel?: FilePanelProsemirrorPlugin<ISchema, SSchema>;
204
250
  readonly tableHandles?: TableHandlesProsemirrorPlugin<ISchema, SSchema>;
251
+ readonly comments?: CommentsPlugin;
252
+ private readonly showSelectionPlugin;
205
253
  /**
206
254
  * The `uploadFile` method is what the editor uses when files need to be uploaded (for example when selecting an image to upload).
207
255
  * This method should set when creating the editor as this is application-specific.
@@ -215,17 +263,35 @@ export declare class BlockNoteEditor<BSchema extends BlockSchema = DefaultBlockS
215
263
  private onUploadStartCallbacks;
216
264
  private onUploadEndCallbacks;
217
265
  readonly resolveFileUrl?: (url: string) => Promise<string>;
218
- get pmSchema(): Schema<any, any>;
266
+ readonly resolveUsers?: (userIds: string[]) => Promise<User[]>;
267
+ /**
268
+ * Editor settings
269
+ */
270
+ readonly settings: {
271
+ tables: {
272
+ splitCells: boolean;
273
+ cellBackgroundColor: boolean;
274
+ cellTextColor: boolean;
275
+ headers: boolean;
276
+ };
277
+ };
219
278
  static create<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema>(options?: Partial<BlockNoteEditorOptions<BSchema, ISchema, SSchema>>): BlockNoteEditor<BSchema, ISchema, SSchema>;
220
279
  protected constructor(options: Partial<BlockNoteEditorOptions<any, any, any>>);
221
- dispatch(tr: Transaction): void;
280
+ dispatch: (tr: Transaction) => void;
222
281
  /**
223
282
  * Mount the editor to a parent DOM element. Call mount(undefined) to clean up
224
283
  *
225
284
  * @warning Not needed to call manually when using React, use BlockNoteView to take care of mounting
226
285
  */
227
286
  mount: (parentElement?: HTMLElement | null, contentComponent?: any) => void;
287
+ /**
288
+ * Get the underlying prosemirror view
289
+ */
228
290
  get prosemirrorView(): EditorView | undefined;
291
+ /**
292
+ * Get the underlying prosemirror state
293
+ */
294
+ get prosemirrorState(): import("prosemirror-state").EditorState;
229
295
  get domElement(): HTMLDivElement | undefined;
230
296
  isFocused(): boolean;
231
297
  focus(): void;
@@ -284,11 +350,15 @@ export declare class BlockNoteEditor<BSchema extends BlockSchema = DefaultBlockS
284
350
  /**
285
351
  * Executes a callback whenever the editor's contents change.
286
352
  * @param callback The callback to execute.
353
+ *
354
+ * @deprecated use `onChange` instead
287
355
  */
288
356
  onEditorContentChange(callback: () => void): void;
289
357
  /**
290
358
  * Executes a callback whenever the editor's selection changes.
291
359
  * @param callback The callback to execute.
360
+ *
361
+ * @deprecated use `onSelectionChange` instead
292
362
  */
293
363
  onEditorSelectionChange(callback: () => void): void;
294
364
  /**
@@ -479,9 +549,19 @@ export declare class BlockNoteEditor<BSchema extends BlockSchema = DefaultBlockS
479
549
  * @param callback The callback to execute.
480
550
  * @returns A function to remove the callback.
481
551
  */
482
- onSelectionChange(callback: (editor: BlockNoteEditor<BSchema, ISchema, SSchema>) => void): (() => void) | undefined;
552
+ onSelectionChange(callback: (editor: BlockNoteEditor<BSchema, ISchema, SSchema>) => void, includeSelectionChangedByRemote?: boolean): (() => void) | undefined;
553
+ /**
554
+ * A callback function that runs when the editor has been initialized.
555
+ *
556
+ * This can be useful for plugins to initialize themselves after the editor has been initialized.
557
+ */
558
+ onCreate(callback: () => void): () => void;
559
+ getSelectionBoundingBox(): DOMRect | undefined;
560
+ get isEmpty(): boolean;
483
561
  openSuggestionMenu(triggerCharacter: string, pluginState?: {
484
562
  deleteTriggerCharacter?: boolean;
485
563
  ignoreQueryLength?: boolean;
486
564
  }): void;
565
+ getForceSelectionVisible(): boolean;
566
+ setForceSelectionVisible(forceSelectionVisible: boolean): void;
487
567
  }
@@ -1,5 +1,6 @@
1
1
  import { Plugin } from "prosemirror-state";
2
2
  import * as Y from "yjs";
3
+ import type { ThreadStore } from "../comments/index.js";
3
4
  import { BlockNoteDOMAttributes, BlockSchema, BlockSpecs, InlineContentSchema, InlineContentSpecs, StyleSchema, StyleSpecs } from "../schema/index.js";
4
5
  import type { BlockNoteEditor, BlockNoteExtension } from "./BlockNoteEditor.js";
5
6
  type ExtensionOptions<BSchema extends BlockSchema, I extends InlineContentSchema, S extends StyleSchema> = {
@@ -28,6 +29,9 @@ type ExtensionOptions<BSchema extends BlockSchema, I extends InlineContentSchema
28
29
  placeholders: Record<string | "default" | "emptyDocument", string | undefined>;
29
30
  tabBehavior?: "prefer-navigate-ui" | "prefer-indent";
30
31
  sideMenuDetection: "viewport" | "editor";
32
+ comments?: {
33
+ threadStore: ThreadStore;
34
+ };
31
35
  };
32
36
  /**
33
37
  * Get all the Tiptap extensions BlockNote is configured with by default
@@ -9,7 +9,7 @@ export declare const createCollaborationExtensions: (collaboration: {
9
9
  provider: any;
10
10
  renderCursor?: (user: any) => HTMLElement;
11
11
  showCursorLabels?: "always" | "activity";
12
- }) => (import("@tiptap/core").Extension<import("@tiptap/extension-collaboration").CollaborationOptions, any> | import("@tiptap/core").Extension<import("@tiptap/extension-collaboration-cursor").CollaborationCursorOptions, {
12
+ }) => (import("@tiptap/core").Extension<import("@tiptap/extension-collaboration").CollaborationOptions, import("@tiptap/extension-collaboration").CollaborationStorage> | import("@tiptap/core").Extension<import("@tiptap/extension-collaboration-cursor").CollaborationCursorOptions, {
13
13
  users: {
14
14
  [key: string]: any;
15
15
  clientId: number;
@@ -0,0 +1,2 @@
1
+ import { Mark } from "@tiptap/core";
2
+ export declare const CommentMark: Mark<any, any>;