@tiptap/core 2.0.0-beta.153 → 2.0.0-beta.157

package/dist/tiptap-core.umd.js

@@ -228,23 +228,27 @@
   const clearNodes = () => ({ state, tr, dispatch }) => {
       const { selection } = tr;
       const { ranges } = selection;
-      ranges.forEach(range => {
-          state.doc.nodesBetween(range.$from.pos, range.$to.pos, (node, pos) => {
+      if (!dispatch) {
+          return true;
+      }
+      ranges.forEach(({ $from, $to }) => {
+          state.doc.nodesBetween($from.pos, $to.pos, (node, pos) => {
               if (node.type.isText) {
                   return;
               }
-              const $fromPos = tr.doc.resolve(tr.mapping.map(pos));
-              const $toPos = tr.doc.resolve(tr.mapping.map(pos + node.nodeSize));
-              const nodeRange = $fromPos.blockRange($toPos);
+              const { doc, mapping } = tr;
+              const $mappedFrom = doc.resolve(mapping.map(pos));
+              const $mappedTo = doc.resolve(mapping.map(pos + node.nodeSize));
+              const nodeRange = $mappedFrom.blockRange($mappedTo);
               if (!nodeRange) {
                   return;
               }
               const targetLiftDepth = prosemirrorTransform.liftTarget(nodeRange);
-              if (node.type.isTextblock && dispatch) {
-                  const { defaultType } = $fromPos.parent.contentMatchAt($fromPos.index());
+              if (node.type.isTextblock) {
+                  const { defaultType } = $mappedFrom.parent.contentMatchAt($mappedFrom.index());
                   tr.setNodeMarkup(nodeRange.start, defaultType);
               }
-              if ((targetLiftDepth || targetLiftDepth === 0) && dispatch) {
+              if (targetLiftDepth || targetLiftDepth === 0) {
                   tr.lift(nodeRange, targetLiftDepth);
               }
           });
@@ -1104,12 +1108,15 @@
           console.warn('[tiptap warn]: Currently "setNode()" only supports text block nodes.');
           return false;
       }
-      const canSetBlock = prosemirrorCommands.setBlockType(type, attributes)(state);
-      if (canSetBlock) {
-          return prosemirrorCommands.setBlockType(type, attributes)(state, dispatch);
-      }
       return chain()
-          .clearNodes()
+          // try to convert node to default node if needed
+          .command(({ commands }) => {
+          const canSetBlock = prosemirrorCommands.setBlockType(type, attributes)(state);
+          if (canSetBlock) {
+              return true;
+          }
+          return commands.clearNodes();
+      })
           .command(({ state: updatedState }) => {
           return prosemirrorCommands.setBlockType(type, attributes)(updatedState, dispatch);
       })
@@ -1413,6 +1420,9 @@
           return true;
       }
       const before = tr.doc.resolve(Math.max(0, list.pos - 1)).before(list.depth);
+      if (before === undefined) {
+          return true;
+      }
       const nodeBefore = tr.doc.nodeAt(before);
       const canJoinBackwards = list.node.type === (nodeBefore === null || nodeBefore === void 0 ? void 0 : nodeBefore.type)
           && prosemirrorTransform.canJoin(tr.doc, list.pos);
@@ -1428,6 +1438,9 @@
           return true;
       }
       const after = tr.doc.resolve(list.start).after(list.depth);
+      if (after === undefined) {
+          return true;
+      }
       const nodeAfter = tr.doc.nodeAt(after);
       const canJoinForwards = list.node.type === (nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.type)
           && prosemirrorTransform.canJoin(tr.doc, after);
@@ -1854,144 +1867,6 @@
       },
   });
 
-  const Keymap = Extension.create({
-      name: 'keymap',
-      addKeyboardShortcuts() {
-          const handleBackspace = () => this.editor.commands.first(({ commands }) => [
-              () => commands.undoInputRule(),
-              () => commands.deleteSelection(),
-              () => commands.joinBackward(),
-              () => commands.selectNodeBackward(),
-          ]);
-          const handleDelete = () => this.editor.commands.first(({ commands }) => [
-              () => commands.deleteSelection(),
-              () => commands.joinForward(),
-              () => commands.selectNodeForward(),
-          ]);
-          return {
-              Enter: () => this.editor.commands.first(({ commands }) => [
-                  () => commands.newlineInCode(),
-                  () => commands.createParagraphNear(),
-                  () => commands.liftEmptyBlock(),
-                  () => commands.splitBlock(),
-              ]),
-              'Mod-Enter': () => this.editor.commands.exitCode(),
-              Backspace: handleBackspace,
-              'Mod-Backspace': handleBackspace,
-              'Shift-Backspace': handleBackspace,
-              Delete: handleDelete,
-              'Mod-Delete': handleDelete,
-              'Mod-a': () => this.editor.commands.selectAll(),
-          };
-      },
-  });
-
-  const Tabindex = Extension.create({
-      name: 'tabindex',
-      addProseMirrorPlugins() {
-          return [
-              new prosemirrorState.Plugin({
-                  key: new prosemirrorState.PluginKey('tabindex'),
-                  props: {
-                      attributes: {
-                          tabindex: '0',
-                      },
-                  },
-              }),
-          ];
-      },
-  });
-
-  var extensions = /*#__PURE__*/Object.freeze({
-    __proto__: null,
-    ClipboardTextSerializer: ClipboardTextSerializer,
-    Commands: Commands,
-    Editable: Editable,
-    FocusEvents: FocusEvents,
-    Keymap: Keymap,
-    Tabindex: Tabindex
-  });
-
-  function getNodeAttributes(state, typeOrName) {
-      const type = getNodeType(typeOrName, state.schema);
-      const { from, to } = state.selection;
-      const nodes = [];
-      state.doc.nodesBetween(from, to, node => {
-          nodes.push(node);
-      });
-      const node = nodes
-          .reverse()
-          .find(nodeItem => nodeItem.type.name === type.name);
-      if (!node) {
-          return {};
-      }
-      return { ...node.attrs };
-  }
-
-  function getAttributes(state, typeOrName) {
-      const schemaType = getSchemaTypeNameByName(typeof typeOrName === 'string'
-          ? typeOrName
-          : typeOrName.name, state.schema);
-      if (schemaType === 'node') {
-          return getNodeAttributes(state, typeOrName);
-      }
-      if (schemaType === 'mark') {
-          return getMarkAttributes(state, typeOrName);
-      }
-      return {};
-  }
-
-  function isActive(state, name, attributes = {}) {
-      if (!name) {
-          return isNodeActive(state, null, attributes) || isMarkActive(state, null, attributes);
-      }
-      const schemaType = getSchemaTypeNameByName(name, state.schema);
-      if (schemaType === 'node') {
-          return isNodeActive(state, name, attributes);
-      }
-      if (schemaType === 'mark') {
-          return isMarkActive(state, name, attributes);
-      }
-      return false;
-  }
-
-  function getHTMLFromFragment(fragment, schema) {
-      const documentFragment = prosemirrorModel.DOMSerializer
-          .fromSchema(schema)
-          .serializeFragment(fragment);
-      const temporaryDocument = document.implementation.createHTMLDocument();
-      const container = temporaryDocument.createElement('div');
-      container.appendChild(documentFragment);
-      return container.innerHTML;
-  }
-
-  function getText(node, options) {
-      const range = {
-          from: 0,
-          to: node.content.size,
-      };
-      return getTextBetween(node, range, options);
-  }
-
-  function isNodeEmpty(node) {
-      var _a;
-      const defaultContent = (_a = node.type.createAndFill()) === null || _a === void 0 ? void 0 : _a.toJSON();
-      const content = node.toJSON();
-      return JSON.stringify(defaultContent) === JSON.stringify(content);
-  }
-
-  function createStyleTag(style) {
-      const tipTapStyleTag = document.querySelector('style[data-tiptap-style]');
-      if (tipTapStyleTag !== null) {
-          return tipTapStyleTag;
-      }
-      const styleNode = document.createElement('style');
-      styleNode.setAttribute('data-tiptap-style', '');
-      styleNode.innerHTML = style;
-      document.getElementsByTagName('head')[0].appendChild(styleNode);
-      return styleNode;
-  }
-
   function createChainableState(config) {
       const { state, transaction } = config;
       let { selection } = transaction;
@@ -2134,6 +2009,199 @@
       }
   }
 
+  const Keymap = Extension.create({
+      name: 'keymap',
+      addKeyboardShortcuts() {
+          const handleBackspace = () => this.editor.commands.first(({ commands }) => [
+              () => commands.undoInputRule(),
+              // maybe convert first text block node to default node
+              () => commands.command(({ tr }) => {
+                  const { selection, doc } = tr;
+                  const { empty, $anchor } = selection;
+                  const { pos, parent } = $anchor;
+                  const isAtStart = prosemirrorState.Selection.atStart(doc).from === pos;
+                  if (!empty
+                      || !isAtStart
+                      || !parent.type.isTextblock
+                      || parent.textContent.length) {
+                      return false;
+                  }
+                  return commands.clearNodes();
+              }),
+              () => commands.deleteSelection(),
+              () => commands.joinBackward(),
+              () => commands.selectNodeBackward(),
+          ]);
+          const handleDelete = () => this.editor.commands.first(({ commands }) => [
+              () => commands.deleteSelection(),
+              () => commands.joinForward(),
+              () => commands.selectNodeForward(),
+          ]);
+          return {
+              Enter: () => this.editor.commands.first(({ commands }) => [
+                  () => commands.newlineInCode(),
+                  () => commands.createParagraphNear(),
+                  () => commands.liftEmptyBlock(),
+                  () => commands.splitBlock(),
+              ]),
+              'Mod-Enter': () => this.editor.commands.exitCode(),
+              Backspace: handleBackspace,
+              'Mod-Backspace': handleBackspace,
+              'Shift-Backspace': handleBackspace,
+              Delete: handleDelete,
+              'Mod-Delete': handleDelete,
+              'Mod-a': () => this.editor.commands.selectAll(),
+          };
+      },
+      addProseMirrorPlugins() {
+          return [
+              // With this plugin we check if the whole document was selected and deleted.
+              // In this case we will additionally call `clearNodes()` to convert e.g. a heading
+              // to a paragraph if necessary.
+              // This is an alternative to ProseMirror's `AllSelection`, which doesn’t work well
+              // with many other commands.
+              new prosemirrorState.Plugin({
+                  key: new prosemirrorState.PluginKey('clearDocument'),
+                  appendTransaction: (transactions, oldState, newState) => {
+                      const docChanges = transactions.some(transaction => transaction.docChanged)
+                          && !oldState.doc.eq(newState.doc);
+                      if (!docChanges) {
+                          return;
+                      }
+                      const { empty, from, to } = oldState.selection;
+                      const allFrom = prosemirrorState.Selection.atStart(oldState.doc).from;
+                      const allEnd = prosemirrorState.Selection.atEnd(oldState.doc).to;
+                      const allWasSelected = from === allFrom && to === allEnd;
+                      const isEmpty = newState.doc.textBetween(0, newState.doc.content.size, ' ', ' ').length === 0;
+                      if (empty || !allWasSelected || !isEmpty) {
+                          return;
+                      }
+                      const tr = newState.tr;
+                      const state = createChainableState({
+                          state: newState,
+                          transaction: tr,
+                      });
+                      const { commands } = new CommandManager({
+                          editor: this.editor,
+                          state,
+                      });
+                      commands.clearNodes();
+                      if (!tr.steps.length) {
+                          return;
+                      }
+                      return tr;
+                  },
+              }),
+          ];
+      },
+  });
+
+  const Tabindex = Extension.create({
+      name: 'tabindex',
+      addProseMirrorPlugins() {
+          return [
+              new prosemirrorState.Plugin({
+                  key: new prosemirrorState.PluginKey('tabindex'),
+                  props: {
+                      attributes: {
+                          tabindex: '0',
+                      },
+                  },
+              }),
+          ];
+      },
+  });
+
+  var extensions = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    ClipboardTextSerializer: ClipboardTextSerializer,
+    Commands: Commands,
+    Editable: Editable,
+    FocusEvents: FocusEvents,
+    Keymap: Keymap,
+    Tabindex: Tabindex
+  });
+
+  function getNodeAttributes(state, typeOrName) {
+      const type = getNodeType(typeOrName, state.schema);
+      const { from, to } = state.selection;
+      const nodes = [];
+      state.doc.nodesBetween(from, to, node => {
+          nodes.push(node);
+      });
+      const node = nodes
+          .reverse()
+          .find(nodeItem => nodeItem.type.name === type.name);
+      if (!node) {
+          return {};
+      }
+      return { ...node.attrs };
+  }
+
+  function getAttributes(state, typeOrName) {
+      const schemaType = getSchemaTypeNameByName(typeof typeOrName === 'string'
+          ? typeOrName
+          : typeOrName.name, state.schema);
+      if (schemaType === 'node') {
+          return getNodeAttributes(state, typeOrName);
+      }
+      if (schemaType === 'mark') {
+          return getMarkAttributes(state, typeOrName);
+      }
+      return {};
+  }
+
+  function isActive(state, name, attributes = {}) {
+      if (!name) {
+          return isNodeActive(state, null, attributes) || isMarkActive(state, null, attributes);
+      }
+      const schemaType = getSchemaTypeNameByName(name, state.schema);
+      if (schemaType === 'node') {
+          return isNodeActive(state, name, attributes);
+      }
+      if (schemaType === 'mark') {
+          return isMarkActive(state, name, attributes);
+      }
+      return false;
+  }
+
+  function getHTMLFromFragment(fragment, schema) {
+      const documentFragment = prosemirrorModel.DOMSerializer
+          .fromSchema(schema)
+          .serializeFragment(fragment);
+      const temporaryDocument = document.implementation.createHTMLDocument();
+      const container = temporaryDocument.createElement('div');
+      container.appendChild(documentFragment);
+      return container.innerHTML;
+  }
+
+  function getText(node, options) {
+      const range = {
+          from: 0,
+          to: node.content.size,
+      };
+      return getTextBetween(node, range, options);
+  }
+
+  function isNodeEmpty(node) {
+      var _a;
+      const defaultContent = (_a = node.type.createAndFill()) === null || _a === void 0 ? void 0 : _a.toJSON();
+      const content = node.toJSON();
+      return JSON.stringify(defaultContent) === JSON.stringify(content);
+  }
+
+  function createStyleTag(style) {
+      const tipTapStyleTag = document.querySelector('style[data-tiptap-style]');
+      if (tipTapStyleTag !== null) {
+          return tipTapStyleTag;
+      }
+      const styleNode = document.createElement('style');
+      styleNode.setAttribute('data-tiptap-style', '');
+      styleNode.innerHTML = style;
+      document.getElementsByTagName('head')[0].appendChild(styleNode);
+      return styleNode;
+  }
+
   class InputRule {
       constructor(config) {
           this.find = config.find;