@atlaskit/datetime-picker 19.4.0 → 19.4.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/datetime-picker
 
+## 19.4.1
+
+### Patch Changes
+
+- [`efaa75ad1bb94`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/efaa75ad1bb94) -
+  Preserve supplied ISO offsets when editing datetime values behind
+  `platform-dst-dtp-preserve-offset`.
+
 ## 19.4.0
 
 ### Minor Changes

package/dist/cjs/components/date-picker.js

@@ -47,7 +47,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.3.2";
+var packageVersion = "19.4.0";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",

package/dist/cjs/components/date-time-picker.js

@@ -35,7 +35,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 // for typing `process`
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.3.2";
+var packageVersion = "19.4.0";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,
@@ -83,6 +83,36 @@ var getStyles = function getStyles(isInputMotionEnabled, roundedCorners) {
     }
   };
 };
+var parseDateTimeValueWithOffset = function parseDateTimeValueWithOffset(value) {
+  var parsed = (0, _dateFns.parseISO)(value);
+  var zoneStart = value.endsWith('Z') ? value.length - 1 : Math.max(value.lastIndexOf('+'), value.lastIndexOf('-'));
+  if (!(0, _dateFns.isValid)(parsed) || value[10] !== 'T' || zoneStart <= 15) {
+    return undefined;
+  }
+  var zoneValue = value.slice(zoneStart);
+  if (!/^(?:Z|[+-]\d{2}(?::?\d{2})?)$/.test(zoneValue)) {
+    return undefined;
+  }
+  return {
+    dateValue: value.slice(0, 10),
+    timeValue: value.slice(11, 16),
+    zoneValue: zoneValue
+  };
+};
+var parseDateTimeValue = function parseDateTimeValue(value) {
+  if ((0, _fg.fg)('platform-dst-dtp-preserve-offset')) {
+    var hasExplicitZone = value.endsWith('Z') || Math.max(value.lastIndexOf('+'), value.lastIndexOf('-')) > 15;
+    if (hasExplicitZone) {
+      return parseDateTimeValueWithOffset(value);
+    }
+  }
+  var parsed = (0, _dateFns.parseISO)(value);
+  return (0, _dateFns.isValid)(parsed) ? {
+    dateValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('YYYY-MM-DD')),
+    timeValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('HH:mm')),
+    zoneValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('ZZ'))
+  } : undefined;
+};
 
 /**
  * Two action types keep the reducer focused:
@@ -187,13 +217,10 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
               zoneValue: state.zoneValue
             };
           }
-          var parsed = (0, _dateFns.parseISO)(newValue);
-          return (0, _dateFns.isValid)(parsed) ? {
-            value: newValue,
-            dateValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('YYYY-MM-DD')),
-            timeValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('HH:mm')),
-            zoneValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('ZZ'))
-          } : {
+          var parsed = parseDateTimeValue(newValue);
+          return parsed ? _objectSpread({
+            value: newValue
+          }, parsed) : {
             value: newValue,
             dateValue: '',
             timeValue: '',
@@ -228,13 +255,10 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
           zoneValue: ''
         };
       }
-      var parsed = (0, _dateFns.parseISO)(initialValue);
-      return (0, _dateFns.isValid)(parsed) ? {
-        value: initialValue,
-        dateValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('YYYY-MM-DD')),
-        timeValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('HH:mm')),
-        zoneValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('ZZ'))
-      } : {
+      var parsed = parseDateTimeValue(initialValue);
+      return parsed ? _objectSpread({
+        value: initialValue
+      }, parsed) : {
         value: initialValue,
         dateValue: initialDate,
         timeValue: initialTime,
@@ -288,12 +312,8 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
         zoneValue: providedZoneValue
       };
     }
-    var parsed = (0, _dateFns.parseISO)(value);
-    return (0, _dateFns.isValid)(parsed) ? {
-      dateValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('YYYY-MM-DD')),
-      timeValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('HH:mm')),
-      zoneValue: (0, _dateFns.format)(parsed, (0, _parseTokens.convertTokens)('ZZ'))
-    } : {
+    var parsed = parseDateTimeValue(value);
+    return parsed || {
       dateValue: dtState.dateValue,
       timeValue: dtState.timeValue,
       zoneValue: dtState.zoneValue

package/dist/cjs/components/time-picker.js

@@ -38,7 +38,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // oxlint-disable-next-line @atlassian/no-restricted-imports
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.3.2";
+var packageVersion = "19.4.0";
 var defaultTimeFormat = 'h:mma';
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */

package/dist/es2019/components/date-picker.js

@@ -32,7 +32,7 @@ import { parseDate } from '../internal/parse-date';
 import { PickerButtonContainer } from '../internal/picker-button-container';
 import { makeSingleValue } from '../internal/single-value';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.3.2";
+const packageVersion = "19.4.0";
 const styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",

package/dist/es2019/components/date-time-picker.js

@@ -22,7 +22,7 @@ import { convertTokens } from '../internal/parse-tokens';
 import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.3.2";
+const packageVersion = "19.4.0";
 const analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName,
@@ -70,6 +70,36 @@ const getStyles = (isInputMotionEnabled, roundedCorners) => ({
     }
   })
 });
+const parseDateTimeValueWithOffset = value => {
+  const parsed = parseISO(value);
+  const zoneStart = value.endsWith('Z') ? value.length - 1 : Math.max(value.lastIndexOf('+'), value.lastIndexOf('-'));
+  if (!isValid(parsed) || value[10] !== 'T' || zoneStart <= 15) {
+    return undefined;
+  }
+  const zoneValue = value.slice(zoneStart);
+  if (!/^(?:Z|[+-]\d{2}(?::?\d{2})?)$/.test(zoneValue)) {
+    return undefined;
+  }
+  return {
+    dateValue: value.slice(0, 10),
+    timeValue: value.slice(11, 16),
+    zoneValue
+  };
+};
+const parseDateTimeValue = value => {
+  if (fg('platform-dst-dtp-preserve-offset')) {
+    const hasExplicitZone = value.endsWith('Z') || Math.max(value.lastIndexOf('+'), value.lastIndexOf('-')) > 15;
+    if (hasExplicitZone) {
+      return parseDateTimeValueWithOffset(value);
+    }
+  }
+  const parsed = parseISO(value);
+  return isValid(parsed) ? {
+    dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
+    timeValue: format(parsed, convertTokens('HH:mm')),
+    zoneValue: format(parsed, convertTokens('ZZ'))
+  } : undefined;
+};
 
 /**
  * Two action types keep the reducer focused:
@@ -160,12 +190,10 @@ const DateTimePicker = /*#__PURE__*/forwardRef(({
               zoneValue: state.zoneValue
             };
           }
-          const parsed = parseISO(newValue);
-          return isValid(parsed) ? {
+          const parsed = parseDateTimeValue(newValue);
+          return parsed ? {
             value: newValue,
-            dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
-            timeValue: format(parsed, convertTokens('HH:mm')),
-            zoneValue: format(parsed, convertTokens('ZZ'))
+            ...parsed
           } : {
             value: newValue,
             dateValue: '',
@@ -202,12 +230,10 @@ const DateTimePicker = /*#__PURE__*/forwardRef(({
         zoneValue: ''
       };
     }
-    const parsed = parseISO(initialValue);
-    return isValid(parsed) ? {
+    const parsed = parseDateTimeValue(initialValue);
+    return parsed ? {
       value: initialValue,
-      dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
-      timeValue: format(parsed, convertTokens('HH:mm')),
-      zoneValue: format(parsed, convertTokens('ZZ'))
+      ...parsed
     } : {
       value: initialValue,
       dateValue: initialDate,
@@ -259,12 +285,8 @@ const DateTimePicker = /*#__PURE__*/forwardRef(({
         zoneValue: providedZoneValue
       };
     }
-    const parsed = parseISO(value);
-    return isValid(parsed) ? {
-      dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
-      timeValue: format(parsed, convertTokens('HH:mm')),
-      zoneValue: format(parsed, convertTokens('ZZ'))
-    } : {
+    const parsed = parseDateTimeValue(value);
+    return parsed || {
       dateValue: dtState.dateValue,
       timeValue: dtState.timeValue,
       zoneValue: dtState.zoneValue

package/dist/es2019/components/time-picker.js

@@ -25,7 +25,7 @@ import { PickerButtonContainer } from '../internal/picker-button-container';
 import { placeholderDatetime } from '../internal/placeholder-date-time';
 import { makeSingleValue } from '../internal/single-value';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.3.2";
+const packageVersion = "19.4.0";
 const defaultTimeFormat = 'h:mma';
 const menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */

package/dist/esm/components/date-picker.js

@@ -40,7 +40,7 @@ import { parseDate } from '../internal/parse-date';
 import { PickerButtonContainer } from '../internal/picker-button-container';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.3.2";
+var packageVersion = "19.4.0";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",

package/dist/esm/components/date-time-picker.js

@@ -29,7 +29,7 @@ import { convertTokens } from '../internal/parse-tokens';
 import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.3.2";
+var packageVersion = "19.4.0";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,
@@ -77,6 +77,36 @@ var getStyles = function getStyles(isInputMotionEnabled, roundedCorners) {
     }
   };
 };
+var parseDateTimeValueWithOffset = function parseDateTimeValueWithOffset(value) {
+  var parsed = parseISO(value);
+  var zoneStart = value.endsWith('Z') ? value.length - 1 : Math.max(value.lastIndexOf('+'), value.lastIndexOf('-'));
+  if (!isValid(parsed) || value[10] !== 'T' || zoneStart <= 15) {
+    return undefined;
+  }
+  var zoneValue = value.slice(zoneStart);
+  if (!/^(?:Z|[+-]\d{2}(?::?\d{2})?)$/.test(zoneValue)) {
+    return undefined;
+  }
+  return {
+    dateValue: value.slice(0, 10),
+    timeValue: value.slice(11, 16),
+    zoneValue: zoneValue
+  };
+};
+var parseDateTimeValue = function parseDateTimeValue(value) {
+  if (fg('platform-dst-dtp-preserve-offset')) {
+    var hasExplicitZone = value.endsWith('Z') || Math.max(value.lastIndexOf('+'), value.lastIndexOf('-')) > 15;
+    if (hasExplicitZone) {
+      return parseDateTimeValueWithOffset(value);
+    }
+  }
+  var parsed = parseISO(value);
+  return isValid(parsed) ? {
+    dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
+    timeValue: format(parsed, convertTokens('HH:mm')),
+    zoneValue: format(parsed, convertTokens('ZZ'))
+  } : undefined;
+};
 
 /**
  * Two action types keep the reducer focused:
@@ -181,13 +211,10 @@ var DateTimePicker = /*#__PURE__*/forwardRef(function (_ref2, ref) {
               zoneValue: state.zoneValue
             };
           }
-          var parsed = parseISO(newValue);
-          return isValid(parsed) ? {
-            value: newValue,
-            dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
-            timeValue: format(parsed, convertTokens('HH:mm')),
-            zoneValue: format(parsed, convertTokens('ZZ'))
-          } : {
+          var parsed = parseDateTimeValue(newValue);
+          return parsed ? _objectSpread({
+            value: newValue
+          }, parsed) : {
             value: newValue,
             dateValue: '',
             timeValue: '',
@@ -222,13 +249,10 @@ var DateTimePicker = /*#__PURE__*/forwardRef(function (_ref2, ref) {
           zoneValue: ''
         };
       }
-      var parsed = parseISO(initialValue);
-      return isValid(parsed) ? {
-        value: initialValue,
-        dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
-        timeValue: format(parsed, convertTokens('HH:mm')),
-        zoneValue: format(parsed, convertTokens('ZZ'))
-      } : {
+      var parsed = parseDateTimeValue(initialValue);
+      return parsed ? _objectSpread({
+        value: initialValue
+      }, parsed) : {
         value: initialValue,
         dateValue: initialDate,
         timeValue: initialTime,
@@ -282,12 +306,8 @@ var DateTimePicker = /*#__PURE__*/forwardRef(function (_ref2, ref) {
         zoneValue: providedZoneValue
       };
     }
-    var parsed = parseISO(value);
-    return isValid(parsed) ? {
-      dateValue: format(parsed, convertTokens('YYYY-MM-DD')),
-      timeValue: format(parsed, convertTokens('HH:mm')),
-      zoneValue: format(parsed, convertTokens('ZZ'))
-    } : {
+    var parsed = parseDateTimeValue(value);
+    return parsed || {
       dateValue: dtState.dateValue,
       timeValue: dtState.timeValue,
       zoneValue: dtState.zoneValue

package/dist/esm/components/time-picker.js

@@ -31,7 +31,7 @@ import { PickerButtonContainer } from '../internal/picker-button-container';
 import { placeholderDatetime } from '../internal/placeholder-date-time';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.3.2";
+var packageVersion = "19.4.0";
 var defaultTimeFormat = 'h:mma';
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/datetime-picker",
-	"version": "19.4.0",
+	"version": "19.4.1",
 	"description": "A date time picker allows the user to select an associated date and time.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -49,7 +49,7 @@
 		"@atlaskit/react-select": "^4.12.0",
 		"@atlaskit/select": "^23.1.0",
 		"@atlaskit/tokens": "^20.7.0",
-		"@atlaskit/top-layer": "^6.6.0",
+		"@atlaskit/top-layer": "^6.7.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
 		"date-fns": "^2.17.0"
@@ -92,6 +92,9 @@
 		"platform-dst-top-layer": {
 			"type": "boolean"
 		},
+		"platform-dst-dtp-preserve-offset": {
+			"type": "boolean"
+		},
 		"platform-dst-motion-uplift-input": {
 			"type": "boolean",
 			"referenceOnly": true