@atlaskit/calendar 13.0.4 → 13.0.6

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/calendar
 
+## 13.0.6
+
+### Patch Changes
+
+- [`842bb999a85`](https://bitbucket.org/atlassian/atlassian-frontend/commits/842bb999a85) - Internal change only. Replace usages of Inline/Stack with stable version from `@atlaskit/primitives`.
+
+## 13.0.5
+
+### Patch Changes
+
+- [`1fc7949b336`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1fc7949b336) - [ux] Fixes a bug where the background for the calendar element was incorrectly set to 'elevation.surface'
+
 ## 13.0.4
 
 ### Patch Changes

package/dist/cjs/calendar.js

@@ -12,8 +12,8 @@ var _react = require("react");
 var _react2 = require("@emotion/react");
 var _usePlatformLeafEventHandler = require("@atlaskit/analytics-next/usePlatformLeafEventHandler");
 var _box = _interopRequireDefault(require("@atlaskit/ds-explorations/box"));
-var _stack = _interopRequireDefault(require("@atlaskit/ds-explorations/stack"));
 var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
+var _stack = _interopRequireDefault(require("@atlaskit/primitives/stack"));
 var _components = _interopRequireDefault(require("@atlaskit/theme/components"));
 var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
 var _header = _interopRequireDefault(require("./internal/components/header"));
@@ -33,7 +33,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "13.0.4"
+  packageVersion: "13.0.6"
 };
 var CalendarWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_ref, ref) {
   var day = _ref.day,
@@ -174,7 +174,6 @@ var CalendarWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_re
   return (0, _react2.jsx)(_box.default, {
     className: className,
     UNSAFE_style: style,
-    backgroundColor: "elevation.surface",
     onBlur: handleContainerBlur,
     onFocus: handleContainerFocus,
     onKeyDown: handleContainerKeyDown,
@@ -196,7 +195,7 @@ var CalendarWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_re
     role: "grid",
     tabIndex: tabIndex
   }, (0, _react2.jsx)(_stack.default, {
-    gap: "space.150"
+    space: "150"
   }, (0, _react2.jsx)(_header.default
   // The month number needs to be translated to index in the month
   // name array e.g. 1 (January) -> 0

package/dist/cjs/internal/components/date.js

@@ -62,26 +62,23 @@ var Date = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(fu
   var dateCellStyles = (0, _react.useMemo)(function () {
     return (0, _react2.css)((0, _date.dateCellStyles)(mode));
   }, [mode]);
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    (0, _react2.jsx)("button", {
-      // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
-      css: dateCellStyles,
-      "aria-selected": isSelected ? 'true' : 'false',
-      tabIndex: isSelected ? 0 : -1,
-      type: "button",
-      role: "gridcell",
-      onClick: handleClick,
-      ref: ref,
-      "data-disabled": isDisabled || undefined,
-      "data-focused": isFocused || undefined,
-      "data-prev-selected": isPreviouslySelected || undefined,
-      "data-selected": isSelected || undefined,
-      "data-sibling": isSibling || undefined,
-      "data-today": isToday || undefined,
-      "data-testid": testId && isSelected ? "".concat(testId, "--selected-day") : undefined
-    }, day)
-  );
+  return (0, _react2.jsx)("button", {
+    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+    css: dateCellStyles,
+    "aria-selected": isSelected ? 'true' : 'false',
+    tabIndex: isSelected ? 0 : -1,
+    type: "button",
+    role: "gridcell",
+    onClick: handleClick,
+    ref: ref,
+    "data-disabled": isDisabled || undefined,
+    "data-focused": isFocused || undefined,
+    "data-prev-selected": isPreviouslySelected || undefined,
+    "data-selected": isSelected || undefined,
+    "data-sibling": isSibling || undefined,
+    "data-today": isToday || undefined,
+    "data-testid": testId && isSelected ? "".concat(testId, "--selected-day") : undefined
+  }, day);
 }));
 Date.displayName = 'Date';
 

package/dist/cjs/internal/components/header.js

@@ -9,10 +9,10 @@ var _react = require("react");
 var _react2 = require("@emotion/react");
 var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
 var _box = _interopRequireDefault(require("@atlaskit/ds-explorations/box"));
-var _inline = _interopRequireDefault(require("@atlaskit/ds-explorations/inline"));
 var _heading = _interopRequireDefault(require("@atlaskit/heading"));
 var _chevronLeftLarge = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-left-large"));
 var _chevronRightLarge = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-right-large"));
+var _inline = _interopRequireDefault(require("@atlaskit/primitives/inline"));
 var _colors = require("@atlaskit/theme/colors");
 /** @jsx jsx */
 
@@ -31,9 +31,9 @@ var Header = /*#__PURE__*/(0, _react.memo)(function Header(_ref) {
     paddingInline: "space.100",
     "aria-hidden": "true"
   }, (0, _react2.jsx)(_inline.default, {
-    gap: "space.0",
-    alignItems: "center",
-    justifyContent: "space-between"
+    space: "0",
+    alignBlock: "center",
+    spread: "space-between"
   }, (0, _react2.jsx)(_standardButton.default, {
     appearance: "subtle",
     spacing: "none",

package/dist/cjs/internal/components/week-day-grid.js

@@ -20,13 +20,10 @@ var gridStyles = (0, _react.css)({
 var WeekDayGrid = function WeekDayGrid(_ref) {
   var testId = _ref.testId,
     children = _ref.children;
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    (0, _react.jsx)("div", {
-      "data-testid": testId,
-      css: gridStyles
-    }, children)
-  );
+  return (0, _react.jsx)("div", {
+    "data-testid": testId,
+    css: gridStyles
+  }, children);
 };
 var _default = WeekDayGrid;
 exports.default = _default;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/calendar",
-	"version": "13.0.4",
+	"version": "13.0.6",
 	"sideEffects": false
 }

package/dist/es2019/calendar.js

@@ -4,8 +4,8 @@ import { forwardRef, memo, useMemo } from 'react';
 import { jsx } from '@emotion/react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
 import Box from '@atlaskit/ds-explorations/box';
-import Stack from '@atlaskit/ds-explorations/stack';
 import noop from '@atlaskit/ds-lib/noop';
+import Stack from '@atlaskit/primitives/stack';
 import GlobalTheme from '@atlaskit/theme/components';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import Header from './internal/components/header';
@@ -23,7 +23,7 @@ import useUniqueId from './internal/hooks/use-unique-id';
 const analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "13.0.4"
+  packageVersion: "13.0.6"
 };
 const CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar({
   day,
@@ -146,7 +146,6 @@ const CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar({
   return jsx(Box, {
     className: className,
     UNSAFE_style: style,
-    backgroundColor: "elevation.surface",
     onBlur: handleContainerBlur,
     onFocus: handleContainerFocus,
     onKeyDown: handleContainerKeyDown,
@@ -168,7 +167,7 @@ const CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar({
     role: "grid",
     tabIndex: tabIndex
   }, jsx(Stack, {
-    gap: "space.150"
+    space: "150"
   }, jsx(Header
   // The month number needs to be translated to index in the month
   // name array e.g. 1 (January) -> 0

package/dist/es2019/internal/components/date.js

@@ -47,26 +47,23 @@ const Date = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Date({
     }
   }, [onClick]);
   const dateCellStyles = useMemo(() => css(getDateCellStyles(mode)), [mode]);
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    jsx("button", {
-      // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
-      css: dateCellStyles,
-      "aria-selected": isSelected ? 'true' : 'false',
-      tabIndex: isSelected ? 0 : -1,
-      type: "button",
-      role: "gridcell",
-      onClick: handleClick,
-      ref: ref,
-      "data-disabled": isDisabled || undefined,
-      "data-focused": isFocused || undefined,
-      "data-prev-selected": isPreviouslySelected || undefined,
-      "data-selected": isSelected || undefined,
-      "data-sibling": isSibling || undefined,
-      "data-today": isToday || undefined,
-      "data-testid": testId && isSelected ? `${testId}--selected-day` : undefined
-    }, day)
-  );
+  return jsx("button", {
+    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+    css: dateCellStyles,
+    "aria-selected": isSelected ? 'true' : 'false',
+    tabIndex: isSelected ? 0 : -1,
+    type: "button",
+    role: "gridcell",
+    onClick: handleClick,
+    ref: ref,
+    "data-disabled": isDisabled || undefined,
+    "data-focused": isFocused || undefined,
+    "data-prev-selected": isPreviouslySelected || undefined,
+    "data-selected": isSelected || undefined,
+    "data-sibling": isSibling || undefined,
+    "data-today": isToday || undefined,
+    "data-testid": testId && isSelected ? `${testId}--selected-day` : undefined
+  }, day);
 }));
 Date.displayName = 'Date';
 

package/dist/es2019/internal/components/header.js

@@ -3,10 +3,10 @@ import { memo } from 'react';
 import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button/standard-button';
 import Box from '@atlaskit/ds-explorations/box';
-import Inline from '@atlaskit/ds-explorations/inline';
 import Heading from '@atlaskit/heading';
 import ArrowleftIcon from '@atlaskit/icon/glyph/chevron-left-large';
 import ArrowrightIcon from '@atlaskit/icon/glyph/chevron-right-large';
+import Inline from '@atlaskit/primitives/inline';
 import { N70 } from '@atlaskit/theme/colors';
 const Header = /*#__PURE__*/memo(function Header({
   monthLongTitle,
@@ -22,9 +22,9 @@ const Header = /*#__PURE__*/memo(function Header({
     paddingInline: "space.100",
     "aria-hidden": "true"
   }, jsx(Inline, {
-    gap: "space.0",
-    alignItems: "center",
-    justifyContent: "space-between"
+    space: "0",
+    alignBlock: "center",
+    spread: "space-between"
   }, jsx(Button, {
     appearance: "subtle",
     spacing: "none",

package/dist/es2019/internal/components/week-day-grid.js

@@ -14,9 +14,7 @@ const gridStyles = css({
 const WeekDayGrid = ({
   testId,
   children
-}) =>
-// eslint-disable-next-line @repo/internal/react/use-primitives
-jsx("div", {
+}) => jsx("div", {
   "data-testid": testId,
   css: gridStyles
 }, children);

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/calendar",
-	"version": "13.0.4",
+	"version": "13.0.6",
 	"sideEffects": false
 }

package/dist/esm/calendar.js

@@ -8,8 +8,8 @@ import { forwardRef, memo, useMemo } from 'react';
 import { jsx } from '@emotion/react';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatformLeafEventHandler';
 import Box from '@atlaskit/ds-explorations/box';
-import Stack from '@atlaskit/ds-explorations/stack';
 import noop from '@atlaskit/ds-lib/noop';
+import Stack from '@atlaskit/primitives/stack';
 import GlobalTheme from '@atlaskit/theme/components';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import Header from './internal/components/header';
@@ -27,7 +27,7 @@ import useUniqueId from './internal/hooks/use-unique-id';
 var analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "13.0.4"
+  packageVersion: "13.0.6"
 };
 var CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
   var day = _ref.day,
@@ -168,7 +168,6 @@ var CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
   return jsx(Box, {
     className: className,
     UNSAFE_style: style,
-    backgroundColor: "elevation.surface",
     onBlur: handleContainerBlur,
     onFocus: handleContainerFocus,
     onKeyDown: handleContainerKeyDown,
@@ -190,7 +189,7 @@ var CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
     role: "grid",
     tabIndex: tabIndex
   }, jsx(Stack, {
-    gap: "space.150"
+    space: "150"
   }, jsx(Header
   // The month number needs to be translated to index in the month
   // name array e.g. 1 (January) -> 0

package/dist/esm/internal/components/date.js

@@ -54,26 +54,23 @@ var Date = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function Date(_ref, ref) {
   var dateCellStyles = useMemo(function () {
     return css(getDateCellStyles(mode));
   }, [mode]);
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    jsx("button", {
-      // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
-      css: dateCellStyles,
-      "aria-selected": isSelected ? 'true' : 'false',
-      tabIndex: isSelected ? 0 : -1,
-      type: "button",
-      role: "gridcell",
-      onClick: handleClick,
-      ref: ref,
-      "data-disabled": isDisabled || undefined,
-      "data-focused": isFocused || undefined,
-      "data-prev-selected": isPreviouslySelected || undefined,
-      "data-selected": isSelected || undefined,
-      "data-sibling": isSibling || undefined,
-      "data-today": isToday || undefined,
-      "data-testid": testId && isSelected ? "".concat(testId, "--selected-day") : undefined
-    }, day)
-  );
+  return jsx("button", {
+    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+    css: dateCellStyles,
+    "aria-selected": isSelected ? 'true' : 'false',
+    tabIndex: isSelected ? 0 : -1,
+    type: "button",
+    role: "gridcell",
+    onClick: handleClick,
+    ref: ref,
+    "data-disabled": isDisabled || undefined,
+    "data-focused": isFocused || undefined,
+    "data-prev-selected": isPreviouslySelected || undefined,
+    "data-selected": isSelected || undefined,
+    "data-sibling": isSibling || undefined,
+    "data-today": isToday || undefined,
+    "data-testid": testId && isSelected ? "".concat(testId, "--selected-day") : undefined
+  }, day);
 }));
 Date.displayName = 'Date';
 

package/dist/esm/internal/components/header.js

@@ -3,10 +3,10 @@ import { memo } from 'react';
 import { jsx } from '@emotion/react';
 import Button from '@atlaskit/button/standard-button';
 import Box from '@atlaskit/ds-explorations/box';
-import Inline from '@atlaskit/ds-explorations/inline';
 import Heading from '@atlaskit/heading';
 import ArrowleftIcon from '@atlaskit/icon/glyph/chevron-left-large';
 import ArrowrightIcon from '@atlaskit/icon/glyph/chevron-right-large';
+import Inline from '@atlaskit/primitives/inline';
 import { N70 } from '@atlaskit/theme/colors';
 var Header = /*#__PURE__*/memo(function Header(_ref) {
   var monthLongTitle = _ref.monthLongTitle,
@@ -23,9 +23,9 @@ var Header = /*#__PURE__*/memo(function Header(_ref) {
     paddingInline: "space.100",
     "aria-hidden": "true"
   }, jsx(Inline, {
-    gap: "space.0",
-    alignItems: "center",
-    justifyContent: "space-between"
+    space: "0",
+    alignBlock: "center",
+    spread: "space-between"
   }, jsx(Button, {
     appearance: "subtle",
     spacing: "none",

package/dist/esm/internal/components/week-day-grid.js

@@ -14,12 +14,9 @@ var gridStyles = css({
 var WeekDayGrid = function WeekDayGrid(_ref) {
   var testId = _ref.testId,
     children = _ref.children;
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    jsx("div", {
-      "data-testid": testId,
-      css: gridStyles
-    }, children)
-  );
+  return jsx("div", {
+    "data-testid": testId,
+    css: gridStyles
+  }, children);
 };
 export default WeekDayGrid;

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/calendar",
-	"version": "13.0.4",
+	"version": "13.0.6",
 	"sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/calendar",
-  "version": "13.0.4",
+  "version": "13.0.6",
   "description": "An interactive calendar for date selection experiences.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -15,7 +15,6 @@
   "sideEffects": false,
   "atlaskit:src": "src/index.tsx",
   "atlassian": {
-    "disableProductCI": true,
     "team": "Design System Team",
     "releaseModel": "scheduled",
     "website": {
@@ -31,6 +30,7 @@
     "@atlaskit/heading": "^1.0.2",
     "@atlaskit/icon": "^21.11.0",
     "@atlaskit/locale": "^2.3.0",
+    "@atlaskit/primitives": "^0.3.0",
     "@atlaskit/theme": "^12.2.0",
     "@atlaskit/tokens": "^1.2.0",
     "@atlaskit/visually-hidden": "^1.1.0",