deps: upgrade to react@16

[github/fretlink/time-picker.git] / src / TimePicker.jsx

diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx
index 1a3516e974ebdff4d2c3c191531783d3fd81cbed..c7ff80a932386bcd421cea50a6d5ef6119afd457 100644 (file)
--- a/src/TimePicker.jsx
+++ b/src/TimePicker.jsx
@@ -12,7 +12,7 @@ function refFn(field, component) {
   this[field] = component;
 }
 
-class Picker extends Component {
+export default class Picker extends Component {
   static propTypes = {
     prefixCls: PropTypes.string,
     clearText: PropTypes.string,
@@ -34,6 +34,7 @@ class Picker extends Component {
     showSecond: PropTypes.bool,
     style: PropTypes.object,
     className: PropTypes.string,
+    popupClassName: PropTypes.string,
     disabledHours: PropTypes.func,
     disabledMinutes: PropTypes.func,
     disabledSeconds: PropTypes.func,
@@ -41,10 +42,17 @@ class Picker extends Component {
     onChange: PropTypes.func,
     onOpen: PropTypes.func,
     onClose: PropTypes.func,
+    onFocus: PropTypes.func,
+    onBlur: PropTypes.func,
     addon: PropTypes.func,
     name: PropTypes.string,
     autoComplete: PropTypes.string,
     use12Hours: PropTypes.bool,
+    hourStep: PropTypes.number,
+    minuteStep: PropTypes.number,
+    secondStep: PropTypes.number,
+    focusOnOpen: PropTypes.bool,
+    onKeyDown: PropTypes.func,
   };
 
   static defaultProps = {
@@ -53,6 +61,7 @@ class Picker extends Component {
     defaultOpen: false,
     style: {},
     className: '',
+    popupClassName: '',
     align: {},
     defaultOpenValue: moment(),
     allowEmpty: true,
@@ -67,8 +76,12 @@ class Picker extends Component {
     onChange: noop,
     onOpen: noop,
     onClose: noop,
+    onFocus: noop,
+    onBlur: noop,
     addon: noop,
     use12Hours: false,
+    focusOnOpen: false,
+    onKeyDown: noop,
   };
 
   constructor(props) {
@@ -155,7 +168,7 @@ class Picker extends Component {
       prefixCls, placeholder, disabledHours,
       disabledMinutes, disabledSeconds, hideDisabledOptions,
       allowEmpty, showHour, showMinute, showSecond, defaultOpenValue, clearText,
-      addon, use12Hours,
+      addon, use12Hours, focusOnOpen, onKeyDown, hourStep, minuteStep, secondStep,
     } = this.props;
     return (
       <Panel
@@ -178,11 +191,40 @@ class Picker extends Component {
         disabledSeconds={disabledSeconds}
         hideDisabledOptions={hideDisabledOptions}
         use12Hours={use12Hours}
+        hourStep={hourStep}
+        minuteStep={minuteStep}
+        secondStep={secondStep}
         addon={addon}
+        focusOnOpen={focusOnOpen}
+        onKeyDown={onKeyDown}
       />
     );
   }
 
+  getPopupClassName() {
+    const { showHour, showMinute, showSecond, use12Hours, prefixCls } = this.props;
+    let popupClassName = this.props.popupClassName;
+    // Keep it for old compatibility
+    if ((!showHour || !showMinute || !showSecond) && !use12Hours) {
+      popupClassName += ` ${prefixCls}-panel-narrow`;
+    }
+    let selectColumnCount = 0;
+    if (showHour) {
+      selectColumnCount += 1;
+    }
+    if (showMinute) {
+      selectColumnCount += 1;
+    }
+    if (showSecond) {
+      selectColumnCount += 1;
+    }
+    if (use12Hours) {
+      selectColumnCount += 1;
+    }
+    popupClassName += ` ${prefixCls}-panel-column-${selectColumnCount}`;
+    return popupClassName;
+  }
+
   setOpen(open) {
     const { onOpen, onClose } = this.props;
     if (this.state.open !== open) {
@@ -204,15 +246,11 @@ class Picker extends Component {
   render() {
     const {
       prefixCls, placeholder, placement, align,
-      disabled, transitionName, style, className, showHour,
-      showMinute, showSecond, getPopupContainer, name, autoComplete,
-      use12Hours,
+      disabled, transitionName, style, className, getPopupContainer, name, autoComplete,
+      onFocus, onBlur,
     } = this.props;
     const { open, value } = this.state;
-    let popupClassName;
-    if ((!showHour || !showMinute || !showSecond) && !use12Hours) {
-      popupClassName = `${prefixCls}-panel-narrow`;
-    }
+    const popupClassName = this.getPopupClassName();
     return (
       <Trigger
         prefixCls={`${prefixCls}-panel`}
@@ -239,6 +277,8 @@ class Picker extends Component {
             onKeyDown={this.onKeyDown}
             disabled={disabled} value={value && value.format(this.getFormat()) || ''}
             autoComplete={autoComplete}
+            onFocus={onFocus}
+            onBlur={onBlur}
           />
           <span className={`${prefixCls}-icon`}/>
         </span>
@@ -246,5 +286,3 @@ class Picker extends Component {
     );
   }
 }
-
-export default Picker;