@sethumadhavan004/ink-editor 0.0.1

package/dist/index.mjs

@@ -0,0 +1,2646 @@
+// src/InkEditor.tsx
+import { useEditor } from "@tiptap/react";
+import StarterKit from "@tiptap/starter-kit";
+import TextAlign from "@tiptap/extension-text-align";
+import Underline2 from "@tiptap/extension-underline";
+import { useEffect as useEffect4, useState as useState2 } from "react";
+
+// node_modules/@tiptap/core/dist/index.js
+import { Plugin, PluginKey, TextSelection, Selection, AllSelection, NodeSelection, EditorState } from "@tiptap/pm/state";
+import { EditorView } from "@tiptap/pm/view";
+import { keymap } from "@tiptap/pm/keymap";
+import { Schema, DOMSerializer, Fragment, Node as Node$1, DOMParser, Slice } from "@tiptap/pm/model";
+import { liftTarget, ReplaceStep, ReplaceAroundStep, joinPoint, Transform, canSplit, canJoin, findWrapping } from "@tiptap/pm/transform";
+import { createParagraphNear as createParagraphNear$1, deleteSelection as deleteSelection$1, exitCode as exitCode$1, joinUp as joinUp$1, joinDown as joinDown$1, joinBackward as joinBackward$1, joinForward as joinForward$1, joinTextblockBackward as joinTextblockBackward$1, joinTextblockForward as joinTextblockForward$1, lift as lift$1, liftEmptyBlock as liftEmptyBlock$1, newlineInCode as newlineInCode$1, selectNodeBackward as selectNodeBackward$1, selectNodeForward as selectNodeForward$1, selectParentNode as selectParentNode$1, selectTextblockEnd as selectTextblockEnd$1, selectTextblockStart as selectTextblockStart$1, setBlockType, wrapIn as wrapIn$1 } from "@tiptap/pm/commands";
+import { liftListItem as liftListItem$1, sinkListItem as sinkListItem$1, wrapInList as wrapInList$1 } from "@tiptap/pm/schema-list";
+function createChainableState(config) {
+  const { state, transaction } = config;
+  let { selection } = transaction;
+  let { doc } = transaction;
+  let { storedMarks } = transaction;
+  return {
+    ...state,
+    apply: state.apply.bind(state),
+    applyTransaction: state.applyTransaction.bind(state),
+    plugins: state.plugins,
+    schema: state.schema,
+    reconfigure: state.reconfigure.bind(state),
+    toJSON: state.toJSON.bind(state),
+    get storedMarks() {
+      return storedMarks;
+    },
+    get selection() {
+      return selection;
+    },
+    get doc() {
+      return doc;
+    },
+    get tr() {
+      selection = transaction.selection;
+      doc = transaction.doc;
+      storedMarks = transaction.storedMarks;
+      return transaction;
+    }
+  };
+}
+var CommandManager = class {
+  constructor(props) {
+    this.editor = props.editor;
+    this.rawCommands = this.editor.extensionManager.commands;
+    this.customState = props.state;
+  }
+  get hasCustomState() {
+    return !!this.customState;
+  }
+  get state() {
+    return this.customState || this.editor.state;
+  }
+  get commands() {
+    const { rawCommands, editor, state } = this;
+    const { view } = editor;
+    const { tr } = state;
+    const props = this.buildProps(tr);
+    return Object.fromEntries(Object.entries(rawCommands).map(([name, command2]) => {
+      const method = (...args) => {
+        const callback = command2(...args)(props);
+        if (!tr.getMeta("preventDispatch") && !this.hasCustomState) {
+          view.dispatch(tr);
+        }
+        return callback;
+      };
+      return [name, method];
+    }));
+  }
+  get chain() {
+    return () => this.createChain();
+  }
+  get can() {
+    return () => this.createCan();
+  }
+  createChain(startTr, shouldDispatch = true) {
+    const { rawCommands, editor, state } = this;
+    const { view } = editor;
+    const callbacks = [];
+    const hasStartTransaction = !!startTr;
+    const tr = startTr || state.tr;
+    const run = () => {
+      if (!hasStartTransaction && shouldDispatch && !tr.getMeta("preventDispatch") && !this.hasCustomState) {
+        view.dispatch(tr);
+      }
+      return callbacks.every((callback) => callback === true);
+    };
+    const chain = {
+      ...Object.fromEntries(Object.entries(rawCommands).map(([name, command2]) => {
+        const chainedCommand = (...args) => {
+          const props = this.buildProps(tr, shouldDispatch);
+          const callback = command2(...args)(props);
+          callbacks.push(callback);
+          return chain;
+        };
+        return [name, chainedCommand];
+      })),
+      run
+    };
+    return chain;
+  }
+  createCan(startTr) {
+    const { rawCommands, state } = this;
+    const dispatch = false;
+    const tr = startTr || state.tr;
+    const props = this.buildProps(tr, dispatch);
+    const formattedCommands = Object.fromEntries(Object.entries(rawCommands).map(([name, command2]) => {
+      return [name, (...args) => command2(...args)({ ...props, dispatch: void 0 })];
+    }));
+    return {
+      ...formattedCommands,
+      chain: () => this.createChain(tr, dispatch)
+    };
+  }
+  buildProps(tr, shouldDispatch = true) {
+    const { rawCommands, editor, state } = this;
+    const { view } = editor;
+    const props = {
+      tr,
+      editor,
+      view,
+      state: createChainableState({
+        state,
+        transaction: tr
+      }),
+      dispatch: shouldDispatch ? () => void 0 : void 0,
+      chain: () => this.createChain(tr, shouldDispatch),
+      can: () => this.createCan(tr),
+      get commands() {
+        return Object.fromEntries(Object.entries(rawCommands).map(([name, command2]) => {
+          return [name, (...args) => command2(...args)(props)];
+        }));
+      }
+    };
+    return props;
+  }
+};
+function getExtensionField(extension, field, context) {
+  if (extension.config[field] === void 0 && extension.parent) {
+    return getExtensionField(extension.parent, field, context);
+  }
+  if (typeof extension.config[field] === "function") {
+    const value = extension.config[field].bind({
+      ...context,
+      parent: extension.parent ? getExtensionField(extension.parent, field, context) : null
+    });
+    return value;
+  }
+  return extension.config[field];
+}
+function splitExtensions(extensions) {
+  const baseExtensions = extensions.filter((extension) => extension.type === "extension");
+  const nodeExtensions = extensions.filter((extension) => extension.type === "node");
+  const markExtensions = extensions.filter((extension) => extension.type === "mark");
+  return {
+    baseExtensions,
+    nodeExtensions,
+    markExtensions
+  };
+}
+function getNodeType(nameOrType, schema) {
+  if (typeof nameOrType === "string") {
+    if (!schema.nodes[nameOrType]) {
+      throw Error(`There is no node type named '${nameOrType}'. Maybe you forgot to add the extension?`);
+    }
+    return schema.nodes[nameOrType];
+  }
+  return nameOrType;
+}
+function isFunction(value) {
+  return typeof value === "function";
+}
+function callOrReturn(value, context = void 0, ...props) {
+  if (isFunction(value)) {
+    if (context) {
+      return value.bind(context)(...props);
+    }
+    return value(...props);
+  }
+  return value;
+}
+function isRegExp(value) {
+  return Object.prototype.toString.call(value) === "[object RegExp]";
+}
+function getType(value) {
+  return Object.prototype.toString.call(value).slice(8, -1);
+}
+function isPlainObject(value) {
+  if (getType(value) !== "Object") {
+    return false;
+  }
+  return value.constructor === Object && Object.getPrototypeOf(value) === Object.prototype;
+}
+function mergeDeep(target, source) {
+  const output = { ...target };
+  if (isPlainObject(target) && isPlainObject(source)) {
+    Object.keys(source).forEach((key) => {
+      if (isPlainObject(source[key]) && isPlainObject(target[key])) {
+        output[key] = mergeDeep(target[key], source[key]);
+      } else {
+        output[key] = source[key];
+      }
+    });
+  }
+  return output;
+}
+var Extension = class _Extension {
+  constructor(config = {}) {
+    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;
+  }
+};
+function getTextBetween(startNode, range, options) {
+  const { from, to } = range;
+  const { blockSeparator = "\n\n", textSerializers = {} } = options || {};
+  let text = "";
+  startNode.nodesBetween(from, to, (node, pos, parent, index) => {
+    var _a;
+    if (node.isBlock && pos > from) {
+      text += blockSeparator;
+    }
+    const textSerializer = textSerializers === null || textSerializers === void 0 ? void 0 : textSerializers[node.type.name];
+    if (textSerializer) {
+      if (parent) {
+        text += textSerializer({
+          node,
+          pos,
+          parent,
+          index,
+          range
+        });
+      }
+      return false;
+    }
+    if (node.isText) {
+      text += (_a = node === null || node === void 0 ? void 0 : node.text) === null || _a === void 0 ? void 0 : _a.slice(Math.max(from, pos) - pos, to - pos);
+    }
+  });
+  return text;
+}
+function getTextSerializersFromSchema(schema) {
+  return Object.fromEntries(Object.entries(schema.nodes).filter(([, node]) => node.spec.toText).map(([name, node]) => [name, node.spec.toText]));
+}
+var ClipboardTextSerializer = Extension.create({
+  name: "clipboardTextSerializer",
+  addOptions() {
+    return {
+      blockSeparator: void 0
+    };
+  },
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey("clipboardTextSerializer"),
+        props: {
+          clipboardTextSerializer: () => {
+            const { editor } = this;
+            const { state, schema } = editor;
+            const { doc, selection } = state;
+            const { ranges } = selection;
+            const from = Math.min(...ranges.map((range2) => range2.$from.pos));
+            const to = Math.max(...ranges.map((range2) => range2.$to.pos));
+            const textSerializers = getTextSerializersFromSchema(schema);
+            const range = { from, to };
+            return getTextBetween(doc, range, {
+              ...this.options.blockSeparator !== void 0 ? { blockSeparator: this.options.blockSeparator } : {},
+              textSerializers
+            });
+          }
+        }
+      })
+    ];
+  }
+});
+var blur = () => ({ editor, view }) => {
+  requestAnimationFrame(() => {
+    var _a;
+    if (!editor.isDestroyed) {
+      view.dom.blur();
+      (_a = window === null || window === void 0 ? void 0 : window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
+    }
+  });
+  return true;
+};
+var clearContent = (emitUpdate = false) => ({ commands: commands2 }) => {
+  return commands2.setContent("", emitUpdate);
+};
+var clearNodes = () => ({ state, tr, dispatch }) => {
+  const { selection } = tr;
+  const { ranges } = selection;
+  if (!dispatch) {
+    return true;
+  }
+  ranges.forEach(({ $from, $to }) => {
+    state.doc.nodesBetween($from.pos, $to.pos, (node, pos) => {
+      if (node.type.isText) {
+        return;
+      }
+      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 = liftTarget(nodeRange);
+      if (node.type.isTextblock) {
+        const { defaultType } = $mappedFrom.parent.contentMatchAt($mappedFrom.index());
+        tr.setNodeMarkup(nodeRange.start, defaultType);
+      }
+      if (targetLiftDepth || targetLiftDepth === 0) {
+        tr.lift(nodeRange, targetLiftDepth);
+      }
+    });
+  });
+  return true;
+};
+var command = (fn) => (props) => {
+  return fn(props);
+};
+var createParagraphNear = () => ({ state, dispatch }) => {
+  return createParagraphNear$1(state, dispatch);
+};
+var cut = (originRange, targetPos) => ({ editor, tr }) => {
+  const { state } = editor;
+  const contentSlice = state.doc.slice(originRange.from, originRange.to);
+  tr.deleteRange(originRange.from, originRange.to);
+  const newPos = tr.mapping.map(targetPos);
+  tr.insert(newPos, contentSlice.content);
+  tr.setSelection(new TextSelection(tr.doc.resolve(Math.max(newPos - 1, 0))));
+  return true;
+};
+var deleteCurrentNode = () => ({ tr, dispatch }) => {
+  const { selection } = tr;
+  const currentNode = selection.$anchor.node();
+  if (currentNode.content.size > 0) {
+    return false;
+  }
+  const $pos = tr.selection.$anchor;
+  for (let depth = $pos.depth; depth > 0; depth -= 1) {
+    const node = $pos.node(depth);
+    if (node.type === currentNode.type) {
+      if (dispatch) {
+        const from = $pos.before(depth);
+        const to = $pos.after(depth);
+        tr.delete(from, to).scrollIntoView();
+      }
+      return true;
+    }
+  }
+  return false;
+};
+var deleteNode = (typeOrName) => ({ tr, state, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  const $pos = tr.selection.$anchor;
+  for (let depth = $pos.depth; depth > 0; depth -= 1) {
+    const node = $pos.node(depth);
+    if (node.type === type) {
+      if (dispatch) {
+        const from = $pos.before(depth);
+        const to = $pos.after(depth);
+        tr.delete(from, to).scrollIntoView();
+      }
+      return true;
+    }
+  }
+  return false;
+};
+var deleteRange = (range) => ({ tr, dispatch }) => {
+  const { from, to } = range;
+  if (dispatch) {
+    tr.delete(from, to);
+  }
+  return true;
+};
+var deleteSelection = () => ({ state, dispatch }) => {
+  return deleteSelection$1(state, dispatch);
+};
+var enter = () => ({ commands: commands2 }) => {
+  return commands2.keyboardShortcut("Enter");
+};
+var exitCode = () => ({ state, dispatch }) => {
+  return exitCode$1(state, dispatch);
+};
+function objectIncludes(object1, object2, options = { strict: true }) {
+  const keys = Object.keys(object2);
+  if (!keys.length) {
+    return true;
+  }
+  return keys.every((key) => {
+    if (options.strict) {
+      return object2[key] === object1[key];
+    }
+    if (isRegExp(object2[key])) {
+      return object2[key].test(object1[key]);
+    }
+    return object2[key] === object1[key];
+  });
+}
+function findMarkInSet(marks, type, attributes = {}) {
+  return marks.find((item) => {
+    return item.type === type && objectIncludes(
+      // Only check equality for the attributes that are provided
+      Object.fromEntries(Object.keys(attributes).map((k) => [k, item.attrs[k]])),
+      attributes
+    );
+  });
+}
+function isMarkInSet(marks, type, attributes = {}) {
+  return !!findMarkInSet(marks, type, attributes);
+}
+function getMarkRange($pos, type, attributes) {
+  var _a;
+  if (!$pos || !type) {
+    return;
+  }
+  let start = $pos.parent.childAfter($pos.parentOffset);
+  if (!start.node || !start.node.marks.some((mark2) => mark2.type === type)) {
+    start = $pos.parent.childBefore($pos.parentOffset);
+  }
+  if (!start.node || !start.node.marks.some((mark2) => mark2.type === type)) {
+    return;
+  }
+  attributes = attributes || ((_a = start.node.marks[0]) === null || _a === void 0 ? void 0 : _a.attrs);
+  const mark = findMarkInSet([...start.node.marks], type, attributes);
+  if (!mark) {
+    return;
+  }
+  let startIndex = start.index;
+  let startPos = $pos.start() + start.offset;
+  let endIndex = startIndex + 1;
+  let endPos = startPos + start.node.nodeSize;
+  while (startIndex > 0 && isMarkInSet([...$pos.parent.child(startIndex - 1).marks], type, attributes)) {
+    startIndex -= 1;
+    startPos -= $pos.parent.child(startIndex).nodeSize;
+  }
+  while (endIndex < $pos.parent.childCount && isMarkInSet([...$pos.parent.child(endIndex).marks], type, attributes)) {
+    endPos += $pos.parent.child(endIndex).nodeSize;
+    endIndex += 1;
+  }
+  return {
+    from: startPos,
+    to: endPos
+  };
+}
+function getMarkType(nameOrType, schema) {
+  if (typeof nameOrType === "string") {
+    if (!schema.marks[nameOrType]) {
+      throw Error(`There is no mark type named '${nameOrType}'. Maybe you forgot to add the extension?`);
+    }
+    return schema.marks[nameOrType];
+  }
+  return nameOrType;
+}
+var extendMarkRange = (typeOrName, attributes = {}) => ({ tr, state, dispatch }) => {
+  const type = getMarkType(typeOrName, state.schema);
+  const { doc, selection } = tr;
+  const { $from, from, to } = selection;
+  if (dispatch) {
+    const range = getMarkRange($from, type, attributes);
+    if (range && range.from <= from && range.to >= to) {
+      const newSelection = TextSelection.create(doc, range.from, range.to);
+      tr.setSelection(newSelection);
+    }
+  }
+  return true;
+};
+var first = (commands2) => (props) => {
+  const items = typeof commands2 === "function" ? commands2(props) : commands2;
+  for (let i = 0; i < items.length; i += 1) {
+    if (items[i](props)) {
+      return true;
+    }
+  }
+  return false;
+};
+function isTextSelection(value) {
+  return value instanceof TextSelection;
+}
+function minMax(value = 0, min = 0, max = 0) {
+  return Math.min(Math.max(value, min), max);
+}
+function resolveFocusPosition(doc, position = null) {
+  if (!position) {
+    return null;
+  }
+  const selectionAtStart = Selection.atStart(doc);
+  const selectionAtEnd = Selection.atEnd(doc);
+  if (position === "start" || position === true) {
+    return selectionAtStart;
+  }
+  if (position === "end") {
+    return selectionAtEnd;
+  }
+  const minPos = selectionAtStart.from;
+  const maxPos = selectionAtEnd.to;
+  if (position === "all") {
+    return TextSelection.create(doc, minMax(0, minPos, maxPos), minMax(doc.content.size, minPos, maxPos));
+  }
+  return TextSelection.create(doc, minMax(position, minPos, maxPos), minMax(position, minPos, maxPos));
+}
+function isAndroid() {
+  return navigator.platform === "Android" || /android/i.test(navigator.userAgent);
+}
+function isiOS() {
+  return [
+    "iPad Simulator",
+    "iPhone Simulator",
+    "iPod Simulator",
+    "iPad",
+    "iPhone",
+    "iPod"
+  ].includes(navigator.platform) || navigator.userAgent.includes("Mac") && "ontouchend" in document;
+}
+function isSafari() {
+  return typeof navigator !== "undefined" ? /^((?!chrome|android).)*safari/i.test(navigator.userAgent) : false;
+}
+var focus = (position = null, options = {}) => ({ editor, view, tr, dispatch }) => {
+  options = {
+    scrollIntoView: true,
+    ...options
+  };
+  const delayedFocus = () => {
+    if (isiOS() || isAndroid()) {
+      view.dom.focus();
+    }
+    requestAnimationFrame(() => {
+      if (!editor.isDestroyed) {
+        view.focus();
+        if (isSafari() && !isiOS() && !isAndroid()) {
+          view.dom.focus({ preventScroll: true });
+        }
+      }
+    });
+  };
+  if (view.hasFocus() && position === null || position === false) {
+    return true;
+  }
+  if (dispatch && position === null && !isTextSelection(editor.state.selection)) {
+    delayedFocus();
+    return true;
+  }
+  const selection = resolveFocusPosition(tr.doc, position) || editor.state.selection;
+  const isSameSelection = editor.state.selection.eq(selection);
+  if (dispatch) {
+    if (!isSameSelection) {
+      tr.setSelection(selection);
+    }
+    if (isSameSelection && tr.storedMarks) {
+      tr.setStoredMarks(tr.storedMarks);
+    }
+    delayedFocus();
+  }
+  return true;
+};
+var forEach = (items, fn) => (props) => {
+  return items.every((item, index) => fn(item, { ...props, index }));
+};
+var insertContent = (value, options) => ({ tr, commands: commands2 }) => {
+  return commands2.insertContentAt({ from: tr.selection.from, to: tr.selection.to }, value, options);
+};
+var removeWhitespaces = (node) => {
+  const children = node.childNodes;
+  for (let i = children.length - 1; i >= 0; i -= 1) {
+    const child = children[i];
+    if (child.nodeType === 3 && child.nodeValue && /^(\n\s\s|\n)$/.test(child.nodeValue)) {
+      node.removeChild(child);
+    } else if (child.nodeType === 1) {
+      removeWhitespaces(child);
+    }
+  }
+  return node;
+};
+function elementFromString(value) {
+  const wrappedValue = `<body>${value}</body>`;
+  const html = new window.DOMParser().parseFromString(wrappedValue, "text/html").body;
+  return removeWhitespaces(html);
+}
+function createNodeFromContent(content, schema, options) {
+  if (content instanceof Node$1 || content instanceof Fragment) {
+    return content;
+  }
+  options = {
+    slice: true,
+    parseOptions: {},
+    ...options
+  };
+  const isJSONContent = typeof content === "object" && content !== null;
+  const isTextContent = typeof content === "string";
+  if (isJSONContent) {
+    try {
+      const isArrayContent = Array.isArray(content) && content.length > 0;
+      if (isArrayContent) {
+        return Fragment.fromArray(content.map((item) => schema.nodeFromJSON(item)));
+      }
+      const node = schema.nodeFromJSON(content);
+      if (options.errorOnInvalidContent) {
+        node.check();
+      }
+      return node;
+    } catch (error) {
+      if (options.errorOnInvalidContent) {
+        throw new Error("[tiptap error]: Invalid JSON content", { cause: error });
+      }
+      console.warn("[tiptap warn]: Invalid content.", "Passed value:", content, "Error:", error);
+      return createNodeFromContent("", schema, options);
+    }
+  }
+  if (isTextContent) {
+    if (options.errorOnInvalidContent) {
+      let hasInvalidContent = false;
+      let invalidContent = "";
+      const contentCheckSchema = new Schema({
+        topNode: schema.spec.topNode,
+        marks: schema.spec.marks,
+        // Prosemirror's schemas are executed such that: the last to execute, matches last
+        // This means that we can add a catch-all node at the end of the schema to catch any content that we don't know how to handle
+        nodes: schema.spec.nodes.append({
+          __tiptap__private__unknown__catch__all__node: {
+            content: "inline*",
+            group: "block",
+            parseDOM: [
+              {
+                tag: "*",
+                getAttrs: (e) => {
+                  hasInvalidContent = true;
+                  invalidContent = typeof e === "string" ? e : e.outerHTML;
+                  return null;
+                }
+              }
+            ]
+          }
+        })
+      });
+      if (options.slice) {
+        DOMParser.fromSchema(contentCheckSchema).parseSlice(elementFromString(content), options.parseOptions);
+      } else {
+        DOMParser.fromSchema(contentCheckSchema).parse(elementFromString(content), options.parseOptions);
+      }
+      if (options.errorOnInvalidContent && hasInvalidContent) {
+        throw new Error("[tiptap error]: Invalid HTML content", { cause: new Error(`Invalid element found: ${invalidContent}`) });
+      }
+    }
+    const parser = DOMParser.fromSchema(schema);
+    if (options.slice) {
+      return parser.parseSlice(elementFromString(content), options.parseOptions).content;
+    }
+    return parser.parse(elementFromString(content), options.parseOptions);
+  }
+  return createNodeFromContent("", schema, options);
+}
+function selectionToInsertionEnd(tr, startLen, bias) {
+  const last = tr.steps.length - 1;
+  if (last < startLen) {
+    return;
+  }
+  const step = tr.steps[last];
+  if (!(step instanceof ReplaceStep || step instanceof ReplaceAroundStep)) {
+    return;
+  }
+  const map = tr.mapping.maps[last];
+  let end = 0;
+  map.forEach((_from, _to, _newFrom, newTo) => {
+    if (end === 0) {
+      end = newTo;
+    }
+  });
+  tr.setSelection(Selection.near(tr.doc.resolve(end), bias));
+}
+var isFragment = (nodeOrFragment) => {
+  return !("type" in nodeOrFragment);
+};
+var insertContentAt = (position, value, options) => ({ tr, dispatch, editor }) => {
+  var _a;
+  if (dispatch) {
+    options = {
+      parseOptions: editor.options.parseOptions,
+      updateSelection: true,
+      applyInputRules: false,
+      applyPasteRules: false,
+      ...options
+    };
+    let content;
+    const emitContentError = (error) => {
+      editor.emit("contentError", {
+        editor,
+        error,
+        disableCollaboration: () => {
+          if (editor.storage.collaboration) {
+            editor.storage.collaboration.isDisabled = true;
+          }
+        }
+      });
+    };
+    const parseOptions = {
+      preserveWhitespace: "full",
+      ...options.parseOptions
+    };
+    if (!options.errorOnInvalidContent && !editor.options.enableContentCheck && editor.options.emitContentError) {
+      try {
+        createNodeFromContent(value, editor.schema, {
+          parseOptions,
+          errorOnInvalidContent: true
+        });
+      } catch (e) {
+        emitContentError(e);
+      }
+    }
+    try {
+      content = createNodeFromContent(value, editor.schema, {
+        parseOptions,
+        errorOnInvalidContent: (_a = options.errorOnInvalidContent) !== null && _a !== void 0 ? _a : editor.options.enableContentCheck
+      });
+    } catch (e) {
+      emitContentError(e);
+      return false;
+    }
+    let { from, to } = typeof position === "number" ? { from: position, to: position } : { from: position.from, to: position.to };
+    let isOnlyTextContent = true;
+    let isOnlyBlockContent = true;
+    const nodes = isFragment(content) ? content : [content];
+    nodes.forEach((node) => {
+      node.check();
+      isOnlyTextContent = isOnlyTextContent ? node.isText && node.marks.length === 0 : false;
+      isOnlyBlockContent = isOnlyBlockContent ? node.isBlock : false;
+    });
+    if (from === to && isOnlyBlockContent) {
+      const { parent } = tr.doc.resolve(from);
+      const isEmptyTextBlock = parent.isTextblock && !parent.type.spec.code && !parent.childCount;
+      if (isEmptyTextBlock) {
+        from -= 1;
+        to += 1;
+      }
+    }
+    let newContent;
+    if (isOnlyTextContent) {
+      if (Array.isArray(value)) {
+        newContent = value.map((v) => v.text || "").join("");
+      } else if (value instanceof Fragment) {
+        let text = "";
+        value.forEach((node) => {
+          if (node.text) {
+            text += node.text;
+          }
+        });
+        newContent = text;
+      } else if (typeof value === "object" && !!value && !!value.text) {
+        newContent = value.text;
+      } else {
+        newContent = value;
+      }
+      tr.insertText(newContent, from, to);
+    } else {
+      newContent = content;
+      tr.replaceWith(from, to, newContent);
+    }
+    if (options.updateSelection) {
+      selectionToInsertionEnd(tr, tr.steps.length - 1, -1);
+    }
+    if (options.applyInputRules) {
+      tr.setMeta("applyInputRules", { from, text: newContent });
+    }
+    if (options.applyPasteRules) {
+      tr.setMeta("applyPasteRules", { from, text: newContent });
+    }
+  }
+  return true;
+};
+var joinUp = () => ({ state, dispatch }) => {
+  return joinUp$1(state, dispatch);
+};
+var joinDown = () => ({ state, dispatch }) => {
+  return joinDown$1(state, dispatch);
+};
+var joinBackward = () => ({ state, dispatch }) => {
+  return joinBackward$1(state, dispatch);
+};
+var joinForward = () => ({ state, dispatch }) => {
+  return joinForward$1(state, dispatch);
+};
+var joinItemBackward = () => ({ state, dispatch, tr }) => {
+  try {
+    const point = joinPoint(state.doc, state.selection.$from.pos, -1);
+    if (point === null || point === void 0) {
+      return false;
+    }
+    tr.join(point, 2);
+    if (dispatch) {
+      dispatch(tr);
+    }
+    return true;
+  } catch {
+    return false;
+  }
+};
+var joinItemForward = () => ({ state, dispatch, tr }) => {
+  try {
+    const point = joinPoint(state.doc, state.selection.$from.pos, 1);
+    if (point === null || point === void 0) {
+      return false;
+    }
+    tr.join(point, 2);
+    if (dispatch) {
+      dispatch(tr);
+    }
+    return true;
+  } catch {
+    return false;
+  }
+};
+var joinTextblockBackward = () => ({ state, dispatch }) => {
+  return joinTextblockBackward$1(state, dispatch);
+};
+var joinTextblockForward = () => ({ state, dispatch }) => {
+  return joinTextblockForward$1(state, dispatch);
+};
+function isMacOS() {
+  return typeof navigator !== "undefined" ? /Mac/.test(navigator.platform) : false;
+}
+function normalizeKeyName(name) {
+  const parts = name.split(/-(?!$)/);
+  let result = parts[parts.length - 1];
+  if (result === "Space") {
+    result = " ";
+  }
+  let alt;
+  let ctrl;
+  let shift;
+  let meta;
+  for (let i = 0; i < parts.length - 1; i += 1) {
+    const mod = parts[i];
+    if (/^(cmd|meta|m)$/i.test(mod)) {
+      meta = true;
+    } else if (/^a(lt)?$/i.test(mod)) {
+      alt = true;
+    } else if (/^(c|ctrl|control)$/i.test(mod)) {
+      ctrl = true;
+    } else if (/^s(hift)?$/i.test(mod)) {
+      shift = true;
+    } else if (/^mod$/i.test(mod)) {
+      if (isiOS() || isMacOS()) {
+        meta = true;
+      } else {
+        ctrl = true;
+      }
+    } else {
+      throw new Error(`Unrecognized modifier name: ${mod}`);
+    }
+  }
+  if (alt) {
+    result = `Alt-${result}`;
+  }
+  if (ctrl) {
+    result = `Ctrl-${result}`;
+  }
+  if (meta) {
+    result = `Meta-${result}`;
+  }
+  if (shift) {
+    result = `Shift-${result}`;
+  }
+  return result;
+}
+var keyboardShortcut = (name) => ({ editor, view, tr, dispatch }) => {
+  const keys = normalizeKeyName(name).split(/-(?!$)/);
+  const key = keys.find((item) => !["Alt", "Ctrl", "Meta", "Shift"].includes(item));
+  const event = new KeyboardEvent("keydown", {
+    key: key === "Space" ? " " : key,
+    altKey: keys.includes("Alt"),
+    ctrlKey: keys.includes("Ctrl"),
+    metaKey: keys.includes("Meta"),
+    shiftKey: keys.includes("Shift"),
+    bubbles: true,
+    cancelable: true
+  });
+  const capturedTransaction = editor.captureTransaction(() => {
+    view.someProp("handleKeyDown", (f) => f(view, event));
+  });
+  capturedTransaction === null || capturedTransaction === void 0 ? void 0 : capturedTransaction.steps.forEach((step) => {
+    const newStep = step.map(tr.mapping);
+    if (newStep && dispatch) {
+      tr.maybeStep(newStep);
+    }
+  });
+  return true;
+};
+function isNodeActive(state, typeOrName, attributes = {}) {
+  const { from, to, empty } = state.selection;
+  const type = typeOrName ? getNodeType(typeOrName, state.schema) : null;
+  const nodeRanges = [];
+  state.doc.nodesBetween(from, to, (node, pos) => {
+    if (node.isText) {
+      return;
+    }
+    const relativeFrom = Math.max(from, pos);
+    const relativeTo = Math.min(to, pos + node.nodeSize);
+    nodeRanges.push({
+      node,
+      from: relativeFrom,
+      to: relativeTo
+    });
+  });
+  const selectionRange = to - from;
+  const matchedNodeRanges = nodeRanges.filter((nodeRange) => {
+    if (!type) {
+      return true;
+    }
+    return type.name === nodeRange.node.type.name;
+  }).filter((nodeRange) => objectIncludes(nodeRange.node.attrs, attributes, { strict: false }));
+  if (empty) {
+    return !!matchedNodeRanges.length;
+  }
+  const range = matchedNodeRanges.reduce((sum, nodeRange) => sum + nodeRange.to - nodeRange.from, 0);
+  return range >= selectionRange;
+}
+var lift = (typeOrName, attributes = {}) => ({ state, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  const isActive = isNodeActive(state, type, attributes);
+  if (!isActive) {
+    return false;
+  }
+  return lift$1(state, dispatch);
+};
+var liftEmptyBlock = () => ({ state, dispatch }) => {
+  return liftEmptyBlock$1(state, dispatch);
+};
+var liftListItem = (typeOrName) => ({ state, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  return liftListItem$1(type)(state, dispatch);
+};
+var newlineInCode = () => ({ state, dispatch }) => {
+  return newlineInCode$1(state, dispatch);
+};
+function getSchemaTypeNameByName(name, schema) {
+  if (schema.nodes[name]) {
+    return "node";
+  }
+  if (schema.marks[name]) {
+    return "mark";
+  }
+  return null;
+}
+function deleteProps(obj, propOrProps) {
+  const props = typeof propOrProps === "string" ? [propOrProps] : propOrProps;
+  return Object.keys(obj).reduce((newObj, prop) => {
+    if (!props.includes(prop)) {
+      newObj[prop] = obj[prop];
+    }
+    return newObj;
+  }, {});
+}
+var resetAttributes = (typeOrName, attributes) => ({ tr, state, dispatch }) => {
+  let nodeType = null;
+  let markType = null;
+  const schemaType = getSchemaTypeNameByName(typeof typeOrName === "string" ? typeOrName : typeOrName.name, state.schema);
+  if (!schemaType) {
+    return false;
+  }
+  if (schemaType === "node") {
+    nodeType = getNodeType(typeOrName, state.schema);
+  }
+  if (schemaType === "mark") {
+    markType = getMarkType(typeOrName, state.schema);
+  }
+  if (dispatch) {
+    tr.selection.ranges.forEach((range) => {
+      state.doc.nodesBetween(range.$from.pos, range.$to.pos, (node, pos) => {
+        if (nodeType && nodeType === node.type) {
+          tr.setNodeMarkup(pos, void 0, deleteProps(node.attrs, attributes));
+        }
+        if (markType && node.marks.length) {
+          node.marks.forEach((mark) => {
+            if (markType === mark.type) {
+              tr.addMark(pos, pos + node.nodeSize, markType.create(deleteProps(mark.attrs, attributes)));
+            }
+          });
+        }
+      });
+    });
+  }
+  return true;
+};
+var scrollIntoView = () => ({ tr, dispatch }) => {
+  if (dispatch) {
+    tr.scrollIntoView();
+  }
+  return true;
+};
+var selectAll = () => ({ tr, dispatch }) => {
+  if (dispatch) {
+    const selection = new AllSelection(tr.doc);
+    tr.setSelection(selection);
+  }
+  return true;
+};
+var selectNodeBackward = () => ({ state, dispatch }) => {
+  return selectNodeBackward$1(state, dispatch);
+};
+var selectNodeForward = () => ({ state, dispatch }) => {
+  return selectNodeForward$1(state, dispatch);
+};
+var selectParentNode = () => ({ state, dispatch }) => {
+  return selectParentNode$1(state, dispatch);
+};
+var selectTextblockEnd = () => ({ state, dispatch }) => {
+  return selectTextblockEnd$1(state, dispatch);
+};
+var selectTextblockStart = () => ({ state, dispatch }) => {
+  return selectTextblockStart$1(state, dispatch);
+};
+function createDocument(content, schema, parseOptions = {}, options = {}) {
+  return createNodeFromContent(content, schema, {
+    slice: false,
+    parseOptions,
+    errorOnInvalidContent: options.errorOnInvalidContent
+  });
+}
+var setContent = (content, emitUpdate = false, parseOptions = {}, options = {}) => ({ editor, tr, dispatch, commands: commands2 }) => {
+  var _a, _b;
+  const { doc } = tr;
+  if (parseOptions.preserveWhitespace !== "full") {
+    const document2 = createDocument(content, editor.schema, parseOptions, {
+      errorOnInvalidContent: (_a = options.errorOnInvalidContent) !== null && _a !== void 0 ? _a : editor.options.enableContentCheck
+    });
+    if (dispatch) {
+      tr.replaceWith(0, doc.content.size, document2).setMeta("preventUpdate", !emitUpdate);
+    }
+    return true;
+  }
+  if (dispatch) {
+    tr.setMeta("preventUpdate", !emitUpdate);
+  }
+  return commands2.insertContentAt({ from: 0, to: doc.content.size }, content, {
+    parseOptions,
+    errorOnInvalidContent: (_b = options.errorOnInvalidContent) !== null && _b !== void 0 ? _b : editor.options.enableContentCheck
+  });
+};
+function getMarkAttributes(state, typeOrName) {
+  const type = getMarkType(typeOrName, state.schema);
+  const { from, to, empty } = state.selection;
+  const marks = [];
+  if (empty) {
+    if (state.storedMarks) {
+      marks.push(...state.storedMarks);
+    }
+    marks.push(...state.selection.$head.marks());
+  } else {
+    state.doc.nodesBetween(from, to, (node) => {
+      marks.push(...node.marks);
+    });
+  }
+  const mark = marks.find((markItem) => markItem.type.name === type.name);
+  if (!mark) {
+    return {};
+  }
+  return { ...mark.attrs };
+}
+function defaultBlockAt(match) {
+  for (let i = 0; i < match.edgeCount; i += 1) {
+    const { type } = match.edge(i);
+    if (type.isTextblock && !type.hasRequiredAttrs()) {
+      return type;
+    }
+  }
+  return null;
+}
+function findParentNodeClosestToPos($pos, predicate) {
+  for (let i = $pos.depth; i > 0; i -= 1) {
+    const node = $pos.node(i);
+    if (predicate(node)) {
+      return {
+        pos: i > 0 ? $pos.before(i) : 0,
+        start: $pos.start(i),
+        depth: i,
+        node
+      };
+    }
+  }
+}
+function findParentNode(predicate) {
+  return (selection) => findParentNodeClosestToPos(selection.$from, predicate);
+}
+function getSplittedAttributes(extensionAttributes, typeName, attributes) {
+  return Object.fromEntries(Object.entries(attributes).filter(([name]) => {
+    const extensionAttribute = extensionAttributes.find((item) => {
+      return item.type === typeName && item.name === name;
+    });
+    if (!extensionAttribute) {
+      return false;
+    }
+    return extensionAttribute.attribute.keepOnSplit;
+  }));
+}
+function isMarkActive(state, typeOrName, attributes = {}) {
+  const { empty, ranges } = state.selection;
+  const type = typeOrName ? getMarkType(typeOrName, state.schema) : null;
+  if (empty) {
+    return !!(state.storedMarks || state.selection.$from.marks()).filter((mark) => {
+      if (!type) {
+        return true;
+      }
+      return type.name === mark.type.name;
+    }).find((mark) => objectIncludes(mark.attrs, attributes, { strict: false }));
+  }
+  let selectionRange = 0;
+  const markRanges = [];
+  ranges.forEach(({ $from, $to }) => {
+    const from = $from.pos;
+    const to = $to.pos;
+    state.doc.nodesBetween(from, to, (node, pos) => {
+      if (!node.isText && !node.marks.length) {
+        return;
+      }
+      const relativeFrom = Math.max(from, pos);
+      const relativeTo = Math.min(to, pos + node.nodeSize);
+      const range2 = relativeTo - relativeFrom;
+      selectionRange += range2;
+      markRanges.push(...node.marks.map((mark) => ({
+        mark,
+        from: relativeFrom,
+        to: relativeTo
+      })));
+    });
+  });
+  if (selectionRange === 0) {
+    return false;
+  }
+  const matchedRange = markRanges.filter((markRange) => {
+    if (!type) {
+      return true;
+    }
+    return type.name === markRange.mark.type.name;
+  }).filter((markRange) => objectIncludes(markRange.mark.attrs, attributes, { strict: false })).reduce((sum, markRange) => sum + markRange.to - markRange.from, 0);
+  const excludedRange = markRanges.filter((markRange) => {
+    if (!type) {
+      return true;
+    }
+    return markRange.mark.type !== type && markRange.mark.type.excludes(type);
+  }).reduce((sum, markRange) => sum + markRange.to - markRange.from, 0);
+  const range = matchedRange > 0 ? matchedRange + excludedRange : matchedRange;
+  return range >= selectionRange;
+}
+function isList(name, extensions) {
+  const { nodeExtensions } = splitExtensions(extensions);
+  const extension = nodeExtensions.find((item) => item.name === name);
+  if (!extension) {
+    return false;
+  }
+  const context = {
+    name: extension.name,
+    options: extension.options,
+    storage: extension.storage
+  };
+  const group = callOrReturn(getExtensionField(extension, "group", context));
+  if (typeof group !== "string") {
+    return false;
+  }
+  return group.split(" ").includes("list");
+}
+function isNodeEmpty(node, { checkChildren = true, ignoreWhitespace = false } = {}) {
+  var _a;
+  if (ignoreWhitespace) {
+    if (node.type.name === "hardBreak") {
+      return true;
+    }
+    if (node.isText) {
+      return /^\s*$/m.test((_a = node.text) !== null && _a !== void 0 ? _a : "");
+    }
+  }
+  if (node.isText) {
+    return !node.text;
+  }
+  if (node.isAtom || node.isLeaf) {
+    return false;
+  }
+  if (node.content.childCount === 0) {
+    return true;
+  }
+  if (checkChildren) {
+    let isContentEmpty = true;
+    node.content.forEach((childNode) => {
+      if (isContentEmpty === false) {
+        return;
+      }
+      if (!isNodeEmpty(childNode, { ignoreWhitespace, checkChildren })) {
+        isContentEmpty = false;
+      }
+    });
+    return isContentEmpty;
+  }
+  return false;
+}
+function canSetMark(state, tr, newMarkType) {
+  var _a;
+  const { selection } = tr;
+  let cursor = null;
+  if (isTextSelection(selection)) {
+    cursor = selection.$cursor;
+  }
+  if (cursor) {
+    const currentMarks = (_a = state.storedMarks) !== null && _a !== void 0 ? _a : cursor.marks();
+    return !!newMarkType.isInSet(currentMarks) || !currentMarks.some((mark) => mark.type.excludes(newMarkType));
+  }
+  const { ranges } = selection;
+  return ranges.some(({ $from, $to }) => {
+    let someNodeSupportsMark = $from.depth === 0 ? state.doc.inlineContent && state.doc.type.allowsMarkType(newMarkType) : false;
+    state.doc.nodesBetween($from.pos, $to.pos, (node, _pos, parent) => {
+      if (someNodeSupportsMark) {
+        return false;
+      }
+      if (node.isInline) {
+        const parentAllowsMarkType = !parent || parent.type.allowsMarkType(newMarkType);
+        const currentMarksAllowMarkType = !!newMarkType.isInSet(node.marks) || !node.marks.some((otherMark) => otherMark.type.excludes(newMarkType));
+        someNodeSupportsMark = parentAllowsMarkType && currentMarksAllowMarkType;
+      }
+      return !someNodeSupportsMark;
+    });
+    return someNodeSupportsMark;
+  });
+}
+var setMark = (typeOrName, attributes = {}) => ({ tr, state, dispatch }) => {
+  const { selection } = tr;
+  const { empty, ranges } = selection;
+  const type = getMarkType(typeOrName, state.schema);
+  if (dispatch) {
+    if (empty) {
+      const oldAttributes = getMarkAttributes(state, type);
+      tr.addStoredMark(type.create({
+        ...oldAttributes,
+        ...attributes
+      }));
+    } else {
+      ranges.forEach((range) => {
+        const from = range.$from.pos;
+        const to = range.$to.pos;
+        state.doc.nodesBetween(from, to, (node, pos) => {
+          const trimmedFrom = Math.max(pos, from);
+          const trimmedTo = Math.min(pos + node.nodeSize, to);
+          const someHasMark = node.marks.find((mark) => mark.type === type);
+          if (someHasMark) {
+            node.marks.forEach((mark) => {
+              if (type === mark.type) {
+                tr.addMark(trimmedFrom, trimmedTo, type.create({
+                  ...mark.attrs,
+                  ...attributes
+                }));
+              }
+            });
+          } else {
+            tr.addMark(trimmedFrom, trimmedTo, type.create(attributes));
+          }
+        });
+      });
+    }
+  }
+  return canSetMark(state, tr, type);
+};
+var setMeta = (key, value) => ({ tr }) => {
+  tr.setMeta(key, value);
+  return true;
+};
+var setNode = (typeOrName, attributes = {}) => ({ state, dispatch, chain }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  let attributesToCopy;
+  if (state.selection.$anchor.sameParent(state.selection.$head)) {
+    attributesToCopy = state.selection.$anchor.parent.attrs;
+  }
+  if (!type.isTextblock) {
+    console.warn('[tiptap warn]: Currently "setNode()" only supports text block nodes.');
+    return false;
+  }
+  return chain().command(({ commands: commands2 }) => {
+    const canSetBlock = setBlockType(type, { ...attributesToCopy, ...attributes })(state);
+    if (canSetBlock) {
+      return true;
+    }
+    return commands2.clearNodes();
+  }).command(({ state: updatedState }) => {
+    return setBlockType(type, { ...attributesToCopy, ...attributes })(updatedState, dispatch);
+  }).run();
+};
+var setNodeSelection = (position) => ({ tr, dispatch }) => {
+  if (dispatch) {
+    const { doc } = tr;
+    const from = minMax(position, 0, doc.content.size);
+    const selection = NodeSelection.create(doc, from);
+    tr.setSelection(selection);
+  }
+  return true;
+};
+var setTextSelection = (position) => ({ tr, dispatch }) => {
+  if (dispatch) {
+    const { doc } = tr;
+    const { from, to } = typeof position === "number" ? { from: position, to: position } : position;
+    const minPos = TextSelection.atStart(doc).from;
+    const maxPos = TextSelection.atEnd(doc).to;
+    const resolvedFrom = minMax(from, minPos, maxPos);
+    const resolvedEnd = minMax(to, minPos, maxPos);
+    const selection = TextSelection.create(doc, resolvedFrom, resolvedEnd);
+    tr.setSelection(selection);
+  }
+  return true;
+};
+var sinkListItem = (typeOrName) => ({ state, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  return sinkListItem$1(type)(state, dispatch);
+};
+function ensureMarks(state, splittableMarks) {
+  const marks = state.storedMarks || state.selection.$to.parentOffset && state.selection.$from.marks();
+  if (marks) {
+    const filteredMarks = marks.filter((mark) => splittableMarks === null || splittableMarks === void 0 ? void 0 : splittableMarks.includes(mark.type.name));
+    state.tr.ensureMarks(filteredMarks);
+  }
+}
+var splitBlock = ({ keepMarks = true } = {}) => ({ tr, state, dispatch, editor }) => {
+  const { selection, doc } = tr;
+  const { $from, $to } = selection;
+  const extensionAttributes = editor.extensionManager.attributes;
+  const newAttributes = getSplittedAttributes(extensionAttributes, $from.node().type.name, $from.node().attrs);
+  if (selection instanceof NodeSelection && selection.node.isBlock) {
+    if (!$from.parentOffset || !canSplit(doc, $from.pos)) {
+      return false;
+    }
+    if (dispatch) {
+      if (keepMarks) {
+        ensureMarks(state, editor.extensionManager.splittableMarks);
+      }
+      tr.split($from.pos).scrollIntoView();
+    }
+    return true;
+  }
+  if (!$from.parent.isBlock) {
+    return false;
+  }
+  const atEnd = $to.parentOffset === $to.parent.content.size;
+  const deflt = $from.depth === 0 ? void 0 : defaultBlockAt($from.node(-1).contentMatchAt($from.indexAfter(-1)));
+  let types = atEnd && deflt ? [
+    {
+      type: deflt,
+      attrs: newAttributes
+    }
+  ] : void 0;
+  let can = canSplit(tr.doc, tr.mapping.map($from.pos), 1, types);
+  if (!types && !can && canSplit(tr.doc, tr.mapping.map($from.pos), 1, deflt ? [{ type: deflt }] : void 0)) {
+    can = true;
+    types = deflt ? [
+      {
+        type: deflt,
+        attrs: newAttributes
+      }
+    ] : void 0;
+  }
+  if (dispatch) {
+    if (can) {
+      if (selection instanceof TextSelection) {
+        tr.deleteSelection();
+      }
+      tr.split(tr.mapping.map($from.pos), 1, types);
+      if (deflt && !atEnd && !$from.parentOffset && $from.parent.type !== deflt) {
+        const first2 = tr.mapping.map($from.before());
+        const $first = tr.doc.resolve(first2);
+        if ($from.node(-1).canReplaceWith($first.index(), $first.index() + 1, deflt)) {
+          tr.setNodeMarkup(tr.mapping.map($from.before()), deflt);
+        }
+      }
+    }
+    if (keepMarks) {
+      ensureMarks(state, editor.extensionManager.splittableMarks);
+    }
+    tr.scrollIntoView();
+  }
+  return can;
+};
+var splitListItem = (typeOrName, overrideAttrs = {}) => ({ tr, state, dispatch, editor }) => {
+  var _a;
+  const type = getNodeType(typeOrName, state.schema);
+  const { $from, $to } = state.selection;
+  const node = state.selection.node;
+  if (node && node.isBlock || $from.depth < 2 || !$from.sameParent($to)) {
+    return false;
+  }
+  const grandParent = $from.node(-1);
+  if (grandParent.type !== type) {
+    return false;
+  }
+  const extensionAttributes = editor.extensionManager.attributes;
+  if ($from.parent.content.size === 0 && $from.node(-1).childCount === $from.indexAfter(-1)) {
+    if ($from.depth === 2 || $from.node(-3).type !== type || $from.index(-2) !== $from.node(-2).childCount - 1) {
+      return false;
+    }
+    if (dispatch) {
+      let wrap = Fragment.empty;
+      const depthBefore = $from.index(-1) ? 1 : $from.index(-2) ? 2 : 3;
+      for (let d = $from.depth - depthBefore; d >= $from.depth - 3; d -= 1) {
+        wrap = Fragment.from($from.node(d).copy(wrap));
+      }
+      const depthAfter = $from.indexAfter(-1) < $from.node(-2).childCount ? 1 : $from.indexAfter(-2) < $from.node(-3).childCount ? 2 : 3;
+      const newNextTypeAttributes2 = {
+        ...getSplittedAttributes(extensionAttributes, $from.node().type.name, $from.node().attrs),
+        ...overrideAttrs
+      };
+      const nextType2 = ((_a = type.contentMatch.defaultType) === null || _a === void 0 ? void 0 : _a.createAndFill(newNextTypeAttributes2)) || void 0;
+      wrap = wrap.append(Fragment.from(type.createAndFill(null, nextType2) || void 0));
+      const start = $from.before($from.depth - (depthBefore - 1));
+      tr.replace(start, $from.after(-depthAfter), new Slice(wrap, 4 - depthBefore, 0));
+      let sel = -1;
+      tr.doc.nodesBetween(start, tr.doc.content.size, (n, pos) => {
+        if (sel > -1) {
+          return false;
+        }
+        if (n.isTextblock && n.content.size === 0) {
+          sel = pos + 1;
+        }
+      });
+      if (sel > -1) {
+        tr.setSelection(TextSelection.near(tr.doc.resolve(sel)));
+      }
+      tr.scrollIntoView();
+    }
+    return true;
+  }
+  const nextType = $to.pos === $from.end() ? grandParent.contentMatchAt(0).defaultType : null;
+  const newTypeAttributes = {
+    ...getSplittedAttributes(extensionAttributes, grandParent.type.name, grandParent.attrs),
+    ...overrideAttrs
+  };
+  const newNextTypeAttributes = {
+    ...getSplittedAttributes(extensionAttributes, $from.node().type.name, $from.node().attrs),
+    ...overrideAttrs
+  };
+  tr.delete($from.pos, $to.pos);
+  const types = nextType ? [
+    { type, attrs: newTypeAttributes },
+    { type: nextType, attrs: newNextTypeAttributes }
+  ] : [{ type, attrs: newTypeAttributes }];
+  if (!canSplit(tr.doc, $from.pos, 2)) {
+    return false;
+  }
+  if (dispatch) {
+    const { selection, storedMarks } = state;
+    const { splittableMarks } = editor.extensionManager;
+    const marks = storedMarks || selection.$to.parentOffset && selection.$from.marks();
+    tr.split($from.pos, 2, types).scrollIntoView();
+    if (!marks || !dispatch) {
+      return true;
+    }
+    const filteredMarks = marks.filter((mark) => splittableMarks.includes(mark.type.name));
+    tr.ensureMarks(filteredMarks);
+  }
+  return true;
+};
+var joinListBackwards = (tr, listType) => {
+  const list = findParentNode((node) => node.type === listType)(tr.selection);
+  if (!list) {
+    return true;
+  }
+  const before = tr.doc.resolve(Math.max(0, list.pos - 1)).before(list.depth);
+  if (before === void 0) {
+    return true;
+  }
+  const nodeBefore = tr.doc.nodeAt(before);
+  const canJoinBackwards = list.node.type === (nodeBefore === null || nodeBefore === void 0 ? void 0 : nodeBefore.type) && canJoin(tr.doc, list.pos);
+  if (!canJoinBackwards) {
+    return true;
+  }
+  tr.join(list.pos);
+  return true;
+};
+var joinListForwards = (tr, listType) => {
+  const list = findParentNode((node) => node.type === listType)(tr.selection);
+  if (!list) {
+    return true;
+  }
+  const after = tr.doc.resolve(list.start).after(list.depth);
+  if (after === void 0) {
+    return true;
+  }
+  const nodeAfter = tr.doc.nodeAt(after);
+  const canJoinForwards = list.node.type === (nodeAfter === null || nodeAfter === void 0 ? void 0 : nodeAfter.type) && canJoin(tr.doc, after);
+  if (!canJoinForwards) {
+    return true;
+  }
+  tr.join(after);
+  return true;
+};
+var toggleList = (listTypeOrName, itemTypeOrName, keepMarks, attributes = {}) => ({ editor, tr, state, dispatch, chain, commands: commands2, can }) => {
+  const { extensions, splittableMarks } = editor.extensionManager;
+  const listType = getNodeType(listTypeOrName, state.schema);
+  const itemType = getNodeType(itemTypeOrName, state.schema);
+  const { selection, storedMarks } = state;
+  const { $from, $to } = selection;
+  const range = $from.blockRange($to);
+  const marks = storedMarks || selection.$to.parentOffset && selection.$from.marks();
+  if (!range) {
+    return false;
+  }
+  const parentList = findParentNode((node) => isList(node.type.name, extensions))(selection);
+  if (range.depth >= 1 && parentList && range.depth - parentList.depth <= 1) {
+    if (parentList.node.type === listType) {
+      return commands2.liftListItem(itemType);
+    }
+    if (isList(parentList.node.type.name, extensions) && listType.validContent(parentList.node.content) && dispatch) {
+      return chain().command(() => {
+        tr.setNodeMarkup(parentList.pos, listType);
+        return true;
+      }).command(() => joinListBackwards(tr, listType)).command(() => joinListForwards(tr, listType)).run();
+    }
+  }
+  if (!keepMarks || !marks || !dispatch) {
+    return chain().command(() => {
+      const canWrapInList = can().wrapInList(listType, attributes);
+      if (canWrapInList) {
+        return true;
+      }
+      return commands2.clearNodes();
+    }).wrapInList(listType, attributes).command(() => joinListBackwards(tr, listType)).command(() => joinListForwards(tr, listType)).run();
+  }
+  return chain().command(() => {
+    const canWrapInList = can().wrapInList(listType, attributes);
+    const filteredMarks = marks.filter((mark) => splittableMarks.includes(mark.type.name));
+    tr.ensureMarks(filteredMarks);
+    if (canWrapInList) {
+      return true;
+    }
+    return commands2.clearNodes();
+  }).wrapInList(listType, attributes).command(() => joinListBackwards(tr, listType)).command(() => joinListForwards(tr, listType)).run();
+};
+var toggleMark = (typeOrName, attributes = {}, options = {}) => ({ state, commands: commands2 }) => {
+  const { extendEmptyMarkRange = false } = options;
+  const type = getMarkType(typeOrName, state.schema);
+  const isActive = isMarkActive(state, type, attributes);
+  if (isActive) {
+    return commands2.unsetMark(type, { extendEmptyMarkRange });
+  }
+  return commands2.setMark(type, attributes);
+};
+var toggleNode = (typeOrName, toggleTypeOrName, attributes = {}) => ({ state, commands: commands2 }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  const toggleType = getNodeType(toggleTypeOrName, state.schema);
+  const isActive = isNodeActive(state, type, attributes);
+  let attributesToCopy;
+  if (state.selection.$anchor.sameParent(state.selection.$head)) {
+    attributesToCopy = state.selection.$anchor.parent.attrs;
+  }
+  if (isActive) {
+    return commands2.setNode(toggleType, attributesToCopy);
+  }
+  return commands2.setNode(type, { ...attributesToCopy, ...attributes });
+};
+var toggleWrap = (typeOrName, attributes = {}) => ({ state, commands: commands2 }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  const isActive = isNodeActive(state, type, attributes);
+  if (isActive) {
+    return commands2.lift(type);
+  }
+  return commands2.wrapIn(type, attributes);
+};
+var undoInputRule = () => ({ state, dispatch }) => {
+  const plugins = state.plugins;
+  for (let i = 0; i < plugins.length; i += 1) {
+    const plugin = plugins[i];
+    let undoable;
+    if (plugin.spec.isInputRules && (undoable = plugin.getState(state))) {
+      if (dispatch) {
+        const tr = state.tr;
+        const toUndo = undoable.transform;
+        for (let j = toUndo.steps.length - 1; j >= 0; j -= 1) {
+          tr.step(toUndo.steps[j].invert(toUndo.docs[j]));
+        }
+        if (undoable.text) {
+          const marks = tr.doc.resolve(undoable.from).marks();
+          tr.replaceWith(undoable.from, undoable.to, state.schema.text(undoable.text, marks));
+        } else {
+          tr.delete(undoable.from, undoable.to);
+        }
+      }
+      return true;
+    }
+  }
+  return false;
+};
+var unsetAllMarks = () => ({ tr, dispatch }) => {
+  const { selection } = tr;
+  const { empty, ranges } = selection;
+  if (empty) {
+    return true;
+  }
+  if (dispatch) {
+    ranges.forEach((range) => {
+      tr.removeMark(range.$from.pos, range.$to.pos);
+    });
+  }
+  return true;
+};
+var unsetMark = (typeOrName, options = {}) => ({ tr, state, dispatch }) => {
+  var _a;
+  const { extendEmptyMarkRange = false } = options;
+  const { selection } = tr;
+  const type = getMarkType(typeOrName, state.schema);
+  const { $from, empty, ranges } = selection;
+  if (!dispatch) {
+    return true;
+  }
+  if (empty && extendEmptyMarkRange) {
+    let { from, to } = selection;
+    const attrs = (_a = $from.marks().find((mark) => mark.type === type)) === null || _a === void 0 ? void 0 : _a.attrs;
+    const range = getMarkRange($from, type, attrs);
+    if (range) {
+      from = range.from;
+      to = range.to;
+    }
+    tr.removeMark(from, to, type);
+  } else {
+    ranges.forEach((range) => {
+      tr.removeMark(range.$from.pos, range.$to.pos, type);
+    });
+  }
+  tr.removeStoredMark(type);
+  return true;
+};
+var updateAttributes = (typeOrName, attributes = {}) => ({ tr, state, dispatch }) => {
+  let nodeType = null;
+  let markType = null;
+  const schemaType = getSchemaTypeNameByName(typeof typeOrName === "string" ? typeOrName : typeOrName.name, state.schema);
+  if (!schemaType) {
+    return false;
+  }
+  if (schemaType === "node") {
+    nodeType = getNodeType(typeOrName, state.schema);
+  }
+  if (schemaType === "mark") {
+    markType = getMarkType(typeOrName, state.schema);
+  }
+  if (dispatch) {
+    tr.selection.ranges.forEach((range) => {
+      const from = range.$from.pos;
+      const to = range.$to.pos;
+      let lastPos;
+      let lastNode;
+      let trimmedFrom;
+      let trimmedTo;
+      if (tr.selection.empty) {
+        state.doc.nodesBetween(from, to, (node, pos) => {
+          if (nodeType && nodeType === node.type) {
+            trimmedFrom = Math.max(pos, from);
+            trimmedTo = Math.min(pos + node.nodeSize, to);
+            lastPos = pos;
+            lastNode = node;
+          }
+        });
+      } else {
+        state.doc.nodesBetween(from, to, (node, pos) => {
+          if (pos < from && nodeType && nodeType === node.type) {
+            trimmedFrom = Math.max(pos, from);
+            trimmedTo = Math.min(pos + node.nodeSize, to);
+            lastPos = pos;
+            lastNode = node;
+          }
+          if (pos >= from && pos <= to) {
+            if (nodeType && nodeType === node.type) {
+              tr.setNodeMarkup(pos, void 0, {
+                ...node.attrs,
+                ...attributes
+              });
+            }
+            if (markType && node.marks.length) {
+              node.marks.forEach((mark) => {
+                if (markType === mark.type) {
+                  const trimmedFrom2 = Math.max(pos, from);
+                  const trimmedTo2 = Math.min(pos + node.nodeSize, to);
+                  tr.addMark(trimmedFrom2, trimmedTo2, markType.create({
+                    ...mark.attrs,
+                    ...attributes
+                  }));
+                }
+              });
+            }
+          }
+        });
+      }
+      if (lastNode) {
+        if (lastPos !== void 0) {
+          tr.setNodeMarkup(lastPos, void 0, {
+            ...lastNode.attrs,
+            ...attributes
+          });
+        }
+        if (markType && lastNode.marks.length) {
+          lastNode.marks.forEach((mark) => {
+            if (markType === mark.type) {
+              tr.addMark(trimmedFrom, trimmedTo, markType.create({
+                ...mark.attrs,
+                ...attributes
+              }));
+            }
+          });
+        }
+      }
+    });
+  }
+  return true;
+};
+var wrapIn = (typeOrName, attributes = {}) => ({ state, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  return wrapIn$1(type, attributes)(state, dispatch);
+};
+var wrapInList = (typeOrName, attributes = {}) => ({ state, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  return wrapInList$1(type, attributes)(state, dispatch);
+};
+var commands = /* @__PURE__ */ Object.freeze({
+  __proto__: null,
+  blur,
+  clearContent,
+  clearNodes,
+  command,
+  createParagraphNear,
+  cut,
+  deleteCurrentNode,
+  deleteNode,
+  deleteRange,
+  deleteSelection,
+  enter,
+  exitCode,
+  extendMarkRange,
+  first,
+  focus,
+  forEach,
+  insertContent,
+  insertContentAt,
+  joinBackward,
+  joinDown,
+  joinForward,
+  joinItemBackward,
+  joinItemForward,
+  joinTextblockBackward,
+  joinTextblockForward,
+  joinUp,
+  keyboardShortcut,
+  lift,
+  liftEmptyBlock,
+  liftListItem,
+  newlineInCode,
+  resetAttributes,
+  scrollIntoView,
+  selectAll,
+  selectNodeBackward,
+  selectNodeForward,
+  selectParentNode,
+  selectTextblockEnd,
+  selectTextblockStart,
+  setContent,
+  setMark,
+  setMeta,
+  setNode,
+  setNodeSelection,
+  setTextSelection,
+  sinkListItem,
+  splitBlock,
+  splitListItem,
+  toggleList,
+  toggleMark,
+  toggleNode,
+  toggleWrap,
+  undoInputRule,
+  unsetAllMarks,
+  unsetMark,
+  updateAttributes,
+  wrapIn,
+  wrapInList
+});
+var Commands = Extension.create({
+  name: "commands",
+  addCommands() {
+    return {
+      ...commands
+    };
+  }
+});
+var Drop = Extension.create({
+  name: "drop",
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey("tiptapDrop"),
+        props: {
+          handleDrop: (_, e, slice, moved) => {
+            this.editor.emit("drop", {
+              editor: this.editor,
+              event: e,
+              slice,
+              moved
+            });
+          }
+        }
+      })
+    ];
+  }
+});
+var Editable = Extension.create({
+  name: "editable",
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey("editable"),
+        props: {
+          editable: () => this.editor.options.editable
+        }
+      })
+    ];
+  }
+});
+var focusEventsPluginKey = new PluginKey("focusEvents");
+var FocusEvents = Extension.create({
+  name: "focusEvents",
+  addProseMirrorPlugins() {
+    const { editor } = this;
+    return [
+      new Plugin({
+        key: focusEventsPluginKey,
+        props: {
+          handleDOMEvents: {
+            focus: (view, event) => {
+              editor.isFocused = true;
+              const transaction = editor.state.tr.setMeta("focus", { event }).setMeta("addToHistory", false);
+              view.dispatch(transaction);
+              return false;
+            },
+            blur: (view, event) => {
+              editor.isFocused = false;
+              const transaction = editor.state.tr.setMeta("blur", { event }).setMeta("addToHistory", false);
+              view.dispatch(transaction);
+              return false;
+            }
+          }
+        }
+      })
+    ];
+  }
+});
+var Keymap = Extension.create({
+  name: "keymap",
+  addKeyboardShortcuts() {
+    const handleBackspace = () => this.editor.commands.first(({ commands: commands2 }) => [
+      () => commands2.undoInputRule(),
+      // maybe convert first text block node to default node
+      () => commands2.command(({ tr }) => {
+        const { selection, doc } = tr;
+        const { empty, $anchor } = selection;
+        const { pos, parent } = $anchor;
+        const $parentPos = $anchor.parent.isTextblock && pos > 0 ? tr.doc.resolve(pos - 1) : $anchor;
+        const parentIsIsolating = $parentPos.parent.type.spec.isolating;
+        const parentPos = $anchor.pos - $anchor.parentOffset;
+        const isAtStart = parentIsIsolating && $parentPos.parent.childCount === 1 ? parentPos === $anchor.pos : Selection.atStart(doc).from === pos;
+        if (!empty || !parent.type.isTextblock || parent.textContent.length || !isAtStart || isAtStart && $anchor.parent.type.name === "paragraph") {
+          return false;
+        }
+        return commands2.clearNodes();
+      }),
+      () => commands2.deleteSelection(),
+      () => commands2.joinBackward(),
+      () => commands2.selectNodeBackward()
+    ]);
+    const handleDelete = () => this.editor.commands.first(({ commands: commands2 }) => [
+      () => commands2.deleteSelection(),
+      () => commands2.deleteCurrentNode(),
+      () => commands2.joinForward(),
+      () => commands2.selectNodeForward()
+    ]);
+    const handleEnter = () => this.editor.commands.first(({ commands: commands2 }) => [
+      () => commands2.newlineInCode(),
+      () => commands2.createParagraphNear(),
+      () => commands2.liftEmptyBlock(),
+      () => commands2.splitBlock()
+    ]);
+    const baseKeymap = {
+      Enter: handleEnter,
+      "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 pcKeymap = {
+      ...baseKeymap
+    };
+    const macKeymap = {
+      ...baseKeymap,
+      "Ctrl-h": handleBackspace,
+      "Alt-Backspace": handleBackspace,
+      "Ctrl-d": handleDelete,
+      "Ctrl-Alt-Backspace": handleDelete,
+      "Alt-Delete": handleDelete,
+      "Alt-d": handleDelete,
+      "Ctrl-a": () => this.editor.commands.selectTextblockStart(),
+      "Ctrl-e": () => this.editor.commands.selectTextblockEnd()
+    };
+    if (isiOS() || isMacOS()) {
+      return macKeymap;
+    }
+    return pcKeymap;
+  },
+  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 Plugin({
+        key: new 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) {
+            return;
+          }
+          const { empty, from, to } = oldState.selection;
+          const allFrom = Selection.atStart(oldState.doc).from;
+          const allEnd = Selection.atEnd(oldState.doc).to;
+          const allWasSelected = from === allFrom && to === allEnd;
+          if (empty || !allWasSelected) {
+            return;
+          }
+          const isEmpty = isNodeEmpty(newState.doc);
+          if (!isEmpty) {
+            return;
+          }
+          const tr = newState.tr;
+          const state = createChainableState({
+            state: newState,
+            transaction: tr
+          });
+          const { commands: commands2 } = new CommandManager({
+            editor: this.editor,
+            state
+          });
+          commands2.clearNodes();
+          if (!tr.steps.length) {
+            return;
+          }
+          return tr;
+        }
+      })
+    ];
+  }
+});
+var Paste = Extension.create({
+  name: "paste",
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey("tiptapPaste"),
+        props: {
+          handlePaste: (_view, e, slice) => {
+            this.editor.emit("paste", {
+              editor: this.editor,
+              event: e,
+              slice
+            });
+          }
+        }
+      })
+    ];
+  }
+});
+var Tabindex = Extension.create({
+  name: "tabindex",
+  addProseMirrorPlugins() {
+    return [
+      new Plugin({
+        key: new PluginKey("tabindex"),
+        props: {
+          attributes: () => this.editor.isEditable ? { tabindex: "0" } : {}
+        }
+      })
+    ];
+  }
+});
+
+// src/extensions/PageLayout.ts
+import { Plugin as Plugin2, PluginKey as PluginKey2 } from "@tiptap/pm/state";
+import { Decoration, DecorationSet } from "@tiptap/pm/view";
+
+// src/types.ts
+var PAGE_DIMENSIONS = {
+  A4: {
+    widthMm: 210,
+    heightMm: 297,
+    paddingTopMm: 22,
+    paddingBottomMm: 22,
+    paddingLeftMm: 28,
+    paddingRightMm: 28
+  },
+  Letter: {
+    widthMm: 216,
+    heightMm: 279,
+    paddingTopMm: 22,
+    paddingBottomMm: 22,
+    paddingLeftMm: 28,
+    paddingRightMm: 28
+  }
+};
+var PX_PER_MM = 3.7795;
+function getBodyHeightPx(size) {
+  const d = PAGE_DIMENSIONS[size];
+  return Math.round((d.heightMm - d.paddingTopMm - d.paddingBottomMm) * PX_PER_MM);
+}
+function getBodyWidthPx(size) {
+  const d = PAGE_DIMENSIONS[size];
+  return Math.round((d.widthMm - d.paddingLeftMm - d.paddingRightMm) * PX_PER_MM);
+}
+function getPageWidthPx(size) {
+  const d = PAGE_DIMENSIONS[size];
+  return Math.round(d.widthMm * PX_PER_MM);
+}
+var PARCHMENT_DEFAULTS = {
+  canvasBg: "#e0ddd4",
+  paperColor: "#f5f4ed",
+  textColor: "#141413",
+  lineColor: "#c8c4b8",
+  accentColor: "#1b365d"
+};
+var MINIMAL_DEFAULTS = {
+  canvasBg: "#e8e8e8",
+  paperColor: "#ffffff",
+  textColor: "#111111",
+  lineColor: "#d0d0d0",
+  accentColor: "#2563eb"
+};
+
+// src/extensions/PageLayout.ts
+var META_KEY = "pageBreakDecos";
+var pluginKey = new PluginKey2("pageBreak");
+function makeGapWidget(gapHeightPx, pageIndex) {
+  const el = document.createElement("div");
+  el.className = "ink-page-gap";
+  el.setAttribute("data-page-gap", String(pageIndex));
+  el.style.height = `${gapHeightPx}px`;
+  el.contentEditable = "false";
+  return el;
+}
+function computeDecorations(doc, view, bodyHeightPx, gapHeightPx) {
+  const decorations = [];
+  let pageIndex = 1;
+  let baseY = null;
+  doc.descendants((node, pos) => {
+    if (!node.isBlock) return;
+    const insidePos = pos + 1;
+    if (insidePos >= doc.content.size) return;
+    let top;
+    let bottom;
+    try {
+      top = view.coordsAtPos(insidePos).top;
+      const endPos = pos + node.nodeSize - 1;
+      bottom = endPos > insidePos ? view.coordsAtPos(endPos).bottom : top + 28;
+    } catch {
+      return;
+    }
+    if (baseY === null) baseY = top;
+    const threshold = pageIndex * bodyHeightPx + (pageIndex - 1) * gapHeightPx;
+    const relTop = top - baseY;
+    const relBottom = bottom - baseY;
+    if (relTop >= threshold || relBottom > threshold && relTop < threshold) {
+      const idx = pageIndex;
+      decorations.push(
+        Decoration.widget(pos, () => makeGapWidget(gapHeightPx, idx), {
+          side: -1,
+          key: `page-gap-${idx}`
+        })
+      );
+      pageIndex++;
+    }
+  });
+  return DecorationSet.create(doc, decorations);
+}
+function measurePageDimensions(view, pageSize) {
+  const card = view.dom.closest(".ink-page-card");
+  if (!card) return null;
+  const style = window.getComputedStyle(card);
+  const paddingTop = parseFloat(style.paddingTop);
+  const paddingBottom = parseFloat(style.paddingBottom);
+  const gapHeightPx = Math.round(paddingTop + paddingBottom);
+  const dims = PAGE_DIMENSIONS[pageSize];
+  const bodyMm = dims.heightMm - dims.paddingTopMm - dims.paddingBottomMm;
+  const gapMm = dims.paddingTopMm + dims.paddingBottomMm;
+  const pmPaddingTop = parseFloat(window.getComputedStyle(view.dom).paddingTop) || 28;
+  const rawWidgetHeight = gapHeightPx - pmPaddingTop;
+  const widgetHeightPx = Math.round(rawWidgetHeight / 28) * 28;
+  const rawBodyHeight = Math.round(bodyMm / gapMm * gapHeightPx);
+  const bodyHeightPx = Math.floor(rawBodyHeight / 28) * 28;
+  return { bodyHeightPx, gapHeightPx: widgetHeightPx };
+}
+function buildPageBreakPlugin(pageSize) {
+  let rafId = null;
+  function scheduleUpdate(view) {
+    if (rafId !== null) cancelAnimationFrame(rafId);
+    rafId = requestAnimationFrame(() => {
+      rafId = null;
+      if (view.isDestroyed) return;
+      const dims = measurePageDimensions(view, pageSize);
+      if (!dims) return;
+      const { bodyHeightPx, gapHeightPx } = dims;
+      const decos = computeDecorations(view.state.doc, view, bodyHeightPx, gapHeightPx);
+      const tr = view.state.tr.setMeta(META_KEY, decos);
+      tr.setMeta("addToHistory", false);
+      view.dispatch(tr);
+    });
+  }
+  return new Plugin2({
+    key: pluginKey,
+    state: {
+      init() {
+        return DecorationSet.empty;
+      },
+      apply(tr, old) {
+        const meta = tr.getMeta(META_KEY);
+        if (meta) return meta;
+        if (tr.docChanged) return old.map(tr.mapping, tr.doc);
+        return old;
+      }
+    },
+    props: {
+      decorations(state) {
+        return pluginKey.getState(state) ?? DecorationSet.empty;
+      }
+    },
+    view(editorView) {
+      scheduleUpdate(editorView);
+      return {
+        update(view, prevState) {
+          if (!view.state.doc.eq(prevState.doc)) {
+            scheduleUpdate(view);
+          }
+        },
+        destroy() {
+          if (rafId !== null) cancelAnimationFrame(rafId);
+        }
+      };
+    }
+  });
+}
+var PageLayout = Extension.create({
+  name: "pageLayout",
+  addOptions() {
+    return { pageSize: "A4" };
+  },
+  addProseMirrorPlugins() {
+    return [buildPageBreakPlugin(this.options.pageSize)];
+  }
+});
+
+// src/extensions/TabIndent.ts
+var TabIndent = Extension.create({
+  name: "tabIndent",
+  addKeyboardShortcuts() {
+    return {
+      Tab: () => this.editor.commands.insertContent("    ")
+    };
+  }
+});
+
+// src/components/PagedEditorContent.tsx
+import { EditorContent } from "@tiptap/react";
+
+// src/components/FloatingToolbar.tsx
+import { useEffect as useEffect3, useState } from "react";
+import {
+  Bold,
+  Italic,
+  Underline,
+  Heading1,
+  Heading2,
+  AlignLeft,
+  AlignCenter,
+  AlignRight,
+  AlignJustify,
+  List,
+  ListOrdered,
+  Indent,
+  Outdent,
+  Rows
+} from "lucide-react";
+
+// src/components/FontPicker.tsx
+import { useRef, useEffect } from "react";
+import { Type } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var GOOGLE_FONTS_URL = "https://fonts.googleapis.com/css2?family=Dancing+Script&family=Inter&family=Roboto+Slab&family=JetBrains+Mono&display=swap";
+var FONTS = {
+  cursive: { label: "Cursive", family: "'Dancing Script', cursive" },
+  serif: { label: "Serif", family: "Georgia, serif" },
+  sans: { label: "Sans", family: "'Inter', sans-serif" },
+  slab: { label: "Slab", family: "'Roboto Slab', serif" },
+  mono: { label: "Mono", family: "'JetBrains Mono', monospace" }
+};
+function FontPicker({ font, onChange, open, onToggle, onClose }) {
+  const ref = useRef(null);
+  useEffect(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (!ref.current?.contains(e.target)) onClose();
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open, onClose]);
+  return /* @__PURE__ */ jsxs("div", { className: "ink-popover-anchor", ref, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: `ink-toolbar-btn${open ? " ink-toolbar-btn--active" : ""}`,
+        onClick: onToggle,
+        "aria-label": "Font",
+        title: "Font",
+        style: { width: "auto", padding: "0 8px", gap: 4, fontSize: 13 },
+        children: [
+          /* @__PURE__ */ jsx(Type, { size: 14 }),
+          FONTS[font].label
+        ]
+      }
+    ),
+    open && /* @__PURE__ */ jsx("div", { className: "ink-popover ink-popover--right ink-font-picker", role: "menu", children: Object.keys(FONTS).map((key) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        role: "menuitem",
+        className: `ink-font-option${font === key ? " ink-font-option--active" : ""}`,
+        style: { fontFamily: FONTS[key].family },
+        onClick: () => {
+          onChange(key);
+          onClose();
+        },
+        children: FONTS[key].label
+      },
+      key
+    )) })
+  ] });
+}
+
+// src/components/ColorPanel.tsx
+import { useRef as useRef2, useEffect as useEffect2 } from "react";
+import { Palette } from "lucide-react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var SWATCHES = {
+  canvasBg: ["#e0ddd4", "#d6e4f0", "#e8f5e9", "#f3e5f5", "#fff8e1", "#2c2c2c"],
+  paperColor: ["#f5f4ed", "#ffffff", "#fffde7", "#fce4ec", "#e8eaf6", "#1a1a1a"],
+  textColor: ["#141413", "#111111", "#1a237e", "#4a148c", "#1b5e20", "#e0e0e0"],
+  lineColor: ["#c8c4b8", "#d0d0d0", "#b0bec5", "#ce93d8", "#a5d6a7", "#555555"],
+  accentColor: ["#1b365d", "#2563eb", "#00796b", "#7b1fa2", "#e65100", "#f48fb1"]
+};
+var COLOR_LABELS = {
+  canvasBg: "Canvas",
+  paperColor: "Paper",
+  textColor: "Text",
+  lineColor: "Lines",
+  accentColor: "Accent"
+};
+var COLOR_KEYS = Object.keys(SWATCHES);
+function ColorPanel({ colors, onChange, open, onToggle, onClose }) {
+  const ref = useRef2(null);
+  useEffect2(() => {
+    if (!open) return;
+    const handler = (e) => {
+      if (!ref.current?.contains(e.target)) onClose();
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open, onClose]);
+  function set(key, value) {
+    onChange({ ...colors, [key]: value });
+  }
+  return /* @__PURE__ */ jsxs2("div", { className: "ink-popover-anchor", ref, children: [
+    /* @__PURE__ */ jsx2(
+      "button",
+      {
+        type: "button",
+        className: `ink-toolbar-btn${open ? " ink-toolbar-btn--active" : ""}`,
+        onClick: onToggle,
+        "aria-label": "Colors",
+        title: "Colors",
+        children: /* @__PURE__ */ jsx2(Palette, { size: 16 })
+      }
+    ),
+    open && /* @__PURE__ */ jsx2("div", { className: "ink-popover ink-popover--right ink-color-panel", role: "dialog", "aria-label": "Color customization", children: COLOR_KEYS.map((key) => /* @__PURE__ */ jsxs2("div", { className: "ink-color-row", children: [
+      /* @__PURE__ */ jsx2("span", { className: "ink-color-label", children: COLOR_LABELS[key] }),
+      /* @__PURE__ */ jsxs2("div", { className: "ink-swatches", children: [
+        SWATCHES[key].map((swatch) => /* @__PURE__ */ jsx2(
+          "button",
+          {
+            type: "button",
+            className: `ink-swatch${colors[key] === swatch ? " ink-swatch--active" : ""}`,
+            style: { background: swatch },
+            "aria-label": swatch,
+            title: swatch,
+            onClick: () => set(key, swatch)
+          },
+          swatch
+        )),
+        /* @__PURE__ */ jsx2("span", { className: "ink-color-custom", title: "Custom color", children: /* @__PURE__ */ jsx2(
+          "input",
+          {
+            type: "color",
+            value: colors[key],
+            onChange: (e) => set(key, e.target.value),
+            "aria-label": `Custom ${COLOR_LABELS[key]} color`
+          }
+        ) })
+      ] })
+    ] }, key)) })
+  ] });
+}
+
+// src/components/FloatingToolbar.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function Sep() {
+  return /* @__PURE__ */ jsx3("span", { className: "ink-toolbar-sep", "aria-hidden": "true" });
+}
+function FloatingToolbar({
+  editor,
+  buttons,
+  ruled,
+  onToggleRuled,
+  font,
+  onFontChange,
+  colors,
+  onColorsChange
+}) {
+  const [openPanel, setOpenPanel] = useState(null);
+  useEffect3(() => {
+    if (document.querySelector(`link[href="${GOOGLE_FONTS_URL}"]`)) return;
+    const link = document.createElement("link");
+    link.rel = "stylesheet";
+    link.href = GOOGLE_FONTS_URL;
+    document.head.appendChild(link);
+  }, []);
+  function togglePanel(panel) {
+    setOpenPanel((prev) => prev === panel ? null : panel);
+  }
+  const iconSize = 16;
+  const allGroups = [
+    {
+      key: "bold",
+      configs: [{
+        label: "Bold",
+        icon: /* @__PURE__ */ jsx3(Bold, { size: iconSize }),
+        isActive: () => editor.isActive("bold"),
+        action: () => editor.chain().focus().toggleBold().run()
+      }]
+    },
+    {
+      key: "italic",
+      configs: [{
+        label: "Italic",
+        icon: /* @__PURE__ */ jsx3(Italic, { size: iconSize }),
+        isActive: () => editor.isActive("italic"),
+        action: () => editor.chain().focus().toggleItalic().run()
+      }]
+    },
+    {
+      key: "underline",
+      configs: [{
+        label: "Underline",
+        icon: /* @__PURE__ */ jsx3(Underline, { size: iconSize }),
+        isActive: () => editor.isActive("underline"),
+        action: () => editor.chain().focus().toggleUnderline().run()
+      }]
+    },
+    {
+      key: "h1",
+      configs: [{
+        label: "Heading 1",
+        icon: /* @__PURE__ */ jsx3(Heading1, { size: iconSize }),
+        isActive: () => editor.isActive("heading", { level: 1 }),
+        action: () => editor.chain().focus().toggleHeading({ level: 1 }).run()
+      }]
+    },
+    {
+      key: "h2",
+      configs: [{
+        label: "Heading 2",
+        icon: /* @__PURE__ */ jsx3(Heading2, { size: iconSize }),
+        isActive: () => editor.isActive("heading", { level: 2 }),
+        action: () => editor.chain().focus().toggleHeading({ level: 2 }).run()
+      }]
+    },
+    {
+      key: "align",
+      configs: [
+        { label: "Align left", icon: /* @__PURE__ */ jsx3(AlignLeft, { size: iconSize }), isActive: () => editor.isActive({ textAlign: "left" }), action: () => editor.chain().focus().setTextAlign("left").run() },
+        { label: "Align center", icon: /* @__PURE__ */ jsx3(AlignCenter, { size: iconSize }), isActive: () => editor.isActive({ textAlign: "center" }), action: () => editor.chain().focus().setTextAlign("center").run() },
+        { label: "Align right", icon: /* @__PURE__ */ jsx3(AlignRight, { size: iconSize }), isActive: () => editor.isActive({ textAlign: "right" }), action: () => editor.chain().focus().setTextAlign("right").run() },
+        { label: "Justify", icon: /* @__PURE__ */ jsx3(AlignJustify, { size: iconSize }), isActive: () => editor.isActive({ textAlign: "justify" }), action: () => editor.chain().focus().setTextAlign("justify").run() }
+      ]
+    },
+    {
+      key: "list",
+      configs: [
+        { label: "Bullet list", icon: /* @__PURE__ */ jsx3(List, { size: iconSize }), isActive: () => editor.isActive("bulletList"), action: () => editor.chain().focus().toggleBulletList().run() },
+        { label: "Ordered list", icon: /* @__PURE__ */ jsx3(ListOrdered, { size: iconSize }), isActive: () => editor.isActive("orderedList"), action: () => editor.chain().focus().toggleOrderedList().run() }
+      ]
+    },
+    {
+      key: "indent",
+      configs: [
+        { label: "Indent", icon: /* @__PURE__ */ jsx3(Indent, { size: iconSize }), isActive: () => false, action: () => editor.chain().focus().sinkListItem("listItem").run() },
+        { label: "Outdent", icon: /* @__PURE__ */ jsx3(Outdent, { size: iconSize }), isActive: () => false, action: () => editor.chain().focus().liftListItem("listItem").run() }
+      ]
+    },
+    {
+      key: "lines",
+      configs: [{
+        label: "Toggle ruled lines",
+        icon: /* @__PURE__ */ jsx3(Rows, { size: iconSize }),
+        isActive: () => ruled,
+        action: onToggleRuled
+      }]
+    }
+  ];
+  const activeGroups = allGroups.filter((g) => buttons.includes(g.key));
+  return /* @__PURE__ */ jsx3("div", { className: "ink-floating-toolbar-wrap", children: /* @__PURE__ */ jsxs3("div", { className: "ink-floating-toolbar", role: "toolbar", "aria-label": "Text formatting", children: [
+    activeGroups.map((group, gi) => /* @__PURE__ */ jsxs3("span", { className: "ink-toolbar-group", style: { display: "contents" }, children: [
+      group.configs.map((cfg) => /* @__PURE__ */ jsx3(
+        "button",
+        {
+          type: "button",
+          className: `ink-toolbar-btn${cfg.isActive() ? " ink-toolbar-btn--active" : ""}`,
+          onClick: cfg.action,
+          "aria-label": cfg.label,
+          title: cfg.label,
+          children: cfg.icon
+        },
+        cfg.label
+      )),
+      gi < activeGroups.length - 1 && /* @__PURE__ */ jsx3(Sep, {})
+    ] }, group.key)),
+    activeGroups.length > 0 && /* @__PURE__ */ jsx3(Sep, {}),
+    /* @__PURE__ */ jsx3(
+      FontPicker,
+      {
+        font,
+        onChange: onFontChange,
+        open: openPanel === "font",
+        onToggle: () => togglePanel("font"),
+        onClose: () => setOpenPanel(null)
+      }
+    ),
+    /* @__PURE__ */ jsx3(
+      ColorPanel,
+      {
+        colors,
+        onChange: onColorsChange,
+        open: openPanel === "color",
+        onToggle: () => togglePanel("color"),
+        onClose: () => setOpenPanel(null)
+      }
+    )
+  ] }) });
+}
+
+// src/components/PagedEditorContent.tsx
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function PagedEditorContent({
+  editor,
+  pageSize,
+  theme,
+  toolbar,
+  ruled,
+  onToggleRuled,
+  font,
+  onFontChange,
+  colors,
+  onColorsChange
+}) {
+  const widthPx = getPageWidthPx(pageSize);
+  const bodyWidthPx = getBodyWidthPx(pageSize);
+  const dims = PAGE_DIMENSIONS[pageSize];
+  const pageHeightPx = Math.round(dims.heightMm * 3.7795);
+  const hasToolbar = toolbar.length > 0;
+  const bodyHeightPx = getBodyHeightPx(pageSize);
+  return /* @__PURE__ */ jsxs4(
+    "div",
+    {
+      className: "ink-page-wrap",
+      "data-theme": theme,
+      style: {
+        "--ink-bg": colors.canvasBg,
+        "--ink-page": colors.paperColor,
+        "--ink-text": colors.textColor,
+        "--ink-border-line": colors.lineColor,
+        "--ink-accent": colors.accentColor,
+        "--ink-font-body": FONTS[font].family
+      },
+      children: [
+        editor && hasToolbar && /* @__PURE__ */ jsx4(
+          FloatingToolbar,
+          {
+            editor,
+            buttons: toolbar,
+            ruled,
+            onToggleRuled,
+            font,
+            onFontChange,
+            colors,
+            onColorsChange
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          "div",
+          {
+            className: `ink-page-card${ruled ? " ink-ruled" : ""}`,
+            style: {
+              width: widthPx,
+              minHeight: pageHeightPx,
+              padding: `${dims.paddingTopMm}mm ${dims.paddingRightMm}mm ${dims.paddingBottomMm}mm ${dims.paddingLeftMm}mm`,
+              ["--ink-padding-top"]: `${dims.paddingTopMm}mm`,
+              ["--ink-padding-right"]: `${dims.paddingRightMm}mm`,
+              ["--ink-padding-left"]: `${dims.paddingLeftMm}mm`,
+              ["--ink-body-width"]: `${bodyWidthPx}px`,
+              ["--ink-body-height"]: `${bodyHeightPx}px`
+            },
+            children: /* @__PURE__ */ jsx4(EditorContent, { editor })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/InkEditor.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var DEFAULT_TOOLBAR = ["bold", "italic", "underline", "h1", "h2", "align", "list", "indent", "lines"];
+function InkEditor({
+  pageSize = "A4",
+  onChange,
+  theme = "parchment",
+  toolbar = DEFAULT_TOOLBAR
+}) {
+  const [ruled, setRuled] = useState2(false);
+  const [font, setFont] = useState2("cursive");
+  const [colors, setColors] = useState2(
+    theme === "minimal" ? MINIMAL_DEFAULTS : PARCHMENT_DEFAULTS
+  );
+  const editor = useEditor({
+    extensions: [
+      StarterKit,
+      PageLayout.configure({ pageSize }),
+      TextAlign.configure({ types: ["heading", "paragraph"] }),
+      Underline2,
+      TabIndent
+    ],
+    onUpdate({ editor: editor2 }) {
+      onChange?.(editor2.getJSON());
+    }
+  });
+  useEffect4(() => {
+    return () => {
+      editor?.destroy();
+    };
+  }, [editor]);
+  return /* @__PURE__ */ jsx5(
+    PagedEditorContent,
+    {
+      editor,
+      pageSize,
+      theme,
+      toolbar,
+      ruled,
+      onToggleRuled: () => setRuled((r) => !r),
+      font,
+      onFontChange: setFont,
+      colors,
+      onColorsChange: setColors
+    }
+  );
+}
+export {
+  InkEditor,
+  MINIMAL_DEFAULTS,
+  PARCHMENT_DEFAULTS
+};
+//# sourceMappingURL=index.mjs.map