diff options
-rw-r--r-- | .gitignore | 3 | ||||
-rw-r--r-- | npm-debug.log.1427937311 | 0 | ||||
-rw-r--r-- | src/Header.jsx | 6 | ||||
-rw-r--r-- | src/Panel.jsx | 5 | ||||
-rw-r--r-- | src/Select.jsx | 8 | ||||
-rw-r--r-- | src/TimePicker.jsx | 12 | ||||
-rw-r--r-- | tests/TimePicker.spec.jsx | 36 |
7 files changed, 64 insertions, 6 deletions
@@ -25,4 +25,5 @@ dist | |||
25 | build | 25 | build |
26 | lib | 26 | lib |
27 | es | 27 | es |
28 | coverage \ No newline at end of file | 28 | coverage |
29 | npm-debug.log.* | ||
diff --git a/npm-debug.log.1427937311 b/npm-debug.log.1427937311 deleted file mode 100644 index e69de29..0000000 --- a/npm-debug.log.1427937311 +++ /dev/null | |||
diff --git a/src/Header.jsx b/src/Header.jsx index 91e8549..f6dd241 100644 --- a/src/Header.jsx +++ b/src/Header.jsx | |||
@@ -22,6 +22,7 @@ class Header extends Component { | |||
22 | allowEmpty: PropTypes.bool, | 22 | allowEmpty: PropTypes.bool, |
23 | defaultOpenValue: PropTypes.object, | 23 | defaultOpenValue: PropTypes.object, |
24 | currentSelectPanel: PropTypes.string, | 24 | currentSelectPanel: PropTypes.string, |
25 | onKeyDown: PropTypes.func, | ||
25 | }; | 26 | }; |
26 | 27 | ||
27 | constructor(props) { | 28 | constructor(props) { |
@@ -122,9 +123,12 @@ class Header extends Component { | |||
122 | } | 123 | } |
123 | 124 | ||
124 | onKeyDown = (e) => { | 125 | onKeyDown = (e) => { |
126 | const { onEsc, onKeyDown } = this.props; | ||
125 | if (e.keyCode === 27) { | 127 | if (e.keyCode === 27) { |
126 | this.props.onEsc(); | 128 | onEsc(); |
127 | } | 129 | } |
130 | |||
131 | onKeyDown(e); | ||
128 | } | 132 | } |
129 | 133 | ||
130 | onClear = () => { | 134 | onClear = () => { |
diff --git a/src/Panel.jsx b/src/Panel.jsx index 1953ad4..8a6c872 100644 --- a/src/Panel.jsx +++ b/src/Panel.jsx | |||
@@ -40,6 +40,7 @@ class Panel extends Component { | |||
40 | onClear: PropTypes.func, | 40 | onClear: PropTypes.func, |
41 | use12Hours: PropTypes.bool, | 41 | use12Hours: PropTypes.bool, |
42 | addon: PropTypes.func, | 42 | addon: PropTypes.func, |
43 | onKeyDown: PropTypes.func, | ||
43 | }; | 44 | }; |
44 | 45 | ||
45 | static defaultProps = { | 46 | static defaultProps = { |
@@ -52,6 +53,7 @@ class Panel extends Component { | |||
52 | defaultOpenValue: moment(), | 53 | defaultOpenValue: moment(), |
53 | use12Hours: false, | 54 | use12Hours: false, |
54 | addon: noop, | 55 | addon: noop, |
56 | onKeyDown: noop, | ||
55 | }; | 57 | }; |
56 | 58 | ||
57 | constructor(props) { | 59 | constructor(props) { |
@@ -89,7 +91,7 @@ class Panel extends Component { | |||
89 | const { | 91 | const { |
90 | prefixCls, className, placeholder, disabledHours, disabledMinutes, | 92 | prefixCls, className, placeholder, disabledHours, disabledMinutes, |
91 | disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showMinute, showSecond, | 93 | disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showMinute, showSecond, |
92 | format, defaultOpenValue, clearText, onEsc, addon, use12Hours, onClear, | 94 | format, defaultOpenValue, clearText, onEsc, addon, use12Hours, onClear, onKeyDown, |
93 | } = this.props; | 95 | } = this.props; |
94 | const { | 96 | const { |
95 | value, currentSelectPanel, | 97 | value, currentSelectPanel, |
@@ -122,6 +124,7 @@ class Panel extends Component { | |||
122 | onChange={this.onChange} | 124 | onChange={this.onChange} |
123 | onClear={onClear} | 125 | onClear={onClear} |
124 | allowEmpty={allowEmpty} | 126 | allowEmpty={allowEmpty} |
127 | onKeyDown={onKeyDown} | ||
125 | /> | 128 | /> |
126 | <Combobox | 129 | <Combobox |
127 | prefixCls={prefixCls} | 130 | prefixCls={prefixCls} |
diff --git a/src/Select.jsx b/src/Select.jsx index 49fed5b..a51ffd2 100644 --- a/src/Select.jsx +++ b/src/Select.jsx | |||
@@ -79,7 +79,7 @@ class Select extends Component { | |||
79 | scrollToSelected(duration) { | 79 | scrollToSelected(duration) { |
80 | // move to selected item | 80 | // move to selected item |
81 | const select = ReactDom.findDOMNode(this); | 81 | const select = ReactDom.findDOMNode(this); |
82 | const list = ReactDom.findDOMNode(this.refs.list); | 82 | const list = ReactDom.findDOMNode(this.list); |
83 | if (!list) { | 83 | if (!list) { |
84 | return; | 84 | return; |
85 | } | 85 | } |
@@ -101,6 +101,10 @@ class Select extends Component { | |||
101 | this.setState({ active: false }); | 101 | this.setState({ active: false }); |
102 | } | 102 | } |
103 | 103 | ||
104 | saveList = (node) => { | ||
105 | this.list = node; | ||
106 | } | ||
107 | |||
104 | render() { | 108 | render() { |
105 | if (this.props.options.length === 0) { | 109 | if (this.props.options.length === 0) { |
106 | return null; | 110 | return null; |
@@ -118,7 +122,7 @@ class Select extends Component { | |||
118 | onMouseEnter={this.handleMouseEnter} | 122 | onMouseEnter={this.handleMouseEnter} |
119 | onMouseLeave={this.handleMouseLeave} | 123 | onMouseLeave={this.handleMouseLeave} |
120 | > | 124 | > |
121 | <ul ref="list">{this.getOptions()}</ul> | 125 | <ul ref={this.saveList}>{this.getOptions()}</ul> |
122 | </div> | 126 | </div> |
123 | ); | 127 | ); |
124 | } | 128 | } |
diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx index 2c6a1f1..271515d 100644 --- a/src/TimePicker.jsx +++ b/src/TimePicker.jsx | |||
@@ -42,10 +42,13 @@ export default class Picker extends Component { | |||
42 | onChange: PropTypes.func, | 42 | onChange: PropTypes.func, |
43 | onOpen: PropTypes.func, | 43 | onOpen: PropTypes.func, |
44 | onClose: PropTypes.func, | 44 | onClose: PropTypes.func, |
45 | onFocus: PropTypes.func, | ||
46 | onBlur: PropTypes.func, | ||
45 | addon: PropTypes.func, | 47 | addon: PropTypes.func, |
46 | name: PropTypes.string, | 48 | name: PropTypes.string, |
47 | autoComplete: PropTypes.string, | 49 | autoComplete: PropTypes.string, |
48 | use12Hours: PropTypes.bool, | 50 | use12Hours: PropTypes.bool, |
51 | onKeyDown: PropTypes.func, | ||
49 | }; | 52 | }; |
50 | 53 | ||
51 | static defaultProps = { | 54 | static defaultProps = { |
@@ -69,8 +72,11 @@ export default class Picker extends Component { | |||
69 | onChange: noop, | 72 | onChange: noop, |
70 | onOpen: noop, | 73 | onOpen: noop, |
71 | onClose: noop, | 74 | onClose: noop, |
75 | onFocus: noop, | ||
76 | onBlur: noop, | ||
72 | addon: noop, | 77 | addon: noop, |
73 | use12Hours: false, | 78 | use12Hours: false, |
79 | onKeyDown: noop, | ||
74 | }; | 80 | }; |
75 | 81 | ||
76 | constructor(props) { | 82 | constructor(props) { |
@@ -157,7 +163,7 @@ export default class Picker extends Component { | |||
157 | prefixCls, placeholder, disabledHours, | 163 | prefixCls, placeholder, disabledHours, |
158 | disabledMinutes, disabledSeconds, hideDisabledOptions, | 164 | disabledMinutes, disabledSeconds, hideDisabledOptions, |
159 | allowEmpty, showHour, showMinute, showSecond, defaultOpenValue, clearText, | 165 | allowEmpty, showHour, showMinute, showSecond, defaultOpenValue, clearText, |
160 | addon, use12Hours, | 166 | addon, use12Hours, onKeyDown, |
161 | } = this.props; | 167 | } = this.props; |
162 | return ( | 168 | return ( |
163 | <Panel | 169 | <Panel |
@@ -181,6 +187,7 @@ export default class Picker extends Component { | |||
181 | hideDisabledOptions={hideDisabledOptions} | 187 | hideDisabledOptions={hideDisabledOptions} |
182 | use12Hours={use12Hours} | 188 | use12Hours={use12Hours} |
183 | addon={addon} | 189 | addon={addon} |
190 | onKeyDown={onKeyDown} | ||
184 | /> | 191 | /> |
185 | ); | 192 | ); |
186 | } | 193 | } |
@@ -231,6 +238,7 @@ export default class Picker extends Component { | |||
231 | const { | 238 | const { |
232 | prefixCls, placeholder, placement, align, | 239 | prefixCls, placeholder, placement, align, |
233 | disabled, transitionName, style, className, getPopupContainer, name, autoComplete, | 240 | disabled, transitionName, style, className, getPopupContainer, name, autoComplete, |
241 | onFocus, onBlur, | ||
234 | } = this.props; | 242 | } = this.props; |
235 | const { open, value } = this.state; | 243 | const { open, value } = this.state; |
236 | const popupClassName = this.getPopupClassName(); | 244 | const popupClassName = this.getPopupClassName(); |
@@ -260,6 +268,8 @@ export default class Picker extends Component { | |||
260 | onKeyDown={this.onKeyDown} | 268 | onKeyDown={this.onKeyDown} |
261 | disabled={disabled} value={value && value.format(this.getFormat()) || ''} | 269 | disabled={disabled} value={value && value.format(this.getFormat()) || ''} |
262 | autoComplete={autoComplete} | 270 | autoComplete={autoComplete} |
271 | onFocus={onFocus} | ||
272 | onBlur={onBlur} | ||
263 | /> | 273 | /> |
264 | <span className={`${prefixCls}-icon`}/> | 274 | <span className={`${prefixCls}-icon`}/> |
265 | </span> | 275 | </span> |
diff --git a/tests/TimePicker.spec.jsx b/tests/TimePicker.spec.jsx index 0dd6c10..d698e48 100644 --- a/tests/TimePicker.spec.jsx +++ b/tests/TimePicker.spec.jsx | |||
@@ -208,4 +208,40 @@ describe('TimePicker', () => { | |||
208 | }); | 208 | }); |
209 | }); | 209 | }); |
210 | }); | 210 | }); |
211 | |||
212 | describe('other operations', () => { | ||
213 | it('focus/blur correctly', (done) => { | ||
214 | let focus = false; | ||
215 | let blur = false; | ||
216 | |||
217 | const picker = renderPicker({ | ||
218 | onFocus: () => { | ||
219 | focus = true; | ||
220 | }, | ||
221 | onBlur: () => { | ||
222 | blur = true; | ||
223 | }, | ||
224 | }); | ||
225 | expect(picker.state.open).not.to.be.ok(); | ||
226 | const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, | ||
227 | 'rc-time-picker-input')[0]; | ||
228 | |||
229 | async.series([(next) => { | ||
230 | Simulate.focus(input); | ||
231 | setTimeout(next, 100); | ||
232 | }, (next) => { | ||
233 | expect(picker.state.open).to.be(false); | ||
234 | |||
235 | Simulate.blur(input); | ||
236 | setTimeout(next, 100); | ||
237 | }, (next) => { | ||
238 | expect(focus).to.be(true); | ||
239 | expect(blur).to.be(true); | ||
240 | |||
241 | next(); | ||
242 | }], () => { | ||
243 | done(); | ||
244 | }); | ||
245 | }); | ||
246 | }); | ||
211 | }); | 247 | }); |