@fluentui/react-tree 9.15.4 → 9.15.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/CHANGELOG.md +33 -2
- package/lib/components/FlatTree/useFlatControllableCheckedItems.js +23 -15
- package/lib/components/FlatTree/useFlatControllableCheckedItems.js.map +1 -1
- package/lib/utils/createHeadlessTree.js +23 -4
- package/lib/utils/createHeadlessTree.js.map +1 -1
- package/lib-commonjs/components/FlatTree/useFlatControllableCheckedItems.js +23 -15
- package/lib-commonjs/components/FlatTree/useFlatControllableCheckedItems.js.map +1 -1
- package/lib-commonjs/utils/createHeadlessTree.js +23 -4
- package/lib-commonjs/utils/createHeadlessTree.js.map +1 -1
- package/package.json +14 -14
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,43 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-tree
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Tue, 11 Nov 2025 19:13:22 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.15.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.15.6)
|
|
8
|
+
|
|
9
|
+
Tue, 11 Nov 2025 19:13:22 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.15.5..@fluentui/react-tree_v9.15.6)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- performance optimization in react-tree ([PR #35198](https://github.com/microsoft/fluentui/pull/35198) by maachin@gmail.com)
|
|
15
|
+
- chore: Bump @griffel/react package. ([PR #35469](https://github.com/microsoft/fluentui/pull/35469) by estebanmu@microsoft.com)
|
|
16
|
+
- Bump @fluentui/react-aria to v9.17.6 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
17
|
+
- Bump @fluentui/react-avatar to v9.9.12 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
18
|
+
- Bump @fluentui/react-button to v9.6.12 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
19
|
+
- Bump @fluentui/react-checkbox to v9.5.11 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
20
|
+
- Bump @fluentui/react-context-selector to v9.2.12 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
21
|
+
- Bump @fluentui/react-motion-components-preview to v0.14.1 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
22
|
+
- Bump @fluentui/react-motion to v9.11.4 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
23
|
+
- Bump @fluentui/react-radio to v9.5.11 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
24
|
+
- Bump @fluentui/react-shared-contexts to v9.26.0 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
25
|
+
- Bump @fluentui/react-tabster to v9.26.10 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
26
|
+
- Bump @fluentui/react-utilities to v9.25.4 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
27
|
+
- Bump @fluentui/react-jsx-runtime to v9.3.3 ([PR #35462](https://github.com/microsoft/fluentui/pull/35462) by beachball)
|
|
28
|
+
|
|
29
|
+
## [9.15.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.15.5)
|
|
30
|
+
|
|
31
|
+
Thu, 06 Nov 2025 17:24:17 GMT
|
|
32
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.15.4..@fluentui/react-tree_v9.15.5)
|
|
33
|
+
|
|
34
|
+
### Patches
|
|
35
|
+
|
|
36
|
+
- Bump @fluentui/react-motion-components-preview to v0.14.0 ([PR #34705](https://github.com/microsoft/fluentui/pull/34705) by beachball)
|
|
37
|
+
|
|
7
38
|
## [9.15.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.15.4)
|
|
8
39
|
|
|
9
|
-
Thu, 06 Nov 2025
|
|
40
|
+
Thu, 06 Nov 2025 15:01:15 GMT
|
|
10
41
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.15.3..@fluentui/react-tree_v9.15.4)
|
|
11
42
|
|
|
12
43
|
### Patches
|
|
@@ -31,33 +31,41 @@ Tree item ${data.value} not found.`);
|
|
|
31
31
|
}
|
|
32
32
|
return previousCheckedItems;
|
|
33
33
|
}
|
|
34
|
-
|
|
34
|
+
// Calling `ImmutableMap.set()` creates a new ImmutableMap - avoid this in loops.
|
|
35
|
+
// Instead write all updates to a native Map and create a new ImmutableMap at the end.
|
|
36
|
+
// Note that all descendants of the toggled item are processed even if they are collapsed,
|
|
37
|
+
// making the choice of algorithm more important.
|
|
38
|
+
const nextCheckedItemsMap = new Map(ImmutableMap.dangerouslyGetInternalMap(previousCheckedItems));
|
|
39
|
+
// The toggled item itself
|
|
40
|
+
nextCheckedItemsMap.set(data.value, data.checked);
|
|
41
|
+
// Descendant updates
|
|
35
42
|
for (const children of headlessTree.subtree(data.value)){
|
|
36
|
-
|
|
43
|
+
nextCheckedItemsMap.set(children.value, data.checked);
|
|
37
44
|
}
|
|
38
|
-
|
|
45
|
+
// Ancestor updates - must be done after adding descendants and the toggle item.
|
|
46
|
+
// If any ancestor is mixed, all ancestors above it are mixed too.
|
|
39
47
|
let isAncestorsMixed = false;
|
|
40
|
-
for (const
|
|
41
|
-
// if one parent is mixed, all ancestors are mixed
|
|
48
|
+
for (const ancestor of headlessTree.ancestors(treeItem.value)){
|
|
42
49
|
if (isAncestorsMixed) {
|
|
43
|
-
|
|
50
|
+
nextCheckedItemsMap.set(ancestor.value, 'mixed');
|
|
44
51
|
continue;
|
|
45
52
|
}
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
53
|
+
// For each ancestor, if all of its children now have the same checked state as the toggled item,
|
|
54
|
+
// set the ancestor to that checked state too. Otherwise it is 'mixed'.
|
|
55
|
+
let childrenWithSameState = 0;
|
|
56
|
+
for (const child of headlessTree.children(ancestor.value)){
|
|
57
|
+
if ((nextCheckedItemsMap.get(child.value) || false) === data.checked) {
|
|
58
|
+
childrenWithSameState++;
|
|
50
59
|
}
|
|
51
60
|
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
nextCheckedItems = nextCheckedItems.set(parent.value, data.checked);
|
|
61
|
+
if (childrenWithSameState === ancestor.childrenValues.length) {
|
|
62
|
+
nextCheckedItemsMap.set(ancestor.value, data.checked);
|
|
55
63
|
} else {
|
|
56
|
-
|
|
64
|
+
nextCheckedItemsMap.set(ancestor.value, 'mixed');
|
|
57
65
|
isAncestorsMixed = true;
|
|
58
|
-
nextCheckedItems = nextCheckedItems.set(parent.value, 'mixed');
|
|
59
66
|
}
|
|
60
67
|
}
|
|
68
|
+
const nextCheckedItems = ImmutableMap.from(nextCheckedItemsMap);
|
|
61
69
|
return nextCheckedItems;
|
|
62
70
|
}
|
|
63
71
|
function initializeCheckedItems(props, headlessTree) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/FlatTree/useFlatControllableCheckedItems.ts"],"sourcesContent":["'use client';\n\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { TreeItemValue } from '../../TreeItem';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport * as React from 'react';\nimport type { HeadlessTree, HeadlessTreeItemProps } from '../../utils/createHeadlessTree';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nimport type { TreeCheckedChangeData, TreeSelectionValue } from '../Tree/Tree.types';\nimport { HeadlessFlatTreeOptions } from './useHeadlessFlatTree';\n\nexport function useFlatControllableCheckedItems<Props extends HeadlessTreeItemProps>(\n props: Pick<HeadlessFlatTreeOptions, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>,\n headlessTree: HeadlessTree<Props>,\n): [ImmutableMap<TreeItemValue, TreeSelectionValue>, React.Dispatch<ImmutableMap<TreeItemValue, TreeSelectionValue>>] {\n return useControllableState({\n initialState: ImmutableMap.empty,\n state: React.useMemo(\n () => (props.selectionMode ? props.checkedItems && createCheckedItems(props.checkedItems) : undefined),\n [props.checkedItems, props.selectionMode],\n ),\n defaultState: props.defaultCheckedItems ? () => initializeCheckedItems(props, headlessTree) : undefined,\n });\n}\n\nexport function createNextFlatCheckedItems(\n data: Pick<TreeCheckedChangeData, 'value' | 'checked' | 'selectionMode'>,\n previousCheckedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>,\n headlessTree: HeadlessTree<HeadlessTreeItemProps>,\n): ImmutableMap<TreeItemValue, 'mixed' | boolean> {\n if (data.selectionMode === 'single') {\n return ImmutableMap.from([[data.value, data.checked]]);\n }\n const treeItem = headlessTree.get(data.value);\n if (!treeItem) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useHeadlessFlatTree]:\n Tree item ${data.value} not found.\n `);\n }\n return previousCheckedItems;\n }\n
|
|
1
|
+
{"version":3,"sources":["../src/components/FlatTree/useFlatControllableCheckedItems.ts"],"sourcesContent":["'use client';\n\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { TreeItemValue } from '../../TreeItem';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport * as React from 'react';\nimport type { HeadlessTree, HeadlessTreeItemProps } from '../../utils/createHeadlessTree';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nimport type { TreeCheckedChangeData, TreeSelectionValue } from '../Tree/Tree.types';\nimport { HeadlessFlatTreeOptions } from './useHeadlessFlatTree';\n\nexport function useFlatControllableCheckedItems<Props extends HeadlessTreeItemProps>(\n props: Pick<HeadlessFlatTreeOptions, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>,\n headlessTree: HeadlessTree<Props>,\n): [ImmutableMap<TreeItemValue, TreeSelectionValue>, React.Dispatch<ImmutableMap<TreeItemValue, TreeSelectionValue>>] {\n return useControllableState({\n initialState: ImmutableMap.empty,\n state: React.useMemo(\n () => (props.selectionMode ? props.checkedItems && createCheckedItems(props.checkedItems) : undefined),\n [props.checkedItems, props.selectionMode],\n ),\n defaultState: props.defaultCheckedItems ? () => initializeCheckedItems(props, headlessTree) : undefined,\n });\n}\n\nexport function createNextFlatCheckedItems(\n data: Pick<TreeCheckedChangeData, 'value' | 'checked' | 'selectionMode'>,\n previousCheckedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>,\n headlessTree: HeadlessTree<HeadlessTreeItemProps>,\n): ImmutableMap<TreeItemValue, 'mixed' | boolean> {\n if (data.selectionMode === 'single') {\n return ImmutableMap.from([[data.value, data.checked]]);\n }\n\n const treeItem = headlessTree.get(data.value);\n if (!treeItem) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useHeadlessFlatTree]:\n Tree item ${data.value} not found.\n `);\n }\n return previousCheckedItems;\n }\n\n // Calling `ImmutableMap.set()` creates a new ImmutableMap - avoid this in loops.\n // Instead write all updates to a native Map and create a new ImmutableMap at the end.\n // Note that all descendants of the toggled item are processed even if they are collapsed,\n // making the choice of algorithm more important.\n\n const nextCheckedItemsMap = new Map(ImmutableMap.dangerouslyGetInternalMap(previousCheckedItems));\n\n // The toggled item itself\n nextCheckedItemsMap.set(data.value, data.checked);\n\n // Descendant updates\n for (const children of headlessTree.subtree(data.value)) {\n nextCheckedItemsMap.set(children.value, data.checked);\n }\n\n // Ancestor updates - must be done after adding descendants and the toggle item.\n // If any ancestor is mixed, all ancestors above it are mixed too.\n let isAncestorsMixed = false;\n\n for (const ancestor of headlessTree.ancestors(treeItem.value)) {\n if (isAncestorsMixed) {\n nextCheckedItemsMap.set(ancestor.value, 'mixed');\n continue;\n }\n\n // For each ancestor, if all of its children now have the same checked state as the toggled item,\n // set the ancestor to that checked state too. Otherwise it is 'mixed'.\n let childrenWithSameState = 0;\n for (const child of headlessTree.children(ancestor.value)) {\n if ((nextCheckedItemsMap.get(child.value) || false) === data.checked) {\n childrenWithSameState++;\n }\n }\n\n if (childrenWithSameState === ancestor.childrenValues.length) {\n nextCheckedItemsMap.set(ancestor.value, data.checked);\n } else {\n nextCheckedItemsMap.set(ancestor.value, 'mixed');\n isAncestorsMixed = true;\n }\n }\n\n const nextCheckedItems = ImmutableMap.from(nextCheckedItemsMap);\n return nextCheckedItems;\n}\n\nfunction initializeCheckedItems(\n props: Pick<HeadlessFlatTreeOptions, 'selectionMode' | 'defaultCheckedItems'>,\n headlessTree: HeadlessTree<HeadlessTreeItemProps>,\n) {\n if (!props.selectionMode) {\n return ImmutableMap.empty;\n }\n let state = createCheckedItems(props.defaultCheckedItems);\n // if selectionMode is multiselect, we need to calculate the checked state of all children\n // and ancestors of the defaultCheckedItems\n if (props.selectionMode === 'multiselect') {\n for (const [value, checked] of state) {\n state = createNextFlatCheckedItems({ value, checked, selectionMode: props.selectionMode }, state, headlessTree);\n }\n }\n return state;\n}\n"],"names":["useControllableState","ImmutableMap","React","createCheckedItems","useFlatControllableCheckedItems","props","headlessTree","initialState","empty","state","useMemo","selectionMode","checkedItems","undefined","defaultState","defaultCheckedItems","initializeCheckedItems","createNextFlatCheckedItems","data","previousCheckedItems","from","value","checked","treeItem","get","process","env","NODE_ENV","console","error","nextCheckedItemsMap","Map","dangerouslyGetInternalMap","set","children","subtree","isAncestorsMixed","ancestor","ancestors","childrenWithSameState","child","childrenValues","length","nextCheckedItems"],"mappings":"AAAA;AAEA,SAASA,oBAAoB,QAAQ,4BAA4B;AAEjE,SAASC,YAAY,QAAQ,2BAA2B;AACxD,YAAYC,WAAW,QAAQ;AAE/B,SAASC,kBAAkB,QAAQ,iCAAiC;AAIpE,OAAO,SAASC,gCACdC,KAA8F,EAC9FC,YAAiC;IAEjC,OAAON,qBAAqB;QAC1BO,cAAcN,aAAaO,KAAK;QAChCC,OAAOP,MAAMQ,OAAO,CAClB,IAAOL,MAAMM,aAAa,GAAGN,MAAMO,YAAY,IAAIT,mBAAmBE,MAAMO,YAAY,IAAIC,WAC5F;YAACR,MAAMO,YAAY;YAAEP,MAAMM,aAAa;SAAC;QAE3CG,cAAcT,MAAMU,mBAAmB,GAAG,IAAMC,uBAAuBX,OAAOC,gBAAgBO;IAChG;AACF;AAEA,OAAO,SAASI,2BACdC,IAAwE,EACxEC,oBAAoE,EACpEb,YAAiD;IAEjD,IAAIY,KAAKP,aAAa,KAAK,UAAU;QACnC,OAAOV,aAAamB,IAAI,CAAC;YAAC;gBAACF,KAAKG,KAAK;gBAAEH,KAAKI,OAAO;aAAC;SAAC;IACvD;IAEA,MAAMC,WAAWjB,aAAakB,GAAG,CAACN,KAAKG,KAAK;IAC5C,IAAI,CAACE,UAAU;QACb,IAAIE,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;YACzC,sCAAsC;YACtCC,QAAQC,KAAK,CAAsB,CAAC;UAExB,EAAEX,KAAKG,KAAK,CAAC,WACzB,CAAC;QACH;QACA,OAAOF;IACT;IAEA,iFAAiF;IACjF,sFAAsF;IACtF,0FAA0F;IAC1F,iDAAiD;IAEjD,MAAMW,sBAAsB,IAAIC,IAAI9B,aAAa+B,yBAAyB,CAACb;IAE3E,0BAA0B;IAC1BW,oBAAoBG,GAAG,CAACf,KAAKG,KAAK,EAAEH,KAAKI,OAAO;IAEhD,qBAAqB;IACrB,KAAK,MAAMY,YAAY5B,aAAa6B,OAAO,CAACjB,KAAKG,KAAK,EAAG;QACvDS,oBAAoBG,GAAG,CAACC,SAASb,KAAK,EAAEH,KAAKI,OAAO;IACtD;IAEA,gFAAgF;IAChF,kEAAkE;IAClE,IAAIc,mBAAmB;IAEvB,KAAK,MAAMC,YAAY/B,aAAagC,SAAS,CAACf,SAASF,KAAK,EAAG;QAC7D,IAAIe,kBAAkB;YACpBN,oBAAoBG,GAAG,CAACI,SAAShB,KAAK,EAAE;YACxC;QACF;QAEA,iGAAiG;QACjG,uEAAuE;QACvE,IAAIkB,wBAAwB;QAC5B,KAAK,MAAMC,SAASlC,aAAa4B,QAAQ,CAACG,SAAShB,KAAK,EAAG;YACzD,IAAI,AAACS,CAAAA,oBAAoBN,GAAG,CAACgB,MAAMnB,KAAK,KAAK,KAAI,MAAOH,KAAKI,OAAO,EAAE;gBACpEiB;YACF;QACF;QAEA,IAAIA,0BAA0BF,SAASI,cAAc,CAACC,MAAM,EAAE;YAC5DZ,oBAAoBG,GAAG,CAACI,SAAShB,KAAK,EAAEH,KAAKI,OAAO;QACtD,OAAO;YACLQ,oBAAoBG,GAAG,CAACI,SAAShB,KAAK,EAAE;YACxCe,mBAAmB;QACrB;IACF;IAEA,MAAMO,mBAAmB1C,aAAamB,IAAI,CAACU;IAC3C,OAAOa;AACT;AAEA,SAAS3B,uBACPX,KAA6E,EAC7EC,YAAiD;IAEjD,IAAI,CAACD,MAAMM,aAAa,EAAE;QACxB,OAAOV,aAAaO,KAAK;IAC3B;IACA,IAAIC,QAAQN,mBAAmBE,MAAMU,mBAAmB;IACxD,0FAA0F;IAC1F,2CAA2C;IAC3C,IAAIV,MAAMM,aAAa,KAAK,eAAe;QACzC,KAAK,MAAM,CAACU,OAAOC,QAAQ,IAAIb,MAAO;YACpCA,QAAQQ,2BAA2B;gBAAEI;gBAAOC;gBAASX,eAAeN,MAAMM,aAAa;YAAC,GAAGF,OAAOH;QACpG;IACF;IACA,OAAOG;AACT"}
|
|
@@ -147,10 +147,29 @@ function* HeadlessTreeAncestorsGenerator(key, virtualTreeItems) {
|
|
|
147
147
|
*/ // eslint-disable-next-line @typescript-eslint/naming-convention
|
|
148
148
|
function* HeadlessTreeVisibleItemsGenerator(openItems, virtualTreeItems) {
|
|
149
149
|
let index = 0;
|
|
150
|
-
for (const item of
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
150
|
+
for (const item of recursiveVisibleItems(virtualTreeItems.root.value, openItems, virtualTreeItems)){
|
|
151
|
+
item.index = index++;
|
|
152
|
+
yield item;
|
|
153
|
+
}
|
|
154
|
+
}
|
|
155
|
+
function* recursiveVisibleItems(parentValue, openItems, virtualTreeItems) {
|
|
156
|
+
const parent = virtualTreeItems.get(parentValue);
|
|
157
|
+
if (!parent || parent.childrenValues.length === 0) {
|
|
158
|
+
return;
|
|
159
|
+
}
|
|
160
|
+
for (const childValue of parent.childrenValues){
|
|
161
|
+
const child = virtualTreeItems.get(childValue);
|
|
162
|
+
if (!child) {
|
|
163
|
+
continue;
|
|
164
|
+
}
|
|
165
|
+
if (isItemVisible(child, openItems, virtualTreeItems)) {
|
|
166
|
+
yield child;
|
|
167
|
+
// Process children only as long as their parents are open.
|
|
168
|
+
// This makes it possible to have large trees with good performance as
|
|
169
|
+
// long as most branches are not expanded.
|
|
170
|
+
if (openItems.has(childValue)) {
|
|
171
|
+
yield* recursiveVisibleItems(childValue, openItems, virtualTreeItems);
|
|
172
|
+
}
|
|
154
173
|
}
|
|
155
174
|
}
|
|
156
175
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/createHeadlessTree.ts"],"sourcesContent":["import { TreeItemProps, TreeItemType, TreeItemValue } from '../TreeItem';\nimport { ImmutableSet } from './ImmutableSet';\n\nexport type HeadlessTreeItemProps = Omit<TreeItemProps, 'itemType' | 'value'> & {\n value: TreeItemValue;\n itemType?: TreeItemType;\n parentValue?: TreeItemValue;\n};\n\n/**\n * The item that is returned by `createHeadlessTree`, it represents a wrapper around the properties provided to\n * `createHeadlessTree` but with extra information that might be useful on virtual tree scenarios\n */\nexport type HeadlessTreeItem<Props extends HeadlessTreeItemProps> = {\n level: number;\n index: number;\n position: number;\n childrenValues: TreeItemValue[];\n value: TreeItemValue;\n parentValue: TreeItemValue | undefined;\n itemType: TreeItemType;\n getTreeItemProps(): Required<Pick<Props, 'value' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'itemType'>> &\n Props;\n};\n\n/**\n * @internal\n */\nexport type HeadlessTree<Props extends HeadlessTreeItemProps> = {\n /**\n * the number of items in the virtual tree\n */\n readonly size: number;\n /**\n * the root item of the virtual tree\n */\n root: HeadlessTreeItem<HeadlessTreeItemProps>;\n /**\n * method to get a virtual tree item by its value\n * @param key - the key of the item to get\n */\n get(value: TreeItemValue): HeadlessTreeItem<Props> | undefined;\n /**\n * method to check if a virtual tree item exists by its value\n * @param value - the value of the item to check if exists\n */\n has(value: TreeItemValue): boolean;\n /**\n * method to add a new virtual tree item to the virtual tree\n * @param props - the props of the item to add\n */\n add(props: Props): void;\n /**\n * method to remove a virtual tree item from the virtual tree.\n * When an item is removed:\n * 1. all its children are also removed\n * 2. all its siblings are repositioned\n * @param value - the value of the item to remove\n */\n // remove(value: TreeItemValue): void;\n /**\n * method to get the parent of a virtual tree item by its value\n * @param value - the value of the item to get the parent from\n */\n getParent(value: TreeItemValue): HeadlessTreeItem<Props>;\n /**\n * method to get the subtree of a virtual tree item by its value\n * @param value - the value of the item to get the subtree from\n */\n subtree(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the children of a virtual tree item by its value\n * @param value - the value of the item to get the children from\n */\n children(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the visible items of a virtual tree\n * @param openItems - the open items of the tree\n */\n visibleItems(openItems: ImmutableSet<TreeItemValue>): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the ancestors of a virtual tree item by its value\n * @param value - the value of the item to get the ancestors from\n */\n ancestors(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n};\n\n/**\n * creates a list of virtual tree items\n * and provides a map to access each item by id\n */\nexport function createHeadlessTree<Props extends HeadlessTreeItemProps>(\n initialProps: Props[] = [],\n): HeadlessTree<Props> {\n const root = createHeadlessTreeRootItem();\n const itemsPerValue = new Map<TreeItemValue, HeadlessTreeItem<HeadlessTreeItemProps>>([[root.value, root]]);\n\n const headlessTree: HeadlessTree<HeadlessTreeItemProps> = {\n root,\n get size() {\n return itemsPerValue.size;\n },\n getParent: key => itemsPerValue.get(itemsPerValue.get(key)?.parentValue ?? root.value) ?? root,\n get: key => itemsPerValue.get(key),\n has: key => itemsPerValue.has(key),\n add(props) {\n const { parentValue = headlessTreeRootId, ...propsWithoutParentValue } = props;\n const parentItem = itemsPerValue.get(parentValue);\n if (!parentItem) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n TreeItem \"${props.value}\" is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized, parents should come before children\n `);\n }\n return;\n }\n parentItem.itemType = 'branch';\n\n const item: HeadlessTreeItem<HeadlessTreeItemProps> = {\n value: props.value,\n getTreeItemProps: () => ({\n ...propsWithoutParentValue,\n parentValue,\n 'aria-level': item.level,\n 'aria-posinset': item.position,\n 'aria-setsize': parentItem.childrenValues.length,\n itemType: item.itemType,\n }),\n itemType: propsWithoutParentValue.itemType ?? 'leaf',\n level: parentItem.level + 1,\n parentValue,\n childrenValues: [],\n index: -1,\n position: parentItem.childrenValues.push(props.value),\n };\n itemsPerValue.set(item.value, item);\n },\n subtree: key => HeadlessTreeSubtreeGenerator(key, headlessTree),\n children: key => HeadlessTreeChildrenGenerator(key, headlessTree),\n ancestors: key => HeadlessTreeAncestorsGenerator(key, headlessTree),\n visibleItems: openItems => HeadlessTreeVisibleItemsGenerator(openItems, headlessTree),\n };\n\n initialProps.forEach(headlessTree.add);\n\n return headlessTree as HeadlessTree<Props>;\n}\n\nexport const headlessTreeRootId = '__fuiHeadlessTreeRoot';\n\nfunction createHeadlessTreeRootItem(): HeadlessTreeItem<HeadlessTreeItemProps> {\n return {\n parentValue: undefined,\n value: headlessTreeRootId,\n itemType: 'branch',\n getTreeItemProps: () => {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return {\n id: headlessTreeRootId,\n parentValue: undefined,\n value: headlessTreeRootId,\n 'aria-setsize': -1,\n 'aria-level': -1,\n 'aria-posinset': -1,\n itemType: 'branch',\n };\n },\n childrenValues: [],\n get index() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n get position() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n level: 0,\n };\n}\n\n/**\n * Generator that returns all subtree of a given virtual tree item\n * @param key - the key of the item to get the subtree from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeSubtreeGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n yield* HeadlessTreeSubtreeGenerator(childValue, virtualTreeItems);\n }\n}\n\n/**\n * Generator that returns all children of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeChildrenGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n }\n}\n\n/**\n * Generator that returns all ancestors of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeAncestorsGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let parent = virtualTreeItems.getParent(key);\n while (parent !== virtualTreeItems.root) {\n yield parent;\n parent = virtualTreeItems.getParent(parent.value);\n }\n}\n\n/**\n * Generator that returns all visible items of a given virtual tree\n * @param openItems - the open items of the tree\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeVisibleItemsGenerator<Props extends HeadlessTreeItemProps>(\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let index = 0;\n for (const item of HeadlessTreeSubtreeGenerator(virtualTreeItems.root.value, virtualTreeItems)) {\n if (isItemVisible(item, openItems, virtualTreeItems)) {\n item.index = index++;\n yield item;\n }\n }\n}\n\nfunction isItemVisible(\n item: HeadlessTreeItem<HeadlessTreeItemProps>,\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<HeadlessTreeItemProps>,\n) {\n if (item.level === 1) {\n return true;\n }\n while (item.parentValue && item.parentValue !== virtualTreeItems.root.value) {\n if (!openItems.has(item.parentValue)) {\n return false;\n }\n const parent = virtualTreeItems.get(item.parentValue);\n if (!parent) {\n return false;\n }\n item = parent;\n }\n return true;\n}\n"],"names":["createHeadlessTree","initialProps","root","createHeadlessTreeRootItem","itemsPerValue","Map","value","headlessTree","size","getParent","key","get","parentValue","has","add","props","headlessTreeRootId","propsWithoutParentValue","parentItem","process","env","NODE_ENV","console","error","itemType","item","getTreeItemProps","level","position","childrenValues","length","index","push","set","subtree","HeadlessTreeSubtreeGenerator","children","HeadlessTreeChildrenGenerator","ancestors","HeadlessTreeAncestorsGenerator","visibleItems","openItems","HeadlessTreeVisibleItemsGenerator","forEach","undefined","id","virtualTreeItems","childValue","parent","isItemVisible"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/utils/createHeadlessTree.ts"],"sourcesContent":["import { TreeItemProps, TreeItemType, TreeItemValue } from '../TreeItem';\nimport { ImmutableSet } from './ImmutableSet';\n\nexport type HeadlessTreeItemProps = Omit<TreeItemProps, 'itemType' | 'value'> & {\n value: TreeItemValue;\n itemType?: TreeItemType;\n parentValue?: TreeItemValue;\n};\n\n/**\n * The item that is returned by `createHeadlessTree`, it represents a wrapper around the properties provided to\n * `createHeadlessTree` but with extra information that might be useful on virtual tree scenarios\n */\nexport type HeadlessTreeItem<Props extends HeadlessTreeItemProps> = {\n level: number;\n index: number;\n position: number;\n childrenValues: TreeItemValue[];\n value: TreeItemValue;\n parentValue: TreeItemValue | undefined;\n itemType: TreeItemType;\n getTreeItemProps(): Required<Pick<Props, 'value' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'itemType'>> &\n Props;\n};\n\n/**\n * @internal\n */\nexport type HeadlessTree<Props extends HeadlessTreeItemProps> = {\n /**\n * the number of items in the virtual tree\n */\n readonly size: number;\n /**\n * the root item of the virtual tree\n */\n root: HeadlessTreeItem<HeadlessTreeItemProps>;\n /**\n * method to get a virtual tree item by its value\n * @param key - the key of the item to get\n */\n get(value: TreeItemValue): HeadlessTreeItem<Props> | undefined;\n /**\n * method to check if a virtual tree item exists by its value\n * @param value - the value of the item to check if exists\n */\n has(value: TreeItemValue): boolean;\n /**\n * method to add a new virtual tree item to the virtual tree\n * @param props - the props of the item to add\n */\n add(props: Props): void;\n /**\n * method to remove a virtual tree item from the virtual tree.\n * When an item is removed:\n * 1. all its children are also removed\n * 2. all its siblings are repositioned\n * @param value - the value of the item to remove\n */\n // remove(value: TreeItemValue): void;\n /**\n * method to get the parent of a virtual tree item by its value\n * @param value - the value of the item to get the parent from\n */\n getParent(value: TreeItemValue): HeadlessTreeItem<Props>;\n /**\n * method to get the subtree of a virtual tree item by its value\n * @param value - the value of the item to get the subtree from\n */\n subtree(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the children of a virtual tree item by its value\n * @param value - the value of the item to get the children from\n */\n children(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the visible items of a virtual tree\n * @param openItems - the open items of the tree\n */\n visibleItems(openItems: ImmutableSet<TreeItemValue>): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the ancestors of a virtual tree item by its value\n * @param value - the value of the item to get the ancestors from\n */\n ancestors(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n};\n\n/**\n * creates a list of virtual tree items\n * and provides a map to access each item by id\n */\nexport function createHeadlessTree<Props extends HeadlessTreeItemProps>(\n initialProps: Props[] = [],\n): HeadlessTree<Props> {\n const root = createHeadlessTreeRootItem();\n const itemsPerValue = new Map<TreeItemValue, HeadlessTreeItem<HeadlessTreeItemProps>>([[root.value, root]]);\n\n const headlessTree: HeadlessTree<HeadlessTreeItemProps> = {\n root,\n get size() {\n return itemsPerValue.size;\n },\n getParent: key => itemsPerValue.get(itemsPerValue.get(key)?.parentValue ?? root.value) ?? root,\n get: key => itemsPerValue.get(key),\n has: key => itemsPerValue.has(key),\n add(props) {\n const { parentValue = headlessTreeRootId, ...propsWithoutParentValue } = props;\n const parentItem = itemsPerValue.get(parentValue);\n if (!parentItem) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n TreeItem \"${props.value}\" is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized, parents should come before children\n `);\n }\n return;\n }\n parentItem.itemType = 'branch';\n\n const item: HeadlessTreeItem<HeadlessTreeItemProps> = {\n value: props.value,\n getTreeItemProps: () => ({\n ...propsWithoutParentValue,\n parentValue,\n 'aria-level': item.level,\n 'aria-posinset': item.position,\n 'aria-setsize': parentItem.childrenValues.length,\n itemType: item.itemType,\n }),\n itemType: propsWithoutParentValue.itemType ?? 'leaf',\n level: parentItem.level + 1,\n parentValue,\n childrenValues: [],\n index: -1,\n position: parentItem.childrenValues.push(props.value),\n };\n itemsPerValue.set(item.value, item);\n },\n subtree: key => HeadlessTreeSubtreeGenerator(key, headlessTree),\n children: key => HeadlessTreeChildrenGenerator(key, headlessTree),\n ancestors: key => HeadlessTreeAncestorsGenerator(key, headlessTree),\n visibleItems: openItems => HeadlessTreeVisibleItemsGenerator(openItems, headlessTree),\n };\n\n initialProps.forEach(headlessTree.add);\n\n return headlessTree as HeadlessTree<Props>;\n}\n\nexport const headlessTreeRootId = '__fuiHeadlessTreeRoot';\n\nfunction createHeadlessTreeRootItem(): HeadlessTreeItem<HeadlessTreeItemProps> {\n return {\n parentValue: undefined,\n value: headlessTreeRootId,\n itemType: 'branch',\n getTreeItemProps: () => {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return {\n id: headlessTreeRootId,\n parentValue: undefined,\n value: headlessTreeRootId,\n 'aria-setsize': -1,\n 'aria-level': -1,\n 'aria-posinset': -1,\n itemType: 'branch',\n };\n },\n childrenValues: [],\n get index() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n get position() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n level: 0,\n };\n}\n\n/**\n * Generator that returns all subtree of a given virtual tree item\n * @param key - the key of the item to get the subtree from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeSubtreeGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n yield* HeadlessTreeSubtreeGenerator(childValue, virtualTreeItems);\n }\n}\n\n/**\n * Generator that returns all children of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeChildrenGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n }\n}\n\n/**\n * Generator that returns all ancestors of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeAncestorsGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let parent = virtualTreeItems.getParent(key);\n while (parent !== virtualTreeItems.root) {\n yield parent;\n parent = virtualTreeItems.getParent(parent.value);\n }\n}\n\n/**\n * Generator that returns all visible items of a given virtual tree\n * @param openItems - the open items of the tree\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeVisibleItemsGenerator<Props extends HeadlessTreeItemProps>(\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let index = 0;\n for (const item of recursiveVisibleItems(virtualTreeItems.root.value, openItems, virtualTreeItems)) {\n item.index = index++;\n yield item;\n }\n}\n\nfunction* recursiveVisibleItems<Props extends HeadlessTreeItemProps>(\n parentValue: TreeItemValue,\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const parent = virtualTreeItems.get(parentValue);\n if (!parent || parent.childrenValues.length === 0) {\n return;\n }\n\n for (const childValue of parent.childrenValues) {\n const child = virtualTreeItems.get(childValue);\n if (!child) {\n continue;\n }\n\n if (isItemVisible(child, openItems, virtualTreeItems)) {\n yield child;\n\n // Process children only as long as their parents are open.\n // This makes it possible to have large trees with good performance as\n // long as most branches are not expanded.\n if (openItems.has(childValue)) {\n yield* recursiveVisibleItems(childValue, openItems, virtualTreeItems);\n }\n }\n }\n}\n\nfunction isItemVisible(\n item: HeadlessTreeItem<HeadlessTreeItemProps>,\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<HeadlessTreeItemProps>,\n) {\n if (item.level === 1) {\n return true;\n }\n while (item.parentValue && item.parentValue !== virtualTreeItems.root.value) {\n if (!openItems.has(item.parentValue)) {\n return false;\n }\n const parent = virtualTreeItems.get(item.parentValue);\n if (!parent) {\n return false;\n }\n item = parent;\n }\n return true;\n}\n"],"names":["createHeadlessTree","initialProps","root","createHeadlessTreeRootItem","itemsPerValue","Map","value","headlessTree","size","getParent","key","get","parentValue","has","add","props","headlessTreeRootId","propsWithoutParentValue","parentItem","process","env","NODE_ENV","console","error","itemType","item","getTreeItemProps","level","position","childrenValues","length","index","push","set","subtree","HeadlessTreeSubtreeGenerator","children","HeadlessTreeChildrenGenerator","ancestors","HeadlessTreeAncestorsGenerator","visibleItems","openItems","HeadlessTreeVisibleItemsGenerator","forEach","undefined","id","virtualTreeItems","childValue","parent","recursiveVisibleItems","child","isItemVisible"],"mappings":"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"}
|
|
@@ -50,33 +50,41 @@ Tree item ${data.value} not found.`);
|
|
|
50
50
|
}
|
|
51
51
|
return previousCheckedItems;
|
|
52
52
|
}
|
|
53
|
-
|
|
53
|
+
// Calling `ImmutableMap.set()` creates a new ImmutableMap - avoid this in loops.
|
|
54
|
+
// Instead write all updates to a native Map and create a new ImmutableMap at the end.
|
|
55
|
+
// Note that all descendants of the toggled item are processed even if they are collapsed,
|
|
56
|
+
// making the choice of algorithm more important.
|
|
57
|
+
const nextCheckedItemsMap = new Map(_ImmutableMap.ImmutableMap.dangerouslyGetInternalMap(previousCheckedItems));
|
|
58
|
+
// The toggled item itself
|
|
59
|
+
nextCheckedItemsMap.set(data.value, data.checked);
|
|
60
|
+
// Descendant updates
|
|
54
61
|
for (const children of headlessTree.subtree(data.value)){
|
|
55
|
-
|
|
62
|
+
nextCheckedItemsMap.set(children.value, data.checked);
|
|
56
63
|
}
|
|
57
|
-
|
|
64
|
+
// Ancestor updates - must be done after adding descendants and the toggle item.
|
|
65
|
+
// If any ancestor is mixed, all ancestors above it are mixed too.
|
|
58
66
|
let isAncestorsMixed = false;
|
|
59
|
-
for (const
|
|
60
|
-
// if one parent is mixed, all ancestors are mixed
|
|
67
|
+
for (const ancestor of headlessTree.ancestors(treeItem.value)){
|
|
61
68
|
if (isAncestorsMixed) {
|
|
62
|
-
|
|
69
|
+
nextCheckedItemsMap.set(ancestor.value, 'mixed');
|
|
63
70
|
continue;
|
|
64
71
|
}
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
72
|
+
// For each ancestor, if all of its children now have the same checked state as the toggled item,
|
|
73
|
+
// set the ancestor to that checked state too. Otherwise it is 'mixed'.
|
|
74
|
+
let childrenWithSameState = 0;
|
|
75
|
+
for (const child of headlessTree.children(ancestor.value)){
|
|
76
|
+
if ((nextCheckedItemsMap.get(child.value) || false) === data.checked) {
|
|
77
|
+
childrenWithSameState++;
|
|
69
78
|
}
|
|
70
79
|
}
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
nextCheckedItems = nextCheckedItems.set(parent.value, data.checked);
|
|
80
|
+
if (childrenWithSameState === ancestor.childrenValues.length) {
|
|
81
|
+
nextCheckedItemsMap.set(ancestor.value, data.checked);
|
|
74
82
|
} else {
|
|
75
|
-
|
|
83
|
+
nextCheckedItemsMap.set(ancestor.value, 'mixed');
|
|
76
84
|
isAncestorsMixed = true;
|
|
77
|
-
nextCheckedItems = nextCheckedItems.set(parent.value, 'mixed');
|
|
78
85
|
}
|
|
79
86
|
}
|
|
87
|
+
const nextCheckedItems = _ImmutableMap.ImmutableMap.from(nextCheckedItemsMap);
|
|
80
88
|
return nextCheckedItems;
|
|
81
89
|
}
|
|
82
90
|
function initializeCheckedItems(props, headlessTree) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/FlatTree/useFlatControllableCheckedItems.ts"],"sourcesContent":["'use client';\n\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { TreeItemValue } from '../../TreeItem';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport * as React from 'react';\nimport type { HeadlessTree, HeadlessTreeItemProps } from '../../utils/createHeadlessTree';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nimport type { TreeCheckedChangeData, TreeSelectionValue } from '../Tree/Tree.types';\nimport { HeadlessFlatTreeOptions } from './useHeadlessFlatTree';\n\nexport function useFlatControllableCheckedItems<Props extends HeadlessTreeItemProps>(\n props: Pick<HeadlessFlatTreeOptions, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>,\n headlessTree: HeadlessTree<Props>,\n): [ImmutableMap<TreeItemValue, TreeSelectionValue>, React.Dispatch<ImmutableMap<TreeItemValue, TreeSelectionValue>>] {\n return useControllableState({\n initialState: ImmutableMap.empty,\n state: React.useMemo(\n () => (props.selectionMode ? props.checkedItems && createCheckedItems(props.checkedItems) : undefined),\n [props.checkedItems, props.selectionMode],\n ),\n defaultState: props.defaultCheckedItems ? () => initializeCheckedItems(props, headlessTree) : undefined,\n });\n}\n\nexport function createNextFlatCheckedItems(\n data: Pick<TreeCheckedChangeData, 'value' | 'checked' | 'selectionMode'>,\n previousCheckedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>,\n headlessTree: HeadlessTree<HeadlessTreeItemProps>,\n): ImmutableMap<TreeItemValue, 'mixed' | boolean> {\n if (data.selectionMode === 'single') {\n return ImmutableMap.from([[data.value, data.checked]]);\n }\n const treeItem = headlessTree.get(data.value);\n if (!treeItem) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useHeadlessFlatTree]:\n Tree item ${data.value} not found.\n `);\n }\n return previousCheckedItems;\n }\n
|
|
1
|
+
{"version":3,"sources":["../src/components/FlatTree/useFlatControllableCheckedItems.ts"],"sourcesContent":["'use client';\n\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { TreeItemValue } from '../../TreeItem';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\nimport * as React from 'react';\nimport type { HeadlessTree, HeadlessTreeItemProps } from '../../utils/createHeadlessTree';\nimport { createCheckedItems } from '../../utils/createCheckedItems';\nimport type { TreeCheckedChangeData, TreeSelectionValue } from '../Tree/Tree.types';\nimport { HeadlessFlatTreeOptions } from './useHeadlessFlatTree';\n\nexport function useFlatControllableCheckedItems<Props extends HeadlessTreeItemProps>(\n props: Pick<HeadlessFlatTreeOptions, 'checkedItems' | 'defaultCheckedItems' | 'selectionMode'>,\n headlessTree: HeadlessTree<Props>,\n): [ImmutableMap<TreeItemValue, TreeSelectionValue>, React.Dispatch<ImmutableMap<TreeItemValue, TreeSelectionValue>>] {\n return useControllableState({\n initialState: ImmutableMap.empty,\n state: React.useMemo(\n () => (props.selectionMode ? props.checkedItems && createCheckedItems(props.checkedItems) : undefined),\n [props.checkedItems, props.selectionMode],\n ),\n defaultState: props.defaultCheckedItems ? () => initializeCheckedItems(props, headlessTree) : undefined,\n });\n}\n\nexport function createNextFlatCheckedItems(\n data: Pick<TreeCheckedChangeData, 'value' | 'checked' | 'selectionMode'>,\n previousCheckedItems: ImmutableMap<TreeItemValue, 'mixed' | boolean>,\n headlessTree: HeadlessTree<HeadlessTreeItemProps>,\n): ImmutableMap<TreeItemValue, 'mixed' | boolean> {\n if (data.selectionMode === 'single') {\n return ImmutableMap.from([[data.value, data.checked]]);\n }\n\n const treeItem = headlessTree.get(data.value);\n if (!treeItem) {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useHeadlessFlatTree]:\n Tree item ${data.value} not found.\n `);\n }\n return previousCheckedItems;\n }\n\n // Calling `ImmutableMap.set()` creates a new ImmutableMap - avoid this in loops.\n // Instead write all updates to a native Map and create a new ImmutableMap at the end.\n // Note that all descendants of the toggled item are processed even if they are collapsed,\n // making the choice of algorithm more important.\n\n const nextCheckedItemsMap = new Map(ImmutableMap.dangerouslyGetInternalMap(previousCheckedItems));\n\n // The toggled item itself\n nextCheckedItemsMap.set(data.value, data.checked);\n\n // Descendant updates\n for (const children of headlessTree.subtree(data.value)) {\n nextCheckedItemsMap.set(children.value, data.checked);\n }\n\n // Ancestor updates - must be done after adding descendants and the toggle item.\n // If any ancestor is mixed, all ancestors above it are mixed too.\n let isAncestorsMixed = false;\n\n for (const ancestor of headlessTree.ancestors(treeItem.value)) {\n if (isAncestorsMixed) {\n nextCheckedItemsMap.set(ancestor.value, 'mixed');\n continue;\n }\n\n // For each ancestor, if all of its children now have the same checked state as the toggled item,\n // set the ancestor to that checked state too. Otherwise it is 'mixed'.\n let childrenWithSameState = 0;\n for (const child of headlessTree.children(ancestor.value)) {\n if ((nextCheckedItemsMap.get(child.value) || false) === data.checked) {\n childrenWithSameState++;\n }\n }\n\n if (childrenWithSameState === ancestor.childrenValues.length) {\n nextCheckedItemsMap.set(ancestor.value, data.checked);\n } else {\n nextCheckedItemsMap.set(ancestor.value, 'mixed');\n isAncestorsMixed = true;\n }\n }\n\n const nextCheckedItems = ImmutableMap.from(nextCheckedItemsMap);\n return nextCheckedItems;\n}\n\nfunction initializeCheckedItems(\n props: Pick<HeadlessFlatTreeOptions, 'selectionMode' | 'defaultCheckedItems'>,\n headlessTree: HeadlessTree<HeadlessTreeItemProps>,\n) {\n if (!props.selectionMode) {\n return ImmutableMap.empty;\n }\n let state = createCheckedItems(props.defaultCheckedItems);\n // if selectionMode is multiselect, we need to calculate the checked state of all children\n // and ancestors of the defaultCheckedItems\n if (props.selectionMode === 'multiselect') {\n for (const [value, checked] of state) {\n state = createNextFlatCheckedItems({ value, checked, selectionMode: props.selectionMode }, state, headlessTree);\n }\n }\n return state;\n}\n"],"names":["useControllableState","ImmutableMap","React","createCheckedItems","useFlatControllableCheckedItems","props","headlessTree","initialState","empty","state","useMemo","selectionMode","checkedItems","undefined","defaultState","defaultCheckedItems","initializeCheckedItems","createNextFlatCheckedItems","data","previousCheckedItems","from","value","checked","treeItem","get","process","env","NODE_ENV","console","error","nextCheckedItemsMap","Map","dangerouslyGetInternalMap","set","children","subtree","isAncestorsMixed","ancestor","ancestors","childrenWithSameState","child","childrenValues","length","nextCheckedItems"],"mappings":"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"}
|
|
@@ -165,10 +165,29 @@ function* HeadlessTreeAncestorsGenerator(key, virtualTreeItems) {
|
|
|
165
165
|
*/ // eslint-disable-next-line @typescript-eslint/naming-convention
|
|
166
166
|
function* HeadlessTreeVisibleItemsGenerator(openItems, virtualTreeItems) {
|
|
167
167
|
let index = 0;
|
|
168
|
-
for (const item of
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
168
|
+
for (const item of recursiveVisibleItems(virtualTreeItems.root.value, openItems, virtualTreeItems)){
|
|
169
|
+
item.index = index++;
|
|
170
|
+
yield item;
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
function* recursiveVisibleItems(parentValue, openItems, virtualTreeItems) {
|
|
174
|
+
const parent = virtualTreeItems.get(parentValue);
|
|
175
|
+
if (!parent || parent.childrenValues.length === 0) {
|
|
176
|
+
return;
|
|
177
|
+
}
|
|
178
|
+
for (const childValue of parent.childrenValues){
|
|
179
|
+
const child = virtualTreeItems.get(childValue);
|
|
180
|
+
if (!child) {
|
|
181
|
+
continue;
|
|
182
|
+
}
|
|
183
|
+
if (isItemVisible(child, openItems, virtualTreeItems)) {
|
|
184
|
+
yield child;
|
|
185
|
+
// Process children only as long as their parents are open.
|
|
186
|
+
// This makes it possible to have large trees with good performance as
|
|
187
|
+
// long as most branches are not expanded.
|
|
188
|
+
if (openItems.has(childValue)) {
|
|
189
|
+
yield* recursiveVisibleItems(childValue, openItems, virtualTreeItems);
|
|
190
|
+
}
|
|
172
191
|
}
|
|
173
192
|
}
|
|
174
193
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/createHeadlessTree.ts"],"sourcesContent":["import { TreeItemProps, TreeItemType, TreeItemValue } from '../TreeItem';\nimport { ImmutableSet } from './ImmutableSet';\n\nexport type HeadlessTreeItemProps = Omit<TreeItemProps, 'itemType' | 'value'> & {\n value: TreeItemValue;\n itemType?: TreeItemType;\n parentValue?: TreeItemValue;\n};\n\n/**\n * The item that is returned by `createHeadlessTree`, it represents a wrapper around the properties provided to\n * `createHeadlessTree` but with extra information that might be useful on virtual tree scenarios\n */\nexport type HeadlessTreeItem<Props extends HeadlessTreeItemProps> = {\n level: number;\n index: number;\n position: number;\n childrenValues: TreeItemValue[];\n value: TreeItemValue;\n parentValue: TreeItemValue | undefined;\n itemType: TreeItemType;\n getTreeItemProps(): Required<Pick<Props, 'value' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'itemType'>> &\n Props;\n};\n\n/**\n * @internal\n */\nexport type HeadlessTree<Props extends HeadlessTreeItemProps> = {\n /**\n * the number of items in the virtual tree\n */\n readonly size: number;\n /**\n * the root item of the virtual tree\n */\n root: HeadlessTreeItem<HeadlessTreeItemProps>;\n /**\n * method to get a virtual tree item by its value\n * @param key - the key of the item to get\n */\n get(value: TreeItemValue): HeadlessTreeItem<Props> | undefined;\n /**\n * method to check if a virtual tree item exists by its value\n * @param value - the value of the item to check if exists\n */\n has(value: TreeItemValue): boolean;\n /**\n * method to add a new virtual tree item to the virtual tree\n * @param props - the props of the item to add\n */\n add(props: Props): void;\n /**\n * method to remove a virtual tree item from the virtual tree.\n * When an item is removed:\n * 1. all its children are also removed\n * 2. all its siblings are repositioned\n * @param value - the value of the item to remove\n */\n // remove(value: TreeItemValue): void;\n /**\n * method to get the parent of a virtual tree item by its value\n * @param value - the value of the item to get the parent from\n */\n getParent(value: TreeItemValue): HeadlessTreeItem<Props>;\n /**\n * method to get the subtree of a virtual tree item by its value\n * @param value - the value of the item to get the subtree from\n */\n subtree(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the children of a virtual tree item by its value\n * @param value - the value of the item to get the children from\n */\n children(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the visible items of a virtual tree\n * @param openItems - the open items of the tree\n */\n visibleItems(openItems: ImmutableSet<TreeItemValue>): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the ancestors of a virtual tree item by its value\n * @param value - the value of the item to get the ancestors from\n */\n ancestors(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n};\n\n/**\n * creates a list of virtual tree items\n * and provides a map to access each item by id\n */\nexport function createHeadlessTree<Props extends HeadlessTreeItemProps>(\n initialProps: Props[] = [],\n): HeadlessTree<Props> {\n const root = createHeadlessTreeRootItem();\n const itemsPerValue = new Map<TreeItemValue, HeadlessTreeItem<HeadlessTreeItemProps>>([[root.value, root]]);\n\n const headlessTree: HeadlessTree<HeadlessTreeItemProps> = {\n root,\n get size() {\n return itemsPerValue.size;\n },\n getParent: key => itemsPerValue.get(itemsPerValue.get(key)?.parentValue ?? root.value) ?? root,\n get: key => itemsPerValue.get(key),\n has: key => itemsPerValue.has(key),\n add(props) {\n const { parentValue = headlessTreeRootId, ...propsWithoutParentValue } = props;\n const parentItem = itemsPerValue.get(parentValue);\n if (!parentItem) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n TreeItem \"${props.value}\" is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized, parents should come before children\n `);\n }\n return;\n }\n parentItem.itemType = 'branch';\n\n const item: HeadlessTreeItem<HeadlessTreeItemProps> = {\n value: props.value,\n getTreeItemProps: () => ({\n ...propsWithoutParentValue,\n parentValue,\n 'aria-level': item.level,\n 'aria-posinset': item.position,\n 'aria-setsize': parentItem.childrenValues.length,\n itemType: item.itemType,\n }),\n itemType: propsWithoutParentValue.itemType ?? 'leaf',\n level: parentItem.level + 1,\n parentValue,\n childrenValues: [],\n index: -1,\n position: parentItem.childrenValues.push(props.value),\n };\n itemsPerValue.set(item.value, item);\n },\n subtree: key => HeadlessTreeSubtreeGenerator(key, headlessTree),\n children: key => HeadlessTreeChildrenGenerator(key, headlessTree),\n ancestors: key => HeadlessTreeAncestorsGenerator(key, headlessTree),\n visibleItems: openItems => HeadlessTreeVisibleItemsGenerator(openItems, headlessTree),\n };\n\n initialProps.forEach(headlessTree.add);\n\n return headlessTree as HeadlessTree<Props>;\n}\n\nexport const headlessTreeRootId = '__fuiHeadlessTreeRoot';\n\nfunction createHeadlessTreeRootItem(): HeadlessTreeItem<HeadlessTreeItemProps> {\n return {\n parentValue: undefined,\n value: headlessTreeRootId,\n itemType: 'branch',\n getTreeItemProps: () => {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return {\n id: headlessTreeRootId,\n parentValue: undefined,\n value: headlessTreeRootId,\n 'aria-setsize': -1,\n 'aria-level': -1,\n 'aria-posinset': -1,\n itemType: 'branch',\n };\n },\n childrenValues: [],\n get index() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n get position() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n level: 0,\n };\n}\n\n/**\n * Generator that returns all subtree of a given virtual tree item\n * @param key - the key of the item to get the subtree from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeSubtreeGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n yield* HeadlessTreeSubtreeGenerator(childValue, virtualTreeItems);\n }\n}\n\n/**\n * Generator that returns all children of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeChildrenGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n }\n}\n\n/**\n * Generator that returns all ancestors of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeAncestorsGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let parent = virtualTreeItems.getParent(key);\n while (parent !== virtualTreeItems.root) {\n yield parent;\n parent = virtualTreeItems.getParent(parent.value);\n }\n}\n\n/**\n * Generator that returns all visible items of a given virtual tree\n * @param openItems - the open items of the tree\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeVisibleItemsGenerator<Props extends HeadlessTreeItemProps>(\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let index = 0;\n for (const item of HeadlessTreeSubtreeGenerator(virtualTreeItems.root.value, virtualTreeItems)) {\n if (isItemVisible(item, openItems, virtualTreeItems)) {\n item.index = index++;\n yield item;\n }\n }\n}\n\nfunction isItemVisible(\n item: HeadlessTreeItem<HeadlessTreeItemProps>,\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<HeadlessTreeItemProps>,\n) {\n if (item.level === 1) {\n return true;\n }\n while (item.parentValue && item.parentValue !== virtualTreeItems.root.value) {\n if (!openItems.has(item.parentValue)) {\n return false;\n }\n const parent = virtualTreeItems.get(item.parentValue);\n if (!parent) {\n return false;\n }\n item = parent;\n }\n return true;\n}\n"],"names":["createHeadlessTree","initialProps","root","createHeadlessTreeRootItem","itemsPerValue","Map","value","headlessTree","size","getParent","key","get","parentValue","has","add","props","headlessTreeRootId","propsWithoutParentValue","parentItem","process","env","NODE_ENV","console","error","itemType","item","getTreeItemProps","level","position","childrenValues","length","index","push","set","subtree","HeadlessTreeSubtreeGenerator","children","HeadlessTreeChildrenGenerator","ancestors","HeadlessTreeAncestorsGenerator","visibleItems","openItems","HeadlessTreeVisibleItemsGenerator","forEach","undefined","id","virtualTreeItems","childValue","parent","isItemVisible"],"mappings":"AAuFA;;;CAGC,GACD;;;;;;;;;;;IAAgBA,kBAAAA;;;sBA2DHgB;eAAAA;;;AA3DN,4BACLf,eAAwB,EAAE;IAE1B,MAAMC,OAAOC;IACb,MAAMC,gBAAgB,IAAIC,IAA4D;QAAC;YAACH,KAAKI,KAAK;YAAEJ;SAAK;KAAC;IAE1G,MAAMK,eAAoD;QACxDL;QACA,IAAIM,QAAO;YACT,OAAOJ,cAAcI,IAAI;QAC3B;QACAC,WAAWC,CAAAA;gBAAyBN;gBAAAA,gCAAlBA;mBAAAA,CAAAA,sBAAAA,cAAcO,GAAG,CAACP,CAAAA,iCAAAA,CAAAA,qBAAAA,cAAcO,GAAG,CAACD,IAAAA,MAAAA,QAAlBN,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAwBQ,WAAW,AAAXA,MAAW,QAAnCR,mCAAAA,KAAAA,IAAAA,iCAAuCF,KAAKI,MAAK,MAAA,QAAnEF,wBAAAA,KAAAA,IAAAA,sBAAwEF;;QAC1FS,KAAKD,CAAAA,MAAON,cAAcO,GAAG,CAACD;QAC9BG,KAAKH,CAAAA,MAAON,cAAcS,GAAG,CAACH;QAC9BI,KAAIC,KAAK;YACP,MAAM,EAAEH,cAAcI,kBAAkB,EAAE,GAAGC,yBAAyB,GAAGF;YACzE,MAAMG,aAAad,cAAcO,GAAG,CAACC;YACrC,IAAI,CAACM,YAAY;gBACf,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;oBAC1C,sCAAsC;oBACtCC,QAAQC,KAAK,CAAsB,CAAC;UAExB,EAAER,MAAMT,KAAK,CAAC,kJAC1B,CAAC;gBACH;gBACA;YACF;YACAY,WAAWM,QAAQ,GAAG;gBAYVP;YAVZ,MAAMQ,OAAgD;gBACpDnB,OAAOS,MAAMT,KAAK;gBAClBoB,kBAAkB,IAAO,CAAA;wBACvB,GAAGT,uBAAuB;wBAC1BL;wBACA,cAAca,KAAKE,KAAK;wBACxB,iBAAiBF,KAAKG,QAAQ;wBAC9B,gBAAgBV,WAAWW,cAAc,CAACC,MAAM;wBAChDN,UAAUC,KAAKD,QAAQ;qBACzB,CAAA;gBACAA,UAAUP,CAAAA,oCAAAA,wBAAwBO,QAAAA,AAAQ,MAAA,QAAhCP,sCAAAA,KAAAA,IAAAA,oCAAoC;gBAC9CU,OAAOT,WAAWS,KAAK,GAAG;gBAC1Bf;gBACAiB,gBAAgB,EAAE;gBAClBE,OAAO,CAAC;gBACRH,UAAUV,WAAWW,cAAc,CAACG,IAAI,CAACjB,MAAMT,KAAK;YACtD;YACAF,cAAc6B,GAAG,CAACR,KAAKnB,KAAK,EAAEmB;QAChC;QACAS,SAASxB,CAAAA,MAAOyB,6BAA6BzB,KAAKH;QAClD6B,UAAU1B,CAAAA,MAAO2B,8BAA8B3B,KAAKH;QACpD+B,WAAW5B,CAAAA,MAAO6B,+BAA+B7B,KAAKH;QACtDiC,cAAcC,CAAAA,YAAaC,kCAAkCD,WAAWlC;IAC1E;IAEAN,aAAa0C,OAAO,CAACpC,aAAaO,GAAG;IAErC,OAAOP;AACT;AAEO,2BAA2B,wBAAwB;AAE1D,SAASJ;IACP,OAAO;QACLS,aAAagC;QACbtC,OAAOU;QACPQ,UAAU;QACVE,kBAAkB;YAChB,IAAIP,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;gBACzC,sCAAsC;gBACtCC,QAAQC,KAAK,CAAsB,CAAC;yEAGpC,CAAC;YACH;YACA,OAAO;gBACLsB,IAAI7B;gBACJJ,aAAagC;gBACbtC,OAAOU;gBACP,gBAAgB,CAAC;gBACjB,cAAc,CAAC;gBACf,iBAAiB,CAAC;gBAClBQ,UAAU;YACZ;QACF;QACAK,gBAAgB,EAAE;QAClB,IAAIE,SAAQ;YACV,IAAIZ,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;gBACzC,sCAAsC;gBACtCC,QAAQC,KAAK,CAAsB,CAAC;yEAGpC,CAAC;YACH;YACA,OAAO,CAAC;QACV;QACA,IAAIK,YAAW;YACb,IAAIT,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;gBACzC,sCAAsC;gBACtCC,QAAQC,KAAK,CAAsB,CAAC;yEAGpC,CAAC;YACH;YACA,OAAO,CAAC;QACV;QACAI,OAAO;IACT;AACF;AAEA;;;CAGC,GACD,gEAAgE;AAChE,UAAUQ,6BACRzB,GAAkB,EAClBoC,gBAAqC;IAErC,MAAMrB,OAAOqB,iBAAiBnC,GAAG,CAACD;IAClC,IAAI,CAACe,QAAQA,KAAKI,cAAc,CAACC,MAAM,KAAK,GAAG;QAC7C;IACF;IACA,KAAK,MAAMiB,cAActB,KAAKI,cAAc,CAAE;QAC5C,MAAMiB,iBAAiBnC,GAAG,CAACoC;QAC3B,OAAOZ,6BAA6BY,YAAYD;IAClD;AACF;AAEA;;;CAGC,GACD,gEAAgE;AAChE,UAAUT,8BACR3B,GAAkB,EAClBoC,gBAAqC;IAErC,MAAMrB,OAAOqB,iBAAiBnC,GAAG,CAACD;IAClC,IAAI,CAACe,QAAQA,KAAKI,cAAc,CAACC,MAAM,KAAK,GAAG;QAC7C;IACF;IACA,KAAK,MAAMiB,cAActB,KAAKI,cAAc,CAAE;QAC5C,MAAMiB,iBAAiBnC,GAAG,CAACoC;IAC7B;AACF;AAEA;;;CAGC,GACD,gEAAgE;AAChE,UAAUR,+BACR7B,GAAkB,EAClBoC,gBAAqC;IAErC,IAAIE,SAASF,iBAAiBrC,SAAS,CAACC;IACxC,MAAOsC,WAAWF,iBAAiB5C,IAAI,CAAE;QACvC,MAAM8C;QACNA,SAASF,iBAAiBrC,SAAS,CAACuC,OAAO1C,KAAK;IAClD;AACF;AAEA;;;CAGC,GACD,gEAAgE;AAChE,UAAUoC,kCACRD,SAAsC,EACtCK,gBAAqC;IAErC,IAAIf,QAAQ;IACZ,KAAK,MAAMN,QAAQU,6BAA6BW,iBAAiB5C,IAAI,CAACI,KAAK,EAAEwC,kBAAmB;QAC9F,IAAIG,cAAcxB,MAAMgB,WAAWK,mBAAmB;YACpDrB,KAAKM,KAAK,GAAGA;YACb,MAAMN;QACR;IACF;AACF;AAEA,SAASwB,cACPxB,IAA6C,EAC7CgB,SAAsC,EACtCK,gBAAqD;IAErD,IAAIrB,KAAKE,KAAK,KAAK,GAAG;QACpB,OAAO;IACT;IACA,MAAOF,KAAKb,WAAW,IAAIa,KAAKb,WAAW,KAAKkC,iBAAiB5C,IAAI,CAACI,KAAK,CAAE;QAC3E,IAAI,CAACmC,UAAU5B,GAAG,CAACY,KAAKb,WAAW,GAAG;YACpC,OAAO;QACT;QACA,MAAMoC,SAASF,iBAAiBnC,GAAG,CAACc,KAAKb,WAAW;QACpD,IAAI,CAACoC,QAAQ;YACX,OAAO;QACT;QACAvB,OAAOuB;IACT;IACA,OAAO;AACT"}
|
|
1
|
+
{"version":3,"sources":["../src/utils/createHeadlessTree.ts"],"sourcesContent":["import { TreeItemProps, TreeItemType, TreeItemValue } from '../TreeItem';\nimport { ImmutableSet } from './ImmutableSet';\n\nexport type HeadlessTreeItemProps = Omit<TreeItemProps, 'itemType' | 'value'> & {\n value: TreeItemValue;\n itemType?: TreeItemType;\n parentValue?: TreeItemValue;\n};\n\n/**\n * The item that is returned by `createHeadlessTree`, it represents a wrapper around the properties provided to\n * `createHeadlessTree` but with extra information that might be useful on virtual tree scenarios\n */\nexport type HeadlessTreeItem<Props extends HeadlessTreeItemProps> = {\n level: number;\n index: number;\n position: number;\n childrenValues: TreeItemValue[];\n value: TreeItemValue;\n parentValue: TreeItemValue | undefined;\n itemType: TreeItemType;\n getTreeItemProps(): Required<Pick<Props, 'value' | 'aria-setsize' | 'aria-level' | 'aria-posinset' | 'itemType'>> &\n Props;\n};\n\n/**\n * @internal\n */\nexport type HeadlessTree<Props extends HeadlessTreeItemProps> = {\n /**\n * the number of items in the virtual tree\n */\n readonly size: number;\n /**\n * the root item of the virtual tree\n */\n root: HeadlessTreeItem<HeadlessTreeItemProps>;\n /**\n * method to get a virtual tree item by its value\n * @param key - the key of the item to get\n */\n get(value: TreeItemValue): HeadlessTreeItem<Props> | undefined;\n /**\n * method to check if a virtual tree item exists by its value\n * @param value - the value of the item to check if exists\n */\n has(value: TreeItemValue): boolean;\n /**\n * method to add a new virtual tree item to the virtual tree\n * @param props - the props of the item to add\n */\n add(props: Props): void;\n /**\n * method to remove a virtual tree item from the virtual tree.\n * When an item is removed:\n * 1. all its children are also removed\n * 2. all its siblings are repositioned\n * @param value - the value of the item to remove\n */\n // remove(value: TreeItemValue): void;\n /**\n * method to get the parent of a virtual tree item by its value\n * @param value - the value of the item to get the parent from\n */\n getParent(value: TreeItemValue): HeadlessTreeItem<Props>;\n /**\n * method to get the subtree of a virtual tree item by its value\n * @param value - the value of the item to get the subtree from\n */\n subtree(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the children of a virtual tree item by its value\n * @param value - the value of the item to get the children from\n */\n children(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the visible items of a virtual tree\n * @param openItems - the open items of the tree\n */\n visibleItems(openItems: ImmutableSet<TreeItemValue>): IterableIterator<HeadlessTreeItem<Props>>;\n /**\n * method to get the ancestors of a virtual tree item by its value\n * @param value - the value of the item to get the ancestors from\n */\n ancestors(value: TreeItemValue): IterableIterator<HeadlessTreeItem<Props>>;\n};\n\n/**\n * creates a list of virtual tree items\n * and provides a map to access each item by id\n */\nexport function createHeadlessTree<Props extends HeadlessTreeItemProps>(\n initialProps: Props[] = [],\n): HeadlessTree<Props> {\n const root = createHeadlessTreeRootItem();\n const itemsPerValue = new Map<TreeItemValue, HeadlessTreeItem<HeadlessTreeItemProps>>([[root.value, root]]);\n\n const headlessTree: HeadlessTree<HeadlessTreeItemProps> = {\n root,\n get size() {\n return itemsPerValue.size;\n },\n getParent: key => itemsPerValue.get(itemsPerValue.get(key)?.parentValue ?? root.value) ?? root,\n get: key => itemsPerValue.get(key),\n has: key => itemsPerValue.has(key),\n add(props) {\n const { parentValue = headlessTreeRootId, ...propsWithoutParentValue } = props;\n const parentItem = itemsPerValue.get(parentValue);\n if (!parentItem) {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n TreeItem \"${props.value}\" is wrongly positioned, did you properly ordered provided item props? make sure provided items are organized, parents should come before children\n `);\n }\n return;\n }\n parentItem.itemType = 'branch';\n\n const item: HeadlessTreeItem<HeadlessTreeItemProps> = {\n value: props.value,\n getTreeItemProps: () => ({\n ...propsWithoutParentValue,\n parentValue,\n 'aria-level': item.level,\n 'aria-posinset': item.position,\n 'aria-setsize': parentItem.childrenValues.length,\n itemType: item.itemType,\n }),\n itemType: propsWithoutParentValue.itemType ?? 'leaf',\n level: parentItem.level + 1,\n parentValue,\n childrenValues: [],\n index: -1,\n position: parentItem.childrenValues.push(props.value),\n };\n itemsPerValue.set(item.value, item);\n },\n subtree: key => HeadlessTreeSubtreeGenerator(key, headlessTree),\n children: key => HeadlessTreeChildrenGenerator(key, headlessTree),\n ancestors: key => HeadlessTreeAncestorsGenerator(key, headlessTree),\n visibleItems: openItems => HeadlessTreeVisibleItemsGenerator(openItems, headlessTree),\n };\n\n initialProps.forEach(headlessTree.add);\n\n return headlessTree as HeadlessTree<Props>;\n}\n\nexport const headlessTreeRootId = '__fuiHeadlessTreeRoot';\n\nfunction createHeadlessTreeRootItem(): HeadlessTreeItem<HeadlessTreeItemProps> {\n return {\n parentValue: undefined,\n value: headlessTreeRootId,\n itemType: 'branch',\n getTreeItemProps: () => {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return {\n id: headlessTreeRootId,\n parentValue: undefined,\n value: headlessTreeRootId,\n 'aria-setsize': -1,\n 'aria-level': -1,\n 'aria-posinset': -1,\n itemType: 'branch',\n };\n },\n childrenValues: [],\n get index() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n get position() {\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [createHeadlessTree]:\n Internal error, trying to access treeitem props from invalid root element\n `);\n }\n return -1;\n },\n level: 0,\n };\n}\n\n/**\n * Generator that returns all subtree of a given virtual tree item\n * @param key - the key of the item to get the subtree from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeSubtreeGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n yield* HeadlessTreeSubtreeGenerator(childValue, virtualTreeItems);\n }\n}\n\n/**\n * Generator that returns all children of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeChildrenGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const item = virtualTreeItems.get(key);\n if (!item || item.childrenValues.length === 0) {\n return;\n }\n for (const childValue of item.childrenValues) {\n yield virtualTreeItems.get(childValue)!;\n }\n}\n\n/**\n * Generator that returns all ancestors of a given virtual tree item\n * @param key - the key of the item to get the children from\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeAncestorsGenerator<Props extends HeadlessTreeItemProps>(\n key: TreeItemValue,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let parent = virtualTreeItems.getParent(key);\n while (parent !== virtualTreeItems.root) {\n yield parent;\n parent = virtualTreeItems.getParent(parent.value);\n }\n}\n\n/**\n * Generator that returns all visible items of a given virtual tree\n * @param openItems - the open items of the tree\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nfunction* HeadlessTreeVisibleItemsGenerator<Props extends HeadlessTreeItemProps>(\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n let index = 0;\n for (const item of recursiveVisibleItems(virtualTreeItems.root.value, openItems, virtualTreeItems)) {\n item.index = index++;\n yield item;\n }\n}\n\nfunction* recursiveVisibleItems<Props extends HeadlessTreeItemProps>(\n parentValue: TreeItemValue,\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<Props>,\n): Generator<HeadlessTreeItem<Props>, void, void> {\n const parent = virtualTreeItems.get(parentValue);\n if (!parent || parent.childrenValues.length === 0) {\n return;\n }\n\n for (const childValue of parent.childrenValues) {\n const child = virtualTreeItems.get(childValue);\n if (!child) {\n continue;\n }\n\n if (isItemVisible(child, openItems, virtualTreeItems)) {\n yield child;\n\n // Process children only as long as their parents are open.\n // This makes it possible to have large trees with good performance as\n // long as most branches are not expanded.\n if (openItems.has(childValue)) {\n yield* recursiveVisibleItems(childValue, openItems, virtualTreeItems);\n }\n }\n }\n}\n\nfunction isItemVisible(\n item: HeadlessTreeItem<HeadlessTreeItemProps>,\n openItems: ImmutableSet<TreeItemValue>,\n virtualTreeItems: HeadlessTree<HeadlessTreeItemProps>,\n) {\n if (item.level === 1) {\n return true;\n }\n while (item.parentValue && item.parentValue !== virtualTreeItems.root.value) {\n if (!openItems.has(item.parentValue)) {\n return false;\n }\n const parent = virtualTreeItems.get(item.parentValue);\n if (!parent) {\n return false;\n }\n item = parent;\n }\n return true;\n}\n"],"names":["createHeadlessTree","initialProps","root","createHeadlessTreeRootItem","itemsPerValue","Map","value","headlessTree","size","getParent","key","get","parentValue","has","add","props","headlessTreeRootId","propsWithoutParentValue","parentItem","process","env","NODE_ENV","console","error","itemType","item","getTreeItemProps","level","position","childrenValues","length","index","push","set","subtree","HeadlessTreeSubtreeGenerator","children","HeadlessTreeChildrenGenerator","ancestors","HeadlessTreeAncestorsGenerator","visibleItems","openItems","HeadlessTreeVisibleItemsGenerator","forEach","undefined","id","virtualTreeItems","childValue","parent","recursiveVisibleItems","child","isItemVisible"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-tree",
|
|
3
|
-
"version": "9.15.
|
|
3
|
+
"version": "9.15.6",
|
|
4
4
|
"description": "Tree component for Fluent UI React",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -21,21 +21,21 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@fluentui/keyboard-keys": "^9.0.8",
|
|
24
|
-
"@fluentui/react-aria": "^9.17.
|
|
25
|
-
"@fluentui/react-avatar": "^9.9.
|
|
26
|
-
"@fluentui/react-button": "^9.6.
|
|
27
|
-
"@fluentui/react-checkbox": "^9.5.
|
|
28
|
-
"@fluentui/react-context-selector": "^9.2.
|
|
24
|
+
"@fluentui/react-aria": "^9.17.6",
|
|
25
|
+
"@fluentui/react-avatar": "^9.9.12",
|
|
26
|
+
"@fluentui/react-button": "^9.6.12",
|
|
27
|
+
"@fluentui/react-checkbox": "^9.5.11",
|
|
28
|
+
"@fluentui/react-context-selector": "^9.2.12",
|
|
29
29
|
"@fluentui/react-icons": "^2.0.245",
|
|
30
|
-
"@fluentui/react-motion-components-preview": "^0.
|
|
31
|
-
"@fluentui/react-motion": "^9.11.
|
|
32
|
-
"@fluentui/react-radio": "^9.5.
|
|
33
|
-
"@fluentui/react-shared-contexts": "^9.
|
|
34
|
-
"@fluentui/react-tabster": "^9.26.
|
|
30
|
+
"@fluentui/react-motion-components-preview": "^0.14.1",
|
|
31
|
+
"@fluentui/react-motion": "^9.11.4",
|
|
32
|
+
"@fluentui/react-radio": "^9.5.11",
|
|
33
|
+
"@fluentui/react-shared-contexts": "^9.26.0",
|
|
34
|
+
"@fluentui/react-tabster": "^9.26.10",
|
|
35
35
|
"@fluentui/react-theme": "^9.2.0",
|
|
36
|
-
"@fluentui/react-utilities": "^9.25.
|
|
37
|
-
"@fluentui/react-jsx-runtime": "^9.3.
|
|
38
|
-
"@griffel/react": "^1.5.
|
|
36
|
+
"@fluentui/react-utilities": "^9.25.4",
|
|
37
|
+
"@fluentui/react-jsx-runtime": "^9.3.3",
|
|
38
|
+
"@griffel/react": "^1.5.32",
|
|
39
39
|
"@swc/helpers": "^0.5.1"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|