From d18ecfb67877d8bdfc54e47a214d3afab52b7bda Mon Sep 17 00:00:00 2001 From: Levi Lansing Date: Wed, 27 Sep 2017 23:20:55 -0400 Subject: add focusOnOpen option (#61) --- src/Header.jsx | 9 +++++++++ src/Panel.jsx | 4 +++- src/TimePicker.jsx | 5 ++++- 3 files changed, 16 insertions(+), 2 deletions(-) (limited to 'src') diff --git a/src/Header.jsx b/src/Header.jsx index 91e8549..9e80a9c 100644 --- a/src/Header.jsx +++ b/src/Header.jsx @@ -22,6 +22,7 @@ class Header extends Component { allowEmpty: PropTypes.bool, defaultOpenValue: PropTypes.object, currentSelectPanel: PropTypes.string, + focusOnOpen: PropTypes.bool, }; constructor(props) { @@ -33,6 +34,14 @@ class Header extends Component { }; } + componentDidMount() { + if (this.props.focusOnOpen) { + // Wait one frame for the panel to be positioned before focusing + const requestAnimationFrame = (window.requestAnimationFrame || window.setTimeout); + requestAnimationFrame(() => this.refs.input.focus()); + } + } + componentWillReceiveProps(nextProps) { const { value, format } = nextProps; this.setState({ diff --git a/src/Panel.jsx b/src/Panel.jsx index 1953ad4..deeba52 100644 --- a/src/Panel.jsx +++ b/src/Panel.jsx @@ -40,6 +40,7 @@ class Panel extends Component { onClear: PropTypes.func, use12Hours: PropTypes.bool, addon: PropTypes.func, + focusOnOpen: PropTypes.bool, }; static defaultProps = { @@ -89,7 +90,7 @@ class Panel extends Component { const { prefixCls, className, placeholder, disabledHours, disabledMinutes, disabledSeconds, hideDisabledOptions, allowEmpty, showHour, showMinute, showSecond, - format, defaultOpenValue, clearText, onEsc, addon, use12Hours, onClear, + format, defaultOpenValue, clearText, onEsc, addon, use12Hours, onClear, focusOnOpen, } = this.props; const { value, currentSelectPanel, @@ -122,6 +123,7 @@ class Panel extends Component { onChange={this.onChange} onClear={onClear} allowEmpty={allowEmpty} + focusOnOpen={focusOnOpen} /> ); } -- cgit v1.2.3 From 1c72daf036bee06cde97639ac80b741c3ed38fa8 Mon Sep 17 00:00:00 2001 From: Levi Lansing Date: Thu, 28 Sep 2017 10:15:29 -0400 Subject: select text when focusing time input --- src/Header.jsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'src') diff --git a/src/Header.jsx b/src/Header.jsx index 9e80a9c..6bed557 100644 --- a/src/Header.jsx +++ b/src/Header.jsx @@ -38,7 +38,10 @@ class Header extends Component { if (this.props.focusOnOpen) { // Wait one frame for the panel to be positioned before focusing const requestAnimationFrame = (window.requestAnimationFrame || window.setTimeout); - requestAnimationFrame(() => this.refs.input.focus()); + requestAnimationFrame(() => { + this.refs.input.focus(); + this.refs.input.select(); + }); } } -- cgit v1.2.3