@blocknote/core 0.37.0 → 0.39.0

package/src/extensions/SideMenu/SideMenuPlugin.ts

@@ -17,7 +17,6 @@ import {
   InlineContentSchema,
   StyleSchema,
 } from "../../schema/index.js";
-import { initializeESMDependencies } from "../../util/esmDependencies.js";
 import { getDraggableBlockFromElement } from "../getDraggableBlockFromElement.js";
 import { dragStart, unsetDragImage } from "./dragging.js";
 
@@ -171,7 +170,6 @@ export class SideMenuView<
       this.onDragEnd as EventListener,
       true,
     );
-    initializeESMDependencies();
 
     // Shows or updates menu position whenever the cursor moves, if the menu isn't frozen.
     this.pmView.root.addEventListener(

package/src/extensions/SuggestionMenu/SuggestionPlugin.ts

@@ -204,11 +204,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;
     }

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/i18n/locales/ar.ts

@@ -169,18 +169,12 @@ export const ar: Dictionary = {
     comment_reply: "أضف تعليقًا...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "إضافة صورة",
-    },
-    video: {
-      add_button_text: "إضافة فيديو",
-    },
-    audio: {
-      add_button_text: "إضافة صوت",
-    },
-    file: {
-      add_button_text: "إضافة ملف",
-    },
+    add_button_text: {
+      image: "إضافة صورة",
+      video: "إضافة فيديو",
+      audio: "إضافة صوت",
+      file: "إضافة ملف",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "تبديل فارغ. انقر لإضافة كتلة.",

package/src/i18n/locales/de.ts

@@ -204,18 +204,12 @@ export const de: Dictionary = {
     comment_reply: "Kommentar hinzufügen …",
   },
   file_blocks: {
-    image: {
-      add_button_text: "Bild hinzufügen",
-    },
-    video: {
-      add_button_text: "Video hinzufügen",
-    },
-    audio: {
-      add_button_text: "Audio hinzufügen",
-    },
-    file: {
-      add_button_text: "Datei hinzufügen",
-    },
+    add_button_text: {
+      image: "Bild hinzufügen",
+      video: "Video hinzufügen",
+      audio: "Audio hinzufügen",
+      file: "Datei hinzufügen",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button:

package/src/i18n/locales/en.ts

@@ -184,18 +184,12 @@ export const en = {
     comment_reply: "Add comment...",
   } as Record<string | "default" | "emptyDocument", string | undefined>,
   file_blocks: {
-    image: {
-      add_button_text: "Add image",
-    },
-    video: {
-      add_button_text: "Add video",
-    },
-    audio: {
-      add_button_text: "Add audio",
-    },
-    file: {
-      add_button_text: "Add file",
-    },
+    add_button_text: {
+      image: "Add image",
+      video: "Add video",
+      audio: "Add audio",
+      file: "Add file",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "Empty toggle. Click to add a block.",

package/src/i18n/locales/es.ts

@@ -184,18 +184,12 @@ export const es: Dictionary = {
     comment_reply: "Agregar comentario...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "Agregar imagen",
-    },
-    video: {
-      add_button_text: "Agregar vídeo",
-    },
-    audio: {
-      add_button_text: "Agregar audio",
-    },
-    file: {
-      add_button_text: "Agregar archivo",
-    },
+    add_button_text: {
+      image: "Agregar imagen",
+      video: "Agregar vídeo",
+      audio: "Agregar audio",
+      file: "Agregar archivo",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "Toggle vacío. Haz clic para añadir un bloque.",

package/src/i18n/locales/fr.ts

@@ -230,18 +230,12 @@ export const fr: Dictionary = {
     comment_reply: "Ajouter un commentaire...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "Ajouter une image",
-    },
-    video: {
-      add_button_text: "Ajouter une vidéo",
-    },
-    audio: {
-      add_button_text: "Ajouter un audio",
-    },
-    file: {
-      add_button_text: "Ajouter un fichier",
-    },
+    add_button_text: {
+      image: "Ajouter une image",
+      video: "Ajouter une vidéo",
+      audio: "Ajouter un audio",
+      file: "Ajouter un fichier",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "Toggle vide. Cliquez pour ajouter un bloc.",

package/src/i18n/locales/he.ts

@@ -186,18 +186,12 @@ export const he: Dictionary = {
     comment_reply: "הוסף תגובה...",
   } as Record<string | "default" | "emptyDocument", string | undefined>,
   file_blocks: {
-    image: {
-      add_button_text: "הוסף תמונה",
-    },
-    video: {
-      add_button_text: "הוסף וידאו",
-    },
-    audio: {
-      add_button_text: "הוסף אודיו",
-    },
-    file: {
-      add_button_text: "הוסף קובץ",
-    },
+    add_button_text: {
+      image: "הוסף תמונה",
+      video: "הוסף וידאו",
+      audio: "הוסף אודיו",
+      file: "הוסף קובץ",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "מתג ריק. לחץ כדי להוסיף בלוק.",

package/src/i18n/locales/hr.ts

@@ -197,18 +197,12 @@ export const hr: Dictionary = {
     comment_reply: "Dodaj komentar...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "Dodaj sliku",
-    },
-    video: {
-      add_button_text: "Dodaj video",
-    },
-    audio: {
-      add_button_text: "Dodaj audio",
-    },
-    file: {
-      add_button_text: "Dodaj datoteku",
-    },
+    add_button_text: {
+      image: "Dodaj sliku",
+      video: "Dodaj video",
+      audio: "Dodaj audio",
+      file: "Dodaj datoteku",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "Prazan sklopivi blok. Klikni da dodaš sadržaj.",

package/src/i18n/locales/is.ts

@@ -198,18 +198,12 @@ export const is: Dictionary = {
     comment_reply: "Bæta við athugasemd...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "Bæta við mynd",
-    },
-    video: {
-      add_button_text: "Bæta við myndbandi",
-    },
-    audio: {
-      add_button_text: "Bæta við hljóði",
-    },
-    file: {
-      add_button_text: "Bæta við skrá",
-    },
+    add_button_text: {
+      image: "Bæta við mynd",
+      video: "Bæta við myndbandi",
+      audio: "Bæta við hljóði",
+      file: "Bæta við skrá",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "Tóm fellilína. Smelltu til að bæta við blokk.",

package/src/i18n/locales/it.ts

@@ -206,18 +206,12 @@ export const it: Dictionary = {
     comment_reply: "Aggiungi commento...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "Aggiungi immagine",
-    },
-    video: {
-      add_button_text: "Aggiungi video",
-    },
-    audio: {
-      add_button_text: "Aggiungi audio",
-    },
-    file: {
-      add_button_text: "Aggiungi file",
-    },
+    add_button_text: {
+      image: "Aggiungi immagine",
+      video: "Aggiungi video",
+      audio: "Aggiungi audio",
+      file: "Aggiungi file",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "Toggle vuoto. Clicca per aggiungere un blocco.",

package/src/i18n/locales/ja.ts

@@ -224,18 +224,12 @@ export const ja: Dictionary = {
     comment_reply: "コメントを追加...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "画像を追加",
-    },
-    video: {
-      add_button_text: "ビデオを追加",
-    },
-    audio: {
-      add_button_text: "オーディオを追加",
-    },
-    file: {
-      add_button_text: "ファイルを追加",
-    },
+    add_button_text: {
+      image: "画像を追加",
+      video: "ビデオを追加",
+      audio: "オーディオを追加",
+      file: "ファイルを追加",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "空のトグルです。クリックしてブロックを追加。",

package/src/i18n/locales/ko.ts

@@ -197,18 +197,12 @@ export const ko: Dictionary = {
     comment_reply: "댓글 추가...",
   },
   file_blocks: {
-    image: {
-      add_button_text: "이미지 추가",
-    },
-    video: {
-      add_button_text: "비디오 추가",
-    },
-    audio: {
-      add_button_text: "오디오 추가",
-    },
-    file: {
-      add_button_text: "파일 추가",
-    },
+    add_button_text: {
+      image: "이미지 추가",
+      video: "비디오 추가",
+      audio: "오디오 추가",
+      file: "파일 추가",
+    } as Record<string, string>,
   },
   toggle_blocks: {
     add_block_button: "비어 있는 토글입니다. 클릭하여 블록을 추가하세요.",