@tiptap/extension-drag-handle-vue-3 3.23.5 → 3.24.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -68,7 +68,15 @@ var DragHandle = (0, import_vue.defineComponent)({
68
68
  const root = (0, import_vue.ref)(null);
69
69
  const pluginHandle = (0, import_vue.shallowRef)(null);
70
70
  const initPlugin = () => {
71
- const { editor, pluginKey, onNodeChange, onElementDragEnd, onElementDragStart, computePositionConfig, nested } = props;
71
+ const {
72
+ editor,
73
+ pluginKey,
74
+ onNodeChange,
75
+ onElementDragEnd,
76
+ onElementDragStart,
77
+ computePositionConfig,
78
+ nested
79
+ } = props;
72
80
  if (!root.value) {
73
81
  return;
74
82
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/DragHandle.ts"],"sourcesContent":["import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n","import type { DragHandlePluginProps, NestedOptions } from '@tiptap/extension-drag-handle'\nimport {\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n normalizeNestedOptions,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/vue-3'\nimport type { PropType } from 'vue'\nimport { defineComponent, h, nextTick, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey' | 'nestedOptions'>, 'element'> & {\n class?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n /**\n * Enable drag handles for nested content (list items, blockquotes, etc.).\n *\n * When enabled, the drag handle will appear for nested blocks, not just\n * top-level blocks. A rule-based scoring system determines which node\n * to target based on cursor position and configured rules.\n *\n * @default false\n */\n nested?: boolean | NestedOptions\n}\n\nexport const DragHandle = defineComponent({\n name: 'DragHandleVue',\n\n props: {\n pluginKey: {\n type: [String, Object] as PropType<PluginKey | string>,\n default: dragHandlePluginDefaultKey,\n },\n\n editor: {\n type: Object as PropType<DragHandleProps['editor']>,\n required: true,\n },\n\n computePositionConfig: {\n type: Object as PropType<DragHandleProps['computePositionConfig']>,\n default: () => ({}),\n },\n\n onNodeChange: {\n type: Function as PropType<DragHandleProps['onNodeChange']>,\n default: null,\n },\n\n onElementDragStart: {\n type: Function as PropType<DragHandleProps['onElementDragStart']>,\n default: null,\n },\n\n onElementDragEnd: {\n type: Function as PropType<DragHandleProps['onElementDragEnd']>,\n default: null,\n },\n\n class: {\n type: String as PropType<DragHandleProps['class']>,\n default: 'drag-handle',\n },\n\n nested: {\n type: [Boolean, Object] as PropType<DragHandleProps['nested']>,\n default: false,\n },\n },\n\n setup(props, { slots }) {\n const root = ref<HTMLElement | null>(null)\n const pluginHandle = shallowRef<{ plugin: Plugin; unbind: () => void } | null>(null)\n\n const initPlugin = () => {\n const { editor, pluginKey, onNodeChange, onElementDragEnd, onElementDragStart, computePositionConfig, nested } =\n props\n\n if (!root.value) {\n return\n }\n if (!props.editor || props.editor.isDestroyed) {\n return\n }\n\n // Set initial visibility to hidden (let the plugin control it from here)\n root.value.style.visibility = 'hidden'\n\n const nestedOptions = normalizeNestedOptions(nested)\n\n const init = DragHandlePlugin({\n editor,\n element: root.value,\n pluginKey,\n computePositionConfig: { ...defaultComputePositionConfig, ...computePositionConfig },\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n nestedOptions,\n })\n\n pluginHandle.value = init\n props.editor.registerPlugin(init.plugin)\n }\n\n const destroyPlugin = () => {\n if (!pluginHandle.value) {\n return\n }\n\n if (props.editor && !props.editor.isDestroyed) {\n props.editor.unregisterPlugin(props.pluginKey)\n }\n\n pluginHandle.value.unbind?.()\n pluginHandle.value = null\n }\n\n onMounted(async () => {\n await nextTick()\n initPlugin()\n })\n\n // Reinitialize plugin when nested option changes\n watch(\n () => props.nested,\n () => {\n destroyPlugin()\n initPlugin()\n },\n { deep: true },\n )\n\n onBeforeUnmount(() => {\n destroyPlugin()\n })\n\n return () =>\n h(\n 'div',\n {\n ref: root,\n class: props.class,\n style: { position: 'absolute' },\n 'data-dragging': 'false',\n },\n slots.default?.(),\n )\n },\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,mCAKO;AAKP,iBAAiG;AAmB1F,IAAM,iBAAa,4BAAgB;AAAA,EACxC,MAAM;AAAA,EAEN,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IAEA,uBAAuB;AAAA,MACrB,MAAM;AAAA,MACN,SAAS,OAAO,CAAC;AAAA,IACnB;AAAA,IAEA,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,oBAAoB;AAAA,MAClB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM,CAAC,SAAS,MAAM;AAAA,MACtB,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EAEA,MAAM,OAAO,EAAE,MAAM,GAAG;AACtB,UAAM,WAAO,gBAAwB,IAAI;AACzC,UAAM,mBAAe,uBAA0D,IAAI;AAEnF,UAAM,aAAa,MAAM;AACvB,YAAM,EAAE,QAAQ,WAAW,cAAc,kBAAkB,oBAAoB,uBAAuB,OAAO,IAC3G;AAEF,UAAI,CAAC,KAAK,OAAO;AACf;AAAA,MACF;AACA,UAAI,CAAC,MAAM,UAAU,MAAM,OAAO,aAAa;AAC7C;AAAA,MACF;AAGA,WAAK,MAAM,MAAM,aAAa;AAE9B,YAAM,oBAAgB,qDAAuB,MAAM;AAEnD,YAAM,WAAO,+CAAiB;AAAA,QAC5B;AAAA,QACA,SAAS,KAAK;AAAA,QACd;AAAA,QACA,uBAAuB,EAAE,GAAG,2DAA8B,GAAG,sBAAsB;AAAA,QACnF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,mBAAa,QAAQ;AACrB,YAAM,OAAO,eAAe,KAAK,MAAM;AAAA,IACzC;AAEA,UAAM,gBAAgB,MAAM;AA9GhC;AA+GM,UAAI,CAAC,aAAa,OAAO;AACvB;AAAA,MACF;AAEA,UAAI,MAAM,UAAU,CAAC,MAAM,OAAO,aAAa;AAC7C,cAAM,OAAO,iBAAiB,MAAM,SAAS;AAAA,MAC/C;AAEA,+BAAa,OAAM,WAAnB;AACA,mBAAa,QAAQ;AAAA,IACvB;AAEA,8BAAU,YAAY;AACpB,gBAAM,qBAAS;AACf,iBAAW;AAAA,IACb,CAAC;AAGD;AAAA,MACE,MAAM,MAAM;AAAA,MACZ,MAAM;AACJ,sBAAc;AACd,mBAAW;AAAA,MACb;AAAA,MACA,EAAE,MAAM,KAAK;AAAA,IACf;AAEA,oCAAgB,MAAM;AACpB,oBAAc;AAAA,IAChB,CAAC;AAED,WAAO,MAAG;AA9Id;AA+IM;AAAA,QACE;AAAA,QACA;AAAA,UACE,KAAK;AAAA,UACL,OAAO,MAAM;AAAA,UACb,OAAO,EAAE,UAAU,WAAW;AAAA,UAC9B,iBAAiB;AAAA,QACnB;AAAA,SACA,WAAM,YAAN;AAAA,MACF;AAAA;AAAA,EACJ;AACF,CAAC;;;ADtJD,IAAO,gBAAQ;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts","../src/DragHandle.ts"],"sourcesContent":["import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n","import type { DragHandlePluginProps, NestedOptions } from '@tiptap/extension-drag-handle'\nimport {\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n normalizeNestedOptions,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/vue-3'\nimport type { PropType } from 'vue'\nimport {\n defineComponent,\n h,\n nextTick,\n onBeforeUnmount,\n onMounted,\n ref,\n shallowRef,\n watch,\n} from 'vue'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<\n Optional<DragHandlePluginProps, 'pluginKey' | 'nestedOptions'>,\n 'element'\n> & {\n class?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n /**\n * Enable drag handles for nested content (list items, blockquotes, etc.).\n *\n * When enabled, the drag handle will appear for nested blocks, not just\n * top-level blocks. A rule-based scoring system determines which node\n * to target based on cursor position and configured rules.\n *\n * @default false\n */\n nested?: boolean | NestedOptions\n}\n\nexport const DragHandle = defineComponent({\n name: 'DragHandleVue',\n\n props: {\n pluginKey: {\n type: [String, Object] as PropType<PluginKey | string>,\n default: dragHandlePluginDefaultKey,\n },\n\n editor: {\n type: Object as PropType<DragHandleProps['editor']>,\n required: true,\n },\n\n computePositionConfig: {\n type: Object as PropType<DragHandleProps['computePositionConfig']>,\n default: () => ({}),\n },\n\n onNodeChange: {\n type: Function as PropType<DragHandleProps['onNodeChange']>,\n default: null,\n },\n\n onElementDragStart: {\n type: Function as PropType<DragHandleProps['onElementDragStart']>,\n default: null,\n },\n\n onElementDragEnd: {\n type: Function as PropType<DragHandleProps['onElementDragEnd']>,\n default: null,\n },\n\n class: {\n type: String as PropType<DragHandleProps['class']>,\n default: 'drag-handle',\n },\n\n nested: {\n type: [Boolean, Object] as PropType<DragHandleProps['nested']>,\n default: false,\n },\n },\n\n setup(props, { slots }) {\n const root = ref<HTMLElement | null>(null)\n const pluginHandle = shallowRef<{ plugin: Plugin; unbind: () => void } | null>(null)\n\n const initPlugin = () => {\n const {\n editor,\n pluginKey,\n onNodeChange,\n onElementDragEnd,\n onElementDragStart,\n computePositionConfig,\n nested,\n } = props\n\n if (!root.value) {\n return\n }\n if (!props.editor || props.editor.isDestroyed) {\n return\n }\n\n // Set initial visibility to hidden (let the plugin control it from here)\n root.value.style.visibility = 'hidden'\n\n const nestedOptions = normalizeNestedOptions(nested)\n\n const init = DragHandlePlugin({\n editor,\n element: root.value,\n pluginKey,\n computePositionConfig: { ...defaultComputePositionConfig, ...computePositionConfig },\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n nestedOptions,\n })\n\n pluginHandle.value = init\n props.editor.registerPlugin(init.plugin)\n }\n\n const destroyPlugin = () => {\n if (!pluginHandle.value) {\n return\n }\n\n if (props.editor && !props.editor.isDestroyed) {\n props.editor.unregisterPlugin(props.pluginKey)\n }\n\n pluginHandle.value.unbind?.()\n pluginHandle.value = null\n }\n\n onMounted(async () => {\n await nextTick()\n initPlugin()\n })\n\n // Reinitialize plugin when nested option changes\n watch(\n () => props.nested,\n () => {\n destroyPlugin()\n initPlugin()\n },\n { deep: true },\n )\n\n onBeforeUnmount(() => {\n destroyPlugin()\n })\n\n return () =>\n h(\n 'div',\n {\n ref: root,\n class: props.class,\n style: { position: 'absolute' },\n 'data-dragging': 'false',\n },\n slots.default?.(),\n )\n },\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA,mCAKO;AAKP,iBASO;AAsBA,IAAM,iBAAa,4BAAgB;AAAA,EACxC,MAAM;AAAA,EAEN,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IAEA,uBAAuB;AAAA,MACrB,MAAM;AAAA,MACN,SAAS,OAAO,CAAC;AAAA,IACnB;AAAA,IAEA,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,oBAAoB;AAAA,MAClB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM,CAAC,SAAS,MAAM;AAAA,MACtB,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EAEA,MAAM,OAAO,EAAE,MAAM,GAAG;AACtB,UAAM,WAAO,gBAAwB,IAAI;AACzC,UAAM,mBAAe,uBAA0D,IAAI;AAEnF,UAAM,aAAa,MAAM;AACvB,YAAM;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,IAAI;AAEJ,UAAI,CAAC,KAAK,OAAO;AACf;AAAA,MACF;AACA,UAAI,CAAC,MAAM,UAAU,MAAM,OAAO,aAAa;AAC7C;AAAA,MACF;AAGA,WAAK,MAAM,MAAM,aAAa;AAE9B,YAAM,oBAAgB,qDAAuB,MAAM;AAEnD,YAAM,WAAO,+CAAiB;AAAA,QAC5B;AAAA,QACA,SAAS,KAAK;AAAA,QACd;AAAA,QACA,uBAAuB,EAAE,GAAG,2DAA8B,GAAG,sBAAsB;AAAA,QACnF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,mBAAa,QAAQ;AACrB,YAAM,OAAO,eAAe,KAAK,MAAM;AAAA,IACzC;AAEA,UAAM,gBAAgB,MAAM;AAjIhC;AAkIM,UAAI,CAAC,aAAa,OAAO;AACvB;AAAA,MACF;AAEA,UAAI,MAAM,UAAU,CAAC,MAAM,OAAO,aAAa;AAC7C,cAAM,OAAO,iBAAiB,MAAM,SAAS;AAAA,MAC/C;AAEA,+BAAa,OAAM,WAAnB;AACA,mBAAa,QAAQ;AAAA,IACvB;AAEA,8BAAU,YAAY;AACpB,gBAAM,qBAAS;AACf,iBAAW;AAAA,IACb,CAAC;AAGD;AAAA,MACE,MAAM,MAAM;AAAA,MACZ,MAAM;AACJ,sBAAc;AACd,mBAAW;AAAA,MACb;AAAA,MACA,EAAE,MAAM,KAAK;AAAA,IACf;AAEA,oCAAgB,MAAM;AACpB,oBAAc;AAAA,IAChB,CAAC;AAED,WAAO,MAAG;AAjKd;AAkKM;AAAA,QACE;AAAA,QACA;AAAA,UACE,KAAK;AAAA,UACL,OAAO,MAAM;AAAA,UACb,OAAO,EAAE,UAAU,WAAW;AAAA,UAC9B,iBAAiB;AAAA,QACnB;AAAA,SACA,WAAM,YAAN;AAAA,MACF;AAAA;AAAA,EACJ;AACF,CAAC;;;ADzKD,IAAO,gBAAQ;","names":[]}
package/dist/index.js CHANGED
@@ -5,7 +5,16 @@ import {
5
5
  dragHandlePluginDefaultKey,
6
6
  normalizeNestedOptions
7
7
  } from "@tiptap/extension-drag-handle";
8
- import { defineComponent, h, nextTick, onBeforeUnmount, onMounted, ref, shallowRef, watch } from "vue";
8
+ import {
9
+ defineComponent,
10
+ h,
11
+ nextTick,
12
+ onBeforeUnmount,
13
+ onMounted,
14
+ ref,
15
+ shallowRef,
16
+ watch
17
+ } from "vue";
9
18
  var DragHandle = defineComponent({
10
19
  name: "DragHandleVue",
11
20
  props: {
@@ -46,7 +55,15 @@ var DragHandle = defineComponent({
46
55
  const root = ref(null);
47
56
  const pluginHandle = shallowRef(null);
48
57
  const initPlugin = () => {
49
- const { editor, pluginKey, onNodeChange, onElementDragEnd, onElementDragStart, computePositionConfig, nested } = props;
58
+ const {
59
+ editor,
60
+ pluginKey,
61
+ onNodeChange,
62
+ onElementDragEnd,
63
+ onElementDragStart,
64
+ computePositionConfig,
65
+ nested
66
+ } = props;
50
67
  if (!root.value) {
51
68
  return;
52
69
  }
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/DragHandle.ts","../src/index.ts"],"sourcesContent":["import type { DragHandlePluginProps, NestedOptions } from '@tiptap/extension-drag-handle'\nimport {\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n normalizeNestedOptions,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/vue-3'\nimport type { PropType } from 'vue'\nimport { defineComponent, h, nextTick, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey' | 'nestedOptions'>, 'element'> & {\n class?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n /**\n * Enable drag handles for nested content (list items, blockquotes, etc.).\n *\n * When enabled, the drag handle will appear for nested blocks, not just\n * top-level blocks. A rule-based scoring system determines which node\n * to target based on cursor position and configured rules.\n *\n * @default false\n */\n nested?: boolean | NestedOptions\n}\n\nexport const DragHandle = defineComponent({\n name: 'DragHandleVue',\n\n props: {\n pluginKey: {\n type: [String, Object] as PropType<PluginKey | string>,\n default: dragHandlePluginDefaultKey,\n },\n\n editor: {\n type: Object as PropType<DragHandleProps['editor']>,\n required: true,\n },\n\n computePositionConfig: {\n type: Object as PropType<DragHandleProps['computePositionConfig']>,\n default: () => ({}),\n },\n\n onNodeChange: {\n type: Function as PropType<DragHandleProps['onNodeChange']>,\n default: null,\n },\n\n onElementDragStart: {\n type: Function as PropType<DragHandleProps['onElementDragStart']>,\n default: null,\n },\n\n onElementDragEnd: {\n type: Function as PropType<DragHandleProps['onElementDragEnd']>,\n default: null,\n },\n\n class: {\n type: String as PropType<DragHandleProps['class']>,\n default: 'drag-handle',\n },\n\n nested: {\n type: [Boolean, Object] as PropType<DragHandleProps['nested']>,\n default: false,\n },\n },\n\n setup(props, { slots }) {\n const root = ref<HTMLElement | null>(null)\n const pluginHandle = shallowRef<{ plugin: Plugin; unbind: () => void } | null>(null)\n\n const initPlugin = () => {\n const { editor, pluginKey, onNodeChange, onElementDragEnd, onElementDragStart, computePositionConfig, nested } =\n props\n\n if (!root.value) {\n return\n }\n if (!props.editor || props.editor.isDestroyed) {\n return\n }\n\n // Set initial visibility to hidden (let the plugin control it from here)\n root.value.style.visibility = 'hidden'\n\n const nestedOptions = normalizeNestedOptions(nested)\n\n const init = DragHandlePlugin({\n editor,\n element: root.value,\n pluginKey,\n computePositionConfig: { ...defaultComputePositionConfig, ...computePositionConfig },\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n nestedOptions,\n })\n\n pluginHandle.value = init\n props.editor.registerPlugin(init.plugin)\n }\n\n const destroyPlugin = () => {\n if (!pluginHandle.value) {\n return\n }\n\n if (props.editor && !props.editor.isDestroyed) {\n props.editor.unregisterPlugin(props.pluginKey)\n }\n\n pluginHandle.value.unbind?.()\n pluginHandle.value = null\n }\n\n onMounted(async () => {\n await nextTick()\n initPlugin()\n })\n\n // Reinitialize plugin when nested option changes\n watch(\n () => props.nested,\n () => {\n destroyPlugin()\n initPlugin()\n },\n { deep: true },\n )\n\n onBeforeUnmount(() => {\n destroyPlugin()\n })\n\n return () =>\n h(\n 'div',\n {\n ref: root,\n class: props.class,\n style: { position: 'absolute' },\n 'data-dragging': 'false',\n },\n slots.default?.(),\n )\n },\n})\n","import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n"],"mappings":";AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAKP,SAAS,iBAAiB,GAAG,UAAU,iBAAiB,WAAW,KAAK,YAAY,aAAa;AAmB1F,IAAM,aAAa,gBAAgB;AAAA,EACxC,MAAM;AAAA,EAEN,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IAEA,uBAAuB;AAAA,MACrB,MAAM;AAAA,MACN,SAAS,OAAO,CAAC;AAAA,IACnB;AAAA,IAEA,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,oBAAoB;AAAA,MAClB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM,CAAC,SAAS,MAAM;AAAA,MACtB,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EAEA,MAAM,OAAO,EAAE,MAAM,GAAG;AACtB,UAAM,OAAO,IAAwB,IAAI;AACzC,UAAM,eAAe,WAA0D,IAAI;AAEnF,UAAM,aAAa,MAAM;AACvB,YAAM,EAAE,QAAQ,WAAW,cAAc,kBAAkB,oBAAoB,uBAAuB,OAAO,IAC3G;AAEF,UAAI,CAAC,KAAK,OAAO;AACf;AAAA,MACF;AACA,UAAI,CAAC,MAAM,UAAU,MAAM,OAAO,aAAa;AAC7C;AAAA,MACF;AAGA,WAAK,MAAM,MAAM,aAAa;AAE9B,YAAM,gBAAgB,uBAAuB,MAAM;AAEnD,YAAM,OAAO,iBAAiB;AAAA,QAC5B;AAAA,QACA,SAAS,KAAK;AAAA,QACd;AAAA,QACA,uBAAuB,EAAE,GAAG,8BAA8B,GAAG,sBAAsB;AAAA,QACnF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,mBAAa,QAAQ;AACrB,YAAM,OAAO,eAAe,KAAK,MAAM;AAAA,IACzC;AAEA,UAAM,gBAAgB,MAAM;AA9GhC;AA+GM,UAAI,CAAC,aAAa,OAAO;AACvB;AAAA,MACF;AAEA,UAAI,MAAM,UAAU,CAAC,MAAM,OAAO,aAAa;AAC7C,cAAM,OAAO,iBAAiB,MAAM,SAAS;AAAA,MAC/C;AAEA,+BAAa,OAAM,WAAnB;AACA,mBAAa,QAAQ;AAAA,IACvB;AAEA,cAAU,YAAY;AACpB,YAAM,SAAS;AACf,iBAAW;AAAA,IACb,CAAC;AAGD;AAAA,MACE,MAAM,MAAM;AAAA,MACZ,MAAM;AACJ,sBAAc;AACd,mBAAW;AAAA,MACb;AAAA,MACA,EAAE,MAAM,KAAK;AAAA,IACf;AAEA,oBAAgB,MAAM;AACpB,oBAAc;AAAA,IAChB,CAAC;AAED,WAAO,MAAG;AA9Id;AA+IM;AAAA,QACE;AAAA,QACA;AAAA,UACE,KAAK;AAAA,UACL,OAAO,MAAM;AAAA,UACb,OAAO,EAAE,UAAU,WAAW;AAAA,UAC9B,iBAAiB;AAAA,QACnB;AAAA,SACA,WAAM,YAAN;AAAA,MACF;AAAA;AAAA,EACJ;AACF,CAAC;;;ACtJD,IAAO,gBAAQ;","names":[]}
1
+ {"version":3,"sources":["../src/DragHandle.ts","../src/index.ts"],"sourcesContent":["import type { DragHandlePluginProps, NestedOptions } from '@tiptap/extension-drag-handle'\nimport {\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n normalizeNestedOptions,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin, PluginKey } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/vue-3'\nimport type { PropType } from 'vue'\nimport {\n defineComponent,\n h,\n nextTick,\n onBeforeUnmount,\n onMounted,\n ref,\n shallowRef,\n watch,\n} from 'vue'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<\n Optional<DragHandlePluginProps, 'pluginKey' | 'nestedOptions'>,\n 'element'\n> & {\n class?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n /**\n * Enable drag handles for nested content (list items, blockquotes, etc.).\n *\n * When enabled, the drag handle will appear for nested blocks, not just\n * top-level blocks. A rule-based scoring system determines which node\n * to target based on cursor position and configured rules.\n *\n * @default false\n */\n nested?: boolean | NestedOptions\n}\n\nexport const DragHandle = defineComponent({\n name: 'DragHandleVue',\n\n props: {\n pluginKey: {\n type: [String, Object] as PropType<PluginKey | string>,\n default: dragHandlePluginDefaultKey,\n },\n\n editor: {\n type: Object as PropType<DragHandleProps['editor']>,\n required: true,\n },\n\n computePositionConfig: {\n type: Object as PropType<DragHandleProps['computePositionConfig']>,\n default: () => ({}),\n },\n\n onNodeChange: {\n type: Function as PropType<DragHandleProps['onNodeChange']>,\n default: null,\n },\n\n onElementDragStart: {\n type: Function as PropType<DragHandleProps['onElementDragStart']>,\n default: null,\n },\n\n onElementDragEnd: {\n type: Function as PropType<DragHandleProps['onElementDragEnd']>,\n default: null,\n },\n\n class: {\n type: String as PropType<DragHandleProps['class']>,\n default: 'drag-handle',\n },\n\n nested: {\n type: [Boolean, Object] as PropType<DragHandleProps['nested']>,\n default: false,\n },\n },\n\n setup(props, { slots }) {\n const root = ref<HTMLElement | null>(null)\n const pluginHandle = shallowRef<{ plugin: Plugin; unbind: () => void } | null>(null)\n\n const initPlugin = () => {\n const {\n editor,\n pluginKey,\n onNodeChange,\n onElementDragEnd,\n onElementDragStart,\n computePositionConfig,\n nested,\n } = props\n\n if (!root.value) {\n return\n }\n if (!props.editor || props.editor.isDestroyed) {\n return\n }\n\n // Set initial visibility to hidden (let the plugin control it from here)\n root.value.style.visibility = 'hidden'\n\n const nestedOptions = normalizeNestedOptions(nested)\n\n const init = DragHandlePlugin({\n editor,\n element: root.value,\n pluginKey,\n computePositionConfig: { ...defaultComputePositionConfig, ...computePositionConfig },\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n nestedOptions,\n })\n\n pluginHandle.value = init\n props.editor.registerPlugin(init.plugin)\n }\n\n const destroyPlugin = () => {\n if (!pluginHandle.value) {\n return\n }\n\n if (props.editor && !props.editor.isDestroyed) {\n props.editor.unregisterPlugin(props.pluginKey)\n }\n\n pluginHandle.value.unbind?.()\n pluginHandle.value = null\n }\n\n onMounted(async () => {\n await nextTick()\n initPlugin()\n })\n\n // Reinitialize plugin when nested option changes\n watch(\n () => props.nested,\n () => {\n destroyPlugin()\n initPlugin()\n },\n { deep: true },\n )\n\n onBeforeUnmount(() => {\n destroyPlugin()\n })\n\n return () =>\n h(\n 'div',\n {\n ref: root,\n class: props.class,\n style: { position: 'absolute' },\n 'data-dragging': 'false',\n },\n slots.default?.(),\n )\n },\n})\n","import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n"],"mappings":";AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAKP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAsBA,IAAM,aAAa,gBAAgB;AAAA,EACxC,MAAM;AAAA,EAEN,OAAO;AAAA,IACL,WAAW;AAAA,MACT,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,UAAU;AAAA,IACZ;AAAA,IAEA,uBAAuB;AAAA,MACrB,MAAM;AAAA,MACN,SAAS,OAAO,CAAC;AAAA,IACnB;AAAA,IAEA,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,oBAAoB;AAAA,MAClB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,kBAAkB;AAAA,MAChB,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,IACX;AAAA,IAEA,QAAQ;AAAA,MACN,MAAM,CAAC,SAAS,MAAM;AAAA,MACtB,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EAEA,MAAM,OAAO,EAAE,MAAM,GAAG;AACtB,UAAM,OAAO,IAAwB,IAAI;AACzC,UAAM,eAAe,WAA0D,IAAI;AAEnF,UAAM,aAAa,MAAM;AACvB,YAAM;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,IAAI;AAEJ,UAAI,CAAC,KAAK,OAAO;AACf;AAAA,MACF;AACA,UAAI,CAAC,MAAM,UAAU,MAAM,OAAO,aAAa;AAC7C;AAAA,MACF;AAGA,WAAK,MAAM,MAAM,aAAa;AAE9B,YAAM,gBAAgB,uBAAuB,MAAM;AAEnD,YAAM,OAAO,iBAAiB;AAAA,QAC5B;AAAA,QACA,SAAS,KAAK;AAAA,QACd;AAAA,QACA,uBAAuB,EAAE,GAAG,8BAA8B,GAAG,sBAAsB;AAAA,QACnF;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AAED,mBAAa,QAAQ;AACrB,YAAM,OAAO,eAAe,KAAK,MAAM;AAAA,IACzC;AAEA,UAAM,gBAAgB,MAAM;AAjIhC;AAkIM,UAAI,CAAC,aAAa,OAAO;AACvB;AAAA,MACF;AAEA,UAAI,MAAM,UAAU,CAAC,MAAM,OAAO,aAAa;AAC7C,cAAM,OAAO,iBAAiB,MAAM,SAAS;AAAA,MAC/C;AAEA,+BAAa,OAAM,WAAnB;AACA,mBAAa,QAAQ;AAAA,IACvB;AAEA,cAAU,YAAY;AACpB,YAAM,SAAS;AACf,iBAAW;AAAA,IACb,CAAC;AAGD;AAAA,MACE,MAAM,MAAM;AAAA,MACZ,MAAM;AACJ,sBAAc;AACd,mBAAW;AAAA,MACb;AAAA,MACA,EAAE,MAAM,KAAK;AAAA,IACf;AAEA,oBAAgB,MAAM;AACpB,oBAAc;AAAA,IAChB,CAAC;AAED,WAAO,MAAG;AAjKd;AAkKM;AAAA,QACE;AAAA,QACA;AAAA,UACE,KAAK;AAAA,UACL,OAAO,MAAM;AAAA,UACb,OAAO,EAAE,UAAU,WAAW;AAAA,UAC9B,iBAAiB;AAAA,QACnB;AAAA,SACA,WAAM,YAAN;AAAA,MACF;AAAA;AAAA,EACJ;AACF,CAAC;;;ACzKD,IAAO,gBAAQ;","names":[]}
package/package.json CHANGED
@@ -1,23 +1,30 @@
1
1
  {
2
2
  "name": "@tiptap/extension-drag-handle-vue-3",
3
+ "version": "3.24.0",
3
4
  "description": "drag handle extension for tiptap with vue 3",
4
- "version": "3.23.5",
5
- "homepage": "https://tiptap.dev",
6
5
  "keywords": [
7
6
  "tiptap",
8
7
  "tiptap extension"
9
8
  ],
9
+ "homepage": "https://tiptap.dev",
10
10
  "license": "MIT",
11
- "funding": {
12
- "type": "github",
13
- "url": "https://github.com/sponsors/ueberdosis"
14
- },
15
11
  "repository": {
16
12
  "type": "git",
17
13
  "url": "https://github.com/ueberdosis/tiptap",
18
14
  "directory": "packages/extension-drag-handle-vue-3"
19
15
  },
16
+ "funding": {
17
+ "type": "github",
18
+ "url": "https://github.com/sponsors/ueberdosis"
19
+ },
20
+ "files": [
21
+ "src",
22
+ "dist"
23
+ ],
20
24
  "type": "module",
25
+ "main": "dist/index.cjs",
26
+ "module": "dist/index.js",
27
+ "types": "dist/index.d.ts",
21
28
  "exports": {
22
29
  ".": {
23
30
  "types": {
@@ -28,27 +35,19 @@
28
35
  "require": "./dist/index.cjs"
29
36
  }
30
37
  },
31
- "main": "dist/index.cjs",
32
- "module": "dist/index.js",
33
- "types": "dist/index.d.ts",
34
- "files": [
35
- "src",
36
- "dist"
37
- ],
38
- "peerDependencies": {
38
+ "devDependencies": {
39
39
  "vue": "^3.0.0",
40
- "@tiptap/extension-drag-handle": "3.23.5",
41
- "@tiptap/pm": "3.23.5",
42
- "@tiptap/vue-3": "3.23.5"
40
+ "@tiptap/pm": "^3.24.0",
41
+ "@tiptap/extension-drag-handle": "^3.24.0",
42
+ "@tiptap/vue-3": "^3.24.0"
43
43
  },
44
- "devDependencies": {
44
+ "peerDependencies": {
45
45
  "vue": "^3.0.0",
46
- "@tiptap/extension-drag-handle": "^3.23.5",
47
- "@tiptap/pm": "^3.23.5",
48
- "@tiptap/vue-3": "^3.23.5"
46
+ "@tiptap/pm": "3.24.0",
47
+ "@tiptap/vue-3": "3.24.0",
48
+ "@tiptap/extension-drag-handle": "3.24.0"
49
49
  },
50
50
  "scripts": {
51
- "build": "tsup",
52
- "lint": "prettier ./src/ --check && eslint --cache --quiet --no-error-on-unmatched-pattern ./src/"
51
+ "build": "tsup"
53
52
  }
54
53
  }
package/src/DragHandle.ts CHANGED
@@ -9,11 +9,23 @@ import type { Node } from '@tiptap/pm/model'
9
9
  import type { Plugin, PluginKey } from '@tiptap/pm/state'
10
10
  import type { Editor } from '@tiptap/vue-3'
11
11
  import type { PropType } from 'vue'
12
- import { defineComponent, h, nextTick, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue'
12
+ import {
13
+ defineComponent,
14
+ h,
15
+ nextTick,
16
+ onBeforeUnmount,
17
+ onMounted,
18
+ ref,
19
+ shallowRef,
20
+ watch,
21
+ } from 'vue'
13
22
 
14
23
  type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>
15
24
 
16
- export type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey' | 'nestedOptions'>, 'element'> & {
25
+ export type DragHandleProps = Omit<
26
+ Optional<DragHandlePluginProps, 'pluginKey' | 'nestedOptions'>,
27
+ 'element'
28
+ > & {
17
29
  class?: string
18
30
  onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void
19
31
  /**
@@ -78,8 +90,15 @@ export const DragHandle = defineComponent({
78
90
  const pluginHandle = shallowRef<{ plugin: Plugin; unbind: () => void } | null>(null)
79
91
 
80
92
  const initPlugin = () => {
81
- const { editor, pluginKey, onNodeChange, onElementDragEnd, onElementDragStart, computePositionConfig, nested } =
82
- props
93
+ const {
94
+ editor,
95
+ pluginKey,
96
+ onNodeChange,
97
+ onElementDragEnd,
98
+ onElementDragStart,
99
+ computePositionConfig,
100
+ nested,
101
+ } = props
83
102
 
84
103
  if (!root.value) {
85
104
  return