npm - @tiptap/core - Versions diffs - 3.0.0-next.4 → 3.0.0-next.5 - Mend

@tiptap/core 3.0.0-next.4 → 3.0.0-next.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (39) hide show

package/LICENSE.md +1 -1
package/dist/index.cjs +352 -238
package/dist/index.cjs.map +1 -1
package/dist/index.d.cts +1084 -1431
package/dist/index.d.ts +1084 -1431
package/dist/index.js +344 -235
package/dist/index.js.map +1 -1
package/dist/jsx-runtime/jsx-runtime.cjs +56 -0
package/dist/jsx-runtime/jsx-runtime.cjs.map +1 -0
package/dist/jsx-runtime/jsx-runtime.d.cts +22 -0
package/dist/jsx-runtime/jsx-runtime.d.ts +22 -0
package/dist/jsx-runtime/jsx-runtime.js +26 -0
package/dist/jsx-runtime/jsx-runtime.js.map +1 -0
package/jsx-runtime/index.cjs +1 -0
package/jsx-runtime/index.d.cts +1 -0
package/jsx-runtime/index.d.ts +1 -0
package/jsx-runtime/index.js +1 -0
package/package.json +20 -3
package/src/Editor.ts +104 -22
package/src/Extendable.ts +483 -0
package/src/Extension.ts +5 -490
package/src/ExtensionManager.ts +55 -10
package/src/Mark.ts +135 -623
package/src/MarkView.ts +66 -0
package/src/Node.ts +325 -829
package/src/commands/clearContent.ts +9 -4
package/src/commands/focus.ts +7 -1
package/src/commands/insertContentAt.ts +6 -2
package/src/commands/setContent.ts +15 -14
package/src/extensions/delete.ts +89 -0
package/src/extensions/index.ts +1 -0
package/src/extensions/keymap.ts +4 -0
package/src/helpers/getExtensionField.ts +10 -7
package/src/index.ts +3 -7
package/src/jsx-runtime.ts +64 -0
package/src/types.ts +334 -19
package/src/utilities/elementFromString.ts +3 -0
package/src/utilities/index.ts +1 -0
package/src/utilities/mergeAttributes.ts +1 -1

package/dist/index.cjs CHANGED Viewed

@@ -23,8 +23,10 @@ __export(index_exports, {
   CommandManager: () => CommandManager,
   Editor: () => Editor,
   Extension: () => Extension,
+  Fragment: () => Fragment7,
   InputRule: () => InputRule,
   Mark: () => Mark,
+  MarkView: () => MarkView,
   Node: () => Node3,
   NodePos: () => NodePos,
   NodeView: () => NodeView,
@@ -34,6 +36,7 @@ __export(index_exports, {
   combineTransactionSteps: () => combineTransactionSteps,
   createChainableState: () => createChainableState,
   createDocument: () => createDocument,
+  createElement: () => h,
   createNodeFromContent: () => createNodeFromContent,
   createStyleTag: () => createStyleTag,
   defaultBlockAt: () => defaultBlockAt,
@@ -74,9 +77,11 @@ __export(index_exports, {
   getTextBetween: () => getTextBetween,
   getTextContentFromNodes: () => getTextContentFromNodes,
   getTextSerializersFromSchema: () => getTextSerializersFromSchema,
+  h: () => h,
   injectExtensionAttributesToParseRule: () => injectExtensionAttributesToParseRule,
   inputRulesPlugin: () => inputRulesPlugin,
   isActive: () => isActive,
+  isAndroid: () => isAndroid,
   isAtEndOfNode: () => isAtEndOfNode,
   isAtStartOfNode: () => isAtStartOfNode,
   isEmptyObject: () => isEmptyObject,
@@ -334,6 +339,9 @@ var removeWhitespaces = (node) => {
   return node;
 };
 function elementFromString(value) {
+  if (typeof window === "undefined") {
+    throw new Error("[tiptap error]: there is no window object available, so this function cannot be used");
+  }
   const wrappedValue = `<body>${value}</body>`;
   const html = new window.DOMParser().parseFromString(wrappedValue, "text/html").body;
   return removeWhitespaces(html);
@@ -656,7 +664,7 @@ function mergeAttributes(...objects) {
         return;
       }
       if (key === "class") {
-        const valueClasses = value ? value.split(" ") : [];
+        const valueClasses = value ? String(value).split(" ") : [];
         const existingClasses = mergedAttributes[key] ? mergedAttributes[key].split(" ") : [];
         const insertClasses = valueClasses.filter((valueClass) => !existingClasses.includes(valueClass));
         mergedAttributes[key] = [...existingClasses, ...insertClasses].join(" ");
@@ -1881,44 +1889,40 @@ function mergeDeep(target, source) {
   return output;
 }
-// src/Mark.ts
-var Mark = class _Mark {
+// src/Extendable.ts
+var Extendable = class {
   constructor(config = {}) {
-    this.type = "mark";
-    this.name = "mark";
+    this.type = "extendable";
     this.parent = null;
     this.child = null;
+    this.name = "";
     this.config = {
-      name: this.name,
-      defaultOptions: {}
+      name: this.name
     };
     this.config = {
       ...this.config,
       ...config
     };
     this.name = this.config.name;
-    if (config.defaultOptions && Object.keys(config.defaultOptions).length > 0) {
-      console.warn(
-        `[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${this.name}".`
-      );
-    }
-    this.options = this.config.defaultOptions;
-    if (this.config.addOptions) {
-      this.options = callOrReturn(
+  }
+  get options() {
+    return {
+      ...callOrReturn(
         getExtensionField(this, "addOptions", {
           name: this.name
         })
-      );
-    }
-    this.storage = callOrReturn(
-      getExtensionField(this, "addStorage", {
-        name: this.name,
-        options: this.options
-      })
-    ) || {};
+      ) || {}
+    };
   }
-  static create(config = {}) {
-    return new _Mark(config);
+  get storage() {
+    return {
+      ...callOrReturn(
+        getExtensionField(this, "addStorage", {
+          name: this.name,
+          options: this.options
+        })
+      ) || {}
+    };
   }
   configure(options = {}) {
     const extension = this.extend({
@@ -1932,28 +1936,23 @@ var Mark = class _Mark {
     return extension;
   }
   extend(extendedConfig = {}) {
-    const extension = new _Mark(extendedConfig);
+    const extension = new this.constructor({ ...this.config, ...extendedConfig });
     extension.parent = this;
     this.child = extension;
     extension.name = extendedConfig.name ? extendedConfig.name : extension.parent.name;
-    if (extendedConfig.defaultOptions && Object.keys(extendedConfig.defaultOptions).length > 0) {
-      console.warn(
-        `[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${extension.name}".`
-      );
-    }
-    extension.options = callOrReturn(
-      getExtensionField(extension, "addOptions", {
-        name: extension.name
-      })
-    );
-    extension.storage = callOrReturn(
-      getExtensionField(extension, "addStorage", {
-        name: extension.name,
-        options: extension.options
-      })
-    );
     return extension;
   }
+};
+// src/Mark.ts
+var Mark = class _Mark extends Extendable {
+  constructor() {
+    super(...arguments);
+    this.type = "mark";
+  }
+  static create(config = {}) {
+    return new _Mark(config);
+  }
   static handleExit({ editor, mark }) {
     const { tr } = editor.state;
     const currentPos = editor.state.selection.$from;
@@ -2223,7 +2222,7 @@ var ExtensionManager = class {
       const context = {
         name: extension.name,
         options: extension.options,
-        storage: extension.storage,
+        storage: this.editor.extensionStorage[extension.name],
         editor: this.editor,
         type: getSchemaTypeByName(extension.name, this.schema)
       };
@@ -2250,7 +2249,7 @@ var ExtensionManager = class {
       const context = {
         name: extension.name,
         options: extension.options,
-        storage: extension.storage,
+        storage: this.editor.extensionStorage[extension.name],
         editor,
         type: getSchemaTypeByName(extension.name, this.schema)
       };
@@ -2325,7 +2324,7 @@ var ExtensionManager = class {
         const context = {
           name: extension.name,
           options: extension.options,
-          storage: extension.storage,
+          storage: this.editor.extensionStorage[extension.name],
           editor,
           type: getNodeType(extension.name, this.schema)
         };
@@ -2352,18 +2351,55 @@ var ExtensionManager = class {
       })
     );
   }
+  get markViews() {
+    const { editor } = this;
+    const { markExtensions } = splitExtensions(this.extensions);
+    return Object.fromEntries(
+      markExtensions.filter((extension) => !!getExtensionField(extension, "addMarkView")).map((extension) => {
+        const extensionAttributes = this.attributes.filter((attribute) => attribute.type === extension.name);
+        const context = {
+          name: extension.name,
+          options: extension.options,
+          storage: this.editor.extensionStorage[extension.name],
+          editor,
+          type: getMarkType(extension.name, this.schema)
+        };
+        const addMarkView = getExtensionField(extension, "addMarkView", context);
+        if (!addMarkView) {
+          return [];
+        }
+        const markView = (mark, view, inline) => {
+          const HTMLAttributes = getRenderedAttributes(mark, extensionAttributes);
+          return addMarkView()({
+            // pass-through
+            mark,
+            view,
+            inline,
+            // tiptap-specific
+            editor,
+            extension,
+            HTMLAttributes
+          });
+        };
+        return [extension.name, markView];
+      })
+    );
+  }
   /**
    * Go through all extensions, create extension storages & setup marks
    * & bind editor event listener.
    */
   setupExtensions() {
-    this.extensions.forEach((extension) => {
+    const extensions = this.extensions;
+    this.editor.extensionStorage = Object.fromEntries(
+      extensions.map((extension) => [extension.name, extension.storage])
+    );
+    extensions.forEach((extension) => {
       var _a;
-      this.editor.extensionStorage[extension.name] = extension.storage;
       const context = {
         name: extension.name,
         options: extension.options,
-        storage: extension.storage,
+        storage: this.editor.extensionStorage[extension.name],
         editor: this.editor,
         type: getSchemaTypeByName(extension.name, this.schema)
       };
@@ -2421,6 +2457,7 @@ var extensions_exports = {};
 __export(extensions_exports, {
   ClipboardTextSerializer: () => ClipboardTextSerializer,
   Commands: () => Commands,
+  Delete: () => Delete,
   Drop: () => Drop,
   Editable: () => Editable,
   FocusEvents: () => FocusEvents,
@@ -2433,78 +2470,14 @@ __export(extensions_exports, {
 var import_state7 = require("@tiptap/pm/state");
 // src/Extension.ts
-var Extension = class _Extension {
-  constructor(config = {}) {
+var Extension = class _Extension extends Extendable {
+  constructor() {
+    super(...arguments);
     this.type = "extension";
-    this.name = "extension";
-    this.parent = null;
-    this.child = null;
-    this.config = {
-      name: this.name,
-      defaultOptions: {}
-    };
-    this.config = {
-      ...this.config,
-      ...config
-    };
-    this.name = this.config.name;
-    if (config.defaultOptions && Object.keys(config.defaultOptions).length > 0) {
-      console.warn(
-        `[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${this.name}".`
-      );
-    }
-    this.options = this.config.defaultOptions;
-    if (this.config.addOptions) {
-      this.options = callOrReturn(
-        getExtensionField(this, "addOptions", {
-          name: this.name
-        })
-      );
-    }
-    this.storage = callOrReturn(
-      getExtensionField(this, "addStorage", {
-        name: this.name,
-        options: this.options
-      })
-    ) || {};
   }
   static create(config = {}) {
     return new _Extension(config);
   }
-  configure(options = {}) {
-    const extension = this.extend({
-      ...this.config,
-      addOptions: () => {
-        return mergeDeep(this.options, options);
-      }
-    });
-    extension.name = this.name;
-    extension.parent = this.parent;
-    return extension;
-  }
-  extend(extendedConfig = {}) {
-    const extension = new _Extension({ ...this.config, ...extendedConfig });
-    extension.parent = this;
-    this.child = extension;
-    extension.name = extendedConfig.name ? extendedConfig.name : extension.parent.name;
-    if (extendedConfig.defaultOptions && Object.keys(extendedConfig.defaultOptions).length > 0) {
-      console.warn(
-        `[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${extension.name}".`
-      );
-    }
-    extension.options = callOrReturn(
-      getExtensionField(extension, "addOptions", {
-        name: extension.name
-      })
-    );
-    extension.storage = callOrReturn(
-      getExtensionField(extension, "addStorage", {
-        name: extension.name,
-        options: extension.options
-      })
-    );
-    return extension;
-  }
 };
 // src/extensions/clipboardTextSerializer.ts
@@ -2617,8 +2590,8 @@ var blur = () => ({ editor, view }) => {
 };
 // src/commands/clearContent.ts
-var clearContent = (emitUpdate = false) => ({ commands }) => {
-  return commands.setContent("", emitUpdate);
+var clearContent = (emitUpdate = true) => ({ commands }) => {
+  return commands.setContent("", { emitUpdate });
 };
 // src/commands/clearNodes.ts
@@ -2770,6 +2743,17 @@ var first = (commands) => (props) => {
   return false;
 };
+// src/utilities/isAndroid.ts
+function isAndroid() {
+  return navigator.platform === "Android" || /android/i.test(navigator.userAgent);
+}
+// src/utilities/isiOS.ts
+function isiOS() {
+  return ["iPad Simulator", "iPhone Simulator", "iPod Simulator", "iPad", "iPhone", "iPod"].includes(navigator.platform) || // iPad on iOS 13 detection
+  navigator.userAgent.includes("Mac") && "ontouchend" in document;
+}
 // src/commands/focus.ts
 var focus = (position = null, options = {}) => ({ editor, view, tr, dispatch }) => {
   options = {
@@ -2777,8 +2761,10 @@ var focus = (position = null, options = {}) => ({ editor, view, tr, dispatch })
     ...options
   };
   const delayedFocus = () => {
-    ;
-    view.dom.focus();
+    if (isiOS() || isAndroid()) {
+      ;
+      view.dom.focus();
+    }
     requestAnimationFrame(() => {
       if (!editor.isDestroyed) {
         view.focus();
@@ -2849,7 +2835,8 @@ var insertContentAt = (position, value, options) => ({ tr, dispatch, editor }) =
         editor,
         error: e,
         disableCollaboration: () => {
-          if (editor.storage.collaboration) {
+          if ("collaboration" in editor.storage && typeof editor.storage.collaboration === "object" && editor.storage.collaboration) {
+            ;
             editor.storage.collaboration.isDisabled = true;
           }
         }
@@ -2976,12 +2963,6 @@ var joinTextblockForward = () => ({ state, dispatch }) => {
   return (0, import_commands6.joinTextblockForward)(state, dispatch);
 };
-// src/utilities/isiOS.ts
-function isiOS() {
-  return ["iPad Simulator", "iPhone Simulator", "iPod Simulator", "iPad", "iPhone", "iPod"].includes(navigator.platform) || // iPad on iOS 13 detection
-  navigator.userAgent.includes("Mac") && "ontouchend" in document;
-}
 // src/utilities/isMacOS.ts
 function isMacOS() {
   return typeof navigator !== "undefined" ? /Mac/.test(navigator.platform) : false;
@@ -3182,12 +3163,11 @@ var selectTextblockStart = () => ({ state, dispatch }) => {
 };
 // src/commands/setContent.ts
-var setContent = (content, emitUpdate = false, parseOptions = {}, options = {}) => ({ editor, tr, dispatch, commands }) => {
-  var _a, _b;
+var setContent = (content, { errorOnInvalidContent, emitUpdate = true, parseOptions = {} } = {}) => ({ editor, tr, dispatch, commands }) => {
   const { doc } = tr;
   if (parseOptions.preserveWhitespace !== "full") {
     const document2 = createDocument(content, editor.schema, parseOptions, {
-      errorOnInvalidContent: (_a = options.errorOnInvalidContent) != null ? _a : editor.options.enableContentCheck
+      errorOnInvalidContent: errorOnInvalidContent != null ? errorOnInvalidContent : editor.options.enableContentCheck
     });
     if (dispatch) {
       tr.replaceWith(0, doc.content.size, document2).setMeta("preventUpdate", !emitUpdate);
@@ -3199,7 +3179,7 @@ var setContent = (content, emitUpdate = false, parseOptions = {}, options = {})
   }
   return commands.insertContentAt({ from: 0, to: doc.content.size }, content, {
     parseOptions,
-    errorOnInvalidContent: (_b = options.errorOnInvalidContent) != null ? _b : editor.options.enableContentCheck
+    errorOnInvalidContent: errorOnInvalidContent != null ? errorOnInvalidContent : editor.options.enableContentCheck
   });
 };
@@ -3799,6 +3779,80 @@ var Commands = Extension.create({
   }
 });
+// src/extensions/delete.ts
+var import_transform9 = require("@tiptap/pm/transform");
+var Delete = Extension.create({
+  name: "delete",
+  onUpdate({ transaction, appendedTransactions }) {
+    var _a, _b, _c;
+    const callback = () => {
+      var _a2, _b2, _c2, _d;
+      if ((_d = (_c2 = (_b2 = (_a2 = this.editor.options.coreExtensionOptions) == null ? void 0 : _a2.delete) == null ? void 0 : _b2.filterTransaction) == null ? void 0 : _c2.call(_b2, transaction)) != null ? _d : transaction.getMeta("y-sync$")) {
+        return;
+      }
+      const nextTransaction = combineTransactionSteps(transaction.before, [transaction, ...appendedTransactions]);
+      const changes = getChangedRanges(nextTransaction);
+      changes.forEach((change) => {
+        if (nextTransaction.mapping.mapResult(change.oldRange.from).deletedAfter && nextTransaction.mapping.mapResult(change.oldRange.to).deletedBefore) {
+          nextTransaction.before.nodesBetween(change.oldRange.from, change.oldRange.to, (node, from) => {
+            const to = from + node.nodeSize - 2;
+            const isFullyWithinRange = change.oldRange.from <= from && to <= change.oldRange.to;
+            this.editor.emit("delete", {
+              type: "node",
+              node,
+              from,
+              to,
+              newFrom: nextTransaction.mapping.map(from),
+              newTo: nextTransaction.mapping.map(to),
+              deletedRange: change.oldRange,
+              newRange: change.newRange,
+              partial: !isFullyWithinRange,
+              editor: this.editor,
+              transaction,
+              combinedTransform: nextTransaction
+            });
+          });
+        }
+      });
+      const mapping = nextTransaction.mapping;
+      nextTransaction.steps.forEach((step, index) => {
+        var _a3, _b3;
+        if (step instanceof import_transform9.RemoveMarkStep) {
+          const newStart = mapping.slice(index).map(step.from, -1);
+          const newEnd = mapping.slice(index).map(step.to);
+          const oldStart = mapping.invert().map(newStart, -1);
+          const oldEnd = mapping.invert().map(newEnd);
+          const foundBeforeMark = (_a3 = nextTransaction.doc.nodeAt(newStart - 1)) == null ? void 0 : _a3.marks.some((mark) => mark.eq(step.mark));
+          const foundAfterMark = (_b3 = nextTransaction.doc.nodeAt(newEnd)) == null ? void 0 : _b3.marks.some((mark) => mark.eq(step.mark));
+          this.editor.emit("delete", {
+            type: "mark",
+            mark: step.mark,
+            from: step.from,
+            to: step.to,
+            deletedRange: {
+              from: oldStart,
+              to: oldEnd
+            },
+            newRange: {
+              from: newStart,
+              to: newEnd
+            },
+            partial: Boolean(foundAfterMark || foundBeforeMark),
+            editor: this.editor,
+            transaction,
+            combinedTransform: nextTransaction
+          });
+        }
+      });
+    };
+    if ((_c = (_b = (_a = this.editor.options.coreExtensionOptions) == null ? void 0 : _a.delete) == null ? void 0 : _b.async) != null ? _c : true) {
+      setTimeout(callback, 0);
+    } else {
+      callback();
+    }
+  }
+});
 // src/extensions/drop.ts
 var import_state15 = require("@tiptap/pm/state");
 var Drop = Extension.create({
@@ -3944,6 +3998,9 @@ var Keymap = Extension.create({
       new import_state18.Plugin({
         key: new import_state18.PluginKey("clearDocument"),
         appendTransaction: (transactions, oldState, newState) => {
+          if (transactions.some((tr2) => tr2.getMeta("composition"))) {
+            return;
+          }
           const docChanges = transactions.some((transaction) => transaction.docChanged) && !oldState.doc.eq(newState.doc);
           const ignoreTr = transactions.some((transaction) => transaction.getMeta("preventClearDocument"));
           if (!docChanges || ignoreTr) {
@@ -4285,6 +4342,7 @@ function createStyleTag(style2, nonce, suffix) {
 var Editor = class extends EventEmitter {
   constructor(options = {}) {
     super();
+    this.editorView = null;
     this.isFocused = false;
     /**
      * The editor is considered initialized after the `create` event has been emitted.
@@ -4296,7 +4354,7 @@ var Editor = class extends EventEmitter {
      */
     this.instanceId = Math.random().toString(36).slice(2, 9);
     this.options = {
-      element: document.createElement("div"),
+      element: typeof document !== "undefined" ? document.createElement("div") : null,
       content: "",
       injectCSS: true,
       injectNonce: void 0,
@@ -4322,7 +4380,8 @@ var Editor = class extends EventEmitter {
         throw error;
       },
       onPaste: () => null,
-      onDrop: () => null
+      onDrop: () => null,
+      onDelete: () => null
     };
     this.isCapturingTransaction = false;
     this.capturedTransaction = null;
@@ -4333,8 +4392,6 @@ var Editor = class extends EventEmitter {
     this.on("beforeCreate", this.options.onBeforeCreate);
     this.emit("beforeCreate", { editor: this });
     this.on("contentError", this.options.onContentError);
-    this.createView();
-    this.injectCSS();
     this.on("create", this.options.onCreate);
     this.on("update", this.options.onUpdate);
     this.on("selectionUpdate", this.options.onSelectionUpdate);
@@ -4344,6 +4401,25 @@ var Editor = class extends EventEmitter {
     this.on("destroy", this.options.onDestroy);
     this.on("drop", ({ event, slice, moved }) => this.options.onDrop(event, slice, moved));
     this.on("paste", ({ event, slice }) => this.options.onPaste(event, slice));
+    this.on("delete", this.options.onDelete);
+    const initialDoc = this.createDoc();
+    const selection = resolveFocusPosition(initialDoc, this.options.autofocus);
+    this.editorState = import_state21.EditorState.create({
+      doc: initialDoc,
+      schema: this.schema,
+      selection: selection || void 0
+    });
+    if (this.options.element) {
+      this.mount(this.options.element);
+    }
+  }
+  mount(el) {
+    if (typeof document === "undefined") {
+      throw new Error(
+        `[tiptap error]: The editor cannot be mounted because there is no 'document' defined in this environment.`
+      );
+    }
+    this.createView(el);
     window.setTimeout(() => {
       if (this.isDestroyed) {
         return;
@@ -4381,7 +4457,7 @@ var Editor = class extends EventEmitter {
    * Inject CSS styles.
    */
   injectCSS() {
-    if (this.options.injectCSS && document) {
+    if (this.options.injectCSS && typeof document !== "undefined") {
       this.css = createStyleTag(style, this.options.injectNonce);
     }
   }
@@ -4395,7 +4471,7 @@ var Editor = class extends EventEmitter {
       ...this.options,
       ...options
     };
-    if (!this.view || !this.state || this.isDestroyed) {
+    if (!this.editorView || !this.state || this.isDestroyed) {
       return;
     }
     if (this.options.editorProps) {
@@ -4418,11 +4494,50 @@ var Editor = class extends EventEmitter {
   get isEditable() {
     return this.options.editable && this.view && this.view.editable;
   }
+  /**
+   * Returns the editor state.
+   */
+  get view() {
+    if (this.editorView) {
+      return this.editorView;
+    }
+    return new Proxy(
+      {
+        state: this.editorState,
+        updateState: (state) => {
+          this.editorState = state;
+        },
+        dispatch: (tr) => {
+          this.editorState = this.state.apply(tr);
+        },
+        // Stub some commonly accessed properties to prevent errors
+        composing: false,
+        dragging: null,
+        editable: true
+      },
+      {
+        get: (obj, key) => {
+          if (key === "state") {
+            return this.editorState;
+          }
+          if (key in obj) {
+            return Reflect.get(obj, key);
+          }
+          throw new Error(
+            `[tiptap error]: The editor view is not available. Cannot access view['${key}']. The editor may not be mounted yet.`
+          );
+        }
+      }
+    );
+  }
   /**
    * Returns the editor state.
    */
   get state() {
-    return this.view.state;
+    if (this.editorView) {
+      this.editorState = this.view.state;
+    }
+    return this.editorState;
   }
   /**
    * Register a ProseMirror plugin.
@@ -4477,7 +4592,8 @@ var Editor = class extends EventEmitter {
       Keymap,
       Tabindex,
       Drop,
-      Paste
+      Paste,
+      Delete
     ].filter((ext) => {
       if (typeof this.options.enableCoreExtensions === "object") {
         return this.options.enableCoreExtensions[ext.name] !== false;
@@ -4504,10 +4620,9 @@ var Editor = class extends EventEmitter {
     this.schema = this.extensionManager.schema;
   }
   /**
-   * Creates a ProseMirror view.
+   * Creates the initial document.
    */
-  createView() {
-    var _a;
+  createDoc() {
     let doc;
     try {
       doc = createDocument(this.options.content, this.schema, this.options.parseOptions, {
@@ -4521,7 +4636,8 @@ var Editor = class extends EventEmitter {
         editor: this,
         error: e,
         disableCollaboration: () => {
-          if (this.storage.collaboration) {
+          if ("collaboration" in this.storage && typeof this.storage.collaboration === "object" && this.storage.collaboration) {
+            ;
             this.storage.collaboration.isDisabled = true;
           }
           this.options.extensions = this.options.extensions.filter((extension) => extension.name !== "collaboration");
@@ -4532,8 +4648,14 @@ var Editor = class extends EventEmitter {
         errorOnInvalidContent: false
       });
     }
-    const selection = resolveFocusPosition(doc, this.options.autofocus);
-    this.view = new import_view.EditorView(this.options.element, {
+    return doc;
+  }
+  /**
+   * Creates a ProseMirror view.
+   */
+  createView(element) {
+    var _a;
+    this.editorView = new import_view.EditorView(element, {
       ...this.options.editorProps,
       attributes: {
         // add `role="textbox"` to the editor element
@@ -4541,10 +4663,7 @@ var Editor = class extends EventEmitter {
         ...(_a = this.options.editorProps) == null ? void 0 : _a.attributes
       },
       dispatchTransaction: this.dispatchTransaction.bind(this),
-      state: import_state21.EditorState.create({
-        doc,
-        selection: selection || void 0
-      })
+      state: this.editorState
     });
     const newState = this.state.reconfigure({
       plugins: this.extensionManager.plugins
@@ -4552,6 +4671,7 @@ var Editor = class extends EventEmitter {
     this.view.updateState(newState);
     this.createNodeViews();
     this.prependClass();
+    this.injectCSS();
     const dom = this.view.dom;
     dom.editor = this;
   }
@@ -4563,6 +4683,7 @@ var Editor = class extends EventEmitter {
       return;
     }
     this.view.setProps({
+      markViews: this.extensionManager.markViews,
       nodeViews: this.extensionManager.nodeViews
     });
   }
@@ -4699,12 +4820,12 @@ var Editor = class extends EventEmitter {
    */
   destroy() {
     this.emit("destroy");
-    if (this.view) {
-      const dom = this.view.dom;
+    if (this.editorView) {
+      const dom = this.editorView.dom;
       if (dom && dom.editor) {
         delete dom.editor;
       }
-      this.view.destroy();
+      this.editorView.destroy();
     }
     this.removeAllListeners();
   }
@@ -4838,7 +4959,7 @@ function textInputRule(config) {
 }
 // src/inputRules/wrappingInputRule.ts
-var import_transform9 = require("@tiptap/pm/transform");
+var import_transform10 = require("@tiptap/pm/transform");
 function wrappingInputRule(config) {
   return new InputRule({
     find: config.find,
@@ -4847,7 +4968,7 @@ function wrappingInputRule(config) {
       const tr = state.tr.delete(range.from, range.to);
       const $start = tr.doc.resolve(range.from);
       const blockRange = $start.blockRange();
-      const wrapping = blockRange && (0, import_transform9.findWrapping)(blockRange, config.type, attributes);
+      const wrapping = blockRange && (0, import_transform10.findWrapping)(blockRange, config.type, attributes);
       if (!wrapping) {
         return null;
       }
@@ -4866,97 +4987,95 @@ function wrappingInputRule(config) {
         chain().updateAttributes(nodeType, attributes).run();
       }
       const before = tr.doc.resolve(range.from - 1).nodeBefore;
-      if (before && before.type === config.type && (0, import_transform9.canJoin)(tr.doc, range.from - 1) && (!config.joinPredicate || config.joinPredicate(match, before))) {
+      if (before && before.type === config.type && (0, import_transform10.canJoin)(tr.doc, range.from - 1) && (!config.joinPredicate || config.joinPredicate(match, before))) {
         tr.join(range.from - 1);
       }
     }
   });
 }
-// src/Node.ts
-var Node3 = class _Node {
-  constructor(config = {}) {
-    this.type = "node";
-    this.name = "node";
-    this.parent = null;
-    this.child = null;
-    this.config = {
-      name: this.name,
-      defaultOptions: {}
-    };
-    this.config = {
-      ...this.config,
-      ...config
-    };
-    this.name = this.config.name;
-    if (config.defaultOptions && Object.keys(config.defaultOptions).length > 0) {
-      console.warn(
-        `[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${this.name}".`
-      );
+// src/jsx-runtime.ts
+function Fragment7(props) {
+  return props.children;
+}
+var h = (tag, attributes) => {
+  if (tag === "slot") {
+    return 0;
+  }
+  if (tag instanceof Function) {
+    return tag(attributes);
+  }
+  const { children, ...rest } = attributes != null ? attributes : {};
+  if (tag === "svg") {
+    throw new Error("SVG elements are not supported in the JSX syntax, use the array syntax instead");
+  }
+  return [tag, rest, children];
+};
+// src/utilities/escapeForRegEx.ts
+function escapeForRegEx(string) {
+  return string.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&");
+}
+// src/utilities/isString.ts
+function isString(value) {
+  return typeof value === "string";
+}
+// src/MarkView.ts
+var MarkView = class {
+  constructor(component, props, options) {
+    this.component = component;
+    this.editor = props.editor;
+    this.options = { ...options };
+    this.mark = props.mark;
+    this.HTMLAttributes = props.HTMLAttributes;
+  }
+  get dom() {
+    return this.editor.view.dom;
+  }
+  get contentDOM() {
+    return null;
+  }
+  ignoreMutation(mutation) {
+    if (!this.dom || !this.contentDOM) {
+      return true;
     }
-    this.options = this.config.defaultOptions;
-    if (this.config.addOptions) {
-      this.options = callOrReturn(
-        getExtensionField(this, "addOptions", {
-          name: this.name
-        })
-      );
+    if (typeof this.options.ignoreMutation === "function") {
+      return this.options.ignoreMutation({ mutation });
     }
-    this.storage = callOrReturn(
-      getExtensionField(this, "addStorage", {
-        name: this.name,
-        options: this.options
-      })
-    ) || {};
+    if (mutation.type === "selection") {
+      return false;
+    }
+    if (this.dom.contains(mutation.target) && mutation.type === "childList" && (isiOS() || isAndroid()) && this.editor.isFocused) {
+      const changedNodes = [...Array.from(mutation.addedNodes), ...Array.from(mutation.removedNodes)];
+      if (changedNodes.every((node) => node.isContentEditable)) {
+        return false;
+      }
+    }
+    if (this.contentDOM === mutation.target && mutation.type === "attributes") {
+      return true;
+    }
+    if (this.contentDOM.contains(mutation.target)) {
+      return false;
+    }
+    return true;
+  }
+};
+// src/Node.ts
+var Node3 = class _Node extends Extendable {
+  constructor() {
+    super(...arguments);
+    this.type = "node";
   }
   static create(config = {}) {
     return new _Node(config);
   }
-  configure(options = {}) {
-    const extension = this.extend({
-      ...this.config,
-      addOptions: () => {
-        return mergeDeep(this.options, options);
-      }
-    });
-    extension.name = this.name;
-    extension.parent = this.parent;
-    return extension;
-  }
-  extend(extendedConfig = {}) {
-    const extension = new _Node(extendedConfig);
-    extension.parent = this;
-    this.child = extension;
-    extension.name = extendedConfig.name ? extendedConfig.name : extension.parent.name;
-    if (extendedConfig.defaultOptions && Object.keys(extendedConfig.defaultOptions).length > 0) {
-      console.warn(
-        `[tiptap warn]: BREAKING CHANGE: "defaultOptions" is deprecated. Please use "addOptions" instead. Found in extension: "${extension.name}".`
-      );
-    }
-    extension.options = callOrReturn(
-      getExtensionField(extension, "addOptions", {
-        name: extension.name
-      })
-    );
-    extension.storage = callOrReturn(
-      getExtensionField(extension, "addStorage", {
-        name: extension.name,
-        options: extension.options
-      })
-    );
-    return extension;
-  }
 };
 // src/NodeView.ts
 var import_state22 = require("@tiptap/pm/state");
-// src/utilities/isAndroid.ts
-function isAndroid() {
-  return navigator.platform === "Android" || /android/i.test(navigator.userAgent);
-}
-// src/NodeView.ts
 var NodeView = class {
   constructor(component, props, options) {
     this.isDragging = false;
@@ -5178,16 +5297,6 @@ function markPasteRule(config) {
   });
 }
-// src/utilities/escapeForRegEx.ts
-function escapeForRegEx(string) {
-  return string.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&");
-}
-// src/utilities/isString.ts
-function isString(value) {
-  return typeof value === "string";
-}
 // src/pasteRules/nodePasteRule.ts
 function nodePasteRule(config) {
   return new PasteRule({
@@ -5258,8 +5367,10 @@ var Tracker = class {
   CommandManager,
   Editor,
   Extension,
+  Fragment,
   InputRule,
   Mark,
+  MarkView,
   Node,
   NodePos,
   NodeView,
@@ -5269,6 +5380,7 @@ var Tracker = class {
   combineTransactionSteps,
   createChainableState,
   createDocument,
+  createElement,
   createNodeFromContent,
   createStyleTag,
   defaultBlockAt,
@@ -5309,9 +5421,11 @@ var Tracker = class {
   getTextBetween,
   getTextContentFromNodes,
   getTextSerializersFromSchema,
+  h,
   injectExtensionAttributesToParseRule,
   inputRulesPlugin,
   isActive,
+  isAndroid,
   isAtEndOfNode,
   isAtStartOfNode,
   isEmptyObject,