@atlaskit/side-navigation 1.2.10 → 1.2.13

package/dist/es2019/components/Item/skeleton-item.js

@@ -4,6 +4,14 @@ import { SkeletonItem as SkelItem } from '@atlaskit/menu';
 import { ITEM_SIDE_PADDING } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Skeleton item__
+ *
+ * A skeleton item can be used to reduce the perceived laoding time.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#loading)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 const SkeletonItem = props => {
   const {
     shouldRender
@@ -13,7 +21,7 @@ const SkeletonItem = props => {
     return null;
   }
 
-  return /*#__PURE__*/React.createElement(SkelItem // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  return /*#__PURE__*/React.createElement(SkelItem // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
   , _extends({
     cssFn: () => ({
       paddingLeft: ITEM_SIDE_PADDING,
@@ -22,7 +30,8 @@ const SkeletonItem = props => {
         // This doubles up & to get a higher specificity as well as to not overwite the base styles.
         marginRight: 18
       }
-    })
+    }) // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+
   }, props));
 };
 

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

@@ -5,6 +5,11 @@ import { jsx } from '@emotion/core';
 import { ExitingPersistence, FadeIn, mediumDurationMs } from '@atlaskit/motion';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Loading items__
+ *
+ * Loading items conditionally render based on the useShouldNestedElementRender() hook.
+ */
 const LoadingItems = ({
   children,
   isLoading,

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

@@ -4,6 +4,15 @@ import { jsx } from '@emotion/core';
 import useScrollbarWidth from '@atlaskit/ds-lib/use-scrollbar-width';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 import { containerCSS, innerContainerCSS, outerContainerCSS } from './styles';
+
+/**
+ * __Navigation content__
+ *
+ * A navigation content is used as the container for navigation items.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#content)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 const NavigationContent = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     showTopScrollIndicator,

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

@@ -6,6 +6,14 @@ const footerCSS = {
   padding: gridSize(),
   paddingBottom: gridSize() * 1.75
 };
+/**
+ * __Navigation footer__
+ *
+ * Allows for customisation of the footer.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 
 const NavigationFooter = ({
   children

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

@@ -2,6 +2,14 @@
 import { jsx } from '@emotion/core';
 import { gridSize } from '@atlaskit/theme/constants';
 
+/**
+ * __Navigation header__
+ *
+ * Allows for customisation of the header.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 const NavigationHeader = props => {
   const {
     children

package/dist/es2019/components/NestableNavigationContent/context.js

@@ -1,4 +1,8 @@
 import { createContext, useContext } from 'react';
+
+/**
+ * @internal
+ */
 export const NestedContext = /*#__PURE__*/createContext(undefined);
 export const useNestedContext = () => {
   const context = useContext(NestedContext);

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

@@ -11,6 +11,14 @@ import { NestingMotion } from './nesting-motion'; // Named so ERT doesn't pick u
 
 export const ROOT_ID = 'ATLASKIT_NESTED_ROOT';
 
+/**
+ * __Nestable navigation content__
+ *
+ * The container for navigation items with nested views
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#nested-navigation)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 const NestableNavigationContent = props => {
   const containerRef = useRef(null);
   const {

package/dist/es2019/components/NestableNavigationContent/nesting-motion.js

@@ -1,6 +1,10 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import { easeOut, SlideIn } from '@atlaskit/motion';
+
+/**
+ * @internal
+ */
 export const NestingMotion = props => {
   const {
     children,

package/dist/es2019/components/NestingItem/hack-for-ert.js

@@ -1 +1,2 @@
+// eslint-disable-next-line @repo/internal/react/use-noop
 export default function (_) {}

package/dist/es2019/components/Section/heading-item.js

@@ -4,6 +4,12 @@ import { HeadingItem as MenuHeadingItem } from '@atlaskit/menu';
 import { overrideStyleFunction, sectionHeaderStyle } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Heading item__
+ *
+ * Available for advanced use cases, for most situations providing a title to Section should be enough.
+ *
+ */
 const HeadingItem = props => {
   const {
     shouldRender
@@ -13,7 +19,7 @@ const HeadingItem = props => {
     return null;
   }
 
-  const cssFn = overrideStyleFunction(sectionHeaderStyle, props.cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  const cssFn = overrideStyleFunction(sectionHeaderStyle, props.cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides, @repo/internal/react/no-unsafe-spread-props
 
   return /*#__PURE__*/React.createElement(MenuHeadingItem, _extends({}, props, {
     cssFn: cssFn

package/dist/es2019/components/Section/section.js

@@ -4,6 +4,16 @@ import { Section as MenuSection } from '@atlaskit/menu';
 import { sectionHeaderStyle } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 // Type needed on props to extract types with extract react types.
+
+/**
+ * __Section__
+ *
+ * Used to separate items into sections. Using the title prop makes a section
+ * implicitly group the items for screen readers with no additional work required.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#section)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 const Section = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     shouldRender
@@ -14,7 +24,7 @@ const Section = /*#__PURE__*/forwardRef((props, ref) => {
   }
 
   return /*#__PURE__*/React.createElement(MenuSection, _extends({}, props, {
-    ref: ref // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+    ref: ref // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
     ,
     overrides: {
       HeadingItem: {

package/dist/es2019/components/Section/skeleton-heading-item.js

@@ -4,6 +4,13 @@ import { SkeletonHeadingItem as MenuSkeletonHeadingItem } from '@atlaskit/menu';
 import { ITEM_SIDE_PADDING } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Skeleton heading item__
+ *
+ * A skeleton heading item for use in managing loading states.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#loading)
+ */
 const SkeletonHeadingItem = props => {
   const {
     shouldRender
@@ -13,12 +20,13 @@ const SkeletonHeadingItem = props => {
     return null;
   }
 
-  return /*#__PURE__*/React.createElement(MenuSkeletonHeadingItem // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  return /*#__PURE__*/React.createElement(MenuSkeletonHeadingItem // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
   , _extends({
     cssFn: () => ({
       paddingLeft: ITEM_SIDE_PADDING,
       paddingRight: ITEM_SIDE_PADDING
-    })
+    }) // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+
   }, props));
 };
 

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

@@ -3,6 +3,16 @@ import { forwardRef } from 'react';
 import { jsx } from '@emotion/core';
 import { N10, N500 } from '@atlaskit/theme/colors';
 import { gridSize } from '@atlaskit/theme/constants';
+
+/**
+ * __Side navigation__
+ *
+ * A highly composable side navigation component that supports nested views.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ * - [Usage](https://atlassian.design/components/side-navigation/usage)
+ */
 const SideNavigation = /*#__PURE__*/forwardRef((props, ref) => {
   const {
     children,

package/dist/es2019/version.json

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

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

@@ -5,9 +5,16 @@ import { overrideStyleFunction } from '../../common/styles';
 import { CustomItem } from '../Item';
 
 var Container = function Container(props) {
+  // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   return /*#__PURE__*/React.createElement("div", props);
 };
 
+/**
+ * __Header__
+ *
+ * - [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 cssFn = overrideStyleFunction(function () {
     return {
@@ -42,8 +49,10 @@ var Footer = function Footer(props) {
       }
     };
   }, props.cssFn);
-  return /*#__PURE__*/React.createElement(CustomItem, _extends({}, props, {
-    component: props.component || Container,
+  return /*#__PURE__*/React.createElement(CustomItem // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+  , _extends({}, props, {
+    component: props.component || Container // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
     cssFn: cssFn
   }));
 };

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

@@ -9,9 +9,16 @@ import { overrideStyleFunction } from '../../common/styles';
 import { CustomItem } from '../Item';
 
 var Container = function Container(props) {
+  // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   return /*#__PURE__*/React.createElement("div", props);
 };
 
+/**
+ * __Header__
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var Header = /*#__PURE__*/forwardRef(function (props, ref) {
   var cssFn = overrideStyleFunction(function () {
     var _ref;
@@ -33,8 +40,10 @@ var Header = /*#__PURE__*/forwardRef(function (props, ref) {
   }, props.cssFn);
   return /*#__PURE__*/React.createElement(CustomItem, _extends({}, props, {
     ref: ref,
-    component: props.component || Container,
-    cssFn: cssFn,
+    component: props.component || Container // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
+    cssFn: cssFn // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
     overrides: {
       Title: {
         render: function render(_, _ref2) {

package/dist/esm/components/Item/button-item.js

@@ -5,6 +5,16 @@ import React, { forwardRef } from 'react';
 import { ButtonItem as Button } from '@atlaskit/menu';
 import { baseSideNavItemStyle, overrideStyleFunction } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
+
+/**
+ * __Button item__
+ *
+ * A button item renders an item wrapped in a button tag, used primarily when an
+ * action does something other than changing routes.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#button-item)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var ButtonItem = /*#__PURE__*/forwardRef( // Type needed on props to extract types with extract react types.
 function (_ref, ref) {
   var cssFn = _ref.cssFn,
@@ -17,7 +27,7 @@ function (_ref, ref) {
     return null;
   }
 
-  var cssOverride = overrideStyleFunction(baseSideNavItemStyle, cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  var cssOverride = overrideStyleFunction(baseSideNavItemStyle, cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
 
   return /*#__PURE__*/React.createElement(Button, _extends({
     ref: ref,

package/dist/esm/components/Item/custom-item.js

@@ -1,6 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["cssFn"];
+
+/* eslint-disable @repo/internal/react/no-unsafe-overrides */
 import React, { forwardRef } from 'react';
 import { CustomItem as Custom } from '@atlaskit/menu';
 import { baseSideNavItemStyle, overrideStyleFunction } from '../../common/styles';

package/dist/esm/components/Item/go-back-item.js

@@ -6,6 +6,16 @@ import React, { forwardRef, useCallback, useState } from 'react';
 import LeftArrow from '@atlaskit/icon/glyph/arrow-left-circle';
 import { N10 } from '@atlaskit/theme/colors';
 import ButtonItem from './button-item';
+
+/**
+ * __Go back item__
+ *
+ * A go back item is used to provide a customized "go back" button in nested
+ * navigations.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#go-back-item)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var GoBackItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var cssFn = _ref.cssFn,
       _ref$iconBefore = _ref.iconBefore,
@@ -31,7 +41,8 @@ var GoBackItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onClick && onClick(e);
   }, [onClick, isInteracted]);
   return /*#__PURE__*/React.createElement(ButtonItem, _extends({
-    isSelected: isSelected || isInteracted,
+    isSelected: isSelected || isInteracted // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+    ,
     cssFn: cssFn,
     iconBefore: iconBefore,
     onClick: onClickHandler,

package/dist/esm/components/Item/link-item.js

@@ -5,6 +5,18 @@ import React, { forwardRef } from 'react';
 import { LinkItem as Link } from '@atlaskit/menu';
 import { baseSideNavItemStyle, overrideStyleFunction } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
+
+/**
+ * __Link item__
+ *
+ * Renders an item wrapped in an anchor tag, useful when you have an item that
+ * should change routes using native browser navigation. For SPA transitions use
+ * a [custom item](https://atlassian.design/components/side-navigation/examples#custom-item)
+ * with the respective router logic.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#link-item)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var LinkItem = /*#__PURE__*/forwardRef( // Type needed on props to extract types with extract react types.
 function (_ref, ref) {
   var cssFn = _ref.cssFn,
@@ -17,7 +29,7 @@ function (_ref, ref) {
     return null;
   }
 
-  var cssOverride = overrideStyleFunction(baseSideNavItemStyle, cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  var cssOverride = overrideStyleFunction(baseSideNavItemStyle, cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
 
   return /*#__PURE__*/React.createElement(Link, _extends({
     ref: ref,

package/dist/esm/components/Item/skeleton-item.js

@@ -4,6 +4,14 @@ import { SkeletonItem as SkelItem } from '@atlaskit/menu';
 import { ITEM_SIDE_PADDING } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Skeleton item__
+ *
+ * A skeleton item can be used to reduce the perceived laoding time.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#loading)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var SkeletonItem = function SkeletonItem(props) {
   var _useShouldNestedEleme = useShouldNestedElementRender(),
       shouldRender = _useShouldNestedEleme.shouldRender;
@@ -12,7 +20,7 @@ var SkeletonItem = function SkeletonItem(props) {
     return null;
   }
 
-  return /*#__PURE__*/React.createElement(SkelItem // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  return /*#__PURE__*/React.createElement(SkelItem // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
   , _extends({
     cssFn: function cssFn() {
       return {
@@ -23,7 +31,8 @@ var SkeletonItem = function SkeletonItem(props) {
           marginRight: 18
         }
       };
-    }
+    } // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+
   }, props));
 };
 

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

@@ -5,6 +5,11 @@ import { jsx } from '@emotion/core';
 import { ExitingPersistence, FadeIn, mediumDurationMs } from '@atlaskit/motion';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Loading items__
+ *
+ * Loading items conditionally render based on the useShouldNestedElementRender() hook.
+ */
 var LoadingItems = function LoadingItems(_ref) {
   var children = _ref.children,
       isLoading = _ref.isLoading,

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

@@ -4,6 +4,15 @@ import { jsx } from '@emotion/core';
 import useScrollbarWidth from '@atlaskit/ds-lib/use-scrollbar-width';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 import { containerCSS, innerContainerCSS, outerContainerCSS } from './styles';
+
+/**
+ * __Navigation content__
+ *
+ * A navigation content is used as the container for navigation items.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#content)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var NavigationContent = /*#__PURE__*/forwardRef(function (props, ref) {
   var showTopScrollIndicator = props.showTopScrollIndicator,
       children = props.children;

package/dist/esm/components/NavigationContent/styles.js

@@ -45,7 +45,7 @@ export var outerContainerCSS = function outerContainerCSS(opts) {
       right: containerPadding + opts.scrollbarWidth,
       height: scrollIndicatorHeight,
       borderRadius: scrollIndicatorBorderRadius,
-      backgroundColor: "var(".concat(VAR_SEPARATOR_COLOR, ", ").concat("var(--ds-border, ".concat(N30, ")"), ")"),
+      backgroundColor: "var(".concat(VAR_SEPARATOR_COLOR, ", ", "var(--ds-border, ".concat(N30, ")"), ")"),
       position: 'absolute',
       zIndex: scrollIndicatorZIndex
     },
@@ -60,7 +60,7 @@ export var outerContainerCSS = function outerContainerCSS(opts) {
       right: containerPadding + opts.scrollbarWidth,
       bottom: 0,
       zIndex: scrollIndicatorZIndex,
-      backgroundColor: "var(".concat(VAR_SEPARATOR_COLOR, ", ").concat("var(--ds-border, ".concat(N30, ")"), ")")
+      backgroundColor: "var(".concat(VAR_SEPARATOR_COLOR, ", ", "var(--ds-border, ".concat(N30, ")"), ")")
     }
   };
 };
@@ -85,7 +85,7 @@ export var innerContainerCSS = function innerContainerCSS(opts) {
       left: 0,
       right: 0,
       height: scrollIndicatorHeight,
-      backgroundColor: "var(".concat(VAR_SCROLL_INDICATOR_COLOR, ", ").concat("var(--ds-surface, ".concat(N10, ")"), ")"),
+      backgroundColor: "var(".concat(VAR_SCROLL_INDICATOR_COLOR, ", ", "var(--ds-surface, ".concat(N10, ")"), ")"),
       position: 'absolute',
       display: 'block',
       zIndex: scrollIndicatorMaskZIndex
@@ -103,7 +103,7 @@ export var innerContainerCSS = function innerContainerCSS(opts) {
       marginTop: 'auto',
       position: 'relative',
       zIndex: scrollIndicatorMaskZIndex,
-      backgroundColor: "var(".concat(VAR_SCROLL_INDICATOR_COLOR, ", ").concat("var(--ds-surface, ".concat(N10, ")"), ")")
+      backgroundColor: "var(".concat(VAR_SCROLL_INDICATOR_COLOR, ", ", "var(--ds-surface, ".concat(N10, ")"), ")")
     }
   });
 };

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

@@ -6,6 +6,14 @@ var footerCSS = {
   padding: gridSize(),
   paddingBottom: gridSize() * 1.75
 };
+/**
+ * __Navigation footer__
+ *
+ * Allows for customisation of the footer.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 
 var NavigationFooter = function NavigationFooter(_ref) {
   var children = _ref.children;

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

@@ -2,6 +2,14 @@
 import { jsx } from '@emotion/core';
 import { gridSize } from '@atlaskit/theme/constants';
 
+/**
+ * __Navigation header__
+ *
+ * Allows for customisation of the header.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#header-and-footer)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var NavigationHeader = function NavigationHeader(props) {
   var children = props.children;
   return jsx("div", {

package/dist/esm/components/NestableNavigationContent/context.js

@@ -1,4 +1,8 @@
 import { createContext, useContext } from 'react';
+
+/**
+ * @internal
+ */
 export var NestedContext = /*#__PURE__*/createContext(undefined);
 export var useNestedContext = function useNestedContext() {
   var context = useContext(NestedContext);

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

@@ -12,6 +12,14 @@ import { NestingMotion } from './nesting-motion'; // Named so ERT doesn't pick u
 
 export var ROOT_ID = 'ATLASKIT_NESTED_ROOT';
 
+/**
+ * __Nestable navigation content__
+ *
+ * The container for navigation items with nested views
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#nested-navigation)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var NestableNavigationContent = function NestableNavigationContent(props) {
   var containerRef = useRef(null);
   var children = props.children,

package/dist/esm/components/NestableNavigationContent/nesting-motion.js

@@ -7,6 +7,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import { easeOut, SlideIn } from '@atlaskit/motion';
+
+/**
+ * @internal
+ */
 export var NestingMotion = function NestingMotion(props) {
   var children = props.children,
       enterFrom = props.enterFrom,

package/dist/esm/components/NestingItem/hack-for-ert.js

@@ -1 +1,2 @@
+// eslint-disable-next-line @repo/internal/react/use-noop
 export default function (_) {}

package/dist/esm/components/Section/heading-item.js

@@ -4,6 +4,12 @@ import { HeadingItem as MenuHeadingItem } from '@atlaskit/menu';
 import { overrideStyleFunction, sectionHeaderStyle } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 
+/**
+ * __Heading item__
+ *
+ * Available for advanced use cases, for most situations providing a title to Section should be enough.
+ *
+ */
 var HeadingItem = function HeadingItem(props) {
   var _useShouldNestedEleme = useShouldNestedElementRender(),
       shouldRender = _useShouldNestedEleme.shouldRender;
@@ -12,7 +18,7 @@ var HeadingItem = function HeadingItem(props) {
     return null;
   }
 
-  var cssFn = overrideStyleFunction(sectionHeaderStyle, props.cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+  var cssFn = overrideStyleFunction(sectionHeaderStyle, props.cssFn); // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides, @repo/internal/react/no-unsafe-spread-props
 
   return /*#__PURE__*/React.createElement(MenuHeadingItem, _extends({}, props, {
     cssFn: cssFn

package/dist/esm/components/Section/section.js

@@ -4,6 +4,16 @@ import { Section as MenuSection } from '@atlaskit/menu';
 import { sectionHeaderStyle } from '../../common/styles';
 import { useShouldNestedElementRender } from '../NestableNavigationContent/context';
 // Type needed on props to extract types with extract react types.
+
+/**
+ * __Section__
+ *
+ * Used to separate items into sections. Using the title prop makes a section
+ * implicitly group the items for screen readers with no additional work required.
+ *
+ * - [Examples](https://atlassian.design/components/side-navigation/examples#section)
+ * - [Code](https://atlassian.design/components/side-navigation/code)
+ */
 var Section = /*#__PURE__*/forwardRef(function (props, ref) {
   var _useShouldNestedEleme = useShouldNestedElementRender(),
       shouldRender = _useShouldNestedEleme.shouldRender;
@@ -13,7 +23,7 @@ var Section = /*#__PURE__*/forwardRef(function (props, ref) {
   }
 
   return /*#__PURE__*/React.createElement(MenuSection, _extends({}, props, {
-    ref: ref // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis
+    ref: ref // eslint-disable-next-line @atlaskit/design-system/no-deprecated-apis, @repo/internal/react/no-unsafe-overrides
     ,
     overrides: {
       HeadingItem: {