add option to disable animations (#1062)

* add option to disable animations

* Implemented PR feedback

---------

Co-authored-by: matthewlipski <[email protected]>

Author: YousefED

docs/pages/docs/editor-basics/setup.mdx

@@ -27,6 +27,7 @@ type BlockNoteEditorOptions = {
   dictionary?: Dictionary;
   schema?: BlockNoteSchema;
   trailingBlock?: boolean;
+  animations?: boolean;
 };
 ```
 
@@ -50,6 +51,8 @@ The hook takes two optional parameters:
 
 `trailingBlock`: An option which user can pass with `false` value to disable the automatic creation of a trailing new block on the next line when the user types or edits any block. Defaults to `true` if undefined.
 
+`animations`: Whether changes to blocks (like indentation, creating lists, changing headings) should be animated or not. Defaults to `true`.
+
 **deps:** Dependency array that's internally passed to `useMemo`. A new editor will only be created when this array changes.
 
 <Callout type="info" emoji={"💡"}>
@@ -58,9 +61,9 @@ The hook takes two optional parameters:
     The `useCreateBlockNote` hook is actually a simple `useMemo` wrapper around
     the `BlockNoteEditor.create` method. You can use this method directly if you
     want to control the editor lifecycle manually. For example, we do this in
-    the [Saving & Loading example](/examples/backend/saving-loading) to delay the
-    editor creation until some content has been fetched from an external data
-    source.
+    the [Saving & Loading example](/examples/backend/saving-loading) to delay
+    the editor creation until some content has been fetched from an external
+    data source.
   </p>
 </Callout>
 

packages/core/src/editor/BlockNoteEditor.ts

@@ -67,6 +67,7 @@ import { en } from "../i18n/locales";
 
 import { Transaction } from "@tiptap/pm/state";
 import { createInternalHTMLSerializer } from "../api/exporters/html/internalHTMLSerializer";
+import { PreviousBlockTypePlugin } from "../extensions/PreviousBlockType/PreviousBlockTypePlugin";
 import "../style.css";
 import { initializeESMDependencies } from "../util/esmDependencies";
 
@@ -75,6 +76,13 @@ export type BlockNoteEditorOptions<
   ISchema extends InlineContentSchema,
   SSchema extends StyleSchema
 > = {
+  /**
+   * Whether changes to blocks (like indentation, creating lists, changing headings) should be animated or not. Defaults to `true`.
+   *
+   * @default true
+   */
+  animations?: boolean;
+
   disableExtensions: string[];
   /**
    * A dictionary object containing translations for the editor.
@@ -364,6 +372,9 @@ export class BlockNoteEditor<
           ...(this.filePanel ? [this.filePanel.plugin] : []),
           ...(this.tableHandles ? [this.tableHandles.plugin] : []),
           PlaceholderPlugin(this, newOptions.placeholders),
+          ...(this.options.animations ?? true
+            ? [PreviousBlockTypePlugin()]
+            : []),
         ];
       },
     });

packages/core/src/pm-nodes/BlockContainer.ts

@@ -11,7 +11,6 @@ import {
 import { PartialBlock } from "../blocks/defaultBlocks";
 import type { BlockNoteEditor } from "../editor/BlockNoteEditor";
 import { NonEditableBlockPlugin } from "../extensions/NonEditableBlocks/NonEditableBlockPlugin";
-import { PreviousBlockTypePlugin } from "../extensions/PreviousBlockType/PreviousBlockTypePlugin";
 import {
   BlockNoteDOMAttributes,
   BlockSchema,
@@ -492,7 +491,7 @@ export const BlockContainer = Node.create<{
   },
 
   addProseMirrorPlugins() {
-    return [PreviousBlockTypePlugin(), NonEditableBlockPlugin()];
+    return [NonEditableBlockPlugin()];
   },
 
   addKeyboardShortcuts() {