@atlaskit/datetime-picker 19.0.1 → 19.2.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @atlaskit/datetime-picker
 
+## 19.2.0
+
+### Minor Changes
+
+- [`98a7771631acd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/98a7771631acd) -
+  Cleanup `feature_gate` `platform-dst-locale-week-start-day`. Calendar and DatePicker now always
+  default the first day of the week to the first day for the given `locale` instead of Sunday (`0`),
+  and `createLocalizationProvider(...).getFirstDayOfWeek()` always resolves the locale's week info.
+  Pass an explicit `weekStartDay` to override the locale default.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 19.1.0
+
+### Minor Changes
+
+- [`4da700505d9ab`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4da700505d9ab) -
+  Add a `calendarLabel` prop for custom calendar accessible labels.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 19.0.1
 
 ### Patch Changes

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

@@ -38,7 +38,7 @@ var _menu = require("../internal/menu");
 var _menuTopLayer = require("../internal/menu-top-layer");
 var _parseDate = require("../internal/parse-date");
 var _singleValue = require("../internal/single-value");
-var _excluded = ["appearance", "autoFocus", "clearControlLabel", "hideIcon", "openCalendarLabel", "defaultIsOpen", "defaultValue", "disabled", "disabledDateFilter", "icon", "id", "innerProps", "inputLabel", "inputLabelId", "isDisabled", "isInvalid", "isRequired", "label", "name", "onBlur", "onChange", "onFocus", "selectProps", "shouldShowCalendarButton", "spacing", "locale", "value", "isOpen", "maxDate", "minDate", "weekStartDay", "formatDisplayLabel", "testId", "aria-describedby", "placeholder", "nextMonthLabel", "previousMonthLabel"],
+var _excluded = ["appearance", "autoFocus", "clearControlLabel", "hideIcon", "openCalendarLabel", "defaultIsOpen", "defaultValue", "disabled", "disabledDateFilter", "icon", "id", "innerProps", "inputLabel", "inputLabelId", "isDisabled", "isInvalid", "isRequired", "label", "name", "onBlur", "onChange", "onFocus", "selectProps", "shouldShowCalendarButton", "spacing", "locale", "value", "isOpen", "maxDate", "minDate", "weekStartDay", "formatDisplayLabel", "testId", "aria-describedby", "calendarLabel", "placeholder", "nextMonthLabel", "previousMonthLabel"],
   _excluded2 = ["MenuPortal"],
   _excluded3 = ["menuRenderMode"]; /// <reference types="node" />
 // for typing `process`
@@ -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.0.0";
+var packageVersion = "19.1.0";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",
@@ -139,6 +139,7 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, _forwarded
     formatDisplayLabel = props.formatDisplayLabel,
     testId = props.testId,
     ariaDescribedBy = props['aria-describedby'],
+    calendarLabel = props.calendarLabel,
     placeholder = props.placeholder,
     nextMonthLabel = props.nextMonthLabel,
     previousMonthLabel = props.previousMonthLabel,
@@ -531,6 +532,7 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, _forwarded
   } : {};
   var calendarProps = {
     calendarContainerRef: containerRef.current,
+    calendarLabel: calendarLabel,
     calendarDisabled: disabled,
     calendarDisabledDateFilter: disabledDateFilter,
     calendarMaxDate: maxDate,
@@ -541,7 +543,7 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, _forwarded
     onCalendarChange: onCalendarChange,
     onCalendarSelect: onCalendarSelect,
     calendarLocale: locale,
-    calendarWeekStartDay: weekStartDay !== null && weekStartDay !== void 0 ? weekStartDay : (0, _fg.fg)('platform-dst-locale-week-start-day') ? l10n.getFirstDayOfWeek() : undefined,
+    calendarWeekStartDay: weekStartDay !== null && weekStartDay !== void 0 ? weekStartDay : l10n.getFirstDayOfWeek(),
     shouldSetFocusOnCurrentDay: shouldSetFocusOnCurrentDay,
     /**
      * This overrides the inner wrapper the Calendar.
@@ -658,6 +660,7 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, _forwarded
     // These aren't part of `Select`'s API, but we're using them here.
     ,
     calendarContainerRef: calendarProps.calendarContainerRef,
+    calendarLabel: calendarProps.calendarLabel,
     calendarDisabled: calendarProps.calendarDisabled,
     calendarDisabledDateFilter: calendarProps.calendarDisabledDateFilter,
     calendarLocale: calendarProps.calendarLocale,

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

@@ -34,7 +34,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.0.0";
+var packageVersion = "19.1.0";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,
@@ -454,6 +454,7 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     appearance: appearance,
     "aria-describedby": datePickerAriaDescribedBy,
     autoFocus: datePickerProps.autoFocus || autoFocus,
+    calendarLabel: datePickerProps.calendarLabel,
     dateFormat: datePickerProps.dateFormat,
     defaultIsOpen: datePickerProps.defaultIsOpen,
     defaultValue: datePickerProps.defaultValue,

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

@@ -32,7 +32,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.0.0";
+var packageVersion = "19.1.0";
 var defaultTimeFormat = 'h:mma';
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */

package/dist/cjs/internal/menu-top-layer.js

@@ -64,6 +64,7 @@ var MenuTopLayer = exports.MenuTopLayer = function MenuTopLayer(_ref) {
     role: "presentation",
     className: (0, _runtime.ax)([styles.root])
   }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(_calendar.default, {
+    label: selectProps.calendarLabel,
     day: day,
     month: month,
     year: year,

package/dist/cjs/internal/menu.js

@@ -64,6 +64,7 @@ var Menu = exports.Menu = function Menu(_ref) {
       onMouseDown: onMenuMouseDown,
       className: (0, _runtime.ax)(["_2rko1mok _1reo15vq _18m915vq _1pbyowjs _bfhk1bhr _16qs130s"])
     }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(_calendar.default, {
+      label: selectProps.calendarLabel,
       day: day,
       month: month,
       year: year,

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

@@ -32,7 +32,7 @@ import { MenuTopLayer } from '../internal/menu-top-layer';
 import { parseDate } from '../internal/parse-date';
 import { makeSingleValue } from '../internal/single-value';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.0.0";
+const packageVersion = "19.1.0";
 const styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",
@@ -101,6 +101,7 @@ const DatePicker = /*#__PURE__*/forwardRef((props, _forwardedRef) => {
     formatDisplayLabel,
     testId,
     'aria-describedby': ariaDescribedBy,
+    calendarLabel,
     placeholder,
     nextMonthLabel,
     previousMonthLabel,
@@ -458,6 +459,7 @@ const DatePicker = /*#__PURE__*/forwardRef((props, _forwardedRef) => {
   } : {};
   const calendarProps = {
     calendarContainerRef: containerRef.current,
+    calendarLabel,
     calendarDisabled: disabled,
     calendarDisabledDateFilter: disabledDateFilter,
     calendarMaxDate: maxDate,
@@ -468,7 +470,7 @@ const DatePicker = /*#__PURE__*/forwardRef((props, _forwardedRef) => {
     onCalendarChange,
     onCalendarSelect,
     calendarLocale: locale,
-    calendarWeekStartDay: weekStartDay !== null && weekStartDay !== void 0 ? weekStartDay : fg('platform-dst-locale-week-start-day') ? l10n.getFirstDayOfWeek() : undefined,
+    calendarWeekStartDay: weekStartDay !== null && weekStartDay !== void 0 ? weekStartDay : l10n.getFirstDayOfWeek(),
     shouldSetFocusOnCurrentDay,
     /**
      * This overrides the inner wrapper the Calendar.
@@ -588,6 +590,7 @@ const DatePicker = /*#__PURE__*/forwardRef((props, _forwardedRef) => {
     // These aren't part of `Select`'s API, but we're using them here.
     ,
     calendarContainerRef: calendarProps.calendarContainerRef,
+    calendarLabel: calendarProps.calendarLabel,
     calendarDisabled: calendarProps.calendarDisabled,
     calendarDisabledDateFilter: calendarProps.calendarDisabledDateFilter,
     calendarLocale: calendarProps.calendarLocale,

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

@@ -21,7 +21,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.0.0";
+const packageVersion = "19.1.0";
 const analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName,
@@ -430,6 +430,7 @@ const DateTimePicker = /*#__PURE__*/forwardRef(({
     appearance: appearance,
     "aria-describedby": datePickerAriaDescribedBy,
     autoFocus: datePickerProps.autoFocus || autoFocus,
+    calendarLabel: datePickerProps.calendarLabel,
     dateFormat: datePickerProps.dateFormat,
     defaultIsOpen: datePickerProps.defaultIsOpen,
     defaultValue: datePickerProps.defaultValue,

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

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

package/dist/es2019/internal/menu-top-layer.js

@@ -59,6 +59,7 @@ export const MenuTopLayer = ({
     role: "presentation",
     className: ax([styles.root])
   }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Calendar, {
+    label: selectProps.calendarLabel,
     day: day,
     month: month,
     year: year,

package/dist/es2019/internal/menu.js

@@ -61,6 +61,7 @@ export const Menu = ({
       onMouseDown: onMenuMouseDown,
       className: ax(["_2rko1mok _1reo15vq _18m915vq _1pbyowjs _bfhk1bhr _16qs130s"])
     }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Calendar, {
+      label: selectProps.calendarLabel,
       day: day,
       month: month,
       year: year,

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

@@ -3,7 +3,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["appearance", "autoFocus", "clearControlLabel", "hideIcon", "openCalendarLabel", "defaultIsOpen", "defaultValue", "disabled", "disabledDateFilter", "icon", "id", "innerProps", "inputLabel", "inputLabelId", "isDisabled", "isInvalid", "isRequired", "label", "name", "onBlur", "onChange", "onFocus", "selectProps", "shouldShowCalendarButton", "spacing", "locale", "value", "isOpen", "maxDate", "minDate", "weekStartDay", "formatDisplayLabel", "testId", "aria-describedby", "placeholder", "nextMonthLabel", "previousMonthLabel"],
+var _excluded = ["appearance", "autoFocus", "clearControlLabel", "hideIcon", "openCalendarLabel", "defaultIsOpen", "defaultValue", "disabled", "disabledDateFilter", "icon", "id", "innerProps", "inputLabel", "inputLabelId", "isDisabled", "isInvalid", "isRequired", "label", "name", "onBlur", "onChange", "onFocus", "selectProps", "shouldShowCalendarButton", "spacing", "locale", "value", "isOpen", "maxDate", "minDate", "weekStartDay", "formatDisplayLabel", "testId", "aria-describedby", "calendarLabel", "placeholder", "nextMonthLabel", "previousMonthLabel"],
   _excluded2 = ["MenuPortal"],
   _excluded3 = ["menuRenderMode"];
 import "./date-picker.compiled.css";
@@ -40,7 +40,7 @@ import { MenuTopLayer } from '../internal/menu-top-layer';
 import { parseDate } from '../internal/parse-date';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.0.0";
+var packageVersion = "19.1.0";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",
@@ -132,6 +132,7 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
     formatDisplayLabel = props.formatDisplayLabel,
     testId = props.testId,
     ariaDescribedBy = props['aria-describedby'],
+    calendarLabel = props.calendarLabel,
     placeholder = props.placeholder,
     nextMonthLabel = props.nextMonthLabel,
     previousMonthLabel = props.previousMonthLabel,
@@ -524,6 +525,7 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
   } : {};
   var calendarProps = {
     calendarContainerRef: containerRef.current,
+    calendarLabel: calendarLabel,
     calendarDisabled: disabled,
     calendarDisabledDateFilter: disabledDateFilter,
     calendarMaxDate: maxDate,
@@ -534,7 +536,7 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
     onCalendarChange: onCalendarChange,
     onCalendarSelect: onCalendarSelect,
     calendarLocale: locale,
-    calendarWeekStartDay: weekStartDay !== null && weekStartDay !== void 0 ? weekStartDay : fg('platform-dst-locale-week-start-day') ? l10n.getFirstDayOfWeek() : undefined,
+    calendarWeekStartDay: weekStartDay !== null && weekStartDay !== void 0 ? weekStartDay : l10n.getFirstDayOfWeek(),
     shouldSetFocusOnCurrentDay: shouldSetFocusOnCurrentDay,
     /**
      * This overrides the inner wrapper the Calendar.
@@ -651,6 +653,7 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
     // These aren't part of `Select`'s API, but we're using them here.
     ,
     calendarContainerRef: calendarProps.calendarContainerRef,
+    calendarLabel: calendarProps.calendarLabel,
     calendarDisabled: calendarProps.calendarDisabled,
     calendarDisabledDateFilter: calendarProps.calendarDisabledDateFilter,
     calendarLocale: calendarProps.calendarLocale,

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

@@ -28,7 +28,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.0.0";
+var packageVersion = "19.1.0";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,
@@ -448,6 +448,7 @@ var DateTimePicker = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     appearance: appearance,
     "aria-describedby": datePickerAriaDescribedBy,
     autoFocus: datePickerProps.autoFocus || autoFocus,
+    calendarLabel: datePickerProps.calendarLabel,
     dateFormat: datePickerProps.dateFormat,
     defaultIsOpen: datePickerProps.defaultIsOpen,
     defaultValue: datePickerProps.defaultValue,

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

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

package/dist/esm/internal/menu-top-layer.js

@@ -55,6 +55,7 @@ export var MenuTopLayer = function MenuTopLayer(_ref) {
     role: "presentation",
     className: ax([styles.root])
   }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Calendar, {
+    label: selectProps.calendarLabel,
     day: day,
     month: month,
     year: year,

package/dist/esm/internal/menu.js

@@ -57,6 +57,7 @@ export var Menu = function Menu(_ref) {
       onMouseDown: onMenuMouseDown,
       className: ax(["_2rko1mok _1reo15vq _18m915vq _1pbyowjs _bfhk1bhr _16qs130s"])
     }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Calendar, {
+      label: selectProps.calendarLabel,
       day: day,
       month: month,
       year: year,

package/dist/types/types.d.ts

@@ -47,6 +47,12 @@ interface PickerSelectProps {
     selectProps?: DateTimePickerSelectProps;
 }
 export interface DatePickerBaseProps extends WithAnalyticsEventsProps, PickerSelectProps {
+    /**
+     * The aria-label attribute associated with the calendar.
+     *
+     * @default 'calendar'
+     */
+    calendarLabel?: string;
     /**
      * Set the appearance of the picker.
      * `subtle` will remove the borders, background, and icon.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/datetime-picker",
-	"version": "19.0.1",
+	"version": "19.2.0",
 	"description": "A date time picker allows the user to select an associated date and time.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -34,14 +34,14 @@
 		}
 	},
 	"dependencies": {
-		"@atlaskit/analytics-next": "^12.5.0",
+		"@atlaskit/analytics-next": "^12.6.0",
 		"@atlaskit/button": "^25.4.0",
-		"@atlaskit/calendar": "^19.3.0",
+		"@atlaskit/calendar": "^19.5.0",
 		"@atlaskit/css": "^1.1.0",
 		"@atlaskit/ds-lib": "^8.0.0",
 		"@atlaskit/icon": "^38.0.0",
 		"@atlaskit/layering": "^6.0.0",
-		"@atlaskit/locale": "^5.3.0",
+		"@atlaskit/locale": "^5.4.0",
 		"@atlaskit/platform-feature-flags": "^2.2.0",
 		"@atlaskit/popper": "^9.4.0",
 		"@atlaskit/primitives": "^22.5.0",
@@ -49,7 +49,7 @@
 		"@atlaskit/react-select": "^4.12.0",
 		"@atlaskit/select": "^23.1.0",
 		"@atlaskit/tokens": "^20.3.0",
-		"@atlaskit/top-layer": "^6.1.0",
+		"@atlaskit/top-layer": "^6.2.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
 		"date-fns": "^2.17.0"
@@ -94,9 +94,6 @@
 		"platform-dst-dp-current-reference-date": {
 			"type": "boolean"
 		},
-		"platform-dst-locale-week-start-day": {
-			"type": "boolean"
-		},
 		"platform-dst-motion-uplift-input": {
 			"type": "boolean",
 			"referenceOnly": true