@blocknote/core 0.30.0 → 0.30.1

package/src/extensions/KeyboardShortcuts/KeyboardShortcutsExtension.ts

@@ -48,7 +48,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
                 updateBlockCommand(blockInfo.bnBlock.beforePos, {
                   type: "paragraph",
                   props: {},
-                })
+                }),
               );
             }
 
@@ -114,7 +114,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
 
             const prevBlockInfo = getPrevBlockInfo(
               state.doc,
-              blockInfo.bnBlock.beforePos
+              blockInfo.bnBlock.beforePos,
             );
 
             if (prevBlockInfo) {
@@ -124,7 +124,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
 
             const parentBlockInfo = getParentBlockInfo(
               state.doc,
-              blockInfo.bnBlock.beforePos
+              blockInfo.bnBlock.beforePos,
             );
 
             if (parentBlockInfo?.blockNoteType !== "column") {
@@ -135,7 +135,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
 
             const columnList = getParentBlockInfo(
               state.doc,
-              column.bnBlock.beforePos
+              column.bnBlock.beforePos,
             );
             if (columnList?.blockNoteType !== "columnList") {
               throw new Error("parent of column is not a column list");
@@ -156,7 +156,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
               const blockToMove = state.doc.slice(
                 blockInfo.bnBlock.beforePos,
                 blockInfo.bnBlock.afterPos,
-                false
+                false,
               );
 
               /*
@@ -180,8 +180,8 @@ export const KeyboardShortcutsExtension = Extension.create<{
                       columnList.bnBlock.afterPos - 2,
                       blockToMove,
                       blockToMove.size, // append existing content to blockToMove
-                      false
-                    )
+                      false,
+                    ),
                   );
                   const pos = state.tr.doc.resolve(column.bnBlock.beforePos);
                   state.tr.setSelection(TextSelection.between(pos, pos));
@@ -197,11 +197,11 @@ export const KeyboardShortcutsExtension = Extension.create<{
                       column.bnBlock.beforePos - 1,
                       blockToMove,
                       0, // prepend existing content to blockToMove
-                      false
-                    )
+                      false,
+                    ),
                   );
                   const pos = state.tr.doc.resolve(
-                    state.tr.mapping.map(column.bnBlock.beforePos - 1)
+                    state.tr.mapping.map(column.bnBlock.beforePos - 1),
                   );
                   state.tr.setSelection(TextSelection.between(pos, pos));
                 }
@@ -210,43 +210,43 @@ export const KeyboardShortcutsExtension = Extension.create<{
                   // delete column
                   state.tr.delete(
                     column.bnBlock.beforePos,
-                    column.bnBlock.afterPos
+                    column.bnBlock.afterPos,
                   );
 
                   // move before columnlist
                   state.tr.insert(
                     columnList.bnBlock.beforePos,
-                    blockToMove.content
+                    blockToMove.content,
                   );
 
                   const pos = state.tr.doc.resolve(
-                    columnList.bnBlock.beforePos
+                    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
+                    column.bnBlock.beforePos + 1,
                   );
                 }
               } else {
                 // delete block
                 state.tr.delete(
                   blockInfo.bnBlock.beforePos,
-                  blockInfo.bnBlock.afterPos
+                  blockInfo.bnBlock.afterPos,
                 );
                 if (isFirstColumn) {
                   // move before columnlist
                   state.tr.insert(
                     columnList.bnBlock.beforePos - 1,
-                    blockToMove.content
+                    blockToMove.content,
                   );
                 } else {
                   // append block to previous column
                   state.tr.insert(
                     column.bnBlock.beforePos - 1,
-                    blockToMove.content
+                    blockToMove.content,
                   );
                 }
                 const pos = state.tr.doc.resolve(column.bnBlock.beforePos - 1);
@@ -272,7 +272,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
             if (blockEmpty) {
               const prevBlockInfo = getPrevBlockInfo(
                 state.doc,
-                blockInfo.bnBlock.beforePos
+                blockInfo.bnBlock.beforePos,
               );
               if (!prevBlockInfo || !prevBlockInfo.isBlockContainer) {
                 return false;
@@ -291,7 +291,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
                 const lastCellParagraphEndPos = lastCellEndPos - 1;
 
                 chainedCommands = chainedCommands.setTextSelection(
-                  lastCellParagraphEndPos
+                  lastCellParagraphEndPos,
                 );
               } else if (
                 prevBlockInfo.blockContent.node.type.spec.content === ""
@@ -301,7 +301,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
                   prevBlockInfo.blockContent.node.nodeSize;
 
                 chainedCommands = chainedCommands.setNodeSelection(
-                  nonEditableBlockContentStartPos
+                  nonEditableBlockContentStartPos,
                 );
               } else {
                 const blockContentStartPos =
@@ -341,13 +341,13 @@ export const KeyboardShortcutsExtension = Extension.create<{
 
             const prevBlockInfo = getPrevBlockInfo(
               state.doc,
-              blockInfo.bnBlock.beforePos
+              blockInfo.bnBlock.beforePos,
             );
 
             if (prevBlockInfo && selectionAtBlockStart && selectionEmpty) {
               const bottomBlock = getBottomNestedBlockInfo(
                 state.doc,
-                prevBlockInfo
+                prevBlockInfo,
               );
 
               if (!bottomBlock.isBlockContainer) {
@@ -368,7 +368,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
                       from: blockInfo.bnBlock.beforePos,
                       to: blockInfo.bnBlock.afterPos,
                     },
-                    bottomBlock.bnBlock.afterPos
+                    bottomBlock.bnBlock.afterPos,
                   )
                   .deleteRange({
                     from: bottomBlock.bnBlock.beforePos,
@@ -521,7 +521,7 @@ export const KeyboardShortcutsExtension = Extension.create<{
                   .insert(newBlockInsertionPos, newBlock)
                   .scrollIntoView();
                 state.tr.setSelection(
-                  new TextSelection(state.doc.resolve(newBlockContentPos))
+                  new TextSelection(state.doc.resolve(newBlockContentPos)),
                 );
               }
 
@@ -551,8 +551,8 @@ export const KeyboardShortcutsExtension = Extension.create<{
                   splitBlockCommand(
                     state.selection.from,
                     selectionAtBlockStart,
-                    selectionAtBlockStart
-                  )
+                    selectionAtBlockStart,
+                  ),
                 )
                 .run();
 

package/src/extensions/LinkToolbar/LinkToolbarPlugin.ts

@@ -41,7 +41,7 @@ class LinkToolbarView implements PluginView {
   constructor(
     private readonly editor: BlockNoteEditor<any, any, any>,
     private readonly pmView: EditorView,
-    emitUpdate: (state: LinkToolbarState) => void
+    emitUpdate: (state: LinkToolbarState) => void,
   ) {
     this.emitUpdate = () => {
       if (!this.state) {
@@ -70,7 +70,7 @@ class LinkToolbarView implements PluginView {
     this.pmView.root.addEventListener(
       "click",
       this.clickHandler as EventListener,
-      true
+      true,
     );
 
     // Setting capture=true ensures that any parent container of the editor that
@@ -146,7 +146,7 @@ class LinkToolbarView implements PluginView {
         this.state.referencePos = posToDOMRect(
           this.pmView,
           this.linkMarkRange!.from,
-          this.linkMarkRange!.to
+          this.linkMarkRange!.to,
         );
         this.emitUpdate();
       }
@@ -160,7 +160,7 @@ class LinkToolbarView implements PluginView {
       tr.addMark(
         this.linkMarkRange!.from,
         this.linkMarkRange!.from + text.length,
-        pmSchema.mark("link", { href: url })
+        pmSchema.mark("link", { href: url }),
       );
     });
     this.pmView.focus();
@@ -177,9 +177,9 @@ class LinkToolbarView implements PluginView {
         .removeMark(
           this.linkMarkRange!.from,
           this.linkMarkRange!.to,
-          this.linkMark!.type
+          this.linkMark!.type,
         )
-        .setMeta("preventAutolink", true)
+        .setMeta("preventAutolink", true),
     );
     this.pmView.focus();
 
@@ -226,7 +226,7 @@ class LinkToolbarView implements PluginView {
             getMarkRange(
               this.pmView.state.selection.$from,
               mark.type,
-              mark.attrs
+              mark.attrs,
             ) || undefined;
 
           break;
@@ -251,12 +251,12 @@ class LinkToolbarView implements PluginView {
         referencePos: posToDOMRect(
           this.pmView,
           this.linkMarkRange!.from,
-          this.linkMarkRange!.to
+          this.linkMarkRange!.to,
         ),
         url: this.linkMark!.attrs.href,
         text: this.pmView.state.doc.textBetween(
           this.linkMarkRange!.from,
-          this.linkMarkRange!.to
+          this.linkMarkRange!.to,
         ),
       };
       this.emitUpdate();
@@ -290,7 +290,7 @@ class LinkToolbarView implements PluginView {
     this.pmView.root.removeEventListener(
       "click",
       this.clickHandler as EventListener,
-      true
+      true,
     );
   }
 }
@@ -300,7 +300,7 @@ export const linkToolbarPluginKey = new PluginKey("LinkToolbarPlugin");
 export class LinkToolbarProsemirrorPlugin<
   BSchema extends BlockSchema,
   I extends InlineContentSchema,
-  S extends StyleSchema
+  S extends StyleSchema,
 > extends EventEmitter<any> {
   private view: LinkToolbarView | undefined;
   public readonly plugin: Plugin;

package/src/extensions/NodeSelectionKeyboard/NodeSelectionKeyboardPlugin.ts

@@ -47,13 +47,13 @@ export class NodeSelectionKeyboardPlugin {
                 tr
                   .insert(
                     view.state.tr.selection.$to.after(),
-                    view.state.schema.nodes["paragraph"].createChecked()
+                    view.state.schema.nodes["paragraph"].createChecked(),
                   )
                   .setSelection(
                     new TextSelection(
-                      tr.doc.resolve(view.state.tr.selection.$to.after() + 1)
-                    )
-                  )
+                      tr.doc.resolve(view.state.tr.selection.$to.after() + 1),
+                    ),
+                  ),
               );
 
               return true;

package/src/extensions/Placeholder/PlaceholderPlugin.ts

@@ -12,7 +12,7 @@ export class PlaceholderPlugin {
     placeholders: Record<
       string | "default" | "emptyDocument",
       string | undefined
-    >
+    >,
   ) {
     this.plugin = new Plugin({
       key: PLUGIN_KEY,
@@ -51,8 +51,8 @@ export class PlaceholderPlugin {
 
             styleSheet.insertRule(
               `${getSelector(blockTypeSelector)} { content: ${JSON.stringify(
-                placeholder
-              )}; }`
+                placeholder,
+              )}; }`,
             );
           }
 
@@ -62,21 +62,21 @@ export class PlaceholderPlugin {
           // placeholder for when there's only one empty block
           styleSheet.insertRule(
             `${getSelector(onlyBlockSelector)} { content: ${JSON.stringify(
-              emptyPlaceholder
-            )}; }`
+              emptyPlaceholder,
+            )}; }`,
           );
 
           // placeholder for default blocks, only when the cursor is in the block (mustBeFocused)
           styleSheet.insertRule(
             `${getSelector(mustBeFocusedSelector)} { content: ${JSON.stringify(
-              defaultPlaceholder
-            )}; }`
+              defaultPlaceholder,
+            )}; }`,
           );
         } catch (e) {
           // eslint-disable-next-line no-console
           console.warn(
             `Failed to insert placeholder CSS rule - this is likely due to the browser not supporting certain CSS pseudo-element selectors (:has, :only-child:, or :before)`,
-            e
+            e,
           );
         }
 
@@ -115,7 +115,7 @@ export class PlaceholderPlugin {
             decs.push(
               Decoration.node(2, 4, {
                 "data-is-only-empty-block": "true",
-              })
+              }),
             );
           }
 
@@ -128,7 +128,7 @@ export class PlaceholderPlugin {
             decs.push(
               Decoration.node(before, before + node.nodeSize, {
                 "data-is-empty-and-focused": "true",
-              })
+              }),
             );
           }
 

package/src/extensions/PreviousBlockType/PreviousBlockTypePlugin.ts

@@ -37,7 +37,7 @@ export class PreviousBlockTypePlugin {
               // for one DOM-render the decorations have been applied
               timeout = setTimeout(() => {
                 view.dispatch(
-                  view.state.tr.setMeta(PLUGIN_KEY, { clearUpdate: true })
+                  view.state.tr.setMeta(PLUGIN_KEY, { clearUpdate: true }),
                 );
               }, 0);
             }
@@ -93,7 +93,7 @@ export class PreviousBlockTypePlugin {
 
           const oldNodes = findChildren(oldState.doc, (node) => node.attrs.id);
           const oldNodesById = new Map(
-            oldNodes.map((node) => [node.node.attrs.id, node])
+            oldNodes.map((node) => [node.node.attrs.id, node]),
           );
           const newNodes = findChildren(newState.doc, (node) => node.attrs.id);
 

package/src/extensions/README.md

@@ -1,3 +1,3 @@
 ### @blocknote/core/src/extensions
 
-All extra extensions for TipTap / Prosemirror needed to implement the Prosemirror UX and editor behavior. 
+All extra extensions for TipTap / Prosemirror needed to implement the Prosemirror UX and editor behavior.

package/src/extensions/SideMenu/MultipleNodeSelection.ts

@@ -77,7 +77,7 @@ export class MultipleNodeSelection extends Selection {
 
     return new MultipleNodeSelection(
       doc.resolve(fromResult.pos),
-      doc.resolve(toResult.pos)
+      doc.resolve(toResult.pos),
     );
   }
 

package/src/extensions/SideMenu/SideMenuPlugin.ts

@@ -24,7 +24,7 @@ import { dragStart, unsetDragImage } from "./dragging.js";
 export type SideMenuState<
   BSchema extends BlockSchema,
   I extends InlineContentSchema,
-  S extends StyleSchema
+  S extends StyleSchema,
 > = UiElementPosition & {
   // The block that the side menu is attached to.
   block: Block<BSchema, I, S>;
@@ -36,12 +36,12 @@ function getBlockFromCoords(
   view: EditorView,
   coords: { left: number; top: number },
   sideMenuDetection: "viewport" | "editor",
-  adjustForColumns = true
+  adjustForColumns = true,
 ) {
   const elements = view.root.elementsFromPoint(
     // bit hacky - offset x position to right to account for the width of sidemenu itself
     coords.left + (sideMenuDetection === "editor" ? 50 : 0),
-    coords.top
+    coords.top,
   );
 
   for (const element of elements) {
@@ -59,7 +59,7 @@ function getBlockFromCoords(
             top: coords.top,
           },
           sideMenuDetection,
-          false
+          false,
         );
       }
     }
@@ -74,7 +74,7 @@ function getBlockFromMousePos(
     y: number;
   },
   view: EditorView,
-  sideMenuDetection: "viewport" | "editor"
+  sideMenuDetection: "viewport" | "editor",
 ): { node: HTMLElement; id: string } | undefined {
   // Editor itself may have padding or other styling which affects
   // size/position, so we get the boundingRect of the first child (i.e. the
@@ -137,7 +137,7 @@ function getBlockFromMousePos(
 export class SideMenuView<
   BSchema extends BlockSchema,
   I extends InlineContentSchema,
-  S extends StyleSchema
+  S extends StyleSchema,
 > implements PluginView
 {
   public state?: SideMenuState<BSchema, I, S>;
@@ -155,7 +155,7 @@ export class SideMenuView<
     private readonly editor: BlockNoteEditor<BSchema, I, S>,
     private readonly sideMenuDetection: "viewport" | "editor",
     private readonly pmView: EditorView,
-    emitUpdate: (state: SideMenuState<BSchema, I, S>) => void
+    emitUpdate: (state: SideMenuState<BSchema, I, S>) => void,
   ) {
     this.emitUpdate = () => {
       if (!this.state) {
@@ -167,21 +167,21 @@ export class SideMenuView<
 
     this.pmView.root.addEventListener(
       "dragstart",
-      this.onDragStart as EventListener
+      this.onDragStart as EventListener,
     );
     this.pmView.root.addEventListener(
       "dragover",
-      this.onDragOver as EventListener
+      this.onDragOver as EventListener,
     );
     this.pmView.root.addEventListener(
       "drop",
       this.onDrop as EventListener,
-      true
+      true,
     );
     this.pmView.root.addEventListener(
       "dragend",
       this.onDragEnd as EventListener,
-      true
+      true,
     );
     initializeESMDependencies();
 
@@ -189,14 +189,14 @@ export class SideMenuView<
     this.pmView.root.addEventListener(
       "mousemove",
       this.onMouseMove as EventListener,
-      true
+      true,
     );
 
     // Hides and unfreezes the menu whenever the user presses a key.
     this.pmView.root.addEventListener(
       "keydown",
       this.onKeyDown as EventListener,
-      true
+      true,
     );
 
     // Setting capture=true ensures that any parent container of the editor that
@@ -218,7 +218,7 @@ export class SideMenuView<
     const block = getBlockFromMousePos(
       this.mousePos,
       this.pmView,
-      this.sideMenuDetection
+      this.sideMenuDetection,
     );
 
     // Closes the menu if the mouse cursor is beyond the editor vertically.
@@ -270,10 +270,10 @@ export class SideMenuView<
               ).getBoundingClientRect().x,
           blockContentBoundingBox.y,
           blockContentBoundingBox.width,
-          blockContentBoundingBox.height
+          blockContentBoundingBox.height,
         ),
         block: this.editor.getBlock(
-          this.hoveredBlock!.getAttribute("data-id")!
+          this.hoveredBlock!.getAttribute("data-id")!,
         )!,
       });
     }
@@ -312,9 +312,9 @@ export class SideMenuView<
           this.pmView.state.tr.setSelection(
             TextSelection.create(
               this.pmView.state.tr.doc,
-              this.pmView.state.tr.selection.to
-            )
-          )
+              this.pmView.state.tr.selection.to,
+            ),
+          ),
         );
       } else if (this.isDragOrigin && this.pmView.dom !== parentEditorElement) {
         // Because the editor from which the block originates doesn't get a drop
@@ -330,7 +330,7 @@ export class SideMenuView<
         // handle the event.
         setTimeout(
           () => this.pmView.dispatch(this.pmView.state.tr.deleteSelection()),
-          0
+          0,
         );
       }
     }
@@ -535,7 +535,7 @@ export class SideMenuView<
 
     evt.clientY = Math.min(
       Math.max(event.clientY, editorBoundingBox.top),
-      editorBoundingBox.top + editorBoundingBox.height
+      editorBoundingBox.top + editorBoundingBox.height,
     );
 
     evt.dataTransfer = event.dataTransfer;
@@ -573,30 +573,30 @@ export class SideMenuView<
     this.pmView.root.removeEventListener(
       "mousemove",
       this.onMouseMove as EventListener,
-      true
+      true,
     );
     this.pmView.root.removeEventListener(
       "dragstart",
-      this.onDragStart as EventListener
+      this.onDragStart as EventListener,
     );
     this.pmView.root.removeEventListener(
       "dragover",
-      this.onDragOver as EventListener
+      this.onDragOver as EventListener,
     );
     this.pmView.root.removeEventListener(
       "drop",
       this.onDrop as EventListener,
-      true
+      true,
     );
     this.pmView.root.removeEventListener(
       "dragend",
       this.onDragEnd as EventListener,
-      true
+      true,
     );
     this.pmView.root.removeEventListener(
       "keydown",
       this.onKeyDown as EventListener,
-      true
+      true,
     );
     this.pmView.root.removeEventListener("scroll", this.onScroll, true);
   }
@@ -607,14 +607,14 @@ export const sideMenuPluginKey = new PluginKey("SideMenuPlugin");
 export class SideMenuProsemirrorPlugin<
   BSchema extends BlockSchema,
   I extends InlineContentSchema,
-  S extends StyleSchema
+  S extends StyleSchema,
 > extends EventEmitter<any> {
   public view: SideMenuView<BSchema, I, S> | undefined;
   public readonly plugin: Plugin;
 
   constructor(
     private readonly editor: BlockNoteEditor<BSchema, I, S>,
-    sideMenuDetection: "viewport" | "editor"
+    sideMenuDetection: "viewport" | "editor",
   ) {
     super();
     this.plugin = new Plugin({
@@ -626,7 +626,7 @@ export class SideMenuProsemirrorPlugin<
           editorView,
           (state) => {
             this.emit("update", state);
-          }
+          },
         );
         return this.view;
       },
@@ -645,7 +645,7 @@ export class SideMenuProsemirrorPlugin<
       dataTransfer: DataTransfer | null;
       clientY: number;
     },
-    block: Block<BSchema, I, S>
+    block: Block<BSchema, I, S>,
   ) => {
     if (this.view) {
       this.view.isDragOrigin = true;

package/src/extensions/SideMenu/dragging.ts

@@ -21,7 +21,7 @@ let dragImageElement: Element | undefined;
 export type SideMenuState<
   BSchema extends BlockSchema,
   I extends InlineContentSchema,
-  S extends StyleSchema
+  S extends StyleSchema,
 > = UiElementPosition & {
   // The block that the side menu is attached to.
   block: Block<BSchema, I, S>;
@@ -81,12 +81,12 @@ function setDragImage(view: EditorView, from: number, to = from) {
   const firstSelectedBlockIndex = getElementIndex(
     parent,
     // Expects from position to be just before the first selected block.
-    view.domAtPos(from + 1).node.parentElement!
+    view.domAtPos(from + 1).node.parentElement!,
   );
   const lastSelectedBlockIndex = getElementIndex(
     parent,
     // Expects to position to be just after the last selected block.
-    view.domAtPos(to - 1).node.parentElement!
+    view.domAtPos(to - 1).node.parentElement!,
   );
 
   for (let i = parent.childElementCount - 1; i >= 0; i--) {
@@ -120,7 +120,7 @@ function setDragImage(view: EditorView, from: number, to = from) {
       (className) =>
         className !== "ProseMirror" &&
         className !== "bn-root" &&
-        className !== "bn-editor"
+        className !== "bn-editor",
     )
     .join(" ");
 
@@ -149,11 +149,11 @@ export function unsetDragImage(rootEl: Document | ShadowRoot) {
 export function dragStart<
   BSchema extends BlockSchema,
   I extends InlineContentSchema,
-  S extends StyleSchema
+  S extends StyleSchema,
 >(
   e: { dataTransfer: DataTransfer | null; clientY: number },
   block: Block<BSchema, I, S>,
-  editor: BlockNoteEditor<BSchema, I, S>
+  editor: BlockNoteEditor<BSchema, I, S>,
 ) {
   if (!e.dataTransfer) {
     return;
@@ -183,12 +183,12 @@ export function dragStart<
 
     if (draggedBlockInSelection && multipleBlocksSelected) {
       view.dispatch(
-        view.state.tr.setSelection(MultipleNodeSelection.create(doc, from, to))
+        view.state.tr.setSelection(MultipleNodeSelection.create(doc, from, to)),
       );
       setDragImage(view, from, to);
     } else {
       view.dispatch(
-        view.state.tr.setSelection(NodeSelection.create(view.state.doc, pos))
+        view.state.tr.setSelection(NodeSelection.create(view.state.doc, pos)),
       );
       setDragImage(view, pos);
     }