@atlaskit/radio 6.0.0 → 6.0.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.md +12 -0
- package/dist/cjs/radio-group.js +5 -2
- package/dist/cjs/radio.js +1 -1
- package/dist/es2019/radio-group.js +5 -2
- package/dist/es2019/radio.js +1 -1
- package/dist/esm/radio-group.js +5 -2
- package/dist/esm/radio.js +1 -1
- package/dist/types/radio-group.d.ts +8 -0
- package/dist/types/radio.d.ts +2 -2
- package/dist/types/types.d.ts +3 -3
- package/dist/types-ts4.5/radio-group.d.ts +8 -0
- package/dist/types-ts4.5/radio.d.ts +2 -2
- package/dist/types-ts4.5/types.d.ts +3 -3
- package/package.json +4 -4
- package/tmp/api-report-tmp.d.ts +0 -91
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @atlaskit/radio
|
|
2
2
|
|
|
3
|
+
## 6.0.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#71177](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/71177) [`a82da4c52cfb`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a82da4c52cfb) - Fix type bug where 'crossOrigin' appeared as a required prop for Radio
|
|
8
|
+
|
|
9
|
+
## 6.0.1
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#61610](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/61610) [`6b5d817a38e9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/6b5d817a38e9) - Expose a `testId` on `RadioGroup`. This applies `data-testid` to the root level element, as well as propagates the value to `Radio` children.
|
|
14
|
+
|
|
3
15
|
## 6.0.0
|
|
4
16
|
|
|
5
17
|
### Major Changes
|
package/dist/cjs/radio-group.js
CHANGED
|
@@ -28,7 +28,8 @@ function RadioGroup(props) {
|
|
|
28
28
|
onInvalid = _props$onInvalid === void 0 ? _noop.default : _props$onInvalid,
|
|
29
29
|
name = props.name,
|
|
30
30
|
analyticsContext = props.analyticsContext,
|
|
31
|
-
ariaLabelledBy = props['aria-labelledby']
|
|
31
|
+
ariaLabelledBy = props['aria-labelledby'],
|
|
32
|
+
testId = props.testId;
|
|
32
33
|
var _useState = (0, _react.useState)(propValue !== undefined ? propValue : defaultValue),
|
|
33
34
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
34
35
|
selectedValue = _useState2[0],
|
|
@@ -45,7 +46,8 @@ function RadioGroup(props) {
|
|
|
45
46
|
var value = typeof propValue !== 'undefined' ? propValue : selectedValue;
|
|
46
47
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
47
48
|
role: "radiogroup",
|
|
48
|
-
"aria-labelledby": ariaLabelledBy
|
|
49
|
+
"aria-labelledby": ariaLabelledBy,
|
|
50
|
+
"data-testid": testId
|
|
49
51
|
}, options.map(function (_ref, index) {
|
|
50
52
|
var optionProps = (0, _extends2.default)({}, ((0, _objectDestructuringEmpty2.default)(_ref), _ref));
|
|
51
53
|
if (typeof isDisabled !== 'undefined') {
|
|
@@ -59,6 +61,7 @@ function RadioGroup(props) {
|
|
|
59
61
|
onInvalid: onInvalid,
|
|
60
62
|
isInvalid: isChecked && isInvalid,
|
|
61
63
|
isChecked: isChecked,
|
|
64
|
+
testId: optionProps.testId || testId,
|
|
62
65
|
isRequired: isRequired,
|
|
63
66
|
analyticsContext: analyticsContext
|
|
64
67
|
}));
|
package/dist/cjs/radio.js
CHANGED
|
@@ -17,7 +17,7 @@ var _constants = require("@atlaskit/theme/constants");
|
|
|
17
17
|
var _excluded = ["ariaLabel", "isDisabled", "isRequired", "isInvalid", "isChecked", "label", "name", "onChange", "value", "testId", "analyticsContext"];
|
|
18
18
|
/** @jsx jsx */
|
|
19
19
|
var packageName = "@atlaskit/radio";
|
|
20
|
-
var packageVersion = "6.0.
|
|
20
|
+
var packageVersion = "6.0.2";
|
|
21
21
|
var fontFamily = (0, _constants.fontFamily)();
|
|
22
22
|
var noop = _noop.default;
|
|
23
23
|
var labelPaddingStyles = (0, _react2.css)({
|
|
@@ -15,7 +15,8 @@ export default function RadioGroup(props) {
|
|
|
15
15
|
onInvalid = noop,
|
|
16
16
|
name,
|
|
17
17
|
analyticsContext,
|
|
18
|
-
['aria-labelledby']: ariaLabelledBy
|
|
18
|
+
['aria-labelledby']: ariaLabelledBy,
|
|
19
|
+
testId
|
|
19
20
|
} = props;
|
|
20
21
|
const [selectedValue, setSelectedValue] = useState(propValue !== undefined ? propValue : defaultValue);
|
|
21
22
|
const onRadioChange = useCallback((e, analyticsEvent) => {
|
|
@@ -30,7 +31,8 @@ export default function RadioGroup(props) {
|
|
|
30
31
|
const value = typeof propValue !== 'undefined' ? propValue : selectedValue;
|
|
31
32
|
return /*#__PURE__*/React.createElement("div", {
|
|
32
33
|
role: "radiogroup",
|
|
33
|
-
"aria-labelledby": ariaLabelledBy
|
|
34
|
+
"aria-labelledby": ariaLabelledBy,
|
|
35
|
+
"data-testid": testId
|
|
34
36
|
}, options.map(({
|
|
35
37
|
...optionProps
|
|
36
38
|
}, index) => {
|
|
@@ -45,6 +47,7 @@ export default function RadioGroup(props) {
|
|
|
45
47
|
onInvalid: onInvalid,
|
|
46
48
|
isInvalid: isChecked && isInvalid,
|
|
47
49
|
isChecked: isChecked,
|
|
50
|
+
testId: optionProps.testId || testId,
|
|
48
51
|
isRequired: isRequired,
|
|
49
52
|
analyticsContext: analyticsContext
|
|
50
53
|
}));
|
package/dist/es2019/radio.js
CHANGED
|
@@ -8,7 +8,7 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
|
8
8
|
import { B100, B300, B400, B50, N10, N100, N20, N30, N40, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
|
|
9
9
|
import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
|
|
10
10
|
const packageName = "@atlaskit/radio";
|
|
11
|
-
const packageVersion = "6.0.
|
|
11
|
+
const packageVersion = "6.0.2";
|
|
12
12
|
const fontFamily = getFontFamily();
|
|
13
13
|
const noop = __noop;
|
|
14
14
|
const labelPaddingStyles = css({
|
package/dist/esm/radio-group.js
CHANGED
|
@@ -18,7 +18,8 @@ export default function RadioGroup(props) {
|
|
|
18
18
|
onInvalid = _props$onInvalid === void 0 ? noop : _props$onInvalid,
|
|
19
19
|
name = props.name,
|
|
20
20
|
analyticsContext = props.analyticsContext,
|
|
21
|
-
ariaLabelledBy = props['aria-labelledby']
|
|
21
|
+
ariaLabelledBy = props['aria-labelledby'],
|
|
22
|
+
testId = props.testId;
|
|
22
23
|
var _useState = useState(propValue !== undefined ? propValue : defaultValue),
|
|
23
24
|
_useState2 = _slicedToArray(_useState, 2),
|
|
24
25
|
selectedValue = _useState2[0],
|
|
@@ -35,7 +36,8 @@ export default function RadioGroup(props) {
|
|
|
35
36
|
var value = typeof propValue !== 'undefined' ? propValue : selectedValue;
|
|
36
37
|
return /*#__PURE__*/React.createElement("div", {
|
|
37
38
|
role: "radiogroup",
|
|
38
|
-
"aria-labelledby": ariaLabelledBy
|
|
39
|
+
"aria-labelledby": ariaLabelledBy,
|
|
40
|
+
"data-testid": testId
|
|
39
41
|
}, options.map(function (_ref, index) {
|
|
40
42
|
var optionProps = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
|
|
41
43
|
if (typeof isDisabled !== 'undefined') {
|
|
@@ -49,6 +51,7 @@ export default function RadioGroup(props) {
|
|
|
49
51
|
onInvalid: onInvalid,
|
|
50
52
|
isInvalid: isChecked && isInvalid,
|
|
51
53
|
isChecked: isChecked,
|
|
54
|
+
testId: optionProps.testId || testId,
|
|
52
55
|
isRequired: isRequired,
|
|
53
56
|
analyticsContext: analyticsContext
|
|
54
57
|
}));
|
package/dist/esm/radio.js
CHANGED
|
@@ -10,7 +10,7 @@ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
|
|
|
10
10
|
import { B100, B300, B400, B50, N10, N100, N20, N30, N40, N70, N80, N900, R300 } from '@atlaskit/theme/colors';
|
|
11
11
|
import { fontFamily as getFontFamily } from '@atlaskit/theme/constants';
|
|
12
12
|
var packageName = "@atlaskit/radio";
|
|
13
|
-
var packageVersion = "6.0.
|
|
13
|
+
var packageVersion = "6.0.2";
|
|
14
14
|
var fontFamily = getFontFamily();
|
|
15
15
|
var noop = __noop;
|
|
16
16
|
var labelPaddingStyles = css({
|
|
@@ -46,5 +46,13 @@ export interface RadioGroupProps {
|
|
|
46
46
|
* The id of the element that links to this radio group.
|
|
47
47
|
*/
|
|
48
48
|
'aria-labelledby'?: string;
|
|
49
|
+
/**
|
|
50
|
+
* A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests
|
|
51
|
+
* The specified `testId` is applied to the root element of `RadioGroup`. If no `testId` is supplied in the `options` prop, then the one supplied to `RadioGroup` will also be propagated to
|
|
52
|
+
* the `Radio` children. Otherwise, the `testId` supplied in the `options` prop will be used.
|
|
53
|
+
*
|
|
54
|
+
* See [here](/components/radio/code#testId) for details about how `testId` is used on `Radio`.
|
|
55
|
+
*/
|
|
56
|
+
testId?: string;
|
|
49
57
|
}
|
|
50
58
|
export default function RadioGroup(props: RadioGroupProps): JSX.Element;
|
package/dist/types/radio.d.ts
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
* - [Code](https://atlassian.design/components/radio/code)
|
|
9
9
|
* - [Usage](https://atlassian.design/components/radio/usage)
|
|
10
10
|
*/
|
|
11
|
-
declare const Radio: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-label" | "disabled" | "required" | "checked" | "value">, keyof {
|
|
11
|
+
declare const Radio: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-label" | "disabled" | "required" | "checked" | "value" | "crossOrigin">, keyof {
|
|
12
12
|
ariaLabel?: string | undefined;
|
|
13
13
|
isDisabled?: boolean | undefined;
|
|
14
14
|
isRequired?: boolean | undefined;
|
|
@@ -30,7 +30,7 @@ declare const Radio: import("react").MemoExoticComponent<import("react").Forward
|
|
|
30
30
|
value?: string | undefined;
|
|
31
31
|
testId?: string | undefined;
|
|
32
32
|
analyticsContext?: Record<string, any> | undefined;
|
|
33
|
-
} & import("@atlaskit/analytics-next").WithAnalyticsEventsProps, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "
|
|
33
|
+
} & import("@atlaskit/analytics-next").WithAnalyticsEventsProps, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "size" | "src" | "step" | "type" | "width" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | keyof {
|
|
34
34
|
ariaLabel?: string | undefined;
|
|
35
35
|
isDisabled?: boolean | undefined;
|
|
36
36
|
isRequired?: boolean | undefined;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -35,7 +35,7 @@ type OwnProps = {
|
|
|
35
35
|
*/
|
|
36
36
|
label?: ReactNode;
|
|
37
37
|
/**
|
|
38
|
-
*
|
|
38
|
+
* OnChange event handler, passed into the props of each `Radio` Component instantiated within `RadioGroup`.
|
|
39
39
|
*/
|
|
40
40
|
onChange?: (e: React.ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void;
|
|
41
41
|
/**
|
|
@@ -55,7 +55,7 @@ type OwnProps = {
|
|
|
55
55
|
analyticsContext?: Record<string, any>;
|
|
56
56
|
};
|
|
57
57
|
type Combine<First, Second> = Omit<First, keyof Second> & Second;
|
|
58
|
-
export type RadioProps = Combine<Omit<React.InputHTMLAttributes<HTMLInputElement>, 'aria-label' | 'disabled' | 'required' | 'checked' | 'value'>, OwnProps> & WithAnalyticsEventsProps;
|
|
58
|
+
export type RadioProps = Combine<Omit<React.InputHTMLAttributes<HTMLInputElement>, 'aria-label' | 'disabled' | 'required' | 'checked' | 'value' | 'crossOrigin'>, OwnProps> & WithAnalyticsEventsProps;
|
|
59
59
|
export interface ExtractReactTypeProps extends WithAnalyticsEventsProps {
|
|
60
60
|
/**
|
|
61
61
|
* The aria-label attribute associated with the radio element.
|
|
@@ -107,7 +107,7 @@ export interface ExtractReactTypeProps extends WithAnalyticsEventsProps {
|
|
|
107
107
|
* A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests
|
|
108
108
|
* we have two different `testId`s generated based on the one you pass to the Radio component:
|
|
109
109
|
* - `{testId}--radio-input` to check if it got changed to checked/unchecked.
|
|
110
|
-
* - `{testId}--radio-label` to click the input
|
|
110
|
+
* - `{testId}--radio-label` to click the input.
|
|
111
111
|
*/
|
|
112
112
|
testId?: string;
|
|
113
113
|
/**
|
|
@@ -46,5 +46,13 @@ export interface RadioGroupProps {
|
|
|
46
46
|
* The id of the element that links to this radio group.
|
|
47
47
|
*/
|
|
48
48
|
'aria-labelledby'?: string;
|
|
49
|
+
/**
|
|
50
|
+
* A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests
|
|
51
|
+
* The specified `testId` is applied to the root element of `RadioGroup`. If no `testId` is supplied in the `options` prop, then the one supplied to `RadioGroup` will also be propagated to
|
|
52
|
+
* the `Radio` children. Otherwise, the `testId` supplied in the `options` prop will be used.
|
|
53
|
+
*
|
|
54
|
+
* See [here](/components/radio/code#testId) for details about how `testId` is used on `Radio`.
|
|
55
|
+
*/
|
|
56
|
+
testId?: string;
|
|
49
57
|
}
|
|
50
58
|
export default function RadioGroup(props: RadioGroupProps): JSX.Element;
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
* - [Code](https://atlassian.design/components/radio/code)
|
|
9
9
|
* - [Usage](https://atlassian.design/components/radio/usage)
|
|
10
10
|
*/
|
|
11
|
-
declare const Radio: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-label" | "disabled" | "required" | "checked" | "value">, keyof {
|
|
11
|
+
declare const Radio: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Pick<Omit<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "aria-label" | "disabled" | "required" | "checked" | "value" | "crossOrigin">, keyof {
|
|
12
12
|
ariaLabel?: string | undefined;
|
|
13
13
|
isDisabled?: boolean | undefined;
|
|
14
14
|
isRequired?: boolean | undefined;
|
|
@@ -30,7 +30,7 @@ declare const Radio: import("react").MemoExoticComponent<import("react").Forward
|
|
|
30
30
|
value?: string | undefined;
|
|
31
31
|
testId?: string | undefined;
|
|
32
32
|
analyticsContext?: Record<string, any> | undefined;
|
|
33
|
-
} & import("@atlaskit/analytics-next").WithAnalyticsEventsProps, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "
|
|
33
|
+
} & import("@atlaskit/analytics-next").WithAnalyticsEventsProps, "accept" | "alt" | "autoComplete" | "autoFocus" | "capture" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "pattern" | "placeholder" | "readOnly" | "size" | "src" | "step" | "type" | "width" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | keyof {
|
|
34
34
|
ariaLabel?: string | undefined;
|
|
35
35
|
isDisabled?: boolean | undefined;
|
|
36
36
|
isRequired?: boolean | undefined;
|
|
@@ -35,7 +35,7 @@ type OwnProps = {
|
|
|
35
35
|
*/
|
|
36
36
|
label?: ReactNode;
|
|
37
37
|
/**
|
|
38
|
-
*
|
|
38
|
+
* OnChange event handler, passed into the props of each `Radio` Component instantiated within `RadioGroup`.
|
|
39
39
|
*/
|
|
40
40
|
onChange?: (e: React.ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void;
|
|
41
41
|
/**
|
|
@@ -55,7 +55,7 @@ type OwnProps = {
|
|
|
55
55
|
analyticsContext?: Record<string, any>;
|
|
56
56
|
};
|
|
57
57
|
type Combine<First, Second> = Omit<First, keyof Second> & Second;
|
|
58
|
-
export type RadioProps = Combine<Omit<React.InputHTMLAttributes<HTMLInputElement>, 'aria-label' | 'disabled' | 'required' | 'checked' | 'value'>, OwnProps> & WithAnalyticsEventsProps;
|
|
58
|
+
export type RadioProps = Combine<Omit<React.InputHTMLAttributes<HTMLInputElement>, 'aria-label' | 'disabled' | 'required' | 'checked' | 'value' | 'crossOrigin'>, OwnProps> & WithAnalyticsEventsProps;
|
|
59
59
|
export interface ExtractReactTypeProps extends WithAnalyticsEventsProps {
|
|
60
60
|
/**
|
|
61
61
|
* The aria-label attribute associated with the radio element.
|
|
@@ -107,7 +107,7 @@ export interface ExtractReactTypeProps extends WithAnalyticsEventsProps {
|
|
|
107
107
|
* A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests
|
|
108
108
|
* we have two different `testId`s generated based on the one you pass to the Radio component:
|
|
109
109
|
* - `{testId}--radio-input` to check if it got changed to checked/unchecked.
|
|
110
|
-
* - `{testId}--radio-label` to click the input
|
|
110
|
+
* - `{testId}--radio-label` to click the input.
|
|
111
111
|
*/
|
|
112
112
|
testId?: string;
|
|
113
113
|
/**
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/radio",
|
|
3
|
-
"version": "6.0.
|
|
3
|
+
"version": "6.0.2",
|
|
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/"
|
|
@@ -40,11 +40,11 @@
|
|
|
40
40
|
".": "./src/index.tsx"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
|
-
"@atlaskit/analytics-next": "^9.
|
|
43
|
+
"@atlaskit/analytics-next": "^9.2.0",
|
|
44
44
|
"@atlaskit/ds-lib": "^2.2.0",
|
|
45
45
|
"@atlaskit/platform-feature-flags": "^0.2.0",
|
|
46
46
|
"@atlaskit/theme": "^12.6.0",
|
|
47
|
-
"@atlaskit/tokens": "^1.
|
|
47
|
+
"@atlaskit/tokens": "^1.36.0",
|
|
48
48
|
"@babel/runtime": "^7.0.0",
|
|
49
49
|
"@emotion/react": "^11.7.1"
|
|
50
50
|
},
|
|
@@ -53,9 +53,9 @@
|
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"@af/accessibility-testing": "*",
|
|
56
|
+
"@af/integration-testing": "*",
|
|
56
57
|
"@atlaskit/ssr": "*",
|
|
57
58
|
"@atlaskit/visual-regression": "*",
|
|
58
|
-
"@atlaskit/webdriver-runner": "*",
|
|
59
59
|
"@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
|
|
60
60
|
"@atlassian/feature-flags-test-utils": "*",
|
|
61
61
|
"@testing-library/react": "^12.1.5",
|
package/tmp/api-report-tmp.d.ts
DELETED
|
@@ -1,91 +0,0 @@
|
|
|
1
|
-
## API Report File for "@atlaskit/radio"
|
|
2
|
-
|
|
3
|
-
> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
|
|
4
|
-
|
|
5
|
-
```ts
|
|
6
|
-
|
|
7
|
-
/// <reference types="react" />
|
|
8
|
-
|
|
9
|
-
import { ChangeEvent } from 'react';
|
|
10
|
-
import { ForwardRefExoticComponent } from 'react';
|
|
11
|
-
import { InputHTMLAttributes } from 'react';
|
|
12
|
-
import { MemoExoticComponent } from 'react';
|
|
13
|
-
import { default as React_2 } from 'react';
|
|
14
|
-
import { ReactNode } from 'react';
|
|
15
|
-
import { RefAttributes } from 'react';
|
|
16
|
-
import { SyntheticEvent } from 'react';
|
|
17
|
-
import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
18
|
-
import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
|
|
19
|
-
|
|
20
|
-
// @public (undocumented)
|
|
21
|
-
type OptionPropType = {
|
|
22
|
-
isDisabled?: boolean;
|
|
23
|
-
label?: ReactNode;
|
|
24
|
-
name?: string;
|
|
25
|
-
value?: RadioValue;
|
|
26
|
-
testId?: string;
|
|
27
|
-
};
|
|
28
|
-
|
|
29
|
-
// @public (undocumented)
|
|
30
|
-
type OptionsPropType = Array<OptionPropType>;
|
|
31
|
-
|
|
32
|
-
// @public
|
|
33
|
-
export const Radio: MemoExoticComponent<ForwardRefExoticComponent<Pick<Omit<Omit<InputHTMLAttributes<HTMLInputElement>, "aria-label" | "checked" | "disabled" | "required" | "value">, keyof {
|
|
34
|
-
ariaLabel?: string | undefined;
|
|
35
|
-
isDisabled?: boolean | undefined;
|
|
36
|
-
isRequired?: boolean | undefined;
|
|
37
|
-
isInvalid?: boolean | undefined;
|
|
38
|
-
isChecked?: boolean | undefined;
|
|
39
|
-
label?: ReactNode;
|
|
40
|
-
onChange?: ((e: ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void) | undefined;
|
|
41
|
-
value?: string | undefined;
|
|
42
|
-
testId?: string | undefined;
|
|
43
|
-
analyticsContext?: Record<string, any> | undefined;
|
|
44
|
-
}> & {
|
|
45
|
-
ariaLabel?: string | undefined;
|
|
46
|
-
isDisabled?: boolean | undefined;
|
|
47
|
-
isRequired?: boolean | undefined;
|
|
48
|
-
isInvalid?: boolean | undefined;
|
|
49
|
-
isChecked?: boolean | undefined;
|
|
50
|
-
label?: ReactNode;
|
|
51
|
-
onChange?: ((e: ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void) | undefined;
|
|
52
|
-
value?: string | undefined;
|
|
53
|
-
testId?: string | undefined;
|
|
54
|
-
analyticsContext?: Record<string, any> | undefined;
|
|
55
|
-
} & WithAnalyticsEventsProps, "about" | "accept" | "accessKey" | "alt" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "autoCapitalize" | "autoComplete" | "autoCorrect" | "autoFocus" | "autoSave" | "capture" | "children" | "className" | "color" | "contentEditable" | "contextMenu" | "createAnalyticsEvent" | "crossOrigin" | "dangerouslySetInnerHTML" | "datatype" | "defaultChecked" | "defaultValue" | "dir" | "draggable" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "height" | "hidden" | "id" | "inlist" | "inputMode" | "is" | "itemID" | "itemProp" | "itemRef" | "itemScope" | "itemType" | "lang" | "list" | "max" | "maxLength" | "min" | "minLength" | "multiple" | "name" | "onAbort" | "onAbortCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAuxClick" | "onAuxClickCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onBlur" | "onBlurCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onChangeCapture" | "onClick" | "onClickCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onContextMenu" | "onContextMenuCapture" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onError" | "onErrorCapture" | "onFocus" | "onFocusCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onInput" | "onInputCapture" | "onInvalid" | "onInvalidCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onLoad" | "onLoadCapture" | "onLoadStart" | "onLoadStartCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onPaste" | "onPasteCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerOut" | "onPointerOutCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerUp" | "onPointerUpCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onReset" | "onResetCapture" | "onScroll" | "onScrollCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onSelect" | "onSelectCapture" | "onStalled" | "onStalledCapture" | "onSubmit" | "onSubmitCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onWheel" | "onWheelCapture" | "pattern" | "placeholder" | "prefix" | "property" | "radioGroup" | "readOnly" | "resource" | "results" | "role" | "security" | "size" | "slot" | "spellCheck" | "src" | "step" | "style" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "tabIndex" | "title" | "translate" | "type" | "typeof" | "unselectable" | "vocab" | "width" | keyof {
|
|
56
|
-
ariaLabel?: string | undefined;
|
|
57
|
-
isDisabled?: boolean | undefined;
|
|
58
|
-
isRequired?: boolean | undefined;
|
|
59
|
-
isInvalid?: boolean | undefined;
|
|
60
|
-
isChecked?: boolean | undefined;
|
|
61
|
-
label?: ReactNode;
|
|
62
|
-
onChange?: ((e: ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void) | undefined;
|
|
63
|
-
value?: string | undefined;
|
|
64
|
-
testId?: string | undefined;
|
|
65
|
-
analyticsContext?: Record<string, any> | undefined;
|
|
66
|
-
}> & RefAttributes<HTMLInputElement>>>;
|
|
67
|
-
|
|
68
|
-
// @public (undocumented)
|
|
69
|
-
export function RadioGroup(props: RadioGroupProps): JSX.Element;
|
|
70
|
-
|
|
71
|
-
// @public (undocumented)
|
|
72
|
-
interface RadioGroupProps {
|
|
73
|
-
'aria-labelledby'?: string;
|
|
74
|
-
analyticsContext?: Record<string, any>;
|
|
75
|
-
defaultValue?: RadioValue | null;
|
|
76
|
-
isDisabled?: boolean;
|
|
77
|
-
isInvalid?: boolean;
|
|
78
|
-
isRequired?: boolean;
|
|
79
|
-
name?: string;
|
|
80
|
-
onChange?: (e: React_2.ChangeEvent<HTMLInputElement>, analyticsEvent: UIAnalyticsEvent) => void;
|
|
81
|
-
onInvalid?: (event: SyntheticEvent<any>) => void;
|
|
82
|
-
options: OptionsPropType;
|
|
83
|
-
value?: RadioValue | null;
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
// @public (undocumented)
|
|
87
|
-
type RadioValue = string;
|
|
88
|
-
|
|
89
|
-
// (No @packageDocumentation comment for this package)
|
|
90
|
-
|
|
91
|
-
```
|