@atlaskit/radio 5.4.5 → 5.4.6

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.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/radio
2
2
 
3
+ ## 5.4.6
4
+
5
+ ### Patch Changes
6
+
7
+ - [`22d4be4674b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/22d4be4674b) - Fixes issue where disabled radios were using the wrong background and border tokens
8
+ - [`8e6acf8f038`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8e6acf8f038) - Updates tokens used for border and dot, improved tokens appearance when radio is both checked and disabled
9
+
3
10
  ## 5.4.5
4
11
 
5
12
  ### Patch Changes
package/dist/cjs/radio.js CHANGED
@@ -29,7 +29,7 @@ var _styles = _interopRequireDefault(require("./styles"));
29
29
 
30
30
  var _excluded = ["ariaLabel", "isDisabled", "isRequired", "isInvalid", "isChecked", "label", "mode", "name", "onChange", "value", "testId", "analyticsContext"];
31
31
  var packageName = "@atlaskit/radio";
32
- var packageVersion = "5.4.5";
32
+ var packageVersion = "5.4.6";
33
33
  var fontFamily = (0, _constants.fontFamily)();
34
34
  var noop = _noop.default;
35
35
  var labelPaddingStyles = (0, _react2.css)({
@@ -141,10 +141,6 @@ var radioStyles = (0, _react2.css)({
141
141
  '--radio-background-color': 'var(--local-background-disabled)',
142
142
  '--radio-border-color': 'var(--local-border-disabled)',
143
143
  '--radio-dot-color': 'var(--local-dot-disabled)'
144
- },
145
- '&:checked:disabled': {
146
- '--radio-border-color': 'transparent' // TODO: Investigate token solution
147
-
148
144
  }
149
145
  });
150
146
  var RadioWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Radio(props, ref) {
@@ -15,13 +15,13 @@ var radioThemeColors = {
15
15
  backgroundChecked: "var(--ds-background-brand-bold, ".concat(_colors.B400, ")"),
16
16
  backgroundCheckedHover: "var(--ds-background-brand-bold-hovered, ".concat(_colors.B300, ")"),
17
17
  backgroundCheckedActive: "var(--ds-background-brand-bold-pressed, ".concat(_colors.B50, ")"),
18
- backgroundDisabled: "var(--ds-background-input, ".concat(_colors.N20, ")"),
19
- dotChecked: "var(--ds-text-inverse, ".concat(_colors.N10, ")"),
20
- dotDisabled: "var(--ds-text-disabled, ".concat(_colors.N70, ")"),
21
- dotActive: "var(--ds-text-inverse, ".concat(_colors.B400, ")"),
18
+ backgroundDisabled: "var(--ds-background-disabled, ".concat(_colors.N20, ")"),
19
+ dotChecked: "var(--ds-icon-inverse, ".concat(_colors.N10, ")"),
20
+ dotDisabled: "var(--ds-icon-disabled, ".concat(_colors.N70, ")"),
21
+ dotActive: "var(--ds-icon-inverse, ".concat(_colors.B400, ")"),
22
22
  border: "var(--ds-border-input, ".concat(_colors.N40, ")"),
23
23
  borderHover: "var(--ds-border-input, ".concat(_colors.N40, ")"),
24
- borderDisabled: "var(--ds-background-disabled, ".concat(_colors.N20, ")"),
24
+ borderDisabled: "var(--ds-border-disabled, ".concat(_colors.N20, ")"),
25
25
  borderFocus: "var(--ds-border-focused, ".concat(_colors.B100, ")")
26
26
  },
27
27
  dark: {
@@ -31,13 +31,13 @@ var radioThemeColors = {
31
31
  backgroundChecked: "var(--ds-background-brand-bold, ".concat(_colors.B400, ")"),
32
32
  backgroundCheckedHover: "var(--ds-background-brand-bold-hovered, ".concat(_colors.B75, ")"),
33
33
  backgroundCheckedActive: "var(--ds-background-brand-bold-pressed, ".concat(_colors.B200, ")"),
34
- backgroundDisabled: "var(--ds-background-input, ".concat(_colors.DN10, ")"),
35
- dotChecked: "var(--ds-text-inverse, ".concat(_colors.DN10, ")"),
36
- dotDisabled: "var(--ds-text-disabled, ".concat(_colors.DN90, ")"),
37
- dotActive: "var(--ds-text-inverse, ".concat(_colors.DN10, ")"),
34
+ backgroundDisabled: "var(--ds-background-disabled, ".concat(_colors.DN10, ")"),
35
+ dotChecked: "var(--ds-icon-inverse, ".concat(_colors.DN10, ")"),
36
+ dotDisabled: "var(--ds-icon-disabled, ".concat(_colors.DN90, ")"),
37
+ dotActive: "var(--ds-icon-inverse, ".concat(_colors.DN10, ")"),
38
38
  border: "var(--ds-border-input, ".concat(_colors.DN80, ")"),
39
39
  borderHover: "var(--ds-border-input, ".concat(_colors.DN200, ")"),
40
- borderDisabled: "var(--ds-background-disabled, ".concat(_colors.DN10, ")"),
40
+ borderDisabled: "var(--ds-border-disabled, ".concat(_colors.DN10, ")"),
41
41
  borderFocus: "var(--ds-border-focused, ".concat(_colors.B75, ")")
42
42
  }
43
43
  };
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.4.5",
3
+ "version": "5.4.6",
4
4
  "sideEffects": false
5
5
  }
@@ -10,7 +10,7 @@ import GlobalTheme from '@atlaskit/theme/components';
10
10
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
11
11
  import getRadioCustomProperties from './styles';
12
12
  const packageName = "@atlaskit/radio";
13
- const packageVersion = "5.4.5";
13
+ const packageVersion = "5.4.6";
14
14
  const fontFamily = getFontFamily();
15
15
  const noop = __noop;
16
16
  const labelPaddingStyles = css({
@@ -122,10 +122,6 @@ const radioStyles = css({
122
122
  '--radio-background-color': 'var(--local-background-disabled)',
123
123
  '--radio-border-color': 'var(--local-border-disabled)',
124
124
  '--radio-dot-color': 'var(--local-dot-disabled)'
125
- },
126
- '&:checked:disabled': {
127
- '--radio-border-color': 'transparent' // TODO: Investigate token solution
128
-
129
125
  }
130
126
  });
131
127
  const RadioWithMode = /*#__PURE__*/forwardRef(function Radio(props, ref) {
@@ -7,13 +7,13 @@ const radioThemeColors = {
7
7
  backgroundChecked: `var(--ds-background-brand-bold, ${B400})`,
8
8
  backgroundCheckedHover: `var(--ds-background-brand-bold-hovered, ${B300})`,
9
9
  backgroundCheckedActive: `var(--ds-background-brand-bold-pressed, ${B50})`,
10
- backgroundDisabled: `var(--ds-background-input, ${N20})`,
11
- dotChecked: `var(--ds-text-inverse, ${N10})`,
12
- dotDisabled: `var(--ds-text-disabled, ${N70})`,
13
- dotActive: `var(--ds-text-inverse, ${B400})`,
10
+ backgroundDisabled: `var(--ds-background-disabled, ${N20})`,
11
+ dotChecked: `var(--ds-icon-inverse, ${N10})`,
12
+ dotDisabled: `var(--ds-icon-disabled, ${N70})`,
13
+ dotActive: `var(--ds-icon-inverse, ${B400})`,
14
14
  border: `var(--ds-border-input, ${N40})`,
15
15
  borderHover: `var(--ds-border-input, ${N40})`,
16
- borderDisabled: `var(--ds-background-disabled, ${N20})`,
16
+ borderDisabled: `var(--ds-border-disabled, ${N20})`,
17
17
  borderFocus: `var(--ds-border-focused, ${B100})`
18
18
  },
19
19
  dark: {
@@ -23,13 +23,13 @@ const radioThemeColors = {
23
23
  backgroundChecked: `var(--ds-background-brand-bold, ${B400})`,
24
24
  backgroundCheckedHover: `var(--ds-background-brand-bold-hovered, ${B75})`,
25
25
  backgroundCheckedActive: `var(--ds-background-brand-bold-pressed, ${B200})`,
26
- backgroundDisabled: `var(--ds-background-input, ${DN10})`,
27
- dotChecked: `var(--ds-text-inverse, ${DN10})`,
28
- dotDisabled: `var(--ds-text-disabled, ${DN90})`,
29
- dotActive: `var(--ds-text-inverse, ${DN10})`,
26
+ backgroundDisabled: `var(--ds-background-disabled, ${DN10})`,
27
+ dotChecked: `var(--ds-icon-inverse, ${DN10})`,
28
+ dotDisabled: `var(--ds-icon-disabled, ${DN90})`,
29
+ dotActive: `var(--ds-icon-inverse, ${DN10})`,
30
30
  border: `var(--ds-border-input, ${DN80})`,
31
31
  borderHover: `var(--ds-border-input, ${DN200})`,
32
- borderDisabled: `var(--ds-background-disabled, ${DN10})`,
32
+ borderDisabled: `var(--ds-border-disabled, ${DN10})`,
33
33
  borderFocus: `var(--ds-border-focused, ${B75})`
34
34
  }
35
35
  };
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.4.5",
3
+ "version": "5.4.6",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/radio.js CHANGED
@@ -12,7 +12,7 @@ import GlobalTheme from '@atlaskit/theme/components';
12
12
  import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
13
13
  import getRadioCustomProperties from './styles';
14
14
  var packageName = "@atlaskit/radio";
15
- var packageVersion = "5.4.5";
15
+ var packageVersion = "5.4.6";
16
16
  var fontFamily = getFontFamily();
17
17
  var noop = __noop;
18
18
  var labelPaddingStyles = css({
@@ -124,10 +124,6 @@ var radioStyles = css({
124
124
  '--radio-background-color': 'var(--local-background-disabled)',
125
125
  '--radio-border-color': 'var(--local-border-disabled)',
126
126
  '--radio-dot-color': 'var(--local-dot-disabled)'
127
- },
128
- '&:checked:disabled': {
129
- '--radio-border-color': 'transparent' // TODO: Investigate token solution
130
-
131
127
  }
132
128
  });
133
129
  var RadioWithMode = /*#__PURE__*/forwardRef(function Radio(props, ref) {
@@ -7,13 +7,13 @@ var radioThemeColors = {
7
7
  backgroundChecked: "var(--ds-background-brand-bold, ".concat(B400, ")"),
8
8
  backgroundCheckedHover: "var(--ds-background-brand-bold-hovered, ".concat(B300, ")"),
9
9
  backgroundCheckedActive: "var(--ds-background-brand-bold-pressed, ".concat(B50, ")"),
10
- backgroundDisabled: "var(--ds-background-input, ".concat(N20, ")"),
11
- dotChecked: "var(--ds-text-inverse, ".concat(N10, ")"),
12
- dotDisabled: "var(--ds-text-disabled, ".concat(N70, ")"),
13
- dotActive: "var(--ds-text-inverse, ".concat(B400, ")"),
10
+ backgroundDisabled: "var(--ds-background-disabled, ".concat(N20, ")"),
11
+ dotChecked: "var(--ds-icon-inverse, ".concat(N10, ")"),
12
+ dotDisabled: "var(--ds-icon-disabled, ".concat(N70, ")"),
13
+ dotActive: "var(--ds-icon-inverse, ".concat(B400, ")"),
14
14
  border: "var(--ds-border-input, ".concat(N40, ")"),
15
15
  borderHover: "var(--ds-border-input, ".concat(N40, ")"),
16
- borderDisabled: "var(--ds-background-disabled, ".concat(N20, ")"),
16
+ borderDisabled: "var(--ds-border-disabled, ".concat(N20, ")"),
17
17
  borderFocus: "var(--ds-border-focused, ".concat(B100, ")")
18
18
  },
19
19
  dark: {
@@ -23,13 +23,13 @@ var radioThemeColors = {
23
23
  backgroundChecked: "var(--ds-background-brand-bold, ".concat(B400, ")"),
24
24
  backgroundCheckedHover: "var(--ds-background-brand-bold-hovered, ".concat(B75, ")"),
25
25
  backgroundCheckedActive: "var(--ds-background-brand-bold-pressed, ".concat(B200, ")"),
26
- backgroundDisabled: "var(--ds-background-input, ".concat(DN10, ")"),
27
- dotChecked: "var(--ds-text-inverse, ".concat(DN10, ")"),
28
- dotDisabled: "var(--ds-text-disabled, ".concat(DN90, ")"),
29
- dotActive: "var(--ds-text-inverse, ".concat(DN10, ")"),
26
+ backgroundDisabled: "var(--ds-background-disabled, ".concat(DN10, ")"),
27
+ dotChecked: "var(--ds-icon-inverse, ".concat(DN10, ")"),
28
+ dotDisabled: "var(--ds-icon-disabled, ".concat(DN90, ")"),
29
+ dotActive: "var(--ds-icon-inverse, ".concat(DN10, ")"),
30
30
  border: "var(--ds-border-input, ".concat(DN80, ")"),
31
31
  borderHover: "var(--ds-border-input, ".concat(DN200, ")"),
32
- borderDisabled: "var(--ds-background-disabled, ".concat(DN10, ")"),
32
+ borderDisabled: "var(--ds-border-disabled, ".concat(DN10, ")"),
33
33
  borderFocus: "var(--ds-border-focused, ".concat(B75, ")")
34
34
  }
35
35
  };
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.4.5",
3
+ "version": "5.4.6",
4
4
  "sideEffects": false
5
5
  }
@@ -5,14 +5,14 @@ export default function getRadioCustomProperties(mode: ThemeModes): {
5
5
  '--local-background-checked': "var(--ds-background-brand-bold)";
6
6
  '--local-background-checked-active': "var(--ds-background-brand-bold-pressed)";
7
7
  '--local-background-checked-hover': "var(--ds-background-brand-bold-hovered)";
8
- '--local-background-disabled': "var(--ds-background-input)";
8
+ '--local-background-disabled': "var(--ds-background-disabled)";
9
9
  '--local-background-hover': "var(--ds-background-input-hovered)";
10
10
  '--local-border': "var(--ds-border-input)";
11
- '--local-border-disabled': "var(--ds-background-disabled)";
11
+ '--local-border-disabled': "var(--ds-border-disabled)";
12
12
  '--local-border-hover': "var(--ds-border-input)";
13
13
  '--local-border-focus': "var(--ds-border-focused)";
14
- '--local-dot-active': "var(--ds-text-inverse)";
15
- '--local-dot-checked': "var(--ds-text-inverse)";
16
- '--local-dot-disabled': "var(--ds-text-disabled)";
14
+ '--local-dot-active': "var(--ds-icon-inverse)";
15
+ '--local-dot-checked': "var(--ds-icon-inverse)";
16
+ '--local-dot-disabled': "var(--ds-icon-disabled)";
17
17
  '--local-invalid': "var(--ds-icon-danger)";
18
18
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/radio",
3
- "version": "5.4.5",
3
+ "version": "5.4.6",
4
4
  "description": "A radio input allows users to select only one option from a number of choices. Radio is generally displayed in a radio group.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
package/report.api.md CHANGED
@@ -1,4 +1,4 @@
1
- <!-- API Report Version: 2.2 -->
1
+ <!-- API Report Version: 2.3 -->
2
2
 
3
3
  ## API Report File for "@atlaskit/radio"
4
4
 
@@ -44,10 +44,28 @@ export const Radio: MemoExoticComponent<
44
44
  ForwardRefExoticComponent<
45
45
  Pick<
46
46
  Omit<
47
- InputHTMLAttributes<HTMLInputElement>,
48
- 'aria-label' | 'checked' | 'disabled' | 'required' | 'value'
49
- >,
50
- keyof {
47
+ Omit<
48
+ InputHTMLAttributes<HTMLInputElement>,
49
+ 'aria-label' | 'checked' | 'disabled' | 'required' | 'value'
50
+ >,
51
+ keyof {
52
+ ariaLabel?: string | undefined;
53
+ isDisabled?: boolean | undefined;
54
+ isRequired?: boolean | undefined;
55
+ isInvalid?: boolean | undefined;
56
+ isChecked?: boolean | undefined;
57
+ label?: ReactNode;
58
+ onChange?:
59
+ | ((
60
+ e: ChangeEvent<HTMLInputElement>,
61
+ analyticsEvent: UIAnalyticsEvent,
62
+ ) => void)
63
+ | undefined;
64
+ value?: string | undefined;
65
+ testId?: string | undefined;
66
+ analyticsContext?: Record<string, any> | undefined;
67
+ }
68
+ > & {
51
69
  ariaLabel?: string | undefined;
52
70
  isDisabled?: boolean | undefined;
53
71
  isRequired?: boolean | undefined;
@@ -63,323 +81,307 @@ export const Radio: MemoExoticComponent<
63
81
  value?: string | undefined;
64
82
  testId?: string | undefined;
65
83
  analyticsContext?: Record<string, any> | undefined;
66
- }
67
- > & {
68
- ariaLabel?: string | undefined;
69
- isDisabled?: boolean | undefined;
70
- isRequired?: boolean | undefined;
71
- isInvalid?: boolean | undefined;
72
- isChecked?: boolean | undefined;
73
- label?: ReactNode;
74
- onChange?:
75
- | ((
76
- e: ChangeEvent<HTMLInputElement>,
77
- analyticsEvent: UIAnalyticsEvent,
78
- ) => void)
79
- | undefined;
80
- value?: string | undefined;
81
- testId?: string | undefined;
82
- analyticsContext?: Record<string, any> | undefined;
83
- } & WithAnalyticsEventsProps,
84
- | 'about'
85
- | 'accept'
86
- | 'accessKey'
87
- | 'alt'
88
- | 'aria-activedescendant'
89
- | 'aria-atomic'
90
- | 'aria-autocomplete'
91
- | 'aria-busy'
92
- | 'aria-checked'
93
- | 'aria-colcount'
94
- | 'aria-colindex'
95
- | 'aria-colspan'
96
- | 'aria-controls'
97
- | 'aria-current'
98
- | 'aria-describedby'
99
- | 'aria-details'
100
- | 'aria-disabled'
101
- | 'aria-dropeffect'
102
- | 'aria-errormessage'
103
- | 'aria-expanded'
104
- | 'aria-flowto'
105
- | 'aria-grabbed'
106
- | 'aria-haspopup'
107
- | 'aria-hidden'
108
- | 'aria-invalid'
109
- | 'aria-keyshortcuts'
110
- | 'aria-labelledby'
111
- | 'aria-level'
112
- | 'aria-live'
113
- | 'aria-modal'
114
- | 'aria-multiline'
115
- | 'aria-multiselectable'
116
- | 'aria-orientation'
117
- | 'aria-owns'
118
- | 'aria-placeholder'
119
- | 'aria-posinset'
120
- | 'aria-pressed'
121
- | 'aria-readonly'
122
- | 'aria-relevant'
123
- | 'aria-required'
124
- | 'aria-roledescription'
125
- | 'aria-rowcount'
126
- | 'aria-rowindex'
127
- | 'aria-rowspan'
128
- | 'aria-selected'
129
- | 'aria-setsize'
130
- | 'aria-sort'
131
- | 'aria-valuemax'
132
- | 'aria-valuemin'
133
- | 'aria-valuenow'
134
- | 'aria-valuetext'
135
- | 'autoCapitalize'
136
- | 'autoComplete'
137
- | 'autoCorrect'
138
- | 'autoFocus'
139
- | 'autoSave'
140
- | 'capture'
141
- | 'children'
142
- | 'className'
143
- | 'color'
144
- | 'contentEditable'
145
- | 'contextMenu'
146
- | 'createAnalyticsEvent'
147
- | 'crossOrigin'
148
- | 'dangerouslySetInnerHTML'
149
- | 'datatype'
150
- | 'defaultChecked'
151
- | 'defaultValue'
152
- | 'dir'
153
- | 'draggable'
154
- | 'form'
155
- | 'formAction'
156
- | 'formEncType'
157
- | 'formMethod'
158
- | 'formNoValidate'
159
- | 'formTarget'
160
- | 'height'
161
- | 'hidden'
162
- | 'id'
163
- | 'inlist'
164
- | 'inputMode'
165
- | 'is'
166
- | 'itemID'
167
- | 'itemProp'
168
- | 'itemRef'
169
- | 'itemScope'
170
- | 'itemType'
171
- | 'lang'
172
- | 'list'
173
- | 'max'
174
- | 'maxLength'
175
- | 'min'
176
- | 'minLength'
177
- | 'multiple'
178
- | 'name'
179
- | 'onAbort'
180
- | 'onAbortCapture'
181
- | 'onAnimationEnd'
182
- | 'onAnimationEndCapture'
183
- | 'onAnimationIteration'
184
- | 'onAnimationIterationCapture'
185
- | 'onAnimationStart'
186
- | 'onAnimationStartCapture'
187
- | 'onAuxClick'
188
- | 'onAuxClickCapture'
189
- | 'onBeforeInput'
190
- | 'onBeforeInputCapture'
191
- | 'onBlur'
192
- | 'onBlurCapture'
193
- | 'onCanPlay'
194
- | 'onCanPlayCapture'
195
- | 'onCanPlayThrough'
196
- | 'onCanPlayThroughCapture'
197
- | 'onChangeCapture'
198
- | 'onClick'
199
- | 'onClickCapture'
200
- | 'onCompositionEnd'
201
- | 'onCompositionEndCapture'
202
- | 'onCompositionStart'
203
- | 'onCompositionStartCapture'
204
- | 'onCompositionUpdate'
205
- | 'onCompositionUpdateCapture'
206
- | 'onContextMenu'
207
- | 'onContextMenuCapture'
208
- | 'onCopy'
209
- | 'onCopyCapture'
210
- | 'onCut'
211
- | 'onCutCapture'
212
- | 'onDoubleClick'
213
- | 'onDoubleClickCapture'
214
- | 'onDrag'
215
- | 'onDragCapture'
216
- | 'onDragEnd'
217
- | 'onDragEndCapture'
218
- | 'onDragEnter'
219
- | 'onDragEnterCapture'
220
- | 'onDragExit'
221
- | 'onDragExitCapture'
222
- | 'onDragLeave'
223
- | 'onDragLeaveCapture'
224
- | 'onDragOver'
225
- | 'onDragOverCapture'
226
- | 'onDragStart'
227
- | 'onDragStartCapture'
228
- | 'onDrop'
229
- | 'onDropCapture'
230
- | 'onDurationChange'
231
- | 'onDurationChangeCapture'
232
- | 'onEmptied'
233
- | 'onEmptiedCapture'
234
- | 'onEncrypted'
235
- | 'onEncryptedCapture'
236
- | 'onEnded'
237
- | 'onEndedCapture'
238
- | 'onError'
239
- | 'onErrorCapture'
240
- | 'onFocus'
241
- | 'onFocusCapture'
242
- | 'onGotPointerCapture'
243
- | 'onGotPointerCaptureCapture'
244
- | 'onInput'
245
- | 'onInputCapture'
246
- | 'onInvalid'
247
- | 'onInvalidCapture'
248
- | 'onKeyDown'
249
- | 'onKeyDownCapture'
250
- | 'onKeyPress'
251
- | 'onKeyPressCapture'
252
- | 'onKeyUp'
253
- | 'onKeyUpCapture'
254
- | 'onLoad'
255
- | 'onLoadCapture'
256
- | 'onLoadStart'
257
- | 'onLoadStartCapture'
258
- | 'onLoadedData'
259
- | 'onLoadedDataCapture'
260
- | 'onLoadedMetadata'
261
- | 'onLoadedMetadataCapture'
262
- | 'onLostPointerCapture'
263
- | 'onLostPointerCaptureCapture'
264
- | 'onMouseDown'
265
- | 'onMouseDownCapture'
266
- | 'onMouseEnter'
267
- | 'onMouseLeave'
268
- | 'onMouseMove'
269
- | 'onMouseMoveCapture'
270
- | 'onMouseOut'
271
- | 'onMouseOutCapture'
272
- | 'onMouseOver'
273
- | 'onMouseOverCapture'
274
- | 'onMouseUp'
275
- | 'onMouseUpCapture'
276
- | 'onPaste'
277
- | 'onPasteCapture'
278
- | 'onPause'
279
- | 'onPauseCapture'
280
- | 'onPlay'
281
- | 'onPlayCapture'
282
- | 'onPlaying'
283
- | 'onPlayingCapture'
284
- | 'onPointerCancel'
285
- | 'onPointerCancelCapture'
286
- | 'onPointerDown'
287
- | 'onPointerDownCapture'
288
- | 'onPointerEnter'
289
- | 'onPointerEnterCapture'
290
- | 'onPointerLeave'
291
- | 'onPointerLeaveCapture'
292
- | 'onPointerMove'
293
- | 'onPointerMoveCapture'
294
- | 'onPointerOut'
295
- | 'onPointerOutCapture'
296
- | 'onPointerOver'
297
- | 'onPointerOverCapture'
298
- | 'onPointerUp'
299
- | 'onPointerUpCapture'
300
- | 'onProgress'
301
- | 'onProgressCapture'
302
- | 'onRateChange'
303
- | 'onRateChangeCapture'
304
- | 'onReset'
305
- | 'onResetCapture'
306
- | 'onScroll'
307
- | 'onScrollCapture'
308
- | 'onSeeked'
309
- | 'onSeekedCapture'
310
- | 'onSeeking'
311
- | 'onSeekingCapture'
312
- | 'onSelect'
313
- | 'onSelectCapture'
314
- | 'onStalled'
315
- | 'onStalledCapture'
316
- | 'onSubmit'
317
- | 'onSubmitCapture'
318
- | 'onSuspend'
319
- | 'onSuspendCapture'
320
- | 'onTimeUpdate'
321
- | 'onTimeUpdateCapture'
322
- | 'onTouchCancel'
323
- | 'onTouchCancelCapture'
324
- | 'onTouchEnd'
325
- | 'onTouchEndCapture'
326
- | 'onTouchMove'
327
- | 'onTouchMoveCapture'
328
- | 'onTouchStart'
329
- | 'onTouchStartCapture'
330
- | 'onTransitionEnd'
331
- | 'onTransitionEndCapture'
332
- | 'onVolumeChange'
333
- | 'onVolumeChangeCapture'
334
- | 'onWaiting'
335
- | 'onWaitingCapture'
336
- | 'onWheel'
337
- | 'onWheelCapture'
338
- | 'pattern'
339
- | 'placeholder'
340
- | 'prefix'
341
- | 'property'
342
- | 'radioGroup'
343
- | 'readOnly'
344
- | 'resource'
345
- | 'results'
346
- | 'role'
347
- | 'security'
348
- | 'size'
349
- | 'slot'
350
- | 'spellCheck'
351
- | 'src'
352
- | 'step'
353
- | 'style'
354
- | 'suppressContentEditableWarning'
355
- | 'suppressHydrationWarning'
356
- | 'tabIndex'
357
- | 'title'
358
- | 'type'
359
- | 'typeof'
360
- | 'unselectable'
361
- | 'vocab'
362
- | 'width'
363
- | keyof {
364
- ariaLabel?: string | undefined;
365
- isDisabled?: boolean | undefined;
366
- isRequired?: boolean | undefined;
367
- isInvalid?: boolean | undefined;
368
- isChecked?: boolean | undefined;
369
- label?: ReactNode;
370
- onChange?:
371
- | ((
372
- e: ChangeEvent<HTMLInputElement>,
373
- analyticsEvent: UIAnalyticsEvent,
374
- ) => void)
375
- | undefined;
376
- value?: string | undefined;
377
- testId?: string | undefined;
378
- analyticsContext?: Record<string, any> | undefined;
379
- }
380
- > &
381
- RefAttributes<HTMLInputElement>
382
- >>;
84
+ } & WithAnalyticsEventsProps,
85
+ | 'about'
86
+ | 'accept'
87
+ | 'accessKey'
88
+ | 'alt'
89
+ | 'aria-activedescendant'
90
+ | 'aria-atomic'
91
+ | 'aria-autocomplete'
92
+ | 'aria-busy'
93
+ | 'aria-checked'
94
+ | 'aria-colcount'
95
+ | 'aria-colindex'
96
+ | 'aria-colspan'
97
+ | 'aria-controls'
98
+ | 'aria-current'
99
+ | 'aria-describedby'
100
+ | 'aria-details'
101
+ | 'aria-disabled'
102
+ | 'aria-dropeffect'
103
+ | 'aria-errormessage'
104
+ | 'aria-expanded'
105
+ | 'aria-flowto'
106
+ | 'aria-grabbed'
107
+ | 'aria-haspopup'
108
+ | 'aria-hidden'
109
+ | 'aria-invalid'
110
+ | 'aria-keyshortcuts'
111
+ | 'aria-labelledby'
112
+ | 'aria-level'
113
+ | 'aria-live'
114
+ | 'aria-modal'
115
+ | 'aria-multiline'
116
+ | 'aria-multiselectable'
117
+ | 'aria-orientation'
118
+ | 'aria-owns'
119
+ | 'aria-placeholder'
120
+ | 'aria-posinset'
121
+ | 'aria-pressed'
122
+ | 'aria-readonly'
123
+ | 'aria-relevant'
124
+ | 'aria-required'
125
+ | 'aria-roledescription'
126
+ | 'aria-rowcount'
127
+ | 'aria-rowindex'
128
+ | 'aria-rowspan'
129
+ | 'aria-selected'
130
+ | 'aria-setsize'
131
+ | 'aria-sort'
132
+ | 'aria-valuemax'
133
+ | 'aria-valuemin'
134
+ | 'aria-valuenow'
135
+ | 'aria-valuetext'
136
+ | 'autoCapitalize'
137
+ | 'autoComplete'
138
+ | 'autoCorrect'
139
+ | 'autoFocus'
140
+ | 'autoSave'
141
+ | 'capture'
142
+ | 'children'
143
+ | 'className'
144
+ | 'color'
145
+ | 'contentEditable'
146
+ | 'contextMenu'
147
+ | 'createAnalyticsEvent'
148
+ | 'crossOrigin'
149
+ | 'dangerouslySetInnerHTML'
150
+ | 'datatype'
151
+ | 'defaultChecked'
152
+ | 'defaultValue'
153
+ | 'dir'
154
+ | 'draggable'
155
+ | 'form'
156
+ | 'formAction'
157
+ | 'formEncType'
158
+ | 'formMethod'
159
+ | 'formNoValidate'
160
+ | 'formTarget'
161
+ | 'height'
162
+ | 'hidden'
163
+ | 'id'
164
+ | 'inlist'
165
+ | 'inputMode'
166
+ | 'is'
167
+ | 'itemID'
168
+ | 'itemProp'
169
+ | 'itemRef'
170
+ | 'itemScope'
171
+ | 'itemType'
172
+ | 'lang'
173
+ | 'list'
174
+ | 'max'
175
+ | 'maxLength'
176
+ | 'min'
177
+ | 'minLength'
178
+ | 'multiple'
179
+ | 'name'
180
+ | 'onAbort'
181
+ | 'onAbortCapture'
182
+ | 'onAnimationEnd'
183
+ | 'onAnimationEndCapture'
184
+ | 'onAnimationIteration'
185
+ | 'onAnimationIterationCapture'
186
+ | 'onAnimationStart'
187
+ | 'onAnimationStartCapture'
188
+ | 'onAuxClick'
189
+ | 'onAuxClickCapture'
190
+ | 'onBeforeInput'
191
+ | 'onBeforeInputCapture'
192
+ | 'onBlur'
193
+ | 'onBlurCapture'
194
+ | 'onCanPlay'
195
+ | 'onCanPlayCapture'
196
+ | 'onCanPlayThrough'
197
+ | 'onCanPlayThroughCapture'
198
+ | 'onChangeCapture'
199
+ | 'onClick'
200
+ | 'onClickCapture'
201
+ | 'onCompositionEnd'
202
+ | 'onCompositionEndCapture'
203
+ | 'onCompositionStart'
204
+ | 'onCompositionStartCapture'
205
+ | 'onCompositionUpdate'
206
+ | 'onCompositionUpdateCapture'
207
+ | 'onContextMenu'
208
+ | 'onContextMenuCapture'
209
+ | 'onCopy'
210
+ | 'onCopyCapture'
211
+ | 'onCut'
212
+ | 'onCutCapture'
213
+ | 'onDoubleClick'
214
+ | 'onDoubleClickCapture'
215
+ | 'onDrag'
216
+ | 'onDragCapture'
217
+ | 'onDragEnd'
218
+ | 'onDragEndCapture'
219
+ | 'onDragEnter'
220
+ | 'onDragEnterCapture'
221
+ | 'onDragExit'
222
+ | 'onDragExitCapture'
223
+ | 'onDragLeave'
224
+ | 'onDragLeaveCapture'
225
+ | 'onDragOver'
226
+ | 'onDragOverCapture'
227
+ | 'onDragStart'
228
+ | 'onDragStartCapture'
229
+ | 'onDrop'
230
+ | 'onDropCapture'
231
+ | 'onDurationChange'
232
+ | 'onDurationChangeCapture'
233
+ | 'onEmptied'
234
+ | 'onEmptiedCapture'
235
+ | 'onEncrypted'
236
+ | 'onEncryptedCapture'
237
+ | 'onEnded'
238
+ | 'onEndedCapture'
239
+ | 'onError'
240
+ | 'onErrorCapture'
241
+ | 'onFocus'
242
+ | 'onFocusCapture'
243
+ | 'onGotPointerCapture'
244
+ | 'onGotPointerCaptureCapture'
245
+ | 'onInput'
246
+ | 'onInputCapture'
247
+ | 'onInvalid'
248
+ | 'onInvalidCapture'
249
+ | 'onKeyDown'
250
+ | 'onKeyDownCapture'
251
+ | 'onKeyPress'
252
+ | 'onKeyPressCapture'
253
+ | 'onKeyUp'
254
+ | 'onKeyUpCapture'
255
+ | 'onLoad'
256
+ | 'onLoadCapture'
257
+ | 'onLoadStart'
258
+ | 'onLoadStartCapture'
259
+ | 'onLoadedData'
260
+ | 'onLoadedDataCapture'
261
+ | 'onLoadedMetadata'
262
+ | 'onLoadedMetadataCapture'
263
+ | 'onLostPointerCapture'
264
+ | 'onLostPointerCaptureCapture'
265
+ | 'onMouseDown'
266
+ | 'onMouseDownCapture'
267
+ | 'onMouseEnter'
268
+ | 'onMouseLeave'
269
+ | 'onMouseMove'
270
+ | 'onMouseMoveCapture'
271
+ | 'onMouseOut'
272
+ | 'onMouseOutCapture'
273
+ | 'onMouseOver'
274
+ | 'onMouseOverCapture'
275
+ | 'onMouseUp'
276
+ | 'onMouseUpCapture'
277
+ | 'onPaste'
278
+ | 'onPasteCapture'
279
+ | 'onPause'
280
+ | 'onPauseCapture'
281
+ | 'onPlay'
282
+ | 'onPlayCapture'
283
+ | 'onPlaying'
284
+ | 'onPlayingCapture'
285
+ | 'onPointerCancel'
286
+ | 'onPointerCancelCapture'
287
+ | 'onPointerDown'
288
+ | 'onPointerDownCapture'
289
+ | 'onPointerEnter'
290
+ | 'onPointerEnterCapture'
291
+ | 'onPointerLeave'
292
+ | 'onPointerLeaveCapture'
293
+ | 'onPointerMove'
294
+ | 'onPointerMoveCapture'
295
+ | 'onPointerOut'
296
+ | 'onPointerOutCapture'
297
+ | 'onPointerOver'
298
+ | 'onPointerOverCapture'
299
+ | 'onPointerUp'
300
+ | 'onPointerUpCapture'
301
+ | 'onProgress'
302
+ | 'onProgressCapture'
303
+ | 'onRateChange'
304
+ | 'onRateChangeCapture'
305
+ | 'onReset'
306
+ | 'onResetCapture'
307
+ | 'onScroll'
308
+ | 'onScrollCapture'
309
+ | 'onSeeked'
310
+ | 'onSeekedCapture'
311
+ | 'onSeeking'
312
+ | 'onSeekingCapture'
313
+ | 'onSelect'
314
+ | 'onSelectCapture'
315
+ | 'onStalled'
316
+ | 'onStalledCapture'
317
+ | 'onSubmit'
318
+ | 'onSubmitCapture'
319
+ | 'onSuspend'
320
+ | 'onSuspendCapture'
321
+ | 'onTimeUpdate'
322
+ | 'onTimeUpdateCapture'
323
+ | 'onTouchCancel'
324
+ | 'onTouchCancelCapture'
325
+ | 'onTouchEnd'
326
+ | 'onTouchEndCapture'
327
+ | 'onTouchMove'
328
+ | 'onTouchMoveCapture'
329
+ | 'onTouchStart'
330
+ | 'onTouchStartCapture'
331
+ | 'onTransitionEnd'
332
+ | 'onTransitionEndCapture'
333
+ | 'onVolumeChange'
334
+ | 'onVolumeChangeCapture'
335
+ | 'onWaiting'
336
+ | 'onWaitingCapture'
337
+ | 'onWheel'
338
+ | 'onWheelCapture'
339
+ | 'pattern'
340
+ | 'placeholder'
341
+ | 'prefix'
342
+ | 'property'
343
+ | 'radioGroup'
344
+ | 'readOnly'
345
+ | 'resource'
346
+ | 'results'
347
+ | 'role'
348
+ | 'security'
349
+ | 'size'
350
+ | 'slot'
351
+ | 'spellCheck'
352
+ | 'src'
353
+ | 'step'
354
+ | 'style'
355
+ | 'suppressContentEditableWarning'
356
+ | 'suppressHydrationWarning'
357
+ | 'tabIndex'
358
+ | 'title'
359
+ | 'type'
360
+ | 'typeof'
361
+ | 'unselectable'
362
+ | 'vocab'
363
+ | 'width'
364
+ | keyof {
365
+ ariaLabel?: string | undefined;
366
+ isDisabled?: boolean | undefined;
367
+ isRequired?: boolean | undefined;
368
+ isInvalid?: boolean | undefined;
369
+ isChecked?: boolean | undefined;
370
+ label?: ReactNode;
371
+ onChange?:
372
+ | ((
373
+ e: ChangeEvent<HTMLInputElement>,
374
+ analyticsEvent: UIAnalyticsEvent,
375
+ ) => void)
376
+ | undefined;
377
+ value?: string | undefined;
378
+ testId?: string | undefined;
379
+ analyticsContext?: Record<string, any> | undefined;
380
+ }
381
+ > &
382
+ RefAttributes<HTMLInputElement>
383
+ >
384
+ >;
383
385
 
384
386
  // @public (undocumented)
385
387
  export function RadioGroup(props: RadioGroupProps): JSX.Element;