@blocknote/core 0.2.2-alpha.0 → 0.2.3

package/types/src/extensions/DraggableBlocks/BlockSideMenuFactoryTypes.d.ts

@@ -1,5 +1,5 @@
 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-export declare type BlockSideMenuStaticParams = {
+export type BlockSideMenuStaticParams = {
     addBlock: () => void;
     deleteBlock: () => void;
     blockDragStart: (event: DragEvent) => void;
@@ -7,8 +7,8 @@ export declare type BlockSideMenuStaticParams = {
     freezeMenu: () => void;
     unfreezeMenu: () => void;
 };
-export declare type BlockSideMenuDynamicParams = {
-    blockBoundingBox: DOMRect;
+export type BlockSideMenuDynamicParams = {
+    referenceRect: DOMRect;
 };
-export declare type BlockSideMenu = EditorElement<BlockSideMenuDynamicParams>;
-export declare type BlockSideMenuFactory = ElementFactory<BlockSideMenuStaticParams, BlockSideMenuDynamicParams>;
+export type BlockSideMenu = EditorElement<BlockSideMenuDynamicParams>;
+export type BlockSideMenuFactory = ElementFactory<BlockSideMenuStaticParams, BlockSideMenuDynamicParams>;

package/types/src/extensions/DraggableBlocks/DraggableBlocksExtension.d.ts

@@ -1,6 +1,6 @@
 import { Editor, Extension } from "@tiptap/core";
 import { BlockSideMenuFactory } from "./BlockSideMenuFactoryTypes";
-export declare type DraggableBlocksOptions = {
+export type DraggableBlocksOptions = {
     editor: Editor;
     blockSideMenuFactory: BlockSideMenuFactory;
 };

package/types/src/extensions/DraggableBlocks/DraggableBlocksPlugin.d.ts

@@ -1,7 +1,7 @@
 import { Editor } from "@tiptap/core";
 import { Plugin } from "prosemirror-state";
-import { DraggableBlocksOptions } from "./DraggableBlocksExtension";
 import { BlockSideMenu, BlockSideMenuDynamicParams, BlockSideMenuFactory, BlockSideMenuStaticParams } from "./BlockSideMenuFactoryTypes";
+import { DraggableBlocksOptions } from "./DraggableBlocksExtension";
 export declare function createRect(rect: DOMRect): {
     left: number;
     top: number;
@@ -18,7 +18,7 @@ export declare function absoluteRect(element: HTMLElement): {
     bottom: number;
     right: number;
 };
-export declare type BlockMenuViewProps = {
+export type BlockMenuViewProps = {
     editor: Editor;
     blockMenuFactory: BlockSideMenuFactory;
     horizontalPosAnchoredAtRoot: boolean;

package/types/src/extensions/DraggableBlocks/MultipleNodeSelection.d.ts

@@ -0,0 +1,24 @@
+import { Selection } from "prosemirror-state";
+import { Node, ResolvedPos, Slice } from "prosemirror-model";
+import { Mappable } from "prosemirror-transform";
+/**
+ * This class represents an editor selection which spans multiple nodes/blocks. It's currently only used to allow users
+ * to drag multiple blocks at the same time. Expects the selection anchor and head to be between nodes, i.e. just before
+ * the first target node and just after the last, and that anchor and head are at the same nesting level.
+ *
+ * Partially based on ProseMirror's NodeSelection implementation:
+ * (https://github.com/ProseMirror/prosemirror-state/blob/master/src/selection.ts)
+ * MultipleNodeSelection differs from NodeSelection in the following ways:
+ * 1. Stores which nodes are included in the selection instead of just a single node.
+ * 2. Already expects the selection to start just before the first target node and ends just after the last, while a
+ * NodeSelection automatically sets both anchor and head to just before the single target node.
+ */
+export declare class MultipleNodeSelection extends Selection {
+    nodes: Array<Node>;
+    constructor($anchor: ResolvedPos, $head: ResolvedPos);
+    static create(doc: Node, from: number, to?: number): MultipleNodeSelection;
+    content(): Slice;
+    eq(selection: Selection): boolean;
+    map(doc: Node, mapping: Mappable): Selection;
+    toJSON(): any;
+}

package/types/src/extensions/FormattingToolbar/FormattingToolbarFactoryTypes.d.ts

@@ -1,14 +1,14 @@
 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-import { BlockContentType } from "../Blocks/nodes/Block";
-export declare type FormattingToolbarStaticParams = {
+import { Block, BlockUpdate } from "../Blocks/apiTypes";
+export type FormattingToolbarStaticParams = {
     toggleBold: () => void;
     toggleItalic: () => void;
     toggleUnderline: () => void;
     toggleStrike: () => void;
     setHyperlink: (url: string, text?: string) => void;
-    setBlockType: (type: BlockContentType) => void;
+    updateBlock: (blockUpdate: BlockUpdate) => void;
 };
-export declare type FormattingToolbarDynamicParams = {
+export type FormattingToolbarDynamicParams = {
     boldIsActive: boolean;
     italicIsActive: boolean;
     underlineIsActive: boolean;
@@ -16,8 +16,8 @@ export declare type FormattingToolbarDynamicParams = {
     hyperlinkIsActive: boolean;
     activeHyperlinkUrl: string;
     activeHyperlinkText: string;
-    activeBlockType: Required<BlockContentType>;
-    selectionBoundingBox: DOMRect;
+    block: Block;
+    referenceRect: DOMRect;
 };
-export declare type FormattingToolbar = EditorElement<FormattingToolbarDynamicParams>;
-export declare type FormattingToolbarFactory = ElementFactory<FormattingToolbarStaticParams, FormattingToolbarDynamicParams>;
+export type FormattingToolbar = EditorElement<FormattingToolbarDynamicParams>;
+export type FormattingToolbarFactory = ElementFactory<FormattingToolbarStaticParams, FormattingToolbarDynamicParams>;

package/types/src/extensions/FormattingToolbar/FormattingToolbarPlugin.d.ts

@@ -15,7 +15,7 @@ export interface FormattingToolbarPluginProps {
         to: number;
     }) => boolean) | null;
 }
-export declare type FormattingToolbarViewProps = FormattingToolbarPluginProps & {
+export type FormattingToolbarViewProps = FormattingToolbarPluginProps & {
     view: EditorView;
 };
 export declare class FormattingToolbarView {

package/types/src/extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes.d.ts

@@ -1,12 +1,12 @@
 import { EditorElement, ElementFactory } from "../../shared/EditorElement";
-export declare type HyperlinkToolbarStaticParams = {
+export type HyperlinkToolbarStaticParams = {
     editHyperlink: (url: string, text: string) => void;
     deleteHyperlink: () => void;
 };
-export declare type HyperlinkToolbarDynamicParams = {
+export type HyperlinkToolbarDynamicParams = {
     url: string;
     text: string;
-    boundingBox: DOMRect;
+    referenceRect: DOMRect;
 };
-export declare type HyperlinkToolbar = EditorElement<HyperlinkToolbarDynamicParams>;
-export declare type HyperlinkToolbarFactory = ElementFactory<HyperlinkToolbarStaticParams, HyperlinkToolbarDynamicParams>;
+export type HyperlinkToolbar = EditorElement<HyperlinkToolbarDynamicParams>;
+export type HyperlinkToolbarFactory = ElementFactory<HyperlinkToolbarStaticParams, HyperlinkToolbarDynamicParams>;

package/types/src/extensions/HyperlinkToolbar/HyperlinkToolbarPlugin.d.ts

@@ -1,10 +1,10 @@
 import { Editor } from "@tiptap/core";
 import { Plugin } from "prosemirror-state";
 import { HyperlinkToolbarFactory } from "./HyperlinkToolbarFactoryTypes";
-export declare type HyperlinkToolbarPluginProps = {
+export type HyperlinkToolbarPluginProps = {
     hyperlinkToolbarFactory: HyperlinkToolbarFactory;
 };
-export declare type HyperlinkToolbarViewProps = {
+export type HyperlinkToolbarViewProps = {
     editor: Editor;
     hyperlinkToolbarFactory: HyperlinkToolbarFactory;
 };

package/types/src/extensions/SlashMenu/SlashMenuExtension.d.ts

@@ -2,7 +2,7 @@ import { Extension } from "@tiptap/core";
 import { PluginKey } from "prosemirror-state";
 import { SuggestionsMenuFactory } from "../../shared/plugins/suggestion/SuggestionsMenuFactoryTypes";
 import { SlashMenuItem } from "./SlashMenuItem";
-export declare type SlashMenuOptions = {
+export type SlashMenuOptions = {
     commands: {
         [key: string]: SlashMenuItem;
     };

package/types/src/extensions/SlashMenu/SlashMenuItem.d.ts

@@ -1,6 +1,6 @@
 import { Editor, Range } from "@tiptap/core";
 import { SuggestionItem } from "../../shared/plugins/suggestion/SuggestionItem";
-export declare type SlashMenuCallback = (editor: Editor, range: Range) => boolean;
+export type SlashMenuCallback = (editor: Editor, range: Range) => boolean;
 export declare enum SlashMenuGroups {
     HEADINGS = "Headings",
     BASIC_BLOCKS = "Basic Blocks",

package/types/src/index.d.ts

@@ -1,9 +1,10 @@
 export * from "./BlockNoteEditor";
 export * from "./BlockNoteExtensions";
-export type { BlockContentType } from "./extensions/Blocks/nodes/Block";
+export type { Block, BlockUpdate } from "./extensions/Blocks/apiTypes";
 export * from "./extensions/FormattingToolbar/FormattingToolbarFactoryTypes";
 export * from "./extensions/DraggableBlocks/BlockSideMenuFactoryTypes";
 export * from "./extensions/HyperlinkToolbar/HyperlinkToolbarFactoryTypes";
 export * from "./extensions/SlashMenu/SlashMenuItem";
+export * from "./shared/EditorElement";
 export type { SuggestionItem } from "./shared/plugins/suggestion/SuggestionItem";
 export * from "./shared/plugins/suggestion/SuggestionsMenuFactoryTypes";

package/types/src/shared/EditorElement.d.ts

@@ -1,6 +1,10 @@
-export declare type EditorElement<ElementDynamicParams extends Record<string, any>> = {
+export type RequiredStaticParams = Record<string, any>;
+export type RequiredDynamicParams = Record<string, any> & {
+    referenceRect: DOMRect;
+};
+export type EditorElement<ElementDynamicParams extends RequiredDynamicParams> = {
     element: HTMLElement | undefined;
     render: (params: ElementDynamicParams, isHidden: boolean) => void;
     hide: () => void;
 };
-export declare type ElementFactory<ElementStaticParams extends Record<string, any>, ElementDynamicParams extends Record<string, any>> = (staticParams: ElementStaticParams) => EditorElement<ElementDynamicParams>;
+export type ElementFactory<ElementStaticParams extends RequiredStaticParams, ElementDynamicParams extends RequiredDynamicParams> = (staticParams: ElementStaticParams) => EditorElement<ElementDynamicParams>;

package/types/src/shared/plugins/suggestion/SuggestionPlugin.d.ts

@@ -2,7 +2,7 @@ import { Editor, Range } from "@tiptap/core";
 import { Plugin, PluginKey, Selection } from "prosemirror-state";
 import { SuggestionsMenuFactory } from "./SuggestionsMenuFactoryTypes";
 import { SuggestionItem } from "./SuggestionItem";
-export declare type SuggestionPluginOptions<T extends SuggestionItem> = {
+export type SuggestionPluginOptions<T extends SuggestionItem> = {
     /**
      * The name of the plugin.
      *
@@ -39,7 +39,7 @@ export declare type SuggestionPluginOptions<T extends SuggestionItem> = {
         range: Range;
     }) => boolean;
 };
-declare type SuggestionPluginState<T extends SuggestionItem> = {
+type SuggestionPluginState<T extends SuggestionItem> = {
     active: boolean;
     range: Range | null;
     query: string | null;
@@ -49,7 +49,7 @@ declare type SuggestionPluginState<T extends SuggestionItem> = {
     type: string;
     decorationId: string | null;
 };
-export declare type MenuType = "slash" | "drag";
+export type MenuType = "slash" | "drag";
 /**
  * Finds a command: a specified character (e.g. '/') followed by a string of characters (all characters except the specified character are allowed).
  * Returns the string following the specified character or undefined if no command was found.

package/types/src/shared/plugins/suggestion/SuggestionsMenuFactoryTypes.d.ts

@@ -1,12 +1,12 @@
 import { EditorElement, ElementFactory } from "../../EditorElement";
 import { SuggestionItem } from "./SuggestionItem";
-export declare type SuggestionsMenuStaticParams<T extends SuggestionItem> = {
+export type SuggestionsMenuStaticParams<T extends SuggestionItem> = {
     itemCallback: (item: T) => void;
 };
-export declare type SuggestionsMenuDynamicParams<T extends SuggestionItem> = {
+export type SuggestionsMenuDynamicParams<T extends SuggestionItem> = {
     items: T[];
     selectedItemIndex: number;
-    queryStartBoundingBox: DOMRect;
+    referenceRect: DOMRect;
 };
-export declare type SuggestionsMenu<T extends SuggestionItem> = EditorElement<SuggestionsMenuDynamicParams<T>>;
-export declare type SuggestionsMenuFactory<T extends SuggestionItem> = ElementFactory<SuggestionsMenuStaticParams<T>, SuggestionsMenuDynamicParams<T>>;
+export type SuggestionsMenu<T extends SuggestionItem> = EditorElement<SuggestionsMenuDynamicParams<T>>;
+export type SuggestionsMenuFactory<T extends SuggestionItem> = ElementFactory<SuggestionsMenuStaticParams<T>, SuggestionsMenuDynamicParams<T>>;

package/src/extensions/Blocks/nodes/BlockTypes/ListItemBlock/ListItemContent.ts

@@ -1,177 +0,0 @@
-import { InputRule, mergeAttributes, Node } from "@tiptap/core";
-import { OrderedListItemIndexPlugin } from "./OrderedListItemIndexPlugin";
-import { getBlockInfoFromPos } from "../../../helpers/getBlockInfoFromPos";
-import styles from "../../Block.module.css";
-
-export type ListItemContentType = {
-  name: "listItemContent";
-  attrs?: {
-    listItemType: string;
-  };
-};
-
-export const ListItemContent = Node.create({
-  name: "listItemContent",
-  group: "blockContent",
-  content: "inline*",
-
-  addAttributes() {
-    return {
-      listItemType: {
-        default: "unordered",
-        parseHTML: (element) => element.getAttribute("data-list-item-type"),
-        renderHTML: (attributes) => {
-          return {
-            "data-list-item-type": attributes.listItemType,
-          };
-        },
-      },
-      listItemIndex: {
-        default: null,
-        parseHTML: (element) => element.getAttribute("data-list-item-index"),
-        renderHTML: (attributes) => {
-          return {
-            "data-list-item-index": attributes.listItemIndex,
-          };
-        },
-      },
-    };
-  },
-
-  addInputRules() {
-    return [
-      // Creates an unordered list when starting with "-", "+", or "*".
-      new InputRule({
-        find: new RegExp(`^[-+*]\\s$`),
-        handler: ({ state, chain, range }) => {
-          chain()
-            .BNSetContentType(state.selection.from, {
-              name: "listItemContent",
-              attrs: {
-                listItemType: "unordered",
-              },
-            })
-            // Removes the "-", "+", or "*" character used to set the list.
-            .deleteRange({ from: range.from, to: range.to });
-        },
-      }),
-      // Creates an ordered list when starting with "1.".
-      new InputRule({
-        find: new RegExp(`^1\\.\\s$`),
-        handler: ({ state, chain, range }) => {
-          chain()
-            .BNSetContentType(state.selection.from, {
-              name: "listItemContent",
-              attrs: {
-                listItemType: "ordered",
-              },
-            })
-            // Removes the "1." characters used to set the list.
-            .deleteRange({ from: range.from, to: range.to });
-        },
-      }),
-    ];
-  },
-
-  addKeyboardShortcuts() {
-    const handleEnter = () => {
-      const { node, contentType } = getBlockInfoFromPos(
-        this.editor.state.doc,
-        this.editor.state.selection.from
-      )!;
-
-      const selectionEmpty =
-        this.editor.state.selection.anchor === this.editor.state.selection.head;
-
-      if (contentType.name !== "listItemContent" || !selectionEmpty) {
-        return false;
-      }
-
-      return this.editor.commands.first(({ state, chain, commands }) => [
-        () =>
-          // Changes list item block to a text block if both the content is empty.
-          commands.command(() => {
-            if (node.textContent.length === 0) {
-              return commands.BNSetContentType(state.selection.from, {
-                name: "textContent",
-              });
-            }
-
-            return false;
-          }),
-
-        () =>
-          // Splits the current block, moving content inside that's after the cursor to a new block of the same type
-          // below.
-          commands.command(() => {
-            if (node.textContent.length > 0) {
-              chain()
-                .deleteSelection()
-                .BNSplitBlock(state.selection.from, true)
-                .run();
-
-              return true;
-            }
-
-            return false;
-          }),
-      ]);
-    };
-
-    return {
-      Enter: handleEnter,
-    };
-  },
-
-  addProseMirrorPlugins() {
-    return [OrderedListItemIndexPlugin()];
-  },
-
-  parseHTML() {
-    return [
-      {
-        tag: "li",
-        getAttrs: (element) => {
-          if (typeof element === "string") {
-            return false;
-          }
-
-          const parent = element.parentElement;
-
-          if (parent === null) {
-            return false;
-          }
-
-          // Case for BlockNote list structure.
-          // Gets type of list item (ordered/unordered) based on the block content's listItemType attribute.
-          if (parent.getAttribute("data-content-type") === "listItemContent") {
-            return { listItemType: parent.getAttribute("data-list-item-type") };
-          }
-
-          // Case for regular HTML list structure.
-          // Gets type of list item (ordered/unordered) based on parent element's tag ("ol"/"ul").
-          if (parent.tagName === "UL") {
-            return { listItemType: "unordered" };
-          }
-          if (parent.tagName === "OL") {
-            return { listItemType: "ordered" };
-          }
-
-          return false;
-        },
-        node: "block",
-      },
-    ];
-  },
-
-  renderHTML({ HTMLAttributes }) {
-    return [
-      "div",
-      mergeAttributes(HTMLAttributes, {
-        class: styles.blockContent,
-        "data-content-type": this.name,
-      }),
-      ["li", 0],
-    ];
-  },
-});

package/src/extensions/Paragraph/FixedParagraph.ts

@@ -1,12 +0,0 @@
-import Paragraph from "@tiptap/extension-paragraph";
-
-// Override paragraph to disable "Mod-Alt-0" shortcut throw invalid content for doc type error
-export const FixedParagraph = Paragraph.extend({
-  addKeyboardShortcuts: () => {
-    return {
-      "Mod-Alt-0": () => {
-        return false;
-      },
-    };
-  },
-});