@atlaskit/side-navigation 1.5.3 → 1.6.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/side-navigation
 
+## 1.6.1
+
+### Patch Changes
+
+- [`3ca97be0c06`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3ca97be0c06) - Internal change only. Replace usages of Inline/Stack with stable version from `@atlaskit/primitives`.
+- Updated dependencies
+
+## 1.6.0
+
+### Minor Changes
+
+- [`62c9d42799c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/62c9d42799c) - [ux] The `Footer` component will now warn a user if they are relying on a deprecated API. The `cssFn`, `onClick` and `component` are all considered deprecated APIs for `Footer`.
+
+  Additionally, the space between icons and content has been shifted form `16px` to `12px`. This matches `@atlaskit/menu`.
+
+  These APIs will be removed from Footer in a future major release. To suppress the warning you can choose to use the `useDeprecatedApi={false}` prop which opts into the new API.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.5.3
 
 ### Patch Changes

package/constellation/index/props.mdx

@@ -1,6 +1,6 @@
 import SideNavigationProps from '!!extract-react-types-loader!../../src/components/SideNavigation'
 import HeaderProps from '!!extract-react-types-loader!../../src/components/Header'
-import FooterProps from '!!extract-react-types-loader!../../src/components/Footer'
+import FooterProps from '!!extract-react-types-loader!../../docs/ert/footer'
 import NavigationContentProps from '!!extract-react-types-loader!../../src/components/NavigationContent'
 import NestableNavigationContentProps from '!!extract-react-types-loader!../../src/components/NestableNavigationContent'
 import SectionProps from '!!extract-react-types-loader!../../src/components/Section'

package/dist/cjs/common/styles.js

@@ -59,23 +59,16 @@ var baseSideNavItemStyle = function baseSideNavItemStyle(_ref) {
   return _objectSpread(_objectSpread(_objectSpread({
     // This padding is set to ensure that the center of the left icon
     // is approximately center aligned with the horizontal app switcher.
-    padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-100, 10px)"),
+    paddingBlock: "var(--ds-space-100, 8px)",
+    paddingInline: "var(--ds-space-100, 10px)",
     borderRadius: borderRadius,
     // -- TODO: DELETE THESE COLOR OVERRIDES WHEN CLEANING UP FALLBACK THEMING --
     // Menu and side navigation are now color aligned so they do not need this!
     // See: https://product-fabric.atlassian.net/browse/DSP-1684
     backgroundColor: "var(--ds-background-neutral-subtle, transparent)"
   }, !isDisabled && !isSelected && defaultStyles), !isDisabled && isSelected && selectedStyles), {}, (0, _defineProperty2.default)({}, '& [data-item-elem-before]', {
-    // TODO: Can this be moved into menu?
-    // center align icons with app-switcher regardless of size
-    display: 'flex',
     height: "var(--ds-space-300, 24px)",
-    width: "var(--ds-space-300, 24px)",
-    alignItems: 'center',
-    justifyContent: 'center',
-    // this margin could be removed if the respective item had a more
-    // compositional API so an Inline could be used to separate elements instead
-    marginRight: "var(--ds-space-200, 16px)"
+    width: "var(--ds-space-300, 24px)"
   }));
 };
 exports.baseSideNavItemStyle = baseSideNavItemStyle;

package/dist/cjs/components/Footer/index.js

@@ -7,17 +7,23 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireDefault(require("react"));
+var _box = _interopRequireDefault(require("@atlaskit/ds-explorations/box"));
+var _text = _interopRequireDefault(require("@atlaskit/ds-explorations/text"));
+var _warnOnce = _interopRequireDefault(require("@atlaskit/ds-lib/warn-once"));
+var _stack = _interopRequireDefault(require("@atlaskit/primitives/stack"));
 var _colors = require("@atlaskit/theme/colors");
 var _styles = require("../../common/styles");
 var _Header = require("../Header");
 var _Item = require("../Item");
+/* eslint-disable @repo/internal/react/consistent-props-definitions */
+
 /**
  * __Footer__
  *
  * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
  * - [Code](https://atlassian.design/components/side-navigation/code)
  */
-var Footer = function Footer(props) {
+var OldFooter = function OldFooter(props) {
   var cssFn = (0, _styles.overrideStyleFunction)(function () {
     return {
       userSelect: 'auto',
@@ -74,5 +80,80 @@ var Footer = function Footer(props) {
     cssFn: cssFn
   }));
 };
-var _default = Footer;
+
+/**
+ * __Footer__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
+var Footer = function Footer(_ref2) {
+  var description = _ref2.description,
+    children = _ref2.children,
+    iconBefore = _ref2.iconBefore,
+    testId = _ref2.testId;
+  return /*#__PURE__*/_react.default.createElement(_box.default, {
+    display: "block",
+    padding: "space.100",
+    testId: testId
+  }, /*#__PURE__*/_react.default.createElement(_stack.default, {
+    space: "100",
+    alignInline: "center"
+  }, /*#__PURE__*/_react.default.createElement(_box.default, {
+    display: "inlineBlock",
+    width: "size.200",
+    height: "size.200"
+  }, iconBefore), /*#__PURE__*/_react.default.createElement(_stack.default, {
+    space: "075"
+  }, /*#__PURE__*/_react.default.createElement(_text.default, {
+    fontSize: "size.075",
+    textAlign: "center",
+    lineHeight: "lineHeight.100"
+  }, children), description && /*#__PURE__*/_react.default.createElement(_text.default, {
+    lineHeight: "lineHeight.100",
+    as: "div",
+    fontSize: "size.075",
+    textAlign: "center",
+    color: "subtlest"
+  }, description))));
+};
+
+/**
+ * __Footer__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
+var FooterFacade = function FooterFacade(_ref3) {
+  var _ref3$useDeprecatedAp = _ref3.useDeprecatedApi,
+    useDeprecatedApi = _ref3$useDeprecatedAp === void 0 ? true : _ref3$useDeprecatedAp,
+    description = _ref3.description,
+    iconBefore = _ref3.iconBefore,
+    testId = _ref3.testId,
+    children = _ref3.children,
+    component = _ref3.component,
+    cssFn = _ref3.cssFn,
+    onClick = _ref3.onClick;
+  if (!useDeprecatedApi) {
+    return /*#__PURE__*/_react.default.createElement(Footer, {
+      iconBefore: iconBefore,
+      description: description,
+      testId: testId
+    }, children);
+  }
+  if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'CI') {
+    (0, _warnOnce.default)('The `@atlaskit/side-navigation` Footer has simplified its API, removing support for the `component`, `cssFn` and `onClick` props.\n\nThese props will stop working in a future major release. Reach out to #help-design-system on slack for help.');
+  }
+  return /*#__PURE__*/_react.default.createElement(OldFooter, {
+    onClick: onClick,
+    component: component
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
+    cssFn: cssFn,
+    iconBefore: iconBefore,
+    description: description,
+    testId: testId
+  }, children);
+};
+var _default = FooterFacade;
 exports.default = _default;

package/dist/cjs/components/SideNavigation/index.js

@@ -7,6 +7,7 @@ exports.default = void 0;
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
+/* eslint-disable @repo/internal/react/use-primitives */
 /** @jsx jsx */
 
 var sidebarMinWidth = '240px';
@@ -35,15 +36,12 @@ var SideNavigation = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var children = props.children,
     testId = props.testId,
     label = props.label;
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    (0, _react2.jsx)("nav", {
-      ref: ref,
-      "data-testid": testId,
-      "aria-label": label,
-      css: sideNavStyles
-    }, children)
-  );
+  return (0, _react2.jsx)("nav", {
+    ref: ref,
+    "data-testid": testId,
+    "aria-label": label,
+    css: sideNavStyles
+  }, children);
 });
 var _default = SideNavigation;
 exports.default = _default;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/side-navigation",
-	"version": "1.5.3",
+	"version": "1.6.1",
 	"sideEffects": false
 }

package/dist/es2019/common/styles.js

@@ -46,7 +46,8 @@ export const baseSideNavItemStyle = ({
   return {
     // This padding is set to ensure that the center of the left icon
     // is approximately center aligned with the horizontal app switcher.
-    padding: `${"var(--ds-space-100, 8px)"} ${"var(--ds-space-100, 10px)"}`,
+    paddingBlock: "var(--ds-space-100, 8px)",
+    paddingInline: "var(--ds-space-100, 10px)",
     borderRadius,
     // -- TODO: DELETE THESE COLOR OVERRIDES WHEN CLEANING UP FALLBACK THEMING --
     // Menu and side navigation are now color aligned so they do not need this!
@@ -57,16 +58,8 @@ export const baseSideNavItemStyle = ({
     // -- END TODO --------------------------------------------------------------
 
     ['& [data-item-elem-before]']: {
-      // TODO: Can this be moved into menu?
-      // center align icons with app-switcher regardless of size
-      display: 'flex',
       height: "var(--ds-space-300, 24px)",
-      width: "var(--ds-space-300, 24px)",
-      alignItems: 'center',
-      justifyContent: 'center',
-      // this margin could be removed if the respective item had a more
-      // compositional API so an Inline could be used to separate elements instead
-      marginRight: "var(--ds-space-200, 16px)"
+      width: "var(--ds-space-300, 24px)"
     }
   };
 };

package/dist/es2019/components/Footer/index.js

@@ -1,5 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @repo/internal/react/consistent-props-definitions */
 import React from 'react';
+import Box from '@atlaskit/ds-explorations/box';
+import Text from '@atlaskit/ds-explorations/text';
+import warnOnce from '@atlaskit/ds-lib/warn-once';
+import Stack from '@atlaskit/primitives/stack';
 import { N500 } from '@atlaskit/theme/colors';
 import { overrideStyleFunction } from '../../common/styles';
 import { Container } from '../Header';
@@ -10,7 +15,7 @@ import { CustomItem } from '../Item';
  * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
  * - [Code](https://atlassian.design/components/side-navigation/code)
  */
-const Footer = props => {
+const OldFooter = props => {
   const cssFn = overrideStyleFunction(() => ({
     userSelect: 'auto',
     display: 'block',
@@ -64,4 +69,80 @@ const Footer = props => {
     cssFn: cssFn
   }));
 };
-export default Footer;
+
+/**
+ * __Footer__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
+const Footer = ({
+  description,
+  children,
+  iconBefore,
+  testId
+}) => {
+  return /*#__PURE__*/React.createElement(Box, {
+    display: "block",
+    padding: "space.100",
+    testId: testId
+  }, /*#__PURE__*/React.createElement(Stack, {
+    space: "100",
+    alignInline: "center"
+  }, /*#__PURE__*/React.createElement(Box, {
+    display: "inlineBlock",
+    width: "size.200",
+    height: "size.200"
+  }, iconBefore), /*#__PURE__*/React.createElement(Stack, {
+    space: "075"
+  }, /*#__PURE__*/React.createElement(Text, {
+    fontSize: "size.075",
+    textAlign: "center",
+    lineHeight: "lineHeight.100"
+  }, children), description && /*#__PURE__*/React.createElement(Text, {
+    lineHeight: "lineHeight.100",
+    as: "div",
+    fontSize: "size.075",
+    textAlign: "center",
+    color: "subtlest"
+  }, description))));
+};
+
+/**
+ * __Footer__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
+const FooterFacade = ({
+  useDeprecatedApi = true,
+  description,
+  iconBefore,
+  testId,
+  children,
+  component,
+  cssFn,
+  onClick
+}) => {
+  if (!useDeprecatedApi) {
+    return /*#__PURE__*/React.createElement(Footer, {
+      iconBefore: iconBefore,
+      description: description,
+      testId: testId
+    }, children);
+  }
+  if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'CI') {
+    warnOnce('The `@atlaskit/side-navigation` Footer has simplified its API, removing support for the `component`, `cssFn` and `onClick` props.\n\nThese props will stop working in a future major release. Reach out to #help-design-system on slack for help.');
+  }
+  return /*#__PURE__*/React.createElement(OldFooter, {
+    onClick: onClick,
+    component: component
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
+    cssFn: cssFn,
+    iconBefore: iconBefore,
+    description: description,
+    testId: testId
+  }, children);
+};
+export default FooterFacade;

package/dist/es2019/components/SideNavigation/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable @repo/internal/react/use-primitives */
 /** @jsx jsx */
 import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -30,14 +31,11 @@ const SideNavigation = /*#__PURE__*/forwardRef((props, ref) => {
     testId,
     label
   } = props;
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    jsx("nav", {
-      ref: ref,
-      "data-testid": testId,
-      "aria-label": label,
-      css: sideNavStyles
-    }, children)
-  );
+  return jsx("nav", {
+    ref: ref,
+    "data-testid": testId,
+    "aria-label": label,
+    css: sideNavStyles
+  }, children);
 });
 export default SideNavigation;

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/side-navigation",
-	"version": "1.5.3",
+	"version": "1.6.1",
 	"sideEffects": false
 }

package/dist/esm/common/styles.js

@@ -51,23 +51,16 @@ export var baseSideNavItemStyle = function baseSideNavItemStyle(_ref) {
   return _objectSpread(_objectSpread(_objectSpread({
     // This padding is set to ensure that the center of the left icon
     // is approximately center aligned with the horizontal app switcher.
-    padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-100, 10px)"),
+    paddingBlock: "var(--ds-space-100, 8px)",
+    paddingInline: "var(--ds-space-100, 10px)",
     borderRadius: borderRadius,
     // -- TODO: DELETE THESE COLOR OVERRIDES WHEN CLEANING UP FALLBACK THEMING --
     // Menu and side navigation are now color aligned so they do not need this!
     // See: https://product-fabric.atlassian.net/browse/DSP-1684
     backgroundColor: "var(--ds-background-neutral-subtle, transparent)"
   }, !isDisabled && !isSelected && defaultStyles), !isDisabled && isSelected && selectedStyles), {}, _defineProperty({}, '& [data-item-elem-before]', {
-    // TODO: Can this be moved into menu?
-    // center align icons with app-switcher regardless of size
-    display: 'flex',
     height: "var(--ds-space-300, 24px)",
-    width: "var(--ds-space-300, 24px)",
-    alignItems: 'center',
-    justifyContent: 'center',
-    // this margin could be removed if the respective item had a more
-    // compositional API so an Inline could be used to separate elements instead
-    marginRight: "var(--ds-space-200, 16px)"
+    width: "var(--ds-space-300, 24px)"
   }));
 };
 export var sectionHeaderSpacingStyles = function sectionHeaderSpacingStyles() {

package/dist/esm/components/Footer/index.js

@@ -1,5 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @repo/internal/react/consistent-props-definitions */
 import React from 'react';
+import Box from '@atlaskit/ds-explorations/box';
+import Text from '@atlaskit/ds-explorations/text';
+import warnOnce from '@atlaskit/ds-lib/warn-once';
+import Stack from '@atlaskit/primitives/stack';
 import { N500 } from '@atlaskit/theme/colors';
 import { overrideStyleFunction } from '../../common/styles';
 import { Container } from '../Header';
@@ -10,7 +15,7 @@ import { CustomItem } from '../Item';
  * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
  * - [Code](https://atlassian.design/components/side-navigation/code)
  */
-var Footer = function Footer(props) {
+var OldFooter = function OldFooter(props) {
   var cssFn = overrideStyleFunction(function () {
     return {
       userSelect: 'auto',
@@ -67,4 +72,79 @@ var Footer = function Footer(props) {
     cssFn: cssFn
   }));
 };
-export default Footer;
+
+/**
+ * __Footer__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
+var Footer = function Footer(_ref2) {
+  var description = _ref2.description,
+    children = _ref2.children,
+    iconBefore = _ref2.iconBefore,
+    testId = _ref2.testId;
+  return /*#__PURE__*/React.createElement(Box, {
+    display: "block",
+    padding: "space.100",
+    testId: testId
+  }, /*#__PURE__*/React.createElement(Stack, {
+    space: "100",
+    alignInline: "center"
+  }, /*#__PURE__*/React.createElement(Box, {
+    display: "inlineBlock",
+    width: "size.200",
+    height: "size.200"
+  }, iconBefore), /*#__PURE__*/React.createElement(Stack, {
+    space: "075"
+  }, /*#__PURE__*/React.createElement(Text, {
+    fontSize: "size.075",
+    textAlign: "center",
+    lineHeight: "lineHeight.100"
+  }, children), description && /*#__PURE__*/React.createElement(Text, {
+    lineHeight: "lineHeight.100",
+    as: "div",
+    fontSize: "size.075",
+    textAlign: "center",
+    color: "subtlest"
+  }, description))));
+};
+
+/**
+ * __Footer__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
+var FooterFacade = function FooterFacade(_ref3) {
+  var _ref3$useDeprecatedAp = _ref3.useDeprecatedApi,
+    useDeprecatedApi = _ref3$useDeprecatedAp === void 0 ? true : _ref3$useDeprecatedAp,
+    description = _ref3.description,
+    iconBefore = _ref3.iconBefore,
+    testId = _ref3.testId,
+    children = _ref3.children,
+    component = _ref3.component,
+    cssFn = _ref3.cssFn,
+    onClick = _ref3.onClick;
+  if (!useDeprecatedApi) {
+    return /*#__PURE__*/React.createElement(Footer, {
+      iconBefore: iconBefore,
+      description: description,
+      testId: testId
+    }, children);
+  }
+  if (typeof process !== 'undefined' && process.env.NODE_ENV !== 'production' && process.env.NODE_ENV !== 'CI') {
+    warnOnce('The `@atlaskit/side-navigation` Footer has simplified its API, removing support for the `component`, `cssFn` and `onClick` props.\n\nThese props will stop working in a future major release. Reach out to #help-design-system on slack for help.');
+  }
+  return /*#__PURE__*/React.createElement(OldFooter, {
+    onClick: onClick,
+    component: component
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
+    cssFn: cssFn,
+    iconBefore: iconBefore,
+    description: description,
+    testId: testId
+  }, children);
+};
+export default FooterFacade;

package/dist/esm/components/SideNavigation/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable @repo/internal/react/use-primitives */
 /** @jsx jsx */
 import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -28,14 +29,11 @@ var SideNavigation = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
     testId = props.testId,
     label = props.label;
-  return (
-    // eslint-disable-next-line @repo/internal/react/use-primitives
-    jsx("nav", {
-      ref: ref,
-      "data-testid": testId,
-      "aria-label": label,
-      css: sideNavStyles
-    }, children)
-  );
+  return jsx("nav", {
+    ref: ref,
+    "data-testid": testId,
+    "aria-label": label,
+    css: sideNavStyles
+  }, children);
 });
 export default SideNavigation;

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/side-navigation",
-	"version": "1.5.3",
+	"version": "1.6.1",
 	"sideEffects": false
 }

package/dist/types/components/Footer/index.d.ts

@@ -1,11 +1,28 @@
 /// <reference types="react" />
-import { HeaderProps as FooterProps } from '../Header';
-export type { FooterProps };
+import { HeaderProps } from '../Header';
+declare type NewFooterProps = Omit<HeaderProps, 'cssFn' | 'component' | 'onClick'>;
+declare type FooterFacadeProps = (HeaderProps & {
+    /**
+     * @private
+     * @deprecated
+     */
+    useDeprecatedApi?: true;
+}) | (NewFooterProps & {
+    /**
+     * @private
+     * @deprecated
+     */
+    useDeprecatedApi?: false;
+    cssFn?: never;
+    component?: never;
+    onClick?: never;
+});
+export declare type FooterProps = HeaderProps | NewFooterProps;
 /**
  * __Footer__
  *
  * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
  * - [Code](https://atlassian.design/components/side-navigation/code)
  */
-declare const Footer: (props: FooterProps) => JSX.Element;
-export default Footer;
+declare const FooterFacade: ({ useDeprecatedApi, description, iconBefore, testId, children, component, cssFn, onClick, }: FooterFacadeProps) => JSX.Element;
+export default FooterFacade;

package/dist/types/components/Header/index.d.ts

@@ -6,7 +6,7 @@ import { CSSFn, CustomItemComponentProps } from '@atlaskit/menu';
  * A container for Header and Footer that safely handles props to the child component
  */
 export declare const Container: React.FC<CustomItemComponentProps>;
-export interface HeaderProps {
+export declare type HeaderProps = {
     /**
      * A function that can be used to override the styles of the component.
      * It receives the current styles and state and expects a styles object.
@@ -41,11 +41,10 @@ export interface HeaderProps {
      * Custom component to render as an item.
      * This can be both a functional component or a class component.
      * __Will return `null` if no component is defined.__
-     *
      * __NOTE:__ Make sure the reference for this component does not change between renders else undefined behavior may happen.
      */
     component?: React.ComponentType<CustomItemComponentProps>;
-}
+};
 /**
  * __Header__
  *

package/docs/ert/footer.tsx

@@ -0,0 +1,16 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required */
+/* eslint-disable @repo/internal/react/boolean-prop-naming-convention */
+/* eslint-disable @repo/internal/react/consistent-props-definitions */
+
+import { HeaderProps } from '../../src/components/Header';
+
+interface FooterProps extends HeaderProps {
+  /**
+   * @deprecated
+   * Enables use of deprecated `cssFn`, `onClick` and `component` props.
+   * If this prop is not set to true, you will see a deprecation warning.
+   */
+  useDeprecatedApi?: boolean;
+}
+
+export default (props: FooterProps) => null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/side-navigation",
-  "version": "1.5.3",
+  "version": "1.6.1",
   "description": "A highly composable side navigation component that supports nested views.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -15,7 +15,6 @@
   "sideEffects": false,
   "atlaskit:src": "src/index.tsx",
   "atlassian": {
-    "disableProductCI": true,
     "team": "Design System Team",
     "deprecatedAutoEntryPoints": true,
     "releaseModel": "scheduled",
@@ -28,10 +27,11 @@
     "@atlaskit/ds-explorations": "^2.0.0",
     "@atlaskit/ds-lib": "^2.1.0",
     "@atlaskit/icon": "^21.11.0",
-    "@atlaskit/menu": "^1.4.0",
+    "@atlaskit/menu": "^1.5.0",
     "@atlaskit/motion": "^1.3.0",
-    "@atlaskit/theme": "^12.2.0",
-    "@atlaskit/tokens": "^1.0.0",
+    "@atlaskit/primitives": "^0.4.0",
+    "@atlaskit/theme": "^12.3.0",
+    "@atlaskit/tokens": "^1.2.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },
@@ -42,7 +42,7 @@
     "@atlaskit/atlassian-navigation": "^2.3.0",
     "@atlaskit/button": "^16.5.0",
     "@atlaskit/docs": "*",
-    "@atlaskit/logo": "^13.10.0",
+    "@atlaskit/logo": "^13.11.0",
     "@atlaskit/onboarding": "^10.6.0",
     "@atlaskit/section-message": "^6.3.0",
     "@atlaskit/select": "^16.1.0",
@@ -71,10 +71,10 @@
         "lite-mode"
       ],
       "design-tokens": [
+        "color",
         "spacing"
       ],
       "analytics": "analytics-next",
-      "theming": "tokens",
       "deprecation": "no-deprecated-imports"
     }
   },