@react-stately/selection 3.7.0 → 3.9.2
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 +333 -486
- package/dist/main.js.map +1 -1
- package/dist/module.js +318 -478
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +30 -5
- package/dist/types.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/SelectionManager.ts +65 -6
- package/src/types.ts +13 -3
- package/src/useMultipleSelectionState.ts +39 -4
package/dist/module.js
CHANGED
|
@@ -1,532 +1,372 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
/*
|
|
5
|
-
* Copyright 2020 Adobe. All rights reserved.
|
|
6
|
-
* This file is licensed to you under the Apache License, Version 2.0 (the "License");
|
|
7
|
-
* you may not use this file except in compliance with the License. You may obtain a copy
|
|
8
|
-
* of the License at http://www.apache.org/licenses/LICENSE-2.0
|
|
9
|
-
*
|
|
10
|
-
* Unless required by applicable law or agreed to in writing, software distributed under
|
|
11
|
-
* the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
|
|
12
|
-
* OF ANY KIND, either express or implied. See the License for the specific language
|
|
13
|
-
* governing permissions and limitations under the License.
|
|
14
|
-
*/
|
|
15
|
-
|
|
16
|
-
/**
|
|
17
|
-
* A Selection is a special Set containing Keys, which also has an anchor
|
|
18
|
-
* and current selected key for use when range selecting.
|
|
19
|
-
*/
|
|
20
|
-
class $c91e86e24f2dc9a2182dcc2674c58c$export$Selection extends Set {
|
|
21
|
-
constructor(keys, anchorKey, currentKey) {
|
|
22
|
-
super(keys);
|
|
23
|
-
this.anchorKey = void 0;
|
|
24
|
-
this.currentKey = void 0;
|
|
25
|
-
|
|
26
|
-
if (keys instanceof $c91e86e24f2dc9a2182dcc2674c58c$export$Selection) {
|
|
27
|
-
this.anchorKey = anchorKey || keys.anchorKey;
|
|
28
|
-
this.currentKey = currentKey || keys.currentKey;
|
|
29
|
-
} else {
|
|
30
|
-
this.anchorKey = anchorKey;
|
|
31
|
-
this.currentKey = currentKey;
|
|
32
|
-
}
|
|
33
|
-
}
|
|
1
|
+
import {useRef as $f0goU$useRef, useState as $f0goU$useState, useMemo as $f0goU$useMemo} from "react";
|
|
2
|
+
import {useControlledState as $f0goU$useControlledState} from "@react-stately/utils";
|
|
34
3
|
|
|
4
|
+
function $parcel$export(e, n, v, s) {
|
|
5
|
+
Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
|
|
6
|
+
}
|
|
7
|
+
var $ec35bdc00c823be9$exports = {};
|
|
8
|
+
|
|
9
|
+
$parcel$export($ec35bdc00c823be9$exports, "useMultipleSelectionState", () => $ec35bdc00c823be9$export$253fe78d46329472);
|
|
10
|
+
|
|
11
|
+
class $84eb7a4250035b1f$export$52baac22726c72bf extends Set {
|
|
12
|
+
constructor(keys, anchorKey, currentKey){
|
|
13
|
+
super(keys);
|
|
14
|
+
if (keys instanceof $84eb7a4250035b1f$export$52baac22726c72bf) {
|
|
15
|
+
this.anchorKey = anchorKey || keys.anchorKey;
|
|
16
|
+
this.currentKey = currentKey || keys.currentKey;
|
|
17
|
+
} else {
|
|
18
|
+
this.anchorKey = anchorKey;
|
|
19
|
+
this.currentKey = currentKey;
|
|
20
|
+
}
|
|
21
|
+
}
|
|
35
22
|
}
|
|
36
23
|
|
|
37
|
-
/**
|
|
38
|
-
* Manages state for multiple selection and focus in a collection.
|
|
39
|
-
*/
|
|
40
|
-
export function useMultipleSelectionState(props) {
|
|
41
|
-
let {
|
|
42
|
-
selectionMode = 'none',
|
|
43
|
-
disallowEmptySelection
|
|
44
|
-
} = props; // We want synchronous updates to `isFocused` and `focusedKey` after their setters are called.
|
|
45
|
-
// But we also need to trigger a react re-render. So, we have both a ref (sync) and state (async).
|
|
46
|
-
|
|
47
|
-
let isFocusedRef = useRef(false);
|
|
48
|
-
let [, setFocused] = useState(false);
|
|
49
|
-
let focusedKeyRef = useRef(null);
|
|
50
|
-
let childFocusStrategyRef = useRef(null);
|
|
51
|
-
let [, setFocusedKey] = useState(null);
|
|
52
|
-
let selectedKeysProp = useMemo(() => $c86d35e876e048ac11515eee40c7$var$convertSelection(props.selectedKeys), [props.selectedKeys]);
|
|
53
|
-
let defaultSelectedKeys = useMemo(() => $c86d35e876e048ac11515eee40c7$var$convertSelection(props.defaultSelectedKeys, new $c91e86e24f2dc9a2182dcc2674c58c$export$Selection()), [props.defaultSelectedKeys]);
|
|
54
|
-
let [selectedKeys, setSelectedKeys] = useControlledState(selectedKeysProp, defaultSelectedKeys, props.onSelectionChange);
|
|
55
|
-
let disabledKeysProp = useMemo(() => props.disabledKeys ? new Set(props.disabledKeys) : new Set(), [props.disabledKeys]);
|
|
56
|
-
return {
|
|
57
|
-
selectionMode,
|
|
58
|
-
disallowEmptySelection,
|
|
59
|
-
|
|
60
|
-
get isFocused() {
|
|
61
|
-
return isFocusedRef.current;
|
|
62
|
-
},
|
|
63
|
-
|
|
64
|
-
setFocused(f) {
|
|
65
|
-
isFocusedRef.current = f;
|
|
66
|
-
setFocused(f);
|
|
67
|
-
},
|
|
68
|
-
|
|
69
|
-
get focusedKey() {
|
|
70
|
-
return focusedKeyRef.current;
|
|
71
|
-
},
|
|
72
|
-
|
|
73
|
-
get childFocusStrategy() {
|
|
74
|
-
return childFocusStrategyRef.current;
|
|
75
|
-
},
|
|
76
|
-
|
|
77
|
-
setFocusedKey(k, childFocusStrategy) {
|
|
78
|
-
if (childFocusStrategy === void 0) {
|
|
79
|
-
childFocusStrategy = 'first';
|
|
80
|
-
}
|
|
81
24
|
|
|
82
|
-
focusedKeyRef.current = k;
|
|
83
|
-
childFocusStrategyRef.current = childFocusStrategy;
|
|
84
|
-
setFocusedKey(k);
|
|
85
|
-
},
|
|
86
25
|
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
26
|
+
function $ec35bdc00c823be9$var$equalSets(setA, setB) {
|
|
27
|
+
if (setA.size !== setB.size) return false;
|
|
28
|
+
for (let item of setA){
|
|
29
|
+
if (!setB.has(item)) return false;
|
|
30
|
+
}
|
|
31
|
+
return true;
|
|
91
32
|
}
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
33
|
+
function $ec35bdc00c823be9$export$253fe78d46329472(props) {
|
|
34
|
+
let { selectionMode: selectionMode = 'none' , disallowEmptySelection: disallowEmptySelection , allowDuplicateSelectionEvents: allowDuplicateSelectionEvents } = props;
|
|
35
|
+
// We want synchronous updates to `isFocused` and `focusedKey` after their setters are called.
|
|
36
|
+
// But we also need to trigger a react re-render. So, we have both a ref (sync) and state (async).
|
|
37
|
+
let isFocusedRef = $f0goU$useRef(false);
|
|
38
|
+
let [, setFocused] = $f0goU$useState(false);
|
|
39
|
+
let focusedKeyRef = $f0goU$useRef(null);
|
|
40
|
+
let childFocusStrategyRef = $f0goU$useRef(null);
|
|
41
|
+
let [, setFocusedKey] = $f0goU$useState(null);
|
|
42
|
+
let selectedKeysProp = $f0goU$useMemo(()=>$ec35bdc00c823be9$var$convertSelection(props.selectedKeys)
|
|
43
|
+
, [
|
|
44
|
+
props.selectedKeys
|
|
45
|
+
]);
|
|
46
|
+
let defaultSelectedKeys = $f0goU$useMemo(()=>$ec35bdc00c823be9$var$convertSelection(props.defaultSelectedKeys, new $84eb7a4250035b1f$export$52baac22726c72bf())
|
|
47
|
+
, [
|
|
48
|
+
props.defaultSelectedKeys
|
|
49
|
+
]);
|
|
50
|
+
let [selectedKeys, setSelectedKeys] = $f0goU$useControlledState(selectedKeysProp, defaultSelectedKeys, props.onSelectionChange);
|
|
51
|
+
let disabledKeysProp = $f0goU$useMemo(()=>props.disabledKeys ? new Set(props.disabledKeys) : new Set()
|
|
52
|
+
, [
|
|
53
|
+
props.disabledKeys
|
|
54
|
+
]);
|
|
55
|
+
let [selectionBehavior, setSelectionBehavior] = $f0goU$useState(props.selectionBehavior || 'toggle');
|
|
56
|
+
// If the selectionBehavior prop is set to replace, but the current state is toggle (e.g. due to long press
|
|
57
|
+
// to enter selection mode on touch), and the selection becomes empty, reset the selection behavior.
|
|
58
|
+
if (props.selectionBehavior === 'replace' && selectionBehavior === 'toggle' && typeof selectedKeys === 'object' && selectedKeys.size === 0) setSelectionBehavior('replace');
|
|
59
|
+
return {
|
|
60
|
+
selectionMode: selectionMode,
|
|
61
|
+
disallowEmptySelection: disallowEmptySelection,
|
|
62
|
+
selectionBehavior: selectionBehavior,
|
|
63
|
+
setSelectionBehavior: setSelectionBehavior,
|
|
64
|
+
get isFocused () {
|
|
65
|
+
return isFocusedRef.current;
|
|
66
|
+
},
|
|
67
|
+
setFocused (f) {
|
|
68
|
+
isFocusedRef.current = f;
|
|
69
|
+
setFocused(f);
|
|
70
|
+
},
|
|
71
|
+
get focusedKey () {
|
|
72
|
+
return focusedKeyRef.current;
|
|
73
|
+
},
|
|
74
|
+
get childFocusStrategy () {
|
|
75
|
+
return childFocusStrategyRef.current;
|
|
76
|
+
},
|
|
77
|
+
setFocusedKey (k, childFocusStrategy = 'first') {
|
|
78
|
+
focusedKeyRef.current = k;
|
|
79
|
+
childFocusStrategyRef.current = childFocusStrategy;
|
|
80
|
+
setFocusedKey(k);
|
|
81
|
+
},
|
|
82
|
+
selectedKeys: selectedKeys,
|
|
83
|
+
setSelectedKeys (keys) {
|
|
84
|
+
if (allowDuplicateSelectionEvents || !$ec35bdc00c823be9$var$equalSets(keys, selectedKeys)) setSelectedKeys(keys);
|
|
85
|
+
},
|
|
86
|
+
disabledKeys: disabledKeysProp
|
|
87
|
+
};
|
|
88
|
+
}
|
|
89
|
+
function $ec35bdc00c823be9$var$convertSelection(selection, defaultValue) {
|
|
90
|
+
if (!selection) return defaultValue;
|
|
91
|
+
return selection === 'all' ? 'all' : new $84eb7a4250035b1f$export$52baac22726c72bf(selection);
|
|
99
92
|
}
|
|
100
93
|
|
|
101
|
-
/**
|
|
102
|
-
* An interface for reading and updating multiple selection state.
|
|
103
|
-
*/
|
|
104
|
-
export class SelectionManager {
|
|
105
|
-
constructor(collection, state, options) {
|
|
106
|
-
var _options$allowsCellSe;
|
|
107
94
|
|
|
108
|
-
|
|
109
|
-
this.state = void 0;
|
|
110
|
-
this.allowsCellSelection = void 0;
|
|
111
|
-
this._isSelectAll = void 0;
|
|
112
|
-
this.collection = collection;
|
|
113
|
-
this.state = state;
|
|
114
|
-
this.allowsCellSelection = (_options$allowsCellSe = options == null ? void 0 : options.allowsCellSelection) != null ? _options$allowsCellSe : false;
|
|
115
|
-
this._isSelectAll = null;
|
|
116
|
-
}
|
|
117
|
-
/**
|
|
118
|
-
* The type of selection that is allowed in the collection.
|
|
119
|
-
*/
|
|
95
|
+
var $1c74ece56c82b9c4$exports = {};
|
|
120
96
|
|
|
97
|
+
$parcel$export($1c74ece56c82b9c4$exports, "SelectionManager", () => $1c74ece56c82b9c4$export$6c8a5aaad13c9852);
|
|
121
98
|
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
99
|
+
class $1c74ece56c82b9c4$export$6c8a5aaad13c9852 {
|
|
100
|
+
/**
|
|
101
|
+
* The type of selection that is allowed in the collection.
|
|
102
|
+
*/ get selectionMode() {
|
|
103
|
+
return this.state.selectionMode;
|
|
104
|
+
}
|
|
105
|
+
/**
|
|
126
106
|
* Whether the collection allows empty selection.
|
|
127
|
-
*/
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
107
|
+
*/ get disallowEmptySelection() {
|
|
108
|
+
return this.state.disallowEmptySelection;
|
|
109
|
+
}
|
|
110
|
+
/**
|
|
111
|
+
* The selection behavior for the collection.
|
|
112
|
+
*/ get selectionBehavior() {
|
|
113
|
+
return this.state.selectionBehavior;
|
|
114
|
+
}
|
|
115
|
+
/**
|
|
116
|
+
* Sets the selection behavior for the collection.
|
|
117
|
+
*/ setSelectionBehavior(selectionBehavior) {
|
|
118
|
+
this.state.setSelectionBehavior(selectionBehavior);
|
|
119
|
+
}
|
|
120
|
+
/**
|
|
134
121
|
* Whether the collection is currently focused.
|
|
135
|
-
*/
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
return this.state.isFocused;
|
|
140
|
-
}
|
|
141
|
-
/**
|
|
122
|
+
*/ get isFocused() {
|
|
123
|
+
return this.state.isFocused;
|
|
124
|
+
}
|
|
125
|
+
/**
|
|
142
126
|
* Sets whether the collection is focused.
|
|
143
|
-
*/
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
this.state.setFocused(isFocused);
|
|
148
|
-
}
|
|
149
|
-
/**
|
|
127
|
+
*/ setFocused(isFocused) {
|
|
128
|
+
this.state.setFocused(isFocused);
|
|
129
|
+
}
|
|
130
|
+
/**
|
|
150
131
|
* The current focused key in the collection.
|
|
151
|
-
*/
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
get childFocusStrategy() {
|
|
161
|
-
return this.state.childFocusStrategy;
|
|
162
|
-
}
|
|
163
|
-
/**
|
|
132
|
+
*/ get focusedKey() {
|
|
133
|
+
return this.state.focusedKey;
|
|
134
|
+
}
|
|
135
|
+
/** Whether the first or last child of the focused key should receive focus. */ get childFocusStrategy() {
|
|
136
|
+
return this.state.childFocusStrategy;
|
|
137
|
+
}
|
|
138
|
+
/**
|
|
164
139
|
* Sets the focused key.
|
|
165
|
-
*/
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
this.state.setFocusedKey(key, childFocusStrategy);
|
|
170
|
-
}
|
|
171
|
-
/**
|
|
140
|
+
*/ setFocusedKey(key, childFocusStrategy) {
|
|
141
|
+
this.state.setFocusedKey(key, childFocusStrategy);
|
|
142
|
+
}
|
|
143
|
+
/**
|
|
172
144
|
* The currently selected keys in the collection.
|
|
173
|
-
*/
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
return this.state.selectedKeys === 'all' ? new Set(this.getSelectAllKeys()) : this.state.selectedKeys;
|
|
178
|
-
}
|
|
179
|
-
/**
|
|
145
|
+
*/ get selectedKeys() {
|
|
146
|
+
return this.state.selectedKeys === 'all' ? new Set(this.getSelectAllKeys()) : this.state.selectedKeys;
|
|
147
|
+
}
|
|
148
|
+
/**
|
|
180
149
|
* The raw selection value for the collection.
|
|
181
150
|
* Either 'all' for select all, or a set of keys.
|
|
182
|
-
*/
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
return this.state.selectedKeys;
|
|
187
|
-
}
|
|
188
|
-
/**
|
|
151
|
+
*/ get rawSelection() {
|
|
152
|
+
return this.state.selectedKeys;
|
|
153
|
+
}
|
|
154
|
+
/**
|
|
189
155
|
* Returns whether a key is selected.
|
|
190
|
-
*/
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
if (this.state.selectionMode === 'none') {
|
|
195
|
-
return false;
|
|
156
|
+
*/ isSelected(key) {
|
|
157
|
+
if (this.state.selectionMode === 'none') return false;
|
|
158
|
+
key = this.getKey(key);
|
|
159
|
+
return this.state.selectedKeys === 'all' ? !this.state.disabledKeys.has(key) : this.state.selectedKeys.has(key);
|
|
196
160
|
}
|
|
197
|
-
|
|
198
|
-
key = this.getKey(key);
|
|
199
|
-
return this.state.selectedKeys === 'all' ? !this.state.disabledKeys.has(key) : this.state.selectedKeys.has(key);
|
|
200
|
-
}
|
|
201
|
-
/**
|
|
161
|
+
/**
|
|
202
162
|
* Whether the selection is empty.
|
|
203
|
-
*/
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
get isEmpty() {
|
|
207
|
-
return this.state.selectedKeys !== 'all' && this.state.selectedKeys.size === 0;
|
|
208
|
-
}
|
|
209
|
-
/**
|
|
210
|
-
* Whether all items in the collection are selected.
|
|
211
|
-
*/
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
get isSelectAll() {
|
|
215
|
-
if (this.isEmpty) {
|
|
216
|
-
return false;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
if (this.state.selectedKeys === 'all') {
|
|
220
|
-
return true;
|
|
163
|
+
*/ get isEmpty() {
|
|
164
|
+
return this.state.selectedKeys !== 'all' && this.state.selectedKeys.size === 0;
|
|
221
165
|
}
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
166
|
+
/**
|
|
167
|
+
* Whether all items in the collection are selected.
|
|
168
|
+
*/ get isSelectAll() {
|
|
169
|
+
if (this.isEmpty) return false;
|
|
170
|
+
if (this.state.selectedKeys === 'all') return true;
|
|
171
|
+
if (this._isSelectAll != null) return this._isSelectAll;
|
|
172
|
+
let allKeys = this.getSelectAllKeys();
|
|
173
|
+
let selectedKeys = this.state.selectedKeys;
|
|
174
|
+
this._isSelectAll = allKeys.every((k)=>selectedKeys.has(k)
|
|
175
|
+
);
|
|
176
|
+
return this._isSelectAll;
|
|
225
177
|
}
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
get firstSelectedKey() {
|
|
234
|
-
var _first;
|
|
235
|
-
|
|
236
|
-
let first = null;
|
|
237
|
-
|
|
238
|
-
for (let key of this.state.selectedKeys) {
|
|
239
|
-
let item = this.collection.getItem(key);
|
|
240
|
-
|
|
241
|
-
if (!first || (item == null ? void 0 : item.index) < first.index) {
|
|
242
|
-
first = item;
|
|
243
|
-
}
|
|
178
|
+
get firstSelectedKey() {
|
|
179
|
+
let first = null;
|
|
180
|
+
for (let key of this.state.selectedKeys){
|
|
181
|
+
let item = this.collection.getItem(key);
|
|
182
|
+
if (!first || (item === null || item === void 0 ? void 0 : item.index) < first.index) first = item;
|
|
183
|
+
}
|
|
184
|
+
return first === null || first === void 0 ? void 0 : first.key;
|
|
244
185
|
}
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
let last = null;
|
|
253
|
-
|
|
254
|
-
for (let key of this.state.selectedKeys) {
|
|
255
|
-
let item = this.collection.getItem(key);
|
|
256
|
-
|
|
257
|
-
if (!last || (item == null ? void 0 : item.index) > last.index) {
|
|
258
|
-
last = item;
|
|
259
|
-
}
|
|
186
|
+
get lastSelectedKey() {
|
|
187
|
+
let last = null;
|
|
188
|
+
for (let key of this.state.selectedKeys){
|
|
189
|
+
let item = this.collection.getItem(key);
|
|
190
|
+
if (!last || (item === null || item === void 0 ? void 0 : item.index) > last.index) last = item;
|
|
191
|
+
}
|
|
192
|
+
return last === null || last === void 0 ? void 0 : last.key;
|
|
260
193
|
}
|
|
261
|
-
|
|
262
|
-
return (_last = last) == null ? void 0 : _last.key;
|
|
263
|
-
}
|
|
264
|
-
/**
|
|
194
|
+
/**
|
|
265
195
|
* Extends the selection to the given key.
|
|
266
|
-
*/
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
let selection; // Only select the one key if coming from a select all.
|
|
272
|
-
|
|
273
|
-
if (this.state.selectedKeys === 'all') {
|
|
274
|
-
selection = new $c91e86e24f2dc9a2182dcc2674c58c$export$Selection([toKey], toKey, toKey);
|
|
275
|
-
} else {
|
|
276
|
-
let selectedKeys = this.state.selectedKeys;
|
|
277
|
-
let anchorKey = selectedKeys.anchorKey || toKey;
|
|
278
|
-
selection = new $c91e86e24f2dc9a2182dcc2674c58c$export$Selection(selectedKeys, anchorKey, toKey);
|
|
279
|
-
|
|
280
|
-
for (let key of this.getKeyRange(anchorKey, selectedKeys.currentKey || toKey)) {
|
|
281
|
-
selection.delete(key);
|
|
282
|
-
}
|
|
283
|
-
|
|
284
|
-
for (let key of this.getKeyRange(toKey, anchorKey)) {
|
|
285
|
-
if (!this.state.disabledKeys.has(key)) {
|
|
286
|
-
selection.add(key);
|
|
196
|
+
*/ extendSelection(toKey) {
|
|
197
|
+
if (this.selectionMode === 'none') return;
|
|
198
|
+
if (this.selectionMode === 'single') {
|
|
199
|
+
this.replaceSelection(toKey);
|
|
200
|
+
return;
|
|
287
201
|
}
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
return this.getKeyRangeInternal(to, from);
|
|
202
|
+
toKey = this.getKey(toKey);
|
|
203
|
+
let selection;
|
|
204
|
+
// Only select the one key if coming from a select all.
|
|
205
|
+
if (this.state.selectedKeys === 'all') selection = new $84eb7a4250035b1f$export$52baac22726c72bf([
|
|
206
|
+
toKey
|
|
207
|
+
], toKey, toKey);
|
|
208
|
+
else {
|
|
209
|
+
let selectedKeys = this.state.selectedKeys;
|
|
210
|
+
let anchorKey = selectedKeys.anchorKey || toKey;
|
|
211
|
+
selection = new $84eb7a4250035b1f$export$52baac22726c72bf(selectedKeys, anchorKey, toKey);
|
|
212
|
+
for (let key of this.getKeyRange(anchorKey, selectedKeys.currentKey || toKey))selection.delete(key);
|
|
213
|
+
for (let key1 of this.getKeyRange(toKey, anchorKey))if (!this.state.disabledKeys.has(key1)) selection.add(key1);
|
|
214
|
+
}
|
|
215
|
+
this.state.setSelectedKeys(selection);
|
|
304
216
|
}
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
while (key) {
|
|
314
|
-
let item = this.collection.getItem(key);
|
|
315
|
-
|
|
316
|
-
if (item && item.type === 'item' || item.type === 'cell' && this.allowsCellSelection) {
|
|
317
|
-
keys.push(key);
|
|
318
|
-
}
|
|
319
|
-
|
|
320
|
-
if (key === to) {
|
|
321
|
-
return keys;
|
|
322
|
-
}
|
|
323
|
-
|
|
324
|
-
key = this.collection.getKeyAfter(key);
|
|
217
|
+
getKeyRange(from, to) {
|
|
218
|
+
let fromItem = this.collection.getItem(from);
|
|
219
|
+
let toItem = this.collection.getItem(to);
|
|
220
|
+
if (fromItem && toItem) {
|
|
221
|
+
if (fromItem.index <= toItem.index) return this.getKeyRangeInternal(from, to);
|
|
222
|
+
return this.getKeyRangeInternal(to, from);
|
|
223
|
+
}
|
|
224
|
+
return [];
|
|
325
225
|
}
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
} // If cell selection is allowed, just return the key.
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
if (item.type === 'cell' && this.allowsCellSelection) {
|
|
340
|
-
return key;
|
|
341
|
-
} // Find a parent item to select
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
while (item.type !== 'item' && item.parentKey) {
|
|
345
|
-
item = this.collection.getItem(item.parentKey);
|
|
226
|
+
getKeyRangeInternal(from, to) {
|
|
227
|
+
let keys = [];
|
|
228
|
+
let key = from;
|
|
229
|
+
while(key){
|
|
230
|
+
let item = this.collection.getItem(key);
|
|
231
|
+
if (item && item.type === 'item' || item.type === 'cell' && this.allowsCellSelection) keys.push(key);
|
|
232
|
+
if (key === to) return keys;
|
|
233
|
+
key = this.collection.getKeyAfter(key);
|
|
234
|
+
}
|
|
235
|
+
return [];
|
|
346
236
|
}
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
237
|
+
getKey(key) {
|
|
238
|
+
let item = this.collection.getItem(key);
|
|
239
|
+
if (!item) // ¯\_(ツ)_/¯
|
|
240
|
+
return key;
|
|
241
|
+
// If cell selection is allowed, just return the key.
|
|
242
|
+
if (item.type === 'cell' && this.allowsCellSelection) return key;
|
|
243
|
+
// Find a parent item to select
|
|
244
|
+
while(item.type !== 'item' && item.parentKey != null)item = this.collection.getItem(item.parentKey);
|
|
245
|
+
if (!item || item.type !== 'item') return null;
|
|
246
|
+
return item.key;
|
|
350
247
|
}
|
|
351
|
-
|
|
352
|
-
return item.key;
|
|
353
|
-
}
|
|
354
|
-
/**
|
|
248
|
+
/**
|
|
355
249
|
* Toggles whether the given key is selected.
|
|
356
|
-
*/
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
keys.anchorKey = key;
|
|
374
|
-
keys.currentKey = key;
|
|
375
|
-
}
|
|
376
|
-
|
|
377
|
-
if (this.disallowEmptySelection && keys.size === 0) {
|
|
378
|
-
return;
|
|
250
|
+
*/ toggleSelection(key) {
|
|
251
|
+
if (this.selectionMode === 'none') return;
|
|
252
|
+
if (this.selectionMode === 'single' && !this.isSelected(key)) {
|
|
253
|
+
this.replaceSelection(key);
|
|
254
|
+
return;
|
|
255
|
+
}
|
|
256
|
+
key = this.getKey(key);
|
|
257
|
+
if (key == null) return;
|
|
258
|
+
let keys = new $84eb7a4250035b1f$export$52baac22726c72bf(this.state.selectedKeys === 'all' ? this.getSelectAllKeys() : this.state.selectedKeys);
|
|
259
|
+
if (keys.has(key)) keys.delete(key);
|
|
260
|
+
else {
|
|
261
|
+
keys.add(key);
|
|
262
|
+
keys.anchorKey = key;
|
|
263
|
+
keys.currentKey = key;
|
|
264
|
+
}
|
|
265
|
+
if (this.disallowEmptySelection && keys.size === 0) return;
|
|
266
|
+
this.state.setSelectedKeys(keys);
|
|
379
267
|
}
|
|
380
|
-
|
|
381
|
-
this.state.setSelectedKeys(keys);
|
|
382
|
-
}
|
|
383
|
-
/**
|
|
268
|
+
/**
|
|
384
269
|
* Replaces the selection with only the given key.
|
|
385
|
-
*/
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
return;
|
|
270
|
+
*/ replaceSelection(key) {
|
|
271
|
+
if (this.selectionMode === 'none') return;
|
|
272
|
+
key = this.getKey(key);
|
|
273
|
+
if (key == null) return;
|
|
274
|
+
this.state.setSelectedKeys(new $84eb7a4250035b1f$export$52baac22726c72bf([
|
|
275
|
+
key
|
|
276
|
+
], key, key));
|
|
393
277
|
}
|
|
394
|
-
|
|
395
|
-
this.state.setSelectedKeys(new $c91e86e24f2dc9a2182dcc2674c58c$export$Selection([key], key, key));
|
|
396
|
-
}
|
|
397
|
-
/**
|
|
278
|
+
/**
|
|
398
279
|
* Replaces the selection with the given keys.
|
|
399
|
-
*/
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
for (let key of keys) {
|
|
410
|
-
key = this.getKey(key);
|
|
411
|
-
|
|
412
|
-
if (key != null) {
|
|
413
|
-
selection.add(key);
|
|
414
|
-
|
|
415
|
-
if (this.selectionMode === 'single') {
|
|
416
|
-
break;
|
|
280
|
+
*/ setSelectedKeys(keys) {
|
|
281
|
+
if (this.selectionMode === 'none') return;
|
|
282
|
+
let selection = new $84eb7a4250035b1f$export$52baac22726c72bf();
|
|
283
|
+
for (let key of keys){
|
|
284
|
+
key = this.getKey(key);
|
|
285
|
+
if (key != null) {
|
|
286
|
+
selection.add(key);
|
|
287
|
+
if (this.selectionMode === 'single') break;
|
|
288
|
+
}
|
|
417
289
|
}
|
|
418
|
-
|
|
290
|
+
this.state.setSelectedKeys(selection);
|
|
419
291
|
}
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
}
|
|
440
|
-
}
|
|
441
|
-
|
|
442
|
-
key = this.collection.getKeyAfter(key);
|
|
443
|
-
}
|
|
444
|
-
};
|
|
445
|
-
|
|
446
|
-
addKeys(this.collection.getFirstKey());
|
|
447
|
-
return keys;
|
|
448
|
-
}
|
|
449
|
-
/**
|
|
292
|
+
getSelectAllKeys() {
|
|
293
|
+
let keys = [];
|
|
294
|
+
let addKeys = (key)=>{
|
|
295
|
+
while(key){
|
|
296
|
+
if (!this.state.disabledKeys.has(key)) {
|
|
297
|
+
let item = this.collection.getItem(key);
|
|
298
|
+
if (item.type === 'item') keys.push(key);
|
|
299
|
+
// Add child keys. If cell selection is allowed, then include item children too.
|
|
300
|
+
if (item.hasChildNodes && (this.allowsCellSelection || item.type !== 'item')) addKeys([
|
|
301
|
+
...item.childNodes
|
|
302
|
+
][0].key);
|
|
303
|
+
}
|
|
304
|
+
key = this.collection.getKeyAfter(key);
|
|
305
|
+
}
|
|
306
|
+
};
|
|
307
|
+
addKeys(this.collection.getFirstKey());
|
|
308
|
+
return keys;
|
|
309
|
+
}
|
|
310
|
+
/**
|
|
450
311
|
* Selects all items in the collection.
|
|
451
|
-
*/
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
selectAll() {
|
|
455
|
-
if (this.selectionMode === 'multiple') {
|
|
456
|
-
this.state.setSelectedKeys('all');
|
|
312
|
+
*/ selectAll() {
|
|
313
|
+
if (this.selectionMode === 'multiple') this.state.setSelectedKeys('all');
|
|
457
314
|
}
|
|
458
|
-
|
|
459
|
-
/**
|
|
315
|
+
/**
|
|
460
316
|
* Removes all keys from the selection.
|
|
461
|
-
*/
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
clearSelection() {
|
|
465
|
-
if (!this.disallowEmptySelection && (this.state.selectedKeys === 'all' || this.state.selectedKeys.size > 0)) {
|
|
466
|
-
this.state.setSelectedKeys(new $c91e86e24f2dc9a2182dcc2674c58c$export$Selection());
|
|
317
|
+
*/ clearSelection() {
|
|
318
|
+
if (!this.disallowEmptySelection && (this.state.selectedKeys === 'all' || this.state.selectedKeys.size > 0)) this.state.setSelectedKeys(new $84eb7a4250035b1f$export$52baac22726c72bf());
|
|
467
319
|
}
|
|
468
|
-
|
|
469
|
-
/**
|
|
320
|
+
/**
|
|
470
321
|
* Toggles between select all and an empty selection.
|
|
471
|
-
*/
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
toggleSelectAll() {
|
|
475
|
-
if (this.isSelectAll) {
|
|
476
|
-
this.clearSelection();
|
|
477
|
-
} else {
|
|
478
|
-
this.selectAll();
|
|
479
|
-
}
|
|
480
|
-
}
|
|
481
|
-
|
|
482
|
-
select(key, e) {
|
|
483
|
-
if (this.selectionMode === 'none') {
|
|
484
|
-
return;
|
|
322
|
+
*/ toggleSelectAll() {
|
|
323
|
+
if (this.isSelectAll) this.clearSelection();
|
|
324
|
+
else this.selectAll();
|
|
485
325
|
}
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
326
|
+
select(key, e) {
|
|
327
|
+
if (this.selectionMode === 'none') return;
|
|
328
|
+
if (this.selectionMode === 'single') {
|
|
329
|
+
if (this.isSelected(key) && !this.disallowEmptySelection) this.toggleSelection(key);
|
|
330
|
+
else this.replaceSelection(key);
|
|
331
|
+
} else if (this.selectionBehavior === 'toggle' || e && (e.pointerType === 'touch' || e.pointerType === 'virtual')) // if touch or virtual (VO) then we just want to toggle, otherwise it's impossible to multi select because they don't have modifier keys
|
|
489
332
|
this.toggleSelection(key);
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
} else if (e && e.shiftKey) {
|
|
494
|
-
this.extendSelection(key);
|
|
495
|
-
} else {
|
|
496
|
-
this.toggleSelection(key);
|
|
497
|
-
}
|
|
498
|
-
}
|
|
499
|
-
/**
|
|
333
|
+
else this.replaceSelection(key);
|
|
334
|
+
}
|
|
335
|
+
/**
|
|
500
336
|
* Returns whether the current selection is equal to the given selection.
|
|
501
|
-
*/
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
337
|
+
*/ isSelectionEqual(selection) {
|
|
338
|
+
if (selection === this.state.selectedKeys) return true;
|
|
339
|
+
// Check if the set of keys match.
|
|
340
|
+
let selectedKeys = this.selectedKeys;
|
|
341
|
+
if (selection.size !== selectedKeys.size) return false;
|
|
342
|
+
for (let key of selection){
|
|
343
|
+
if (!selectedKeys.has(key)) return false;
|
|
344
|
+
}
|
|
345
|
+
for (let key2 of selectedKeys){
|
|
346
|
+
if (!selection.has(key2)) return false;
|
|
347
|
+
}
|
|
348
|
+
return true;
|
|
349
|
+
}
|
|
350
|
+
canSelectItem(key) {
|
|
351
|
+
if (this.state.selectionMode === 'none' || this.state.disabledKeys.has(key)) return false;
|
|
352
|
+
let item = this.collection.getItem(key);
|
|
353
|
+
if (!item || item.type === 'cell' && !this.allowsCellSelection) return false;
|
|
354
|
+
return true;
|
|
355
|
+
}
|
|
356
|
+
constructor(collection, state, options){
|
|
357
|
+
this.collection = collection;
|
|
358
|
+
this.state = state;
|
|
359
|
+
var ref;
|
|
360
|
+
this.allowsCellSelection = (ref = options === null || options === void 0 ? void 0 : options.allowsCellSelection) !== null && ref !== void 0 ? ref : false;
|
|
361
|
+
this._isSelectAll = null;
|
|
362
|
+
}
|
|
363
|
+
}
|
|
509
364
|
|
|
510
|
-
let selectedKeys = this.selectedKeys;
|
|
511
365
|
|
|
512
|
-
|
|
513
|
-
return false;
|
|
514
|
-
}
|
|
366
|
+
var $8702775bc7287a50$exports = {};
|
|
515
367
|
|
|
516
|
-
for (let key of selection) {
|
|
517
|
-
if (!selectedKeys.has(key)) {
|
|
518
|
-
return false;
|
|
519
|
-
}
|
|
520
|
-
}
|
|
521
368
|
|
|
522
|
-
for (let key of selectedKeys) {
|
|
523
|
-
if (!selection.has(key)) {
|
|
524
|
-
return false;
|
|
525
|
-
}
|
|
526
|
-
}
|
|
527
369
|
|
|
528
|
-
return true;
|
|
529
|
-
}
|
|
530
370
|
|
|
531
|
-
}
|
|
371
|
+
export {$ec35bdc00c823be9$export$253fe78d46329472 as useMultipleSelectionState, $1c74ece56c82b9c4$export$6c8a5aaad13c9852 as SelectionManager};
|
|
532
372
|
//# sourceMappingURL=module.js.map
|