@blocknote/core 0.18.0 → 0.19.0

package/src/exporter/mapping.ts

@@ -0,0 +1,75 @@
+import { BlockNoteSchema } from "../editor/BlockNoteSchema.js";
+import {
+  BlockFromConfigNoChildren,
+  BlockSchema,
+  InlineContentFromConfig,
+  InlineContentSchema,
+  StyleSchema,
+  Styles,
+} from "../schema/index.js";
+import type { Exporter } from "./Exporter.js";
+
+/**
+ * Defines a mapping from all block types with a schema to a result type `R`.
+ */
+export type BlockMapping<
+  B extends BlockSchema,
+  I extends InlineContentSchema,
+  S extends StyleSchema,
+  RB,
+  RI
+> = {
+  [K in keyof B]: (
+    block: BlockFromConfigNoChildren<B[K], I, S>,
+    // we don't know the exact types that are supported by the exporter at this point,
+    // because the mapping only knows about converting certain types (which might be a subset of the supported types)
+    // this is why there are many `any` types here (same for types below)
+    exporter: Exporter<any, any, any, RB, RI, any, any>,
+    nestingLevel: number,
+    numberedListIndex?: number
+  ) => RB | Promise<RB>;
+};
+
+/**
+ * Defines a mapping from all inline content types with a schema to a result type R.
+ */
+export type InlineContentMapping<
+  I extends InlineContentSchema,
+  S extends StyleSchema,
+  RI,
+  TS
+> = {
+  [K in keyof I]: (
+    inlineContent: InlineContentFromConfig<I[K], S>,
+    exporter: Exporter<any, I, S, any, RI, any, TS>
+  ) => RI;
+};
+
+/**
+ * Defines a mapping from all style types with a schema to a result type R.
+ */
+export type StyleMapping<S extends StyleSchema, RS> = {
+  [K in keyof S]: (
+    style: Styles<S>[K],
+    exporter: Exporter<any, any, any, any, any, RS, any>
+  ) => RS;
+};
+
+/**
+ * The mapping factory is a utility function to easily create mappings for
+ * a BlockNoteSchema. Using the factory makes it easier to get typescript code completion etc.
+ */
+export function mappingFactory<
+  B extends BlockSchema,
+  I extends InlineContentSchema,
+  S extends StyleSchema
+>(_schema: BlockNoteSchema<B, I, S>) {
+  return {
+    createBlockMapping: <R, RI>(mapping: BlockMapping<B, I, S, R, RI>) =>
+      mapping,
+    createInlineContentMapping: <R, RS>(
+      mapping: InlineContentMapping<I, S, R, RS>
+    ) => mapping,
+    createStyleMapping: <R>(mapping: StyleMapping<S, R>) => mapping,
+  };
+}

package/src/extensions/KeyboardShortcuts/KeyboardShortcutsExtension.ts

@@ -1,16 +1,17 @@
 import { Extension } from "@tiptap/core";
 
 import { TextSelection } from "prosemirror-state";
+import { ReplaceAroundStep } from "prosemirror-transform";
 import {
-  getPrevBlockPos,
+  getBottomNestedBlockInfo,
+  getParentBlockInfo,
+  getPrevBlockInfo,
   mergeBlocksCommand,
 } from "../../api/blockManipulation/commands/mergeBlocks/mergeBlocks.js";
+import { nestBlock } from "../../api/blockManipulation/commands/nestBlock/nestBlock.js";
 import { splitBlockCommand } from "../../api/blockManipulation/commands/splitBlock/splitBlock.js";
 import { updateBlockCommand } from "../../api/blockManipulation/commands/updateBlock/updateBlock.js";
-import {
-  getBlockInfoFromResolvedPos,
-  getBlockInfoFromSelection,
-} from "../../api/getBlockInfoFromPos.js";
+import { getBlockInfoFromSelection } from "../../api/getBlockInfoFromPos.js";
 import { BlockNoteEditor } from "../../editor/BlockNoteEditor.js";
 
 export const KeyboardShortcutsExtension = Extension.create<{
@@ -42,7 +43,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
               return commands.command(
                 updateBlockCommand(
                   this.options.editor,
-                  blockInfo.blockContainer.beforePos,
+                  blockInfo.bnBlock.beforePos,
                   {
                     type: "paragraph",
                     props: {},
@@ -67,29 +68,20 @@ export const KeyboardShortcutsExtension = Extension.create<{
 
             return false;
           }),
-        // Merges block with the previous one if it isn't indented, isn't the
-        // first block in the doc, and the selection is at the start of the
+        // Merges block with the previous one if it isn't indented, and the selection is at the start of the
         // block. The target block for merging must contain inline content.
         () =>
           commands.command(({ state }) => {
-            const { blockContainer, blockContent } =
+            const { bnBlock: blockContainer, blockContent } =
               getBlockInfoFromSelection(state);
 
-            const { depth } = state.doc.resolve(blockContainer.beforePos);
-
             const selectionAtBlockStart =
               state.selection.from === blockContent.beforePos + 1;
             const selectionEmpty = state.selection.empty;
-            const blockAtDocStart = blockContainer.beforePos === 1;
 
             const posBetweenBlocks = blockContainer.beforePos;
 
-            if (
-              !blockAtDocStart &&
-              selectionAtBlockStart &&
-              selectionEmpty &&
-              depth === 1
-            ) {
+            if (selectionAtBlockStart && selectionEmpty) {
               return chain()
                 .command(mergeBlocksCommand(posBetweenBlocks))
                 .scrollIntoView()
@@ -98,6 +90,162 @@ export const KeyboardShortcutsExtension = Extension.create<{
 
             return false;
           }),
+        () =>
+          commands.command(({ state, dispatch }) => {
+            // when at the start of a first block in a column
+            const blockInfo = getBlockInfoFromSelection(state);
+
+            const selectionAtBlockStart =
+              state.selection.from === blockInfo.blockContent.beforePos + 1;
+
+            if (!selectionAtBlockStart) {
+              return false;
+            }
+
+            const prevBlockInfo = getPrevBlockInfo(
+              state.doc,
+              blockInfo.bnBlock.beforePos
+            );
+
+            if (prevBlockInfo) {
+              // should be no previous block
+              return false;
+            }
+
+            const parentBlockInfo = getParentBlockInfo(
+              state.doc,
+              blockInfo.bnBlock.beforePos
+            );
+
+            if (parentBlockInfo?.blockNoteType !== "column") {
+              return false;
+            }
+
+            const column = parentBlockInfo;
+
+            const columnList = getParentBlockInfo(
+              state.doc,
+              column.bnBlock.beforePos
+            );
+            if (columnList?.blockNoteType !== "columnList") {
+              throw new Error("parent of column is not a column list");
+            }
+
+            const shouldRemoveColumn =
+              column.childContainer!.node.childCount === 1;
+
+            const shouldRemoveColumnList =
+              shouldRemoveColumn &&
+              columnList.childContainer!.node.childCount === 2;
+
+            const isFirstColumn =
+              columnList.childContainer!.node.firstChild ===
+              column.bnBlock.node;
+
+            if (dispatch) {
+              const blockToMove = state.doc.slice(
+                blockInfo.bnBlock.beforePos,
+                blockInfo.bnBlock.afterPos,
+                false
+              );
+
+              /*
+              There are 3 different cases:
+              a) remove entire column list (if no columns would be remaining)
+              b) remove just a column (if no blocks inside a column would be remaining)
+              c) keep columns (if there are blocks remaining inside a column)
+
+              Each of these 3 cases has 2 sub-cases, depending on whether the backspace happens at the start of the first (most-left) column,
+              or at the start of a non-first column.
+              */
+              if (shouldRemoveColumnList) {
+                if (isFirstColumn) {
+                  state.tr.step(
+                    new ReplaceAroundStep(
+                      // replace entire column list
+                      columnList.bnBlock.beforePos,
+                      columnList.bnBlock.afterPos,
+                      // select content of remaining column:
+                      column.bnBlock.afterPos + 1,
+                      columnList.bnBlock.afterPos - 2,
+                      blockToMove,
+                      blockToMove.size, // append existing content to blockToMove
+                      false
+                    )
+                  );
+                  const pos = state.tr.doc.resolve(column.bnBlock.beforePos);
+                  state.tr.setSelection(TextSelection.between(pos, pos));
+                } else {
+                  // replaces the column list with the blockToMove slice, prepended with the content of the remaining column
+                  state.tr.step(
+                    new ReplaceAroundStep(
+                      // replace entire column list
+                      columnList.bnBlock.beforePos,
+                      columnList.bnBlock.afterPos,
+                      // select content of existing column:
+                      columnList.bnBlock.beforePos + 2,
+                      column.bnBlock.beforePos - 1,
+                      blockToMove,
+                      0, // prepend existing content to blockToMove
+                      false
+                    )
+                  );
+                  const pos = state.tr.doc.resolve(
+                    state.tr.mapping.map(column.bnBlock.beforePos - 1)
+                  );
+                  state.tr.setSelection(TextSelection.between(pos, pos));
+                }
+              } else if (shouldRemoveColumn) {
+                if (isFirstColumn) {
+                  // delete column
+                  state.tr.delete(
+                    column.bnBlock.beforePos,
+                    column.bnBlock.afterPos
+                  );
+
+                  // move before columnlist
+                  state.tr.insert(
+                    columnList.bnBlock.beforePos,
+                    blockToMove.content
+                  );
+
+                  const pos = state.tr.doc.resolve(
+                    columnList.bnBlock.beforePos
+                  );
+                  state.tr.setSelection(TextSelection.between(pos, pos));
+                } else {
+                  // just delete the </column><column> closing and opening tags to merge the columns
+                  state.tr.delete(
+                    column.bnBlock.beforePos - 1,
+                    column.bnBlock.beforePos + 1
+                  );
+                }
+              } else {
+                // delete block
+                state.tr.delete(
+                  blockInfo.bnBlock.beforePos,
+                  blockInfo.bnBlock.afterPos
+                );
+                if (isFirstColumn) {
+                  // move before columnlist
+                  state.tr.insert(
+                    columnList.bnBlock.beforePos - 1,
+                    blockToMove.content
+                  );
+                } else {
+                  // append block to previous column
+                  state.tr.insert(
+                    column.bnBlock.beforePos - 1,
+                    blockToMove.content
+                  );
+                }
+                const pos = state.tr.doc.resolve(column.bnBlock.beforePos - 1);
+                state.tr.setSelection(TextSelection.between(pos, pos));
+              }
+            }
+
+            return true;
+          }),
         // Deletes previous block if it contains no content and isn't a table,
         // when the selection is empty and at the start of the block. Moves the
         // current block into the deleted block's place.
@@ -105,47 +253,49 @@ export const KeyboardShortcutsExtension = Extension.create<{
           commands.command(({ state }) => {
             const blockInfo = getBlockInfoFromSelection(state);
 
-            const { depth } = state.doc.resolve(
-              blockInfo.blockContainer.beforePos
-            );
+            if (!blockInfo.isBlockContainer) {
+              // TODO
+              throw new Error(`todo`);
+            }
 
             const selectionAtBlockStart =
               state.selection.from === blockInfo.blockContent.beforePos + 1;
             const selectionEmpty = state.selection.empty;
-            const blockAtDocStart = blockInfo.blockContainer.beforePos === 1;
 
-            if (
-              !blockAtDocStart &&
-              selectionAtBlockStart &&
-              selectionEmpty &&
-              depth === 1
-            ) {
-              const prevBlockPos = getPrevBlockPos(
+            const prevBlockInfo = getPrevBlockInfo(
+              state.doc,
+              blockInfo.bnBlock.beforePos
+            );
+
+            if (prevBlockInfo && selectionAtBlockStart && selectionEmpty) {
+              const bottomBlock = getBottomNestedBlockInfo(
                 state.doc,
-                state.doc.resolve(blockInfo.blockContainer.beforePos)
-              );
-              const prevBlockInfo = getBlockInfoFromResolvedPos(
-                state.doc.resolve(prevBlockPos.pos)
+                prevBlockInfo
               );
 
+              if (!bottomBlock.isBlockContainer) {
+                // TODO
+                throw new Error(`todo`);
+              }
+
               const prevBlockNotTableAndNoContent =
-                prevBlockInfo.blockContent.node.type.spec.content === "" ||
-                (prevBlockInfo.blockContent.node.type.spec.content ===
+                bottomBlock.blockContent.node.type.spec.content === "" ||
+                (bottomBlock.blockContent.node.type.spec.content ===
                   "inline*" &&
-                  prevBlockInfo.blockContent.node.childCount === 0);
+                  bottomBlock.blockContent.node.childCount === 0);
 
               if (prevBlockNotTableAndNoContent) {
                 return chain()
                   .cut(
                     {
-                      from: blockInfo.blockContainer.beforePos,
-                      to: blockInfo.blockContainer.afterPos,
+                      from: blockInfo.bnBlock.beforePos,
+                      to: blockInfo.bnBlock.afterPos,
                     },
-                    prevBlockInfo.blockContainer.afterPos
+                    bottomBlock.bnBlock.afterPos
                   )
                   .deleteRange({
-                    from: prevBlockInfo.blockContainer.beforePos,
-                    to: prevBlockInfo.blockContainer.afterPos,
+                    from: bottomBlock.bnBlock.beforePos,
+                    to: bottomBlock.bnBlock.afterPos,
                   })
                   .run();
               }
@@ -165,8 +315,11 @@ export const KeyboardShortcutsExtension = Extension.create<{
         () =>
           commands.command(({ state }) => {
             // TODO: Change this to not rely on offsets & schema assumptions
-            const { blockContainer, blockContent, blockGroup } =
-              getBlockInfoFromSelection(state);
+            const {
+              bnBlock: blockContainer,
+              blockContent,
+              childContainer,
+            } = getBlockInfoFromSelection(state);
 
             const { depth } = state.doc.resolve(blockContainer.beforePos);
             const blockAtDocEnd =
@@ -174,7 +327,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
             const selectionAtBlockEnd =
               state.selection.from === blockContent.afterPos - 1;
             const selectionEmpty = state.selection.empty;
-            const hasChildBlocks = blockGroup !== undefined;
+            const hasChildBlocks = childContainer !== undefined;
 
             if (
               !blockAtDocEnd &&
@@ -205,7 +358,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
         // of the block.
         () =>
           commands.command(({ state }) => {
-            const { blockContent, blockContainer } =
+            const { blockContent, bnBlock: blockContainer } =
               getBlockInfoFromSelection(state);
 
             const { depth } = state.doc.resolve(blockContainer.beforePos);
@@ -232,7 +385,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
         // empty & at the start of the block.
         () =>
           commands.command(({ state, dispatch }) => {
-            const { blockContainer, blockContent } =
+            const { bnBlock: blockContainer, blockContent } =
               getBlockInfoFromSelection(state);
 
             const selectionAtBlockStart =
@@ -306,8 +459,8 @@ export const KeyboardShortcutsExtension = Extension.create<{
           // don't handle tabs if a toolbar is shown, so we can tab into / out of it
           return false;
         }
-        this.editor.commands.sinkListItem("blockContainer");
-        return true;
+        return nestBlock(this.options.editor);
+        // return true;
       },
       "Shift-Tab": () => {
         if (

package/src/extensions/NodeSelectionKeyboard/NodeSelectionKeyboardPlugin.ts

@@ -45,7 +45,7 @@ export const NodeSelectionKeyboardPlugin = () => {
               tr
                 .insert(
                   view.state.tr.selection.$to.after(),
-                  view.state.schema.nodes["paragraph"].create()
+                  view.state.schema.nodes["paragraph"].createChecked()
                 )
                 .setSelection(
                   new TextSelection(