@tiptap/extension-drag-handle-react 3.12.0 → 3.13.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 +10 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +10 -1
- package/dist/index.js.map +1 -1
- package/package.json +7 -7
- package/src/DragHandle.tsx +6 -1
package/dist/index.cjs
CHANGED
|
@@ -79,7 +79,16 @@ var DragHandle = (props) => {
|
|
|
79
79
|
}
|
|
80
80
|
};
|
|
81
81
|
}, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd]);
|
|
82
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
82
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
83
|
+
"div",
|
|
84
|
+
{
|
|
85
|
+
className,
|
|
86
|
+
style: { visibility: "hidden", position: "absolute" },
|
|
87
|
+
"data-dragging": "false",
|
|
88
|
+
ref: setElement,
|
|
89
|
+
children
|
|
90
|
+
}
|
|
91
|
+
);
|
|
83
92
|
};
|
|
84
93
|
|
|
85
94
|
// src/index.ts
|
package/dist/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts","../src/DragHandle.tsx"],"sourcesContent":["import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n","import {\n type DragHandlePluginProps,\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/react'\nimport { type ReactNode, useEffect, useRef, useState } from 'react'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey'>, 'element'> & {\n className?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n children: ReactNode\n}\n\nexport const DragHandle = (props: DragHandleProps) => {\n const {\n className = 'drag-handle',\n children,\n editor,\n pluginKey = dragHandlePluginDefaultKey,\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n computePositionConfig = defaultComputePositionConfig,\n } = props\n const [element, setElement] = useState<HTMLDivElement | null>(null)\n const plugin = useRef<Plugin | null>(null)\n\n useEffect(() => {\n let initPlugin: {\n plugin: Plugin\n unbind: () => void\n } | null = null\n\n if (!element) {\n return () => {\n plugin.current = null\n }\n }\n\n if (editor.isDestroyed) {\n return () => {\n plugin.current = null\n }\n }\n\n if (!plugin.current) {\n initPlugin = DragHandlePlugin({\n editor,\n element,\n pluginKey,\n computePositionConfig: {\n ...defaultComputePositionConfig,\n ...computePositionConfig,\n },\n onElementDragStart,\n onElementDragEnd,\n onNodeChange,\n })\n plugin.current = initPlugin.plugin\n\n editor.registerPlugin(plugin.current)\n }\n\n return () => {\n editor.unregisterPlugin(pluginKey)\n plugin.current = null\n if (initPlugin) {\n initPlugin.unbind()\n initPlugin = null\n }\n }\n }, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd])\n\n return (\n <div
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/DragHandle.tsx"],"sourcesContent":["import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n","import {\n type DragHandlePluginProps,\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/react'\nimport { type ReactNode, useEffect, useRef, useState } from 'react'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey'>, 'element'> & {\n className?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n children: ReactNode\n}\n\nexport const DragHandle = (props: DragHandleProps) => {\n const {\n className = 'drag-handle',\n children,\n editor,\n pluginKey = dragHandlePluginDefaultKey,\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n computePositionConfig = defaultComputePositionConfig,\n } = props\n const [element, setElement] = useState<HTMLDivElement | null>(null)\n const plugin = useRef<Plugin | null>(null)\n\n useEffect(() => {\n let initPlugin: {\n plugin: Plugin\n unbind: () => void\n } | null = null\n\n if (!element) {\n return () => {\n plugin.current = null\n }\n }\n\n if (editor.isDestroyed) {\n return () => {\n plugin.current = null\n }\n }\n\n if (!plugin.current) {\n initPlugin = DragHandlePlugin({\n editor,\n element,\n pluginKey,\n computePositionConfig: {\n ...defaultComputePositionConfig,\n ...computePositionConfig,\n },\n onElementDragStart,\n onElementDragEnd,\n onNodeChange,\n })\n plugin.current = initPlugin.plugin\n\n editor.registerPlugin(plugin.current)\n }\n\n return () => {\n editor.unregisterPlugin(pluginKey)\n plugin.current = null\n if (initPlugin) {\n initPlugin.unbind()\n initPlugin = null\n }\n }\n }, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd])\n\n return (\n <div\n className={className}\n style={{ visibility: 'hidden', position: 'absolute' }}\n data-dragging=\"false\"\n ref={setElement}\n >\n {children}\n </div>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mCAKO;AAIP,mBAA4D;AAuExD;AA7DG,IAAM,aAAa,CAAC,UAA2B;AACpD,QAAM;AAAA,IACJ,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,wBAAwB;AAAA,EAC1B,IAAI;AACJ,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAgC,IAAI;AAClE,QAAM,aAAS,qBAAsB,IAAI;AAEzC,8BAAU,MAAM;AACd,QAAI,aAGO;AAEX,QAAI,CAAC,SAAS;AACZ,aAAO,MAAM;AACX,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAEA,QAAI,OAAO,aAAa;AACtB,aAAO,MAAM;AACX,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAEA,QAAI,CAAC,OAAO,SAAS;AACnB,uBAAa,+CAAiB;AAAA,QAC5B;AAAA,QACA;AAAA,QACA;AAAA,QACA,uBAAuB;AAAA,UACrB,GAAG;AAAA,UACH,GAAG;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AACD,aAAO,UAAU,WAAW;AAE5B,aAAO,eAAe,OAAO,OAAO;AAAA,IACtC;AAEA,WAAO,MAAM;AACX,aAAO,iBAAiB,SAAS;AACjC,aAAO,UAAU;AACjB,UAAI,YAAY;AACd,mBAAW,OAAO;AAClB,qBAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF,GAAG,CAAC,SAAS,QAAQ,cAAc,WAAW,uBAAuB,oBAAoB,gBAAgB,CAAC;AAE1G,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,EAAE,YAAY,UAAU,UAAU,WAAW;AAAA,MACpD,iBAAc;AAAA,MACd,KAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;;;ADrFA,IAAO,gBAAQ;","names":[]}
|
package/dist/index.js
CHANGED
|
@@ -56,7 +56,16 @@ var DragHandle = (props) => {
|
|
|
56
56
|
}
|
|
57
57
|
};
|
|
58
58
|
}, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd]);
|
|
59
|
-
return /* @__PURE__ */ jsx(
|
|
59
|
+
return /* @__PURE__ */ jsx(
|
|
60
|
+
"div",
|
|
61
|
+
{
|
|
62
|
+
className,
|
|
63
|
+
style: { visibility: "hidden", position: "absolute" },
|
|
64
|
+
"data-dragging": "false",
|
|
65
|
+
ref: setElement,
|
|
66
|
+
children
|
|
67
|
+
}
|
|
68
|
+
);
|
|
60
69
|
};
|
|
61
70
|
|
|
62
71
|
// src/index.ts
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/DragHandle.tsx","../src/index.ts"],"sourcesContent":["import {\n type DragHandlePluginProps,\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/react'\nimport { type ReactNode, useEffect, useRef, useState } from 'react'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey'>, 'element'> & {\n className?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n children: ReactNode\n}\n\nexport const DragHandle = (props: DragHandleProps) => {\n const {\n className = 'drag-handle',\n children,\n editor,\n pluginKey = dragHandlePluginDefaultKey,\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n computePositionConfig = defaultComputePositionConfig,\n } = props\n const [element, setElement] = useState<HTMLDivElement | null>(null)\n const plugin = useRef<Plugin | null>(null)\n\n useEffect(() => {\n let initPlugin: {\n plugin: Plugin\n unbind: () => void\n } | null = null\n\n if (!element) {\n return () => {\n plugin.current = null\n }\n }\n\n if (editor.isDestroyed) {\n return () => {\n plugin.current = null\n }\n }\n\n if (!plugin.current) {\n initPlugin = DragHandlePlugin({\n editor,\n element,\n pluginKey,\n computePositionConfig: {\n ...defaultComputePositionConfig,\n ...computePositionConfig,\n },\n onElementDragStart,\n onElementDragEnd,\n onNodeChange,\n })\n plugin.current = initPlugin.plugin\n\n editor.registerPlugin(plugin.current)\n }\n\n return () => {\n editor.unregisterPlugin(pluginKey)\n plugin.current = null\n if (initPlugin) {\n initPlugin.unbind()\n initPlugin = null\n }\n }\n }, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd])\n\n return (\n <div
|
|
1
|
+
{"version":3,"sources":["../src/DragHandle.tsx","../src/index.ts"],"sourcesContent":["import {\n type DragHandlePluginProps,\n defaultComputePositionConfig,\n DragHandlePlugin,\n dragHandlePluginDefaultKey,\n} from '@tiptap/extension-drag-handle'\nimport type { Node } from '@tiptap/pm/model'\nimport type { Plugin } from '@tiptap/pm/state'\nimport type { Editor } from '@tiptap/react'\nimport { type ReactNode, useEffect, useRef, useState } from 'react'\n\ntype Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>\n\nexport type DragHandleProps = Omit<Optional<DragHandlePluginProps, 'pluginKey'>, 'element'> & {\n className?: string\n onNodeChange?: (data: { node: Node | null; editor: Editor; pos: number }) => void\n children: ReactNode\n}\n\nexport const DragHandle = (props: DragHandleProps) => {\n const {\n className = 'drag-handle',\n children,\n editor,\n pluginKey = dragHandlePluginDefaultKey,\n onNodeChange,\n onElementDragStart,\n onElementDragEnd,\n computePositionConfig = defaultComputePositionConfig,\n } = props\n const [element, setElement] = useState<HTMLDivElement | null>(null)\n const plugin = useRef<Plugin | null>(null)\n\n useEffect(() => {\n let initPlugin: {\n plugin: Plugin\n unbind: () => void\n } | null = null\n\n if (!element) {\n return () => {\n plugin.current = null\n }\n }\n\n if (editor.isDestroyed) {\n return () => {\n plugin.current = null\n }\n }\n\n if (!plugin.current) {\n initPlugin = DragHandlePlugin({\n editor,\n element,\n pluginKey,\n computePositionConfig: {\n ...defaultComputePositionConfig,\n ...computePositionConfig,\n },\n onElementDragStart,\n onElementDragEnd,\n onNodeChange,\n })\n plugin.current = initPlugin.plugin\n\n editor.registerPlugin(plugin.current)\n }\n\n return () => {\n editor.unregisterPlugin(pluginKey)\n plugin.current = null\n if (initPlugin) {\n initPlugin.unbind()\n initPlugin = null\n }\n }\n }, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd])\n\n return (\n <div\n className={className}\n style={{ visibility: 'hidden', position: 'absolute' }}\n data-dragging=\"false\"\n ref={setElement}\n >\n {children}\n </div>\n )\n}\n","import { DragHandle } from './DragHandle.js'\n\nexport * from './DragHandle.js'\n\nexport default DragHandle\n"],"mappings":";AAAA;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIP,SAAyB,WAAW,QAAQ,gBAAgB;AAuExD;AA7DG,IAAM,aAAa,CAAC,UAA2B;AACpD,QAAM;AAAA,IACJ,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,wBAAwB;AAAA,EAC1B,IAAI;AACJ,QAAM,CAAC,SAAS,UAAU,IAAI,SAAgC,IAAI;AAClE,QAAM,SAAS,OAAsB,IAAI;AAEzC,YAAU,MAAM;AACd,QAAI,aAGO;AAEX,QAAI,CAAC,SAAS;AACZ,aAAO,MAAM;AACX,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAEA,QAAI,OAAO,aAAa;AACtB,aAAO,MAAM;AACX,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAEA,QAAI,CAAC,OAAO,SAAS;AACnB,mBAAa,iBAAiB;AAAA,QAC5B;AAAA,QACA;AAAA,QACA;AAAA,QACA,uBAAuB;AAAA,UACrB,GAAG;AAAA,UACH,GAAG;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC;AACD,aAAO,UAAU,WAAW;AAE5B,aAAO,eAAe,OAAO,OAAO;AAAA,IACtC;AAEA,WAAO,MAAM;AACX,aAAO,iBAAiB,SAAS;AACjC,aAAO,UAAU;AACjB,UAAI,YAAY;AACd,mBAAW,OAAO;AAClB,qBAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF,GAAG,CAAC,SAAS,QAAQ,cAAc,WAAW,uBAAuB,oBAAoB,gBAAgB,CAAC;AAE1G,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,EAAE,YAAY,UAAU,UAAU,WAAW;AAAA,MACpD,iBAAc;AAAA,MACd,KAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;;;ACrFA,IAAO,gBAAQ;","names":[]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tiptap/extension-drag-handle-react",
|
|
3
3
|
"description": "drag handle extension for tiptap with react",
|
|
4
|
-
"version": "3.
|
|
4
|
+
"version": "3.13.0",
|
|
5
5
|
"homepage": "https://tiptap.dev",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"tiptap",
|
|
@@ -38,18 +38,18 @@
|
|
|
38
38
|
"peerDependencies": {
|
|
39
39
|
"react": "^16.8 || ^17 || ^18 || ^19",
|
|
40
40
|
"react-dom": "^16.8 || ^17 || ^18 || ^19",
|
|
41
|
-
"@tiptap/extension-drag-handle": "^3.
|
|
42
|
-
"@tiptap/pm": "^3.
|
|
43
|
-
"@tiptap/react": "^3.
|
|
41
|
+
"@tiptap/extension-drag-handle": "^3.13.0",
|
|
42
|
+
"@tiptap/pm": "^3.13.0",
|
|
43
|
+
"@tiptap/react": "^3.13.0"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
46
|
"@types/react": "^18.0.0",
|
|
47
47
|
"@types/react-dom": "^18.0.0",
|
|
48
48
|
"react": "^18.0.0",
|
|
49
49
|
"react-dom": "^18.0.0",
|
|
50
|
-
"@tiptap/extension-drag-handle": "^3.
|
|
51
|
-
"@tiptap/pm": "^3.
|
|
52
|
-
"@tiptap/react": "^3.
|
|
50
|
+
"@tiptap/extension-drag-handle": "^3.13.0",
|
|
51
|
+
"@tiptap/pm": "^3.13.0",
|
|
52
|
+
"@tiptap/react": "^3.13.0"
|
|
53
53
|
},
|
|
54
54
|
"scripts": {
|
|
55
55
|
"build": "tsup",
|
package/src/DragHandle.tsx
CHANGED
|
@@ -78,7 +78,12 @@ export const DragHandle = (props: DragHandleProps) => {
|
|
|
78
78
|
}, [element, editor, onNodeChange, pluginKey, computePositionConfig, onElementDragStart, onElementDragEnd])
|
|
79
79
|
|
|
80
80
|
return (
|
|
81
|
-
<div
|
|
81
|
+
<div
|
|
82
|
+
className={className}
|
|
83
|
+
style={{ visibility: 'hidden', position: 'absolute' }}
|
|
84
|
+
data-dragging="false"
|
|
85
|
+
ref={setElement}
|
|
86
|
+
>
|
|
82
87
|
{children}
|
|
83
88
|
</div>
|
|
84
89
|
)
|