@blocknote/core 0.38.0 → 0.39.1

package/src/extensions/SideMenu/dragging.ts

@@ -159,10 +159,10 @@ export function dragStart<
     return;
   }
 
-  const view = editor.prosemirrorView;
-  if (!view) {
+  if (editor.headless) {
     return;
   }
+  const view = editor.prosemirrorView;
 
   const posInfo = getNodeById(block.id, view.state.doc);
   if (!posInfo) {

package/src/extensions/SuggestionMenu/SuggestionPlugin.ts

@@ -32,6 +32,7 @@ class SuggestionMenuView<
   constructor(
     private readonly editor: BlockNoteEditor<BSchema, I, S>,
     emitUpdate: (menuName: string, state: SuggestionMenuState) => void,
+    view: EditorView,
   ) {
     this.pluginState = undefined;
 
@@ -46,7 +47,7 @@ class SuggestionMenuView<
       });
     };
 
-    this.rootEl = this.editor.prosemirrorView?.root;
+    this.rootEl = view.root;
 
     // Setting capture=true ensures that any parent container of the editor that
     // gets scrolled will trigger the scroll event. Scroll events do not bubble
@@ -181,12 +182,13 @@ export class SuggestionMenuProseMirrorPlugin<
       new Plugin({
         key: suggestionMenuPluginKey,
 
-        view: () => {
+        view: (view) => {
           this.view = new SuggestionMenuView<BSchema, I, S>(
             editor,
             (triggerCharacter, state) => {
               this.emit(`update ${triggerCharacter}`, state);
             },
+            view,
           );
           return this.view;
         },
@@ -204,11 +206,6 @@ export class SuggestionMenuProseMirrorPlugin<
             _oldState,
             newState,
           ): SuggestionPluginState => {
-            // TODO: More clearly define which transactions should be ignored.
-            if (transaction.getMeta("orderedListIndexing") !== undefined) {
-              return prev;
-            }
-
             // Ignore transactions in code blocks.
             if (transaction.selection.$from.parent.type.spec.code) {
               return prev;

package/src/extensions/SuggestionMenu/getDefaultEmojiPickerItems.ts

@@ -1,6 +1,6 @@
 import type { Emoji, EmojiMartData } from "@emoji-mart/data";
 
-import { checkDefaultInlineContentTypeInSchema } from "../../blocks/defaultBlockTypeGuards.js";
+import { defaultInlineContentSchema } from "../../blocks/defaultBlocks.js";
 import { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
 import {
   BlockSchema,
@@ -54,7 +54,11 @@ export async function getDefaultEmojiPickerItems<
   editor: BlockNoteEditor<BSchema, I, S>,
   query: string,
 ): Promise<DefaultGridSuggestionItem[]> {
-  if (!checkDefaultInlineContentTypeInSchema("text", editor)) {
+  if (
+    !("text" in editor.schema.inlineContentSchema) ||
+    editor.schema.inlineContentSchema["text"] !==
+      defaultInlineContentSchema["text"]
+  ) {
     return [];
   }
 

package/src/extensions/SuggestionMenu/getDefaultSlashMenuItems.ts

@@ -1,7 +1,7 @@
 import { Block, PartialBlock } from "../../blocks/defaultBlocks.js";
 import type { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
 
-import { checkDefaultBlockTypeInSchema } from "../../blocks/defaultBlockTypeGuards.js";
+import { editorHasBlockWithType } from "../../blocks/defaultBlockTypeGuards.js";
 import {
   BlockSchema,
   InlineContentSchema,
@@ -87,7 +87,7 @@ export function getDefaultSlashMenuItems<
 >(editor: BlockNoteEditor<BSchema, I, S>) {
   const items: DefaultSuggestionItem[] = [];
 
-  if (checkDefaultBlockTypeInSchema("heading", editor)) {
+  if (editorHasBlockWithType(editor, "heading", { level: "number" })) {
     items.push(
       {
         onItemClick: () => {
@@ -125,7 +125,7 @@ export function getDefaultSlashMenuItems<
     );
   }
 
-  if (checkDefaultBlockTypeInSchema("quote", editor)) {
+  if (editorHasBlockWithType(editor, "quote")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -137,7 +137,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("toggleListItem", editor)) {
+  if (editorHasBlockWithType(editor, "toggleListItem")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -150,7 +150,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("numberedListItem", editor)) {
+  if (editorHasBlockWithType(editor, "numberedListItem")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -163,7 +163,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("bulletListItem", editor)) {
+  if (editorHasBlockWithType(editor, "bulletListItem")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -176,7 +176,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("checkListItem", editor)) {
+  if (editorHasBlockWithType(editor, "checkListItem")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -189,7 +189,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("paragraph", editor)) {
+  if (editorHasBlockWithType(editor, "paragraph")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -202,7 +202,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("codeBlock", editor)) {
+  if (editorHasBlockWithType(editor, "codeBlock")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -215,7 +215,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("table", editor)) {
+  if (editorHasBlockWithType(editor, "table")) {
     items.push({
       onItemClick: () => {
         insertOrUpdateBlock(editor, {
@@ -230,7 +230,7 @@ export function getDefaultSlashMenuItems<
                 cells: ["", "", ""],
               },
             ],
-          },
+          } as any,
         });
       },
       badge: undefined,
@@ -239,7 +239,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("image", editor)) {
+  if (editorHasBlockWithType(editor, "image", { url: "string" })) {
     items.push({
       onItemClick: () => {
         const insertedBlock = insertOrUpdateBlock(editor, {
@@ -258,7 +258,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("video", editor)) {
+  if (editorHasBlockWithType(editor, "video", { url: "string" })) {
     items.push({
       onItemClick: () => {
         const insertedBlock = insertOrUpdateBlock(editor, {
@@ -277,7 +277,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("audio", editor)) {
+  if (editorHasBlockWithType(editor, "audio", { url: "string" })) {
     items.push({
       onItemClick: () => {
         const insertedBlock = insertOrUpdateBlock(editor, {
@@ -296,7 +296,7 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("file", editor)) {
+  if (editorHasBlockWithType(editor, "file", { url: "string" })) {
     items.push({
       onItemClick: () => {
         const insertedBlock = insertOrUpdateBlock(editor, {
@@ -315,7 +315,12 @@ export function getDefaultSlashMenuItems<
     });
   }
 
-  if (checkDefaultBlockTypeInSchema("heading", editor)) {
+  if (
+    editorHasBlockWithType(editor, "heading", {
+      level: "number",
+      isToggleable: "boolean",
+    })
+  ) {
     items.push(
       {
         onItemClick: () => {
@@ -349,8 +354,10 @@ export function getDefaultSlashMenuItems<
         ...editor.dictionary.slash_menu.toggle_heading_3,
       },
     );
+  }
 
-    editor.settings.heading.levels
+  if (editorHasBlockWithType(editor, "heading", { level: "number" })) {
+    (editor.schema.blockSchema.heading.propSchema.level.values || [])
       .filter((level): level is 4 | 5 | 6 => level > 3)
       .forEach((level) => {
         items.push({

package/src/extensions/TableHandles/TableHandlesPlugin.ts

@@ -27,7 +27,7 @@ import {
 import { nodeToBlock } from "../../api/nodeConversions/nodeToBlock.js";
 import { getNodeById } from "../../api/nodeUtil.js";
 import {
-  checkBlockIsDefaultType,
+  editorHasBlockWithType,
   isTableCellSelection,
 } from "../../blocks/defaultBlockTypeGuards.js";
 import { DefaultBlockSchema } from "../../blocks/defaultBlocks.js";
@@ -278,7 +278,7 @@ export class TableHandlesView<
       this.editor.schema.styleSchema,
     );
 
-    if (checkBlockIsDefaultType("table", block, this.editor)) {
+    if (editorHasBlockWithType(this.editor, "table")) {
       this.tablePos = pmNodeInfo.posBeforeNode + 1;
       tableBlock = block;
     }
@@ -829,8 +829,8 @@ export class TableHandlesProsemirrorPlugin<
       }),
     );
 
-    if (!this.editor.prosemirrorView) {
-      throw new Error("Editor view not initialized.");
+    if (this.editor.headless) {
+      return;
     }
 
     setHiddenDragImage(this.editor.prosemirrorView.root);
@@ -872,8 +872,8 @@ export class TableHandlesProsemirrorPlugin<
       }),
     );
 
-    if (!this.editor.prosemirrorView) {
-      throw new Error("Editor view not initialized.");
+    if (this.editor.headless) {
+      return;
     }
 
     setHiddenDragImage(this.editor.prosemirrorView.root);
@@ -897,8 +897,8 @@ export class TableHandlesProsemirrorPlugin<
 
     this.editor.transact((tr) => tr.setMeta(tableHandlesPluginKey, null));
 
-    if (!this.editor.prosemirrorView) {
-      throw new Error("Editor view not initialized.");
+    if (this.editor.headless) {
+      return;
     }
 
     unsetHiddenDragImage(this.editor.prosemirrorView.root);

package/src/extensions/TextAlignment/TextAlignmentExtension.ts

@@ -6,17 +6,11 @@ export const TextAlignmentExtension = Extension.create({
   addGlobalAttributes() {
     return [
       {
-        // Attribute is applied to block content instead of container so that child blocks don't inherit the text
-        // alignment styling.
-        types: [
-          "paragraph",
-          "heading",
-          "bulletListItem",
-          "numberedListItem",
-          "checkListItem",
-          "tableCell",
-          "tableHeader",
-        ],
+        // Generally text alignment is handled through props using the custom
+        // blocks API. Tables are the only blocks that are created as TipTap
+        // nodes and ported to blocks, so we need to add text alignment in a
+        // separate extension.
+        types: ["tableCell", "tableHeader"],
         attributes: {
           textAlignment: {
             default: "left",

package/src/extensions/TextColor/TextColorExtension.ts

@@ -1,5 +1,5 @@
 import { Extension } from "@tiptap/core";
-import { defaultProps } from "../../blocks/defaultProps.js";
+import { getTextColorAttribute } from "../../blocks/defaultProps.js";
 
 export const TextColorExtension = Extension.create({
   name: "blockTextColor",
@@ -7,23 +7,9 @@ export const TextColorExtension = Extension.create({
   addGlobalAttributes() {
     return [
       {
-        types: ["blockContainer", "tableCell", "tableHeader"],
+        types: ["table", "tableCell", "tableHeader"],
         attributes: {
-          textColor: {
-            default: defaultProps.textColor.default,
-            parseHTML: (element) =>
-              element.hasAttribute("data-text-color")
-                ? element.getAttribute("data-text-color")
-                : defaultProps.textColor.default,
-            renderHTML: (attributes) => {
-              if (attributes.textColor === defaultProps.textColor.default) {
-                return {};
-              }
-              return {
-                "data-text-color": attributes.textColor,
-              };
-            },
-          },
+          textColor: getTextColorAttribute(),
         },
       },
     ];

package/src/extensions/TextColor/TextColorMark.ts

@@ -1,18 +1,13 @@
 import { Mark } from "@tiptap/core";
 import { createStyleSpecFromTipTapMark } from "../../schema/index.js";
+import { getTextColorAttribute } from "../../blocks/defaultProps.js";
 
 const TextColorMark = Mark.create({
   name: "textColor",
 
   addAttributes() {
     return {
-      stringValue: {
-        default: undefined,
-        parseHTML: (element) => element.getAttribute("data-text-color"),
-        renderHTML: (attributes) => ({
-          "data-text-color": attributes.stringValue,
-        }),
-      },
+      stringValue: getTextColorAttribute("stringValue"),
     };
   },
 
@@ -25,8 +20,8 @@ const TextColorMark = Mark.create({
             return false;
           }
 
-          if (element.hasAttribute("data-text-color")) {
-            return { stringValue: element.getAttribute("data-text-color") };
+          if (element.hasAttribute("data-text-color") || element.style.color) {
+            return {};
           }
 
           return false;

package/src/extensions/UniqueID/UniqueID.ts

@@ -134,19 +134,12 @@ const UniqueID = Extension.create({
       new Plugin({
         key: new PluginKey("uniqueID"),
         appendTransaction: (transactions, oldState, newState) => {
-          // console.log("appendTransaction");
           const docChanges =
             transactions.some((transaction) => transaction.docChanged) &&
             !oldState.doc.eq(newState.doc);
           const filterTransactions =
             this.options.filterTransaction &&
-            transactions.some((tr) => {
-              let _a, _b;
-              return !((_b = (_a = this.options).filterTransaction) === null ||
-              _b === void 0
-                ? void 0
-                : _b.call(_a, tr));
-            });
+            transactions.some((tr) => !this.options.filterTransaction?.(tr));
           if (!docChanges || filterTransactions) {
             return;
           }
@@ -172,16 +165,14 @@ const UniqueID = Extension.create({
               .map(({ node }) => node.attrs[attributeName])
               .filter((id) => id !== null);
             const duplicatedNewIds = findDuplicates(newIds);
+
             newNodes.forEach(({ node, pos }) => {
-              let _a;
               // instead of checking `node.attrs[attributeName]` directly
               // we look at the current state of the node within `tr.doc`.
               // this helps to prevent adding new ids to the same node
               // if the node changed multiple times within one transaction
-              const id =
-                (_a = tr.doc.nodeAt(pos)) === null || _a === void 0
-                  ? void 0
-                  : _a.attrs[attributeName];
+              const id = tr.doc.nodeAt(pos)?.attrs[attributeName];
+
               if (id === null) {
                 // edge case, when using collaboration, yjs will set the id to null in `_forceRerender`
                 // when loading the editor
@@ -230,6 +221,8 @@ const UniqueID = Extension.create({
           if (!tr.steps.length) {
             return;
           }
+          // mark the transaction as having been processed by the uniqueID plugin
+          tr.setMeta("uniqueID", true);
           return tr;
         },
         // we register a global drag handler to track the current drag source element

package/src/index.ts

@@ -7,36 +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";
@@ -60,7 +34,7 @@ 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";