@atlaskit/mobile-header 6.1.3 → 6.1.5

package/CHANGELOG.md

@@ -1,28 +1,40 @@
 # @atlaskit/mobile-header
 
+## 6.1.5
+
+### Patch Changes
+
+- Updated dependencies
+
+## 6.1.4
+
+### Patch Changes
+
+- [#39787](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/39787) [`6900f89eb0e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6900f89eb0e) - Internal changes to use space tokens. There is no expected visual or behaviour change.
+
 ## 6.1.3
 
 ### Patch Changes
 
-- [`fd6bb9c9184`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fd6bb9c9184) - Delete version.json
+- [#38162](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/38162) [`fd6bb9c9184`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fd6bb9c9184) - Delete version.json
 
 ## 6.1.2
 
 ### Patch Changes
 
-- [`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure legacy types are published for TS 4.5-4.8
+- [#33793](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33793) [`9d00501a414`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9d00501a414) - Ensure legacy types are published for TS 4.5-4.8
 
 ## 6.1.1
 
 ### Patch Changes
 
-- [`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) - Upgrade Typescript from `4.5.5` to `4.9.5`
+- [#33649](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33649) [`41fae2c6f68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/41fae2c6f68) - Upgrade Typescript from `4.5.5` to `4.9.5`
 
 ## 6.1.0
 
 ### Minor Changes
 
-- [`56507598609`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56507598609) - Skip minor dependency bump
+- [#33258](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/33258) [`56507598609`](https://bitbucket.org/atlassian/atlassian-frontend/commits/56507598609) - Skip minor dependency bump
 
 ### Patch Changes
 
@@ -32,38 +44,38 @@
 
 ### Patch Changes
 
-- [`005b25fd40d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/005b25fd40d) - Moved `@emotion/styled` to dependency to ensure correct version (v11) is resolved.
+- [#28238](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/28238) [`005b25fd40d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/005b25fd40d) - Moved `@emotion/styled` to dependency to ensure correct version (v11) is resolved.
 
 ## 6.0.0
 
 ### Major Changes
 
-- [`16f5b6bdaee`](https://bitbucket.org/atlassian/atlassian-frontend/commits/16f5b6bdaee) - Peer Dependencies have changed due to the migration from styled-components to @emotion v11.
+- [#27334](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/27334) [`16f5b6bdaee`](https://bitbucket.org/atlassian/atlassian-frontend/commits/16f5b6bdaee) - Peer Dependencies have changed due to the migration from styled-components to @emotion v11.
 
 ## 5.0.12
 
 ### Patch Changes
 
-- [`522a27e6119`](https://bitbucket.org/atlassian/atlassian-frontend/commits/522a27e6119) - Remove `isOpen` prop from @atlaskit/banner, it is now open by default.
+- [#24710](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24710) [`522a27e6119`](https://bitbucket.org/atlassian/atlassian-frontend/commits/522a27e6119) - Remove `isOpen` prop from @atlaskit/banner, it is now open by default.
 - Updated dependencies
 
 ## 5.0.11
 
 ### Patch Changes
 
-- [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
+- [#24874](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24874) [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
 
 ## 5.0.10
 
 ### Patch Changes
 
-- [`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade Typescript from `4.2.4` to `4.3.5`.
+- [#24492](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/24492) [`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade Typescript from `4.2.4` to `4.3.5`.
 
 ## 5.0.9
 
 ### Patch Changes
 
-- [`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) - Upgrade to TypeScript 4.2.4
+- [#20650](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/20650) [`cb2392f6d33`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cb2392f6d33) - Upgrade to TypeScript 4.2.4
 - Updated dependencies
 
 ## 5.0.8
@@ -76,7 +88,7 @@
 
 ### Patch Changes
 
-- [`524b20aff9a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/524b20aff9a) - Update package.jsons to remove unused dependencies. Also excludes tests from some build tsconfigs
+- [#13136](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/13136) [`524b20aff9a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/524b20aff9a) - Update package.jsons to remove unused dependencies. Also excludes tests from some build tsconfigs
 - [`3c0349f272a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3c0349f272a) - Update package.jsons to remove unused dependencies. Also excludes tests from some build tsconfigs
 - [`591d34f966f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/591d34f966f) - Update package.jsons to remove unused dependencies. Also excludes tests from some build tsconfigs
 
@@ -90,13 +102,13 @@
 
 ### Patch Changes
 
-- [`d3265f19be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3265f19be) - Transpile packages using babel rather than tsc
+- [#5857](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5857) [`d3265f19be`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d3265f19be) - Transpile packages using babel rather than tsc
 
 ## 5.0.4
 
 ### Patch Changes
 
-- [`5f58283e1f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f58283e1f) - Export types using Typescript's new "export type" syntax to satisfy Typescript's --isolatedModules compiler option.
+- [#5497](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/5497) [`5f58283e1f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/5f58283e1f) - Export types using Typescript's new "export type" syntax to satisfy Typescript's --isolatedModules compiler option.
   This requires version 3.8 of Typescript, read more about how we handle Typescript versions here: https://atlaskit.atlassian.com/get-started
   Also add `typescript` to `devDependencies` to denote version that the package was built with.
 
@@ -116,7 +128,7 @@
 
 ### Patch Changes
 
-- [`6c525a8229`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6c525a8229) - Upgraded to TypeScript 3.9.6 and tslib to 2.0.0
+- [#3885](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3885) [`6c525a8229`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6c525a8229) - Upgraded to TypeScript 3.9.6 and tslib to 2.0.0
 
   Since tslib is a dependency for all our packages we recommend that products also follow this tslib upgrade
   to prevent duplicates of tslib being bundled.
@@ -125,7 +137,7 @@
 
 ### Major Changes
 
-- [`87f4720f27`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87f4720f27) - Officially dropping IE11 support, from this version onwards there are no warranties of the package working in IE11.
+- [#3335](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/3335) [`87f4720f27`](https://bitbucket.org/atlassian/atlassian-frontend/commits/87f4720f27) - Officially dropping IE11 support, from this version onwards there are no warranties of the package working in IE11.
   For more information see: https://community.developer.atlassian.com/t/atlaskit-to-drop-support-for-internet-explorer-11-from-1st-july-2020/39534
 
 ### Patch Changes

package/dist/cjs/components/MobileHeader.js

@@ -107,5 +107,4 @@ var MobileHeader = /*#__PURE__*/function (_PureComponent) {
   menuIconLabel: 'Menu',
   drawerState: ''
 });
-var _default = MobileHeader;
-exports.default = _default;
+var _default = exports.default = MobileHeader;

package/dist/cjs/styled.js

@@ -11,8 +11,6 @@ var _styled = _interopRequireDefault(require("@emotion/styled"));
 var _theme = require("@atlaskit/theme");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9; // AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
-var gridSize = (0, _theme.gridSize)();
-
 // @atlaskit/navigation has a specific z-index, so we need to layer the header
 // components relative to that.
 var navLayer = _theme.layers.navigation();
@@ -27,7 +25,7 @@ var xPositioning = function xPositioning(_ref) {
     isOpen = _ref.isOpen;
   return side === 'right' ? (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n        right: 0;\n        transform: translateX(", ");\n      "])), isOpen ? '0' : '100vw') : (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n        left: 0;\n        transform: translateX(", ");\n      "])), isOpen ? '0' : '-100vw');
 };
-var MobileNavSlider = _styled.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: ", ";\n  position: fixed;\n  top: ", "px;\n  transition: transform 0.2s ease-out;\n  z-index: ", ";\n  ", ";\n"])), function (props) {
+var MobileNavSlider = exports.MobileNavSlider = _styled.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  height: ", ";\n  position: fixed;\n  top: ", "px;\n  transition: transform 0.2s ease-out;\n  z-index: ", ";\n  ", ";\n"])), function (props) {
   return "calc(100vh - ".concat(props.topOffset, "px)");
 }, function (props) {
   return props.topOffset;
@@ -35,26 +33,21 @@ var MobileNavSlider = _styled.default.div(_templateObject3 || (_templateObject3
 
 // make space so content below doesn't slip beneath the header
 // since the content is `position: fixed`
-exports.MobileNavSlider = MobileNavSlider;
-var MobilePageHeader = _styled.default.header(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  height: ", "px;\n"])), mobileHeaderHeight);
-exports.MobilePageHeader = MobilePageHeader;
-var MobilePageHeaderContent = _styled.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", "px;\n  padding: ", "px;\n  position: fixed;\n  top: ", "px;\n  width: 100%;\n  z-index: ", ";\n"])), (0, _theme.themed)({
+var MobilePageHeader = exports.MobilePageHeader = _styled.default.header(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  height: ", "px;\n"])), mobileHeaderHeight);
+var MobilePageHeaderContent = exports.MobilePageHeaderContent = _styled.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  align-items: center;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", "px;\n  padding: ", ";\n  position: fixed;\n  top: ", "px;\n  width: 100%;\n  z-index: ", ";\n"])), (0, _theme.themed)({
   light: _theme.colors.N20,
   dark: _theme.colors.DN10
-}), mobileHeaderHeight, gridSize, function (props) {
+}), mobileHeaderHeight, "var(--ds-space-100, 8px)", function (props) {
   return props.topOffset;
 }, layers.header);
-exports.MobilePageHeaderContent = MobilePageHeaderContent;
 var opacityIn = (0, _react.keyframes)(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  from { opacity: 0; }\n  to { opacity: 1; }\n"])));
 var opacityOut = (0, _react.keyframes)(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  from { opacity: 1; }\n  to { opacity: 0; }\n"])));
 
 // @atlaskit/blanket has a z-index *higher* than @atlaskit/navigation,
 // so we can't display the AK blanket underneath the navigation.
-var FakeBlanket = _styled.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  bottom: 0;\n  left: 0;\n  position: fixed;\n  right: 0;\n  top: 0;\n  z-index: ", ";\n  animation: ", " 0.2s ease-out;\n"])), _theme.colors.N100A, layers.blanket, function (p) {
+var FakeBlanket = exports.FakeBlanket = _styled.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n  background: ", ";\n  bottom: 0;\n  left: 0;\n  position: fixed;\n  right: 0;\n  top: 0;\n  z-index: ", ";\n  animation: ", " 0.2s ease-out;\n"])), _theme.colors.N100A, layers.blanket, function (p) {
   return p.isOpen ? opacityIn : opacityOut;
 });
 
 // use proper h1 and header styles but for mobile we don't want a top margin
-exports.FakeBlanket = FakeBlanket;
-var PageHeading = _styled.default.h1(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  flex-grow: 1;\n  margin-left: ", "px;\n  ", ";\n  && {\n    margin-top: 0;\n  }\n"])), gridSize, _theme.typography.h500);
-exports.PageHeading = PageHeading;
+var PageHeading = exports.PageHeading = _styled.default.h1(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n  flex-grow: 1;\n  margin-left: ", ";\n  ", ";\n  && {\n    margin-top: 0;\n  }\n"])), "var(--ds-space-100, 8px)", _theme.typography.h500);

package/dist/es2019/styled.js

@@ -3,9 +3,7 @@ import styled from '@emotion/styled';
 
 // AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
-import { gridSize as akGridSize, layers as akLayers, colors, themed, typography } from '@atlaskit/theme';
-const gridSize = akGridSize();
-
+import { layers as akLayers, colors, themed, typography } from '@atlaskit/theme';
 // @atlaskit/navigation has a specific z-index, so we need to layer the header
 // components relative to that.
 const navLayer = akLayers.navigation();
@@ -48,7 +46,7 @@ export const MobilePageHeaderContent = styled.div`
   box-sizing: border-box;
   display: flex;
   height: ${mobileHeaderHeight}px;
-  padding: ${gridSize}px;
+  padding: ${"var(--ds-space-100, 8px)"};
   position: fixed;
   top: ${props => props.topOffset}px;
   width: 100%;
@@ -79,7 +77,7 @@ export const FakeBlanket = styled.div`
 // use proper h1 and header styles but for mobile we don't want a top margin
 export const PageHeading = styled.h1`
   flex-grow: 1;
-  margin-left: ${gridSize}px;
+  margin-left: ${"var(--ds-space-100, 8px)"};
   ${typography.h500};
   && {
     margin-top: 0;

package/dist/esm/styled.js

@@ -5,9 +5,7 @@ import styled from '@emotion/styled';
 
 // AFP-2532 TODO: Fix automatic suppressions below
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
-import { gridSize as akGridSize, layers as akLayers, colors, themed, typography } from '@atlaskit/theme';
-var gridSize = akGridSize();
-
+import { layers as akLayers, colors, themed, typography } from '@atlaskit/theme';
 // @atlaskit/navigation has a specific z-index, so we need to layer the header
 // components relative to that.
 var navLayer = akLayers.navigation();
@@ -31,10 +29,10 @@ export var MobileNavSlider = styled.div(_templateObject3 || (_templateObject3 =
 // make space so content below doesn't slip beneath the header
 // since the content is `position: fixed`
 export var MobilePageHeader = styled.header(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  height: ", "px;\n"])), mobileHeaderHeight);
-export var MobilePageHeaderContent = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", "px;\n  padding: ", "px;\n  position: fixed;\n  top: ", "px;\n  width: 100%;\n  z-index: ", ";\n"])), themed({
+export var MobilePageHeaderContent = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  align-items: center;\n  background-color: ", ";\n  box-sizing: border-box;\n  display: flex;\n  height: ", "px;\n  padding: ", ";\n  position: fixed;\n  top: ", "px;\n  width: 100%;\n  z-index: ", ";\n"])), themed({
   light: colors.N20,
   dark: colors.DN10
-}), mobileHeaderHeight, gridSize, function (props) {
+}), mobileHeaderHeight, "var(--ds-space-100, 8px)", function (props) {
   return props.topOffset;
 }, layers.header);
 var opacityIn = keyframes(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  from { opacity: 0; }\n  to { opacity: 1; }\n"])));
@@ -47,4 +45,4 @@ export var FakeBlanket = styled.div(_templateObject8 || (_templateObject8 = _tag
 });
 
 // use proper h1 and header styles but for mobile we don't want a top margin
-export var PageHeading = styled.h1(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  flex-grow: 1;\n  margin-left: ", "px;\n  ", ";\n  && {\n    margin-top: 0;\n  }\n"])), gridSize, typography.h500);
+export var PageHeading = styled.h1(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n  flex-grow: 1;\n  margin-left: ", ";\n  ", ";\n  && {\n    margin-top: 0;\n  }\n"])), "var(--ds-space-100, 8px)", typography.h500);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/mobile-header",
-  "version": "6.1.3",
+  "version": "6.1.5",
   "description": "A React component rendering a mobile header",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -30,9 +30,10 @@
     }
   },
   "dependencies": {
-    "@atlaskit/button": "^16.9.0",
-    "@atlaskit/icon": "^21.12.0",
-    "@atlaskit/theme": "^12.5.0",
+    "@atlaskit/button": "^16.16.0",
+    "@atlaskit/icon": "^22.0.0",
+    "@atlaskit/theme": "^12.6.0",
+    "@atlaskit/tokens": "^1.28.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/styled": "^11.0.0"
   },