@fluentui/react-accordion 9.0.0-rc.5 → 9.0.0-rc.8
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 +162 -1
- package/CHANGELOG.md +46 -2
- package/dist/{react-accordion.d.ts → index.d.ts} +21 -0
- package/lib/components/Accordion/useAccordion.js +2 -1
- package/lib/components/Accordion/useAccordion.js.map +1 -1
- package/lib/components/Accordion/useAccordionStyles.d.ts +6 -1
- package/lib/components/Accordion/useAccordionStyles.js +8 -1
- package/lib/components/Accordion/useAccordionStyles.js.map +1 -1
- package/lib/components/AccordionHeader/useAccordionHeaderStyles.d.ts +6 -1
- package/lib/components/AccordionHeader/useAccordionHeaderStyles.js +35 -11
- package/lib/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -1
- package/lib/components/AccordionItem/useAccordionItem.js +1 -5
- package/lib/components/AccordionItem/useAccordionItem.js.map +1 -1
- package/lib/components/AccordionItem/useAccordionItemStyles.d.ts +6 -1
- package/lib/components/AccordionItem/useAccordionItemStyles.js +8 -1
- package/lib/components/AccordionItem/useAccordionItemStyles.js.map +1 -1
- package/lib/components/AccordionPanel/useAccordionPanel.js +11 -1
- package/lib/components/AccordionPanel/useAccordionPanel.js.map +1 -1
- package/lib/components/AccordionPanel/useAccordionPanelStyles.d.ts +6 -1
- package/lib/components/AccordionPanel/useAccordionPanelStyles.js +8 -1
- package/lib/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -1
- package/lib/index.d.ts +8 -4
- package/lib/index.js +8 -4
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Accordion/useAccordion.js +2 -1
- package/lib-commonjs/components/Accordion/useAccordion.js.map +1 -1
- package/lib-commonjs/components/Accordion/useAccordionStyles.d.ts +6 -1
- package/lib-commonjs/components/Accordion/useAccordionStyles.js +9 -2
- package/lib-commonjs/components/Accordion/useAccordionStyles.js.map +1 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.d.ts +6 -1
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.js +36 -12
- package/lib-commonjs/components/AccordionHeader/useAccordionHeaderStyles.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItem.js +1 -6
- package/lib-commonjs/components/AccordionItem/useAccordionItem.js.map +1 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.d.ts +6 -1
- package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.js +9 -2
- package/lib-commonjs/components/AccordionItem/useAccordionItemStyles.js.map +1 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanel.js +14 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanel.js.map +1 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.d.ts +6 -1
- package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.js +9 -2
- package/lib-commonjs/components/AccordionPanel/useAccordionPanelStyles.js.map +1 -1
- package/lib-commonjs/index.d.ts +8 -4
- package/lib-commonjs/index.js +192 -5
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +11 -20
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,168 @@
|
|
|
2
2
|
"name": "@fluentui/react-accordion",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Wed, 04 May 2022 13:24:04 GMT",
|
|
6
|
+
"tag": "@fluentui/react-accordion_v9.0.0-rc.8",
|
|
7
|
+
"version": "9.0.0-rc.8",
|
|
8
|
+
"comments": {
|
|
9
|
+
"prerelease": [
|
|
10
|
+
{
|
|
11
|
+
"author": "seanmonahan@microsoft.com",
|
|
12
|
+
"package": "@fluentui/react-accordion",
|
|
13
|
+
"commit": "84cf59cd3465e75b1507083b2c270e0146f85d41",
|
|
14
|
+
"comment": "remove star exports"
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
"author": "beachball",
|
|
18
|
+
"package": "@fluentui/react-accordion",
|
|
19
|
+
"comment": "Bump @fluentui/react-aria to v9.0.0-rc.7",
|
|
20
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"author": "beachball",
|
|
24
|
+
"package": "@fluentui/react-accordion",
|
|
25
|
+
"comment": "Bump @fluentui/react-context-selector to v9.0.0-rc.7",
|
|
26
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
|
27
|
+
},
|
|
28
|
+
{
|
|
29
|
+
"author": "beachball",
|
|
30
|
+
"package": "@fluentui/react-accordion",
|
|
31
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.6",
|
|
32
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"author": "beachball",
|
|
36
|
+
"package": "@fluentui/react-accordion",
|
|
37
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.8",
|
|
38
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
"author": "beachball",
|
|
42
|
+
"package": "@fluentui/react-accordion",
|
|
43
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.6",
|
|
44
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"author": "beachball",
|
|
48
|
+
"package": "@fluentui/react-accordion",
|
|
49
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.7",
|
|
50
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
|
51
|
+
}
|
|
52
|
+
]
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
"date": "Mon, 25 Apr 2022 09:32:16 GMT",
|
|
57
|
+
"tag": "@fluentui/react-accordion_v9.0.0-rc.7",
|
|
58
|
+
"version": "9.0.0-rc.7",
|
|
59
|
+
"comments": {
|
|
60
|
+
"prerelease": [
|
|
61
|
+
{
|
|
62
|
+
"author": "marata@microsoft.com",
|
|
63
|
+
"package": "@fluentui/react-accordion",
|
|
64
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d",
|
|
65
|
+
"comment": "Adjusting accordion keyboard navigation."
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"author": "beachball",
|
|
69
|
+
"package": "@fluentui/react-accordion",
|
|
70
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.7",
|
|
71
|
+
"commit": "02ca1d3c198452c1693067f5f18bd01b2ed5d6e6"
|
|
72
|
+
}
|
|
73
|
+
]
|
|
74
|
+
}
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"date": "Tue, 19 Apr 2022 19:17:06 GMT",
|
|
78
|
+
"tag": "@fluentui/react-accordion_v9.0.0-rc.6",
|
|
79
|
+
"version": "9.0.0-rc.6",
|
|
80
|
+
"comments": {
|
|
81
|
+
"none": [
|
|
82
|
+
{
|
|
83
|
+
"author": "elcraig@microsoft.com",
|
|
84
|
+
"package": "@fluentui/react-accordion",
|
|
85
|
+
"commit": "b7f17e976f9e058f39c9fce4f0f9bb6eb4dfa577",
|
|
86
|
+
"comment": "Update React dev deps and hoist them to the repo root"
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
"author": "mgodbolt@microsoft.com",
|
|
90
|
+
"package": "@fluentui/react-accordion",
|
|
91
|
+
"commit": "905e46db07ada986fd7885531f72a71b7bbaabdc",
|
|
92
|
+
"comment": "create v9 api extractor config and set all v9 packags to use it, suppress forgotten export"
|
|
93
|
+
}
|
|
94
|
+
],
|
|
95
|
+
"prerelease": [
|
|
96
|
+
{
|
|
97
|
+
"author": "seanmonahan@microsoft.com",
|
|
98
|
+
"package": "@fluentui/react-accordion",
|
|
99
|
+
"commit": "086a675fd0c648944ff4048450190a0a13467de3",
|
|
100
|
+
"comment": "Add static classnames to Accordion"
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
"author": "martinhochel@microsoft.com",
|
|
104
|
+
"package": "@fluentui/react-accordion",
|
|
105
|
+
"commit": "8722596e561b57decfe9aa79121db844737102ff",
|
|
106
|
+
"comment": "add missing dependencies"
|
|
107
|
+
},
|
|
108
|
+
{
|
|
109
|
+
"author": "seanmonahan@microsoft.com",
|
|
110
|
+
"package": "@fluentui/react-accordion",
|
|
111
|
+
"commit": "bea6aecfed8612f7b0664ab8bac77c5fccee1efb",
|
|
112
|
+
"comment": "update react-icons version to ^2.0.166-rc.3 from ^2.0.159-beta.10"
|
|
113
|
+
},
|
|
114
|
+
{
|
|
115
|
+
"author": "olfedias@microsoft.com",
|
|
116
|
+
"package": "@fluentui/react-accordion",
|
|
117
|
+
"commit": "e569d6e04d83cbcc6225e61db52ff81d2addd363",
|
|
118
|
+
"comment": "chore: Update Griffel to latest version"
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
"author": "beachball",
|
|
122
|
+
"package": "@fluentui/react-accordion",
|
|
123
|
+
"comment": "Bump @fluentui/react-aria to v9.0.0-rc.6",
|
|
124
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
125
|
+
},
|
|
126
|
+
{
|
|
127
|
+
"author": "beachball",
|
|
128
|
+
"package": "@fluentui/react-accordion",
|
|
129
|
+
"comment": "Bump @fluentui/react-context-selector to v9.0.0-rc.6",
|
|
130
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
131
|
+
},
|
|
132
|
+
{
|
|
133
|
+
"author": "beachball",
|
|
134
|
+
"package": "@fluentui/react-accordion",
|
|
135
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.0.0-rc.5",
|
|
136
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
"author": "beachball",
|
|
140
|
+
"package": "@fluentui/react-accordion",
|
|
141
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.6",
|
|
142
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
143
|
+
},
|
|
144
|
+
{
|
|
145
|
+
"author": "beachball",
|
|
146
|
+
"package": "@fluentui/react-accordion",
|
|
147
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.5",
|
|
148
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
149
|
+
},
|
|
150
|
+
{
|
|
151
|
+
"author": "beachball",
|
|
152
|
+
"package": "@fluentui/react-accordion",
|
|
153
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.6",
|
|
154
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
155
|
+
},
|
|
156
|
+
{
|
|
157
|
+
"author": "beachball",
|
|
158
|
+
"package": "@fluentui/react-accordion",
|
|
159
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4",
|
|
160
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
|
161
|
+
}
|
|
162
|
+
]
|
|
163
|
+
}
|
|
164
|
+
},
|
|
165
|
+
{
|
|
166
|
+
"date": "Fri, 04 Mar 2022 05:17:33 GMT",
|
|
6
167
|
"tag": "@fluentui/react-accordion_v9.0.0-rc.5",
|
|
7
168
|
"version": "9.0.0-rc.5",
|
|
8
169
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,56 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-accordion
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Wed, 04 May 2022 13:24:04 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.0.0-rc.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.0.0-rc.8)
|
|
8
|
+
|
|
9
|
+
Wed, 04 May 2022 13:24:04 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.0.0-rc.7..@fluentui/react-accordion_v9.0.0-rc.8)
|
|
11
|
+
|
|
12
|
+
### Changes
|
|
13
|
+
|
|
14
|
+
- remove star exports ([PR #22682](https://github.com/microsoft/fluentui/pull/22682) by seanmonahan@microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-aria to v9.0.0-rc.7 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
|
16
|
+
- Bump @fluentui/react-context-selector to v9.0.0-rc.7 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
|
17
|
+
- Bump @fluentui/react-shared-contexts to v9.0.0-rc.6 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
|
18
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.8 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
|
19
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.6 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
|
20
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.7 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
|
21
|
+
|
|
22
|
+
## [9.0.0-rc.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.0.0-rc.7)
|
|
23
|
+
|
|
24
|
+
Mon, 25 Apr 2022 09:32:16 GMT
|
|
25
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.0.0-rc.6..@fluentui/react-accordion_v9.0.0-rc.7)
|
|
26
|
+
|
|
27
|
+
### Changes
|
|
28
|
+
|
|
29
|
+
- Adjusting accordion keyboard navigation. ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by marata@microsoft.com)
|
|
30
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.7 ([PR #22601](https://github.com/microsoft/fluentui/pull/22601) by beachball)
|
|
31
|
+
|
|
32
|
+
## [9.0.0-rc.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.0.0-rc.6)
|
|
33
|
+
|
|
34
|
+
Tue, 19 Apr 2022 19:17:06 GMT
|
|
35
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.0.0-rc.5..@fluentui/react-accordion_v9.0.0-rc.6)
|
|
36
|
+
|
|
37
|
+
### Changes
|
|
38
|
+
|
|
39
|
+
- Add static classnames to Accordion ([PR #21960](https://github.com/microsoft/fluentui/pull/21960) by seanmonahan@microsoft.com)
|
|
40
|
+
- add missing dependencies ([PR #21924](https://github.com/microsoft/fluentui/pull/21924) by martinhochel@microsoft.com)
|
|
41
|
+
- update react-icons version to ^2.0.166-rc.3 from ^2.0.159-beta.10 ([PR #22512](https://github.com/microsoft/fluentui/pull/22512) by seanmonahan@microsoft.com)
|
|
42
|
+
- chore: Update Griffel to latest version ([PR #21976](https://github.com/microsoft/fluentui/pull/21976) by olfedias@microsoft.com)
|
|
43
|
+
- Bump @fluentui/react-aria to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
44
|
+
- Bump @fluentui/react-context-selector to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
45
|
+
- Bump @fluentui/react-shared-contexts to v9.0.0-rc.5 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
46
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
47
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.5 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
48
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
49
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
|
50
|
+
|
|
7
51
|
## [9.0.0-rc.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-accordion_v9.0.0-rc.5)
|
|
8
52
|
|
|
9
|
-
Fri, 04 Mar 2022 05:
|
|
53
|
+
Fri, 04 Mar 2022 05:17:33 GMT
|
|
10
54
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-accordion_v9.0.0-rc.4..@fluentui/react-accordion_v9.0.0-rc.5)
|
|
11
55
|
|
|
12
56
|
### Changes
|
|
@@ -5,14 +5,20 @@ import type { Context } from '@fluentui/react-context-selector';
|
|
|
5
5
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
|
6
6
|
import * as React_2 from 'react';
|
|
7
7
|
import type { Slot } from '@fluentui/react-utilities';
|
|
8
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
8
9
|
|
|
9
10
|
/**
|
|
10
11
|
* Define a styled Accordion, using the `useAccordion_unstable` and `useAccordionStyles_unstable` hooks.
|
|
11
12
|
*/
|
|
12
13
|
export declare const Accordion: ForwardRefComponent<AccordionProps>;
|
|
13
14
|
|
|
15
|
+
/**
|
|
16
|
+
* @deprecated Use `accordionClassNames.root` instead.
|
|
17
|
+
*/
|
|
14
18
|
export declare const accordionClassName = "fui-Accordion";
|
|
15
19
|
|
|
20
|
+
export declare const accordionClassNames: SlotClassNames<AccordionSlots>;
|
|
21
|
+
|
|
16
22
|
declare type AccordionCommons = {
|
|
17
23
|
/**
|
|
18
24
|
* Indicates if keyboard navigation is available and gives two options,
|
|
@@ -53,8 +59,13 @@ export declare type AccordionContextValues = {
|
|
|
53
59
|
*/
|
|
54
60
|
export declare const AccordionHeader: ForwardRefComponent<AccordionHeaderProps>;
|
|
55
61
|
|
|
62
|
+
/**
|
|
63
|
+
* @deprecated Use `accordionHeaderClassNames.root` instead.
|
|
64
|
+
*/
|
|
56
65
|
export declare const accordionHeaderClassName = "fui-AccordionHeader";
|
|
57
66
|
|
|
67
|
+
export declare const accordionHeaderClassNames: SlotClassNames<AccordionHeaderSlots>;
|
|
68
|
+
|
|
58
69
|
declare type AccordionHeaderCommons = {
|
|
59
70
|
/**
|
|
60
71
|
* Size of spacing in the heading
|
|
@@ -115,8 +126,13 @@ export declare type AccordionIndex = number | number[];
|
|
|
115
126
|
*/
|
|
116
127
|
export declare const AccordionItem: ForwardRefComponent<AccordionItemProps>;
|
|
117
128
|
|
|
129
|
+
/**
|
|
130
|
+
* @deprecated Use `accordionItemClassNames.root` instead.
|
|
131
|
+
*/
|
|
118
132
|
export declare const accordionItemClassName = "fui-AccordionItem";
|
|
119
133
|
|
|
134
|
+
export declare const accordionItemClassNames: SlotClassNames<AccordionItemSlots>;
|
|
135
|
+
|
|
120
136
|
declare type AccordionItemCommons = {
|
|
121
137
|
/**
|
|
122
138
|
* Disables opening/closing of panel
|
|
@@ -154,8 +170,13 @@ export declare type AccordionItemValue = unknown;
|
|
|
154
170
|
*/
|
|
155
171
|
export declare const AccordionPanel: ForwardRefComponent<AccordionPanelProps>;
|
|
156
172
|
|
|
173
|
+
/**
|
|
174
|
+
* @deprecated Use `accordionPanelClassNames.root` instead.
|
|
175
|
+
*/
|
|
157
176
|
export declare const accordionPanelClassName = "fui-AccordionPanel";
|
|
158
177
|
|
|
178
|
+
export declare const accordionPanelClassNames: SlotClassNames<AccordionPanelSlots>;
|
|
179
|
+
|
|
159
180
|
export declare type AccordionPanelProps = ComponentProps<AccordionPanelSlots>;
|
|
160
181
|
|
|
161
182
|
export declare type AccordionPanelSlots = {
|
|
@@ -25,7 +25,8 @@ export const useAccordion_unstable = (props, ref) => {
|
|
|
25
25
|
initialState: []
|
|
26
26
|
});
|
|
27
27
|
const arrowNavigationProps = useArrowNavigationGroup({
|
|
28
|
-
circular: navigation === 'circular'
|
|
28
|
+
circular: navigation === 'circular',
|
|
29
|
+
tabbable: true
|
|
29
30
|
});
|
|
30
31
|
const requestToggle = useEventCallback((event, data) => {
|
|
31
32
|
onToggle === null || onToggle === void 0 ? void 0 : onToggle(event, data);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Accordion/useAccordion.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,oBAAhC,EAAsD,gBAAtD,QAA8E,2BAA9E;AAGA,SAAS,uBAAT,QAAwC,yBAAxC;AAEA;;;;AAIG;;AACH,OAAO,MAAM,qBAAqB,GAAG,CAAC,KAAD,EAAwB,GAAxB,KAAuE;AAC1G,QAAM;AACJ,IAAA,SAAS,EAAE,mBADP;AAEJ,IAAA,gBAFI;AAGJ,IAAA,QAAQ,GAAG,KAHP;AAIJ,IAAA,WAAW,GAAG,KAJV;AAKJ,IAAA,QALI;AAMJ,IAAA;AANI,MAOF,KAPJ;AAQA,QAAM,CAAC,SAAD,EAAY,YAAZ,IAA4B,oBAAoB,CAAC;AACrD,IAAA,KAAK,EAAE,KAAK,CAAC,OAAN,CAAc,MAAM,eAAe,CAAC,mBAAD,CAAnC,EAA0D,CAAC,mBAAD,CAA1D,CAD8C;AAErD,IAAA,YAAY,EAAE,MAAM,+BAA+B,CAAC;AAAE,MAAA,gBAAF;AAAoB,MAAA;AAApB,KAAD,CAFE;AAGrD,IAAA,YAAY,EAAE;AAHuC,GAAD,CAAtD;AAMA,QAAM,oBAAoB,GAAG,uBAAuB,CAAC;AACnD,IAAA,QAAQ,EAAE,UAAU,KAAK;
|
|
1
|
+
{"version":3,"sources":["components/Accordion/useAccordion.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { AccordionProps, AccordionState, AccordionToggleData, AccordionToggleEvent } from './Accordion.types';\nimport type { AccordionItemValue } from '../AccordionItem/AccordionItem.types';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\n\n/**\n * Returns the props and state required to render the component\n * @param props - Accordion properties\n * @param ref - reference to root HTMLElement of Accordion\n */\nexport const useAccordion_unstable = (props: AccordionProps, ref: React.Ref<HTMLElement>): AccordionState => {\n const {\n openItems: controlledOpenItems,\n defaultOpenItems,\n multiple = false,\n collapsible = false,\n onToggle,\n navigation,\n } = props;\n const [openItems, setOpenItems] = useControllableState({\n state: React.useMemo(() => normalizeValues(controlledOpenItems), [controlledOpenItems]),\n defaultState: () => initializeUncontrolledOpenItems({ defaultOpenItems, multiple }),\n initialState: [],\n });\n\n const arrowNavigationProps = useArrowNavigationGroup({\n circular: navigation === 'circular',\n tabbable: true,\n });\n\n const requestToggle = useEventCallback((event: AccordionToggleEvent, data: AccordionToggleData) => {\n onToggle?.(event, data);\n setOpenItems(previousOpenItems =>\n updateOpenItems(data.value, previousOpenItems, {\n collapsible,\n multiple,\n }),\n );\n });\n\n return {\n multiple,\n collapsible,\n navigation,\n openItems,\n requestToggle,\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ...props,\n ...(navigation ? arrowNavigationProps : {}),\n ref,\n }),\n };\n};\n\n/**\n * Initial value for the uncontrolled case of the list of open indexes\n */\nfunction initializeUncontrolledOpenItems({\n defaultOpenItems,\n multiple,\n}: Pick<AccordionProps, 'defaultOpenItems' | 'multiple'>): AccordionItemValue[] {\n if (defaultOpenItems !== undefined) {\n if (Array.isArray(defaultOpenItems)) {\n return multiple ? defaultOpenItems : [defaultOpenItems[0]];\n }\n return [defaultOpenItems];\n }\n return [];\n}\n\n/**\n * Updates the list of open indexes based on an index that changes\n * @param value - the index that will change\n * @param previousOpenItems - list of current open indexes\n * @param param2 - {multiple, collapsible}\n */\nfunction updateOpenItems(\n value: AccordionItemValue,\n previousOpenItems: AccordionItemValue[],\n { multiple, collapsible }: Pick<AccordionState, 'multiple' | 'collapsible'>,\n) {\n if (multiple) {\n if (previousOpenItems.includes(value)) {\n if (previousOpenItems.length > 1 || collapsible) {\n return previousOpenItems.filter(i => i !== value);\n }\n } else {\n return [...previousOpenItems, value].sort();\n }\n } else {\n return previousOpenItems[0] === value && collapsible ? [] : [value];\n }\n return previousOpenItems;\n}\n\n/**\n * Normalizes Accordion index into an array of indexes\n */\nfunction normalizeValues(index?: AccordionItemValue | AccordionItemValue[]): AccordionItemValue[] | undefined {\n if (index === undefined) {\n return undefined;\n }\n return Array.isArray(index) ? index : [index];\n}\n"],"sourceRoot":"../src/"}
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
2
|
+
import type { AccordionSlots, AccordionState } from './Accordion.types';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `accordionClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const accordionClassName = "fui-Accordion";
|
|
7
|
+
export declare const accordionClassNames: SlotClassNames<AccordionSlots>;
|
|
3
8
|
export declare const useAccordionStyles_unstable: (state: AccordionState) => AccordionState;
|
|
@@ -1,7 +1,14 @@
|
|
|
1
1
|
import { mergeClasses } from '@griffel/react';
|
|
2
|
+
/**
|
|
3
|
+
* @deprecated Use `accordionClassNames.root` instead.
|
|
4
|
+
*/
|
|
5
|
+
|
|
2
6
|
export const accordionClassName = 'fui-Accordion';
|
|
7
|
+
export const accordionClassNames = {
|
|
8
|
+
root: 'fui-Accordion'
|
|
9
|
+
};
|
|
3
10
|
export const useAccordionStyles_unstable = state => {
|
|
4
|
-
state.root.className = mergeClasses(
|
|
11
|
+
state.root.className = mergeClasses(accordionClassNames.root, state.root.className);
|
|
5
12
|
return state;
|
|
6
13
|
};
|
|
7
14
|
//# sourceMappingURL=useAccordionStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Accordion/useAccordionStyles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["components/Accordion/useAccordionStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AAGA;;AAEG;;AACH,OAAO,MAAM,kBAAkB,GAAG,eAA3B;AACP,OAAO,MAAM,mBAAmB,GAAmC;AACjE,EAAA,IAAI,EAAE;AAD2D,CAA5D;AAIP,OAAO,MAAM,2BAA2B,GAAI,KAAD,IAA0B;AACnE,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,mBAAmB,CAAC,IAArB,EAA2B,KAAK,CAAC,IAAN,CAAW,SAAtC,CAAnC;AAEA,SAAO,KAAP;AACD,CAJM","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { AccordionSlots, AccordionState } from './Accordion.types';\n\n/**\n * @deprecated Use `accordionClassNames.root` instead.\n */\nexport const accordionClassName = 'fui-Accordion';\nexport const accordionClassNames: SlotClassNames<AccordionSlots> = {\n root: 'fui-Accordion',\n};\n\nexport const useAccordionStyles_unstable = (state: AccordionState) => {\n state.root.className = mergeClasses(accordionClassNames.root, state.root.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,4 +1,9 @@
|
|
|
1
|
-
import type { AccordionHeaderState } from './AccordionHeader.types';
|
|
1
|
+
import type { AccordionHeaderSlots, AccordionHeaderState } from './AccordionHeader.types';
|
|
2
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `accordionHeaderClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const accordionHeaderClassName = "fui-AccordionHeader";
|
|
7
|
+
export declare const accordionHeaderClassNames: SlotClassNames<AccordionHeaderSlots>;
|
|
3
8
|
/** Applies style classnames to slots */
|
|
4
9
|
export declare const useAccordionHeaderStyles_unstable: (state: AccordionHeaderState) => AccordionHeaderState;
|
|
@@ -1,7 +1,17 @@
|
|
|
1
1
|
import { shorthands, __styles, mergeClasses } from '@griffel/react';
|
|
2
2
|
import { createFocusOutlineStyle } from '@fluentui/react-tabster';
|
|
3
3
|
import { tokens } from '@fluentui/react-theme';
|
|
4
|
+
/**
|
|
5
|
+
* @deprecated Use `accordionHeaderClassNames.root` instead.
|
|
6
|
+
*/
|
|
7
|
+
|
|
4
8
|
export const accordionHeaderClassName = 'fui-AccordionHeader';
|
|
9
|
+
export const accordionHeaderClassNames = {
|
|
10
|
+
root: 'fui-AccordionHeader',
|
|
11
|
+
button: 'fui-AccordionHeader__button',
|
|
12
|
+
expandIcon: 'fui-AccordionHeader__expandIcon',
|
|
13
|
+
icon: 'fui-AccordionHeader__icon'
|
|
14
|
+
};
|
|
5
15
|
|
|
6
16
|
const useStyles = /*#__PURE__*/__styles({
|
|
7
17
|
"resetButton": {
|
|
@@ -23,16 +33,30 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
23
33
|
},
|
|
24
34
|
"focusIndicator": {
|
|
25
35
|
"B486eqv": "f2hkw1w",
|
|
26
|
-
"
|
|
36
|
+
"Bnmjwt4": "flfsvnh",
|
|
37
|
+
"Jopkrh": ["f1781m5e", "flvaaa9"],
|
|
38
|
+
"hhrs2v": "f50u1b5",
|
|
39
|
+
"B7jbng7": ["flvaaa9", "f1781m5e"],
|
|
27
40
|
"e8izhr": "f1pxpxw8",
|
|
28
41
|
"in3gf6": "f1149fnl",
|
|
29
42
|
"B1i23sz": "fd1orka",
|
|
30
|
-
"ln9as": "fgtqheg",
|
|
31
43
|
"Bfgg0yq": "fq7mjg8",
|
|
32
|
-
"
|
|
33
|
-
"
|
|
34
|
-
"
|
|
35
|
-
"
|
|
44
|
+
"B7231uf": "fmqgchs",
|
|
45
|
+
"Bxoolf0": ["f1lv6wi8", "famjx04"],
|
|
46
|
+
"fo1iai": "f1nbyjd2",
|
|
47
|
+
"Bh81ga8": ["famjx04", "f1lv6wi8"],
|
|
48
|
+
"qztvpn": "f5n18is",
|
|
49
|
+
"ge3ubn": ["f13az7yk", "f14kwzu1"],
|
|
50
|
+
"F41yt0": "fneogx5",
|
|
51
|
+
"Bxrdl85": ["f14kwzu1", "f13az7yk"],
|
|
52
|
+
"Bb63s14": ["f1f0b0sl", "flsib9d"],
|
|
53
|
+
"Ikxprv": ["flsib9d", "f1f0b0sl"],
|
|
54
|
+
"Bhxvgo6": ["fbewl49", "fs55jlu"],
|
|
55
|
+
"J01dyq": ["fs55jlu", "fbewl49"],
|
|
56
|
+
"hzsgvt": "f1f43d5r",
|
|
57
|
+
"Ba9tnbb": ["f1ib27sc", "f14s7j5v"],
|
|
58
|
+
"Fpkomr": "f13oqbgc",
|
|
59
|
+
"Bttdqvk": ["f14s7j5v", "f1ib27sc"],
|
|
36
60
|
"Bl8qd6i": "f1284xzw",
|
|
37
61
|
"Byzgy54": "f14dru39",
|
|
38
62
|
"mq8cyt": ["fvabyfg", "f12y1wz2"],
|
|
@@ -117,7 +141,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
117
141
|
"Frg6f3": ["f1oou7ox", "f1pxv85q"]
|
|
118
142
|
}
|
|
119
143
|
}, {
|
|
120
|
-
"d": [".f1e4lqlz{box-sizing:content-box;}", ".f1u2r49w{background-color:inherit;}", ".f1ym3bx4{color:inherit;}", ".f1mo0ibp{font-family:inherit;}", ".fjoy568{font-size:inherit;}", ".fytdu2e{line-height:normal;}", ".f1mtd64y{overflow-x:visible;}", ".f1y7q3j9{overflow-y:visible;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f37px4s{-webkit-appearance:button;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".fgusgyc{text-align:unset;}", "[data-keyboard-nav] .
|
|
144
|
+
"d": [".f1e4lqlz{box-sizing:content-box;}", ".f1u2r49w{background-color:inherit;}", ".f1ym3bx4{color:inherit;}", ".f1mo0ibp{font-family:inherit;}", ".fjoy568{font-size:inherit;}", ".fytdu2e{line-height:normal;}", ".f1mtd64y{overflow-x:visible;}", ".f1y7q3j9{overflow-y:visible;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f37px4s{-webkit-appearance:button;}", ".f1xqy1su{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}", ".fgusgyc{text-align:unset;}", "[data-keyboard-nav] .flfsvnh:focus{border-top-color:transparent;}", "[data-keyboard-nav] .f1781m5e:focus{border-right-color:transparent;}", "[data-keyboard-nav] .flvaaa9:focus{border-left-color:transparent;}", "[data-keyboard-nav] .f50u1b5:focus{border-bottom-color:transparent;}", "[data-keyboard-nav] .f1pxpxw8:focus:after{content:\"\";}", "[data-keyboard-nav] .f1149fnl:focus:after{position:absolute;}", "[data-keyboard-nav] .fd1orka:focus:after{pointer-events:none;}", "[data-keyboard-nav] .fq7mjg8:focus:after{z-index:1;}", "[data-keyboard-nav] .fmqgchs:focus:after{border-top-style:solid;}", "[data-keyboard-nav] .f1lv6wi8:focus:after{border-right-style:solid;}", "[data-keyboard-nav] .famjx04:focus:after{border-left-style:solid;}", "[data-keyboard-nav] .f1nbyjd2:focus:after{border-bottom-style:solid;}", "[data-keyboard-nav] .f5n18is:focus:after{border-top-width:2px;}", "[data-keyboard-nav] .f13az7yk:focus:after{border-right-width:2px;}", "[data-keyboard-nav] .f14kwzu1:focus:after{border-left-width:2px;}", "[data-keyboard-nav] .fneogx5:focus:after{border-bottom-width:2px;}", "[data-keyboard-nav] .f1f0b0sl:focus:after{border-bottom-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .flsib9d:focus:after{border-bottom-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fbewl49:focus:after{border-top-right-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .fs55jlu:focus:after{border-top-left-radius:var(--borderRadiusMedium);}", "[data-keyboard-nav] .f1f43d5r:focus:after{border-top-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1ib27sc:focus:after{border-right-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f14s7j5v:focus:after{border-left-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f13oqbgc:focus:after{border-bottom-color:var(--colorStrokeFocus2);}", "[data-keyboard-nav] .f1284xzw:focus:after{top:-2px;}", "[data-keyboard-nav] .f14dru39:focus:after{bottom:-2px;}", "[data-keyboard-nav] .fvabyfg:focus:after{left:-2px;}", "[data-keyboard-nav] .f12y1wz2:focus:after{right:-2px;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f2i1086{border-bottom-right-radius:2px;}", ".f1rlsnju{border-bottom-left-radius:2px;}", ".f1stktl2{border-top-right-radius:2px;}", ".f1127022{border-top-left-radius:2px;}", ".fwrgwhw{background-image:none;}", ".f1s2aq7o{color:var(--colorNeutralForegroundDisabled);}", ".f14t3ns0{display:inline-block;}", ".f10pi13n{position:relative;}", ".f1wfwcyy{width:calc(100% - 22px);}", ".f5ogflp{border-top-width:1px;}", ".f1hqa2wf{border-right-width:1px;}", ".finvdd3{border-left-width:1px;}", ".f1f09k3d{border-bottom-width:1px;}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1p3nwhy{border-top-color:transparent;}", ".f11589ue{border-right-color:transparent;}", ".f1pdflbu{border-left-color:transparent;}", ".f1q5o8ev{border-bottom-color:transparent;}", ".f81rol6{padding-right:10px;}", ".frdkuqy{padding-left:10px;}", ".f1ft4266{height:44px;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f1k6fduh{cursor:pointer;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f1d2rq10{height:32px;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".fez10in{line-height:0;}", ".fe5j1ua{font-size:20px;}", ".f19lj068{padding-right:8px;}", ".f177v4lu{padding-left:8px;}", ".fqerorx{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".f1neuvcm{-webkit-flex-shrink:1;-ms-flex-negative:1;flex-shrink:1;}", ".flqd7gy{-webkit-flex-basis:0%;-ms-flex-preferred-size:0%;flex-basis:0%;}", ".f9c4gz4{-webkit-box-pack:end;-ms-flex-pack:end;-webkit-justify-content:flex-end;justify-content:flex-end;}", ".f1phki43{margin-right:8px;}", ".ff9s3yw{margin-left:8px;}", ".f1oou7ox{margin-left:10px;}", ".f1pxv85q{margin-right:10px;}"],
|
|
121
145
|
"i": [".f2hkw1w:focus-visible{outline-style:none;}"]
|
|
122
146
|
});
|
|
123
147
|
/** Applies style classnames to slots */
|
|
@@ -125,15 +149,15 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
125
149
|
|
|
126
150
|
export const useAccordionHeaderStyles_unstable = state => {
|
|
127
151
|
const styles = useStyles();
|
|
128
|
-
state.root.className = mergeClasses(
|
|
129
|
-
state.button.className = mergeClasses(styles.resetButton, styles.button, styles.focusIndicator, state.inline && styles.buttonInline, state.size === 'small' && styles.buttonSmall, state.size === 'large' && styles.buttonLarge, state.size === 'extra-large' && styles.buttonExtraLarge, state.button.className);
|
|
152
|
+
state.root.className = mergeClasses(accordionHeaderClassNames.root, styles.root, state.inline && styles.rootInline, state.disabled && styles.rootDisabled, state.root.className);
|
|
153
|
+
state.button.className = mergeClasses(accordionHeaderClassNames.button, styles.resetButton, styles.button, styles.focusIndicator, state.inline && styles.buttonInline, state.size === 'small' && styles.buttonSmall, state.size === 'large' && styles.buttonLarge, state.size === 'extra-large' && styles.buttonExtraLarge, state.button.className);
|
|
130
154
|
|
|
131
155
|
if (state.expandIcon) {
|
|
132
|
-
state.expandIcon.className = mergeClasses(styles.expandIcon, state.expandIconPosition === 'start' && styles.expandIconStart, state.expandIconPosition === 'end' && styles.expandIconEnd, state.expandIcon.className);
|
|
156
|
+
state.expandIcon.className = mergeClasses(accordionHeaderClassNames.expandIcon, styles.expandIcon, state.expandIconPosition === 'start' && styles.expandIconStart, state.expandIconPosition === 'end' && styles.expandIconEnd, state.expandIcon.className);
|
|
133
157
|
}
|
|
134
158
|
|
|
135
159
|
if (state.icon) {
|
|
136
|
-
state.icon.className = mergeClasses(styles.icon, state.expandIconPosition === 'end' && styles.iconExpandIconEnd, state.icon.className);
|
|
160
|
+
state.icon.className = mergeClasses(accordionHeaderClassNames.icon, styles.icon, state.expandIconPosition === 'end' && styles.iconExpandIconEnd, state.icon.className);
|
|
137
161
|
}
|
|
138
162
|
|
|
139
163
|
return state;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/AccordionHeader/useAccordionHeaderStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,YAAiC,YAAjC,QAAqD,gBAArD;AACA,SAAS,uBAAT,QAAwC,yBAAxC;AACA,SAAS,MAAT,QAAuB,uBAAvB;
|
|
1
|
+
{"version":3,"sources":["components/AccordionHeader/useAccordionHeaderStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { AccordionHeaderSlots, AccordionHeaderState } from './AccordionHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `accordionHeaderClassNames.root` instead.\n */\nexport const accordionHeaderClassName = 'fui-AccordionHeader';\nexport const accordionHeaderClassNames: SlotClassNames<AccordionHeaderSlots> = {\n root: 'fui-AccordionHeader',\n button: 'fui-AccordionHeader__button',\n expandIcon: 'fui-AccordionHeader__expandIcon',\n icon: 'fui-AccordionHeader__icon',\n};\n\nconst useStyles = makeStyles({\n // TODO: this should be extracted to another package\n resetButton: {\n boxSizing: 'content-box',\n backgroundColor: 'inherit',\n color: 'inherit',\n fontFamily: 'inherit',\n fontSize: 'inherit',\n lineHeight: 'normal',\n ...shorthands.overflow('visible'),\n ...shorthands.padding(0),\n WebkitAppearance: 'button',\n userSelect: 'none',\n textAlign: 'unset',\n },\n focusIndicator: createFocusOutlineStyle(),\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n ...shorthands.margin(0),\n ...shorthands.borderRadius('2px'),\n },\n rootDisabled: {\n backgroundImage: 'none',\n color: tokens.colorNeutralForegroundDisabled,\n },\n rootInline: {\n display: 'inline-block',\n },\n button: {\n position: 'relative',\n width: 'calc(100% - 22px)',\n ...shorthands.border('1px', 'solid', 'transparent'),\n paddingRight: '10px',\n paddingLeft: '10px',\n height: '44px',\n display: 'flex',\n alignItems: 'center',\n cursor: 'pointer',\n fontSize: tokens.fontSizeBase300,\n fontFamily: tokens.fontFamilyBase,\n },\n buttonSmall: {\n height: '32px',\n fontSize: tokens.fontSizeBase200,\n },\n buttonLarge: {\n fontSize: tokens.fontSizeBase400,\n },\n buttonExtraLarge: {\n fontSize: tokens.fontSizeBase500,\n },\n buttonInline: {\n display: 'inline-flex',\n },\n expandIcon: {\n lineHeight: '0',\n fontSize: '20px',\n },\n expandIconStart: {\n paddingRight: '8px',\n },\n expandIconEnd: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: '0%',\n display: 'flex',\n justifyContent: 'flex-end',\n paddingLeft: '8px',\n },\n icon: {\n marginRight: '8px',\n fontSize: '20px',\n },\n iconExpandIconEnd: {\n marginLeft: '10px',\n },\n});\n\n/** Applies style classnames to slots */\nexport const useAccordionHeaderStyles_unstable = (state: AccordionHeaderState) => {\n const styles = useStyles();\n state.root.className = mergeClasses(\n accordionHeaderClassNames.root,\n styles.root,\n state.inline && styles.rootInline,\n state.disabled && styles.rootDisabled,\n state.root.className,\n );\n\n state.button.className = mergeClasses(\n accordionHeaderClassNames.button,\n styles.resetButton,\n styles.button,\n styles.focusIndicator,\n state.inline && styles.buttonInline,\n state.size === 'small' && styles.buttonSmall,\n state.size === 'large' && styles.buttonLarge,\n state.size === 'extra-large' && styles.buttonExtraLarge,\n state.button.className,\n );\n\n if (state.expandIcon) {\n state.expandIcon.className = mergeClasses(\n accordionHeaderClassNames.expandIcon,\n styles.expandIcon,\n state.expandIconPosition === 'start' && styles.expandIconStart,\n state.expandIconPosition === 'end' && styles.expandIconEnd,\n state.expandIcon.className,\n );\n }\n if (state.icon) {\n state.icon.className = mergeClasses(\n accordionHeaderClassNames.icon,\n styles.icon,\n state.expandIconPosition === 'end' && styles.iconExpandIconEnd,\n state.icon.className,\n );\n }\n return state;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { getNativeElementProps } from '@fluentui/react-utilities';
|
|
3
|
-
import { useFocusableGroup } from '@fluentui/react-tabster';
|
|
4
3
|
import { useContextSelector } from '@fluentui/react-context-selector';
|
|
5
4
|
import { AccordionContext } from '../Accordion/AccordionContext';
|
|
6
5
|
/**
|
|
@@ -14,8 +13,6 @@ export const useAccordionItem_unstable = (props, ref) => {
|
|
|
14
13
|
value,
|
|
15
14
|
disabled = false
|
|
16
15
|
} = props;
|
|
17
|
-
const navigation = useContextSelector(AccordionContext, ctx => ctx.navigation);
|
|
18
|
-
const focusableProps = useFocusableGroup();
|
|
19
16
|
const requestToggle = useContextSelector(AccordionContext, ctx => ctx.requestToggle);
|
|
20
17
|
const open = useContextSelector(AccordionContext, ctx => ctx.openItems.includes(value));
|
|
21
18
|
const onAccordionHeaderClick = React.useCallback(ev => requestToggle(ev, {
|
|
@@ -31,8 +28,7 @@ export const useAccordionItem_unstable = (props, ref) => {
|
|
|
31
28
|
},
|
|
32
29
|
root: getNativeElementProps('div', {
|
|
33
30
|
ref: ref,
|
|
34
|
-
...props
|
|
35
|
-
...(navigation && focusableProps)
|
|
31
|
+
...props
|
|
36
32
|
})
|
|
37
33
|
};
|
|
38
34
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/AccordionItem/useAccordionItem.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,2BAAtC;AACA,SAAS,
|
|
1
|
+
{"version":3,"sources":["components/AccordionItem/useAccordionItem.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,2BAAtC;AACA,SAAS,kBAAT,QAAmC,kCAAnC;AACA,SAAS,gBAAT,QAAiC,+BAAjC;AAIA;;;;AAIG;;AACH,OAAO,MAAM,yBAAyB,GAAG,CACvC,KADuC,EAEvC,GAFuC,KAGjB;AACtB,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA,QAAQ,GAAG;AAApB,MAA8B,KAApC;AAEA,QAAM,aAAa,GAAG,kBAAkB,CAAC,gBAAD,EAAmB,GAAG,IAAI,GAAG,CAAC,aAA9B,CAAxC;AACA,QAAM,IAAI,GAAG,kBAAkB,CAAC,gBAAD,EAAmB,GAAG,IAAI,GAAG,CAAC,SAAJ,CAAc,QAAd,CAAuB,KAAvB,CAA1B,CAA/B;AACA,QAAM,sBAAsB,GAAG,KAAK,CAAC,WAAN,CAAmB,EAAD,IAA8B,aAAa,CAAC,EAAD,EAAK;AAAE,IAAA;AAAF,GAAL,CAA7D,EAA8E,CAC3G,aAD2G,EAE3G,KAF2G,CAA9E,CAA/B;AAKA,SAAO;AACL,IAAA,IADK;AAEL,IAAA,KAFK;AAGL,IAAA,QAHK;AAIL,IAAA,aAAa,EAAE,sBAJV;AAKL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KALP;AAQL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ;AACjC,MAAA,GAAG,EAAE,GAD4B;AAEjC,SAAG;AAF8B,KAAR;AARtB,GAAP;AAaD,CA1BM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps } from '@fluentui/react-utilities';\nimport { useContextSelector } from '@fluentui/react-context-selector';\nimport { AccordionContext } from '../Accordion/AccordionContext';\nimport type { AccordionItemProps, AccordionItemState } from './AccordionItem.types';\nimport type { AccordionToggleEvent } from '../Accordion/Accordion.types';\n\n/**\n * Returns the props and state required to render the component\n * @param props - AccordionItem properties\n * @param ref - reference to root HTMLElement of AccordionItem\n */\nexport const useAccordionItem_unstable = (\n props: AccordionItemProps,\n ref: React.Ref<HTMLElement>,\n): AccordionItemState => {\n const { value, disabled = false } = props;\n\n const requestToggle = useContextSelector(AccordionContext, ctx => ctx.requestToggle);\n const open = useContextSelector(AccordionContext, ctx => ctx.openItems.includes(value));\n const onAccordionHeaderClick = React.useCallback((ev: AccordionToggleEvent) => requestToggle(ev, { value }), [\n requestToggle,\n value,\n ]);\n\n return {\n open,\n value,\n disabled,\n onHeaderClick: onAccordionHeaderClick,\n components: {\n root: 'div',\n },\n root: getNativeElementProps('div', {\n ref: ref,\n ...props,\n }),\n };\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,3 +1,8 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
2
|
+
import type { AccordionItemSlots, AccordionItemState } from './AccordionItem.types';
|
|
3
|
+
/**
|
|
4
|
+
* @deprecated Use `accordionItemClassNames.root` instead.
|
|
5
|
+
*/
|
|
2
6
|
export declare const accordionItemClassName = "fui-AccordionItem";
|
|
7
|
+
export declare const accordionItemClassNames: SlotClassNames<AccordionItemSlots>;
|
|
3
8
|
export declare const useAccordionItemStyles_unstable: (state: AccordionItemState) => AccordionItemState;
|
|
@@ -1,7 +1,14 @@
|
|
|
1
1
|
import { mergeClasses } from '@griffel/react';
|
|
2
|
+
/**
|
|
3
|
+
* @deprecated Use `accordionItemClassNames.root` instead.
|
|
4
|
+
*/
|
|
5
|
+
|
|
2
6
|
export const accordionItemClassName = 'fui-AccordionItem';
|
|
7
|
+
export const accordionItemClassNames = {
|
|
8
|
+
root: 'fui-AccordionItem'
|
|
9
|
+
};
|
|
3
10
|
export const useAccordionItemStyles_unstable = state => {
|
|
4
|
-
state.root.className = mergeClasses(
|
|
11
|
+
state.root.className = mergeClasses(accordionItemClassNames.root, state.root.className);
|
|
5
12
|
return state;
|
|
6
13
|
};
|
|
7
14
|
//# sourceMappingURL=useAccordionItemStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/AccordionItem/useAccordionItemStyles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["components/AccordionItem/useAccordionItemStyles.ts"],"names":[],"mappings":"AACA,SAAS,YAAT,QAA6B,gBAA7B;AAGA;;AAEG;;AACH,OAAO,MAAM,sBAAsB,GAAG,mBAA/B;AACP,OAAO,MAAM,uBAAuB,GAAuC;AACzE,EAAA,IAAI,EAAE;AADmE,CAApE;AAIP,OAAO,MAAM,+BAA+B,GAAI,KAAD,IAA8B;AAC3E,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CAAC,uBAAuB,CAAC,IAAzB,EAA+B,KAAK,CAAC,IAAN,CAAW,SAA1C,CAAnC;AAEA,SAAO,KAAP;AACD,CAJM","sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { mergeClasses } from '@griffel/react';\nimport type { AccordionItemSlots, AccordionItemState } from './AccordionItem.types';\n\n/**\n * @deprecated Use `accordionItemClassNames.root` instead.\n */\nexport const accordionItemClassName = 'fui-AccordionItem';\nexport const accordionItemClassNames: SlotClassNames<AccordionItemSlots> = {\n root: 'fui-AccordionItem',\n};\n\nexport const useAccordionItemStyles_unstable = (state: AccordionItemState) => {\n state.root.className = mergeClasses(accordionItemClassNames.root, state.root.className);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import { getNativeElementProps } from '@fluentui/react-utilities';
|
|
2
|
+
import { useTabsterAttributes } from '@fluentui/react-tabster';
|
|
2
3
|
import { useAccordionItemContext_unstable } from '../AccordionItem/index';
|
|
4
|
+
import { useContextSelector } from '@fluentui/react-context-selector';
|
|
5
|
+
import { AccordionContext } from '../Accordion/AccordionContext';
|
|
3
6
|
/**
|
|
4
7
|
* Returns the props and state required to render the component
|
|
5
8
|
* @param props - AccordionPanel properties
|
|
@@ -10,6 +13,12 @@ export const useAccordionPanel_unstable = (props, ref) => {
|
|
|
10
13
|
const {
|
|
11
14
|
open
|
|
12
15
|
} = useAccordionItemContext_unstable();
|
|
16
|
+
const focusableProps = useTabsterAttributes({
|
|
17
|
+
focusable: {
|
|
18
|
+
excludeFromMover: true
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
const navigation = useContextSelector(AccordionContext, ctx => ctx.navigation);
|
|
13
22
|
return {
|
|
14
23
|
open,
|
|
15
24
|
components: {
|
|
@@ -17,7 +26,8 @@ export const useAccordionPanel_unstable = (props, ref) => {
|
|
|
17
26
|
},
|
|
18
27
|
root: getNativeElementProps('div', {
|
|
19
28
|
ref,
|
|
20
|
-
...props
|
|
29
|
+
...props,
|
|
30
|
+
...(navigation && focusableProps)
|
|
21
31
|
})
|
|
22
32
|
};
|
|
23
33
|
};
|