Create a new block when clicked at the bottom (#1605)

* Create a new block when clicked at the bottom

* Fix for 2.20.0

Co-authored-by: George Berezhnoy <gohabereg@users.noreply.github.com>

docs/CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ### 2.20.1
 
+- `Fix` - Create a new block when clicked at the bottom [#1588](https://github.com/codex-team/editor.js/issues/1588).
 - `Fix` — Fix sanitisation problem with Inline Tools [#1631](https://github.com/codex-team/editor.js/issues/1631)
 - `Refactoring` - The Sanitizer module is util now.
 - `Refactoring` - Tooltip module is util now.

src/components/modules/ui.ts

@@ -691,10 +691,28 @@ export default class UI extends Module<UINodes> {
       return;
     }
 
-    if (!this.Editor.BlockManager.currentBlock) {
+    const isClickedBottom = event.target instanceof Element && event.target.isEqualNode(this.nodes.redactor);
+
+    if (isClickedBottom) {
       stopPropagation();
 
-      this.Editor.BlockManager.insert();
+      const { BlockManager, Caret, Toolbar } = this.Editor;
+
+      /**
+       * Insert a default-block at the bottom if:
+       * - last-block is not a default-block (Text)
+       *   to prevent unnecessary tree-walking on Tools with many nodes (for ex. Table)
+       * - Or, default-block is not empty
+       */
+      if (!BlockManager.lastBlock.tool.isDefault || !BlockManager.lastBlock.isEmpty) {
+        BlockManager.insertAtEnd();
+      }
+
+      /**
+       * Set the caret and toolbar to empty Block
+       */
+      Caret.setToTheLastBlock();
+      Toolbar.move();
     }
 
     /**