From a95d26aba03a4c54453ed828e7629604adf52b34 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adria=CC=81n=20Quinta=CC=81s?= Date: Fri, 27 Jul 2018 11:55:28 +0200 Subject: [PATCH 1/2] Add onAmpmChange prop --- src/Combobox.jsx | 2 ++ src/Panel.jsx | 6 ++++++ src/TimePicker.jsx | 7 +++++++ tests/Select.spec.jsx | 41 +++++++++++++++++++++++++++++++++++++++++ 4 files changed, 56 insertions(+) diff --git a/src/Combobox.jsx b/src/Combobox.jsx index ae53356e..168d88dd 100644 --- a/src/Combobox.jsx +++ b/src/Combobox.jsx @@ -26,6 +26,7 @@ class Combobox extends Component { prefixCls: PropTypes.string, value: PropTypes.object, onChange: PropTypes.func, + onAmPmChange: PropTypes.func, showHour: PropTypes.bool, showMinute: PropTypes.bool, showSecond: PropTypes.bool, @@ -69,6 +70,7 @@ class Combobox extends Component { } } } + this.props.onAmPmChange(ampm); } else { value.second(+itemValue); } diff --git a/src/Panel.jsx b/src/Panel.jsx index 648944d5..2c250ccc 100644 --- a/src/Panel.jsx +++ b/src/Panel.jsx @@ -33,6 +33,7 @@ class Panel extends Component { disabledSeconds: PropTypes.func, hideDisabledOptions: PropTypes.bool, onChange: PropTypes.func, + onAmPmChange: PropTypes.func, onEsc: PropTypes.func, allowEmpty: PropTypes.bool, showHour: PropTypes.bool, @@ -84,6 +85,10 @@ class Panel extends Component { this.props.onChange(newValue); } + onAmPmChange = (ampm) => { + this.props.onAmPmChange(ampm); + } + onCurrentSelectPanelChange = (currentSelectPanel) => { this.setState({ currentSelectPanel }); } @@ -165,6 +170,7 @@ class Panel extends Component { defaultOpenValue={defaultOpenValue} format={format} onChange={this.onChange} + onAmPmChange={this.onAmPmChange} showHour={showHour} showMinute={showMinute} showSecond={showSecond} diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx index 26166f48..27d0521b 100644 --- a/src/TimePicker.jsx +++ b/src/TimePicker.jsx @@ -41,6 +41,7 @@ export default class Picker extends Component { disabledSeconds: PropTypes.func, hideDisabledOptions: PropTypes.bool, onChange: PropTypes.func, + onAmPmChange: PropTypes.func, onOpen: PropTypes.func, onClose: PropTypes.func, onFocus: PropTypes.func, @@ -79,6 +80,7 @@ export default class Picker extends Component { hideDisabledOptions: false, placement: 'bottomLeft', onChange: noop, + onAmPmChange: noop, onOpen: noop, onClose: noop, onFocus: noop, @@ -116,6 +118,10 @@ export default class Picker extends Component { this.setValue(value); } + onAmPmChange = (ampm) => { + this.props.onAmPmChange(ampm); + } + onPanelClear = () => { this.setValue(null); this.setOpen(false); @@ -183,6 +189,7 @@ export default class Picker extends Component { value={this.state.value} inputReadOnly={inputReadOnly} onChange={this.onPanelChange} + onAmPmChange={this.onAmPmChange} onClear={this.onPanelClear} defaultOpenValue={defaultOpenValue} showHour={showHour} diff --git a/tests/Select.spec.jsx b/tests/Select.spec.jsx index f414c180..15a2e0c0 100644 --- a/tests/Select.spec.jsx +++ b/tests/Select.spec.jsx @@ -250,6 +250,47 @@ describe('Select', () => { }); }); + it('ampm correctly', (done) => { + let ampmChange; + const picker = renderPicker({ + onAmPmChange(v) { + ampmChange = v; + }, + defaultValue: moment().hour(0).minute(0).second(0), + format: undefined, + showSecond: false, + use12Hours: true, + }); + expect(picker.state.open).not.to.be.ok(); + const input = TestUtils.scryRenderedDOMComponentsWithClass(picker, + 'rc-time-picker-input')[0]; + let selector; + async.series([(next) => { + expect(picker.state.open).to.be(false); + + Simulate.click(input); + setTimeout(next, 100); + }, (next) => { + expect(picker.state.open).to.be(true); + + selector = TestUtils.scryRenderedDOMComponentsWithClass(picker.panelInstance, + 'rc-time-picker-panel-select')[2]; + expect((input).value).to.be('12:00 am'); + const option = selector.getElementsByTagName('li')[1]; + Simulate.click(option); + setTimeout(next, 100); + }, (next) => { + expect(ampmChange).to.be.ok(); + expect(ampmChange).to.be('PM'); + expect((input).value).to.be('12:00 pm'); + expect(picker.state.open).to.be.ok(); + + next(); + }], () => { + done(); + }); + }); + it('disabled correctly', (done) => { let change; const picker = renderPicker({ From 5fb795433236b497a0d651c38fbef4296134a5de Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adria=CC=81n=20Quinta=CC=81s?= Date: Fri, 27 Jul 2018 12:05:20 +0200 Subject: [PATCH 2/2] Update README --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index c0ce889f..533caa12 100644 --- a/README.md +++ b/README.md @@ -72,6 +72,7 @@ API | use12Hours | Boolean | false | 12 hours display mode | | hideDisabledOptions | Boolean | false | whether hide disabled options | | onChange | Function | null | called when select a different value | +| onAmPmChange | Function | null | called when select an am/pm value | | addon | Function | - | called from timepicker panel to render some addon to its bottom, like an OK button. Receives panel instance as parameter, to be able to close it like `panel.close()`.| | placement | String | bottomLeft | one of ['left','right','top','bottom', 'topLeft', 'topRight', 'bottomLeft', 'bottomRight'] | | transitionName | String | '' | |