rc-calendar - npm Package Compare versions

Comparing version 9.7.11 to 9.8.0

es/date/DateInput.js

@@ -6,2 +6,3 @@ import React from 'react';
 import moment from 'moment';
+import { formatDate } from '../util';
 
@@ -16,3 +17,3 @@ var DateInput = createReactClass({
     disabledTime: PropTypes.any,
-    format: PropTypes.string,
+    format: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
     locale: PropTypes.object,
@@ -31,4 +32,5 @@ disabledDate: PropTypes.func,
     return {
-      str: selectedValue && selectedValue.format(this.props.format) || '',
-      invalid: false
+      str: formatDate(selectedValue, this.props.format),
+      invalid: false,
+      hasFocus: false
     };
@@ -41,6 +43,8 @@ },
     var selectedValue = nextProps.selectedValue;
-    this.setState({
-      str: selectedValue && selectedValue.format(nextProps.format) || '',
-      invalid: false
-    });
+    if (!this.state.hasFocus) {
+      this.setState({
+        str: formatDate(selectedValue, nextProps.format),
+        invalid: false
+      });
+    }
   },
@@ -113,2 +117,13 @@ componentDidUpdate: function componentDidUpdate() {
   },
+  onFocus: function onFocus() {
+    this.setState({ hasFocus: true });
+  },
+  onBlur: function onBlur() {
+    this.setState(function (prevState, prevProps) {
+      return {
+        hasFocus: false,
+        str: formatDate(prevProps.value, prevProps.format)
+      };
+    });
+  },
   render: function render() {
@@ -137,3 +152,5 @@ var props = this.props;
           placeholder: placeholder,
-          onChange: this.onInputChange
+          onChange: this.onInputChange,
+          onFocus: this.onFocus,
+          onBlur: this.onBlur
         })
@@ -140,0 +157,0 @@ ),

es/util/index.js

@@ -89,2 +89,14 @@ import _extends from 'babel-runtime/helpers/extends';
   return true;
+}
+
+export function formatDate(value, format) {
+  if (!value) {
+    return '';
+  }
+
+  if (Array.isArray(format)) {
+    format = format[0];
+  }
+
+  return value.format(format);
 }

HISTORY.md

 # History
 ----
 
+## 9.8.0 / 2018-11-30
+
+- DateInput support multiple date format
+
 ## 9.7.0 / 2018-08-07
@@ -5,0 +9,0 @@

lib/date/DateInput.js

@@ -25,2 +25,4 @@ 'use strict';
 
+var _util = require('../util');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
@@ -36,3 +38,3 @@
     disabledTime: _propTypes2['default'].any,
-    format: _propTypes2['default'].string,
+    format: _propTypes2['default'].oneOfType([_propTypes2['default'].string, _propTypes2['default'].arrayOf(_propTypes2['default'].string)]),
     locale: _propTypes2['default'].object,
@@ -51,4 +53,5 @@ disabledDate: _propTypes2['default'].func,
     return {
-      str: selectedValue && selectedValue.format(this.props.format) || '',
-      invalid: false
+      str: (0, _util.formatDate)(selectedValue, this.props.format),
+      invalid: false,
+      hasFocus: false
     };
@@ -61,6 +64,8 @@ },
     var selectedValue = nextProps.selectedValue;
-    this.setState({
-      str: selectedValue && selectedValue.format(nextProps.format) || '',
-      invalid: false
-    });
+    if (!this.state.hasFocus) {
+      this.setState({
+        str: (0, _util.formatDate)(selectedValue, nextProps.format),
+        invalid: false
+      });
+    }
   },
@@ -133,2 +138,13 @@ componentDidUpdate: function componentDidUpdate() {
   },
+  onFocus: function onFocus() {
+    this.setState({ hasFocus: true });
+  },
+  onBlur: function onBlur() {
+    this.setState(function (prevState, prevProps) {
+      return {
+        hasFocus: false,
+        str: (0, _util.formatDate)(prevProps.value, prevProps.format)
+      };
+    });
+  },
   render: function render() {
@@ -157,3 +173,5 @@ var props = this.props;
           placeholder: placeholder,
-          onChange: this.onInputChange
+          onChange: this.onInputChange,
+          onFocus: this.onFocus,
+          onBlur: this.onBlur
         })
@@ -160,0 +178,0 @@ ),

lib/util/index.js

@@ -18,2 +18,3 @@ 'use strict';
 exports.isAllowedDate = isAllowedDate;
+exports.formatDate = formatDate;
 
@@ -111,2 +112,14 @@ var _moment = require('moment');
   return true;
+}
+
+function formatDate(value, format) {
+  if (!value) {
+    return '';
+  }
+
+  if (Array.isArray(format)) {
+    format = format[0];
+  }
+
+  return value.format(format);
 }

package.json

 {
   "name": "rc-calendar",
-  "version": "9.7.11",
+  "version": "9.8.0",
   "description": "React Calendar",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -157,5 +157,6 @@ # rc-calendar
           <td>format</td>
-          <td>String</td>
+          <td>String | String[]</td>
           <td>depends on whether you set timePicker and your locale</td>
-          <td>use to format/parse date(without time) value to/from input</td>
+          <td>use to format/parse date(without time) value to/from input.  
+          When an array is provided, all values are used for parsing and first value for display.</td>
         </tr>
@@ -162,0 +163,0 @@ <tr>

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1490505

increased by0.29%

Lines of code

22739

increased by0.35%

Number of lines in readme file

748

increased by0.13%

No dependency changes