carbon-react 111.12.4 → 111.12.5
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/esm/__internal__/radio-button-mapper/index.d.ts +2 -2
- package/esm/__internal__/radio-button-mapper/radio-button-mapper.component.d.ts +29 -0
- package/esm/__internal__/radio-button-mapper/radio-button-mapper.component.js +20 -26
- package/esm/components/checkbox/checkbox.style.d.ts +1 -1
- package/esm/components/radio-button/index.d.ts +4 -6
- package/esm/components/radio-button/index.js +2 -2
- package/esm/components/radio-button/radio-button-group.component.d.ts +42 -0
- package/esm/components/radio-button/radio-button-group.component.js +181 -67
- package/esm/components/radio-button/radio-button-group.style.d.ts +5 -0
- package/esm/components/radio-button/radio-button-svg.component.d.ts +3 -0
- package/esm/components/radio-button/radio-button-svg.component.js +1 -0
- package/esm/components/radio-button/radio-button.component.d.ts +28 -0
- package/esm/components/radio-button/radio-button.component.js +529 -107
- package/esm/components/radio-button/radio-button.style.d.ts +5 -0
- package/lib/__internal__/radio-button-mapper/index.d.ts +2 -2
- package/lib/__internal__/radio-button-mapper/radio-button-mapper.component.d.ts +29 -0
- package/lib/__internal__/radio-button-mapper/radio-button-mapper.component.js +20 -26
- package/lib/components/checkbox/checkbox.style.d.ts +1 -1
- package/lib/components/radio-button/index.d.ts +4 -6
- package/lib/components/radio-button/index.js +1 -11
- package/lib/components/radio-button/radio-button-group.component.d.ts +42 -0
- package/lib/components/radio-button/radio-button-group.component.js +182 -70
- package/lib/components/radio-button/radio-button-group.style.d.ts +5 -0
- package/lib/components/radio-button/radio-button-svg.component.d.ts +3 -0
- package/lib/components/radio-button/radio-button-svg.component.js +2 -0
- package/lib/components/radio-button/radio-button.component.d.ts +28 -0
- package/lib/components/radio-button/radio-button.component.js +530 -109
- package/lib/components/radio-button/radio-button.style.d.ts +5 -0
- package/package.json +1 -1
- package/esm/__internal__/radio-button-mapper/radio-button-mapper.d.ts +0 -20
- package/esm/components/radio-button/radio-button-group.d.ts +0 -42
- package/esm/components/radio-button/radio-button.d.ts +0 -30
- package/lib/__internal__/radio-button-mapper/radio-button-mapper.d.ts +0 -20
- package/lib/components/radio-button/radio-button-group.d.ts +0 -42
- package/lib/components/radio-button/radio-button.d.ts +0 -30
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from "./radio-button-mapper";
|
|
2
|
-
export
|
|
1
|
+
export { default } from "./radio-button-mapper.component";
|
|
2
|
+
export type { RadioButtonMapperProps, MappedChildProps, } from "./radio-button-mapper.component";
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
interface InputEvents {
|
|
3
|
+
/** Callback fired when each RadioButton is blurred */
|
|
4
|
+
onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
5
|
+
/** Callback fired when the user selects a RadioButton */
|
|
6
|
+
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
|
|
7
|
+
/** Callback fired on mouse down */
|
|
8
|
+
onMouseDown?: (event: React.MouseEvent<HTMLInputElement>) => void;
|
|
9
|
+
/** Callback fired on key down */
|
|
10
|
+
onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
|
|
11
|
+
}
|
|
12
|
+
export interface RadioButtonMapperProps extends InputEvents {
|
|
13
|
+
/** The RadioButton objects to be rendered in the group */
|
|
14
|
+
children?: React.ReactNode;
|
|
15
|
+
/** Specifies the name prop to be applied to each button in the group */
|
|
16
|
+
name: string;
|
|
17
|
+
/** Value of the selected RadioButton */
|
|
18
|
+
value?: string;
|
|
19
|
+
}
|
|
20
|
+
export interface MappedChildProps {
|
|
21
|
+
defaultChecked?: boolean;
|
|
22
|
+
checked: boolean;
|
|
23
|
+
name: string;
|
|
24
|
+
}
|
|
25
|
+
declare const RadioButtonMapper: {
|
|
26
|
+
({ children, name, onBlur, onChange, onMouseDown, onKeyDown, value, }: RadioButtonMapperProps): JSX.Element;
|
|
27
|
+
displayName: string;
|
|
28
|
+
};
|
|
29
|
+
export default RadioButtonMapper;
|
|
@@ -14,7 +14,7 @@ const RadioButtonMapper = ({
|
|
|
14
14
|
const anyChecked = useMemo(() => {
|
|
15
15
|
let result = false;
|
|
16
16
|
filteredChildren.forEach(child => {
|
|
17
|
-
if (Object.prototype.hasOwnProperty.call(child.props, "defaultChecked")) {
|
|
17
|
+
if ( /*#__PURE__*/React.isValidElement(child) && Object.prototype.hasOwnProperty.call(child.props, "defaultChecked")) {
|
|
18
18
|
result = true;
|
|
19
19
|
}
|
|
20
20
|
});
|
|
@@ -22,18 +22,21 @@ const RadioButtonMapper = ({
|
|
|
22
22
|
}, [filteredChildren]);
|
|
23
23
|
const isControlled = value !== undefined;
|
|
24
24
|
const [checkedValue, setCheckedValue] = useState(false);
|
|
25
|
-
const onChangeProp = useCallback(
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
}
|
|
25
|
+
const onChangeProp = useCallback(event => {
|
|
26
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(event);
|
|
27
|
+
/* istanbul ignore else */
|
|
29
28
|
|
|
30
29
|
if (!isControlled) {
|
|
31
|
-
setCheckedValue(
|
|
30
|
+
setCheckedValue(event.target.value);
|
|
32
31
|
}
|
|
33
32
|
}, [onChange, setCheckedValue, isControlled]);
|
|
34
33
|
const buttons = filteredChildren.map(child => {
|
|
35
34
|
let checked;
|
|
36
35
|
|
|
36
|
+
if (! /*#__PURE__*/React.isValidElement(child)) {
|
|
37
|
+
return child;
|
|
38
|
+
}
|
|
39
|
+
|
|
37
40
|
if (isControlled) {
|
|
38
41
|
// The user is controlling the input via the value prop
|
|
39
42
|
checked = value === child.props.value;
|
|
@@ -45,7 +48,7 @@ const RadioButtonMapper = ({
|
|
|
45
48
|
checked = checkedValue === child.props.value;
|
|
46
49
|
}
|
|
47
50
|
|
|
48
|
-
|
|
51
|
+
const childProps = {
|
|
49
52
|
defaultChecked: undefined,
|
|
50
53
|
checked,
|
|
51
54
|
name,
|
|
@@ -53,29 +56,20 @@ const RadioButtonMapper = ({
|
|
|
53
56
|
onMouseDown,
|
|
54
57
|
onChange: onChangeProp,
|
|
55
58
|
onKeyDown
|
|
56
|
-
}
|
|
59
|
+
};
|
|
60
|
+
return /*#__PURE__*/React.cloneElement(child, childProps);
|
|
57
61
|
});
|
|
58
|
-
return buttons;
|
|
62
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, buttons);
|
|
59
63
|
};
|
|
60
64
|
|
|
61
65
|
RadioButtonMapper.propTypes = {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
onBlur: PropTypes.func,
|
|
70
|
-
|
|
71
|
-
/** Callback fired when the user selects a RadioButton */
|
|
72
|
-
onChange: PropTypes.func,
|
|
73
|
-
|
|
74
|
-
/** Callback fired on key down */
|
|
75
|
-
onKeyDown: PropTypes.func,
|
|
76
|
-
|
|
77
|
-
/** Value of the selected RadioButton */
|
|
78
|
-
value: PropTypes.string
|
|
66
|
+
"children": PropTypes.node,
|
|
67
|
+
"name": PropTypes.string.isRequired,
|
|
68
|
+
"onBlur": PropTypes.func,
|
|
69
|
+
"onChange": PropTypes.func,
|
|
70
|
+
"onKeyDown": PropTypes.func,
|
|
71
|
+
"onMouseDown": PropTypes.func,
|
|
72
|
+
"value": PropTypes.string
|
|
79
73
|
};
|
|
80
74
|
RadioButtonMapper.displayName = "RadioButtonMapper";
|
|
81
75
|
export default RadioButtonMapper;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { MarginProps } from "styled-system";
|
|
2
2
|
import { ValidationProps } from "../../__internal__/validations";
|
|
3
|
-
interface StyledCheckboxProps extends ValidationProps, MarginProps {
|
|
3
|
+
export interface StyledCheckboxProps extends ValidationProps, MarginProps {
|
|
4
4
|
disabled?: boolean;
|
|
5
5
|
fieldHelpInline?: boolean;
|
|
6
6
|
inputWidth?: number | string;
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
} from "./radio-button";
|
|
6
|
-
export { default as RadioButtonGroup } from "./radio-button-group";
|
|
1
|
+
import RadioButton from "./radio-button.component";
|
|
2
|
+
import RadioButtonGroup from "./radio-button-group.component";
|
|
3
|
+
export { RadioButton, RadioButtonGroup };
|
|
4
|
+
export default RadioButton;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import RadioButton
|
|
1
|
+
import RadioButton from "./radio-button.component";
|
|
2
2
|
import RadioButtonGroup from "./radio-button-group.component";
|
|
3
|
-
export { RadioButton, RadioButtonGroup
|
|
3
|
+
export { RadioButton, RadioButtonGroup };
|
|
4
4
|
export default RadioButton;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { MarginProps } from "styled-system";
|
|
3
|
+
import { ValidationProps } from "../../__internal__/validations";
|
|
4
|
+
export interface RadioButtonGroupProps extends ValidationProps, MarginProps {
|
|
5
|
+
/** Breakpoint for adaptive legend (inline labels change to top aligned). Enables the adaptive behaviour when set */
|
|
6
|
+
adaptiveLegendBreakpoint?: number;
|
|
7
|
+
/** Breakpoint for adaptive spacing (left margin changes to 0). Enables the adaptive behaviour when set */
|
|
8
|
+
adaptiveSpacingBreakpoint?: number;
|
|
9
|
+
/** The RadioButton objects to be rendered in the group */
|
|
10
|
+
children: React.ReactNode;
|
|
11
|
+
/** When true, RadioButtons are in line */
|
|
12
|
+
inline?: boolean;
|
|
13
|
+
/** Spacing between labels and radio buttons, given number will be multiplied by base spacing unit (8) */
|
|
14
|
+
labelSpacing?: 1 | 2;
|
|
15
|
+
/** The content for the RadioGroup Legend */
|
|
16
|
+
legend?: string;
|
|
17
|
+
/** Text alignment of legend when inline */
|
|
18
|
+
legendAlign?: "left" | "right";
|
|
19
|
+
/** When true, legend is placed in line with the radiobuttons */
|
|
20
|
+
legendInline?: boolean;
|
|
21
|
+
/** Spacing between legend and field for inline legend, number multiplied by base spacing unit (8) */
|
|
22
|
+
legendSpacing?: 1 | 2;
|
|
23
|
+
/** Percentage width of legend (only when legend is inline) */
|
|
24
|
+
legendWidth?: number;
|
|
25
|
+
/** Specifies the name prop to be applied to each button in the group */
|
|
26
|
+
name: string;
|
|
27
|
+
/** Callback fired when each RadioButton is blurred */
|
|
28
|
+
onBlur?: (ev: React.FocusEvent<HTMLInputElement>) => void;
|
|
29
|
+
/** Callback fired when the user selects a RadioButton */
|
|
30
|
+
onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
|
|
31
|
+
/** Flag to configure component as mandatory */
|
|
32
|
+
required?: boolean;
|
|
33
|
+
/** value of the selected RadioButton */
|
|
34
|
+
value?: string;
|
|
35
|
+
/** Overrides the default tooltip position */
|
|
36
|
+
tooltipPosition?: "top" | "bottom" | "left" | "right";
|
|
37
|
+
}
|
|
38
|
+
export declare const RadioButtonGroup: {
|
|
39
|
+
(props: RadioButtonGroupProps): JSX.Element;
|
|
40
|
+
displayName: string;
|
|
41
|
+
};
|
|
42
|
+
export default RadioButtonGroup;
|
|
@@ -2,7 +2,6 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
|
|
|
2
2
|
|
|
3
3
|
import React from "react";
|
|
4
4
|
import PropTypes from "prop-types";
|
|
5
|
-
import styledSystemPropTypes from "@styled-system/prop-types";
|
|
6
5
|
import tagComponent from "../../__internal__/utils/helpers/tags/tags";
|
|
7
6
|
import Fieldset from "../../__internal__/fieldset";
|
|
8
7
|
import RadioButtonGroupStyle from "./radio-button-group.style";
|
|
@@ -10,7 +9,6 @@ import RadioButtonMapper from "../../__internal__/radio-button-mapper/radio-butt
|
|
|
10
9
|
import useIsAboveBreakpoint from "../../hooks/__internal__/useIsAboveBreakpoint";
|
|
11
10
|
import { filterStyledSystemMarginProps } from "../../style/utils";
|
|
12
11
|
import { TooltipProvider } from "../../__internal__/tooltip-provider";
|
|
13
|
-
const marginPropTypes = filterStyledSystemMarginProps(styledSystemPropTypes.space);
|
|
14
12
|
|
|
15
13
|
const RadioButtonGroup = props => {
|
|
16
14
|
const {
|
|
@@ -40,7 +38,7 @@ const RadioButtonGroup = props => {
|
|
|
40
38
|
let inlineLegend = legendInline;
|
|
41
39
|
|
|
42
40
|
if (adaptiveLegendBreakpoint) {
|
|
43
|
-
inlineLegend = isAboveLegendBreakpoint;
|
|
41
|
+
inlineLegend = !!isAboveLegendBreakpoint;
|
|
44
42
|
}
|
|
45
43
|
|
|
46
44
|
let marginLeft = marginProps.ml;
|
|
@@ -75,6 +73,10 @@ const RadioButtonGroup = props => {
|
|
|
75
73
|
onChange: onChange,
|
|
76
74
|
value: value
|
|
77
75
|
}, React.Children.map(children, child => {
|
|
76
|
+
if (! /*#__PURE__*/React.isValidElement(child)) {
|
|
77
|
+
return child;
|
|
78
|
+
}
|
|
79
|
+
|
|
78
80
|
return /*#__PURE__*/React.cloneElement(child, {
|
|
79
81
|
inline,
|
|
80
82
|
labelSpacing,
|
|
@@ -87,69 +89,181 @@ const RadioButtonGroup = props => {
|
|
|
87
89
|
})))));
|
|
88
90
|
};
|
|
89
91
|
|
|
90
|
-
RadioButtonGroup.propTypes = {
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
children: PropTypes.node
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
92
|
+
RadioButtonGroup.propTypes = {
|
|
93
|
+
"adaptiveLegendBreakpoint": PropTypes.number,
|
|
94
|
+
"adaptiveSpacingBreakpoint": PropTypes.number,
|
|
95
|
+
"children": PropTypes.node,
|
|
96
|
+
"error": PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
|
|
97
|
+
"info": PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
|
|
98
|
+
"inline": PropTypes.bool,
|
|
99
|
+
"labelSpacing": PropTypes.oneOf([1, 2]),
|
|
100
|
+
"legend": PropTypes.string,
|
|
101
|
+
"legendAlign": PropTypes.oneOf(["left", "right"]),
|
|
102
|
+
"legendInline": PropTypes.bool,
|
|
103
|
+
"legendSpacing": PropTypes.oneOf([1, 2]),
|
|
104
|
+
"legendWidth": PropTypes.number,
|
|
105
|
+
"m": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
106
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
107
|
+
"description": PropTypes.string,
|
|
108
|
+
"toString": PropTypes.func.isRequired,
|
|
109
|
+
"valueOf": PropTypes.func.isRequired
|
|
110
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
111
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
112
|
+
"description": PropTypes.string,
|
|
113
|
+
"toString": PropTypes.func.isRequired,
|
|
114
|
+
"valueOf": PropTypes.func.isRequired
|
|
115
|
+
}), PropTypes.string]),
|
|
116
|
+
"margin": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
117
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
118
|
+
"description": PropTypes.string,
|
|
119
|
+
"toString": PropTypes.func.isRequired,
|
|
120
|
+
"valueOf": PropTypes.func.isRequired
|
|
121
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
122
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
123
|
+
"description": PropTypes.string,
|
|
124
|
+
"toString": PropTypes.func.isRequired,
|
|
125
|
+
"valueOf": PropTypes.func.isRequired
|
|
126
|
+
}), PropTypes.string]),
|
|
127
|
+
"marginBottom": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
128
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
129
|
+
"description": PropTypes.string,
|
|
130
|
+
"toString": PropTypes.func.isRequired,
|
|
131
|
+
"valueOf": PropTypes.func.isRequired
|
|
132
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
133
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
134
|
+
"description": PropTypes.string,
|
|
135
|
+
"toString": PropTypes.func.isRequired,
|
|
136
|
+
"valueOf": PropTypes.func.isRequired
|
|
137
|
+
}), PropTypes.string]),
|
|
138
|
+
"marginLeft": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
139
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
140
|
+
"description": PropTypes.string,
|
|
141
|
+
"toString": PropTypes.func.isRequired,
|
|
142
|
+
"valueOf": PropTypes.func.isRequired
|
|
143
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
144
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
145
|
+
"description": PropTypes.string,
|
|
146
|
+
"toString": PropTypes.func.isRequired,
|
|
147
|
+
"valueOf": PropTypes.func.isRequired
|
|
148
|
+
}), PropTypes.string]),
|
|
149
|
+
"marginRight": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
150
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
151
|
+
"description": PropTypes.string,
|
|
152
|
+
"toString": PropTypes.func.isRequired,
|
|
153
|
+
"valueOf": PropTypes.func.isRequired
|
|
154
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
155
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
156
|
+
"description": PropTypes.string,
|
|
157
|
+
"toString": PropTypes.func.isRequired,
|
|
158
|
+
"valueOf": PropTypes.func.isRequired
|
|
159
|
+
}), PropTypes.string]),
|
|
160
|
+
"marginTop": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
161
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
162
|
+
"description": PropTypes.string,
|
|
163
|
+
"toString": PropTypes.func.isRequired,
|
|
164
|
+
"valueOf": PropTypes.func.isRequired
|
|
165
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
166
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
167
|
+
"description": PropTypes.string,
|
|
168
|
+
"toString": PropTypes.func.isRequired,
|
|
169
|
+
"valueOf": PropTypes.func.isRequired
|
|
170
|
+
}), PropTypes.string]),
|
|
171
|
+
"marginX": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
172
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
173
|
+
"description": PropTypes.string,
|
|
174
|
+
"toString": PropTypes.func.isRequired,
|
|
175
|
+
"valueOf": PropTypes.func.isRequired
|
|
176
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
177
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
178
|
+
"description": PropTypes.string,
|
|
179
|
+
"toString": PropTypes.func.isRequired,
|
|
180
|
+
"valueOf": PropTypes.func.isRequired
|
|
181
|
+
}), PropTypes.string]),
|
|
182
|
+
"marginY": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
183
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
184
|
+
"description": PropTypes.string,
|
|
185
|
+
"toString": PropTypes.func.isRequired,
|
|
186
|
+
"valueOf": PropTypes.func.isRequired
|
|
187
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
188
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
189
|
+
"description": PropTypes.string,
|
|
190
|
+
"toString": PropTypes.func.isRequired,
|
|
191
|
+
"valueOf": PropTypes.func.isRequired
|
|
192
|
+
}), PropTypes.string]),
|
|
193
|
+
"mb": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
194
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
195
|
+
"description": PropTypes.string,
|
|
196
|
+
"toString": PropTypes.func.isRequired,
|
|
197
|
+
"valueOf": PropTypes.func.isRequired
|
|
198
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
199
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
200
|
+
"description": PropTypes.string,
|
|
201
|
+
"toString": PropTypes.func.isRequired,
|
|
202
|
+
"valueOf": PropTypes.func.isRequired
|
|
203
|
+
}), PropTypes.string]),
|
|
204
|
+
"ml": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
205
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
206
|
+
"description": PropTypes.string,
|
|
207
|
+
"toString": PropTypes.func.isRequired,
|
|
208
|
+
"valueOf": PropTypes.func.isRequired
|
|
209
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
210
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
211
|
+
"description": PropTypes.string,
|
|
212
|
+
"toString": PropTypes.func.isRequired,
|
|
213
|
+
"valueOf": PropTypes.func.isRequired
|
|
214
|
+
}), PropTypes.string]),
|
|
215
|
+
"mr": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
216
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
217
|
+
"description": PropTypes.string,
|
|
218
|
+
"toString": PropTypes.func.isRequired,
|
|
219
|
+
"valueOf": PropTypes.func.isRequired
|
|
220
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
221
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
222
|
+
"description": PropTypes.string,
|
|
223
|
+
"toString": PropTypes.func.isRequired,
|
|
224
|
+
"valueOf": PropTypes.func.isRequired
|
|
225
|
+
}), PropTypes.string]),
|
|
226
|
+
"mt": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
227
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
228
|
+
"description": PropTypes.string,
|
|
229
|
+
"toString": PropTypes.func.isRequired,
|
|
230
|
+
"valueOf": PropTypes.func.isRequired
|
|
231
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
232
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
233
|
+
"description": PropTypes.string,
|
|
234
|
+
"toString": PropTypes.func.isRequired,
|
|
235
|
+
"valueOf": PropTypes.func.isRequired
|
|
236
|
+
}), PropTypes.string]),
|
|
237
|
+
"mx": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
238
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
239
|
+
"description": PropTypes.string,
|
|
240
|
+
"toString": PropTypes.func.isRequired,
|
|
241
|
+
"valueOf": PropTypes.func.isRequired
|
|
242
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
243
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
244
|
+
"description": PropTypes.string,
|
|
245
|
+
"toString": PropTypes.func.isRequired,
|
|
246
|
+
"valueOf": PropTypes.func.isRequired
|
|
247
|
+
}), PropTypes.string]),
|
|
248
|
+
"my": PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.oneOf([null]), PropTypes.number, PropTypes.shape({
|
|
249
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
250
|
+
"description": PropTypes.string,
|
|
251
|
+
"toString": PropTypes.func.isRequired,
|
|
252
|
+
"valueOf": PropTypes.func.isRequired
|
|
253
|
+
}), PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.shape({
|
|
254
|
+
"__@toStringTag": PropTypes.string.isRequired,
|
|
255
|
+
"description": PropTypes.string,
|
|
256
|
+
"toString": PropTypes.func.isRequired,
|
|
257
|
+
"valueOf": PropTypes.func.isRequired
|
|
258
|
+
}), PropTypes.string]),
|
|
259
|
+
"name": PropTypes.string.isRequired,
|
|
260
|
+
"onBlur": PropTypes.func,
|
|
261
|
+
"onChange": PropTypes.func,
|
|
262
|
+
"required": PropTypes.bool,
|
|
263
|
+
"tooltipPosition": PropTypes.oneOf(["bottom", "left", "right", "top"]),
|
|
264
|
+
"value": PropTypes.string,
|
|
265
|
+
"warning": PropTypes.oneOfType([PropTypes.string, PropTypes.bool])
|
|
154
266
|
};
|
|
267
|
+
export { RadioButtonGroup };
|
|
268
|
+
RadioButtonGroup.displayName = "RadioButtonGroup";
|
|
155
269
|
export default RadioButtonGroup;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { MarginProps } from "styled-system";
|
|
3
|
+
import { CommonCheckableInputProps } from "../../__internal__/checkable-input";
|
|
4
|
+
interface InternalRadioButtonProps {
|
|
5
|
+
inline?: boolean;
|
|
6
|
+
required?: boolean;
|
|
7
|
+
}
|
|
8
|
+
export interface RadioButtonProps extends CommonCheckableInputProps, MarginProps {
|
|
9
|
+
/** Identifier used for testing purposes, applied to the root element of the component. */
|
|
10
|
+
"data-component"?: string;
|
|
11
|
+
/** Identifier used for testing purposes, applied to the root element of the component. */
|
|
12
|
+
"data-element"?: string;
|
|
13
|
+
/** Identifier used for testing purposes, applied to the root element of the component. */
|
|
14
|
+
"data-role"?: string;
|
|
15
|
+
/** Text alignment of the label */
|
|
16
|
+
labelAlign?: "left" | "right";
|
|
17
|
+
/** Accepts a callback function which is triggered on click event */
|
|
18
|
+
onClick?: (ev: React.MouseEvent<HTMLInputElement>) => void;
|
|
19
|
+
/** the value of the Radio Button, passed on form submit */
|
|
20
|
+
value: string;
|
|
21
|
+
/** Overrides the default tooltip position */
|
|
22
|
+
tooltipPosition?: "top" | "bottom" | "left" | "right";
|
|
23
|
+
/** Aria label for rendered help component */
|
|
24
|
+
helpAriaLabel?: string;
|
|
25
|
+
}
|
|
26
|
+
export declare const RadioButton: React.ForwardRefExoticComponent<RadioButtonProps & InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>;
|
|
27
|
+
declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<RadioButtonProps & InternalRadioButtonProps & React.RefAttributes<HTMLInputElement>>>;
|
|
28
|
+
export default _default;
|