react-reorder-list 0.3.1 → 0.4.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/README.md +9 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -137,7 +137,15 @@ Here is the full API for the `<ReorderList>` component, these properties can be
|
|
|
137
137
|
#### PositionChangeHandler
|
|
138
138
|
```typescript
|
|
139
139
|
import { ReactNode } from 'react';
|
|
140
|
-
type
|
|
140
|
+
type RevertHandler = () => void
|
|
141
|
+
type PositionChangeParams = {
|
|
142
|
+
start?: number // Index of the item being dragged
|
|
143
|
+
end?: number // Index of the item being displaced by the starting item
|
|
144
|
+
oldItems?: ReactNode[] // Array of children before reordering
|
|
145
|
+
newItems?: ReactNode[] // Array of children after reordering
|
|
146
|
+
revert: RevertHandler // A fallback handler to revert the reordering
|
|
147
|
+
}
|
|
148
|
+
type PositionChangeHandler = (params?: PositionChangeParams) => void
|
|
141
149
|
```
|
|
142
150
|
## Author
|
|
143
151
|
[Sahil Aggarwal](https://www.github.com/SahilAggarwal2004)
|
package/dist/index.d.ts
CHANGED
|
@@ -3,8 +3,9 @@ export type Props = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivEle
|
|
|
3
3
|
export type PositionChangeHandler = (params?: {
|
|
4
4
|
start?: number;
|
|
5
5
|
end?: number;
|
|
6
|
-
oldItems?: ReactNode;
|
|
7
|
-
newItems?: ReactNode;
|
|
6
|
+
oldItems?: ReactNode[];
|
|
7
|
+
newItems?: ReactNode[];
|
|
8
|
+
revert?: () => void;
|
|
8
9
|
}) => void;
|
|
9
10
|
export type ReorderListProps = {
|
|
10
11
|
useOnlyIconToDrag?: boolean;
|
package/dist/index.js
CHANGED
|
@@ -41,7 +41,7 @@ export default function ReorderList({ useOnlyIconToDrag = false, selectedItemOpa
|
|
|
41
41
|
}, [children]);
|
|
42
42
|
function handleDragEnd(end) {
|
|
43
43
|
if (end !== start)
|
|
44
|
-
onPositionChange === null || onPositionChange === void 0 ? void 0 : onPositionChange({ start, end, oldItems: temp.items, newItems: items });
|
|
44
|
+
onPositionChange === null || onPositionChange === void 0 ? void 0 : onPositionChange({ start, end, oldItems: temp.items, newItems: items, revert: () => setItems(temp.items) });
|
|
45
45
|
setStart(-1);
|
|
46
46
|
setSelected(-1);
|
|
47
47
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-reorder-list",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.4.0",
|
|
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",
|