1 | import _extends from 'babel-runtime/helpers/extends';
|
2 | import _typeof from 'babel-runtime/helpers/typeof';
|
3 | import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
|
4 | import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
|
5 | import _inherits from 'babel-runtime/helpers/inherits';
|
6 |
|
7 | var _class, _temp;
|
8 |
|
9 | import React, { Component } from 'react';
|
10 | import PropTypes from 'prop-types';
|
11 | import classnames from 'classnames';
|
12 | import { polyfill } from 'react-lifecycles-compat';
|
13 | import ConfigProvider from '../config-provider';
|
14 | import { obj } from '../util';
|
15 | import Radio from './radio';
|
16 |
|
17 | var pickOthers = obj.pickOthers;
|
18 |
|
19 |
|
20 |
|
21 |
|
22 |
|
23 |
|
24 | var RadioGroup = (_temp = _class = function (_Component) {
|
25 | _inherits(RadioGroup, _Component);
|
26 |
|
27 | function RadioGroup(props) {
|
28 | _classCallCheck(this, RadioGroup);
|
29 |
|
30 | var _this = _possibleConstructorReturn(this, _Component.call(this, props));
|
31 |
|
32 | var value = '';
|
33 | if ('value' in props) {
|
34 | value = props.value;
|
35 | } else if ('defaultValue' in props) {
|
36 | value = props.defaultValue;
|
37 | }
|
38 |
|
39 | _this.state = { value: value };
|
40 | _this.onChange = _this.onChange.bind(_this);
|
41 | return _this;
|
42 | }
|
43 |
|
44 | RadioGroup.getDerivedStateFromProps = function getDerivedStateFromProps(props, state) {
|
45 | if ('value' in props && props.value !== state.value) {
|
46 | return {
|
47 | value: props.value
|
48 | };
|
49 | }
|
50 |
|
51 | return null;
|
52 | };
|
53 |
|
54 | RadioGroup.prototype.getChildContext = function getChildContext() {
|
55 | var disabled = this.props.disabled;
|
56 |
|
57 |
|
58 | return {
|
59 | __group__: true,
|
60 | isButton: this.props.shape === 'button',
|
61 | onChange: this.onChange,
|
62 | selectedValue: this.state.value,
|
63 | disabled: disabled
|
64 | };
|
65 | };
|
66 |
|
67 | RadioGroup.prototype.onChange = function onChange(currentValue, e) {
|
68 | if (!('value' in this.props)) {
|
69 | this.setState({ value: currentValue });
|
70 | }
|
71 | if (currentValue !== this.state.value) {
|
72 | this.props.onChange(currentValue, e);
|
73 | }
|
74 | };
|
75 |
|
76 | RadioGroup.prototype.render = function render() {
|
77 | var _this2 = this,
|
78 | _classnames;
|
79 |
|
80 | var _props = this.props,
|
81 | rtl = _props.rtl,
|
82 | className = _props.className,
|
83 | disabled = _props.disabled,
|
84 | shape = _props.shape,
|
85 | size = _props.size,
|
86 | style = _props.style,
|
87 | prefix = _props.prefix,
|
88 | direction = _props.direction,
|
89 | component = _props.component,
|
90 | isPreview = _props.isPreview,
|
91 | renderPreview = _props.renderPreview;
|
92 |
|
93 | var others = pickOthers(Object.keys(RadioGroup.propTypes), this.props);
|
94 |
|
95 | if (rtl) {
|
96 | others.dir = 'rtl';
|
97 | }
|
98 |
|
99 | var children = void 0;
|
100 | var previewed = {};
|
101 | if (this.props.children) {
|
102 | children = React.Children.map(this.props.children, function (child, index) {
|
103 | if (!React.isValidElement(child)) {
|
104 | return child;
|
105 | }
|
106 | var checked = _this2.state.value === child.props.value;
|
107 | if (checked) {
|
108 | previewed.label = child.props.children;
|
109 | previewed.value = child.props.value;
|
110 | }
|
111 | var tabIndex = index === 0 && !_this2.state.value || checked ? 0 : -1;
|
112 | var childrtl = child.props.rtl === undefined ? rtl : child.props.rtl;
|
113 | if (child.type && child.type.displayName === 'Config(Radio)') {
|
114 | return React.cloneElement(child, {
|
115 | checked: checked,
|
116 | tabIndex: tabIndex,
|
117 | rtl: childrtl
|
118 | });
|
119 | }
|
120 | return React.cloneElement(child, {
|
121 | checked: checked,
|
122 | rtl: childrtl
|
123 | });
|
124 | });
|
125 | } else {
|
126 | children = this.props.dataSource.map(function (item, index) {
|
127 | var option = item;
|
128 | if ((typeof item === 'undefined' ? 'undefined' : _typeof(item)) !== 'object') {
|
129 | option = {
|
130 | label: item,
|
131 | value: item,
|
132 | disabled: disabled
|
133 | };
|
134 | }
|
135 | var checked = _this2.state.value === option.value;
|
136 | if (checked) {
|
137 | previewed.label = option.label;
|
138 | previewed.value = option.value;
|
139 | }
|
140 | return React.createElement(Radio, {
|
141 | key: index,
|
142 | tabIndex: index === 0 && !_this2.state.value || checked ? 0 : -1,
|
143 | value: option.value,
|
144 | checked: checked,
|
145 | label: option.label,
|
146 | disabled: disabled || option.disabled
|
147 | });
|
148 | });
|
149 | }
|
150 | if (isPreview) {
|
151 | var previewCls = classnames(className, prefix + 'form-preview');
|
152 |
|
153 | if ('renderPreview' in this.props) {
|
154 | return React.createElement(
|
155 | 'div',
|
156 | _extends({}, others, { className: previewCls }),
|
157 | renderPreview(previewed, this.props)
|
158 | );
|
159 | }
|
160 |
|
161 | return React.createElement(
|
162 | 'p',
|
163 | _extends({}, others, { className: previewCls }),
|
164 | previewed.label
|
165 | );
|
166 | }
|
167 |
|
168 | var isButtonShape = shape === 'button';
|
169 |
|
170 | var cls = classnames((_classnames = {}, _classnames[prefix + 'radio-group'] = true, _classnames[prefix + 'radio-group-' + direction] = !isButtonShape, _classnames[prefix + 'radio-button'] = isButtonShape, _classnames[prefix + 'radio-button-' + size] = isButtonShape, _classnames[className] = !!className, _classnames.disabled = disabled, _classnames));
|
171 |
|
172 | var TagName = component;
|
173 | return React.createElement(
|
174 | TagName,
|
175 | _extends({}, others, { 'aria-disabled': disabled, role: 'radiogroup', className: cls, style: style }),
|
176 | children
|
177 | );
|
178 | };
|
179 |
|
180 | return RadioGroup;
|
181 | }(Component), _class.propTypes = _extends({}, ConfigProvider.propTypes, {
|
182 | |
183 |
|
184 |
|
185 | prefix: PropTypes.string,
|
186 | |
187 |
|
188 |
|
189 | className: PropTypes.string,
|
190 | |
191 |
|
192 |
|
193 | style: PropTypes.object,
|
194 | |
195 |
|
196 |
|
197 | name: PropTypes.string,
|
198 | |
199 |
|
200 |
|
201 | value: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool]),
|
202 | |
203 |
|
204 |
|
205 | defaultValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool]),
|
206 | |
207 |
|
208 |
|
209 | component: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
|
210 | |
211 |
|
212 |
|
213 |
|
214 |
|
215 | onChange: PropTypes.func,
|
216 | |
217 |
|
218 |
|
219 | disabled: PropTypes.bool,
|
220 | |
221 |
|
222 |
|
223 |
|
224 | shape: PropTypes.oneOf(['normal', 'button']),
|
225 | |
226 |
|
227 |
|
228 |
|
229 | size: PropTypes.oneOf(['large', 'medium', 'small']),
|
230 | |
231 |
|
232 |
|
233 | dataSource: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.arrayOf(PropTypes.object)]),
|
234 | |
235 |
|
236 |
|
237 | children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.element), PropTypes.element]),
|
238 |
|
239 | |
240 |
|
241 |
|
242 |
|
243 |
|
244 | direction: PropTypes.oneOf(['hoz', 'ver']),
|
245 | |
246 |
|
247 |
|
248 | isPreview: PropTypes.bool,
|
249 | |
250 |
|
251 |
|
252 |
|
253 |
|
254 |
|
255 | renderPreview: PropTypes.func
|
256 | }), _class.defaultProps = {
|
257 | dataSource: [],
|
258 | size: 'medium',
|
259 | onChange: function onChange() {},
|
260 | prefix: 'next-',
|
261 | component: 'div',
|
262 | direction: 'hoz',
|
263 | isPreview: false
|
264 | }, _class.childContextTypes = {
|
265 | onChange: PropTypes.func,
|
266 | __group__: PropTypes.bool,
|
267 | isButton: PropTypes.bool,
|
268 | selectedValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.bool]),
|
269 | disabled: PropTypes.bool
|
270 | }, _temp);
|
271 | RadioGroup.displayName = 'RadioGroup';
|
272 |
|
273 |
|
274 | export default polyfill(RadioGroup); |
\ | No newline at end of file |