@react-stately/dnd 3.0.0-alpha.3 → 3.0.0-alpha.6
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/main.js +33 -27
- package/dist/main.js.map +1 -1
- package/dist/module.js +32 -26
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +2 -1
- package/dist/types.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/useDraggableCollectionState.ts +28 -17
package/dist/main.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var $
|
|
1
|
+
var $1IdlX$react = require("react");
|
|
2
2
|
|
|
3
3
|
function $parcel$exportWildcard(dest, source) {
|
|
4
4
|
Object.keys(source).forEach(function(key) {
|
|
@@ -19,65 +19,71 @@ function $parcel$exportWildcard(dest, source) {
|
|
|
19
19
|
function $parcel$export(e, n, v, s) {
|
|
20
20
|
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
21
21
|
}
|
|
22
|
-
var $
|
|
22
|
+
var $481a240e3d51b276$exports = {};
|
|
23
23
|
|
|
24
|
-
$parcel$export($
|
|
24
|
+
$parcel$export($481a240e3d51b276$exports, "useDraggableCollectionState", () => $481a240e3d51b276$export$29efd034f1d79f81);
|
|
25
25
|
|
|
26
|
-
function $
|
|
27
|
-
let
|
|
28
|
-
|
|
26
|
+
function $481a240e3d51b276$export$29efd034f1d79f81(props) {
|
|
27
|
+
let { getItems: getItems , collection: collection , selectionManager: selectionManager , onDragStart: onDragStart , onDragMove: onDragMove , onDragEnd: onDragEnd , renderPreview: renderPreview , allowsDraggingItem: allowsDraggingItem = ()=>true
|
|
28
|
+
} = props;
|
|
29
|
+
let [draggingKeys, setDraggingKeys] = $1IdlX$react.useState(new Set());
|
|
30
|
+
let getKeys = (key1)=>{
|
|
29
31
|
// The clicked item is always added to the drag. If it is selected, then all of the
|
|
30
32
|
// other selected items are also dragged. If it is not selected, the only the clicked
|
|
31
33
|
// item is dragged. This matches native macOS behavior.
|
|
32
|
-
let keys = new Set(
|
|
33
|
-
|
|
34
|
+
let keys = new Set(selectionManager.isSelected(key1) ? new Set([
|
|
35
|
+
...selectionManager.selectedKeys
|
|
36
|
+
].filter((key)=>allowsDraggingItem ? allowsDraggingItem(key) : true
|
|
37
|
+
)) : []);
|
|
38
|
+
keys.add(key1);
|
|
34
39
|
return keys;
|
|
35
40
|
};
|
|
36
41
|
return {
|
|
37
|
-
collection:
|
|
38
|
-
selectionManager:
|
|
42
|
+
collection: collection,
|
|
43
|
+
selectionManager: selectionManager,
|
|
39
44
|
isDragging (key) {
|
|
40
45
|
return draggingKeys.has(key);
|
|
41
46
|
},
|
|
42
47
|
getKeysForDrag: getKeys,
|
|
43
48
|
getItems (key) {
|
|
44
|
-
return
|
|
49
|
+
return getItems(getKeys(key));
|
|
45
50
|
},
|
|
46
51
|
renderPreview (key) {
|
|
47
|
-
if (typeof
|
|
52
|
+
if (typeof renderPreview === 'function') return renderPreview(getKeys(key), key);
|
|
48
53
|
return null;
|
|
49
54
|
},
|
|
50
55
|
startDrag (key, event) {
|
|
51
56
|
let keys = getKeys(key);
|
|
52
57
|
setDraggingKeys(keys);
|
|
53
|
-
if (typeof
|
|
58
|
+
if (typeof onDragStart === 'function') onDragStart({
|
|
54
59
|
...event,
|
|
55
60
|
keys: keys
|
|
56
61
|
});
|
|
57
62
|
},
|
|
58
63
|
moveDrag (event) {
|
|
59
|
-
if (typeof
|
|
64
|
+
if (typeof onDragMove === 'function') onDragMove({
|
|
60
65
|
...event,
|
|
61
66
|
keys: draggingKeys
|
|
62
67
|
});
|
|
63
68
|
},
|
|
64
69
|
endDrag (event) {
|
|
65
|
-
if (typeof
|
|
70
|
+
if (typeof onDragEnd === 'function') onDragEnd({
|
|
66
71
|
...event,
|
|
67
72
|
keys: draggingKeys
|
|
68
73
|
});
|
|
69
74
|
setDraggingKeys(new Set());
|
|
70
|
-
}
|
|
75
|
+
},
|
|
76
|
+
isDraggable: (key)=>allowsDraggingItem(key)
|
|
71
77
|
};
|
|
72
78
|
}
|
|
73
79
|
|
|
74
80
|
|
|
75
|
-
var $
|
|
81
|
+
var $6ce4cbfbe5e354f1$exports = {};
|
|
76
82
|
|
|
77
|
-
$parcel$export($
|
|
83
|
+
$parcel$export($6ce4cbfbe5e354f1$exports, "useDroppableCollectionState", () => $6ce4cbfbe5e354f1$export$926850f6ecef79d0);
|
|
78
84
|
|
|
79
|
-
function $
|
|
80
|
-
let [target1, setTarget] = $
|
|
85
|
+
function $6ce4cbfbe5e354f1$export$926850f6ecef79d0(props) {
|
|
86
|
+
let [target1, setTarget] = $1IdlX$react.useState(null);
|
|
81
87
|
let getOppositeTarget = (target)=>{
|
|
82
88
|
if (target.dropPosition === 'before') {
|
|
83
89
|
let key = props.collection.getKeyBefore(target.key);
|
|
@@ -116,9 +122,9 @@ function $493c7e7e2c1a0cd7$export$926850f6ecef79d0(props) {
|
|
|
116
122
|
setTarget(newTarget);
|
|
117
123
|
},
|
|
118
124
|
isDropTarget (dropTarget) {
|
|
119
|
-
if ($
|
|
125
|
+
if ($6ce4cbfbe5e354f1$var$isEqualDropTarget(dropTarget, target1)) return true;
|
|
120
126
|
// Check if the targets point at the same point between two items, one referring before, and the other after.
|
|
121
|
-
if (dropTarget
|
|
127
|
+
if ((dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.type) === 'item' && (target1 === null || target1 === void 0 ? void 0 : target1.type) === 'item' && dropTarget.key !== target1.key && dropTarget.dropPosition !== target1.dropPosition && dropTarget.dropPosition !== 'on' && target1.dropPosition !== 'on') return $6ce4cbfbe5e354f1$var$isEqualDropTarget(getOppositeTarget(dropTarget), target1) || $6ce4cbfbe5e354f1$var$isEqualDropTarget(dropTarget, getOppositeTarget(target1));
|
|
122
128
|
return false;
|
|
123
129
|
},
|
|
124
130
|
getDropOperation (target, types, allowedOperations) {
|
|
@@ -126,19 +132,19 @@ function $493c7e7e2c1a0cd7$export$926850f6ecef79d0(props) {
|
|
|
126
132
|
}
|
|
127
133
|
};
|
|
128
134
|
}
|
|
129
|
-
function $
|
|
135
|
+
function $6ce4cbfbe5e354f1$var$isEqualDropTarget(a, b) {
|
|
130
136
|
if (!a) return !b;
|
|
131
137
|
switch(a.type){
|
|
132
138
|
case 'root':
|
|
133
|
-
return b
|
|
139
|
+
return (b === null || b === void 0 ? void 0 : b.type) === 'root';
|
|
134
140
|
case 'item':
|
|
135
|
-
return b
|
|
141
|
+
return (b === null || b === void 0 ? void 0 : b.type) === 'item' && (b === null || b === void 0 ? void 0 : b.key) === a.key && (b === null || b === void 0 ? void 0 : b.dropPosition) === a.dropPosition;
|
|
136
142
|
}
|
|
137
143
|
}
|
|
138
144
|
|
|
139
145
|
|
|
140
|
-
$parcel$exportWildcard(module.exports, $
|
|
141
|
-
$parcel$exportWildcard(module.exports, $
|
|
146
|
+
$parcel$exportWildcard(module.exports, $481a240e3d51b276$exports);
|
|
147
|
+
$parcel$exportWildcard(module.exports, $6ce4cbfbe5e354f1$exports);
|
|
142
148
|
|
|
143
149
|
|
|
144
150
|
//# sourceMappingURL=main.js.map
|
package/dist/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-stately/dnd/src/index.ts","packages/@react-stately/dnd/src/useDraggableCollectionState.ts","packages/@react-stately/dnd/src/useDroppableCollectionState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport * from './useDraggableCollectionState';\nexport * from './useDroppableCollectionState';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragEndEvent, DraggableCollectionProps, DragItem, DragMoveEvent, DragStartEvent, Node} from '@react-types/shared';\nimport {Key, useState} from 'react';\nimport {MultipleSelectionManager} from '@react-stately/selection';\n\ninterface DraggableCollectionOptions extends DraggableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DraggableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n isDragging(key: Key): boolean,\n getKeysForDrag(key: Key): Set<Key>,\n getItems(key: Key): DragItem[],\n renderPreview(key: Key): JSX.Element,\n startDrag(key: Key, event: DragStartEvent): void,\n moveDrag(event: DragMoveEvent): void,\n endDrag(event: DragEndEvent): void\n}\n\nexport function useDraggableCollectionState(props: DraggableCollectionOptions): DraggableCollectionState {\n let [draggingKeys, setDraggingKeys] = useState(new Set<Key>());\n let getKeys = (key: Key) => {\n // The clicked item is always added to the drag. If it is selected, then all of the\n // other selected items are also dragged. If it is not selected, the only the clicked\n // item is dragged. This matches native macOS behavior.\n let keys = new Set(\n props.selectionManager.isSelected(key)\n ? props.selectionManager.selectedKeys\n : []\n );\n\n keys.add(key);\n return keys;\n };\n\n return {\n collection: props.collection,\n selectionManager: props.selectionManager,\n isDragging(key) {\n return draggingKeys.has(key);\n },\n getKeysForDrag: getKeys,\n getItems(key) {\n return props.getItems(getKeys(key));\n },\n renderPreview(key) {\n if (typeof props.renderPreview === 'function') {\n return props.renderPreview(getKeys(key), key);\n }\n\n return null;\n },\n startDrag(key, event) {\n let keys = getKeys(key);\n setDraggingKeys(keys);\n\n if (typeof props.onDragStart === 'function') {\n props.onDragStart({\n ...event,\n keys\n });\n }\n },\n moveDrag(event) {\n if (typeof props.onDragMove === 'function') {\n props.onDragMove({\n ...event,\n keys: draggingKeys\n });\n }\n },\n endDrag(event) {\n if (typeof props.onDragEnd === 'function') {\n props.onDragEnd({\n ...event,\n keys: draggingKeys\n });\n }\n\n setDraggingKeys(new Set());\n }\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragTypes, DropOperation, DroppableCollectionProps, DropTarget, ItemDropTarget, Node} from '@react-types/shared';\nimport {MultipleSelectionManager} from '@react-stately/selection';\nimport {useState} from 'react';\n\ninterface DroppableCollectionStateOptions extends DroppableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DroppableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n target: DropTarget,\n setTarget(target: DropTarget): void,\n isDropTarget(target: DropTarget): boolean,\n getDropOperation(target: DropTarget, types: DragTypes, allowedOperations: DropOperation[]): DropOperation\n}\n\nexport function useDroppableCollectionState(props: DroppableCollectionStateOptions): DroppableCollectionState {\n let [target, setTarget] = useState<DropTarget>(null);\n\n let getOppositeTarget = (target: ItemDropTarget): ItemDropTarget => {\n if (target.dropPosition === 'before') {\n let key = props.collection.getKeyBefore(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'after'} : null;\n } else if (target.dropPosition === 'after') {\n let key = props.collection.getKeyAfter(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'before'} : null;\n }\n };\n\n return {\n collection: props.collection,\n selectionManager: props.selectionManager,\n target,\n setTarget(newTarget) {\n if (this.isDropTarget(newTarget)) {\n return;\n }\n\n if (target && typeof props.onDropExit === 'function') {\n props.onDropExit({\n type: 'dropexit',\n x: 0, // todo\n y: 0,\n target\n });\n }\n\n if (newTarget && typeof props.onDropEnter === 'function') {\n props.onDropEnter({\n type: 'dropenter',\n x: 0, // todo\n y: 0,\n target: newTarget\n });\n }\n\n setTarget(newTarget);\n },\n isDropTarget(dropTarget) {\n if (isEqualDropTarget(dropTarget, target)) {\n return true;\n }\n\n // Check if the targets point at the same point between two items, one referring before, and the other after.\n if (\n dropTarget?.type === 'item' &&\n target?.type === 'item' &&\n dropTarget.key !== target.key &&\n dropTarget.dropPosition !== target.dropPosition &&\n dropTarget.dropPosition !== 'on' &&\n target.dropPosition !== 'on'\n ) {\n return isEqualDropTarget(getOppositeTarget(dropTarget), target) ||\n isEqualDropTarget(dropTarget, getOppositeTarget(target));\n }\n\n return false;\n },\n getDropOperation(target, types, allowedOperations) {\n return typeof props.getDropOperation === 'function'\n ? props.getDropOperation(target, types, allowedOperations)\n : allowedOperations[0];\n }\n };\n}\n\nfunction isEqualDropTarget(a: DropTarget, b: DropTarget) {\n if (!a) {\n return !b;\n }\n\n switch (a.type) {\n case 'root':\n return b?.type === 'root';\n case 'item':\n return b?.type === 'item' && b?.key === a.key && b?.dropPosition === a.dropPosition;\n }\n}\n"],"names":[],"version":3,"file":"main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/dnd/src/index.ts","packages/@react-stately/dnd/src/useDraggableCollectionState.ts","packages/@react-stately/dnd/src/useDroppableCollectionState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport * from './useDraggableCollectionState';\nexport * from './useDroppableCollectionState';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragEndEvent, DraggableCollectionProps, DragItem, DragMoveEvent, DragStartEvent, Node} from '@react-types/shared';\nimport {Key, useState} from 'react';\nimport {MultipleSelectionManager} from '@react-stately/selection';\n\nexport interface DraggableCollectionOptions extends DraggableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DraggableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n isDragging(key: Key): boolean,\n getKeysForDrag(key: Key): Set<Key>,\n getItems(key: Key): DragItem[],\n renderPreview(key: Key): JSX.Element,\n startDrag(key: Key, event: DragStartEvent): void,\n moveDrag(event: DragMoveEvent): void,\n endDrag(event: DragEndEvent): void,\n isDraggable(key: Key): boolean\n}\n\nexport function useDraggableCollectionState(props: DraggableCollectionOptions): DraggableCollectionState {\n let {\n getItems,\n collection,\n selectionManager,\n onDragStart,\n onDragMove,\n onDragEnd,\n renderPreview,\n allowsDraggingItem = () => true\n } = props;\n let [draggingKeys, setDraggingKeys] = useState(new Set<Key>());\n let getKeys = (key: Key) => {\n // The clicked item is always added to the drag. If it is selected, then all of the\n // other selected items are also dragged. If it is not selected, the only the clicked\n // item is dragged. This matches native macOS behavior.\n let keys = new Set(\n selectionManager.isSelected(key)\n ? new Set([...selectionManager.selectedKeys].filter(key => allowsDraggingItem ? allowsDraggingItem(key) : true))\n : []\n );\n\n keys.add(key);\n return keys;\n };\n\n return {\n collection,\n selectionManager,\n isDragging(key) {\n return draggingKeys.has(key);\n },\n getKeysForDrag: getKeys,\n getItems(key) {\n return getItems(getKeys(key));\n },\n renderPreview(key) {\n if (typeof renderPreview === 'function') {\n return renderPreview(getKeys(key), key);\n }\n\n return null;\n },\n startDrag(key, event) {\n let keys = getKeys(key);\n setDraggingKeys(keys);\n if (typeof onDragStart === 'function') {\n onDragStart({\n ...event,\n keys\n });\n }\n },\n moveDrag(event) {\n if (typeof onDragMove === 'function') {\n onDragMove({\n ...event,\n keys: draggingKeys\n });\n }\n },\n endDrag(event) {\n if (typeof onDragEnd === 'function') {\n onDragEnd({\n ...event,\n keys: draggingKeys\n });\n }\n\n setDraggingKeys(new Set());\n },\n isDraggable: (key: Key) => allowsDraggingItem(key)\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragTypes, DropOperation, DroppableCollectionProps, DropTarget, ItemDropTarget, Node} from '@react-types/shared';\nimport {MultipleSelectionManager} from '@react-stately/selection';\nimport {useState} from 'react';\n\ninterface DroppableCollectionStateOptions extends DroppableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DroppableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n target: DropTarget,\n setTarget(target: DropTarget): void,\n isDropTarget(target: DropTarget): boolean,\n getDropOperation(target: DropTarget, types: DragTypes, allowedOperations: DropOperation[]): DropOperation\n}\n\nexport function useDroppableCollectionState(props: DroppableCollectionStateOptions): DroppableCollectionState {\n let [target, setTarget] = useState<DropTarget>(null);\n\n let getOppositeTarget = (target: ItemDropTarget): ItemDropTarget => {\n if (target.dropPosition === 'before') {\n let key = props.collection.getKeyBefore(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'after'} : null;\n } else if (target.dropPosition === 'after') {\n let key = props.collection.getKeyAfter(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'before'} : null;\n }\n };\n\n return {\n collection: props.collection,\n selectionManager: props.selectionManager,\n target,\n setTarget(newTarget) {\n if (this.isDropTarget(newTarget)) {\n return;\n }\n\n if (target && typeof props.onDropExit === 'function') {\n props.onDropExit({\n type: 'dropexit',\n x: 0, // todo\n y: 0,\n target\n });\n }\n\n if (newTarget && typeof props.onDropEnter === 'function') {\n props.onDropEnter({\n type: 'dropenter',\n x: 0, // todo\n y: 0,\n target: newTarget\n });\n }\n\n setTarget(newTarget);\n },\n isDropTarget(dropTarget) {\n if (isEqualDropTarget(dropTarget, target)) {\n return true;\n }\n\n // Check if the targets point at the same point between two items, one referring before, and the other after.\n if (\n dropTarget?.type === 'item' &&\n target?.type === 'item' &&\n dropTarget.key !== target.key &&\n dropTarget.dropPosition !== target.dropPosition &&\n dropTarget.dropPosition !== 'on' &&\n target.dropPosition !== 'on'\n ) {\n return isEqualDropTarget(getOppositeTarget(dropTarget), target) ||\n isEqualDropTarget(dropTarget, getOppositeTarget(target));\n }\n\n return false;\n },\n getDropOperation(target, types, allowedOperations) {\n return typeof props.getDropOperation === 'function'\n ? props.getDropOperation(target, types, allowedOperations)\n : allowedOperations[0];\n }\n };\n}\n\nfunction isEqualDropTarget(a: DropTarget, b: DropTarget) {\n if (!a) {\n return !b;\n }\n\n switch (a.type) {\n case 'root':\n return b?.type === 'root';\n case 'item':\n return b?.type === 'item' && b?.key === a.key && b?.dropPosition === a.dropPosition;\n }\n}\n"],"names":[],"version":3,"file":"main.js.map"}
|
package/dist/module.js
CHANGED
|
@@ -1,67 +1,73 @@
|
|
|
1
|
-
import {useState as $
|
|
1
|
+
import {useState as $bBNwq$useState} from "react";
|
|
2
2
|
|
|
3
3
|
function $parcel$export(e, n, v, s) {
|
|
4
4
|
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
5
5
|
}
|
|
6
|
-
var $
|
|
6
|
+
var $b45bbbaf0c3785df$exports = {};
|
|
7
7
|
|
|
8
|
-
$parcel$export($
|
|
8
|
+
$parcel$export($b45bbbaf0c3785df$exports, "useDraggableCollectionState", () => $b45bbbaf0c3785df$export$29efd034f1d79f81);
|
|
9
9
|
|
|
10
|
-
function $
|
|
11
|
-
let
|
|
12
|
-
|
|
10
|
+
function $b45bbbaf0c3785df$export$29efd034f1d79f81(props) {
|
|
11
|
+
let { getItems: getItems , collection: collection , selectionManager: selectionManager , onDragStart: onDragStart , onDragMove: onDragMove , onDragEnd: onDragEnd , renderPreview: renderPreview , allowsDraggingItem: allowsDraggingItem = ()=>true
|
|
12
|
+
} = props;
|
|
13
|
+
let [draggingKeys, setDraggingKeys] = $bBNwq$useState(new Set());
|
|
14
|
+
let getKeys = (key1)=>{
|
|
13
15
|
// The clicked item is always added to the drag. If it is selected, then all of the
|
|
14
16
|
// other selected items are also dragged. If it is not selected, the only the clicked
|
|
15
17
|
// item is dragged. This matches native macOS behavior.
|
|
16
|
-
let keys = new Set(
|
|
17
|
-
|
|
18
|
+
let keys = new Set(selectionManager.isSelected(key1) ? new Set([
|
|
19
|
+
...selectionManager.selectedKeys
|
|
20
|
+
].filter((key)=>allowsDraggingItem ? allowsDraggingItem(key) : true
|
|
21
|
+
)) : []);
|
|
22
|
+
keys.add(key1);
|
|
18
23
|
return keys;
|
|
19
24
|
};
|
|
20
25
|
return {
|
|
21
|
-
collection:
|
|
22
|
-
selectionManager:
|
|
26
|
+
collection: collection,
|
|
27
|
+
selectionManager: selectionManager,
|
|
23
28
|
isDragging (key) {
|
|
24
29
|
return draggingKeys.has(key);
|
|
25
30
|
},
|
|
26
31
|
getKeysForDrag: getKeys,
|
|
27
32
|
getItems (key) {
|
|
28
|
-
return
|
|
33
|
+
return getItems(getKeys(key));
|
|
29
34
|
},
|
|
30
35
|
renderPreview (key) {
|
|
31
|
-
if (typeof
|
|
36
|
+
if (typeof renderPreview === 'function') return renderPreview(getKeys(key), key);
|
|
32
37
|
return null;
|
|
33
38
|
},
|
|
34
39
|
startDrag (key, event) {
|
|
35
40
|
let keys = getKeys(key);
|
|
36
41
|
setDraggingKeys(keys);
|
|
37
|
-
if (typeof
|
|
42
|
+
if (typeof onDragStart === 'function') onDragStart({
|
|
38
43
|
...event,
|
|
39
44
|
keys: keys
|
|
40
45
|
});
|
|
41
46
|
},
|
|
42
47
|
moveDrag (event) {
|
|
43
|
-
if (typeof
|
|
48
|
+
if (typeof onDragMove === 'function') onDragMove({
|
|
44
49
|
...event,
|
|
45
50
|
keys: draggingKeys
|
|
46
51
|
});
|
|
47
52
|
},
|
|
48
53
|
endDrag (event) {
|
|
49
|
-
if (typeof
|
|
54
|
+
if (typeof onDragEnd === 'function') onDragEnd({
|
|
50
55
|
...event,
|
|
51
56
|
keys: draggingKeys
|
|
52
57
|
});
|
|
53
58
|
setDraggingKeys(new Set());
|
|
54
|
-
}
|
|
59
|
+
},
|
|
60
|
+
isDraggable: (key)=>allowsDraggingItem(key)
|
|
55
61
|
};
|
|
56
62
|
}
|
|
57
63
|
|
|
58
64
|
|
|
59
|
-
var $
|
|
65
|
+
var $e672e8bc247525d1$exports = {};
|
|
60
66
|
|
|
61
|
-
$parcel$export($
|
|
67
|
+
$parcel$export($e672e8bc247525d1$exports, "useDroppableCollectionState", () => $e672e8bc247525d1$export$926850f6ecef79d0);
|
|
62
68
|
|
|
63
|
-
function $
|
|
64
|
-
let [target1, setTarget] = $
|
|
69
|
+
function $e672e8bc247525d1$export$926850f6ecef79d0(props) {
|
|
70
|
+
let [target1, setTarget] = $bBNwq$useState(null);
|
|
65
71
|
let getOppositeTarget = (target)=>{
|
|
66
72
|
if (target.dropPosition === 'before') {
|
|
67
73
|
let key = props.collection.getKeyBefore(target.key);
|
|
@@ -100,9 +106,9 @@ function $dabc5ba65f76be17$export$926850f6ecef79d0(props) {
|
|
|
100
106
|
setTarget(newTarget);
|
|
101
107
|
},
|
|
102
108
|
isDropTarget (dropTarget) {
|
|
103
|
-
if ($
|
|
109
|
+
if ($e672e8bc247525d1$var$isEqualDropTarget(dropTarget, target1)) return true;
|
|
104
110
|
// Check if the targets point at the same point between two items, one referring before, and the other after.
|
|
105
|
-
if (dropTarget
|
|
111
|
+
if ((dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.type) === 'item' && (target1 === null || target1 === void 0 ? void 0 : target1.type) === 'item' && dropTarget.key !== target1.key && dropTarget.dropPosition !== target1.dropPosition && dropTarget.dropPosition !== 'on' && target1.dropPosition !== 'on') return $e672e8bc247525d1$var$isEqualDropTarget(getOppositeTarget(dropTarget), target1) || $e672e8bc247525d1$var$isEqualDropTarget(dropTarget, getOppositeTarget(target1));
|
|
106
112
|
return false;
|
|
107
113
|
},
|
|
108
114
|
getDropOperation (target, types, allowedOperations) {
|
|
@@ -110,18 +116,18 @@ function $dabc5ba65f76be17$export$926850f6ecef79d0(props) {
|
|
|
110
116
|
}
|
|
111
117
|
};
|
|
112
118
|
}
|
|
113
|
-
function $
|
|
119
|
+
function $e672e8bc247525d1$var$isEqualDropTarget(a, b) {
|
|
114
120
|
if (!a) return !b;
|
|
115
121
|
switch(a.type){
|
|
116
122
|
case 'root':
|
|
117
|
-
return b
|
|
123
|
+
return (b === null || b === void 0 ? void 0 : b.type) === 'root';
|
|
118
124
|
case 'item':
|
|
119
|
-
return b
|
|
125
|
+
return (b === null || b === void 0 ? void 0 : b.type) === 'item' && (b === null || b === void 0 ? void 0 : b.key) === a.key && (b === null || b === void 0 ? void 0 : b.dropPosition) === a.dropPosition;
|
|
120
126
|
}
|
|
121
127
|
}
|
|
122
128
|
|
|
123
129
|
|
|
124
130
|
|
|
125
131
|
|
|
126
|
-
export {$
|
|
132
|
+
export {$b45bbbaf0c3785df$export$29efd034f1d79f81 as useDraggableCollectionState, $e672e8bc247525d1$export$926850f6ecef79d0 as useDroppableCollectionState};
|
|
127
133
|
//# sourceMappingURL=module.js.map
|
package/dist/module.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-stately/dnd/src/index.ts","packages/@react-stately/dnd/src/useDraggableCollectionState.ts","packages/@react-stately/dnd/src/useDroppableCollectionState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport * from './useDraggableCollectionState';\nexport * from './useDroppableCollectionState';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragEndEvent, DraggableCollectionProps, DragItem, DragMoveEvent, DragStartEvent, Node} from '@react-types/shared';\nimport {Key, useState} from 'react';\nimport {MultipleSelectionManager} from '@react-stately/selection';\n\ninterface DraggableCollectionOptions extends DraggableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DraggableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n isDragging(key: Key): boolean,\n getKeysForDrag(key: Key): Set<Key>,\n getItems(key: Key): DragItem[],\n renderPreview(key: Key): JSX.Element,\n startDrag(key: Key, event: DragStartEvent): void,\n moveDrag(event: DragMoveEvent): void,\n endDrag(event: DragEndEvent): void\n}\n\nexport function useDraggableCollectionState(props: DraggableCollectionOptions): DraggableCollectionState {\n let [draggingKeys, setDraggingKeys] = useState(new Set<Key>());\n let getKeys = (key: Key) => {\n // The clicked item is always added to the drag. If it is selected, then all of the\n // other selected items are also dragged. If it is not selected, the only the clicked\n // item is dragged. This matches native macOS behavior.\n let keys = new Set(\n props.selectionManager.isSelected(key)\n ? props.selectionManager.selectedKeys\n : []\n );\n\n keys.add(key);\n return keys;\n };\n\n return {\n collection: props.collection,\n selectionManager: props.selectionManager,\n isDragging(key) {\n return draggingKeys.has(key);\n },\n getKeysForDrag: getKeys,\n getItems(key) {\n return props.getItems(getKeys(key));\n },\n renderPreview(key) {\n if (typeof props.renderPreview === 'function') {\n return props.renderPreview(getKeys(key), key);\n }\n\n return null;\n },\n startDrag(key, event) {\n let keys = getKeys(key);\n setDraggingKeys(keys);\n\n if (typeof props.onDragStart === 'function') {\n props.onDragStart({\n ...event,\n keys\n });\n }\n },\n moveDrag(event) {\n if (typeof props.onDragMove === 'function') {\n props.onDragMove({\n ...event,\n keys: draggingKeys\n });\n }\n },\n endDrag(event) {\n if (typeof props.onDragEnd === 'function') {\n props.onDragEnd({\n ...event,\n keys: draggingKeys\n });\n }\n\n setDraggingKeys(new Set());\n }\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragTypes, DropOperation, DroppableCollectionProps, DropTarget, ItemDropTarget, Node} from '@react-types/shared';\nimport {MultipleSelectionManager} from '@react-stately/selection';\nimport {useState} from 'react';\n\ninterface DroppableCollectionStateOptions extends DroppableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DroppableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n target: DropTarget,\n setTarget(target: DropTarget): void,\n isDropTarget(target: DropTarget): boolean,\n getDropOperation(target: DropTarget, types: DragTypes, allowedOperations: DropOperation[]): DropOperation\n}\n\nexport function useDroppableCollectionState(props: DroppableCollectionStateOptions): DroppableCollectionState {\n let [target, setTarget] = useState<DropTarget>(null);\n\n let getOppositeTarget = (target: ItemDropTarget): ItemDropTarget => {\n if (target.dropPosition === 'before') {\n let key = props.collection.getKeyBefore(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'after'} : null;\n } else if (target.dropPosition === 'after') {\n let key = props.collection.getKeyAfter(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'before'} : null;\n }\n };\n\n return {\n collection: props.collection,\n selectionManager: props.selectionManager,\n target,\n setTarget(newTarget) {\n if (this.isDropTarget(newTarget)) {\n return;\n }\n\n if (target && typeof props.onDropExit === 'function') {\n props.onDropExit({\n type: 'dropexit',\n x: 0, // todo\n y: 0,\n target\n });\n }\n\n if (newTarget && typeof props.onDropEnter === 'function') {\n props.onDropEnter({\n type: 'dropenter',\n x: 0, // todo\n y: 0,\n target: newTarget\n });\n }\n\n setTarget(newTarget);\n },\n isDropTarget(dropTarget) {\n if (isEqualDropTarget(dropTarget, target)) {\n return true;\n }\n\n // Check if the targets point at the same point between two items, one referring before, and the other after.\n if (\n dropTarget?.type === 'item' &&\n target?.type === 'item' &&\n dropTarget.key !== target.key &&\n dropTarget.dropPosition !== target.dropPosition &&\n dropTarget.dropPosition !== 'on' &&\n target.dropPosition !== 'on'\n ) {\n return isEqualDropTarget(getOppositeTarget(dropTarget), target) ||\n isEqualDropTarget(dropTarget, getOppositeTarget(target));\n }\n\n return false;\n },\n getDropOperation(target, types, allowedOperations) {\n return typeof props.getDropOperation === 'function'\n ? props.getDropOperation(target, types, allowedOperations)\n : allowedOperations[0];\n }\n };\n}\n\nfunction isEqualDropTarget(a: DropTarget, b: DropTarget) {\n if (!a) {\n return !b;\n }\n\n switch (a.type) {\n case 'root':\n return b?.type === 'root';\n case 'item':\n return b?.type === 'item' && b?.key === a.key && b?.dropPosition === a.dropPosition;\n }\n}\n"],"names":[],"version":3,"file":"module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/dnd/src/index.ts","packages/@react-stately/dnd/src/useDraggableCollectionState.ts","packages/@react-stately/dnd/src/useDroppableCollectionState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport * from './useDraggableCollectionState';\nexport * from './useDroppableCollectionState';\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragEndEvent, DraggableCollectionProps, DragItem, DragMoveEvent, DragStartEvent, Node} from '@react-types/shared';\nimport {Key, useState} from 'react';\nimport {MultipleSelectionManager} from '@react-stately/selection';\n\nexport interface DraggableCollectionOptions extends DraggableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DraggableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n isDragging(key: Key): boolean,\n getKeysForDrag(key: Key): Set<Key>,\n getItems(key: Key): DragItem[],\n renderPreview(key: Key): JSX.Element,\n startDrag(key: Key, event: DragStartEvent): void,\n moveDrag(event: DragMoveEvent): void,\n endDrag(event: DragEndEvent): void,\n isDraggable(key: Key): boolean\n}\n\nexport function useDraggableCollectionState(props: DraggableCollectionOptions): DraggableCollectionState {\n let {\n getItems,\n collection,\n selectionManager,\n onDragStart,\n onDragMove,\n onDragEnd,\n renderPreview,\n allowsDraggingItem = () => true\n } = props;\n let [draggingKeys, setDraggingKeys] = useState(new Set<Key>());\n let getKeys = (key: Key) => {\n // The clicked item is always added to the drag. If it is selected, then all of the\n // other selected items are also dragged. If it is not selected, the only the clicked\n // item is dragged. This matches native macOS behavior.\n let keys = new Set(\n selectionManager.isSelected(key)\n ? new Set([...selectionManager.selectedKeys].filter(key => allowsDraggingItem ? allowsDraggingItem(key) : true))\n : []\n );\n\n keys.add(key);\n return keys;\n };\n\n return {\n collection,\n selectionManager,\n isDragging(key) {\n return draggingKeys.has(key);\n },\n getKeysForDrag: getKeys,\n getItems(key) {\n return getItems(getKeys(key));\n },\n renderPreview(key) {\n if (typeof renderPreview === 'function') {\n return renderPreview(getKeys(key), key);\n }\n\n return null;\n },\n startDrag(key, event) {\n let keys = getKeys(key);\n setDraggingKeys(keys);\n if (typeof onDragStart === 'function') {\n onDragStart({\n ...event,\n keys\n });\n }\n },\n moveDrag(event) {\n if (typeof onDragMove === 'function') {\n onDragMove({\n ...event,\n keys: draggingKeys\n });\n }\n },\n endDrag(event) {\n if (typeof onDragEnd === 'function') {\n onDragEnd({\n ...event,\n keys: draggingKeys\n });\n }\n\n setDraggingKeys(new Set());\n },\n isDraggable: (key: Key) => allowsDraggingItem(key)\n };\n}\n","/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Collection, DragTypes, DropOperation, DroppableCollectionProps, DropTarget, ItemDropTarget, Node} from '@react-types/shared';\nimport {MultipleSelectionManager} from '@react-stately/selection';\nimport {useState} from 'react';\n\ninterface DroppableCollectionStateOptions extends DroppableCollectionProps {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager\n}\n\nexport interface DroppableCollectionState {\n collection: Collection<Node<unknown>>,\n selectionManager: MultipleSelectionManager,\n target: DropTarget,\n setTarget(target: DropTarget): void,\n isDropTarget(target: DropTarget): boolean,\n getDropOperation(target: DropTarget, types: DragTypes, allowedOperations: DropOperation[]): DropOperation\n}\n\nexport function useDroppableCollectionState(props: DroppableCollectionStateOptions): DroppableCollectionState {\n let [target, setTarget] = useState<DropTarget>(null);\n\n let getOppositeTarget = (target: ItemDropTarget): ItemDropTarget => {\n if (target.dropPosition === 'before') {\n let key = props.collection.getKeyBefore(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'after'} : null;\n } else if (target.dropPosition === 'after') {\n let key = props.collection.getKeyAfter(target.key);\n return key != null ? {type: 'item', key, dropPosition: 'before'} : null;\n }\n };\n\n return {\n collection: props.collection,\n selectionManager: props.selectionManager,\n target,\n setTarget(newTarget) {\n if (this.isDropTarget(newTarget)) {\n return;\n }\n\n if (target && typeof props.onDropExit === 'function') {\n props.onDropExit({\n type: 'dropexit',\n x: 0, // todo\n y: 0,\n target\n });\n }\n\n if (newTarget && typeof props.onDropEnter === 'function') {\n props.onDropEnter({\n type: 'dropenter',\n x: 0, // todo\n y: 0,\n target: newTarget\n });\n }\n\n setTarget(newTarget);\n },\n isDropTarget(dropTarget) {\n if (isEqualDropTarget(dropTarget, target)) {\n return true;\n }\n\n // Check if the targets point at the same point between two items, one referring before, and the other after.\n if (\n dropTarget?.type === 'item' &&\n target?.type === 'item' &&\n dropTarget.key !== target.key &&\n dropTarget.dropPosition !== target.dropPosition &&\n dropTarget.dropPosition !== 'on' &&\n target.dropPosition !== 'on'\n ) {\n return isEqualDropTarget(getOppositeTarget(dropTarget), target) ||\n isEqualDropTarget(dropTarget, getOppositeTarget(target));\n }\n\n return false;\n },\n getDropOperation(target, types, allowedOperations) {\n return typeof props.getDropOperation === 'function'\n ? props.getDropOperation(target, types, allowedOperations)\n : allowedOperations[0];\n }\n };\n}\n\nfunction isEqualDropTarget(a: DropTarget, b: DropTarget) {\n if (!a) {\n return !b;\n }\n\n switch (a.type) {\n case 'root':\n return b?.type === 'root';\n case 'item':\n return b?.type === 'item' && b?.key === a.key && b?.dropPosition === a.dropPosition;\n }\n}\n"],"names":[],"version":3,"file":"module.js.map"}
|
package/dist/types.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Collection, DragEndEvent, DraggableCollectionProps, DragItem, DragMoveEvent, DragStartEvent, Node, DragTypes, DropOperation, DroppableCollectionProps, DropTarget } from "@react-types/shared";
|
|
2
2
|
import { Key } from "react";
|
|
3
3
|
import { MultipleSelectionManager } from "@react-stately/selection";
|
|
4
|
-
interface DraggableCollectionOptions extends DraggableCollectionProps {
|
|
4
|
+
export interface DraggableCollectionOptions extends DraggableCollectionProps {
|
|
5
5
|
collection: Collection<Node<unknown>>;
|
|
6
6
|
selectionManager: MultipleSelectionManager;
|
|
7
7
|
}
|
|
@@ -15,6 +15,7 @@ export interface DraggableCollectionState {
|
|
|
15
15
|
startDrag(key: Key, event: DragStartEvent): void;
|
|
16
16
|
moveDrag(event: DragMoveEvent): void;
|
|
17
17
|
endDrag(event: DragEndEvent): void;
|
|
18
|
+
isDraggable(key: Key): boolean;
|
|
18
19
|
}
|
|
19
20
|
export function useDraggableCollectionState(props: DraggableCollectionOptions): DraggableCollectionState;
|
|
20
21
|
interface DroppableCollectionStateOptions extends DroppableCollectionProps {
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;AAgBA,
|
|
1
|
+
{"mappings":";;;AAgBA,2CAA4C,SAAQ,wBAAwB;IAC1E,UAAU,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC;IACtC,gBAAgB,EAAE,wBAAwB,CAAA;CAC3C;AAED;IACE,UAAU,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC;IACtC,gBAAgB,EAAE,wBAAwB,CAAC;IAC3C,UAAU,CAAC,GAAG,EAAE,GAAG,GAAG,OAAO,CAAC;IAC9B,cAAc,CAAC,GAAG,EAAE,GAAG,GAAG,GAAG,CAAC,GAAG,CAAC,CAAC;IACnC,QAAQ,CAAC,GAAG,EAAE,GAAG,GAAG,QAAQ,EAAE,CAAC;IAC/B,aAAa,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,OAAO,CAAC;IACrC,SAAS,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,cAAc,GAAG,IAAI,CAAC;IACjD,QAAQ,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI,CAAC;IACrC,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;IACnC,WAAW,CAAC,GAAG,EAAE,GAAG,GAAG,OAAO,CAAA;CAC/B;AAED,4CAA4C,KAAK,EAAE,0BAA0B,GAAG,wBAAwB,CAyEvG;AC3FD,yCAA0C,SAAQ,wBAAwB;IACxE,UAAU,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC;IACtC,gBAAgB,EAAE,wBAAwB,CAAA;CAC3C;AAED;IACE,UAAU,EAAE,WAAW,KAAK,OAAO,CAAC,CAAC,CAAC;IACtC,gBAAgB,EAAE,wBAAwB,CAAC;IAC3C,MAAM,EAAE,UAAU,CAAC;IACnB,SAAS,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI,CAAC;IACpC,YAAY,CAAC,MAAM,EAAE,UAAU,GAAG,OAAO,CAAC;IAC1C,gBAAgB,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,aAAa,EAAE,GAAG,aAAa,CAAA;CAC1G;AAED,4CAA4C,KAAK,EAAE,+BAA+B,GAAG,wBAAwB,CAoE5G","sources":["packages/@react-stately/dnd/src/packages/@react-stately/dnd/src/useDraggableCollectionState.ts","packages/@react-stately/dnd/src/packages/@react-stately/dnd/src/useDroppableCollectionState.ts","packages/@react-stately/dnd/src/packages/@react-stately/dnd/src/index.ts","packages/@react-stately/dnd/src/index.ts"],"sourcesContent":[null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nexport * from './useDraggableCollectionState';\nexport * from './useDroppableCollectionState';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-stately/dnd",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.6",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -18,9 +18,9 @@
|
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"@babel/runtime": "^7.6.2",
|
|
21
|
-
"@react-stately/selection": "^3.9.
|
|
22
|
-
"@react-stately/utils": "^3.4.
|
|
23
|
-
"@react-types/shared": "^3.
|
|
21
|
+
"@react-stately/selection": "^3.9.4",
|
|
22
|
+
"@react-stately/utils": "^3.4.1",
|
|
23
|
+
"@react-types/shared": "^3.12.0"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"react": "^16.8.0 || ^17.0.0-rc.1"
|
|
@@ -28,5 +28,5 @@
|
|
|
28
28
|
"publishConfig": {
|
|
29
29
|
"access": "public"
|
|
30
30
|
},
|
|
31
|
-
"gitHead": "
|
|
31
|
+
"gitHead": "6a503b715e0dbbf92038cd7f08b1bcdde4c78e82"
|
|
32
32
|
}
|
|
@@ -14,7 +14,7 @@ import {Collection, DragEndEvent, DraggableCollectionProps, DragItem, DragMoveEv
|
|
|
14
14
|
import {Key, useState} from 'react';
|
|
15
15
|
import {MultipleSelectionManager} from '@react-stately/selection';
|
|
16
16
|
|
|
17
|
-
interface DraggableCollectionOptions extends DraggableCollectionProps {
|
|
17
|
+
export interface DraggableCollectionOptions extends DraggableCollectionProps {
|
|
18
18
|
collection: Collection<Node<unknown>>,
|
|
19
19
|
selectionManager: MultipleSelectionManager
|
|
20
20
|
}
|
|
@@ -28,18 +28,29 @@ export interface DraggableCollectionState {
|
|
|
28
28
|
renderPreview(key: Key): JSX.Element,
|
|
29
29
|
startDrag(key: Key, event: DragStartEvent): void,
|
|
30
30
|
moveDrag(event: DragMoveEvent): void,
|
|
31
|
-
endDrag(event: DragEndEvent): void
|
|
31
|
+
endDrag(event: DragEndEvent): void,
|
|
32
|
+
isDraggable(key: Key): boolean
|
|
32
33
|
}
|
|
33
34
|
|
|
34
35
|
export function useDraggableCollectionState(props: DraggableCollectionOptions): DraggableCollectionState {
|
|
36
|
+
let {
|
|
37
|
+
getItems,
|
|
38
|
+
collection,
|
|
39
|
+
selectionManager,
|
|
40
|
+
onDragStart,
|
|
41
|
+
onDragMove,
|
|
42
|
+
onDragEnd,
|
|
43
|
+
renderPreview,
|
|
44
|
+
allowsDraggingItem = () => true
|
|
45
|
+
} = props;
|
|
35
46
|
let [draggingKeys, setDraggingKeys] = useState(new Set<Key>());
|
|
36
47
|
let getKeys = (key: Key) => {
|
|
37
48
|
// The clicked item is always added to the drag. If it is selected, then all of the
|
|
38
49
|
// other selected items are also dragged. If it is not selected, the only the clicked
|
|
39
50
|
// item is dragged. This matches native macOS behavior.
|
|
40
51
|
let keys = new Set(
|
|
41
|
-
|
|
42
|
-
?
|
|
52
|
+
selectionManager.isSelected(key)
|
|
53
|
+
? new Set([...selectionManager.selectedKeys].filter(key => allowsDraggingItem ? allowsDraggingItem(key) : true))
|
|
43
54
|
: []
|
|
44
55
|
);
|
|
45
56
|
|
|
@@ -48,18 +59,18 @@ export function useDraggableCollectionState(props: DraggableCollectionOptions):
|
|
|
48
59
|
};
|
|
49
60
|
|
|
50
61
|
return {
|
|
51
|
-
collection
|
|
52
|
-
selectionManager
|
|
62
|
+
collection,
|
|
63
|
+
selectionManager,
|
|
53
64
|
isDragging(key) {
|
|
54
65
|
return draggingKeys.has(key);
|
|
55
66
|
},
|
|
56
67
|
getKeysForDrag: getKeys,
|
|
57
68
|
getItems(key) {
|
|
58
|
-
return
|
|
69
|
+
return getItems(getKeys(key));
|
|
59
70
|
},
|
|
60
71
|
renderPreview(key) {
|
|
61
|
-
if (typeof
|
|
62
|
-
return
|
|
72
|
+
if (typeof renderPreview === 'function') {
|
|
73
|
+
return renderPreview(getKeys(key), key);
|
|
63
74
|
}
|
|
64
75
|
|
|
65
76
|
return null;
|
|
@@ -67,31 +78,31 @@ export function useDraggableCollectionState(props: DraggableCollectionOptions):
|
|
|
67
78
|
startDrag(key, event) {
|
|
68
79
|
let keys = getKeys(key);
|
|
69
80
|
setDraggingKeys(keys);
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
props.onDragStart({
|
|
81
|
+
if (typeof onDragStart === 'function') {
|
|
82
|
+
onDragStart({
|
|
73
83
|
...event,
|
|
74
84
|
keys
|
|
75
85
|
});
|
|
76
86
|
}
|
|
77
87
|
},
|
|
78
88
|
moveDrag(event) {
|
|
79
|
-
if (typeof
|
|
80
|
-
|
|
89
|
+
if (typeof onDragMove === 'function') {
|
|
90
|
+
onDragMove({
|
|
81
91
|
...event,
|
|
82
92
|
keys: draggingKeys
|
|
83
93
|
});
|
|
84
94
|
}
|
|
85
95
|
},
|
|
86
96
|
endDrag(event) {
|
|
87
|
-
if (typeof
|
|
88
|
-
|
|
97
|
+
if (typeof onDragEnd === 'function') {
|
|
98
|
+
onDragEnd({
|
|
89
99
|
...event,
|
|
90
100
|
keys: draggingKeys
|
|
91
101
|
});
|
|
92
102
|
}
|
|
93
103
|
|
|
94
104
|
setDraggingKeys(new Set());
|
|
95
|
-
}
|
|
105
|
+
},
|
|
106
|
+
isDraggable: (key: Key) => allowsDraggingItem(key)
|
|
96
107
|
};
|
|
97
108
|
}
|