1 | 'use strict';
|
2 |
|
3 | exports.__esModule = true;
|
4 |
|
5 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
|
6 |
|
7 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
|
8 |
|
9 | var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
|
10 |
|
11 | var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
|
12 |
|
13 | var _inherits2 = require('babel-runtime/helpers/inherits');
|
14 |
|
15 | var _inherits3 = _interopRequireDefault(_inherits2);
|
16 |
|
17 | var _react = require('react');
|
18 |
|
19 | var _react2 = _interopRequireDefault(_react);
|
20 |
|
21 | var _reactDom = require('react-dom');
|
22 |
|
23 | var _reactDom2 = _interopRequireDefault(_reactDom);
|
24 |
|
25 | var _propTypes = require('prop-types');
|
26 |
|
27 | var _propTypes2 = _interopRequireDefault(_propTypes);
|
28 |
|
29 | var _reactLifecyclesCompat = require('react-lifecycles-compat');
|
30 |
|
31 | var _createChainedFunction = require('rc-util/lib/createChainedFunction');
|
32 |
|
33 | var _createChainedFunction2 = _interopRequireDefault(_createChainedFunction);
|
34 |
|
35 | var _KeyCode = require('rc-util/lib/KeyCode');
|
36 |
|
37 | var _KeyCode2 = _interopRequireDefault(_KeyCode);
|
38 |
|
39 | var _placements = require('./picker/placements');
|
40 |
|
41 | var _placements2 = _interopRequireDefault(_placements);
|
42 |
|
43 | var _rcTrigger = require('rc-trigger');
|
44 |
|
45 | var _rcTrigger2 = _interopRequireDefault(_rcTrigger);
|
46 |
|
47 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
|
48 |
|
49 | function noop() {}
|
50 |
|
51 | function refFn(field, component) {
|
52 | this[field] = component;
|
53 | }
|
54 |
|
55 | var Picker = function (_React$Component) {
|
56 | (0, _inherits3['default'])(Picker, _React$Component);
|
57 |
|
58 | function Picker(props) {
|
59 | (0, _classCallCheck3['default'])(this, Picker);
|
60 |
|
61 | var _this = (0, _possibleConstructorReturn3['default'])(this, _React$Component.call(this, props));
|
62 |
|
63 | _initialiseProps.call(_this);
|
64 |
|
65 | var open = void 0;
|
66 | if ('open' in props) {
|
67 | open = props.open;
|
68 | } else {
|
69 | open = props.defaultOpen;
|
70 | }
|
71 | var value = props.value || props.defaultValue;
|
72 | _this.saveCalendarRef = refFn.bind(_this, 'calendarInstance');
|
73 |
|
74 | _this.state = {
|
75 | open: open,
|
76 | value: value
|
77 | };
|
78 | return _this;
|
79 | }
|
80 |
|
81 | Picker.prototype.componentDidUpdate = function componentDidUpdate(_, prevState) {
|
82 | if (!prevState.open && this.state.open) {
|
83 |
|
84 | this.focusTimeout = setTimeout(this.focusCalendar, 0, this);
|
85 | }
|
86 | };
|
87 |
|
88 | Picker.prototype.componentWillUnmount = function componentWillUnmount() {
|
89 | clearTimeout(this.focusTimeout);
|
90 | };
|
91 |
|
92 | Picker.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps) {
|
93 | var newState = {};
|
94 | var value = nextProps.value,
|
95 | open = nextProps.open;
|
96 |
|
97 | if ('value' in nextProps) {
|
98 | newState.value = value;
|
99 | }
|
100 | if (open !== undefined) {
|
101 | newState.open = open;
|
102 | }
|
103 | return newState;
|
104 | };
|
105 |
|
106 | Picker.prototype.render = function render() {
|
107 | var props = this.props;
|
108 | var prefixCls = props.prefixCls,
|
109 | placement = props.placement,
|
110 | style = props.style,
|
111 | getCalendarContainer = props.getCalendarContainer,
|
112 | align = props.align,
|
113 | animation = props.animation,
|
114 | disabled = props.disabled,
|
115 | dropdownClassName = props.dropdownClassName,
|
116 | transitionName = props.transitionName,
|
117 | children = props.children;
|
118 |
|
119 | var state = this.state;
|
120 | return _react2['default'].createElement(
|
121 | _rcTrigger2['default'],
|
122 | {
|
123 | popup: this.getCalendarElement(),
|
124 | popupAlign: align,
|
125 | builtinPlacements: _placements2['default'],
|
126 | popupPlacement: placement,
|
127 | action: disabled && !state.open ? [] : ['click'],
|
128 | destroyPopupOnHide: true,
|
129 | getPopupContainer: getCalendarContainer,
|
130 | popupStyle: style,
|
131 | popupAnimation: animation,
|
132 | popupTransitionName: transitionName,
|
133 | popupVisible: state.open,
|
134 | onPopupVisibleChange: this.onVisibleChange,
|
135 | prefixCls: prefixCls,
|
136 | popupClassName: dropdownClassName
|
137 | },
|
138 | _react2['default'].cloneElement(children(state, props), { onKeyDown: this.onKeyDown })
|
139 | );
|
140 | };
|
141 |
|
142 | return Picker;
|
143 | }(_react2['default'].Component);
|
144 |
|
145 | Picker.propTypes = {
|
146 | animation: _propTypes2['default'].oneOfType([_propTypes2['default'].func, _propTypes2['default'].string]),
|
147 | disabled: _propTypes2['default'].bool,
|
148 | transitionName: _propTypes2['default'].string,
|
149 | onChange: _propTypes2['default'].func,
|
150 | onOpenChange: _propTypes2['default'].func,
|
151 | children: _propTypes2['default'].func,
|
152 | getCalendarContainer: _propTypes2['default'].func,
|
153 | calendar: _propTypes2['default'].element,
|
154 | style: _propTypes2['default'].object,
|
155 | open: _propTypes2['default'].bool,
|
156 | defaultOpen: _propTypes2['default'].bool,
|
157 | prefixCls: _propTypes2['default'].string,
|
158 | placement: _propTypes2['default'].any,
|
159 | value: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].array]),
|
160 | defaultValue: _propTypes2['default'].oneOfType([_propTypes2['default'].object, _propTypes2['default'].array]),
|
161 | align: _propTypes2['default'].object,
|
162 | dateRender: _propTypes2['default'].func,
|
163 | onBlur: _propTypes2['default'].func
|
164 | };
|
165 | Picker.defaultProps = {
|
166 | prefixCls: 'rc-calendar-picker',
|
167 | style: {},
|
168 | align: {},
|
169 | placement: 'bottomLeft',
|
170 | defaultOpen: false,
|
171 | onChange: noop,
|
172 | onOpenChange: noop,
|
173 | onBlur: noop
|
174 | };
|
175 |
|
176 | var _initialiseProps = function _initialiseProps() {
|
177 | var _this2 = this;
|
178 |
|
179 | this.onCalendarKeyDown = function (event) {
|
180 | if (event.keyCode === _KeyCode2['default'].ESC) {
|
181 | event.stopPropagation();
|
182 | _this2.close(_this2.focus);
|
183 | }
|
184 | };
|
185 |
|
186 | this.onCalendarSelect = function (value) {
|
187 | var cause = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
188 |
|
189 | var props = _this2.props;
|
190 | if (!('value' in props)) {
|
191 | _this2.setState({
|
192 | value: value
|
193 | });
|
194 | }
|
195 | if (cause.source === 'keyboard' || cause.source === 'dateInputSelect' || !props.calendar.props.timePicker && cause.source !== 'dateInput' || cause.source === 'todayButton') {
|
196 | _this2.close(_this2.focus);
|
197 | }
|
198 | props.onChange(value);
|
199 | };
|
200 |
|
201 | this.onKeyDown = function (event) {
|
202 | if (!_this2.state.open && (event.keyCode === _KeyCode2['default'].DOWN || event.keyCode === _KeyCode2['default'].ENTER)) {
|
203 | _this2.open();
|
204 | event.preventDefault();
|
205 | }
|
206 | };
|
207 |
|
208 | this.onCalendarOk = function () {
|
209 | _this2.close(_this2.focus);
|
210 | };
|
211 |
|
212 | this.onCalendarClear = function () {
|
213 | _this2.close(_this2.focus);
|
214 | };
|
215 |
|
216 | this.onCalendarBlur = function () {
|
217 | _this2.setOpen(false);
|
218 | };
|
219 |
|
220 | this.onVisibleChange = function (open) {
|
221 | _this2.setOpen(open);
|
222 | };
|
223 |
|
224 | this.getCalendarElement = function () {
|
225 | var props = _this2.props;
|
226 | var state = _this2.state;
|
227 | var calendarProps = props.calendar.props;
|
228 | var value = state.value;
|
229 |
|
230 | var defaultValue = value;
|
231 | var extraProps = {
|
232 | ref: _this2.saveCalendarRef,
|
233 | defaultValue: defaultValue || calendarProps.defaultValue,
|
234 | selectedValue: value,
|
235 | onKeyDown: _this2.onCalendarKeyDown,
|
236 | onOk: (0, _createChainedFunction2['default'])(calendarProps.onOk, _this2.onCalendarOk),
|
237 | onSelect: (0, _createChainedFunction2['default'])(calendarProps.onSelect, _this2.onCalendarSelect),
|
238 | onClear: (0, _createChainedFunction2['default'])(calendarProps.onClear, _this2.onCalendarClear),
|
239 | onBlur: (0, _createChainedFunction2['default'])(calendarProps.onBlur, _this2.onCalendarBlur)
|
240 | };
|
241 |
|
242 | return _react2['default'].cloneElement(props.calendar, extraProps);
|
243 | };
|
244 |
|
245 | this.setOpen = function (open, callback) {
|
246 | var onOpenChange = _this2.props.onOpenChange;
|
247 |
|
248 | if (_this2.state.open !== open) {
|
249 | if (!('open' in _this2.props)) {
|
250 | _this2.setState({
|
251 | open: open
|
252 | }, callback);
|
253 | }
|
254 | onOpenChange(open);
|
255 | }
|
256 | };
|
257 |
|
258 | this.open = function (callback) {
|
259 | _this2.setOpen(true, callback);
|
260 | };
|
261 |
|
262 | this.close = function (callback) {
|
263 | _this2.setOpen(false, callback);
|
264 | };
|
265 |
|
266 | this.focus = function () {
|
267 | if (!_this2.state.open) {
|
268 | _reactDom2['default'].findDOMNode(_this2).focus();
|
269 | }
|
270 | };
|
271 |
|
272 | this.focusCalendar = function () {
|
273 | if (_this2.state.open && !!_this2.calendarInstance) {
|
274 | _this2.calendarInstance.focus();
|
275 | }
|
276 | };
|
277 | };
|
278 |
|
279 | (0, _reactLifecyclesCompat.polyfill)(Picker);
|
280 |
|
281 | exports['default'] = Picker;
|
282 | module.exports = exports['default']; |
\ | No newline at end of file |