@witchcraft/editor 0.0.5 → 0.0.7

package/dist/runtime/pm/features/Blocks/commands/indentItem.js

@@ -0,0 +1,58 @@
+import { Fragment, Slice } from "@tiptap/pm/model";
+import { TextSelection } from "@tiptap/pm/state";
+import { ReplaceAroundStep } from "@tiptap/pm/transform";
+import { getTypeByName } from "../../../utils/getTypeByName.js";
+import { mapSelection } from "../../../utils/mapSelection.js";
+import { splitIntoChunks } from "../../../utils/splitIntoChunks.js";
+import { redirectFromEmbedded } from "../../EmbeddedDocument/utils/redirectFromEmbedded.js";
+export const indentItem = (itemTypeName, listTypeName) => (from, to) => ({ state, dispatch, tr, editor, view, commands }) => {
+  const redirect = redirectFromEmbedded(view, "indentItem", { args: [from, to], view, commands });
+  if (redirect.redirected) {
+    return redirect.result;
+  }
+  const listType = getTypeByName(editor.schema, listTypeName);
+  const itemType = getTypeByName(editor.schema, itemTypeName);
+  const sel = from !== void 0 ? TextSelection.create(tr.doc, from, to) : state.selection.map(tr.doc, tr.mapping);
+  const chunks = splitIntoChunks(tr.doc, itemType, sel);
+  const blockRangeFilter = (node) => node.childCount > 0 && node.firstChild.type === itemType;
+  let canChange = false;
+  for (const chunk of chunks) {
+    const { $from, $to } = mapSelection(tr, chunk);
+    const range = $from.blockRange($to, blockRangeFilter);
+    if (!range) continue;
+    canChange = true;
+    const start = range.start;
+    const end = range.end;
+    const itemIndex = $from.index(-1);
+    const isFirstChild = itemIndex === 0;
+    const nodeBefore = !isFirstChild ? $from.node(-1).child(itemIndex - 1) : void 0;
+    const nodeBeforeIsNested = nodeBefore?.lastChild?.type === listType;
+    const fragment = Fragment.from(
+      itemType.create(
+        null,
+        Fragment.from(listType.create(
+          null,
+          Fragment.from(nodeBeforeIsNested ? itemType.create() : null)
+        ))
+      )
+    );
+    const startOpen = nodeBeforeIsNested ? 3 : isFirstChild ? 0 : 1;
+    const slice = new Slice(
+      fragment,
+      startOpen,
+      0
+    );
+    if (dispatch) {
+      tr.step(new ReplaceAroundStep(
+        start - startOpen,
+        end,
+        start,
+        end,
+        slice,
+        isFirstChild ? 2 : 1,
+        true
+      ));
+    }
+  }
+  return canChange;
+};

package/dist/runtime/pm/features/Blocks/commands/itemMenuCommands.d.ts

@@ -0,0 +1,18 @@
+import type { Command } from "@tiptap/core";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        itemMenu: {
+            openItemMenu: (id?: string) => ReturnType;
+            closeItemMenu: (id?: string) => ReturnType;
+            toggleItemMenu: (id?: string) => ReturnType;
+        };
+    }
+}
+declare module "../../../../types/index.js" {
+    interface MenuCloseCommands {
+        closeItemMenu: "closeItemMenu";
+    }
+}
+export declare const openItemMenu: (itemTypeName: string) => (id?: string) => Command;
+export declare const closeItemMenu: () => () => Command;
+export declare const toggleItemMenu: () => (id?: string) => Command;

package/dist/runtime/pm/features/Blocks/commands/itemMenuCommands.js

@@ -0,0 +1,40 @@
+import { unreachable } from "@alanscodelog/utils";
+import { findUpwards } from "../../../utils/findUpwards.js";
+import { itemMenuPluginKey } from "../types.js";
+export const openItemMenu = (itemTypeName) => (id) => ({ tr, state, dispatch }) => {
+  const menu = itemMenuPluginKey.getState(state);
+  id ??= findUpwards(
+    tr.doc,
+    state.selection.map(tr.doc, tr.mapping).from,
+    ($pos) => {
+      if ($pos.node().type.name === itemTypeName) return true;
+      return false;
+    }
+  ).$pos?.node().attrs.blockId;
+  if (!id) {
+    unreachable();
+  }
+  if (menu?.opened && menu.id === id) return false;
+  if (dispatch) {
+    tr.setMeta("addToHistory", false);
+    tr.setMeta(itemMenuPluginKey, { opened: true, id });
+  }
+  return true;
+};
+export const closeItemMenu = () => () => ({ tr, state, dispatch }) => {
+  const menu = itemMenuPluginKey.getState(state);
+  if (menu && !menu.opened) return false;
+  if (dispatch) {
+    tr.setMeta("addToHistory", false);
+    tr.setMeta(itemMenuPluginKey, { opened: false, id: void 0 });
+  }
+  return true;
+};
+export const toggleItemMenu = () => (id) => ({ commands, state }) => {
+  const menu = itemMenuPluginKey.getState(state);
+  if (menu?.opened) {
+    return commands.closeItemMenu();
+  } else {
+    return commands.openItemMenu(id);
+  }
+};

package/dist/runtime/pm/features/Blocks/commands/moveItem.d.ts

@@ -0,0 +1,12 @@
+import type { Command } from "@tiptap/core";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        moveItem: {
+            /**
+             * @redirectable
+             */
+            moveItem: (dir: "down" | "up", pos?: number) => ReturnType;
+        };
+    }
+}
+export declare const moveItem: (itemTypeName: string) => (dir?: "down" | "up", pos?: number) => Command;

package/dist/runtime/pm/features/Blocks/commands/moveItem.js

@@ -0,0 +1,80 @@
+import { TextSelection } from "@tiptap/pm/state";
+import { getTypeByName } from "../../../utils/getTypeByName.js";
+import { debugNode } from "../../../utils/internal/debugNode.js";
+import { nodesBetween } from "../../../utils/nodesBetween.js";
+import { redirectFromEmbedded } from "../../EmbeddedDocument/utils/redirectFromEmbedded.js";
+export const moveItem = (itemTypeName) => (dir = "down", pos) => ({ state, dispatch, tr, editor, commands, view }) => {
+  const redirect = redirectFromEmbedded(view, "moveItem", { args: [pos], view, commands });
+  if (redirect.redirected) {
+    return redirect.result;
+  }
+  const itemType = getTypeByName(editor.schema, itemTypeName);
+  const { $from, $to, from, to } = pos ? TextSelection.create(tr.doc, pos, pos) : state.selection.map(tr.doc, tr.mapping);
+  const sharedDepth = Math.min($from.depth, $to.depth);
+  const $targetFrom = tr.doc.resolve($from.before($from.depth - sharedDepth - 1) + 1);
+  const $targetTo = tr.doc.resolve($to.before(sharedDepth - $to.depth - 1) + 1);
+  debugNode($targetFrom, `$targetFrom`);
+  debugNode($targetTo, `$targetTo`);
+  const range = $targetFrom.blockRange($targetTo);
+  if (!range) return false;
+  const start = range.$from.start();
+  const end = range.$to.end();
+  const slice = tr.doc.slice(start, end);
+  const itemBefore = $targetFrom.before();
+  const itemAfter = $targetTo.after();
+  const selectionFromOffset = from > itemBefore && from < itemAfter ? state.selection.from - itemBefore : void 0;
+  const selectionToOffset = to > itemBefore && to < itemAfter ? state.selection.to - itemBefore : void 0;
+  function restoreSelection(start2) {
+    if (dispatch && selectionFromOffset) {
+      tr.setSelection(TextSelection.create(
+        tr.doc,
+        start2 + selectionFromOffset,
+        selectionToOffset && selectionToOffset + start2
+      ));
+    }
+  }
+  if (dir === "up") {
+    const index = $targetFrom.index(-1);
+    const isFirstTopLevelItem = sharedDepth <= 2 && index === 0;
+    if (isFirstTopLevelItem) return false;
+    const $itemBefore = $targetFrom.index(-1) === 0 ? tr.doc.resolve($targetFrom.before(-2) + 1) : tr.doc.resolve($targetFrom.start() - 2);
+    if (!$itemBefore || $itemBefore.node().type.name !== itemType.name) return false;
+    if (dispatch) {
+      tr.delete(start - 2, end + 2);
+      const selStart = tr.mapping.map($itemBefore.start()) - 1;
+      tr.insert(tr.mapping.map($itemBefore.start()), slice.content);
+      restoreSelection(selStart);
+    }
+  }
+  if (dir === "down") {
+    let $afterItem;
+    nodesBetween(tr.doc, {
+      $from: tr.doc.resolve($to.pos),
+      $to: tr.doc.resolve(tr.doc.resolve(0).end())
+    }, (node, pos2) => {
+      if (!$afterItem && node?.type.name === itemType.name) {
+        $afterItem = tr.doc.resolve(pos2 + 1);
+      }
+      return false;
+    });
+    if (!$afterItem) return false;
+    if ($afterItem.depth === sharedDepth - 1) {
+      if (dispatch) {
+        tr.delete(start - 2, end + 2);
+        const selStart = tr.mapping.map($afterItem.end() + 1);
+        tr.insert(tr.mapping.map($afterItem.end() + 1), slice.content);
+        restoreSelection(selStart);
+      }
+    } else {
+      if (dispatch) {
+        const $child = tr.doc.resolve($afterItem.start() + 1);
+        const insertPos = $child.end() + 1;
+        tr.delete(start - 2, end + 2);
+        const selStart = tr.mapping.map(insertPos);
+        tr.insert(tr.mapping.map(insertPos), slice.content);
+        restoreSelection(selStart);
+      }
+    }
+  }
+  return true;
+};

package/dist/runtime/pm/features/Blocks/commands/setNode.d.ts

@@ -0,0 +1,20 @@
+import { type Command } from "@tiptap/core";
+import { type NodeType } from "@tiptap/pm/model";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        customSetNode: {
+            /**
+             * Override's tiptaps' setNode with one that:
+             *
+             * - Handles non-text node conversions.
+             * - Can passed a position.
+             * - Correctly preserves marks (only if allowed by the wanted node type).
+             * - Attempts to preserve the selection, including inside the node.
+             *
+             * Note that if a node does not set it's marks property and it's schema's markSet is null, this function takes it as all marks being allowed.
+             */
+            setNode: (typeOrName: string | NodeType, attributes?: Record<string, any>, pos?: number) => ReturnType;
+        };
+    }
+}
+export declare const setNode: () => (typeOrName: string | NodeType, attributes?: {}, pos?: number) => Command;

package/dist/runtime/pm/features/Blocks/commands/setNode.js

@@ -0,0 +1,87 @@
+import { getNodeType } from "@tiptap/core";
+import { Fragment, Slice } from "@tiptap/pm/model";
+import { Selection, TextSelection } from "@tiptap/pm/state";
+export const setNode = () => (typeOrName, attributes = {}, pos) => ({ state, tr, dispatch }) => {
+  const type = getNodeType(typeOrName, state.schema);
+  const $target = tr.doc.resolve(pos ?? tr.selection.from);
+  const targetStart = $target.start();
+  const targetEnd = $target.end();
+  const targetNode = $target.node();
+  const selection = tr.selection;
+  const offsets = [];
+  let newNodeStartOffset = 0;
+  let oldNodeStartOffset = 0;
+  if (!type.isTextblock || !targetNode.type.isTextblock) {
+    const newNode = type.createAndFill(attributes);
+    if (!newNode) return false;
+    let depth = 1;
+    let childNode = newNode;
+    while (childNode.childCount > 0) {
+      childNode = childNode.firstChild;
+      depth++;
+      if (childNode.isTextblock) break;
+    }
+    newNodeStartOffset = depth;
+    const insertNodeType = childNode.type;
+    let oldNode = targetNode;
+    depth = 0;
+    while (oldNode.childCount > 0) {
+      oldNode = oldNode.firstChild;
+      depth++;
+      if (oldNode.isTextblock) break;
+    }
+    oldNodeStartOffset = depth;
+    const nodes = [];
+    let offset = 0;
+    let lastPos = 0;
+    targetNode.nodesBetween(0, targetNode.content.size, (node, pos2) => {
+      if (node.isText) {
+        offset += pos2 - lastPos;
+        lastPos = pos2 - node.content.size + 1;
+        offsets.push({ pos: targetStart + pos2, offset: offset - oldNodeStartOffset });
+        nodes.push(state.schema.text(
+          node.text ?? "",
+          insertNodeType.allowedMarks(node.marks)
+        ));
+      }
+      return true;
+    });
+    if (newNodeStartOffset === void 0) return false;
+    const contentNodes = nodes.length > 0 && insertNodeType.isTextblock ? nodes : void 0;
+    if (dispatch) {
+      tr.replace(
+        targetStart,
+        targetEnd,
+        new Slice(Fragment.from(newNode), 0, 0)
+      );
+      if (contentNodes) {
+        tr.insert(targetStart + newNodeStartOffset, contentNodes);
+      }
+    }
+  } else {
+    if (dispatch) {
+      tr.setBlockType(targetStart, void 0, type, attributes);
+    }
+  }
+  if (dispatch) {
+    tr.setMeta("preventClearDocument", true);
+  }
+  if (dispatch) {
+    const mappedFrom = tr.mapping.map(selection.from);
+    const mappedTo = tr.mapping.map(selection.to);
+    const wantedFromOffset = offsets.findLast((_) => selection.from >= _.pos)?.offset ?? 0;
+    const from = selection.from >= targetStart && selection.from <= targetEnd ? selection.from - wantedFromOffset + newNodeStartOffset - oldNodeStartOffset : Selection.findFrom(tr.doc.resolve(mappedFrom), -1, true)?.from;
+    const wantedToOffset = offsets.findLast((_) => selection.to >= _.pos)?.offset ?? 0;
+    const to = selection.to >= targetStart && selection.to <= targetEnd ? selection.to - wantedToOffset + newNodeStartOffset - oldNodeStartOffset : Selection.findFrom(tr.doc.resolve(mappedTo), -1, true)?.to;
+    tr.setSelection(
+      TextSelection.create(
+        tr.doc,
+        // avoid errors from out of range positions just in case
+        // all this position mapping is quite finicky
+        from && from > 0 && from < tr.doc.content.size ? from : mappedFrom,
+        to && to > 0 && to < tr.doc.content.size ? to : mappedTo
+      )
+    );
+  }
+  return true;
+};

package/dist/runtime/pm/features/Blocks/commands/splitItem.d.ts

@@ -0,0 +1,17 @@
+import { type Command } from "@tiptap/core";
+import type { NodeType } from "@tiptap/pm/model";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        splitItem: {
+            /**
+             * Splits one list item into two list items. Does not lift like the default `splitListItem` command. Also takes care of generating a new uuid.
+             *
+             * @redirectable
+             */
+            splitItem: (pos?: number) => ReturnType;
+        };
+    }
+}
+export declare const splitItem: (itemType: string, 
+/** When at the end of a list item, the new list item will contain a node of this type. */
+fallbackNodeTypeOrName?: string | NodeType, idLength?: number) => (pos?: number) => Command;

package/dist/runtime/pm/features/Blocks/commands/splitItem.js

@@ -0,0 +1,87 @@
+import { unreachable } from "@alanscodelog/utils/unreachable";
+import { getNodeType } from "@tiptap/core";
+import { GapCursor } from "@tiptap/pm/gapcursor";
+import { TextSelection } from "@tiptap/pm/state";
+import { canSplit } from "@tiptap/pm/transform";
+import { nanoid } from "nanoid";
+import { redirectFromEmbedded } from "../../EmbeddedDocument/utils/redirectFromEmbedded.js";
+export const splitItem = (itemType, fallbackNodeTypeOrName = "paragraph", idLength = 10) => (pos) => ({ state, tr, editor, view, commands, dispatch }) => {
+  const redirect = redirectFromEmbedded(view, "splitItem", { args: [pos], view, commands });
+  if (redirect.redirected) {
+    return redirect.result;
+  }
+  const { $from, $to, to, empty } = pos ? TextSelection.create(tr.doc, pos) : state.selection.map(tr.doc, tr.mapping);
+  const parentItem = $from.node(-1);
+  const parentEndItem = $to.node(-1);
+  const blockId = parentItem.attrs.blockId === parentEndItem.attrs.blockId ? nanoid(idLength) : parentEndItem.attrs.blockId;
+  const isAtGapCursor = state.selection instanceof GapCursor;
+  const parentsAreItems = parentItem.type.name === itemType && parentEndItem.type.name === itemType;
+  if (isAtGapCursor || parentsAreItems) {
+    const fallbackNodeType = getNodeType(fallbackNodeTypeOrName, editor.schema);
+    const isAtEnd = empty && to === $from.end();
+    const nodeType = getNodeType(itemType, editor.schema);
+    if (isAtGapCursor) {
+      if (dispatch) {
+        const $realFrom = tr.doc.resolve($from.pos - 1);
+        const $realTo = tr.doc.resolve($to.pos - 1);
+        const realParentEndItem = $realFrom.node();
+        const realParentItem = $realTo.node();
+        if (realParentItem !== realParentEndItem || realParentItem.type.name !== itemType || realParentEndItem.type.name !== itemType) {
+          unreachable();
+        }
+        tr.insert(
+          $from.pos,
+          nodeType.create({
+            ...realParentEndItem.attrs,
+            blockId: void 0
+          }, [
+            fallbackNodeType.create()
+          ])
+        );
+      }
+    } else if (isAtEnd) {
+      const args = [
+        $from.pos,
+        2,
+        [{
+          type: nodeType,
+          attrs: { ...parentEndItem.attrs, blockId }
+        }, {
+          type: fallbackNodeType
+        }]
+      ];
+      const canSplitNode = canSplit(tr.doc, ...args);
+      if (dispatch) {
+        tr.split(...args);
+      }
+      return canSplitNode;
+    } else {
+      const nodeTo = $to.node();
+      const args = [$from.pos, 2, [
+        {
+          type: nodeType,
+          attrs: {
+            ...parentEndItem.attrs,
+            blockId
+          }
+        },
+        {
+          type: nodeTo.type,
+          attrs: nodeTo.attrs
+        }
+      ]];
+      const canSplitNode = !dispatch && canSplit(tr.doc, ...args);
+      if (dispatch) {
+        tr.delete($from.pos, $to.pos);
+        const accurateCanSplitNode = canSplit(tr.doc, ...args);
+        if (!accurateCanSplitNode) {
+          return false;
+        }
+        tr.split(...args);
+        return true;
+      }
+      return canSplitNode;
+    }
+  }
+  return false;
+};

package/dist/runtime/pm/features/Blocks/commands/unindentItem.d.ts

@@ -0,0 +1,12 @@
+import type { Command } from "@tiptap/core";
+declare module "@tiptap/core" {
+    interface Commands<ReturnType> {
+        unindentItem: {
+            /**
+             * @redirectable
+             */
+            unindentItem: (from?: number, to?: number) => ReturnType;
+        };
+    }
+}
+export declare const unindentItem: (itemTypeName: string) => (from?: number, to?: number) => Command;

package/dist/runtime/pm/features/Blocks/commands/unindentItem.js

@@ -0,0 +1,42 @@
+import { TextSelection } from "@tiptap/pm/state";
+import { canJoin, liftTarget } from "@tiptap/pm/transform";
+import { getTypeByName } from "../../../utils/getTypeByName.js";
+import { mapSelection } from "../../../utils/mapSelection.js";
+import { splitIntoChunks } from "../../../utils/splitIntoChunks.js";
+import { redirectFromEmbedded } from "../../EmbeddedDocument/utils/redirectFromEmbedded.js";
+export const unindentItem = (itemTypeName) => (from, to) => ({ state, dispatch, tr, editor, view, commands }) => {
+  const redirect = redirectFromEmbedded(view, "unindentItem", { args: [from, to], view, commands });
+  if (redirect.redirected) {
+    return redirect.result;
+  }
+  const itemType = getTypeByName(editor.schema, itemTypeName);
+  const sel = from !== void 0 ? TextSelection.create(tr.doc, from, to) : state.selection.map(tr.doc, tr.mapping);
+  const chunks = splitIntoChunks(tr.doc, itemType, sel, { splitChildren: true });
+  const blockRangeFilter = (node) => node.childCount > 0 && node.firstChild.type === itemType;
+  let canChange = false;
+  for (const chunk of chunks) {
+    const { $from, $to } = mapSelection(tr, chunk);
+    const range = $from.blockRange($to, blockRangeFilter);
+    if (!range) return false;
+    const isTopLevel = range.depth <= 1;
+    if (!isTopLevel) {
+      const end = range.end;
+      const target = liftTarget(range);
+      if (target === null) continue;
+      if (dispatch) {
+        tr.lift(range, target);
+      }
+      const after = tr.mapping.map(end, -1) - 1;
+      if (canJoin(tr.doc, after)) {
+        if (dispatch) {
+          tr.join(after);
+        }
+      }
+      if (dispatch) {
+        tr.scrollIntoView();
+      }
+      canChange = true;
+    }
+  }
+  return canChange;
+};

package/dist/runtime/pm/features/Blocks/components/DragTreeHandle.vue

@@ -0,0 +1,129 @@
+<template>
+<!-- todo move to ui library -->
+
+<div
+	contenteditable="false"
+	:class="twMerge(
+  `group/handles
+		absolute
+		left-0
+		w-[calc(var(--dragHandleSize)+var(--dragHandleMargin))]
+		h-full
+	`,
+  passedDragThreshold && `
+		hidden
+	`
+)"
+>
+	<div
+		:class="twMerge(
+  `grab-handle
+			absolute
+			left-0
+			w-[calc(var(--dragHandleSize)+var(--dragHandleMargin))]
+			flex justify-center
+			bg-gradient-to-br
+			from-neutral-50
+			to-neutral-100
+			dark:from-neutral-800
+			dark:to-neutral-900
+			rounded-sm
+			py-1
+			h-full
+			transition-opacity
+			duration-[450ms]
+
+			before:w-[var(--dragHandleSize)]
+			before:bg-neutral-300
+			dark:before:bg-neutral-700
+			before:[mask-image:var(--dragHandleImage)]
+			before:[mask-repeat:space]
+			before:[mask-size:calc(var(--dragHandleSize)/2.1)]
+			before:[mask-position:center]
+			opacity-0
+			group-hover/handles:cursor-pointer
+			group-hover/handles:opacity-100
+			group-[.using-touch]:hidden
+		`,
+  $attrs?.class
+)"
+		ref="grabHandle"
+		@pointerdown="emit('grabHandlePointerDown', $event)"
+		@contextmenu.prevent="emit('grabHandleContextMenu', $event)"
+	/>
+	<div
+		:class="twMerge(
+  `collapse-indicator
+			hover:cursor-pointer
+			absolute
+			flex items-center justify-center
+			h-full
+			w-[calc(var(--dragHandleSize)+var(--dragHandleMargin))]
+			group-[.using-touch]:hidden
+		`,
+  hasChildren && `
+			after:transition-all
+			after:opacity-0
+			group-hover/handles:after:opacity-100
+			group-hover/handles:after:bg-neutral-500
+			group/handles:after:hover:opacity-100
+			group-hover/handles:hover:after:bg-accent-500
+
+			after:h-[var(--dragHandleSize)]
+			after:w-[var(--dragHandleSize)]
+			after:bg-neutral-300
+			dark:after:bg-neutral-700
+
+			after:absolute
+			after:[mask-image:var(--dragHandleCollapseIndicatorImage)]
+			after:[mask-size:contain]
+			after:[mask-position:left]
+			after:[mask-repeat:no-repeat]
+		`,
+  hasChildren && !hideChildren && `
+			after:rotate-90
+			after:translate-y-[50%]
+		`,
+  hasChildren && hideChildren && `
+			after:left-0
+			group-[.using-touch]:block
+		`,
+  !hasChildren && `
+			hidden
+			group-[.using-touch]:hidden
+		`
+)"
+		@click="emit('collapseIndicatorClick', $event)"
+		@contextmenu.prevent="emit('grabHandleContextMenu', $event)"
+	/>
+</div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<script setup>
+import { twMerge } from "@witchcraft/ui/utils/twMerge";
+import { onMounted, onUnmounted, ref, useAttrs } from "vue";
+defineOptions({
+  name: "DragTreeHandle"
+});
+const $attrs = useAttrs();
+defineProps({
+  hasChildren: { type: Boolean, required: true },
+  passedDragThreshold: { type: Boolean, required: true },
+  hideChildren: { type: Boolean, required: true }
+});
+const emit = defineEmits(["collapseIndicatorClick", "grabHandlePassiveTouchStart", "grabHandlePointerDown", "grabHandleContextMenu"]);
+const grabHandle = ref(null);
+function touchStart(e) {
+  emit("grabHandlePassiveTouchStart", e);
+}
+onMounted(() => {
+  grabHandle.value.addEventListener("touchstart", touchStart, { passive: false });
+});
+onUnmounted(() => {
+  grabHandle.value?.removeEventListener("touchstart", touchStart);
+});
+</script>

package/dist/runtime/pm/features/Blocks/components/ItemMenu.d.vue.ts

@@ -0,0 +1,6 @@
+import type { Editor } from "@tiptap/core";
+type __VLS_Props = {
+    editor: Editor;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;