react-arborist 2.1.0 → 2.2.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 +2 -3
- package/dist/hooks/use-simple-tree.d.ts +1 -1
- package/dist/index.js +35 -36
- package/dist/index.js.map +1 -1
- package/dist/interfaces/tree-api.d.ts +1 -1
- package/dist/module.js +35 -36
- package/dist/module.js.map +1 -1
- package/dist/types/tree-props.d.ts +5 -4
- package/package.json +3 -2
- package/src/components/default-container.tsx +33 -36
- package/src/components/row-container.tsx +1 -2
- package/src/data/create-root.ts +1 -1
- package/src/hooks/use-simple-tree.ts +1 -1
- package/src/interfaces/node-api.ts +2 -2
- package/src/interfaces/tree-api.ts +1 -1
- package/src/types/tree-props.ts +5 -4
package/README.md
CHANGED
|
@@ -291,6 +291,7 @@ interface TreeProps<T> {
|
|
|
291
291
|
/* Config */
|
|
292
292
|
openByDefault?: boolean;
|
|
293
293
|
selectionFollowsFocus?: boolean;
|
|
294
|
+
disableMultiSelection?: boolean;
|
|
294
295
|
disableDrag?: string | boolean | BoolFunc<T>;
|
|
295
296
|
disableDrop?: string | boolean | BoolFunc<T>;
|
|
296
297
|
childrenAccessor?: string | ((d: T) => T[]);
|
|
@@ -717,6 +718,4 @@ Returns the root _NodeApi_ instance. Its children are the Node representations o
|
|
|
717
718
|
|
|
718
719
|
## Author
|
|
719
720
|
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
[Follow me on Twitter](https://twitter.com/specialCaseDev) for react-arborist updates.
|
|
721
|
+
[James Kerr](https://twitter.com/specialCaseDev) at [Brim Data](https://brimdata.io) for the [Zui desktop app](https://www.youtube.com/watch?v=I2y663n8d2A).
|
|
@@ -4,7 +4,7 @@ export declare type SimpleTreeData = {
|
|
|
4
4
|
name: string;
|
|
5
5
|
children?: SimpleTreeData[];
|
|
6
6
|
};
|
|
7
|
-
export declare function useSimpleTree<T>(initialData: T[]): readonly [T[], {
|
|
7
|
+
export declare function useSimpleTree<T>(initialData: readonly T[]): readonly [readonly T[], {
|
|
8
8
|
onMove: MoveHandler<T>;
|
|
9
9
|
onRename: RenameHandler<T>;
|
|
10
10
|
onCreate: CreateHandler<T>;
|
package/dist/index.js
CHANGED
|
@@ -492,8 +492,8 @@ class $9b37fe5960a1a3c6$export$d4b903da0f522dc8 {
|
|
|
492
492
|
return this.tree.edit(this);
|
|
493
493
|
}
|
|
494
494
|
handleClick = (e)=>{
|
|
495
|
-
if (e.metaKey) this.isSelected ? this.deselect() : this.selectMulti();
|
|
496
|
-
else if (e.shiftKey) this.selectContiguous();
|
|
495
|
+
if (e.metaKey && !this.tree.props.disableMultiSelection) this.isSelected ? this.deselect() : this.selectMulti();
|
|
496
|
+
else if (e.shiftKey && !this.tree.props.disableMultiSelection) this.selectContiguous();
|
|
497
497
|
else {
|
|
498
498
|
this.select();
|
|
499
499
|
this.activate();
|
|
@@ -1262,7 +1262,9 @@ const $37e3f46f8fd1101f$export$a9754b3c8daa5172 = /*#__PURE__*/ (0, ($parcel$int
|
|
|
1262
1262
|
className: tree.props.rowClassName
|
|
1263
1263
|
};
|
|
1264
1264
|
(0, $foSVk$react.useEffect)(()=>{
|
|
1265
|
-
if (!node.isEditing && node.isFocused) el.current?.focus(
|
|
1265
|
+
if (!node.isEditing && node.isFocused) el.current?.focus({
|
|
1266
|
+
preventScroll: true
|
|
1267
|
+
});
|
|
1266
1268
|
}, [
|
|
1267
1269
|
node.isEditing,
|
|
1268
1270
|
node.isFocused,
|
|
@@ -1341,36 +1343,39 @@ function $bb9a1e34249689ac$export$ff4858a4110d9246() {
|
|
|
1341
1343
|
(0, $eb5355379510ac9b$export$33b47db07a82b2fb)(e.currentTarget);
|
|
1342
1344
|
return;
|
|
1343
1345
|
}
|
|
1344
|
-
if (e.key === "ArrowDown"
|
|
1346
|
+
if (e.key === "ArrowDown") {
|
|
1345
1347
|
e.preventDefault();
|
|
1346
1348
|
const next = tree.nextNode;
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
e.
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
tree.focus(tree.prevNode);
|
|
1363
|
-
return;
|
|
1349
|
+
if (e.metaKey) {
|
|
1350
|
+
tree.select(tree.focusedNode);
|
|
1351
|
+
tree.activate(tree.focusedNode);
|
|
1352
|
+
return;
|
|
1353
|
+
} else if (!e.shiftKey || tree.props.disableMultiSelection) {
|
|
1354
|
+
tree.focus(next);
|
|
1355
|
+
return;
|
|
1356
|
+
} else {
|
|
1357
|
+
if (!next) return;
|
|
1358
|
+
const current = tree.focusedNode;
|
|
1359
|
+
if (!current) tree.focus(tree.firstNode);
|
|
1360
|
+
else if (current.isSelected) tree.selectContiguous(next);
|
|
1361
|
+
else tree.selectMulti(next);
|
|
1362
|
+
return;
|
|
1363
|
+
}
|
|
1364
1364
|
}
|
|
1365
|
-
if (e.key === "ArrowUp"
|
|
1365
|
+
if (e.key === "ArrowUp") {
|
|
1366
1366
|
e.preventDefault();
|
|
1367
1367
|
const prev = tree.prevNode;
|
|
1368
|
-
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
else
|
|
1372
|
-
|
|
1373
|
-
|
|
1368
|
+
if (!e.shiftKey || tree.props.disableMultiSelection) {
|
|
1369
|
+
tree.focus(prev);
|
|
1370
|
+
return;
|
|
1371
|
+
} else {
|
|
1372
|
+
if (!prev) return;
|
|
1373
|
+
const current1 = tree.focusedNode;
|
|
1374
|
+
if (!current1) tree.focus(tree.lastNode); // ?
|
|
1375
|
+
else if (current1.isSelected) tree.selectContiguous(prev);
|
|
1376
|
+
else tree.selectMulti(prev);
|
|
1377
|
+
return;
|
|
1378
|
+
}
|
|
1374
1379
|
}
|
|
1375
1380
|
if (e.key === "ArrowRight") {
|
|
1376
1381
|
const node1 = tree.focusedNode;
|
|
@@ -1386,7 +1391,7 @@ function $bb9a1e34249689ac$export$ff4858a4110d9246() {
|
|
|
1386
1391
|
else if (!node2.parent?.isRoot) tree.focus(node2.parent);
|
|
1387
1392
|
return;
|
|
1388
1393
|
}
|
|
1389
|
-
if (e.key === "a" && e.metaKey) {
|
|
1394
|
+
if (e.key === "a" && e.metaKey && !tree.props.disableMultiSelection) {
|
|
1390
1395
|
e.preventDefault();
|
|
1391
1396
|
tree.selectAll();
|
|
1392
1397
|
return;
|
|
@@ -1436,12 +1441,6 @@ function $bb9a1e34249689ac$export$ff4858a4110d9246() {
|
|
|
1436
1441
|
tree.openSiblings(node4);
|
|
1437
1442
|
return;
|
|
1438
1443
|
}
|
|
1439
|
-
if (e.key === "ArrowDown" && e.metaKey) {
|
|
1440
|
-
e.preventDefault();
|
|
1441
|
-
tree.select(tree.focusedNode);
|
|
1442
|
-
tree.activate(tree.focusedNode);
|
|
1443
|
-
return;
|
|
1444
|
-
}
|
|
1445
1444
|
if (e.key === "PageUp") {
|
|
1446
1445
|
e.preventDefault();
|
|
1447
1446
|
tree.pageUp();
|
|
@@ -1894,7 +1893,7 @@ class $5c74fef433be2b0a$export$e2da3477247342d1 {
|
|
|
1894
1893
|
if (index === undefined) return;
|
|
1895
1894
|
this.list.current?.scrollToItem(index, align);
|
|
1896
1895
|
}).catch(()=>{
|
|
1897
|
-
|
|
1896
|
+
// Id: ${id} never appeared in the list.
|
|
1898
1897
|
});
|
|
1899
1898
|
}
|
|
1900
1899
|
/* State Checks */ get isEditing() {
|