@atlaskit/datetime-picker 12.10.2 → 12.10.3

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/datetime-picker
 
+## 12.10.3
+
+### Patch Changes
+
+- [#41628](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41628) [`b05664f7aba`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b05664f7aba) - Use feature flag to toggle if we enable UNSAFE_LAYERING
+
 ## 12.10.2
 
 ### Patch Changes

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

@@ -39,7 +39,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "12.10.2";
+var packageVersion = "12.10.3";
 function getValidDate(iso) {
   var date = (0, _dateFns.parseISO)(iso);
   return (0, _dateFns.isValid)(date) ? {
@@ -61,7 +61,9 @@ var menuStyles = (0, _react2.css)({
 var Menu = function Menu(_ref) {
   var selectProps = _ref.selectProps,
     innerProps = _ref.innerProps;
-  return (0, _react2.jsx)(_layering.UNSAFE_LAYERING, null, (0, _react2.jsx)(_fixedLayer.default, {
+  return (0, _react2.jsx)(_layering.UNSAFE_LAYERING, {
+    isDisabled: (0, _platformFeatureFlags.getBooleanFF)('platform.design-system-team.layering_qmiw3') ? false : true
+  }, (0, _react2.jsx)(_fixedLayer.default, {
     inputValue: selectProps.inputValue,
     containerRef: selectProps.calendarContainerRef,
     content: (0, _react2.jsx)("div", (0, _extends2.default)({
@@ -113,7 +115,7 @@ var datePickerDefaultProps = {
   // Not including a default prop for value as it will
   // Make the component a controlled component
 };
-var DatePicker = /*#__PURE__*/function (_Component) {
+var DatePicker = exports.DatePickerWithoutAnalytics = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(DatePicker, _Component);
   var _super = _createSuper(DatePicker);
   function DatePicker(props) {
@@ -533,9 +535,8 @@ var DatePicker = /*#__PURE__*/function (_Component) {
   }]);
   return DatePicker;
 }(_react.Component);
-exports.DatePickerWithoutAnalytics = DatePicker;
 (0, _defineProperty2.default)(DatePicker, "defaultProps", datePickerDefaultProps);
-var _default = (0, _analyticsNext.withAnalyticsContext)({
+var _default = exports.default = (0, _analyticsNext.withAnalyticsContext)({
   componentName: 'datePicker',
   packageName: packageName,
   packageVersion: packageVersion
@@ -549,5 +550,4 @@ var _default = (0, _analyticsNext.withAnalyticsContext)({
       packageVersion: packageVersion
     }
   })
-})(DatePicker));
-exports.default = _default;
+})(DatePicker));

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

@@ -31,7 +31,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 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; } /** @jsx jsx */
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "12.10.2";
+var packageVersion = "12.10.3";
 var isInvalidBorderStyles = (0, _react2.css)({
   borderColor: "var(--ds-border-danger, ".concat(_colors.R400, ")")
 });
@@ -157,11 +157,9 @@ var dateTimePickerDefaultProps = {
   // Make the component a controlled component
 };
 
-var datePickerDefaultAriaLabel = 'Date';
-exports.datePickerDefaultAriaLabel = datePickerDefaultAriaLabel;
-var timePickerDefaultAriaLabel = 'Time';
-exports.timePickerDefaultAriaLabel = timePickerDefaultAriaLabel;
-var DateTimePicker = /*#__PURE__*/function (_React$Component) {
+var datePickerDefaultAriaLabel = exports.datePickerDefaultAriaLabel = 'Date';
+var timePickerDefaultAriaLabel = exports.timePickerDefaultAriaLabel = 'Time';
+var DateTimePicker = exports.DateTimePickerWithoutAnalytics = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(DateTimePicker, _React$Component);
   var _super = _createSuper(DateTimePicker);
   function DateTimePicker() {
@@ -356,9 +354,8 @@ var DateTimePicker = /*#__PURE__*/function (_React$Component) {
   }]);
   return DateTimePicker;
 }(_react.default.Component);
-exports.DateTimePickerWithoutAnalytics = DateTimePicker;
 (0, _defineProperty2.default)(DateTimePicker, "defaultProps", dateTimePickerDefaultProps);
-var _default = (0, _analyticsNext.withAnalyticsContext)({
+var _default = exports.default = (0, _analyticsNext.withAnalyticsContext)({
   componentName: 'dateTimePicker',
   packageName: packageName,
   packageVersion: packageVersion
@@ -372,5 +369,4 @@ var _default = (0, _analyticsNext.withAnalyticsContext)({
       packageVersion: packageVersion
     }
   })
-})(DateTimePicker));
-exports.default = _default;
+})(DateTimePicker));

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

@@ -37,7 +37,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "12.10.2";
+var packageVersion = "12.10.3";
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
   position: 'static',
@@ -87,7 +87,7 @@ var timePickerDefaultProps = {
   // Not including a default prop for value as it will
   // Make the component a controlled component
 };
-var TimePicker = /*#__PURE__*/function (_React$Component) {
+var TimePicker = exports.TimePickerWithoutAnalytics = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(TimePicker, _React$Component);
   var _super = _createSuper(TimePicker);
   function TimePicker() {
@@ -339,9 +339,8 @@ var TimePicker = /*#__PURE__*/function (_React$Component) {
   }]);
   return TimePicker;
 }(_react.default.Component);
-exports.TimePickerWithoutAnalytics = TimePicker;
 (0, _defineProperty2.default)(TimePicker, "defaultProps", timePickerDefaultProps);
-var _default = (0, _analyticsNext.withAnalyticsContext)({
+var _default = exports.default = (0, _analyticsNext.withAnalyticsContext)({
   componentName: 'timePicker',
   packageName: packageName,
   packageVersion: packageVersion
@@ -355,5 +354,4 @@ var _default = (0, _analyticsNext.withAnalyticsContext)({
       packageVersion: packageVersion
     }
   })
-})(TimePicker));
-exports.default = _default;
+})(TimePicker));

package/dist/cjs/internal/fixed-layer.js

@@ -28,7 +28,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
  * Scroll is locked outside the layer to prevent the layered content from detaching from the
  * container ref.
  */
-var FixedLayer = /*#__PURE__*/function (_React$Component) {
+var FixedLayer = exports.default = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(FixedLayer, _React$Component);
   var _super = _createSuper(FixedLayer);
   function FixedLayer() {
@@ -100,5 +100,4 @@ var FixedLayer = /*#__PURE__*/function (_React$Component) {
     }
   }]);
   return FixedLayer;
-}(_react.default.Component);
-exports.default = FixedLayer;
+}(_react.default.Component);

package/dist/cjs/internal/index.js

@@ -10,21 +10,16 @@ exports.placeholderDatetime = void 0;
 /**
  * This component is used to hide portions of Select component.
  */
-var EmptyComponent = function EmptyComponent() {
+var EmptyComponent = exports.EmptyComponent = function EmptyComponent() {
   return null;
 };
 
 // This date was chosen to clearly show date and time formats (day > 12)
 // e.g. 18/02/1993 vs. 2/18/1993 and 1:00 PM vs 13:00
-exports.EmptyComponent = EmptyComponent;
-var placeholderDatetime = new Date(1993, 1, 18, 13);
-exports.placeholderDatetime = placeholderDatetime;
-var defaultTimes = ['09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00'];
-exports.defaultTimes = defaultTimes;
-var defaultTimeFormat = 'h:mma';
-exports.defaultTimeFormat = defaultTimeFormat;
-var defaultDateFormat = 'YYYY/MM/DD';
-exports.defaultDateFormat = defaultDateFormat;
+var placeholderDatetime = exports.placeholderDatetime = new Date(1993, 1, 18, 13);
+var defaultTimes = exports.defaultTimes = ['09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00'];
+var defaultTimeFormat = exports.defaultTimeFormat = 'h:mma';
+var defaultDateFormat = exports.defaultDateFormat = 'YYYY/MM/DD';
 function padToTwo(number) {
   return number <= 99 ? "0".concat(number).slice(-2) : "".concat(number);
 }

package/dist/cjs/internal/single-value.js

@@ -14,7 +14,7 @@ var _excluded = ["children"];
  * This creates a functional component that `react-select` will use to make the
  * SingleValue part of the different pickers.
  */
-var makeSingleValue = function makeSingleValue(_ref) {
+var makeSingleValue = exports.makeSingleValue = function makeSingleValue(_ref) {
   var lang = _ref.lang;
   return function (_ref2) {
     var children = _ref2.children,
@@ -25,5 +25,4 @@ var makeSingleValue = function makeSingleValue(_ref) {
       }
     }), children);
   };
-};
-exports.makeSingleValue = makeSingleValue;
+};

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

@@ -19,7 +19,7 @@ import FixedLayer from '../internal/fixed-layer';
 import { makeSingleValue } from '../internal/single-value';
 import { convertTokens } from './utils';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "12.10.2";
+const packageVersion = "12.10.3";
 function getValidDate(iso) {
   const date = parseISO(iso);
   return isValid(date) ? {
@@ -41,7 +41,9 @@ const menuStyles = css({
 const Menu = ({
   selectProps,
   innerProps
-}) => jsx(UNSAFE_LAYERING, null, jsx(FixedLayer, {
+}) => jsx(UNSAFE_LAYERING, {
+  isDisabled: getBooleanFF('platform.design-system-team.layering_qmiw3') ? false : true
+}, jsx(FixedLayer, {
   inputValue: selectProps.inputValue,
   containerRef: selectProps.calendarContainerRef,
   content: jsx("div", _extends({

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

@@ -15,7 +15,7 @@ import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 import { convertTokens } from './utils';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "12.10.2";
+const packageVersion = "12.10.3";
 const isInvalidBorderStyles = css({
   borderColor: `var(--ds-border-danger, ${R400})`
 });

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

@@ -16,7 +16,7 @@ import parseTime from '../internal/parse-time';
 import { makeSingleValue } from '../internal/single-value';
 import { convertTokens } from './utils';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "12.10.2";
+const packageVersion = "12.10.3";
 const menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
   position: 'static',

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

@@ -30,7 +30,7 @@ import FixedLayer from '../internal/fixed-layer';
 import { makeSingleValue } from '../internal/single-value';
 import { convertTokens } from './utils';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "12.10.2";
+var packageVersion = "12.10.3";
 function getValidDate(iso) {
   var date = parseISO(iso);
   return isValid(date) ? {
@@ -52,7 +52,9 @@ var menuStyles = css({
 var Menu = function Menu(_ref) {
   var selectProps = _ref.selectProps,
     innerProps = _ref.innerProps;
-  return jsx(UNSAFE_LAYERING, null, jsx(FixedLayer, {
+  return jsx(UNSAFE_LAYERING, {
+    isDisabled: getBooleanFF('platform.design-system-team.layering_qmiw3') ? false : true
+  }, jsx(FixedLayer, {
     inputValue: selectProps.inputValue,
     containerRef: selectProps.calendarContainerRef,
     content: jsx("div", _extends({

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

@@ -25,7 +25,7 @@ import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 import { convertTokens } from './utils';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "12.10.2";
+var packageVersion = "12.10.3";
 var isInvalidBorderStyles = css({
   borderColor: "var(--ds-border-danger, ".concat(R400, ")")
 });

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

@@ -29,7 +29,7 @@ import parseTime from '../internal/parse-time';
 import { makeSingleValue } from '../internal/single-value';
 import { convertTokens } from './utils';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "12.10.2";
+var packageVersion = "12.10.3";
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
   position: 'static',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/datetime-picker",
-  "version": "12.10.2",
+  "version": "12.10.3",
   "description": "A date time picker allows the user to select an associated date and time.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -42,7 +42,7 @@
     "@atlaskit/popper": "^5.5.0",
     "@atlaskit/select": "^16.7.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.25.0",
+    "@atlaskit/tokens": "^1.27.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "date-fns": "^2.17.0",
@@ -57,8 +57,8 @@
     "@atlaskit/button": "^16.10.0",
     "@atlaskit/docs": "*",
     "@atlaskit/form": "^8.11.0",
-    "@atlaskit/modal-dialog": "^12.7.0",
-    "@atlaskit/popup": "^1.10.0",
+    "@atlaskit/modal-dialog": "^12.8.0",
+    "@atlaskit/popup": "^1.11.0",
     "@atlaskit/range": "^7.1.0",
     "@atlaskit/section-message": "^6.4.0",
     "@atlaskit/ssr": "*",
@@ -68,7 +68,6 @@
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
     "@atlassian/feature-flags-test-utils": "*",
-    "@emotion/react": "^11.7.1",
     "@testing-library/react": "^12.1.5",
     "@testing-library/user-event": "^14.4.3",
     "@types/testing-library__jest-dom": "^5.14.5",
@@ -98,6 +97,9 @@
     }
   },
   "platform-feature-flags": {
+    "platform.design-system-team.layering_qmiw3": {
+      "type": "boolean"
+    },
     "platform.design-system-team.border-checkbox_nyoiu": {
       "type": "boolean"
     },