@blocknote/core 0.36.0 → 0.36.1

package/src/blocks/TableBlockContent/TableBlockContent.ts

@@ -34,8 +34,8 @@ export const TableBlockContent = createStronglyTypedTiptapNode({
     ];
   },
 
-  renderHTML({ HTMLAttributes }) {
-    return createDefaultBlockDOMOutputSpec(
+  renderHTML({ node, HTMLAttributes }) {
+    const domOutputSpec = createDefaultBlockDOMOutputSpec(
       this.name,
       "table",
       {
@@ -44,6 +44,30 @@ export const TableBlockContent = createStronglyTypedTiptapNode({
       },
       this.options.domAttributes?.inlineContent || {},
     );
+
+    // Need to manually add colgroup element
+    const colGroup = document.createElement("colgroup");
+    for (const tableCell of node.children[0].children) {
+      const colWidths: null | (number | undefined)[] =
+        tableCell.attrs["colwidth"];
+
+      if (colWidths) {
+        for (const colWidth of tableCell.attrs["colwidth"]) {
+          const col = document.createElement("col");
+          if (colWidth) {
+            col.style = `width: ${colWidth}px`;
+          }
+
+          colGroup.appendChild(col);
+        }
+      } else {
+        colGroup.appendChild(document.createElement("col"));
+      }
+    }
+
+    domOutputSpec.dom.firstChild?.appendChild(colGroup);
+
+    return domOutputSpec;
   },
 
   // This node view is needed for the `columnResizing` plugin. By default, the
@@ -146,8 +170,11 @@ const TableParagraph = createStronglyTypedTiptapNode({
     ];
   },
 
-  renderHTML({ HTMLAttributes }) {
-    return ["p", HTMLAttributes, 0];
+  renderHTML({ node, HTMLAttributes }) {
+    // Insert a line break if there is no content, in order to preserve the
+    // correct cell height. Otherwise, the cell will have a height of zero +
+    // padding.
+    return ["p", HTMLAttributes, node.childCount ? 0 : ["br"]];
   },
 });
 

package/src/editor/BlockNoteEditor.ts

@@ -110,7 +110,7 @@ import { docToBlocks } from "../api/nodeConversions/nodeToBlock.js";
 import {
   BlocksChanged,
   getBlocksChangedByTransaction,
-} from "../api/nodeUtil.js";
+} from "../api/getBlocksChangedByTransaction.js";
 import { nestedListsToBlockNoteStructure } from "../api/parsers/html/util/nestedLists.js";
 import { CodeBlockOptions } from "../blocks/CodeBlockContent/CodeBlockContent.js";
 import type { ThreadStore, User } from "../comments/index.js";

package/src/extensions/BlockChange/BlockChangePlugin.ts

@@ -1,7 +1,9 @@
 import { Plugin, Transaction } from "prosemirror-state";
-import { getBlocksChangedByTransaction } from "../../api/nodeUtil.js";
+import {
+  BlocksChanged,
+  getBlocksChangedByTransaction,
+} from "../../api/getBlocksChangedByTransaction.js";
 import { BlockNoteExtension } from "../../editor/BlockNoteExtension.js";
-import { BlocksChanged } from "../../index.js";
 
 /**
  * This plugin can filter transactions before they are applied to the editor, but with a higher-level API than `filterTransaction` from prosemirror.

package/src/extensions/FormattingToolbar/FormattingToolbarPlugin.ts

@@ -211,11 +211,7 @@ export class FormattingToolbarView implements PluginView {
       // content causes the formatting toolbar to be in the wrong place. We
       // know the component has not yet rendered if the reference position has
       // zero dimensions.
-      if (
-        newReferencePos.x === 0 ||
-        newReferencePos.y === 0 ||
-        newReferencePos.height === 0
-      ) {
+      if (newReferencePos.height === 0 && newReferencePos.width === 0) {
         // Updates the reference position again following the render.
         queueMicrotask(() => {
           const nextState = {

package/src/index.ts

@@ -4,6 +4,7 @@ export * from "./api/blockManipulation/commands/updateBlock/updateBlock.js";
 export * from "./api/exporters/html/externalHTMLExporter.js";
 export * from "./api/exporters/html/internalHTMLSerializer.js";
 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";

package/types/src/api/getBlocksChangedByTransaction.d.ts

@@ -0,0 +1,63 @@
+import type { Transaction } from "prosemirror-state";
+import { Block, DefaultBlockSchema, DefaultInlineContentSchema, DefaultStyleSchema } from "../blocks/defaultBlocks.js";
+import type { BlockSchema } from "../schema/index.js";
+import type { InlineContentSchema } from "../schema/inlineContent/types.js";
+import type { StyleSchema } from "../schema/styles/types.js";
+/**
+ * This attributes the changes to a specific source.
+ */
+export type BlockChangeSource = {
+    type: "local";
+} | {
+    type: "paste";
+} | {
+    type: "drop";
+} | {
+    type: "undo" | "redo" | "undo-redo";
+} | {
+    type: "yjs-remote";
+};
+export type BlocksChanged<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema> = Array<{
+    /**
+     * The affected block.
+     */
+    block: Block<BSchema, ISchema, SSchema>;
+    /**
+     * The source of the change.
+     */
+    source: BlockChangeSource;
+} & ({
+    type: "insert" | "delete";
+    /**
+     * Insert and delete changes don't have a previous block.
+     */
+    prevBlock: undefined;
+} | {
+    type: "update";
+    /**
+     * The previous block.
+     */
+    prevBlock: Block<BSchema, ISchema, SSchema>;
+} | {
+    type: "move";
+    /**
+     * The affected block.
+     */
+    block: Block<BSchema, ISchema, SSchema>;
+    /**
+     * The block before the move.
+     */
+    prevBlock: Block<BSchema, ISchema, SSchema>;
+    /**
+     * The previous parent block (if it existed).
+     */
+    prevParent?: Block<BSchema, ISchema, SSchema>;
+    /**
+     * The current parent block (if it exists).
+     */
+    currentParent?: Block<BSchema, ISchema, SSchema>;
+})>;
+/**
+ * Get the blocks that were changed by a transaction.
+ */
+export declare function getBlocksChangedByTransaction<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema>(transaction: Transaction, appendedTransactions?: Transaction[]): BlocksChanged<BSchema, ISchema, SSchema>;

package/types/src/api/nodeUtil.d.ts

@@ -1,9 +1,4 @@
 import type { Node } from "prosemirror-model";
-import type { Transaction } from "prosemirror-state";
-import { Block, DefaultBlockSchema, DefaultInlineContentSchema, DefaultStyleSchema } from "../blocks/defaultBlocks.js";
-import type { BlockSchema } from "../schema/index.js";
-import type { InlineContentSchema } from "../schema/inlineContent/types.js";
-import type { StyleSchema } from "../schema/styles/types.js";
 /**
  * Get a TipTap node by id
  */
@@ -12,61 +7,3 @@ export declare function getNodeById(id: string, doc: Node): {
     posBeforeNode: number;
 } | undefined;
 export declare function isNodeBlock(node: Node): boolean;
-/**
- * This attributes the changes to a specific source.
- */
-export type BlockChangeSource = {
-    type: "local";
-} | {
-    type: "paste";
-} | {
-    type: "drop";
-} | {
-    type: "undo" | "redo" | "undo-redo";
-} | {
-    type: "yjs-remote";
-};
-export type BlocksChanged<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema> = Array<{
-    /**
-     * The affected block.
-     */
-    block: Block<BSchema, ISchema, SSchema>;
-    /**
-     * The source of the change.
-     */
-    source: BlockChangeSource;
-} & ({
-    type: "insert" | "delete";
-    /**
-     * Insert and delete changes don't have a previous block.
-     */
-    prevBlock: undefined;
-} | {
-    type: "update";
-    /**
-     * The previous block.
-     */
-    prevBlock: Block<BSchema, ISchema, SSchema>;
-} | {
-    type: "move";
-    /**
-     * The affected block.
-     */
-    block: Block<BSchema, ISchema, SSchema>;
-    /**
-     * The block before the move.
-     */
-    prevBlock: Block<BSchema, ISchema, SSchema>;
-    /**
-     * The previous parent block (if it existed).
-     */
-    prevParent?: Block<BSchema, ISchema, SSchema>;
-    /**
-     * The current parent block (if it exists).
-     */
-    currentParent?: Block<BSchema, ISchema, SSchema>;
-})>;
-/**
- * Get the blocks that were changed by a transaction.
- */
-export declare function getBlocksChangedByTransaction<BSchema extends BlockSchema = DefaultBlockSchema, ISchema extends InlineContentSchema = DefaultInlineContentSchema, SSchema extends StyleSchema = DefaultStyleSchema>(transaction: Transaction, appendedTransactions?: Transaction[]): BlocksChanged<BSchema, ISchema, SSchema>;

package/types/src/editor/BlockNoteEditor.d.ts

@@ -18,7 +18,7 @@ import { BlockNoteTipTapEditor } from "./BlockNoteTipTapEditor.js";
 import { Dictionary } from "../i18n/dictionary.js";
 import { type Command, type Plugin, type Transaction } from "@tiptap/pm/state";
 import { EditorView } from "prosemirror-view";
-import { BlocksChanged } from "../api/nodeUtil.js";
+import { BlocksChanged } from "../api/getBlocksChangedByTransaction.js";
 import { CodeBlockOptions } from "../blocks/CodeBlockContent/CodeBlockContent.js";
 import type { ThreadStore, User } from "../comments/index.js";
 import type { ForkYDocPlugin } from "../extensions/Collaboration/ForkYDocPlugin.js";

package/types/src/extensions/BlockChange/BlockChangePlugin.d.ts

@@ -1,6 +1,6 @@
 import { Transaction } from "prosemirror-state";
+import { BlocksChanged } from "../../api/getBlocksChangedByTransaction.js";
 import { BlockNoteExtension } from "../../editor/BlockNoteExtension.js";
-import { BlocksChanged } from "../../index.js";
 /**
  * This plugin can filter transactions before they are applied to the editor, but with a higher-level API than `filterTransaction` from prosemirror.
  */

package/types/src/extensions/TableHandles/TableHandlesPlugin.d.ts

@@ -138,9 +138,9 @@ export declare class TableHandlesProsemirrorPlugin<I extends InlineContentSchema
      */
     getMergeDirection: (block: BlockFromConfigNoChildren<DefaultBlockSchema["table"], any, any> | undefined) => "vertical" | "horizontal" | undefined;
     cropEmptyRowsOrColumns: (block: BlockFromConfigNoChildren<DefaultBlockSchema["table"], any, any>, removeEmpty: "columns" | "rows") => {
-        cells: (import("../../index.js").CustomInlineContentFromConfig<any, any> | import("../../index.js").StyledText<any> | import("../../index.js").Link<any>)[][] | import("../../index.js").TableCell<any, any>[];
+        cells: (import("../../index.js").StyledText<any> | import("../../index.js").Link<any> | import("../../index.js").CustomInlineContentFromConfig<any, any>)[][] | import("../../index.js").TableCell<any, any>[];
     }[];
     addRowsOrColumns: (block: BlockFromConfigNoChildren<DefaultBlockSchema["table"], any, any>, addType: "columns" | "rows", numToAdd: number) => {
-        cells: (import("../../index.js").CustomInlineContentFromConfig<any, any> | import("../../index.js").StyledText<any> | import("../../index.js").Link<any>)[][] | import("../../index.js").TableCell<any, any>[];
+        cells: (import("../../index.js").StyledText<any> | import("../../index.js").Link<any> | import("../../index.js").CustomInlineContentFromConfig<any, any>)[][] | import("../../index.js").TableCell<any, any>[];
     }[];
 }

package/types/src/index.d.ts

@@ -4,6 +4,7 @@ export * from "./api/blockManipulation/commands/updateBlock/updateBlock.js";
 export * from "./api/exporters/html/externalHTMLExporter.js";
 export * from "./api/exporters/html/internalHTMLSerializer.js";
 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";

package/types/src/schema/inlineContent/internal.d.ts

@@ -19,7 +19,7 @@ export declare function createInlineContentSpecFromTipTapNode<T extends Node, P
     config: {
         type: T["name"];
         propSchema: P;
-        content: "styled" | "none";
+        content: "none" | "styled";
     };
     implementation: {
         node: Node;