@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.
Files changed (53) hide show
  1. package/CHANGELOG.json +155 -6
  2. package/CHANGELOG.md +57 -14
  3. package/README.md +43 -0
  4. package/dist/{react-radio.d.ts → index.d.ts} +17 -8
  5. package/lib/components/Radio/Radio.types.d.ts +1 -1
  6. package/lib/components/Radio/Radio.types.js.map +1 -1
  7. package/lib/components/Radio/useRadio.js +15 -9
  8. package/lib/components/Radio/useRadio.js.map +1 -1
  9. package/lib/components/RadioGroup/RadioGroup.js +3 -1
  10. package/lib/components/RadioGroup/RadioGroup.js.map +1 -1
  11. package/lib/components/RadioGroup/RadioGroup.types.d.ts +9 -4
  12. package/lib/components/RadioGroup/RadioGroup.types.js.map +1 -1
  13. package/lib/components/RadioGroup/renderRadioGroup.d.ts +2 -2
  14. package/lib/components/RadioGroup/renderRadioGroup.js +2 -2
  15. package/lib/components/RadioGroup/renderRadioGroup.js.map +1 -1
  16. package/lib/components/RadioGroup/useRadioGroup.js +7 -9
  17. package/lib/components/RadioGroup/useRadioGroup.js.map +1 -1
  18. package/lib/contexts/RadioGroupContext.d.ts +3 -4
  19. package/lib/contexts/RadioGroupContext.js +2 -2
  20. package/lib/contexts/RadioGroupContext.js.map +1 -1
  21. package/lib/contexts/index.d.ts +2 -0
  22. package/lib/contexts/index.js +3 -0
  23. package/lib/contexts/index.js.map +1 -0
  24. package/lib/contexts/useRadioGroupContextValues.d.ts +2 -0
  25. package/lib/contexts/useRadioGroupContextValues.js +22 -0
  26. package/lib/contexts/useRadioGroupContextValues.js.map +1 -0
  27. package/lib/index.d.ts +2 -3
  28. package/lib/index.js +1 -1
  29. package/lib/index.js.map +1 -1
  30. package/lib-commonjs/components/Radio/Radio.types.d.ts +1 -1
  31. package/lib-commonjs/components/Radio/useRadio.js +16 -9
  32. package/lib-commonjs/components/Radio/useRadio.js.map +1 -1
  33. package/lib-commonjs/components/RadioGroup/RadioGroup.js +4 -1
  34. package/lib-commonjs/components/RadioGroup/RadioGroup.js.map +1 -1
  35. package/lib-commonjs/components/RadioGroup/RadioGroup.types.d.ts +9 -4
  36. package/lib-commonjs/components/RadioGroup/renderRadioGroup.d.ts +2 -2
  37. package/lib-commonjs/components/RadioGroup/renderRadioGroup.js +2 -2
  38. package/lib-commonjs/components/RadioGroup/renderRadioGroup.js.map +1 -1
  39. package/lib-commonjs/components/RadioGroup/useRadioGroup.js +7 -10
  40. package/lib-commonjs/components/RadioGroup/useRadioGroup.js.map +1 -1
  41. package/lib-commonjs/contexts/RadioGroupContext.d.ts +3 -4
  42. package/lib-commonjs/contexts/RadioGroupContext.js +2 -2
  43. package/lib-commonjs/contexts/RadioGroupContext.js.map +1 -1
  44. package/lib-commonjs/contexts/index.d.ts +2 -0
  45. package/lib-commonjs/contexts/index.js +12 -0
  46. package/lib-commonjs/contexts/index.js.map +1 -0
  47. package/lib-commonjs/contexts/useRadioGroupContextValues.d.ts +2 -0
  48. package/lib-commonjs/contexts/useRadioGroupContextValues.js +31 -0
  49. package/lib-commonjs/contexts/useRadioGroupContextValues.js.map +1 -0
  50. package/lib-commonjs/index.d.ts +2 -3
  51. package/lib-commonjs/index.js +9 -3
  52. package/lib-commonjs/index.js.map +1 -1
  53. 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": "Tue, 19 Apr 2022 19:14:00 GMT",
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": "9c8592decacb9f7b1dc608a03c9f991918806008"
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": "9c8592decacb9f7b1dc608a03c9f991918806008"
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": "9c8592decacb9f7b1dc608a03c9f991918806008"
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": "9c8592decacb9f7b1dc608a03c9f991918806008"
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": "9c8592decacb9f7b1dc608a03c9f991918806008"
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 Tue, 19 Apr 2022 19:14:00 GMT and should not be manually modified.
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:14:00 GMT
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 #22367](https://github.com/microsoft/fluentui/pull/22367) by beachball)
21
- - Bump @fluentui/react-tabster to v9.0.0-rc.6 ([PR #22367](https://github.com/microsoft/fluentui/pull/22367) by beachball)
22
- - Bump @fluentui/react-theme to v9.0.0-rc.5 ([PR #22367](https://github.com/microsoft/fluentui/pull/22367) by beachball)
23
- - Bump @fluentui/react-utilities to v9.0.0-rc.6 ([PR #22367](https://github.com/microsoft/fluentui/pull/22367) by beachball)
24
- - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4 ([PR #22367](https://github.com/microsoft/fluentui/pull/22367) by beachball)
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: React_2.Context<RadioGroupContextValue>;
37
+ export declare const RadioGroupContext: Context<RadioGroupContextValue>;
37
38
 
38
- export declare type RadioGroupContextValue = Pick<RadioGroupProps, 'name' | 'layout' | 'value' | 'defaultValue' | 'disabled'>;
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
- * @defaultvalue vertical
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 group = React.useContext(RadioGroupContext);
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 = group.name,
20
- checked = group.value !== undefined ? group.value === props.value : undefined,
21
- defaultChecked = group.defaultValue !== undefined ? group.defaultValue === props.value : undefined,
22
- labelPosition = group.layout === 'horizontalStacked' ? 'below' : 'after',
23
- disabled = group.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":"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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 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 group = React.useContext(RadioGroupContext);\n\n const {\n name = group.name,\n checked = group.value !== undefined ? group.value === props.value : undefined,\n defaultChecked = group.defaultValue !== undefined ? group.defaultValue === props.value : undefined,\n labelPosition = group.layout === 'horizontalStacked' ? 'below' : 'after',\n disabled = group.disabled,\n required,\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 ...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 required,\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/"}
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,CAL+D,CAAzD;AAOP,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';\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\n useRadioGroupStyles_unstable(state);\n return renderRadioGroup_unstable(state);\n});\n\nRadioGroup.displayName = 'RadioGroup';\n"],"sourceRoot":"../src/"}
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
- * @defaultvalue vertical
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
- context: RadioGroupContextValue;
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';\nimport { RadioGroupContextValue } from '../../contexts/RadioGroupContext';\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 * @defaultvalue vertical\n */\n layout?: 'vertical' | 'horizontal' | 'horizontalStacked';\n\n /**\n * Disable all Radio items in this group.\n */\n disabled?: 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 context: RadioGroupContextValue;\n };\n"]}
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"]}