@atlaskit/side-navigation 1.8.2 → 1.8.4

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/side-navigation
 
+## 1.8.4
+
+### Patch Changes
+
+- Updated dependencies
+
+## 1.8.3
+
+### Patch Changes
+
+- [`774ed69ecef`](https://bitbucket.org/atlassian/atlassian-frontend/commits/774ed69ecef) - Internal changes to use space tokens for spacing values. There is no visual change.
+
 ## 1.8.2
 
 ### Patch Changes

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

@@ -41,7 +41,8 @@ var outerContainerCSS = function outerContainerCSS(opts) {
     '&::before': {
       content: "''",
       display: 'block',
-      left: containerPadding,
+      // TODO Delete this comment after verifying space token -> previous value `containerPadding`
+      left: "var(--ds-space-100, 8px)",
       right: containerPadding + opts.scrollbarWidth,
       height: scrollIndicatorHeight,
       borderRadius: scrollIndicatorBorderRadius,
@@ -56,7 +57,8 @@ var outerContainerCSS = function outerContainerCSS(opts) {
       borderRadius: scrollIndicatorBorderRadius,
       flexShrink: 0,
       height: scrollIndicatorHeight,
-      left: containerPadding,
+      // TODO Delete this comment after verifying space token -> previous value `containerPadding`
+      left: "var(--ds-space-100, 8px)",
       right: containerPadding + opts.scrollbarWidth,
       bottom: 0,
       zIndex: scrollIndicatorZIndex,

package/dist/cjs/version.json

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

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

@@ -30,7 +30,8 @@ export const outerContainerCSS = opts => ({
   '&::before': {
     content: "''",
     display: 'block',
-    left: containerPadding,
+    // TODO Delete this comment after verifying space token -> previous value `containerPadding`
+    left: "var(--ds-space-100, 8px)",
     right: containerPadding + opts.scrollbarWidth,
     height: scrollIndicatorHeight,
     borderRadius: scrollIndicatorBorderRadius,
@@ -45,7 +46,8 @@ export const outerContainerCSS = opts => ({
     borderRadius: scrollIndicatorBorderRadius,
     flexShrink: 0,
     height: scrollIndicatorHeight,
-    left: containerPadding,
+    // TODO Delete this comment after verifying space token -> previous value `containerPadding`
+    left: "var(--ds-space-100, 8px)",
     right: containerPadding + opts.scrollbarWidth,
     bottom: 0,
     zIndex: scrollIndicatorZIndex,

package/dist/es2019/version.json

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

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

@@ -34,7 +34,8 @@ export var outerContainerCSS = function outerContainerCSS(opts) {
     '&::before': {
       content: "''",
       display: 'block',
-      left: containerPadding,
+      // TODO Delete this comment after verifying space token -> previous value `containerPadding`
+      left: "var(--ds-space-100, 8px)",
       right: containerPadding + opts.scrollbarWidth,
       height: scrollIndicatorHeight,
       borderRadius: scrollIndicatorBorderRadius,
@@ -49,7 +50,8 @@ export var outerContainerCSS = function outerContainerCSS(opts) {
       borderRadius: scrollIndicatorBorderRadius,
       flexShrink: 0,
       height: scrollIndicatorHeight,
-      left: containerPadding,
+      // TODO Delete this comment after verifying space token -> previous value `containerPadding`
+      left: "var(--ds-space-100, 8px)",
       right: containerPadding + opts.scrollbarWidth,
       bottom: 0,
       zIndex: scrollIndicatorZIndex,

package/dist/esm/version.json

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

package/dist/types/components/NavigationContent/styles.d.ts

@@ -17,7 +17,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
     readonly '&::before': {
         readonly content: "''";
         readonly display: "block";
-        readonly left: 8;
+        readonly left: "var(--ds-space-100)";
         readonly right: number;
         readonly height: 2;
         readonly borderRadius: 1;
@@ -32,7 +32,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
         readonly borderRadius: 1;
         readonly flexShrink: 0;
         readonly height: 2;
-        readonly left: 8;
+        readonly left: "var(--ds-space-100)";
         readonly right: number;
         readonly bottom: 0;
         readonly zIndex: 1;

package/dist/types-ts4.5/components/NavigationContent/styles.d.ts

@@ -17,7 +17,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
     readonly '&::before': {
         readonly content: "''";
         readonly display: "block";
-        readonly left: 8;
+        readonly left: "var(--ds-space-100)";
         readonly right: number;
         readonly height: 2;
         readonly borderRadius: 1;
@@ -32,7 +32,7 @@ export declare const outerContainerCSS: (opts: StyleOpts & {
         readonly borderRadius: 1;
         readonly flexShrink: 0;
         readonly height: 2;
-        readonly left: 8;
+        readonly left: "var(--ds-space-100)";
         readonly right: number;
         readonly bottom: 0;
         readonly zIndex: 1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/side-navigation",
-  "version": "1.8.2",
+  "version": "1.8.4",
   "description": "A highly composable side navigation component that supports nested views.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -25,7 +25,7 @@
   "atlassian": {
     "team": "Design System Team",
     "deprecatedAutoEntryPoints": true,
-    "releaseModel": "scheduled",
+    "releaseModel": "continuous",
     "website": {
       "name": "Side navigation",
       "category": "Components"
@@ -37,7 +37,7 @@
     "@atlaskit/icon": "^21.12.0",
     "@atlaskit/menu": "^1.7.0",
     "@atlaskit/motion": "^1.4.0",
-    "@atlaskit/primitives": "^0.9.0",
+    "@atlaskit/primitives": "^0.10.0",
     "@atlaskit/theme": "^12.5.0",
     "@atlaskit/tokens": "^1.5.0",
     "@babel/runtime": "^7.0.0",

package/tmp/api-report-tmp.d.ts

@@ -0,0 +1,228 @@
+## API Report File for "@atlaskit/side-navigation"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+/// <reference types="react" />
+
+import { ButtonItemProps } from '@atlaskit/menu';
+import { CSSFn } from '@atlaskit/menu';
+import { CustomItemComponentProps } from '@atlaskit/menu';
+import { CustomItemProps } from '@atlaskit/menu';
+import { ForwardRefExoticComponent } from 'react';
+import { HeadingItemProps } from '@atlaskit/menu';
+import { HTMLAttributes } from 'react';
+import { jsx } from '@emotion/react';
+import { LinkItemProps } from '@atlaskit/menu';
+import { Overrides } from '@atlaskit/menu';
+import { default as React_2 } from 'react';
+import { ReactNode } from 'react';
+import { RefAttributes } from 'react';
+import { SkeletonHeadingItemProps } from '@atlaskit/menu';
+import { SkeletonItemProps } from '@atlaskit/menu';
+
+// @public
+export const ButtonItem: React_2.ForwardRefExoticComponent<ButtonItemProps & React_2.RefAttributes<HTMLElement>>;
+
+export { ButtonItemProps }
+export { ButtonItemProps as GoBackItemProps }
+
+// @public
+export const CustomItem: CustomItemPropsHack;
+
+export { CustomItemComponentProps }
+
+export { CustomItemProps }
+
+// @public (undocumented)
+interface CustomItemPropsHack {
+    // (undocumented)
+    <TComponentProps extends {}>(props: CustomItemProps<TComponentProps> & {
+        ref?: any;
+    } & Omit<TComponentProps, keyof CustomItemComponentProps>): JSX.Element | null;
+}
+
+// @public
+export const Footer: ({ useDeprecatedApi, description, iconBefore, testId, children, component, cssFn, onClick, }: FooterFacadeProps) => JSX.Element;
+
+// @public (undocumented)
+type FooterFacadeProps = (HeaderProps & {
+    useDeprecatedApi?: true;
+}) | (NewFooterProps & {
+    useDeprecatedApi?: false;
+    cssFn?: never;
+    component?: never;
+    onClick?: never;
+});
+
+// @public (undocumented)
+export type FooterProps = HeaderProps | NewFooterProps;
+
+// @public
+export const GoBackItem: React_2.ForwardRefExoticComponent<ButtonItemProps & React_2.RefAttributes<HTMLElement>>;
+
+// @public
+export const Header: React_2.ForwardRefExoticComponent<HeaderProps & React_2.RefAttributes<HTMLElement>>;
+
+// @public (undocumented)
+export type HeaderProps = {
+    cssFn?: CSSFn;
+    iconBefore?: React_2.ReactNode;
+    onClick?: (event: React_2.KeyboardEvent | React_2.MouseEvent) => void;
+    description?: JSX.Element | string;
+    children?: React_2.ReactNode;
+    testId?: string;
+    component?: React_2.ComponentType<CustomItemComponentProps>;
+};
+
+// @public
+export const HeadingItem: (props: HeadingItemProps) => JSX.Element | null;
+
+export { HeadingItemProps }
+
+// @public
+export const LinkItem: React_2.ForwardRefExoticComponent<LinkItemProps & React_2.RefAttributes<HTMLElement>>;
+
+export { LinkItemProps }
+
+// @public
+export const LoadingItems: ({ children, isLoading, fallback, testId, }: LoadingItemsProps) => JSX.Element;
+
+// @public (undocumented)
+export interface LoadingItemsProps {
+    children: React.ReactNode;
+    fallback: React.ReactNode;
+    isLoading?: boolean;
+    testId?: string;
+}
+
+// @public
+export const NavigationContent: ForwardRefExoticComponent<NavigationContentProps & HTMLAttributes<HTMLElement> & RefAttributes<HTMLElement>>;
+
+// @public (undocumented)
+export interface NavigationContentProps {
+    // (undocumented)
+    children: React.ReactNode;
+    showTopScrollIndicator?: boolean;
+    testId?: string;
+}
+
+// @public
+export const NavigationFooter: ({ children }: NavigationFooterProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+export interface NavigationFooterProps {
+    // (undocumented)
+    children: ReactNode;
+}
+
+// @public
+export const NavigationHeader: (props: NavigationHeaderProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+export interface NavigationHeaderProps {
+    // (undocumented)
+    children: JSX.Element | JSX.Element[];
+}
+
+// @public
+export const NestableNavigationContent: (props: NestableNavigationContentProps) => jsx.JSX.Element;
+
+// @public (undocumented)
+export interface NestableNavigationContentProps {
+    children: JSX.Element | JSX.Element[];
+    initialStack?: string[];
+    onChange?: (stack: string[]) => void;
+    onUnknownNest?: (stack: string[]) => void;
+    // @deprecated
+    overrides?: {
+        GoBackItem?: {
+            render?: (props: {
+                onClick: () => void;
+                testId?: string;
+            }) => React.ReactNode;
+        };
+    };
+    stack?: string[];
+    testId?: string;
+}
+
+// @public
+export const NestingItem: <TCustomComponentProps extends CustomItemComponentProps>(props: NestingItemProps<TCustomComponentProps> & Omit<TCustomComponentProps, keyof CustomItemComponentProps>) => JSX.Element;
+
+// @public (undocumented)
+interface NestingItemOverrides extends Overrides {
+    GoBackItem?: {
+        render?: (props: {
+            onClick: () => void;
+            testId?: string;
+        }) => React_2.ReactNode;
+    };
+}
+
+// @public (undocumented)
+export interface NestingItemProps<TCustomComponentProps = CustomItemComponentProps> {
+    children: React_2.ReactNode;
+    component?: React_2.ComponentType<TCustomComponentProps>;
+    cssFn?: CSSFn;
+    description?: JSX.Element | string;
+    iconAfter?: React_2.ReactNode;
+    iconBefore?: React_2.ReactNode;
+    id: string;
+    isDisabled?: boolean;
+    isSelected?: boolean;
+    onClick?: (event: React_2.KeyboardEvent | React_2.MouseEvent) => void;
+    overrides?: NestingItemOverrides;
+    testId?: string;
+    title: React_2.ReactNode;
+}
+
+// @public (undocumented)
+type NewFooterProps = Omit<HeaderProps, 'component' | 'cssFn' | 'onClick'>;
+
+// @public
+export const Section: React_2.ForwardRefExoticComponent<SectionProps & React_2.RefAttributes<HTMLElement>>;
+
+// @public (undocumented)
+export interface SectionProps {
+    children: React_2.ReactNode;
+    hasSeparator?: boolean;
+    testId?: string;
+    title?: string;
+}
+
+// @public
+export const SideNavigation: ForwardRefExoticComponent<SideNavigationProps & RefAttributes<HTMLElement>>;
+
+// @public (undocumented)
+export interface SideNavigationProps {
+    children: JSX.Element | JSX.Element[];
+    label: string;
+    testId?: string;
+}
+
+// @public
+export const SkeletonHeadingItem: (props: SkeletonHeadingItemProps) => JSX.Element | null;
+
+export { SkeletonHeadingItemProps }
+
+// @public
+export const SkeletonItem: (props: SkeletonItemProps) => JSX.Element | null;
+
+export { SkeletonItemProps }
+
+// @public
+export const useShouldNestedElementRender: () => {
+    shouldRender: boolean;
+};
+
+// @public (undocumented)
+export const VAR_SCROLL_INDICATOR_COLOR = "--ds-menu-scroll-indicator-color";
+
+// @public (undocumented)
+export const VAR_SEPARATOR_COLOR = "--ds-menu-seperator-color";
+
+// (No @packageDocumentation comment for this package)
+
+```