@fluentui/react-radio 9.0.0-beta.3 → 9.0.0-rc.2
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +155 -6
- package/CHANGELOG.md +57 -14
- package/README.md +43 -0
- package/dist/{react-radio.d.ts → index.d.ts} +17 -8
- package/lib/components/Radio/Radio.types.d.ts +1 -1
- package/lib/components/Radio/Radio.types.js.map +1 -1
- package/lib/components/Radio/useRadio.js +15 -9
- package/lib/components/Radio/useRadio.js.map +1 -1
- package/lib/components/RadioGroup/RadioGroup.js +3 -1
- package/lib/components/RadioGroup/RadioGroup.js.map +1 -1
- package/lib/components/RadioGroup/RadioGroup.types.d.ts +9 -4
- package/lib/components/RadioGroup/RadioGroup.types.js.map +1 -1
- package/lib/components/RadioGroup/renderRadioGroup.d.ts +2 -2
- package/lib/components/RadioGroup/renderRadioGroup.js +2 -2
- package/lib/components/RadioGroup/renderRadioGroup.js.map +1 -1
- package/lib/components/RadioGroup/useRadioGroup.js +7 -9
- package/lib/components/RadioGroup/useRadioGroup.js.map +1 -1
- package/lib/contexts/RadioGroupContext.d.ts +3 -4
- package/lib/contexts/RadioGroupContext.js +2 -2
- package/lib/contexts/RadioGroupContext.js.map +1 -1
- package/lib/contexts/index.d.ts +2 -0
- package/lib/contexts/index.js +3 -0
- package/lib/contexts/index.js.map +1 -0
- package/lib/contexts/useRadioGroupContextValues.d.ts +2 -0
- package/lib/contexts/useRadioGroupContextValues.js +22 -0
- package/lib/contexts/useRadioGroupContextValues.js.map +1 -0
- package/lib/index.d.ts +2 -3
- package/lib/index.js +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Radio/Radio.types.d.ts +1 -1
- package/lib-commonjs/components/Radio/useRadio.js +16 -9
- package/lib-commonjs/components/Radio/useRadio.js.map +1 -1
- package/lib-commonjs/components/RadioGroup/RadioGroup.js +4 -1
- package/lib-commonjs/components/RadioGroup/RadioGroup.js.map +1 -1
- package/lib-commonjs/components/RadioGroup/RadioGroup.types.d.ts +9 -4
- package/lib-commonjs/components/RadioGroup/renderRadioGroup.d.ts +2 -2
- package/lib-commonjs/components/RadioGroup/renderRadioGroup.js +2 -2
- package/lib-commonjs/components/RadioGroup/renderRadioGroup.js.map +1 -1
- package/lib-commonjs/components/RadioGroup/useRadioGroup.js +7 -10
- package/lib-commonjs/components/RadioGroup/useRadioGroup.js.map +1 -1
- package/lib-commonjs/contexts/RadioGroupContext.d.ts +3 -4
- package/lib-commonjs/contexts/RadioGroupContext.js +2 -2
- package/lib-commonjs/contexts/RadioGroupContext.js.map +1 -1
- package/lib-commonjs/contexts/index.d.ts +2 -0
- package/lib-commonjs/contexts/index.js +12 -0
- package/lib-commonjs/contexts/index.js.map +1 -0
- package/lib-commonjs/contexts/useRadioGroupContextValues.d.ts +2 -0
- package/lib-commonjs/contexts/useRadioGroupContextValues.js +31 -0
- package/lib-commonjs/contexts/useRadioGroupContextValues.js.map +1 -0
- package/lib-commonjs/index.d.ts +2 -3
- package/lib-commonjs/index.js +9 -3
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +10 -8
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,156 @@
|
|
2
2
|
"name": "@fluentui/react-radio",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Thu, 05 May 2022 18:24:32 GMT",
|
6
|
+
"tag": "@fluentui/react-radio_v9.0.0-rc.2",
|
7
|
+
"version": "9.0.0-rc.2",
|
8
|
+
"comments": {
|
9
|
+
"none": [
|
10
|
+
{
|
11
|
+
"author": "tristan.watanabe@gmail.com",
|
12
|
+
"package": "@fluentui/react-radio",
|
13
|
+
"commit": "ad3dfcc6d85a8dba3c183612fe552280cd33c20e",
|
14
|
+
"comment": "react-radio: Move to new common folder."
|
15
|
+
}
|
16
|
+
],
|
17
|
+
"prerelease": [
|
18
|
+
{
|
19
|
+
"author": "seanmonahan@microsoft.com",
|
20
|
+
"package": "@fluentui/react-radio",
|
21
|
+
"commit": "f628da463f8a12f39e32785e086ef7a2687275f6",
|
22
|
+
"comment": "update README"
|
23
|
+
},
|
24
|
+
{
|
25
|
+
"author": "beachball",
|
26
|
+
"package": "@fluentui/react-radio",
|
27
|
+
"comment": "Bump @fluentui/react-context-selector to v9.0.0-rc.8",
|
28
|
+
"commit": "c5abb9c480ac94d12aa644d68d30773d77f2a159"
|
29
|
+
},
|
30
|
+
{
|
31
|
+
"author": "beachball",
|
32
|
+
"package": "@fluentui/react-radio",
|
33
|
+
"comment": "Bump @fluentui/react-label to v9.0.0-beta.12",
|
34
|
+
"commit": "c5abb9c480ac94d12aa644d68d30773d77f2a159"
|
35
|
+
},
|
36
|
+
{
|
37
|
+
"author": "beachball",
|
38
|
+
"package": "@fluentui/react-radio",
|
39
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.9",
|
40
|
+
"commit": "c5abb9c480ac94d12aa644d68d30773d77f2a159"
|
41
|
+
},
|
42
|
+
{
|
43
|
+
"author": "beachball",
|
44
|
+
"package": "@fluentui/react-radio",
|
45
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.7",
|
46
|
+
"commit": "c5abb9c480ac94d12aa644d68d30773d77f2a159"
|
47
|
+
},
|
48
|
+
{
|
49
|
+
"author": "beachball",
|
50
|
+
"package": "@fluentui/react-radio",
|
51
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.8",
|
52
|
+
"commit": "c5abb9c480ac94d12aa644d68d30773d77f2a159"
|
53
|
+
},
|
54
|
+
{
|
55
|
+
"author": "beachball",
|
56
|
+
"package": "@fluentui/react-radio",
|
57
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.5",
|
58
|
+
"commit": "c5abb9c480ac94d12aa644d68d30773d77f2a159"
|
59
|
+
}
|
60
|
+
]
|
61
|
+
}
|
62
|
+
},
|
63
|
+
{
|
64
|
+
"date": "Wed, 04 May 2022 13:26:48 GMT",
|
65
|
+
"tag": "@fluentui/react-radio_v9.0.0-beta.5",
|
66
|
+
"version": "9.0.0-beta.5",
|
67
|
+
"comments": {
|
68
|
+
"prerelease": [
|
69
|
+
{
|
70
|
+
"author": "seanmonahan@microsoft.com",
|
71
|
+
"package": "@fluentui/react-radio",
|
72
|
+
"commit": "9132814df4b6d40d1f5d93d8324d756c1284b294",
|
73
|
+
"comment": "react-radio: update context usage"
|
74
|
+
},
|
75
|
+
{
|
76
|
+
"author": "seanmonahan@microsoft.com",
|
77
|
+
"package": "@fluentui/react-radio",
|
78
|
+
"commit": "8d990349b5af2d61057cccda2357412d2f5ab9b9",
|
79
|
+
"comment": "add bundle size fixtures"
|
80
|
+
},
|
81
|
+
{
|
82
|
+
"author": "seanmonahan@microsoft.com",
|
83
|
+
"package": "@fluentui/react-radio",
|
84
|
+
"commit": "6a017c3b1f2a282fa86c28b675e5ed34a1bb2aee",
|
85
|
+
"comment": "react-radio: add required prop to RadioGroup"
|
86
|
+
},
|
87
|
+
{
|
88
|
+
"author": "seanmonahan@microsoft.com",
|
89
|
+
"package": "@fluentui/react-radio",
|
90
|
+
"commit": "4bc1c43194cb9f44c5ad40ae43ab26556778157e",
|
91
|
+
"comment": "react-radio: remove required indicator from label"
|
92
|
+
},
|
93
|
+
{
|
94
|
+
"author": "seanmonahan@microsoft.com",
|
95
|
+
"package": "@fluentui/react-radio",
|
96
|
+
"commit": "5f27c51743f22f08741a75c2c10032a02afdf6fb",
|
97
|
+
"comment": "write readme"
|
98
|
+
},
|
99
|
+
{
|
100
|
+
"author": "miroslav.stastny@microsoft.com",
|
101
|
+
"package": "@fluentui/react-radio",
|
102
|
+
"commit": "3be7a89d9e9323780bba5b24d3bcc4342e1f1ec7",
|
103
|
+
"comment": "Allow data argument on onChange"
|
104
|
+
},
|
105
|
+
{
|
106
|
+
"author": "beachball",
|
107
|
+
"package": "@fluentui/react-radio",
|
108
|
+
"comment": "Bump @fluentui/react-context-selector to v9.0.0-rc.7",
|
109
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
110
|
+
},
|
111
|
+
{
|
112
|
+
"author": "beachball",
|
113
|
+
"package": "@fluentui/react-radio",
|
114
|
+
"comment": "Bump @fluentui/react-label to v9.0.0-beta.11",
|
115
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
116
|
+
},
|
117
|
+
{
|
118
|
+
"author": "beachball",
|
119
|
+
"package": "@fluentui/react-radio",
|
120
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.8",
|
121
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
122
|
+
},
|
123
|
+
{
|
124
|
+
"author": "beachball",
|
125
|
+
"package": "@fluentui/react-radio",
|
126
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.6",
|
127
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
128
|
+
},
|
129
|
+
{
|
130
|
+
"author": "beachball",
|
131
|
+
"package": "@fluentui/react-radio",
|
132
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.7",
|
133
|
+
"commit": "65f94192ed3b2cde7e52b9c7e12d6f38b81965dd"
|
134
|
+
}
|
135
|
+
]
|
136
|
+
}
|
137
|
+
},
|
138
|
+
{
|
139
|
+
"date": "Mon, 25 Apr 2022 09:32:19 GMT",
|
140
|
+
"tag": "@fluentui/react-radio_v9.0.0-beta.4",
|
141
|
+
"version": "9.0.0-beta.4",
|
142
|
+
"comments": {
|
143
|
+
"prerelease": [
|
144
|
+
{
|
145
|
+
"author": "beachball",
|
146
|
+
"package": "@fluentui/react-radio",
|
147
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.7",
|
148
|
+
"commit": "02ca1d3c198452c1693067f5f18bd01b2ed5d6e6"
|
149
|
+
}
|
150
|
+
]
|
151
|
+
}
|
152
|
+
},
|
153
|
+
{
|
154
|
+
"date": "Tue, 19 Apr 2022 19:16:50 GMT",
|
6
155
|
"tag": "@fluentui/react-radio_v9.0.0-beta.3",
|
7
156
|
"version": "9.0.0-beta.3",
|
8
157
|
"comments": {
|
@@ -47,31 +196,31 @@
|
|
47
196
|
"author": "beachball",
|
48
197
|
"package": "@fluentui/react-radio",
|
49
198
|
"comment": "Bump @fluentui/react-label to v9.0.0-beta.10",
|
50
|
-
"commit": "
|
199
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
51
200
|
},
|
52
201
|
{
|
53
202
|
"author": "beachball",
|
54
203
|
"package": "@fluentui/react-radio",
|
55
204
|
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.6",
|
56
|
-
"commit": "
|
205
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
57
206
|
},
|
58
207
|
{
|
59
208
|
"author": "beachball",
|
60
209
|
"package": "@fluentui/react-radio",
|
61
210
|
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.5",
|
62
|
-
"commit": "
|
211
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
63
212
|
},
|
64
213
|
{
|
65
214
|
"author": "beachball",
|
66
215
|
"package": "@fluentui/react-radio",
|
67
216
|
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.6",
|
68
|
-
"commit": "
|
217
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
69
218
|
},
|
70
219
|
{
|
71
220
|
"author": "beachball",
|
72
221
|
"package": "@fluentui/react-radio",
|
73
222
|
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4",
|
74
|
-
"commit": "
|
223
|
+
"commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
|
75
224
|
}
|
76
225
|
],
|
77
226
|
"none": [
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,55 @@
|
|
1
1
|
# Change Log - @fluentui/react-radio
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Thu, 05 May 2022 18:24:32 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.0.0-rc.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-rc.2)
|
8
|
+
|
9
|
+
Thu, 05 May 2022 18:24:32 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.5..@fluentui/react-radio_v9.0.0-rc.2)
|
11
|
+
|
12
|
+
### Changes
|
13
|
+
|
14
|
+
- update README ([PR #22819](https://github.com/microsoft/fluentui/pull/22819) by seanmonahan@microsoft.com)
|
15
|
+
- Bump @fluentui/react-context-selector to v9.0.0-rc.8 ([PR #22857](https://github.com/microsoft/fluentui/pull/22857) by beachball)
|
16
|
+
- Bump @fluentui/react-label to v9.0.0-beta.12 ([PR #22857](https://github.com/microsoft/fluentui/pull/22857) by beachball)
|
17
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.9 ([PR #22857](https://github.com/microsoft/fluentui/pull/22857) by beachball)
|
18
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.7 ([PR #22857](https://github.com/microsoft/fluentui/pull/22857) by beachball)
|
19
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.8 ([PR #22857](https://github.com/microsoft/fluentui/pull/22857) by beachball)
|
20
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.5 ([PR #22857](https://github.com/microsoft/fluentui/pull/22857) by beachball)
|
21
|
+
|
22
|
+
## [9.0.0-beta.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.5)
|
23
|
+
|
24
|
+
Wed, 04 May 2022 13:26:48 GMT
|
25
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.4..@fluentui/react-radio_v9.0.0-beta.5)
|
26
|
+
|
27
|
+
### Changes
|
28
|
+
|
29
|
+
- react-radio: update context usage ([PR #22803](https://github.com/microsoft/fluentui/pull/22803) by seanmonahan@microsoft.com)
|
30
|
+
- add bundle size fixtures ([PR #22675](https://github.com/microsoft/fluentui/pull/22675) by seanmonahan@microsoft.com)
|
31
|
+
- react-radio: add required prop to RadioGroup ([PR #22809](https://github.com/microsoft/fluentui/pull/22809) by seanmonahan@microsoft.com)
|
32
|
+
- react-radio: remove required indicator from label ([PR #22782](https://github.com/microsoft/fluentui/pull/22782) by seanmonahan@microsoft.com)
|
33
|
+
- write readme ([PR #22676](https://github.com/microsoft/fluentui/pull/22676) by seanmonahan@microsoft.com)
|
34
|
+
- Allow data argument on onChange ([PR #22753](https://github.com/microsoft/fluentui/pull/22753) by miroslav.stastny@microsoft.com)
|
35
|
+
- Bump @fluentui/react-context-selector to v9.0.0-rc.7 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
36
|
+
- Bump @fluentui/react-label to v9.0.0-beta.11 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
37
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.8 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
38
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.6 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
39
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.7 ([PR #22786](https://github.com/microsoft/fluentui/pull/22786) by beachball)
|
40
|
+
|
41
|
+
## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.4)
|
42
|
+
|
43
|
+
Mon, 25 Apr 2022 09:32:19 GMT
|
44
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.3..@fluentui/react-radio_v9.0.0-beta.4)
|
45
|
+
|
46
|
+
### Changes
|
47
|
+
|
48
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.7 ([PR #22601](https://github.com/microsoft/fluentui/pull/22601) by beachball)
|
49
|
+
|
7
50
|
## [9.0.0-beta.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.3)
|
8
51
|
|
9
|
-
Tue, 19 Apr 2022 19:
|
52
|
+
Tue, 19 Apr 2022 19:16:50 GMT
|
10
53
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.2..@fluentui/react-radio_v9.0.0-beta.3)
|
11
54
|
|
12
55
|
### Changes
|
@@ -17,15 +60,15 @@ Tue, 19 Apr 2022 19:14:00 GMT
|
|
17
60
|
- 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)
|
18
61
|
- chore: Update Griffel to latest version ([PR #21976](https://github.com/microsoft/fluentui/pull/21976) by olfedias@microsoft.com)
|
19
62
|
- Radio/RadioGroup API alignment. ([PR #22065](https://github.com/microsoft/fluentui/pull/22065) by seanmonahan@microsoft.com)
|
20
|
-
- Bump @fluentui/react-label to v9.0.0-beta.10 ([PR #
|
21
|
-
- Bump @fluentui/react-tabster to v9.0.0-rc.6 ([PR #
|
22
|
-
- Bump @fluentui/react-theme to v9.0.0-rc.5 ([PR #
|
23
|
-
- Bump @fluentui/react-utilities to v9.0.0-rc.6 ([PR #
|
24
|
-
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4 ([PR #
|
63
|
+
- Bump @fluentui/react-label to v9.0.0-beta.10 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
64
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
65
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.5 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
66
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
67
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
|
25
68
|
|
26
69
|
## [9.0.0-beta.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.2)
|
27
70
|
|
28
|
-
Fri, 04 Mar 2022 05:17:40 GMT
|
71
|
+
Fri, 04 Mar 2022 05:17:40 GMT
|
29
72
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.1..@fluentui/react-radio_v9.0.0-beta.2)
|
30
73
|
|
31
74
|
### Changes
|
@@ -39,7 +82,7 @@ Fri, 04 Mar 2022 05:17:40 GMT
|
|
39
82
|
|
40
83
|
## [9.0.0-beta.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.1)
|
41
84
|
|
42
|
-
Tue, 01 Mar 2022 02:17:40 GMT
|
85
|
+
Tue, 01 Mar 2022 02:17:40 GMT
|
43
86
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.1..@fluentui/react-radio_v9.0.0-beta.1)
|
44
87
|
|
45
88
|
### Changes
|
@@ -50,7 +93,7 @@ Tue, 01 Mar 2022 02:17:40 GMT
|
|
50
93
|
|
51
94
|
## [9.0.0-beta.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.1)
|
52
95
|
|
53
|
-
Fri, 18 Feb 2022 13:35:38 GMT
|
96
|
+
Fri, 18 Feb 2022 13:35:38 GMT
|
54
97
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.0..@fluentui/react-radio_v9.0.0-beta.1)
|
55
98
|
|
56
99
|
### Changes
|
@@ -62,7 +105,7 @@ Fri, 18 Feb 2022 13:35:38 GMT
|
|
62
105
|
|
63
106
|
## [9.0.0-beta.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.0)
|
64
107
|
|
65
|
-
Thu, 10 Feb 2022 08:52:26 GMT
|
108
|
+
Thu, 10 Feb 2022 08:52:26 GMT
|
66
109
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.0..@fluentui/react-radio_v9.0.0-beta.0)
|
67
110
|
|
68
111
|
### Changes
|
@@ -74,7 +117,7 @@ Thu, 10 Feb 2022 08:52:26 GMT
|
|
74
117
|
|
75
118
|
## [9.0.0-beta.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.0)
|
76
119
|
|
77
|
-
Thu, 25 Nov 2021 08:34:17 GMT
|
120
|
+
Thu, 25 Nov 2021 08:34:17 GMT
|
78
121
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.0..@fluentui/react-radio_v9.0.0-beta.0)
|
79
122
|
|
80
123
|
### Changes
|
@@ -87,7 +130,7 @@ Thu, 25 Nov 2021 08:34:17 GMT
|
|
87
130
|
|
88
131
|
## [9.0.0-beta.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.0)
|
89
132
|
|
90
|
-
Fri, 12 Nov 2021 13:25:34 GMT
|
133
|
+
Fri, 12 Nov 2021 13:25:34 GMT
|
91
134
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.0..@fluentui/react-radio_v9.0.0-beta.0)
|
92
135
|
|
93
136
|
### Changes
|
@@ -100,7 +143,7 @@ Fri, 12 Nov 2021 13:25:34 GMT
|
|
100
143
|
|
101
144
|
## [9.0.0-beta.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-radio_v9.0.0-beta.0)
|
102
145
|
|
103
|
-
Wed, 27 Oct 2021 12:14:24 GMT
|
146
|
+
Wed, 27 Oct 2021 12:14:24 GMT
|
104
147
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-radio_v9.0.0-beta.0..@fluentui/react-radio_v9.0.0-beta.0)
|
105
148
|
|
106
149
|
### Changes
|
package/README.md
CHANGED
@@ -3,3 +3,46 @@
|
|
3
3
|
**React Radio components for [Fluent UI React](https://developer.microsoft.com/en-us/fluentui)**
|
4
4
|
|
5
5
|
These are not production-ready components and **should never be used in product**. This space is useful for testing new components whose APIs might change before final release.
|
6
|
+
|
7
|
+
A Radio allows a user to select a single value from two or more options. All Radios with the same `name` are considered to be part of the same group. However, a `RadioGroup` is recommended to add a group label, formatting, and other functionality.
|
8
|
+
|
9
|
+
### Usage
|
10
|
+
|
11
|
+
Import `Radio` and `RadioGroup`:
|
12
|
+
|
13
|
+
```js
|
14
|
+
// From @fluentui/react-components
|
15
|
+
import { Radio, RadioGroup } from '@fluentui/react-components';
|
16
|
+
|
17
|
+
// Directly from @fluentui/react-radio
|
18
|
+
import { Radio, RadioGroup } from '@fluentui/react-radio';
|
19
|
+
```
|
20
|
+
|
21
|
+
#### Examples
|
22
|
+
|
23
|
+
```jsx
|
24
|
+
<RadioGroup defaultValue="B">
|
25
|
+
<Radio value="A" label="Option A" />
|
26
|
+
<Radio value="B" label="Option B" />
|
27
|
+
<Radio value="C" label="Option C" />
|
28
|
+
<Radio value="D" label="Option D" />
|
29
|
+
</RadioGroup>
|
30
|
+
|
31
|
+
<RadioGroup value={value} onChange={(_, data) => setValue(data.value)}>
|
32
|
+
<Radio value="A" label="Option A" />
|
33
|
+
<Radio value="B" label="Option B" />
|
34
|
+
<Radio value="C" label="Option C" />
|
35
|
+
<Radio value="D" label="Option D" />
|
36
|
+
</RadioGroup>
|
37
|
+
```
|
38
|
+
|
39
|
+
See [Fluent UI Storybook](https://aka.ms/fluentui-storybook) for more detailed usage examples.
|
40
|
+
|
41
|
+
Alternatively, run Storybook locally with:
|
42
|
+
|
43
|
+
1. `yarn start`
|
44
|
+
2. Select `react-radio` from the list.
|
45
|
+
|
46
|
+
### Specification
|
47
|
+
|
48
|
+
See [Spec.md](./Spec.md).
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import type { ComponentProps } from '@fluentui/react-utilities';
|
2
2
|
import type { ComponentState } from '@fluentui/react-utilities';
|
3
|
+
import type { Context } from '@fluentui/react-context-selector';
|
3
4
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
4
5
|
import { Label } from '@fluentui/react-label';
|
5
6
|
import * as React_2 from 'react';
|
@@ -33,9 +34,13 @@ export declare const radioGroupClassNames: SlotClassNames<RadioGroupSlots>;
|
|
33
34
|
/**
|
34
35
|
* RadioGroupContext is provided by RadioGroup, and is consumed by Radio to determine default values of some props.
|
35
36
|
*/
|
36
|
-
export declare const RadioGroupContext:
|
37
|
+
export declare const RadioGroupContext: Context<RadioGroupContextValue>;
|
37
38
|
|
38
|
-
export declare type RadioGroupContextValue = Pick<RadioGroupProps, 'name' | '
|
39
|
+
export declare type RadioGroupContextValue = Pick<RadioGroupProps, 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required'>;
|
40
|
+
|
41
|
+
export declare type RadioGroupContextValues = {
|
42
|
+
radioGroup: RadioGroupContextValue;
|
43
|
+
};
|
39
44
|
|
40
45
|
/**
|
41
46
|
* Data for the onChange event for RadioGroup.
|
@@ -73,13 +78,17 @@ export declare type RadioGroupProps = Omit<ComponentProps<Partial<RadioGroupSlot
|
|
73
78
|
/**
|
74
79
|
* How the radio items are laid out in the group.
|
75
80
|
*
|
76
|
-
* @
|
81
|
+
* @default vertical
|
77
82
|
*/
|
78
83
|
layout?: 'vertical' | 'horizontal' | 'horizontalStacked';
|
79
84
|
/**
|
80
85
|
* Disable all Radio items in this group.
|
81
86
|
*/
|
82
87
|
disabled?: boolean;
|
88
|
+
/**
|
89
|
+
* Require all Radio items in this group.
|
90
|
+
*/
|
91
|
+
required?: boolean;
|
83
92
|
};
|
84
93
|
|
85
94
|
export declare type RadioGroupSlots = {
|
@@ -92,9 +101,7 @@ export declare type RadioGroupSlots = {
|
|
92
101
|
/**
|
93
102
|
* State used in rendering RadioGroup
|
94
103
|
*/
|
95
|
-
export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required<Pick<RadioGroupProps, 'layout'>> &
|
96
|
-
context: RadioGroupContextValue;
|
97
|
-
};
|
104
|
+
export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required<Pick<RadioGroupProps, 'layout'>> & Partial<Exclude<RadioGroupProps, 'onChange' | 'layout'>>;
|
98
105
|
|
99
106
|
/**
|
100
107
|
* Data for the onChange event for Radio.
|
@@ -109,7 +116,7 @@ export declare type RadioOnChangeData = {
|
|
109
116
|
/**
|
110
117
|
* Radio Props
|
111
118
|
*/
|
112
|
-
export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'size'> & {
|
119
|
+
export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'onChange' | 'size'> & {
|
113
120
|
/**
|
114
121
|
* The value of the RadioGroup when this Radio item is selected.
|
115
122
|
*/
|
@@ -174,7 +181,7 @@ export declare const renderRadio_unstable: (state: RadioState) => JSX.Element;
|
|
174
181
|
/**
|
175
182
|
* Render the final JSX of RadioGroup
|
176
183
|
*/
|
177
|
-
export declare const renderRadioGroup_unstable: (state: RadioGroupState) => JSX.Element;
|
184
|
+
export declare const renderRadioGroup_unstable: (state: RadioGroupState, contextValues: RadioGroupContextValues) => JSX.Element;
|
178
185
|
|
179
186
|
/**
|
180
187
|
* Create the state required to render Radio.
|
@@ -198,6 +205,8 @@ export declare const useRadio_unstable: (props: RadioProps, ref: React_2.Ref<HTM
|
|
198
205
|
*/
|
199
206
|
export declare const useRadioGroup_unstable: (props: RadioGroupProps, ref: React_2.Ref<HTMLDivElement>) => RadioGroupState;
|
200
207
|
|
208
|
+
export declare const useRadioGroupContextValues: (state: RadioGroupState) => RadioGroupContextValues;
|
209
|
+
|
201
210
|
/**
|
202
211
|
* Apply styling to the RadioGroup slots based on the state
|
203
212
|
*/
|
@@ -28,7 +28,7 @@ export declare type RadioSlots = {
|
|
28
28
|
/**
|
29
29
|
* Radio Props
|
30
30
|
*/
|
31
|
-
export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'size'> & {
|
31
|
+
export declare type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'onChange' | 'size'> & {
|
32
32
|
/**
|
33
33
|
* The value of the RadioGroup when this Radio item is selected.
|
34
34
|
*/
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Radio.types.js","sourceRoot":"../src/","sources":["components/Radio/Radio.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioSlots = {\n /**\n * The root element of the Radio.\n *\n * The root slot receives the `className` and `style` specified directly on the `<Radio>`.\n * All other native props will be applied to the primary slot: `input`\n */\n root: NonNullable<Slot<'span'>>;\n\n /**\n * The Radio's label.\n */\n label: Slot<typeof Label>;\n\n /**\n * Hidden input that handles the radio's functionality.\n *\n * This is the PRIMARY slot: all native properties specified directly on `<Radio>` will be applied to this slot,\n * except `className` and `style`, which remain on the root slot.\n */\n input: NonNullable<Slot<'input'>>;\n\n /**\n * A circle outline, with a filled circle icon inside when the Radio is checked.\n */\n indicator: NonNullable<Slot<'div'>>;\n};\n\n/**\n * Radio Props\n */\nexport type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'size'> & {\n /**\n * The value of the RadioGroup when this Radio item is selected.\n */\n value?: string;\n\n /**\n * The position of the label relative to the radio indicator.\n *\n * This defaults to `after` unless the Radio is inside a RadioGroup with `layout=\"horizontalStacked\"`,\n * in which case it defaults to `below`.\n *\n * @defaultvalue after\n */\n labelPosition?: 'after' | 'below';\n\n /**\n * Disable this Radio item.\n */\n disabled?: boolean;\n\n /**\n * Callback when this Radio is selected in its group.\n *\n * **Note:** `onChange` is NOT called when this Radio is deselected.\n * Use RadioGroup's `onChange` event to determine when the selection in the group changes.\n */\n onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: RadioOnChangeData) => void;\n};\n\n/**\n * Data for the onChange event for Radio.\n */\nexport type RadioOnChangeData = {\n /**\n * The value prop of this Radio item.\n */\n value: string;\n};\n\n/**\n * State used in rendering Radio\n */\nexport type RadioState = ComponentState<RadioSlots> & Required<Pick<RadioProps, 'labelPosition'>>;\n"]}
|
1
|
+
{"version":3,"file":"Radio.types.js","sourceRoot":"../src/","sources":["components/Radio/Radio.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport { Label } from '@fluentui/react-label';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioSlots = {\n /**\n * The root element of the Radio.\n *\n * The root slot receives the `className` and `style` specified directly on the `<Radio>`.\n * All other native props will be applied to the primary slot: `input`\n */\n root: NonNullable<Slot<'span'>>;\n\n /**\n * The Radio's label.\n */\n label: Slot<typeof Label>;\n\n /**\n * Hidden input that handles the radio's functionality.\n *\n * This is the PRIMARY slot: all native properties specified directly on `<Radio>` will be applied to this slot,\n * except `className` and `style`, which remain on the root slot.\n */\n input: NonNullable<Slot<'input'>>;\n\n /**\n * A circle outline, with a filled circle icon inside when the Radio is checked.\n */\n indicator: NonNullable<Slot<'div'>>;\n};\n\n/**\n * Radio Props\n */\nexport type RadioProps = Omit<ComponentProps<Partial<RadioSlots>, 'input'>, 'onChange' | 'size'> & {\n /**\n * The value of the RadioGroup when this Radio item is selected.\n */\n value?: string;\n\n /**\n * The position of the label relative to the radio indicator.\n *\n * This defaults to `after` unless the Radio is inside a RadioGroup with `layout=\"horizontalStacked\"`,\n * in which case it defaults to `below`.\n *\n * @defaultvalue after\n */\n labelPosition?: 'after' | 'below';\n\n /**\n * Disable this Radio item.\n */\n disabled?: boolean;\n\n /**\n * Callback when this Radio is selected in its group.\n *\n * **Note:** `onChange` is NOT called when this Radio is deselected.\n * Use RadioGroup's `onChange` event to determine when the selection in the group changes.\n */\n onChange?: (ev: React.ChangeEvent<HTMLInputElement>, data: RadioOnChangeData) => void;\n};\n\n/**\n * Data for the onChange event for Radio.\n */\nexport type RadioOnChangeData = {\n /**\n * The value prop of this Radio item.\n */\n value: string;\n};\n\n/**\n * State used in rendering Radio\n */\nexport type RadioState = ComponentState<RadioSlots> & Required<Pick<RadioProps, 'labelPosition'>>;\n"]}
|
@@ -3,6 +3,7 @@ import { CircleFilled } from '@fluentui/react-icons';
|
|
3
3
|
import { Label } from '@fluentui/react-label';
|
4
4
|
import { getPartitionedNativeProps, resolveShorthand, useId, useMergedEventCallbacks } from '@fluentui/react-utilities';
|
5
5
|
import { RadioGroupContext } from '../../contexts/RadioGroupContext';
|
6
|
+
import { useContextSelector } from '@fluentui/react-context-selector';
|
6
7
|
/**
|
7
8
|
* Create the state required to render Radio.
|
8
9
|
*
|
@@ -14,14 +15,19 @@ import { RadioGroupContext } from '../../contexts/RadioGroupContext';
|
|
14
15
|
*/
|
15
16
|
|
16
17
|
export const useRadio_unstable = (props, ref) => {
|
17
|
-
const
|
18
|
+
const nameGroup = useContextSelector(RadioGroupContext, ctx => ctx.name);
|
19
|
+
const value = useContextSelector(RadioGroupContext, ctx => ctx.value);
|
20
|
+
const defaultValue = useContextSelector(RadioGroupContext, ctx => ctx.defaultValue);
|
21
|
+
const disabledGroup = useContextSelector(RadioGroupContext, ctx => ctx.disabled);
|
22
|
+
const layout = useContextSelector(RadioGroupContext, ctx => ctx.layout);
|
23
|
+
const requiredGroup = useContextSelector(RadioGroupContext, ctx => ctx.required);
|
18
24
|
const {
|
19
|
-
name =
|
20
|
-
checked =
|
21
|
-
defaultChecked =
|
22
|
-
labelPosition =
|
23
|
-
disabled =
|
24
|
-
required,
|
25
|
+
name = nameGroup,
|
26
|
+
checked = value !== undefined ? value === props.value : undefined,
|
27
|
+
defaultChecked = defaultValue !== undefined ? defaultValue === props.value : undefined,
|
28
|
+
labelPosition = layout === 'horizontalStacked' ? 'below' : 'after',
|
29
|
+
disabled = disabledGroup,
|
30
|
+
required = requiredGroup,
|
25
31
|
onChange
|
26
32
|
} = props;
|
27
33
|
const nativeProps = getPartitionedNativeProps({
|
@@ -43,6 +49,7 @@ export const useRadio_unstable = (props, ref) => {
|
|
43
49
|
checked,
|
44
50
|
defaultChecked,
|
45
51
|
disabled,
|
52
|
+
required,
|
46
53
|
...nativeProps.primary
|
47
54
|
}
|
48
55
|
});
|
@@ -52,8 +59,7 @@ export const useRadio_unstable = (props, ref) => {
|
|
52
59
|
const label = resolveShorthand(props.label, {
|
53
60
|
defaultProps: {
|
54
61
|
htmlFor: input.id,
|
55
|
-
disabled
|
56
|
-
required
|
62
|
+
disabled
|
57
63
|
}
|
58
64
|
});
|
59
65
|
const indicator = resolveShorthand(props.indicator, {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/Radio/useRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,YAAT,QAA6B,uBAA7B;AACA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,yBAAT,EAAoC,gBAApC,EAAsD,KAAtD,EAA6D,uBAA7D,QAA4F,2BAA5F;AACA,SAAS,iBAAT,QAAkC,kCAAlC;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,iBAAiB,GAAG,CAAC,KAAD,EAAoB,GAApB,KAAoE;AACnG,QAAM,
|
1
|
+
{"version":3,"sources":["components/Radio/useRadio.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { CircleFilled } from '@fluentui/react-icons';\nimport { Label } from '@fluentui/react-label';\nimport { getPartitionedNativeProps, resolveShorthand, useId, useMergedEventCallbacks } from '@fluentui/react-utilities';\nimport { RadioGroupContext } from '../../contexts/RadioGroupContext';\nimport { useContextSelector } from '@fluentui/react-context-selector';\nimport type { RadioProps, RadioState } from './Radio.types';\n\n/**\n * Create the state required to render Radio.\n *\n * The returned state can be modified with hooks such as useRadioStyles_unstable,\n * before being passed to renderRadio_unstable.\n *\n * @param props - props from this instance of Radio\n * @param ref - reference to `<input>` element of Radio\n */\nexport const useRadio_unstable = (props: RadioProps, ref: React.Ref<HTMLInputElement>): RadioState => {\n const nameGroup = useContextSelector(RadioGroupContext, ctx => ctx.name);\n const value = useContextSelector(RadioGroupContext, ctx => ctx.value);\n const defaultValue = useContextSelector(RadioGroupContext, ctx => ctx.defaultValue);\n const disabledGroup = useContextSelector(RadioGroupContext, ctx => ctx.disabled);\n const layout = useContextSelector(RadioGroupContext, ctx => ctx.layout);\n const requiredGroup = useContextSelector(RadioGroupContext, ctx => ctx.required);\n\n const {\n name = nameGroup,\n checked = value !== undefined ? value === props.value : undefined,\n defaultChecked = defaultValue !== undefined ? defaultValue === props.value : undefined,\n labelPosition = layout === 'horizontalStacked' ? 'below' : 'after',\n disabled = disabledGroup,\n required = requiredGroup,\n onChange,\n } = props;\n\n const nativeProps = getPartitionedNativeProps({\n props,\n primarySlotTagName: 'input',\n excludedPropNames: ['checked', 'defaultChecked', 'onChange'],\n });\n\n const root = resolveShorthand(props.root, {\n required: true,\n defaultProps: nativeProps.root,\n });\n\n const input = resolveShorthand(props.input, {\n required: true,\n defaultProps: {\n ref,\n type: 'radio',\n id: useId('radio-', nativeProps.primary.id),\n name,\n checked,\n defaultChecked,\n disabled,\n required,\n ...nativeProps.primary,\n },\n });\n\n input.onChange = useMergedEventCallbacks(input.onChange, ev => onChange?.(ev, { value: ev.currentTarget.value }));\n\n const label = resolveShorthand(props.label, {\n defaultProps: {\n htmlFor: input.id,\n disabled,\n },\n });\n\n const indicator = resolveShorthand(props.indicator, {\n required: true,\n defaultProps: {\n 'aria-hidden': true,\n children: <CircleFilled />,\n },\n });\n\n return {\n labelPosition,\n components: {\n root: 'span',\n input: 'input',\n label: Label,\n indicator: 'div',\n },\n root,\n input,\n label,\n indicator,\n };\n};\n"],"sourceRoot":"../src/"}
|
@@ -2,14 +2,16 @@ import * as React from 'react';
|
|
2
2
|
import { renderRadioGroup_unstable } from './renderRadioGroup';
|
3
3
|
import { useRadioGroup_unstable } from './useRadioGroup';
|
4
4
|
import { useRadioGroupStyles_unstable } from './useRadioGroupStyles';
|
5
|
+
import { useRadioGroupContextValues } from '../../contexts/useRadioGroupContextValues';
|
5
6
|
/**
|
6
7
|
* A RadioGroup component presents a set of options where only one option can be selected.
|
7
8
|
*/
|
8
9
|
|
9
10
|
export const RadioGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
11
|
const state = useRadioGroup_unstable(props, ref);
|
12
|
+
const contextValues = useRadioGroupContextValues(state);
|
11
13
|
useRadioGroupStyles_unstable(state);
|
12
|
-
return renderRadioGroup_unstable(state);
|
14
|
+
return renderRadioGroup_unstable(state, contextValues);
|
13
15
|
});
|
14
16
|
RadioGroup.displayName = 'RadioGroup';
|
15
17
|
//# sourceMappingURL=RadioGroup.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAGA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AAEA;;AAEG;;AACH,OAAO,MAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,sBAAsB,CAAC,KAAD,EAAQ,GAAR,CAApC;AAEA,EAAA,4BAA4B,CAAC,KAAD,CAA5B;AACA,SAAO,yBAAyB,CAAC,KAAD,CAAhC;AACD,
|
1
|
+
{"version":3,"sources":["components/RadioGroup/RadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAGA,SAAS,yBAAT,QAA0C,oBAA1C;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,4BAAT,QAA6C,uBAA7C;AACA,SAAS,0BAAT,QAA2C,2CAA3C;AAEA;;AAEG;;AACH,OAAO,MAAM,UAAU,gBAAyC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,sBAAsB,CAAC,KAAD,EAAQ,GAAR,CAApC;AACA,QAAM,aAAa,GAAG,0BAA0B,CAAC,KAAD,CAAhD;AAEA,EAAA,4BAA4B,CAAC,KAAD,CAA5B;AACA,SAAO,yBAAyB,CAAC,KAAD,EAAQ,aAAR,CAAhC;AACD,CAN+D,CAAzD;AAQP,UAAU,CAAC,WAAX,GAAyB,YAAzB","sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { RadioGroupProps } from './RadioGroup.types';\nimport { renderRadioGroup_unstable } from './renderRadioGroup';\nimport { useRadioGroup_unstable } from './useRadioGroup';\nimport { useRadioGroupStyles_unstable } from './useRadioGroupStyles';\nimport { useRadioGroupContextValues } from '../../contexts/useRadioGroupContextValues';\n\n/**\n * A RadioGroup component presents a set of options where only one option can be selected.\n */\nexport const RadioGroup: ForwardRefComponent<RadioGroupProps> = React.forwardRef((props, ref) => {\n const state = useRadioGroup_unstable(props, ref);\n const contextValues = useRadioGroupContextValues(state);\n\n useRadioGroupStyles_unstable(state);\n return renderRadioGroup_unstable(state, contextValues);\n});\n\nRadioGroup.displayName = 'RadioGroup';\n"],"sourceRoot":"../src/"}
|
@@ -1,6 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
2
|
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
3
|
-
import { RadioGroupContextValue } from '../../contexts/RadioGroupContext';
|
4
3
|
export declare type RadioGroupSlots = {
|
5
4
|
/**
|
6
5
|
* The radio group root.
|
@@ -33,13 +32,17 @@ export declare type RadioGroupProps = Omit<ComponentProps<Partial<RadioGroupSlot
|
|
33
32
|
/**
|
34
33
|
* How the radio items are laid out in the group.
|
35
34
|
*
|
36
|
-
* @
|
35
|
+
* @default vertical
|
37
36
|
*/
|
38
37
|
layout?: 'vertical' | 'horizontal' | 'horizontalStacked';
|
39
38
|
/**
|
40
39
|
* Disable all Radio items in this group.
|
41
40
|
*/
|
42
41
|
disabled?: boolean;
|
42
|
+
/**
|
43
|
+
* Require all Radio items in this group.
|
44
|
+
*/
|
45
|
+
required?: boolean;
|
43
46
|
};
|
44
47
|
/**
|
45
48
|
* Data for the onChange event for RadioGroup.
|
@@ -53,6 +56,8 @@ export declare type RadioGroupOnChangeData = {
|
|
53
56
|
/**
|
54
57
|
* State used in rendering RadioGroup
|
55
58
|
*/
|
56
|
-
export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required<Pick<RadioGroupProps, 'layout'>> &
|
57
|
-
|
59
|
+
export declare type RadioGroupState = ComponentState<RadioGroupSlots> & Required<Pick<RadioGroupProps, 'layout'>> & Partial<Exclude<RadioGroupProps, 'onChange' | 'layout'>>;
|
60
|
+
export declare type RadioGroupContextValue = Pick<RadioGroupProps, 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required'>;
|
61
|
+
export declare type RadioGroupContextValues = {
|
62
|
+
radioGroup: RadioGroupContextValue;
|
58
63
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"RadioGroup.types.js","sourceRoot":"../src/","sources":["components/RadioGroup/RadioGroup.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\
|
1
|
+
{"version":3,"file":"RadioGroup.types.js","sourceRoot":"../src/","sources":["components/RadioGroup/RadioGroup.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type RadioGroupSlots = {\n /**\n * The radio group root.\n */\n root: NonNullable<Slot<'div'>>;\n};\n\nexport type RadioGroupProps = Omit<ComponentProps<Partial<RadioGroupSlots>>, 'onChange'> & {\n /**\n * The name of this radio group. This name is applied to all Radio items inside this group.\n *\n * If no name is provided, one will be generated so that all of the Radio items have the same name.\n */\n name?: string;\n\n /**\n * The selected Radio item in this group.\n *\n * This should be the `value` prop of one of the Radio items inside this group.\n */\n value?: string;\n\n /**\n * The default selected Radio item in this group.\n *\n * This should be the `value` prop of one of the Radio items inside this group.\n */\n defaultValue?: string;\n\n /**\n * Callback when the selected Radio item changes.\n */\n onChange?: (ev: React.FormEvent<HTMLDivElement>, data: RadioGroupOnChangeData) => void;\n\n /**\n * How the radio items are laid out in the group.\n *\n * @default vertical\n */\n layout?: 'vertical' | 'horizontal' | 'horizontalStacked';\n\n /**\n * Disable all Radio items in this group.\n */\n disabled?: boolean;\n\n /**\n * Require all Radio items in this group.\n */\n required?: boolean;\n};\n\n/**\n * Data for the onChange event for RadioGroup.\n */\nexport type RadioGroupOnChangeData = {\n /**\n * The value of the newly selected Radio item.\n */\n value: string;\n};\n\n/**\n * State used in rendering RadioGroup\n */\nexport type RadioGroupState = ComponentState<RadioGroupSlots> &\n Required<Pick<RadioGroupProps, 'layout'>> &\n Partial<Exclude<RadioGroupProps, 'onChange' | 'layout'>>;\n\nexport type RadioGroupContextValue = Pick<\n RadioGroupProps,\n 'name' | 'value' | 'defaultValue' | 'disabled' | 'layout' | 'required'\n>;\n\nexport type RadioGroupContextValues = {\n radioGroup: RadioGroupContextValue;\n};\n"]}
|