@blocknote/xl-multi-column 0.27.2 → 0.29.0

package/dist/webpack-stats.json

@@ -1 +1 @@
-{"builtAt":1743885375579,"assets":[{"name":"blocknote-xl-multi-column.cjs","size":20662},{"name":"blocknote-xl-multi-column.cjs.map","size":3792252}],"chunks":[{"id":"a1ee98a","entry":true,"initial":true,"files":["blocknote-xl-multi-column.cjs"],"names":["blocknote-xl-multi-column"]}],"modules":[{"name":"./src/i18n/locales/ar.ts","size":364,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/de.ts","size":400,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/en.ts","size":378,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/es.ts","size":392,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/fr.ts","size":398,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/hr.ts","size":396,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/is.ts","size":376,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/ja.ts","size":284,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/ko.ts","size":288,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/nl.ts","size":390,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/pl.ts","size":394,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/pt.ts","size":388,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/ru.ts","size":370,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/vi.ts","size":340,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/zh.ts","size":274,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/index.ts","size":0,"chunks":["a1ee98a"]},{"name":"./src/i18n/dictionary.ts","size":189,"chunks":["a1ee98a"]},{"name":"./src/extensions/ColumnResize/ColumnResizeExtension.ts","size":8309,"chunks":["a1ee98a"]},{"name":"./src/pm-nodes/Column.ts","size":2567,"chunks":["a1ee98a"]},{"name":"./src/pm-nodes/ColumnList.ts","size":1120,"chunks":["a1ee98a"]},{"name":"./src/blocks/Columns/index.ts","size":210,"chunks":["a1ee98a"]},{"name":"./src/blocks/schema.ts","size":425,"chunks":["a1ee98a"]},{"name":"./src/extensions/DropCursor/MultiColumnDropCursorPlugin.ts","size":12035,"chunks":["a1ee98a"]},{"name":"../../node_modules/.pnpm/react-icons@5.5.0_react@18.3.1/node_modules/react-icons/lib/iconContext.mjs","size":251,"chunks":["a1ee98a"]},{"name":"../../node_modules/.pnpm/react-icons@5.5.0_react@18.3.1/node_modules/react-icons/lib/iconBase.mjs","size":4003,"chunks":["a1ee98a"]},{"name":"../../node_modules/.pnpm/react-icons@5.5.0_react@18.3.1/node_modules/react-icons/tb/index.mjs","size":708,"chunks":["a1ee98a"]},{"name":"./src/extensions/SuggestionMenu/getMultiColumnSlashMenuItems.tsx","size":2073,"chunks":["a1ee98a"]},{"name":"./src/index.ts","size":0,"chunks":["a1ee98a"]}]}
+{"builtAt":1744903044704,"assets":[{"name":"blocknote-xl-multi-column.cjs","size":20482},{"name":"blocknote-xl-multi-column.cjs.map","size":3791822}],"chunks":[{"id":"a1ee98a","entry":true,"initial":true,"files":["blocknote-xl-multi-column.cjs"],"names":["blocknote-xl-multi-column"]}],"modules":[{"name":"./src/i18n/locales/ar.ts","size":364,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/de.ts","size":400,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/en.ts","size":378,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/es.ts","size":392,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/fr.ts","size":398,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/hr.ts","size":396,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/is.ts","size":376,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/ja.ts","size":284,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/ko.ts","size":288,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/nl.ts","size":390,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/pl.ts","size":394,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/pt.ts","size":388,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/ru.ts","size":370,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/vi.ts","size":340,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/zh.ts","size":274,"chunks":["a1ee98a"]},{"name":"./src/i18n/locales/index.ts","size":0,"chunks":["a1ee98a"]},{"name":"./src/i18n/dictionary.ts","size":189,"chunks":["a1ee98a"]},{"name":"./src/extensions/ColumnResize/ColumnResizeExtension.ts","size":8309,"chunks":["a1ee98a"]},{"name":"./src/pm-nodes/Column.ts","size":2567,"chunks":["a1ee98a"]},{"name":"./src/pm-nodes/ColumnList.ts","size":1120,"chunks":["a1ee98a"]},{"name":"./src/blocks/Columns/index.ts","size":210,"chunks":["a1ee98a"]},{"name":"./src/blocks/schema.ts","size":425,"chunks":["a1ee98a"]},{"name":"./src/extensions/DropCursor/MultiColumnDropCursorPlugin.ts","size":11715,"chunks":["a1ee98a"]},{"name":"../../node_modules/.pnpm/react-icons@5.5.0_react@18.3.1/node_modules/react-icons/lib/iconContext.mjs","size":251,"chunks":["a1ee98a"]},{"name":"../../node_modules/.pnpm/react-icons@5.5.0_react@18.3.1/node_modules/react-icons/lib/iconBase.mjs","size":4003,"chunks":["a1ee98a"]},{"name":"../../node_modules/.pnpm/react-icons@5.5.0_react@18.3.1/node_modules/react-icons/tb/index.mjs","size":708,"chunks":["a1ee98a"]},{"name":"./src/extensions/SuggestionMenu/getMultiColumnSlashMenuItems.tsx","size":2073,"chunks":["a1ee98a"]},{"name":"./src/index.ts","size":0,"chunks":["a1ee98a"]}]}

package/package.json

@@ -9,7 +9,7 @@
     "directory": "packages/xl-multi-column"
   },
   "license": "AGPL-3.0 OR PROPRIETARY",
-  "version": "0.27.2",
+  "version": "0.29.0",
   "files": [
     "dist",
     "types",
@@ -42,15 +42,15 @@
     }
   },
   "dependencies": {
-    "@blocknote/core": "^0.27.2",
-    "@blocknote/react": "^0.27.2",
     "@tiptap/core": "^2.7.1",
     "prosemirror-model": "^1.23.0",
     "prosemirror-state": "^1.4.3",
     "prosemirror-tables": "^1.3.7",
     "prosemirror-transform": "^1.9.0",
     "prosemirror-view": "^1.38.1",
-    "react-icons": "^5.2.1"
+    "react-icons": "^5.2.1",
+    "@blocknote/core": "^0.29.0",
+    "@blocknote/react": "^0.29.0"
   },
   "devDependencies": {
     "@types/react": "^18.3.1",

package/src/extensions/DropCursor/MultiColumnDropCursorPlugin.ts

@@ -80,9 +80,7 @@ export function multiColumnDropCursor(
 
         const draggedBlock = nodeToBlock(
           slice.content.child(0),
-          editor.schema.blockSchema,
-          editor.schema.inlineContentSchema,
-          editor.schema.styleSchema
+          editor.pmSchema
           // TODO: cache?
         );
 
@@ -93,11 +91,9 @@ export function multiColumnDropCursor(
             .resolve(blockInfo.bnBlock.beforePos)
             .node();
 
-          const columnList = nodeToBlock(
+          const columnList = nodeToBlock<any, any, any>(
             parentBlock,
-            editor.schema.blockSchema,
-            editor.schema.inlineContentSchema,
-            editor.schema.styleSchema
+            editor.pmSchema
           );
 
           // In a `columnList`, we expect that the average width of each column
@@ -156,12 +152,7 @@ export function multiColumnDropCursor(
           });
         } else {
           // create new columnList with blocks as columns
-          const block = nodeToBlock(
-            blockInfo.bnBlock.node,
-            editor.schema.blockSchema,
-            editor.schema.inlineContentSchema,
-            editor.schema.styleSchema
-          );
+          const block = nodeToBlock(blockInfo.bnBlock.node, editor.pmSchema);
 
           // The user is dropping next to the original block being dragged - do
           // nothing.

package/src/i18n/locales/de.ts

@@ -6,13 +6,13 @@ export const de: MultiColumnDictionary = {
       title: "Zwei Spalten",
       subtext: "Zwei Spalten nebeneinander",
       aliases: ["Spalten", "Reihe", "teilen"],
-      group: "Grundlegende blöcke",
+      group: "Grundlegende Blöcke",
     },
     three_columns: {
       title: "Drei Spalten",
       subtext: "Drei Spalten nebeneinander",
       aliases: ["Spalten", "Reihe", "teilen"],
-      group: "Grundlegende blöcke",
+      group: "Grundlegende Blöcke",
     },
   },
 };

package/src/test/commands/updateBlock.test.ts

@@ -147,7 +147,7 @@ describe("Test updateBlock", () => {
     }).toThrow();
   });
 
-  it("Update paragraph to column", () => {
+  it.skip("Update paragraph to column", () => {
     getEditor().updateBlock("paragraph-0", {
       type: "column",
       children: [
@@ -161,7 +161,7 @@ describe("Test updateBlock", () => {
     expect(getEditor().document).toMatchSnapshot();
   });
 
-  it("Update nested paragraph to column", () => {
+  it.skip("Update nested paragraph to column", () => {
     getEditor().updateBlock("nested-paragraph-0", {
       type: "column",
       children: [

package/src/test/conversions/formatConversionTestUtil.ts

@@ -0,0 +1,197 @@
+import {
+  Block,
+  BlockNoteSchema,
+  BlockSchema,
+  InlineContent,
+  InlineContentSchema,
+  isPartialLinkInlineContent,
+  isStyledTextInlineContent,
+  PartialBlock,
+  PartialInlineContent,
+  PartialTableCell,
+  StyledText,
+  StyleSchema,
+  TableCell,
+  TableContent,
+  UniqueID,
+} from "@blocknote/core";
+
+function textShorthandToStyledText(
+  content: string | StyledText<any>[] = ""
+): StyledText<any>[] {
+  if (typeof content === "string") {
+    return [
+      {
+        type: "text",
+        text: content,
+        styles: {},
+      },
+    ];
+  }
+  return content;
+}
+
+function partialContentToInlineContent(
+  content:
+    | PartialInlineContent<any, any>
+    | PartialTableCell<any, any>
+    | TableContent<any>
+    | undefined
+):
+  | InlineContent<any, any>[]
+  | TableContent<any>
+  | TableCell<any, any>
+  | undefined {
+  if (typeof content === "string") {
+    return textShorthandToStyledText(content);
+  }
+
+  if (Array.isArray(content)) {
+    return content.flatMap((partialContent) => {
+      if (typeof partialContent === "string") {
+        return textShorthandToStyledText(partialContent);
+      } else if (isPartialLinkInlineContent(partialContent)) {
+        return {
+          ...partialContent,
+          content: textShorthandToStyledText(partialContent.content),
+        };
+      } else if (isStyledTextInlineContent(partialContent)) {
+        return partialContent;
+      } else {
+        // custom inline content
+
+        return {
+          props: {},
+          ...partialContent,
+          content: partialContentToInlineContent(partialContent.content),
+        } as any;
+      }
+    });
+  } else if (content?.type === "tableContent") {
+    return {
+      type: "tableContent",
+      columnWidths: content.columnWidths,
+      headerRows: content.headerRows,
+      headerCols: content.headerCols,
+      rows: content.rows.map((row) => ({
+        ...row,
+        cells: row.cells.map(
+          (cell) => partialContentToInlineContent(cell) as any
+        ),
+      })),
+    };
+  } else if (content?.type === "tableCell") {
+    return {
+      type: "tableCell",
+      content: partialContentToInlineContent(content.content) as any[],
+      props: {
+        backgroundColor: content.props?.backgroundColor ?? "default",
+        textColor: content.props?.textColor ?? "default",
+        textAlignment: content.props?.textAlignment ?? "left",
+        colspan: content.props?.colspan ?? 1,
+        rowspan: content.props?.rowspan ?? 1,
+      },
+    } satisfies TableCell<any, any>;
+  }
+
+  return content;
+}
+
+export function partialBlocksToBlocksForTesting<
+  BSchema extends BlockSchema,
+  I extends InlineContentSchema,
+  S extends StyleSchema
+>(
+  schema: BlockNoteSchema<BSchema, I, S>,
+  partialBlocks: Array<PartialBlock<NoInfer<BSchema>, NoInfer<I>, NoInfer<S>>>
+): Array<Block<BSchema, I, S>> {
+  return partialBlocks.map((partialBlock) =>
+    partialBlockToBlockForTesting(schema.blockSchema, partialBlock)
+  );
+}
+
+export function partialBlockToBlockForTesting<
+  BSchema extends BlockSchema,
+  I extends InlineContentSchema,
+  S extends StyleSchema
+>(
+  schema: BSchema,
+  partialBlock: PartialBlock<BSchema, I, S>
+): Block<BSchema, I, S> {
+  const contentType: "inline" | "table" | "none" =
+    schema[partialBlock.type!].content;
+
+  const withDefaults: Block<BSchema, I, S> = {
+    id: "",
+    type: partialBlock.type!,
+    props: {} as any,
+    content:
+      contentType === "inline"
+        ? []
+        : contentType === "table"
+        ? {
+            type: "tableContent",
+            columnWidths: undefined,
+            headerRows: undefined,
+            headerCols: undefined,
+            rows: [],
+          }
+        : (undefined as any),
+    children: [] as any,
+    ...partialBlock,
+  };
+
+  Object.entries(schema[partialBlock.type!].propSchema).forEach(
+    ([propKey, propValue]) => {
+      if (
+        withDefaults.props[propKey] === undefined &&
+        propValue.default !== undefined
+      ) {
+        (withDefaults.props as any)[propKey] = propValue.default;
+      }
+    }
+  );
+
+  if (contentType === "inline") {
+    const content = withDefaults.content as InlineContent<I, S>[] | undefined;
+    withDefaults.content = partialContentToInlineContent(content) as any;
+  } else if (contentType === "table") {
+    const content = withDefaults.content as TableContent<I, S> | undefined;
+    withDefaults.content = {
+      type: "tableContent",
+      columnWidths:
+        content?.columnWidths ||
+        content?.rows[0]?.cells.map(() => undefined) ||
+        [],
+      headerRows: content?.headerRows || undefined,
+      headerCols: content?.headerCols || undefined,
+      rows:
+        content?.rows.map((row) => ({
+          cells: row.cells.map((cell) => partialContentToInlineContent(cell)),
+        })) || [],
+    } as any;
+  }
+
+  return {
+    ...withDefaults,
+    content: partialContentToInlineContent(withDefaults.content),
+    children: withDefaults.children.map((c) => {
+      return partialBlockToBlockForTesting(schema, c);
+    }),
+  } as any;
+}
+
+export function addIdsToBlock(block: PartialBlock<any, any, any>) {
+  if (!block.id) {
+    block.id = UniqueID.options.generateID();
+  }
+  if (block.children) {
+    addIdsToBlocks(block.children);
+  }
+}
+
+export function addIdsToBlocks(blocks: PartialBlock<any, any, any>[]) {
+  for (const block of blocks) {
+    addIdsToBlock(block);
+  }
+}

package/src/test/conversions/htmlConversion.test.ts

@@ -6,13 +6,15 @@ import {
   InlineContentSchema,
   PartialBlock,
   StyleSchema,
-  addIdsToBlocks,
   createExternalHTMLExporter,
   createInternalHTMLSerializer,
-  partialBlocksToBlocksForTesting,
 } from "@blocknote/core";
 import { afterEach, beforeEach, describe, expect, it } from "vitest";
 
+import {
+  addIdsToBlocks,
+  partialBlocksToBlocksForTesting,
+} from "./formatConversionTestUtil.js";
 import { multiColumnSchemaTestCases } from "./testCases.js";
 
 // TODO: code same from @blocknote/core, maybe create separate test util package

package/src/test/conversions/nodeConversion.test.ts

@@ -6,9 +6,9 @@ import {
   UniqueID,
   blockToNode,
   nodeToBlock,
-  partialBlockToBlockForTesting,
 } from "@blocknote/core";
 
+import { partialBlockToBlockForTesting } from "./formatConversionTestUtil.js";
 import { multiColumnSchemaTestCases } from "./testCases.js";
 
 function addIdsToBlock(block: PartialBlock<any, any, any>) {
@@ -25,16 +25,11 @@ function validateConversion(
   editor: BlockNoteEditor<any, any, any>
 ) {
   addIdsToBlock(block);
-  const node = blockToNode(block, editor.pmSchema, editor.schema.styleSchema);
+  const node = blockToNode(block, editor.pmSchema);
 
   expect(node).toMatchSnapshot();
 
-  const outputBlock = nodeToBlock(
-    node,
-    editor.schema.blockSchema,
-    editor.schema.inlineContentSchema,
-    editor.schema.styleSchema
-  );
+  const outputBlock = nodeToBlock(node, editor.pmSchema);
 
   const fullOriginalBlock = partialBlockToBlockForTesting(
     editor.schema.blockSchema,

package/src/test/conversions/testCases.ts

@@ -1,12 +1,9 @@
-import { BlockNoteEditor, EditorTestCases } from "@blocknote/core";
+import { BlockNoteEditor } from "@blocknote/core";
 
 import { testEditorSchema } from "../setupTestEnv.js";
 
-export const multiColumnSchemaTestCases: EditorTestCases<
-  typeof testEditorSchema.blockSchema,
-  typeof testEditorSchema.inlineContentSchema,
-  typeof testEditorSchema.styleSchema
-> = {
+// TODO
+export const multiColumnSchemaTestCases: any = {
   name: "multi-column-schema",
   createEditor: () => {
     return BlockNoteEditor.create({

package/types/src/test/conversions/formatConversionTestUtil.d.ts

@@ -0,0 +1,5 @@
+import { Block, BlockNoteSchema, BlockSchema, InlineContentSchema, PartialBlock, StyleSchema } from "@blocknote/core";
+export declare function partialBlocksToBlocksForTesting<BSchema extends BlockSchema, I extends InlineContentSchema, S extends StyleSchema>(schema: BlockNoteSchema<BSchema, I, S>, partialBlocks: Array<PartialBlock<NoInfer<BSchema>, NoInfer<I>, NoInfer<S>>>): Array<Block<BSchema, I, S>>;
+export declare function partialBlockToBlockForTesting<BSchema extends BlockSchema, I extends InlineContentSchema, S extends StyleSchema>(schema: BSchema, partialBlock: PartialBlock<BSchema, I, S>): Block<BSchema, I, S>;
+export declare function addIdsToBlock(block: PartialBlock<any, any, any>): void;
+export declare function addIdsToBlocks(blocks: PartialBlock<any, any, any>[]): void;

package/types/src/test/conversions/testCases.d.ts

@@ -1,3 +1 @@
-import { EditorTestCases } from "@blocknote/core";
-import { testEditorSchema } from "../setupTestEnv.js";
-export declare const multiColumnSchemaTestCases: EditorTestCases<typeof testEditorSchema.blockSchema, typeof testEditorSchema.inlineContentSchema, typeof testEditorSchema.styleSchema>;
+export declare const multiColumnSchemaTestCases: any;