@zohodesk/components 1.0.0-alpha-274 → 1.0.0-alpha-276

package/README.md

@@ -32,6 +32,15 @@ In this Package, we Provide Some Basic Components to Build Web App
 - TextBoxIcon
 - Tooltip
 
+# 1.0.0-alpha-276
+
+- **DateTime** - TimeZone null Case Handled
+
+
+# 1.0.0-alpha-275
+
+- **DateTime** - millisecond and second should work only when customDateFormat is given issue fixed. this fix related to *1.0.0-alpha-272*
+
 # 1.0.0-alpha-274
 
 - **AppContainer** - needTooltip prop added

package/es/DateTime/DateTime.js

@@ -46,6 +46,7 @@ export default class DateTime extends React.PureComponent {
     this.handleSelectMonthViaYearView = this.handleSelectMonthViaYearView.bind(this);
     this.handleGetStateValues = this.handleGetStateValues.bind(this);
     this.handleYearViewToggle = this.handleYearViewToggle.bind(this);
+    this.getInitialDate = this.getInitialDate.bind(this);
     const {
       ampmText = ampmTextDefault
     } = props.i18nKeys;
@@ -102,6 +103,33 @@ export default class DateTime extends React.PureComponent {
     this.handleExposeMethods(false);
   }
 
+  getInitialDate(value) {
+    let timeZone = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+    let isDateTime = arguments.length > 2 ? arguments[2] : undefined;
+    let result = null;
+
+    if (isDateTime) {
+      if (timeZone && value) {
+        result = datetime.toDate(datetime.tz.utcToTz(value, timeZone));
+      } else {
+        value = value.replace('Z', '');
+        result = new Date(value);
+      }
+    } else {
+      if (value) {
+        if (timeZone) {
+          result = datetime.toDate(value);
+        } else {
+          result = new Date(value);
+        }
+      } else {
+        result = new Date();
+      }
+    }
+
+    return result;
+  }
+
   getStateFromProps(props) {
     let date, month, year, hours, mins, amPm;
     let {
@@ -126,7 +154,7 @@ export default class DateTime extends React.PureComponent {
       defaultMin = parseInt(defaultMin);
     }
 
-    const dateObj = isDateTimeField ? datetime.toDate(datetime.tz.utcToTz(value, timeZone)) : value ? datetime.toDate(value) : todayObj;
+    const dateObj = this.getInitialDate(value, timeZone, isDateTimeField);
     date = dateObj.getDate();
     month = dateObj.getMonth();
     year = dateObj.getFullYear();
@@ -205,9 +233,15 @@ export default class DateTime extends React.PureComponent {
     let milliSec = currentDate.getMilliseconds();
 
     if (isDateTimeField || customDateFormat) {
-      selectedInMillis = datetime.tz.tzToUtc(Date.UTC(year, month, date, hours, mins, sec, milliSec), timeZone);
+      const dateArgs = [year, month, date, hours, mins];
+
+      if (customDateFormat) {
+        dateArgs.push(sec, milliSec);
+      }
+
+      selectedInMillis = timeZone ? datetime.tz.tzToUtc(Date.UTC(...dateArgs), timeZone) : Date.UTC(...dateArgs);
       selectedValue = datetime.ISO(selectedInMillis);
-      formattedValue = formatDate(new Date(year, month, date, hours, mins, sec, milliSec), customDateFormat == null ? is24Hour ? `${dateFormat} HH:mm:ss` : `${dateFormat} hh:mm:ss A` : `${customDateFormat}`);
+      formattedValue = formatDate(new Date(...dateArgs), customDateFormat == null ? is24Hour ? `${dateFormat} HH:mm:ss` : `${dateFormat} hh:mm:ss A` : `${customDateFormat}`);
     } else {
       selectedInMillis = Date.UTC(year, month, date);
       selectedValue = formatDate(new Date(year, month, date), 'YYYY-MM-DD');

package/lib/DateTime/DateTime.js

@@ -41,6 +41,8 @@ var _dateFormatUtils = require("./dateFormatUtils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _construct = Reflect.construct.bind(); } else { _construct = function _construct(Parent, args, Class) { var a = [null]; a.push.apply(a, args); var Constructor = Function.bind.apply(Parent, a); var instance = new Constructor(); if (Class) _setPrototypeOf(instance, Class.prototype); return instance; }; } return _construct.apply(null, arguments); }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -109,6 +111,7 @@ var DateTime = /*#__PURE__*/function (_React$PureComponent) {
     _this.handleSelectMonthViaYearView = _this.handleSelectMonthViaYearView.bind(_assertThisInitialized(_this));
     _this.handleGetStateValues = _this.handleGetStateValues.bind(_assertThisInitialized(_this));
     _this.handleYearViewToggle = _this.handleYearViewToggle.bind(_assertThisInitialized(_this));
+    _this.getInitialDate = _this.getInitialDate.bind(_assertThisInitialized(_this));
     var _props$i18nKeys$ampmT = props.i18nKeys.ampmText,
         ampmText = _props$i18nKeys$ampmT === void 0 ? _constants.ampmTextDefault : _props$i18nKeys$ampmT;
 
@@ -168,6 +171,34 @@ var DateTime = /*#__PURE__*/function (_React$PureComponent) {
     value: function componentWillUnmount() {
       this.handleExposeMethods(false);
     }
+  }, {
+    key: "getInitialDate",
+    value: function getInitialDate(value) {
+      var timeZone = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : undefined;
+      var isDateTime = arguments.length > 2 ? arguments[2] : undefined;
+      var result = null;
+
+      if (isDateTime) {
+        if (timeZone && value) {
+          result = _datetimejs["default"].toDate(_datetimejs["default"].tz.utcToTz(value, timeZone));
+        } else {
+          value = value.replace('Z', '');
+          result = new Date(value);
+        }
+      } else {
+        if (value) {
+          if (timeZone) {
+            result = _datetimejs["default"].toDate(value);
+          } else {
+            result = new Date(value);
+          }
+        } else {
+          result = new Date();
+        }
+      }
+
+      return result;
+    }
   }, {
     key: "getStateFromProps",
     value: function getStateFromProps(props) {
@@ -198,7 +229,7 @@ var DateTime = /*#__PURE__*/function (_React$PureComponent) {
         defaultMin = parseInt(defaultMin);
       }
 
-      var dateObj = isDateTimeField ? _datetimejs["default"].toDate(_datetimejs["default"].tz.utcToTz(value, timeZone)) : value ? _datetimejs["default"].toDate(value) : todayObj;
+      var dateObj = this.getInitialDate(value, timeZone, isDateTimeField);
       date = dateObj.getDate();
       month = dateObj.getMonth();
       year = dateObj.getFullYear();
@@ -276,9 +307,15 @@ var DateTime = /*#__PURE__*/function (_React$PureComponent) {
       var milliSec = currentDate.getMilliseconds();
 
       if (isDateTimeField || customDateFormat) {
-        selectedInMillis = _datetimejs["default"].tz.tzToUtc(Date.UTC(year, month, date, hours, mins, sec, milliSec), timeZone);
+        var dateArgs = [year, month, date, hours, mins];
+
+        if (customDateFormat) {
+          dateArgs.push(sec, milliSec);
+        }
+
+        selectedInMillis = timeZone ? _datetimejs["default"].tz.tzToUtc(Date.UTC.apply(Date, dateArgs), timeZone) : Date.UTC.apply(Date, dateArgs);
         selectedValue = _datetimejs["default"].ISO(selectedInMillis);
-        formattedValue = (0, _common.formatDate)(new Date(year, month, date, hours, mins, sec, milliSec), customDateFormat == null ? is24Hour ? "".concat(dateFormat, " HH:mm:ss") : "".concat(dateFormat, " hh:mm:ss A") : "".concat(customDateFormat));
+        formattedValue = (0, _common.formatDate)(_construct(Date, dateArgs), customDateFormat == null ? is24Hour ? "".concat(dateFormat, " HH:mm:ss") : "".concat(dateFormat, " hh:mm:ss A") : "".concat(customDateFormat));
       } else {
         selectedInMillis = Date.UTC(year, month, date);
         selectedValue = (0, _common.formatDate)(new Date(year, month, date), 'YYYY-MM-DD');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-alpha-274",
+  "version": "1.0.0-alpha-276",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -51,12 +51,12 @@
     "variable:check": "node  ./node_modules/@zohodesk-private/css-variable-migrator/es/variableErrorCheck.js ./src ./node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json"
   },
   "devDependencies": {
-    "@zohodesk-private/css-variable-migrator": "^1.0.1",
+    "@zohodesk-private/css-variable-migrator": "^1.0.5",
     "@zohodesk/a11y": "1.3.7",
     "@zohodesk-private/node-plugins": "^1.0.0",
     "@zohodesk/docstool": "1.0.0-alpha-2",
-    "@zohodesk/icons": "1.0.0-beta.125",
-    "@zohodesk/svg": "1.0.0-beta.56",
+    "@zohodesk/icons": "1.0.0-beta.132",
+    "@zohodesk/svg": "1.0.0-beta.59",
     "@zohodesk/variables": "1.0.0-beta.31",
     "@zohodesk/virtualizer": "1.0.3",
     "react-sortable-hoc": "^0.8.3",
@@ -69,9 +69,9 @@
     "selectn": "1.1.2"
   },
   "peerDependencies": {
-    "@zohodesk/icons": "1.0.0-beta.125",
+    "@zohodesk/icons": "1.0.0-beta.132",
     "@zohodesk/variables": "1.0.0-beta.31",
-    "@zohodesk/svg": "1.0.0-beta.56",
+    "@zohodesk/svg": "1.0.0-beta.59",
     "@zohodesk/virtualizer": "1.0.3",
     "velocity-react": "1.4.3",
     "react-sortable-hoc": "^0.8.3",