@fluentui/react-tree 9.3.1 → 9.4.1
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.json +139 -1
- package/CHANGELOG.md +38 -2
- package/dist/index.d.ts +36 -18
- package/lib/components/FlatTree/FlatTree.types.js.map +1 -1
- package/lib/components/FlatTree/renderFlatTree.js.map +1 -1
- package/lib/components/FlatTree/useFlatTree.js +16 -2
- package/lib/components/FlatTree/useFlatTree.js.map +1 -1
- package/lib/components/FlatTree/useFlatTreeContextValues.js +20 -2
- package/lib/components/FlatTree/useFlatTreeContextValues.js.map +1 -1
- package/lib/components/FlatTree/useFlatTreeStyles.styles.js +4 -12
- package/lib/components/FlatTree/useFlatTreeStyles.styles.js.map +1 -1
- package/lib/components/Tree/Tree.types.js.map +1 -1
- package/lib/components/Tree/renderTree.js +1 -1
- package/lib/components/Tree/renderTree.js.map +1 -1
- package/lib/components/Tree/useTree.js +4 -7
- package/lib/components/Tree/useTree.js.map +1 -1
- package/lib/components/Tree/useTreeContextValues.js +29 -15
- package/lib/components/Tree/useTreeContextValues.js.map +1 -1
- package/lib/components/Tree/useTreeStyles.styles.js +5 -8
- package/lib/components/Tree/useTreeStyles.styles.js.map +1 -1
- package/lib/components/TreeItem/useTreeItem.js +2 -2
- package/lib/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib/components/TreeItem/useTreeItemStyles.styles.js +10 -50
- package/lib/components/TreeItem/useTreeItemStyles.styles.js.map +1 -1
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +23 -117
- package/lib/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -1
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js +24 -141
- package/lib/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -1
- package/lib/components/TreeProvider.js +21 -0
- package/lib/components/TreeProvider.js.map +1 -0
- package/lib/contexts/index.js +1 -0
- package/lib/contexts/index.js.map +1 -1
- package/lib/contexts/subtreeContext.js +14 -0
- package/lib/contexts/subtreeContext.js.map +1 -0
- package/lib/contexts/treeContext.js +9 -5
- package/lib/contexts/treeContext.js.map +1 -1
- package/lib/hooks/useRootTree.js +1 -0
- package/lib/hooks/useRootTree.js.map +1 -1
- package/lib/hooks/useSubtree.js +2 -14
- package/lib/hooks/useSubtree.js.map +1 -1
- package/lib/index.js +2 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/FlatTree/useFlatTree.js +16 -2
- package/lib-commonjs/components/FlatTree/useFlatTree.js.map +1 -1
- package/lib-commonjs/components/FlatTree/useFlatTreeContextValues.js +20 -2
- package/lib-commonjs/components/FlatTree/useFlatTreeContextValues.js.map +1 -1
- package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.js +5 -15
- package/lib-commonjs/components/FlatTree/useFlatTreeStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Tree/renderTree.js +2 -2
- package/lib-commonjs/components/Tree/renderTree.js.map +1 -1
- package/lib-commonjs/components/Tree/useTree.js +4 -7
- package/lib-commonjs/components/Tree/useTree.js.map +1 -1
- package/lib-commonjs/components/Tree/useTreeContextValues.js +30 -15
- package/lib-commonjs/components/Tree/useTreeContextValues.js.map +1 -1
- package/lib-commonjs/components/Tree/useTreeStyles.styles.js +5 -9
- package/lib-commonjs/components/Tree/useTreeStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItem.js +8 -8
- package/lib-commonjs/components/TreeItem/useTreeItem.js.map +1 -1
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js +15 -134
- package/lib-commonjs/components/TreeItem/useTreeItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js +43 -232
- package/lib-commonjs/components/TreeItemLayout/useTreeItemLayoutStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js +46 -281
- package/lib-commonjs/components/TreeItemPersonaLayout/useTreeItemPersonaLayoutStyles.styles.js.map +1 -1
- package/lib-commonjs/components/TreeProvider.js +32 -0
- package/lib-commonjs/components/TreeProvider.js.map +1 -0
- package/lib-commonjs/contexts/index.js +1 -0
- package/lib-commonjs/contexts/index.js.map +1 -1
- package/lib-commonjs/contexts/subtreeContext.js +31 -0
- package/lib-commonjs/contexts/subtreeContext.js.map +1 -0
- package/lib-commonjs/contexts/treeContext.js +6 -7
- package/lib-commonjs/contexts/treeContext.js.map +1 -1
- package/lib-commonjs/hooks/useRootTree.js +1 -0
- package/lib-commonjs/hooks/useRootTree.js.map +1 -1
- package/lib-commonjs/hooks/useSubtree.js +2 -14
- package/lib-commonjs/hooks/useSubtree.js.map +1 -1
- package/lib-commonjs/index.js +7 -3
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +12 -12
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,145 @@
|
|
|
2
2
|
"name": "@fluentui/react-tree",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Wed, 04 Oct 2023 08:41:54 GMT",
|
|
6
|
+
"tag": "@fluentui/react-tree_v9.4.1",
|
|
7
|
+
"version": "9.4.1",
|
|
8
|
+
"comments": {
|
|
9
|
+
"patch": [
|
|
10
|
+
{
|
|
11
|
+
"author": "bernardo.sunderhus@gmail.com",
|
|
12
|
+
"package": "@fluentui/react-tree",
|
|
13
|
+
"commit": "eb4533eee19eba7b7177e9938e5c5fd642f0e691",
|
|
14
|
+
"comment": "chore: replace makeStyles with makeResetStyles"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "bernardo.sunderhus@gmail.com",
|
|
18
|
+
"package": "@fluentui/react-tree",
|
|
19
|
+
"commit": "3b210c90f667620c54a8b85b99bf33888afa1f57",
|
|
20
|
+
"comment": "chore: delegate focus outline to layout components"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui/react-tree",
|
|
25
|
+
"comment": "Bump @fluentui/react-aria to v9.3.39",
|
|
26
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"author": "beachball",
|
|
30
|
+
"package": "@fluentui/react-tree",
|
|
31
|
+
"comment": "Bump @fluentui/react-avatar to v9.5.36",
|
|
32
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"author": "beachball",
|
|
36
|
+
"package": "@fluentui/react-tree",
|
|
37
|
+
"comment": "Bump @fluentui/react-button to v9.3.45",
|
|
38
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"author": "beachball",
|
|
42
|
+
"package": "@fluentui/react-tree",
|
|
43
|
+
"comment": "Bump @fluentui/react-checkbox to v9.1.46",
|
|
44
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"author": "beachball",
|
|
48
|
+
"package": "@fluentui/react-tree",
|
|
49
|
+
"comment": "Bump @fluentui/react-context-selector to v9.1.37",
|
|
50
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
"author": "beachball",
|
|
54
|
+
"package": "@fluentui/react-tree",
|
|
55
|
+
"comment": "Bump @fluentui/react-portal to v9.3.20",
|
|
56
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"author": "beachball",
|
|
60
|
+
"package": "@fluentui/react-tree",
|
|
61
|
+
"comment": "Bump @fluentui/react-radio to v9.1.46",
|
|
62
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
"author": "beachball",
|
|
66
|
+
"package": "@fluentui/react-tree",
|
|
67
|
+
"comment": "Bump @fluentui/react-tabster to v9.13.3",
|
|
68
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
69
|
+
},
|
|
70
|
+
{
|
|
71
|
+
"author": "beachball",
|
|
72
|
+
"package": "@fluentui/react-tree",
|
|
73
|
+
"comment": "Bump @fluentui/react-utilities to v9.14.0",
|
|
74
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"author": "beachball",
|
|
78
|
+
"package": "@fluentui/react-tree",
|
|
79
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.13",
|
|
80
|
+
"commit": "67b6cc6534e684ed32704dc6c0faee632bb840dc"
|
|
81
|
+
}
|
|
82
|
+
]
|
|
83
|
+
}
|
|
84
|
+
},
|
|
85
|
+
{
|
|
86
|
+
"date": "Mon, 02 Oct 2023 08:56:05 GMT",
|
|
87
|
+
"tag": "@fluentui/react-tree_v9.4.0",
|
|
88
|
+
"version": "9.4.0",
|
|
89
|
+
"comments": {
|
|
90
|
+
"minor": [
|
|
91
|
+
{
|
|
92
|
+
"author": "bernardo.sunderhus@gmail.com",
|
|
93
|
+
"package": "@fluentui/react-tree",
|
|
94
|
+
"commit": "b7c4075ba6978c8435ce9942f6f04179a2f3be33",
|
|
95
|
+
"comment": "feat: creates SubtreeContext"
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
"author": "beachball",
|
|
99
|
+
"package": "@fluentui/react-tree",
|
|
100
|
+
"comment": "Bump @fluentui/react-avatar to v9.5.35",
|
|
101
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
102
|
+
},
|
|
103
|
+
{
|
|
104
|
+
"author": "beachball",
|
|
105
|
+
"package": "@fluentui/react-tree",
|
|
106
|
+
"comment": "Bump @fluentui/react-button to v9.3.44",
|
|
107
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
108
|
+
},
|
|
109
|
+
{
|
|
110
|
+
"author": "beachball",
|
|
111
|
+
"package": "@fluentui/react-tree",
|
|
112
|
+
"comment": "Bump @fluentui/react-checkbox to v9.1.45",
|
|
113
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
114
|
+
},
|
|
115
|
+
{
|
|
116
|
+
"author": "beachball",
|
|
117
|
+
"package": "@fluentui/react-tree",
|
|
118
|
+
"comment": "Bump @fluentui/react-portal to v9.3.19",
|
|
119
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
120
|
+
},
|
|
121
|
+
{
|
|
122
|
+
"author": "beachball",
|
|
123
|
+
"package": "@fluentui/react-tree",
|
|
124
|
+
"comment": "Bump @fluentui/react-radio to v9.1.45",
|
|
125
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
"author": "beachball",
|
|
129
|
+
"package": "@fluentui/react-tree",
|
|
130
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.9.2",
|
|
131
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
132
|
+
},
|
|
133
|
+
{
|
|
134
|
+
"author": "beachball",
|
|
135
|
+
"package": "@fluentui/react-tree",
|
|
136
|
+
"comment": "Bump @fluentui/react-tabster to v9.13.2",
|
|
137
|
+
"commit": "da9a08817e5de95639e2dd7aa6d6709d47faa7f4"
|
|
138
|
+
}
|
|
139
|
+
]
|
|
140
|
+
}
|
|
141
|
+
},
|
|
142
|
+
{
|
|
143
|
+
"date": "Tue, 26 Sep 2023 17:49:14 GMT",
|
|
6
144
|
"tag": "@fluentui/react-tree_v9.3.1",
|
|
7
145
|
"version": "9.3.1",
|
|
8
146
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,48 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-tree
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 04 Oct 2023 08:41:54 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.1)
|
|
8
|
+
|
|
9
|
+
Wed, 04 Oct 2023 08:41:54 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.4.0..@fluentui/react-tree_v9.4.1)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- chore: replace makeStyles with makeResetStyles ([PR #29338](https://github.com/microsoft/fluentui/pull/29338) by bernardo.sunderhus@gmail.com)
|
|
15
|
+
- chore: delegate focus outline to layout components ([PR #29293](https://github.com/microsoft/fluentui/pull/29293) by bernardo.sunderhus@gmail.com)
|
|
16
|
+
- Bump @fluentui/react-aria to v9.3.39 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
17
|
+
- Bump @fluentui/react-avatar to v9.5.36 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
18
|
+
- Bump @fluentui/react-button to v9.3.45 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
19
|
+
- Bump @fluentui/react-checkbox to v9.1.46 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
20
|
+
- Bump @fluentui/react-context-selector to v9.1.37 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
21
|
+
- Bump @fluentui/react-portal to v9.3.20 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
22
|
+
- Bump @fluentui/react-radio to v9.1.46 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
23
|
+
- Bump @fluentui/react-tabster to v9.13.3 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
24
|
+
- Bump @fluentui/react-utilities to v9.14.0 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
25
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.13 ([commit](https://github.com/microsoft/fluentui/commit/67b6cc6534e684ed32704dc6c0faee632bb840dc) by beachball)
|
|
26
|
+
|
|
27
|
+
## [9.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.4.0)
|
|
28
|
+
|
|
29
|
+
Mon, 02 Oct 2023 08:56:05 GMT
|
|
30
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.3.1..@fluentui/react-tree_v9.4.0)
|
|
31
|
+
|
|
32
|
+
### Minor changes
|
|
33
|
+
|
|
34
|
+
- feat: creates SubtreeContext ([PR #29194](https://github.com/microsoft/fluentui/pull/29194) by bernardo.sunderhus@gmail.com)
|
|
35
|
+
- Bump @fluentui/react-avatar to v9.5.35 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
36
|
+
- Bump @fluentui/react-button to v9.3.44 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
37
|
+
- Bump @fluentui/react-checkbox to v9.1.45 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
38
|
+
- Bump @fluentui/react-portal to v9.3.19 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
39
|
+
- Bump @fluentui/react-radio to v9.1.45 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
40
|
+
- Bump @fluentui/react-shared-contexts to v9.9.2 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
41
|
+
- Bump @fluentui/react-tabster to v9.13.2 ([PR #29301](https://github.com/microsoft/fluentui/pull/29301) by beachball)
|
|
42
|
+
|
|
7
43
|
## [9.3.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-tree_v9.3.1)
|
|
8
44
|
|
|
9
|
-
Tue, 26 Sep 2023 17:
|
|
45
|
+
Tue, 26 Sep 2023 17:49:14 GMT
|
|
10
46
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-tree_v9.3.0..@fluentui/react-tree_v9.3.1)
|
|
11
47
|
|
|
12
48
|
### Patches
|
package/dist/index.d.ts
CHANGED
|
@@ -15,11 +15,8 @@ import { ContextSelector } from '@fluentui/react-context-selector';
|
|
|
15
15
|
import type { End } from '@fluentui/keyboard-keys';
|
|
16
16
|
import type { Enter } from '@fluentui/keyboard-keys';
|
|
17
17
|
import type { ExtractSlotProps } from '@fluentui/react-utilities';
|
|
18
|
-
import { FC } from 'react';
|
|
19
18
|
import { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
20
19
|
import type { Home } from '@fluentui/keyboard-keys';
|
|
21
|
-
import { Provider } from 'react';
|
|
22
|
-
import { ProviderProps } from 'react';
|
|
23
20
|
import { Radio } from '@fluentui/react-radio';
|
|
24
21
|
import { RadioProps } from '@fluentui/react-radio';
|
|
25
22
|
import * as React_2 from 'react';
|
|
@@ -106,7 +103,11 @@ export declare type FlattenTreeItem<Props extends TreeItemProps> = Omit<Props, '
|
|
|
106
103
|
*/
|
|
107
104
|
export declare const FlatTree: ForwardRefComponent<FlatTreeProps>;
|
|
108
105
|
|
|
109
|
-
export declare const flatTreeClassNames: SlotClassNames<
|
|
106
|
+
export declare const flatTreeClassNames: SlotClassNames<FlatTreeSlots>;
|
|
107
|
+
|
|
108
|
+
declare type FlatTreeContextValues = {
|
|
109
|
+
tree: TreeContextValue;
|
|
110
|
+
};
|
|
110
111
|
|
|
111
112
|
/**
|
|
112
113
|
* The `FlatTreeItem` component represents a single item in a flat tree.
|
|
@@ -188,6 +189,12 @@ export declare type FlatTreeProps = ComponentProps<TreeSlots> & {
|
|
|
188
189
|
onCheckedChange?(event: TreeCheckedChangeEvent, data: TreeCheckedChangeData): void;
|
|
189
190
|
};
|
|
190
191
|
|
|
192
|
+
export declare type FlatTreeSlots = TreeSlots;
|
|
193
|
+
|
|
194
|
+
export declare type FlatTreeState = ComponentState<FlatTreeSlots> & TreeContextValue & {
|
|
195
|
+
open: boolean;
|
|
196
|
+
};
|
|
197
|
+
|
|
191
198
|
/**
|
|
192
199
|
* FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems
|
|
193
200
|
* in multiple scenarios including virtualization.
|
|
@@ -361,9 +368,13 @@ declare function isImmutableSet<Value>(value: unknown): value is ImmutableSet<Va
|
|
|
361
368
|
|
|
362
369
|
declare type MultiSelectValue = NonNullable<CheckboxProps['checked']>;
|
|
363
370
|
|
|
371
|
+
/**
|
|
372
|
+
* helper type that avoids the expansion of unions while inferring it,
|
|
373
|
+
* should work exactly the same as Omit
|
|
374
|
+
*/
|
|
364
375
|
declare type OmitWithoutExpanding<P, K extends string | number | symbol> = P extends unknown ? Omit<P, K> : P;
|
|
365
376
|
|
|
366
|
-
export declare const renderFlatTree_unstable: (state:
|
|
377
|
+
export declare const renderFlatTree_unstable: (state: FlatTreeState, contextValues: FlatTreeContextValues) => JSX.Element;
|
|
367
378
|
|
|
368
379
|
export declare const renderTree_unstable: (state: TreeState, contextValues: TreeContextValues) => JSX.Element;
|
|
369
380
|
|
|
@@ -384,6 +395,11 @@ export declare const renderTreeItemPersonaLayout_unstable: (state: TreeItemPerso
|
|
|
384
395
|
|
|
385
396
|
declare type SingleSelectValue = NonNullable<RadioProps['checked']>;
|
|
386
397
|
|
|
398
|
+
export declare type SubtreeContextValue = {
|
|
399
|
+
contextType: 'subtree';
|
|
400
|
+
level: number;
|
|
401
|
+
};
|
|
402
|
+
|
|
387
403
|
/**
|
|
388
404
|
* The `Tree` component renders nested items in a hierarchical structure.
|
|
389
405
|
* Use it with `TreeItem` component and layouts components `TreeItemLayout` or `TreeItemPersonaLayout`.
|
|
@@ -409,8 +425,9 @@ export declare type TreeCheckedChangeEvent = TreeCheckedChangeData['event'];
|
|
|
409
425
|
export declare const treeClassNames: SlotClassNames<TreeSlots>;
|
|
410
426
|
|
|
411
427
|
export declare type TreeContextValue = {
|
|
412
|
-
|
|
428
|
+
contextType?: 'root';
|
|
413
429
|
level: number;
|
|
430
|
+
treeType: 'nested' | 'flat';
|
|
414
431
|
selectionMode: 'none' | SelectionMode_2;
|
|
415
432
|
appearance: 'subtle' | 'subtle-alpha' | 'transparent';
|
|
416
433
|
size: 'small' | 'medium';
|
|
@@ -423,7 +440,7 @@ export declare type TreeContextValue = {
|
|
|
423
440
|
};
|
|
424
441
|
|
|
425
442
|
export declare type TreeContextValues = {
|
|
426
|
-
tree: TreeContextValue;
|
|
443
|
+
tree: TreeContextValue | SubtreeContextValue;
|
|
427
444
|
};
|
|
428
445
|
|
|
429
446
|
/**
|
|
@@ -780,30 +797,29 @@ export declare type TreeProps = ComponentProps<TreeSlots> & {
|
|
|
780
797
|
onCheckedChange?(event: TreeCheckedChangeEvent, data: TreeCheckedChangeData): void;
|
|
781
798
|
};
|
|
782
799
|
|
|
783
|
-
export declare const TreeProvider:
|
|
800
|
+
export declare const TreeProvider: {
|
|
801
|
+
(props: React_2.ProviderProps<TreeContextValue | SubtreeContextValue>): JSX.Element;
|
|
802
|
+
displayName: string;
|
|
803
|
+
};
|
|
784
804
|
|
|
785
805
|
export declare type TreeSelectionValue = MultiSelectValue | SingleSelectValue;
|
|
786
806
|
|
|
787
|
-
declare type TreeSlots = {
|
|
807
|
+
export declare type TreeSlots = {
|
|
788
808
|
root: Slot<'div'>;
|
|
789
809
|
};
|
|
790
|
-
export { TreeSlots as FlatTreeSlots }
|
|
791
|
-
export { TreeSlots }
|
|
792
810
|
|
|
793
811
|
/**
|
|
794
812
|
* State used in rendering Tree
|
|
795
813
|
*/
|
|
796
|
-
declare type TreeState = ComponentState<TreeSlots> &
|
|
814
|
+
export declare type TreeState = ComponentState<TreeSlots> & {
|
|
797
815
|
open: boolean;
|
|
798
|
-
};
|
|
799
|
-
export { TreeState as FlatTreeState }
|
|
800
|
-
export { TreeState }
|
|
816
|
+
} & (TreeContextValue | SubtreeContextValue);
|
|
801
817
|
|
|
802
|
-
export declare const useFlatTree_unstable: (props: FlatTreeProps, ref: React_2.Ref<HTMLElement>) =>
|
|
818
|
+
export declare const useFlatTree_unstable: (props: FlatTreeProps, ref: React_2.Ref<HTMLElement>) => FlatTreeState;
|
|
803
819
|
|
|
804
|
-
export declare const useFlatTreeContextValues_unstable: (state:
|
|
820
|
+
export declare const useFlatTreeContextValues_unstable: (state: FlatTreeState) => FlatTreeContextValues;
|
|
805
821
|
|
|
806
|
-
export declare const useFlatTreeStyles_unstable: (state:
|
|
822
|
+
export declare const useFlatTreeStyles_unstable: (state: FlatTreeState) => FlatTreeState;
|
|
807
823
|
|
|
808
824
|
/**
|
|
809
825
|
* this hook provides FlatTree API to manage all required mechanisms to convert a list of items into renderable TreeItems
|
|
@@ -819,6 +835,8 @@ export declare const useFlatTreeStyles_unstable: (state: TreeState) => TreeState
|
|
|
819
835
|
*/
|
|
820
836
|
export declare function useHeadlessFlatTree_unstable<Props extends HeadlessTreeItemProps>(props: Props[], options?: HeadlessFlatTreeOptions): HeadlessFlatTree<Props>;
|
|
821
837
|
|
|
838
|
+
export declare const useSubtreeContext_unstable: () => SubtreeContextValue;
|
|
839
|
+
|
|
822
840
|
export declare const useTree_unstable: (props: TreeProps, ref: React_2.Ref<HTMLElement>) => TreeState;
|
|
823
841
|
|
|
824
842
|
export declare const useTreeContext_unstable: <T>(selector: ContextSelector<TreeContextValue, T>) => T;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["FlatTree.types.ts"],"sourcesContent":["import type { ComponentProps, SelectionMode } from '@fluentui/react-utilities';\nimport type {\n TreeSlots,\n
|
|
1
|
+
{"version":3,"sources":["FlatTree.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, SelectionMode } from '@fluentui/react-utilities';\nimport type {\n TreeSlots,\n TreeCheckedChangeData,\n TreeCheckedChangeEvent,\n TreeNavigationData_unstable,\n TreeNavigationEvent_unstable,\n TreeOpenChangeData,\n TreeOpenChangeEvent,\n TreeSelectionValue,\n} from '../Tree/index';\nimport type { TreeItemValue } from '../TreeItem/index';\nimport type { TreeContextValue } from '../../contexts';\n\nexport type FlatTreeSlots = TreeSlots;\n\nexport type FlatTreeContextValues = {\n tree: TreeContextValue;\n};\n\nexport type FlatTreeProps = ComponentProps<TreeSlots> & {\n /**\n * A tree item can have various appearances:\n * - 'subtle' (default): The default tree item styles.\n * - 'subtle-alpha': Minimizes emphasis on hovered or focused states.\n * - 'transparent': Removes background color.\n * @default 'subtle'\n */\n appearance?: 'subtle' | 'subtle-alpha' | 'transparent';\n /**\n * Size of the tree item.\n * @default 'medium'\n */\n size?: 'small' | 'medium';\n /**\n * This refers to a list of ids of opened tree items.\n * Controls the state of the open tree items.\n * These property is ignored for subtrees.\n */\n openItems?: Iterable<TreeItemValue>;\n /**\n * Callback fired when the component changes value from open state.\n * These property is ignored for subtrees.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event.\n */\n onOpenChange?(event: TreeOpenChangeEvent, data: TreeOpenChangeData): void;\n\n /**\n * Callback fired when navigation happens inside the component.\n * These property is ignored for subtrees.\n *\n * FIXME: This method is not ideal, as navigation should be handled internally by tabster.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n */\n onNavigation?(event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable): void;\n\n /**\n * This refers to the selection mode of the tree.\n * - undefined: No selection can be done.\n * - 'single': Only one tree item can be selected, radio buttons are rendered.\n * - 'multiselect': Multiple tree items can be selected, checkboxes are rendered.\n *\n * @default undefined\n */\n selectionMode?: SelectionMode;\n /**\n * This refers to a list of ids of checked tree items, or a list of tuples of ids and checked state.\n * Controls the state of the checked tree items.\n * These property is ignored for subtrees.\n */\n checkedItems?: Iterable<TreeItemValue | [TreeItemValue, TreeSelectionValue]>;\n /**\n * Callback fired when the component changes value from checked state.\n * These property is ignored for subtrees.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n * such as checked value and type of interaction that created the event.\n */\n onCheckedChange?(event: TreeCheckedChangeEvent, data: TreeCheckedChangeData): void;\n};\n\nexport type FlatTreeState = ComponentState<FlatTreeSlots> &\n TreeContextValue & {\n open: boolean;\n };\n"],"names":[],"mappings":"AAAA,WA0FI"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderFlatTree.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["renderFlatTree.ts"],"sourcesContent":["import { renderTree_unstable } from '../../Tree';\nimport type { FlatTreeContextValues, FlatTreeState } from './FlatTree.types';\n\nexport const renderFlatTree_unstable: (state: FlatTreeState, contextValues: FlatTreeContextValues) => JSX.Element =\n renderTree_unstable;\n"],"names":["renderTree_unstable","renderFlatTree_unstable"],"mappings":"AAAA,SAASA,mBAAmB,QAAQ,aAAa;AAGjD,OAAO,MAAMC,0BACXD,oBAAoB"}
|
|
@@ -7,6 +7,8 @@ import { treeItemFilter } from '../../utils/treeItemFilter';
|
|
|
7
7
|
import { slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';
|
|
8
8
|
import { useTreeContext_unstable } from '../../contexts/treeContext';
|
|
9
9
|
import { useSubtree } from '../../hooks/useSubtree';
|
|
10
|
+
import { ImmutableSet } from '../../utils/ImmutableSet';
|
|
11
|
+
import { ImmutableMap } from '../../utils/ImmutableMap';
|
|
10
12
|
export const useFlatTree_unstable = (props, ref)=>{
|
|
11
13
|
const level = useTreeContext_unstable((ctx)=>ctx.level);
|
|
12
14
|
// as level is static, this doesn't break rule of hooks
|
|
@@ -51,13 +53,25 @@ You cannot use a <FlatTree> component inside of another <FlatTree> component.`);
|
|
|
51
53
|
}
|
|
52
54
|
return {
|
|
53
55
|
...useSubtree(props, ref),
|
|
56
|
+
// ------ defaultTreeContextValue
|
|
57
|
+
level: 0,
|
|
58
|
+
contextType: 'root',
|
|
59
|
+
treeType: 'nested',
|
|
60
|
+
selectionMode: 'none',
|
|
61
|
+
openItems: ImmutableSet.empty,
|
|
62
|
+
checkedItems: ImmutableMap.empty,
|
|
63
|
+
requestTreeResponse: noop,
|
|
64
|
+
appearance: 'subtle',
|
|
65
|
+
size: 'medium',
|
|
66
|
+
// ------ defaultTreeContextValue
|
|
54
67
|
open: false,
|
|
55
|
-
treeType: 'flat',
|
|
56
68
|
components: {
|
|
57
69
|
root: React.Fragment
|
|
58
70
|
},
|
|
59
|
-
root: slot.always(
|
|
71
|
+
root: slot.always(props, {
|
|
60
72
|
elementType: React.Fragment
|
|
61
73
|
})
|
|
62
74
|
};
|
|
63
75
|
}
|
|
76
|
+
function noop() {
|
|
77
|
+
/* do nothing */ }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useFlatTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { FlatTreeProps,
|
|
1
|
+
{"version":3,"sources":["useFlatTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { FlatTreeProps, FlatTreeState } from './FlatTree.types';\nimport { useFlatTreeNavigation } from './useFlatTreeNavigation';\nimport { HTMLElementWalker, createHTMLElementWalker } from '../../utils/createHTMLElementWalker';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { slot, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type { TreeNavigationData_unstable, TreeNavigationEvent_unstable } from '../Tree/Tree.types';\nimport { useTreeContext_unstable } from '../../contexts/treeContext';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { ImmutableSet } from '../../utils/ImmutableSet';\nimport { ImmutableMap } from '../../utils/ImmutableMap';\n\nexport const useFlatTree_unstable: (props: FlatTreeProps, ref: React.Ref<HTMLElement>) => FlatTreeState = (\n props,\n ref,\n) => {\n const level = useTreeContext_unstable(ctx => ctx.level);\n // as level is static, this doesn't break rule of hooks\n // and if this becomes an issue later on, this can be easily converted\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return level > 1 ? useSubFlatTree(props, ref) : useRootFlatTree(props, ref);\n};\n\nfunction useRootFlatTree(props: FlatTreeProps, ref: React.Ref<HTMLElement>): FlatTreeState {\n const { navigate, initialize } = useFlatTreeNavigation();\n const walkerRef = React.useRef<HTMLElementWalker>();\n const { targetDocument } = useFluent_unstable();\n\n const initializeWalker = React.useCallback(\n (root: HTMLElement | null) => {\n if (root && targetDocument) {\n walkerRef.current = createHTMLElementWalker(root, targetDocument, treeItemFilter);\n initialize(walkerRef.current);\n }\n },\n [initialize, targetDocument],\n );\n\n const handleNavigation = useEventCallback(\n (event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable) => {\n props.onNavigation?.(event, data);\n if (walkerRef.current && !event.isDefaultPrevented()) {\n navigate(data, walkerRef.current);\n }\n },\n );\n\n return {\n treeType: 'flat',\n ...useRootTree({ ...props, onNavigation: handleNavigation }, useMergedRefs(ref, initializeWalker)),\n };\n}\n\nfunction useSubFlatTree(props: FlatTreeProps, ref: React.Ref<HTMLElement>): FlatTreeState {\n if (process.env.NODE_ENV === 'development') {\n // eslint-disable-next-line no-console\n console.error(/* #__DE-INDENT__ */ `\n @fluentui/react-tree [useFlatTree]:\n Subtrees are not allowed in a FlatTree!\n You cannot use a <FlatTree> component inside of another <FlatTree> component.\n `);\n }\n return {\n ...useSubtree(props, ref),\n // ------ defaultTreeContextValue\n level: 0,\n contextType: 'root',\n treeType: 'nested',\n selectionMode: 'none',\n openItems: ImmutableSet.empty,\n checkedItems: ImmutableMap.empty,\n requestTreeResponse: noop,\n appearance: 'subtle',\n size: 'medium',\n // ------ defaultTreeContextValue\n open: false,\n components: { root: React.Fragment },\n root: slot.always(props, { elementType: React.Fragment }),\n };\n}\n\nfunction noop() {\n /* do nothing */\n}\n"],"names":["React","useRootTree","useFlatTreeNavigation","createHTMLElementWalker","useFluent_unstable","treeItemFilter","slot","useEventCallback","useMergedRefs","useTreeContext_unstable","useSubtree","ImmutableSet","ImmutableMap","useFlatTree_unstable","props","ref","level","ctx","useSubFlatTree","useRootFlatTree","navigate","initialize","walkerRef","useRef","targetDocument","initializeWalker","useCallback","root","current","handleNavigation","event","data","onNavigation","isDefaultPrevented","treeType","process","env","NODE_ENV","console","error","contextType","selectionMode","openItems","empty","checkedItems","requestTreeResponse","noop","appearance","size","open","components","Fragment","always","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,QAAQ,0BAA0B;AAEtD,SAASC,qBAAqB,QAAQ,0BAA0B;AAChE,SAA4BC,uBAAuB,QAAQ,sCAAsC;AACjG,SAASC,kBAAkB,QAAQ,kCAAkC;AACrE,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,IAAI,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAElF,SAASC,uBAAuB,QAAQ,6BAA6B;AACrE,SAASC,UAAU,QAAQ,yBAAyB;AACpD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,YAAY,QAAQ,2BAA2B;AAExD,OAAO,MAAMC,uBAA6F,CACxGC,OACAC;IAEA,MAAMC,QAAQP,wBAAwBQ,CAAAA,MAAOA,IAAID,KAAK;IACtD,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOA,QAAQ,IAAIE,eAAeJ,OAAOC,OAAOI,gBAAgBL,OAAOC;AACzE,EAAE;AAEF,SAASI,gBAAgBL,KAAoB,EAAEC,GAA2B;IACxE,MAAM,EAAEK,QAAQ,EAAEC,UAAU,EAAE,GAAGnB;IACjC,MAAMoB,YAAYtB,MAAMuB,MAAM;IAC9B,MAAM,EAAEC,cAAc,EAAE,GAAGpB;IAE3B,MAAMqB,mBAAmBzB,MAAM0B,WAAW,CACxC,CAACC;QACC,IAAIA,QAAQH,gBAAgB;YAC1BF,UAAUM,OAAO,GAAGzB,wBAAwBwB,MAAMH,gBAAgBnB;YAClEgB,WAAWC,UAAUM,OAAO;QAC9B;IACF,GACA;QAACP;QAAYG;KAAe;IAG9B,MAAMK,mBAAmBtB,iBACvB,CAACuB,OAAqCC;YACpCjB;SAAAA,sBAAAA,MAAMkB,YAAY,cAAlBlB,0CAAAA,yBAAAA,OAAqBgB,OAAOC;QAC5B,IAAIT,UAAUM,OAAO,IAAI,CAACE,MAAMG,kBAAkB,IAAI;YACpDb,SAASW,MAAMT,UAAUM,OAAO;QAClC;IACF;IAGF,OAAO;QACLM,UAAU;QACV,GAAGjC,YAAY;YAAE,GAAGa,KAAK;YAAEkB,cAAcH;QAAiB,GAAGrB,cAAcO,KAAKU,kBAAkB;IACpG;AACF;AAEA,SAASP,eAAeJ,KAAoB,EAAEC,GAA2B;IACvE,IAAIoB,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,sCAAsC;QACtCC,QAAQC,KAAK,CAAsB,CAAC;;6EAIpC,CAAC;IACH;IACA,OAAO;QACL,GAAG7B,WAAWI,OAAOC,IAAI;QACzB,iCAAiC;QACjCC,OAAO;QACPwB,aAAa;QACbN,UAAU;QACVO,eAAe;QACfC,WAAW/B,aAAagC,KAAK;QAC7BC,cAAchC,aAAa+B,KAAK;QAChCE,qBAAqBC;QACrBC,YAAY;QACZC,MAAM;QACN,iCAAiC;QACjCC,MAAM;QACNC,YAAY;YAAEvB,MAAM3B,MAAMmD,QAAQ;QAAC;QACnCxB,MAAMrB,KAAK8C,MAAM,CAACtC,OAAO;YAAEuC,aAAarD,MAAMmD,QAAQ;QAAC;IACzD;AACF;AAEA,SAASL;AACP,cAAc,GAChB"}
|
|
@@ -1,2 +1,20 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
export const useFlatTreeContextValues_unstable = (state)=>{
|
|
2
|
+
const { openItems, level, contextType, treeType, checkedItems, selectionMode, appearance, size, requestTreeResponse } = state;
|
|
3
|
+
/**
|
|
4
|
+
* This context is created with "@fluentui/react-context-selector",
|
|
5
|
+
* there is no sense to memoize it
|
|
6
|
+
*/ const tree = {
|
|
7
|
+
treeType,
|
|
8
|
+
size,
|
|
9
|
+
openItems,
|
|
10
|
+
appearance,
|
|
11
|
+
checkedItems,
|
|
12
|
+
selectionMode,
|
|
13
|
+
contextType,
|
|
14
|
+
level,
|
|
15
|
+
requestTreeResponse
|
|
16
|
+
};
|
|
17
|
+
return {
|
|
18
|
+
tree
|
|
19
|
+
};
|
|
20
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useFlatTreeContextValues.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"sources":["useFlatTreeContextValues.ts"],"sourcesContent":["import type { TreeContextValue } from '../../contexts';\nimport type { FlatTreeContextValues, FlatTreeState } from './FlatTree.types';\n\nexport const useFlatTreeContextValues_unstable = (state: FlatTreeState): FlatTreeContextValues => {\n const {\n openItems,\n level,\n contextType,\n treeType,\n checkedItems,\n selectionMode,\n appearance,\n size,\n requestTreeResponse,\n } = state;\n /**\n * This context is created with \"@fluentui/react-context-selector\",\n * there is no sense to memoize it\n */\n const tree: TreeContextValue = {\n treeType,\n size,\n openItems,\n appearance,\n checkedItems,\n selectionMode,\n contextType,\n level,\n requestTreeResponse,\n };\n\n return { tree };\n};\n"],"names":["useFlatTreeContextValues_unstable","state","openItems","level","contextType","treeType","checkedItems","selectionMode","appearance","size","requestTreeResponse","tree"],"mappings":"AAGA,OAAO,MAAMA,oCAAoC,CAACC;IAChD,MAAM,EACJC,SAAS,EACTC,KAAK,EACLC,WAAW,EACXC,QAAQ,EACRC,YAAY,EACZC,aAAa,EACbC,UAAU,EACVC,IAAI,EACJC,mBAAmB,EACpB,GAAGT;IACJ;;;GAGC,GACD,MAAMU,OAAyB;QAC7BN;QACAI;QACAP;QACAM;QACAF;QACAC;QACAH;QACAD;QACAO;IACF;IAEA,OAAO;QAAEC;IAAK;AAChB,EAAE"}
|
|
@@ -1,20 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { __resetStyles, mergeClasses } from '@griffel/react';
|
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
|
3
3
|
export const flatTreeClassNames = {
|
|
4
4
|
root: 'fui-FlatTree'
|
|
5
5
|
};
|
|
6
|
-
const
|
|
7
|
-
root: {
|
|
8
|
-
mc9l5x: "f22iagw",
|
|
9
|
-
Beiy3e4: "f1vx9l62",
|
|
10
|
-
Belr9w4: "f1j0q4x9"
|
|
11
|
-
}
|
|
12
|
-
}, {
|
|
13
|
-
d: [".f22iagw{display:flex;}", ".f1vx9l62{flex-direction:column;}", ".f1j0q4x9{row-gap:var(--spacingVerticalXXS);}"]
|
|
14
|
-
});
|
|
6
|
+
const useBaseStyles = /*#__PURE__*/__resetStyles("rnv2ez3", null, [".rnv2ez3{display:flex;flex-direction:column;row-gap:var(--spacingVerticalXXS);}"]);
|
|
15
7
|
export const useFlatTreeStyles_unstable = state => {
|
|
16
|
-
const
|
|
17
|
-
state.root.className = mergeClasses(flatTreeClassNames.root,
|
|
8
|
+
const baseStyles = useBaseStyles();
|
|
9
|
+
state.root.className = mergeClasses(flatTreeClassNames.root, baseStyles, state.root.className);
|
|
18
10
|
return state;
|
|
19
11
|
};
|
|
20
12
|
//# sourceMappingURL=useFlatTreeStyles.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["
|
|
1
|
+
{"version":3,"names":["__resetStyles","mergeClasses","tokens","flatTreeClassNames","root","useBaseStyles","useFlatTreeStyles_unstable","state","baseStyles","className"],"sources":["useFlatTreeStyles.styles.js"],"sourcesContent":["import { makeResetStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const flatTreeClassNames = {\n root: 'fui-FlatTree'\n};\nconst useBaseStyles = makeResetStyles({\n display: 'flex',\n flexDirection: 'column',\n rowGap: tokens.spacingVerticalXXS\n});\nexport const useFlatTreeStyles_unstable = (state)=>{\n const baseStyles = useBaseStyles();\n state.root.className = mergeClasses(flatTreeClassNames.root, baseStyles, state.root.className);\n return state;\n};\n"],"mappings":"AAAA,SAAAA,aAAA,EAA0BC,YAAY,QAAQ,gBAAgB;AAC9D,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,aAAa,gBAAGL,aAAA,qGAIrB,CAAC;AACF,OAAO,MAAMM,0BAA0B,GAAIC,KAAK,IAAG;EAC/C,MAAMC,UAAU,GAAGH,aAAa,CAAC,CAAC;EAClCE,KAAK,CAACH,IAAI,CAACK,SAAS,GAAGR,YAAY,CAACE,kBAAkB,CAACC,IAAI,EAAEI,UAAU,EAAED,KAAK,CAACH,IAAI,CAACK,SAAS,CAAC;EAC9F,OAAOF,KAAK;AAChB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Tree.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState, SelectionMode, Slot } from '@fluentui/react-utilities';\nimport type { TreeContextValue } from '../../contexts';\nimport type { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Enter, Home } from '@fluentui/keyboard-keys';\nimport type { TreeItemValue } from '../TreeItem/TreeItem.types';\nimport { CheckboxProps } from '@fluentui/react-checkbox';\nimport { RadioProps } from '@fluentui/react-radio';\n\ntype MultiSelectValue = NonNullable<CheckboxProps['checked']>;\ntype SingleSelectValue = NonNullable<RadioProps['checked']>;\nexport type TreeSelectionValue = MultiSelectValue | SingleSelectValue;\n\nexport type TreeSlots = {\n root: Slot<'div'>;\n};\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type TreeNavigationData_unstable = {\n target: HTMLElement;\n value: TreeItemValue;\n parentValue: TreeItemValue | undefined;\n} & (\n | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n | { event: React.KeyboardEvent<HTMLElement>; type: 'TypeAhead' }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowUp }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowDown }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof Home }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof End }\n);\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type TreeNavigationEvent_unstable = TreeNavigationData_unstable['event'];\n\nexport type TreeOpenChangeData = {\n open: boolean;\n openItems: Set<TreeItemValue>;\n value: TreeItemValue;\n target: HTMLElement;\n} & (\n | { event: React.MouseEvent<HTMLElement>; type: 'ExpandIconClick' }\n | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof Enter }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n);\n\nexport type TreeOpenChangeEvent = TreeOpenChangeData['event'];\n\nexport type TreeCheckedChangeData = {\n value: TreeItemValue;\n checkedItems: Map<TreeItemValue, TreeSelectionValue>;\n target: HTMLElement;\n event: React.ChangeEvent<HTMLElement>;\n type: 'Change';\n} & (\n | {\n selectionMode: 'multiselect';\n checked: MultiSelectValue;\n }\n | {\n selectionMode: 'single';\n checked: SingleSelectValue;\n }\n);\n\nexport type TreeCheckedChangeEvent = TreeCheckedChangeData['event'];\n\nexport type TreeContextValues = {\n tree: TreeContextValue;\n};\n\nexport type TreeProps = ComponentProps<TreeSlots> & {\n /**\n * A tree item can have various appearances:\n * - 'subtle' (default): The default tree item styles.\n * - 'subtle-alpha': Minimizes emphasis on hovered or focused states.\n * - 'transparent': Removes background color.\n * @default 'subtle'\n */\n appearance?: 'subtle' | 'subtle-alpha' | 'transparent';\n /**\n * Size of the tree item.\n * @default 'medium'\n */\n size?: 'small' | 'medium';\n /**\n * This refers to a list of ids of opened tree items.\n * Controls the state of the open tree items.\n * These property is ignored for subtrees.\n */\n openItems?: Iterable<TreeItemValue>;\n /**\n * This refers to a list of ids of default opened items.\n * This property is ignored for subtrees.\n */\n defaultOpenItems?: Iterable<TreeItemValue>;\n /**\n * Callback fired when the component changes value from open state.\n * These property is ignored for subtrees.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event.\n */\n onOpenChange?(event: TreeOpenChangeEvent, data: TreeOpenChangeData): void;\n\n /**\n * Callback fired when navigation happens inside the component.\n * These property is ignored for subtrees.\n *\n * FIXME: This method is not ideal, as navigation should be handled internally by tabster.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n */\n onNavigation?(event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable): void;\n\n /**\n * This refers to the selection mode of the tree.\n * - undefined: No selection can be done.\n * - 'single': Only one tree item can be selected, radio buttons are rendered.\n * - 'multiselect': Multiple tree items can be selected, checkboxes are rendered.\n *\n * @default undefined\n */\n selectionMode?: SelectionMode;\n /**\n * This refers to a list of ids of checked tree items, or a list of tuples of ids and checked state.\n * Controls the state of the checked tree items.\n * These property is ignored for subtrees.\n */\n checkedItems?: Iterable<TreeItemValue | [TreeItemValue, TreeSelectionValue]>;\n /**\n * Callback fired when the component changes value from checked state.\n * These property is ignored for subtrees.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n * such as checked value and type of interaction that created the event.\n */\n onCheckedChange?(event: TreeCheckedChangeEvent, data: TreeCheckedChangeData): void;\n};\n\n/**\n * State used in rendering Tree\n */\nexport type TreeState = ComponentState<TreeSlots>
|
|
1
|
+
{"version":3,"sources":["Tree.types.ts"],"sourcesContent":["import type * as React from 'react';\nimport type { ComponentProps, ComponentState, SelectionMode, Slot } from '@fluentui/react-utilities';\nimport type { TreeContextValue, SubtreeContextValue } from '../../contexts';\nimport type { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, End, Enter, Home } from '@fluentui/keyboard-keys';\nimport type { TreeItemValue } from '../TreeItem/TreeItem.types';\nimport { CheckboxProps } from '@fluentui/react-checkbox';\nimport { RadioProps } from '@fluentui/react-radio';\n\ntype MultiSelectValue = NonNullable<CheckboxProps['checked']>;\ntype SingleSelectValue = NonNullable<RadioProps['checked']>;\nexport type TreeSelectionValue = MultiSelectValue | SingleSelectValue;\n\nexport type TreeSlots = {\n root: Slot<'div'>;\n};\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type TreeNavigationData_unstable = {\n target: HTMLElement;\n value: TreeItemValue;\n parentValue: TreeItemValue | undefined;\n} & (\n | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n | { event: React.KeyboardEvent<HTMLElement>; type: 'TypeAhead' }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowUp }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowDown }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof Home }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof End }\n);\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type TreeNavigationEvent_unstable = TreeNavigationData_unstable['event'];\n\nexport type TreeOpenChangeData = {\n open: boolean;\n openItems: Set<TreeItemValue>;\n value: TreeItemValue;\n target: HTMLElement;\n} & (\n | { event: React.MouseEvent<HTMLElement>; type: 'ExpandIconClick' }\n | { event: React.MouseEvent<HTMLElement>; type: 'Click' }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof Enter }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowRight }\n | { event: React.KeyboardEvent<HTMLElement>; type: typeof ArrowLeft }\n);\n\nexport type TreeOpenChangeEvent = TreeOpenChangeData['event'];\n\nexport type TreeCheckedChangeData = {\n value: TreeItemValue;\n checkedItems: Map<TreeItemValue, TreeSelectionValue>;\n target: HTMLElement;\n event: React.ChangeEvent<HTMLElement>;\n type: 'Change';\n} & (\n | {\n selectionMode: 'multiselect';\n checked: MultiSelectValue;\n }\n | {\n selectionMode: 'single';\n checked: SingleSelectValue;\n }\n);\n\nexport type TreeCheckedChangeEvent = TreeCheckedChangeData['event'];\n\nexport type TreeContextValues = {\n tree: TreeContextValue | SubtreeContextValue;\n};\n\nexport type TreeProps = ComponentProps<TreeSlots> & {\n /**\n * A tree item can have various appearances:\n * - 'subtle' (default): The default tree item styles.\n * - 'subtle-alpha': Minimizes emphasis on hovered or focused states.\n * - 'transparent': Removes background color.\n * @default 'subtle'\n */\n appearance?: 'subtle' | 'subtle-alpha' | 'transparent';\n /**\n * Size of the tree item.\n * @default 'medium'\n */\n size?: 'small' | 'medium';\n /**\n * This refers to a list of ids of opened tree items.\n * Controls the state of the open tree items.\n * These property is ignored for subtrees.\n */\n openItems?: Iterable<TreeItemValue>;\n /**\n * This refers to a list of ids of default opened items.\n * This property is ignored for subtrees.\n */\n defaultOpenItems?: Iterable<TreeItemValue>;\n /**\n * Callback fired when the component changes value from open state.\n * These property is ignored for subtrees.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n * such as open value and type of interaction that created the event.\n */\n onOpenChange?(event: TreeOpenChangeEvent, data: TreeOpenChangeData): void;\n\n /**\n * Callback fired when navigation happens inside the component.\n * These property is ignored for subtrees.\n *\n * FIXME: This method is not ideal, as navigation should be handled internally by tabster.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n */\n onNavigation?(event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable): void;\n\n /**\n * This refers to the selection mode of the tree.\n * - undefined: No selection can be done.\n * - 'single': Only one tree item can be selected, radio buttons are rendered.\n * - 'multiselect': Multiple tree items can be selected, checkboxes are rendered.\n *\n * @default undefined\n */\n selectionMode?: SelectionMode;\n /**\n * This refers to a list of ids of checked tree items, or a list of tuples of ids and checked state.\n * Controls the state of the checked tree items.\n * These property is ignored for subtrees.\n */\n checkedItems?: Iterable<TreeItemValue | [TreeItemValue, TreeSelectionValue]>;\n /**\n * Callback fired when the component changes value from checked state.\n * These property is ignored for subtrees.\n *\n * @param event - a React's Synthetic event\n * @param data - A data object with relevant information,\n * such as checked value and type of interaction that created the event.\n */\n onCheckedChange?(event: TreeCheckedChangeEvent, data: TreeCheckedChangeData): void;\n};\n\n/**\n * State used in rendering Tree\n */\nexport type TreeState = ComponentState<TreeSlots> & {\n open: boolean;\n} & (TreeContextValue | SubtreeContextValue);\n"],"names":[],"mappings":"AAAA,WAsJ6C"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
2
|
import { assertSlots } from '@fluentui/react-utilities';
|
|
3
|
-
import { TreeProvider } from '
|
|
3
|
+
import { TreeProvider } from '../TreeProvider';
|
|
4
4
|
export const renderTree_unstable = (state, contextValues)=>{
|
|
5
5
|
assertSlots(state);
|
|
6
6
|
return /*#__PURE__*/ _jsx(TreeProvider, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderTree.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport
|
|
1
|
+
{"version":3,"sources":["renderTree.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { TreeContextValues, TreeSlots, TreeState } from '../Tree/Tree.types';\nimport { TreeProvider } from '../TreeProvider';\n\nexport const renderTree_unstable = (state: TreeState, contextValues: TreeContextValues) => {\n assertSlots<TreeSlots>(state);\n return (\n <TreeProvider value={contextValues.tree}>\n {state.open && <state.root>{state.root.children}</state.root>}\n </TreeProvider>\n );\n};\n"],"names":["assertSlots","TreeProvider","renderTree_unstable","state","contextValues","value","tree","open","root","children"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AACjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,YAAY,QAAQ,kBAAkB;AAE/C,OAAO,MAAMC,sBAAsB,CAACC,OAAkBC;IACpDJ,YAAuBG;IACvB,qBACE,KAACF;QAAaI,OAAOD,cAAcE,IAAI;kBACpCH,MAAMI,IAAI,kBAAI,KAACJ,MAAMK,IAAI;sBAAEL,MAAMK,IAAI,CAACC,QAAQ;;;AAGrD,EAAE"}
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';
|
|
3
3
|
import { createNextOpenItems, useControllableOpenItems } from '../../hooks/useControllableOpenItems';
|
|
4
4
|
import { createNextNestedCheckedItems, useNestedCheckedItems } from './useNestedControllableCheckedItems';
|
|
5
|
-
import {
|
|
5
|
+
import { useSubtreeContext_unstable } from '../../contexts/subtreeContext';
|
|
6
6
|
import { useRootTree } from '../../hooks/useRootTree';
|
|
7
7
|
import { useSubtree } from '../../hooks/useSubtree';
|
|
8
8
|
import { createHTMLElementWalker } from '../../utils/createHTMLElementWalker';
|
|
@@ -10,14 +10,11 @@ import { treeItemFilter } from '../../utils/treeItemFilter';
|
|
|
10
10
|
import { useTreeNavigation } from './useTreeNavigation';
|
|
11
11
|
import { useFluent_unstable } from '@fluentui/react-shared-contexts';
|
|
12
12
|
export const useTree_unstable = (props, ref)=>{
|
|
13
|
-
const
|
|
14
|
-
// as
|
|
13
|
+
const { level } = useSubtreeContext_unstable();
|
|
14
|
+
// as level is static, this doesn't break rule of hooks
|
|
15
15
|
// and if this becomes an issue later on, this can be easily converted
|
|
16
16
|
// eslint-disable-next-line react-hooks/rules-of-hooks
|
|
17
|
-
return
|
|
18
|
-
...useSubtree(props, ref),
|
|
19
|
-
treeType: 'nested'
|
|
20
|
-
} : useNestedRootTree(props, ref);
|
|
17
|
+
return level > 0 ? useSubtree(props, ref) : useNestedRootTree(props, ref);
|
|
21
18
|
};
|
|
22
19
|
function useNestedRootTree(props, ref) {
|
|
23
20
|
const [openItems, setOpenItems] = useControllableOpenItems(props);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type {\n TreeCheckedChangeData,\n TreeCheckedChangeEvent,\n TreeNavigationData_unstable,\n TreeNavigationEvent_unstable,\n TreeOpenChangeData,\n TreeOpenChangeEvent,\n TreeProps,\n TreeState,\n} from './Tree.types';\nimport { createNextOpenItems, useControllableOpenItems } from '../../hooks/useControllableOpenItems';\nimport { createNextNestedCheckedItems, useNestedCheckedItems } from './useNestedControllableCheckedItems';\nimport {
|
|
1
|
+
{"version":3,"sources":["useTree.ts"],"sourcesContent":["import * as React from 'react';\nimport { useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport type {\n TreeCheckedChangeData,\n TreeCheckedChangeEvent,\n TreeNavigationData_unstable,\n TreeNavigationEvent_unstable,\n TreeOpenChangeData,\n TreeOpenChangeEvent,\n TreeProps,\n TreeState,\n} from './Tree.types';\nimport { createNextOpenItems, useControllableOpenItems } from '../../hooks/useControllableOpenItems';\nimport { createNextNestedCheckedItems, useNestedCheckedItems } from './useNestedControllableCheckedItems';\nimport { useSubtreeContext_unstable } from '../../contexts/subtreeContext';\nimport { useRootTree } from '../../hooks/useRootTree';\nimport { useSubtree } from '../../hooks/useSubtree';\nimport { HTMLElementWalker, createHTMLElementWalker } from '../../utils/createHTMLElementWalker';\nimport { treeItemFilter } from '../../utils/treeItemFilter';\nimport { useTreeNavigation } from './useTreeNavigation';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\n\nexport const useTree_unstable = (props: TreeProps, ref: React.Ref<HTMLElement>): TreeState => {\n const { level } = useSubtreeContext_unstable();\n // as level is static, this doesn't break rule of hooks\n // and if this becomes an issue later on, this can be easily converted\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return level > 0 ? useSubtree(props, ref) : useNestedRootTree(props, ref);\n};\n\nfunction useNestedRootTree(props: TreeProps, ref: React.Ref<HTMLElement>): TreeState {\n const [openItems, setOpenItems] = useControllableOpenItems(props);\n const checkedItems = useNestedCheckedItems(props);\n const { navigate, initialize } = useTreeNavigation();\n const walkerRef = React.useRef<HTMLElementWalker>();\n const { targetDocument } = useFluent_unstable();\n\n const initializeWalker = React.useCallback(\n (root: HTMLElement | null) => {\n if (root && targetDocument) {\n walkerRef.current = createHTMLElementWalker(root, targetDocument, treeItemFilter);\n initialize(walkerRef.current);\n }\n },\n [initialize, targetDocument],\n );\n\n const handleOpenChange = useEventCallback((event: TreeOpenChangeEvent, data: TreeOpenChangeData) => {\n const nextOpenItems = createNextOpenItems(data, openItems);\n props.onOpenChange?.(event, {\n ...data,\n openItems: nextOpenItems.dangerouslyGetInternalSet_unstable(),\n });\n setOpenItems(nextOpenItems);\n });\n\n const handleCheckedChange = useEventCallback((event: TreeCheckedChangeEvent, data: TreeCheckedChangeData) => {\n if (walkerRef.current) {\n const nextCheckedItems = createNextNestedCheckedItems(data, checkedItems);\n props.onCheckedChange?.(event, {\n ...data,\n checkedItems: nextCheckedItems.dangerouslyGetInternalMap_unstable(),\n });\n }\n });\n const handleNavigation = useEventCallback(\n (event: TreeNavigationEvent_unstable, data: TreeNavigationData_unstable) => {\n props.onNavigation?.(event, data);\n if (walkerRef.current && !event.isDefaultPrevented()) {\n navigate(data, walkerRef.current);\n }\n },\n );\n\n return {\n treeType: 'nested',\n ...useRootTree(\n {\n ...props,\n openItems,\n checkedItems,\n onOpenChange: handleOpenChange,\n onNavigation: handleNavigation,\n onCheckedChange: handleCheckedChange,\n },\n useMergedRefs(ref, initializeWalker),\n ),\n };\n}\n"],"names":["React","useEventCallback","useMergedRefs","createNextOpenItems","useControllableOpenItems","createNextNestedCheckedItems","useNestedCheckedItems","useSubtreeContext_unstable","useRootTree","useSubtree","createHTMLElementWalker","treeItemFilter","useTreeNavigation","useFluent_unstable","useTree_unstable","props","ref","level","useNestedRootTree","openItems","setOpenItems","checkedItems","navigate","initialize","walkerRef","useRef","targetDocument","initializeWalker","useCallback","root","current","handleOpenChange","event","data","nextOpenItems","onOpenChange","dangerouslyGetInternalSet_unstable","handleCheckedChange","nextCheckedItems","onCheckedChange","dangerouslyGetInternalMap_unstable","handleNavigation","onNavigation","isDefaultPrevented","treeType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,EAAEC,aAAa,QAAQ,4BAA4B;AAW5E,SAASC,mBAAmB,EAAEC,wBAAwB,QAAQ,uCAAuC;AACrG,SAASC,4BAA4B,EAAEC,qBAAqB,QAAQ,sCAAsC;AAC1G,SAASC,0BAA0B,QAAQ,gCAAgC;AAC3E,SAASC,WAAW,QAAQ,0BAA0B;AACtD,SAASC,UAAU,QAAQ,yBAAyB;AACpD,SAA4BC,uBAAuB,QAAQ,sCAAsC;AACjG,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,kBAAkB,QAAQ,kCAAkC;AAErE,OAAO,MAAMC,mBAAmB,CAACC,OAAkBC;IACjD,MAAM,EAAEC,KAAK,EAAE,GAAGV;IAClB,uDAAuD;IACvD,sEAAsE;IACtE,sDAAsD;IACtD,OAAOU,QAAQ,IAAIR,WAAWM,OAAOC,OAAOE,kBAAkBH,OAAOC;AACvE,EAAE;AAEF,SAASE,kBAAkBH,KAAgB,EAAEC,GAA2B;IACtE,MAAM,CAACG,WAAWC,aAAa,GAAGhB,yBAAyBW;IAC3D,MAAMM,eAAef,sBAAsBS;IAC3C,MAAM,EAAEO,QAAQ,EAAEC,UAAU,EAAE,GAAGX;IACjC,MAAMY,YAAYxB,MAAMyB,MAAM;IAC9B,MAAM,EAAEC,cAAc,EAAE,GAAGb;IAE3B,MAAMc,mBAAmB3B,MAAM4B,WAAW,CACxC,CAACC;QACC,IAAIA,QAAQH,gBAAgB;YAC1BF,UAAUM,OAAO,GAAGpB,wBAAwBmB,MAAMH,gBAAgBf;YAClEY,WAAWC,UAAUM,OAAO;QAC9B;IACF,GACA;QAACP;QAAYG;KAAe;IAG9B,MAAMK,mBAAmB9B,iBAAiB,CAAC+B,OAA4BC;YAErElB;QADA,MAAMmB,gBAAgB/B,oBAAoB8B,MAAMd;SAChDJ,sBAAAA,MAAMoB,YAAY,cAAlBpB,0CAAAA,yBAAAA,OAAqBiB,OAAO;YAC1B,GAAGC,IAAI;YACPd,WAAWe,cAAcE,kCAAkC;QAC7D;QACAhB,aAAac;IACf;IAEA,MAAMG,sBAAsBpC,iBAAiB,CAAC+B,OAA+BC;QAC3E,IAAIT,UAAUM,OAAO,EAAE;gBAErBf;YADA,MAAMuB,mBAAmBjC,6BAA6B4B,MAAMZ;aAC5DN,yBAAAA,MAAMwB,eAAe,cAArBxB,6CAAAA,4BAAAA,OAAwBiB,OAAO;gBAC7B,GAAGC,IAAI;gBACPZ,cAAciB,iBAAiBE,kCAAkC;YACnE;QACF;IACF;IACA,MAAMC,mBAAmBxC,iBACvB,CAAC+B,OAAqCC;YACpClB;SAAAA,sBAAAA,MAAM2B,YAAY,cAAlB3B,0CAAAA,yBAAAA,OAAqBiB,OAAOC;QAC5B,IAAIT,UAAUM,OAAO,IAAI,CAACE,MAAMW,kBAAkB,IAAI;YACpDrB,SAASW,MAAMT,UAAUM,OAAO;QAClC;IACF;IAGF,OAAO;QACLc,UAAU;QACV,GAAGpC,YACD;YACE,GAAGO,KAAK;YACRI;YACAE;YACAc,cAAcJ;YACdW,cAAcD;YACdF,iBAAiBF;QACnB,GACAnC,cAAcc,KAAKW,kBACpB;IACH;AACF"}
|