1 | import _extends from "@babel/runtime/helpers/esm/extends";
|
2 | import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
3 | import * as React from 'react';
|
4 | import PropTypes from 'prop-types';
|
5 | import clsx from 'clsx';
|
6 | import { refType } from '@material-ui/utils';
|
7 | import SwitchBase from '../internal/SwitchBase';
|
8 | import RadioButtonIcon from './RadioButtonIcon';
|
9 | import { alpha } from '../styles/colorManipulator';
|
10 | import capitalize from '../utils/capitalize';
|
11 | import createChainedFunction from '../utils/createChainedFunction';
|
12 | import withStyles from '../styles/withStyles';
|
13 | import useRadioGroup from '../RadioGroup/useRadioGroup';
|
14 | export const styles = theme => ({
|
15 |
|
16 | root: {
|
17 | color: theme.palette.text.secondary
|
18 | },
|
19 |
|
20 |
|
21 | checked: {},
|
22 |
|
23 |
|
24 | disabled: {},
|
25 |
|
26 |
|
27 | colorPrimary: {
|
28 | '&$checked': {
|
29 | color: theme.palette.primary.main,
|
30 | '&:hover': {
|
31 | backgroundColor: alpha(theme.palette.primary.main, theme.palette.action.hoverOpacity),
|
32 |
|
33 | '@media (hover: none)': {
|
34 | backgroundColor: 'transparent'
|
35 | }
|
36 | }
|
37 | },
|
38 | '&$disabled': {
|
39 | color: theme.palette.action.disabled
|
40 | }
|
41 | },
|
42 |
|
43 |
|
44 | colorSecondary: {
|
45 | '&$checked': {
|
46 | color: theme.palette.secondary.main,
|
47 | '&:hover': {
|
48 | backgroundColor: alpha(theme.palette.secondary.main, theme.palette.action.hoverOpacity),
|
49 |
|
50 | '@media (hover: none)': {
|
51 | backgroundColor: 'transparent'
|
52 | }
|
53 | }
|
54 | },
|
55 | '&$disabled': {
|
56 | color: theme.palette.action.disabled
|
57 | }
|
58 | }
|
59 | });
|
60 | const defaultCheckedIcon = React.createElement(RadioButtonIcon, {
|
61 | checked: true
|
62 | });
|
63 | const defaultIcon = React.createElement(RadioButtonIcon, null);
|
64 | const Radio = React.forwardRef(function Radio(props, ref) {
|
65 | const {
|
66 | checked: checkedProp,
|
67 | classes,
|
68 | color = 'secondary',
|
69 | name: nameProp,
|
70 | onChange: onChangeProp,
|
71 | size = 'medium'
|
72 | } = props,
|
73 | other = _objectWithoutPropertiesLoose(props, ["checked", "classes", "color", "name", "onChange", "size"]);
|
74 |
|
75 | const radioGroup = useRadioGroup();
|
76 | let checked = checkedProp;
|
77 | const onChange = createChainedFunction(onChangeProp, radioGroup && radioGroup.onChange);
|
78 | let name = nameProp;
|
79 |
|
80 | if (radioGroup) {
|
81 | if (typeof checked === 'undefined') {
|
82 | checked = radioGroup.value === props.value;
|
83 | }
|
84 |
|
85 | if (typeof name === 'undefined') {
|
86 | name = radioGroup.name;
|
87 | }
|
88 | }
|
89 |
|
90 | return React.createElement(SwitchBase, _extends({
|
91 | color: color,
|
92 | type: "radio",
|
93 | icon: React.cloneElement(defaultIcon, {
|
94 | fontSize: size === 'small' ? 'small' : 'medium'
|
95 | }),
|
96 | checkedIcon: React.cloneElement(defaultCheckedIcon, {
|
97 | fontSize: size === 'small' ? 'small' : 'medium'
|
98 | }),
|
99 | classes: {
|
100 | root: clsx(classes.root, classes[`color${capitalize(color)}`]),
|
101 | checked: classes.checked,
|
102 | disabled: classes.disabled
|
103 | },
|
104 | name: name,
|
105 | checked: checked,
|
106 | onChange: onChange,
|
107 | ref: ref
|
108 | }, other));
|
109 | });
|
110 | process.env.NODE_ENV !== "production" ? Radio.propTypes = {
|
111 |
|
112 |
|
113 |
|
114 |
|
115 |
|
116 | |
117 |
|
118 |
|
119 | checked: PropTypes.bool,
|
120 |
|
121 | |
122 |
|
123 |
|
124 | checkedIcon: PropTypes.node,
|
125 |
|
126 | |
127 |
|
128 |
|
129 |
|
130 | classes: PropTypes.object,
|
131 |
|
132 | |
133 |
|
134 |
|
135 | color: PropTypes.oneOf(['default', 'primary', 'secondary']),
|
136 |
|
137 | |
138 |
|
139 |
|
140 | disabled: PropTypes.bool,
|
141 |
|
142 | |
143 |
|
144 |
|
145 | disableRipple: PropTypes.bool,
|
146 |
|
147 | |
148 |
|
149 |
|
150 | icon: PropTypes.node,
|
151 |
|
152 | |
153 |
|
154 |
|
155 | id: PropTypes.string,
|
156 |
|
157 | |
158 |
|
159 |
|
160 | inputProps: PropTypes.object,
|
161 |
|
162 | |
163 |
|
164 |
|
165 | inputRef: refType,
|
166 |
|
167 | |
168 |
|
169 |
|
170 | name: PropTypes.string,
|
171 |
|
172 | |
173 |
|
174 |
|
175 |
|
176 |
|
177 |
|
178 |
|
179 | onChange: PropTypes.func,
|
180 |
|
181 | |
182 |
|
183 |
|
184 | required: PropTypes.bool,
|
185 |
|
186 | |
187 |
|
188 |
|
189 |
|
190 | size: PropTypes.oneOf(['medium', 'small']),
|
191 |
|
192 | |
193 |
|
194 |
|
195 | value: PropTypes.any
|
196 | } : void 0;
|
197 | export default withStyles(styles, {
|
198 | name: 'MuiRadio'
|
199 | })(Radio); |
\ | No newline at end of file |