@atlaskit/calendar 13.0.0 → 13.0.2

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/calendar
 
+## 13.0.2
+
+### Patch Changes
+
+- [`eadbf13d8c0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/eadbf13d8c0) - Updated usages of `Text`, `Box`, `Stack`, and `Inline` primitives to reflect their updated APIs. There are no visual or behaviour changes.
+- Updated dependencies
+
+## 13.0.1
+
+### Patch Changes
+
+- [`b0f6dd0bc35`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b0f6dd0bc35) - Updated to use typography tokens. There is no expected behaviour or visual change.
+
 ## 13.0.0
 
 ### Major Changes

package/dist/cjs/calendar.js

@@ -60,7 +60,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "13.0.0"
+  packageVersion: "13.0.2"
 };
 var CalendarWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_ref, ref) {
   var day = _ref.day,
@@ -223,7 +223,7 @@ var CalendarWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_re
     "aria-relevant": "text"
   }, announcerDate)), (0, _react2.jsx)(_box.default, {
     display: "inlineBlock",
-    padding: "scale.200",
+    padding: "space.200",
     UNSAFE_style: {
       userSelect: 'none'
     },
@@ -232,7 +232,7 @@ var CalendarWithMode = /*#__PURE__*/(0, _react.forwardRef)(function Calendar(_re
     role: "grid",
     tabIndex: tabIndex
   }, (0, _react2.jsx)(_stack.default, {
-    gap: "scale.150"
+    gap: "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/header.js

@@ -38,10 +38,10 @@ var Header = /*#__PURE__*/(0, _react.memo)(function Header(_ref) {
       testId = _ref.testId;
   return (0, _react2.jsx)(_box.default, {
     display: "block",
-    paddingInline: "scale.100",
+    paddingInline: "space.100",
     "aria-hidden": "true"
   }, (0, _react2.jsx)(_inline.default, {
-    gap: "scale.0",
+    gap: "space.0",
     alignItems: "center",
     justifyContent: "space-between"
   }, (0, _react2.jsx)(_standardButton.default, {

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

@@ -24,7 +24,7 @@ var WeekHeader = /*#__PURE__*/(0, _react.memo)(function WeekHeader(_ref) {
   var daysShort = _ref.daysShort;
   return (0, _react2.jsx)(_weekDayGrid.default, null, daysShort.map(function (shortDay) {
     return (0, _react2.jsx)(_box.default, {
-      padding: "scale.100",
+      padding: "space.100",
       display: "block",
       UNSAFE_style: {
         minWidth: 40,
@@ -38,8 +38,8 @@ var WeekHeader = /*#__PURE__*/(0, _react.memo)(function WeekHeader(_ref) {
       },
       key: shortDay
     }, (0, _react2.jsx)(_text.default, {
-      fontWeight: "700",
-      fontSize: "11px",
+      fontWeight: "bold",
+      fontSize: "size.050",
       verticalAlign: "middle",
       textTransform: "uppercase"
     }, shortDay));

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

@@ -45,14 +45,14 @@ var dateCellStyles = function dateCellStyles() {
     borderRadius: 3,
     color: textColor[mode],
     cursor: 'pointer',
-    fontSize: 14,
+    fontSize: "var(--ds-font-size-100, 14px)",
     textAlign: 'center',
     '&[data-sibling]': {
       color: "var(--ds-text-subtlest, ".concat(_colors.N200, ")")
     },
     '&[data-today]': {
       color: todayColor[mode],
-      fontWeight: 'bold',
+      fontWeight: "var(--ds-font-weight-bold, bold)",
       '&::after': {
         display: 'block',
         height: 2,

package/dist/cjs/version.json

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

package/dist/es2019/calendar.js

@@ -24,7 +24,7 @@ import useUniqueId from './internal/hooks/use-unique-id';
 const analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "13.0.0"
+  packageVersion: "13.0.2"
 };
 const CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar({
   day,
@@ -160,7 +160,7 @@ const CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar({
     "aria-relevant": "text"
   }, announcerDate)), jsx(Box, {
     display: "inlineBlock",
-    padding: "scale.200",
+    padding: "space.200",
     UNSAFE_style: {
       userSelect: 'none'
     },
@@ -169,7 +169,7 @@ const CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar({
     role: "grid",
     tabIndex: tabIndex
   }, jsx(Stack, {
-    gap: "scale.150"
+    gap: "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/header.js

@@ -19,10 +19,10 @@ const Header = /*#__PURE__*/memo(function Header({
 }) {
   return jsx(Box, {
     display: "block",
-    paddingInline: "scale.100",
+    paddingInline: "space.100",
     "aria-hidden": "true"
   }, jsx(Inline, {
-    gap: "scale.0",
+    gap: "space.0",
     alignItems: "center",
     justifyContent: "space-between"
   }, jsx(Button, {

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

@@ -9,7 +9,7 @@ const WeekHeader = /*#__PURE__*/memo(function WeekHeader({
   daysShort
 }) {
   return jsx(WeekDayGrid, null, daysShort.map(shortDay => jsx(Box, {
-    padding: "scale.100",
+    padding: "space.100",
     display: "block",
     UNSAFE_style: {
       minWidth: 40,
@@ -23,8 +23,8 @@ const WeekHeader = /*#__PURE__*/memo(function WeekHeader({
     },
     key: shortDay
   }, jsx(Text, {
-    fontWeight: "700",
-    fontSize: "11px",
+    fontWeight: "bold",
+    fontSize: "size.050",
     verticalAlign: "middle",
     textTransform: "uppercase"
   }, shortDay))));

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

@@ -34,14 +34,14 @@ export const dateCellStyles = (mode = 'light') => ({
   borderRadius: 3,
   color: textColor[mode],
   cursor: 'pointer',
-  fontSize: 14,
+  fontSize: "var(--ds-font-size-100, 14px)",
   textAlign: 'center',
   '&[data-sibling]': {
     color: `var(--ds-text-subtlest, ${N200})`
   },
   '&[data-today]': {
     color: todayColor[mode],
-    fontWeight: 'bold',
+    fontWeight: "var(--ds-font-weight-bold, bold)",
     '&::after': {
       display: 'block',
       height: 2,

package/dist/es2019/version.json

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

package/dist/esm/calendar.js

@@ -30,7 +30,7 @@ import useUniqueId from './internal/hooks/use-unique-id';
 var analyticsAttributes = {
   componentName: 'calendar',
   packageName: "@atlaskit/calendar",
-  packageVersion: "13.0.0"
+  packageVersion: "13.0.2"
 };
 var CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
   var day = _ref.day,
@@ -193,7 +193,7 @@ var CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
     "aria-relevant": "text"
   }, announcerDate)), jsx(Box, {
     display: "inlineBlock",
-    padding: "scale.200",
+    padding: "space.200",
     UNSAFE_style: {
       userSelect: 'none'
     },
@@ -202,7 +202,7 @@ var CalendarWithMode = /*#__PURE__*/forwardRef(function Calendar(_ref, ref) {
     role: "grid",
     tabIndex: tabIndex
   }, jsx(Stack, {
-    gap: "scale.150"
+    gap: "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/header.js

@@ -20,10 +20,10 @@ var Header = /*#__PURE__*/memo(function Header(_ref) {
       testId = _ref.testId;
   return jsx(Box, {
     display: "block",
-    paddingInline: "scale.100",
+    paddingInline: "space.100",
     "aria-hidden": "true"
   }, jsx(Inline, {
-    gap: "scale.0",
+    gap: "space.0",
     alignItems: "center",
     justifyContent: "space-between"
   }, jsx(Button, {

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

@@ -9,7 +9,7 @@ var WeekHeader = /*#__PURE__*/memo(function WeekHeader(_ref) {
   var daysShort = _ref.daysShort;
   return jsx(WeekDayGrid, null, daysShort.map(function (shortDay) {
     return jsx(Box, {
-      padding: "scale.100",
+      padding: "space.100",
       display: "block",
       UNSAFE_style: {
         minWidth: 40,
@@ -23,8 +23,8 @@ var WeekHeader = /*#__PURE__*/memo(function WeekHeader(_ref) {
       },
       key: shortDay
     }, jsx(Text, {
-      fontWeight: "700",
-      fontSize: "11px",
+      fontWeight: "bold",
+      fontSize: "size.050",
       verticalAlign: "middle",
       textTransform: "uppercase"
     }, shortDay));

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

@@ -36,14 +36,14 @@ export var dateCellStyles = function dateCellStyles() {
     borderRadius: 3,
     color: textColor[mode],
     cursor: 'pointer',
-    fontSize: 14,
+    fontSize: "var(--ds-font-size-100, 14px)",
     textAlign: 'center',
     '&[data-sibling]': {
       color: "var(--ds-text-subtlest, ".concat(N200, ")")
     },
     '&[data-today]': {
       color: todayColor[mode],
-      fontWeight: 'bold',
+      fontWeight: "var(--ds-font-weight-bold, bold)",
       '&::after': {
         display: 'block',
         height: 2,

package/dist/esm/version.json

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/calendar",
-  "version": "13.0.0",
+  "version": "13.0.2",
   "description": "An interactive calendar for date selection experiences.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -26,7 +26,7 @@
   "dependencies": {
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/button": "^16.5.0",
-    "@atlaskit/ds-explorations": "^1.7.0",
+    "@atlaskit/ds-explorations": "^2.0.0",
     "@atlaskit/ds-lib": "^2.1.0",
     "@atlaskit/heading": "^1.0.2",
     "@atlaskit/icon": "^21.11.0",