@fluentui/react-radio 9.0.0-beta.3 → 9.0.0-rc.2
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 +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"]}
|