react-reorder-list 0.6.4 → 0.6.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/hooks.d.ts +4 -5
- package/dist/hooks.js +2 -8
- package/dist/index.js +1 -3
- package/package.json +2 -2
package/dist/hooks.d.ts
CHANGED
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import { MouseEvent, TouchEvent } from "react";
|
|
2
1
|
export declare function useDraggable(initValue?: boolean): {
|
|
3
2
|
draggable: boolean;
|
|
4
3
|
draggableProps: {
|
|
5
|
-
onMouseEnter: (
|
|
6
|
-
onMouseLeave: (
|
|
7
|
-
onTouchStart: (
|
|
8
|
-
onTouchEnd: (
|
|
4
|
+
onMouseEnter: () => void;
|
|
5
|
+
onMouseLeave: () => void;
|
|
6
|
+
onTouchStart: () => void;
|
|
7
|
+
onTouchEnd: () => void;
|
|
9
8
|
};
|
|
10
9
|
};
|
package/dist/hooks.js
CHANGED
|
@@ -1,14 +1,8 @@
|
|
|
1
1
|
import { useState } from "react";
|
|
2
2
|
export function useDraggable(initValue = false) {
|
|
3
3
|
const [draggable, setDraggable] = useState(initValue);
|
|
4
|
-
const enableDragging = (
|
|
5
|
-
|
|
6
|
-
setDraggable(true);
|
|
7
|
-
};
|
|
8
|
-
const disableDragging = (event) => {
|
|
9
|
-
event.stopPropagation();
|
|
10
|
-
setDraggable(false);
|
|
11
|
-
};
|
|
4
|
+
const enableDragging = () => setDraggable(true);
|
|
5
|
+
const disableDragging = () => setDraggable(false);
|
|
12
6
|
const draggableProps = { onMouseEnter: enableDragging, onMouseLeave: disableDragging, onTouchStart: enableDragging, onTouchEnd: disableDragging };
|
|
13
7
|
return { draggable, draggableProps };
|
|
14
8
|
}
|
package/dist/index.js
CHANGED
|
@@ -90,7 +90,6 @@ export default function ReorderList({ useOnlyIconToDrag = false, selectedItemOpa
|
|
|
90
90
|
setIsAnimating(true);
|
|
91
91
|
setTimeout(() => setIsAnimating(false), animationDuration);
|
|
92
92
|
}, onDragEnd: handleDragEnd, onTouchMove: (event) => {
|
|
93
|
-
event.stopPropagation();
|
|
94
93
|
if (start === -1)
|
|
95
94
|
return;
|
|
96
95
|
const { clientX, screenX, clientY, screenY } = event.touches[0];
|
|
@@ -119,8 +118,7 @@ function ReorderItem(_a, ref) {
|
|
|
119
118
|
});
|
|
120
119
|
const recursiveChildren = useMemo(() => (useOnlyIconToDrag ? recursiveClone(children) : children), [useOnlyIconToDrag, children]);
|
|
121
120
|
return (React.createElement("div", Object.assign({ ref: ref, draggable: draggable }, props, (!useOnlyIconToDrag && draggableProps), { onTouchEnd: (event) => {
|
|
122
|
-
|
|
123
|
-
draggableOnTouchEnd(event);
|
|
121
|
+
draggableOnTouchEnd();
|
|
124
122
|
propOnTouchEnd(event);
|
|
125
123
|
} }), recursiveChildren));
|
|
126
124
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-reorder-list",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.5",
|
|
4
4
|
"description": "A simple react component that facilitates the reordering of JSX/HTML elements through drag-and-drop functionality, allowing for easy position changes.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"react": ">=16.0.0"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
-
"@types/react": "^18.2.
|
|
32
|
+
"@types/react": "^18.2.55"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"drag-drop-touch": "^1.3.1"
|