@atlaskit/drawer 7.1.9 → 7.1.12

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/drawer
 
+## 7.1.12
+
+### Patch Changes
+
+- [`8d4228767b0`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8d4228767b0) - Upgrade Typescript from `4.2.4` to `4.3.5`.
+
+## 7.1.11
+
+### Patch Changes
+
+- [`fd86b8e4c63`](https://bitbucket.org/atlassian/atlassian-frontend/commits/fd86b8e4c63) - Internal code change turning on new linting rules.
+
+## 7.1.10
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 7.1.9
 
 ### Patch Changes

package/dist/cjs/components/index.js

@@ -46,7 +46,7 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
 var packageName = "@atlaskit/drawer";
-var packageVersion = "7.1.9";
+var packageVersion = "7.1.12";
 var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
 
 var createAndFireOnClick = function createAndFireOnClick(createAnalyticsEvent, trigger) {
@@ -177,7 +177,8 @@ var DrawerBase = /*#__PURE__*/function (_Component) {
         onCloseComplete: onCloseComplete,
         onOpenComplete: onOpenComplete,
         width: width,
-        shouldUnmountOnExit: shouldUnmountOnExit,
+        shouldUnmountOnExit: shouldUnmountOnExit // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+        ,
         overrides: overrides
       }, children)));
     }

package/dist/cjs/components/primitives/content.js

@@ -36,7 +36,7 @@ var Content = function Content(_ref) {
      * guide suggested as it made more sense as a transformer of the current styles rather than
      * a complete override with no chance of partially changing styles.
      */
-    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
     (0, _core.jsx)("div", (0, _extends2.default)({
       css: cssFn(defaultStyles)
     }, props))

package/dist/cjs/components/primitives/icon-button.js

@@ -47,7 +47,8 @@ var IconButton = function IconButton(_ref) {
     onClick: onClick,
     "data-testid": testId
   }, children);
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 var _default = IconButton;
 exports.default = _default;

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

@@ -138,7 +138,8 @@ var DrawerPrimitive = function DrawerPrimitive(_ref2) {
       label: "Close drawer"
     }))), (0, _core.jsx)(Content, contentOverrides, children));
   }));
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 var _default = DrawerPrimitive;
 exports.default = _default;

package/dist/cjs/components/primitives/sidebar.js

@@ -38,7 +38,7 @@ var sidebarCSS = function sidebarCSS() {
 var Sidebar = function Sidebar(_ref) {
   var cssFn = _ref.cssFn,
       props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+  // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
   return (0, _core.jsx)("div", (0, _extends2.default)({
     css: cssFn(defaultStyle)
   }, props));

package/dist/cjs/components/utils.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createExtender = void 0;
 
+// eslint-disable-next-line @repo/internal/react/consistent-types-definitions
+
 /**
  * @deprecated Please avoid using this function as we intend to remote it in a future release. See DSP-2673 for more information.
  */

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/drawer",
-	"version": "7.1.9",
+	"version": "7.1.12",
 	"sideEffects": false
 }

package/dist/es2019/components/index.js

@@ -1,4 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+/* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
 import React, { Component } from 'react';
 import { canUseDOM } from 'exenv';
 import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -7,7 +9,7 @@ import Blanket from './blanket';
 import FocusLock from './focus-lock';
 import DrawerPrimitive from './primitives';
 const packageName = "@atlaskit/drawer";
-const packageVersion = "7.1.9";
+const packageVersion = "7.1.12";
 const createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 
 const createAndFireOnClick = (createAnalyticsEvent, trigger) => createAndFireEventOnAtlaskit({
@@ -131,7 +133,8 @@ export class DrawerBase extends Component {
       onCloseComplete: onCloseComplete,
       onOpenComplete: onOpenComplete,
       width: width,
-      shouldUnmountOnExit: shouldUnmountOnExit,
+      shouldUnmountOnExit: shouldUnmountOnExit // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+      ,
       overrides: overrides
     }, children)));
   }

package/dist/es2019/components/primitives/content.js

@@ -21,7 +21,7 @@ const Content = ({
  * guide suggested as it made more sense as a transformer of the current styles rather than
  * a complete override with no chance of partially changing styles.
  */
-// eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+// eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
 jsx("div", _extends({
   css: cssFn(defaultStyles)
 }, props));

package/dist/es2019/components/primitives/icon-button.js

@@ -36,6 +36,7 @@ const IconButton = ({
   css: iconButtonStyles,
   onClick: onClick,
   "data-testid": testId
-}, children);
+}, children); // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default IconButton;

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

@@ -115,6 +115,7 @@ const DrawerPrimitive = ({
       label: "Close drawer"
     }))), jsx(Content, contentOverrides, children));
   }));
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default DrawerPrimitive;

package/dist/es2019/components/primitives/sidebar.js

@@ -23,7 +23,7 @@ const Sidebar = ({
   cssFn,
   ...props
 }) => {
-  // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+  // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
   return jsx("div", _extends({
     css: cssFn(defaultStyle)
   }, props));

package/dist/es2019/components/utils.js

@@ -1,8 +1,11 @@
+// eslint-disable-next-line @repo/internal/react/consistent-types-definitions
+
 /**
  * @deprecated Please avoid using this function as we intend to remote it in a future release. See DSP-2673 for more information.
  */
 export const createExtender = function createExtender(defaults,
-/** We're defaulting to an Object.create call here to circumvent
+/**
+ * We're defaulting to an Object.create call here to circumvent
  *  the fact that {} can't be reconciled
  *  with a type that extends Record<string, any>
  *
@@ -10,7 +13,7 @@ export const createExtender = function createExtender(defaults,
  *  from nullifying a particular component in the tree.
  *  This can be reverted with additional logic,
  *  at such a time as this nullification becomes an actual usecase.
- * */
+ */
 overrides = Object.create(Object.prototype)) {
   if (!defaults) {
     throw new Error('a default set of overrides *must* be passed in as the first argument');

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/drawer",
-	"version": "7.1.9",
+	"version": "7.1.12",
 	"sideEffects": false
 }

package/dist/esm/components/index.js

@@ -10,6 +10,7 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
+/* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
 import React, { Component } from 'react';
 import { canUseDOM } from 'exenv';
 import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -18,7 +19,7 @@ import Blanket from './blanket';
 import FocusLock from './focus-lock';
 import DrawerPrimitive from './primitives';
 var packageName = "@atlaskit/drawer";
-var packageVersion = "7.1.9";
+var packageVersion = "7.1.12";
 var createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 
 var createAndFireOnClick = function createAndFireOnClick(createAnalyticsEvent, trigger) {
@@ -156,7 +157,8 @@ export var DrawerBase = /*#__PURE__*/function (_Component) {
         onCloseComplete: onCloseComplete,
         onOpenComplete: onOpenComplete,
         width: width,
-        shouldUnmountOnExit: shouldUnmountOnExit,
+        shouldUnmountOnExit: shouldUnmountOnExit // eslint-disable-next-line @repo/internal/react/no-unsafe-overrides
+        ,
         overrides: overrides
       }, children)));
     }

package/dist/esm/components/primitives/content.js

@@ -26,7 +26,7 @@ var Content = function Content(_ref) {
      * guide suggested as it made more sense as a transformer of the current styles rather than
      * a complete override with no chance of partially changing styles.
      */
-    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+    // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
     jsx("div", _extends({
       css: cssFn(defaultStyles)
     }, props))

package/dist/esm/components/primitives/icon-button.js

@@ -37,6 +37,7 @@ var IconButton = function IconButton(_ref) {
     onClick: onClick,
     "data-testid": testId
   }, children);
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default IconButton;

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

@@ -120,6 +120,7 @@ var DrawerPrimitive = function DrawerPrimitive(_ref2) {
       label: "Close drawer"
     }))), jsx(Content, contentOverrides, children));
   }));
-};
+}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
+
 
 export default DrawerPrimitive;

package/dist/esm/components/primitives/sidebar.js

@@ -27,7 +27,7 @@ var Sidebar = function Sidebar(_ref) {
   var cssFn = _ref.cssFn,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage
+  // eslint-disable-next-line @repo/internal/react/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
   return jsx("div", _extends({
     css: cssFn(defaultStyle)
   }, props));

package/dist/esm/components/utils.js

@@ -1,3 +1,5 @@
+// eslint-disable-next-line @repo/internal/react/consistent-types-definitions
+
 /**
  * @deprecated Please avoid using this function as we intend to remote it in a future release. See DSP-2673 for more information.
  */

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/drawer",
-	"version": "7.1.9",
+	"version": "7.1.12",
 	"sideEffects": false
 }

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

@@ -10,24 +10,38 @@ export declare type Widths = {
 };
 export declare type DrawerWidth = 'extended' | 'full' | 'medium' | 'narrow' | 'wide';
 export interface BaseProps {
-    /** A unique hook to be used for testing. */
+    /**
+     * A unique hook to be used for testing.
+     */
     testId?: string;
-    /** The content of the drawer. */
+    /**
+     * The content of the drawer.
+     */
     children?: ReactNode;
-    /** Icon to be rendered in your drawer as a component, if available. */
+    /**
+     * Icon to be rendered in your drawer as a component, if available.
+     */
     icon?: ComponentType<any>;
-    /** Available drawer sizes. */
+    /**
+     * Available drawer sizes.
+     */
     width?: DrawerWidth;
-    /** A callback function that will be called when the drawer has finished its opening transition. */
+    /**
+     * A callback function that will be called when the drawer has finished its opening transition.
+     */
     onOpenComplete?: (node: HTMLElement | null) => void;
-    /** A callback function that will be called when the drawer has finished its close transition. */
+    /**
+     * A callback function that will be called when the drawer has finished its close transition.
+     */
     onCloseComplete?: (node: HTMLElement | null) => void;
     /**
-     *  * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release.
+     * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release.
      * Boolean that controls if drawer should be retained/discarded
-     * */
+     */
     shouldUnmountOnExit?: boolean;
-    /** Override drawer components. */
+    /**
+     * Override drawer components.
+     */
     overrides?: OverridesType;
 }
 export declare type DefaultsType = {
@@ -77,22 +91,38 @@ export interface DrawerPrimitiveProps extends BaseProps {
     onClose: (event: SyntheticEvent<HTMLElement>) => void;
 }
 export declare type DrawerProps = BaseProps & FocusLockProps & WithAnalyticsEventsProps & {
-    /** Callback function called while the drawer is displayed and `keydown` event is triggered. */
+    /**
+     * Callback function called while the drawer is displayed and `keydown` event is triggered.
+     */
     onKeyDown?: (event: SyntheticEvent) => void;
-    /** Callback function called when the drawer is closed. */
+    /**
+     * Callback function called when the drawer is closed.
+     */
     onClose?: (event: SyntheticEvent<HTMLElement>, analyticsEvent: any) => void;
-    /** Controls if the drawer is open or closed. */
+    /**
+     * Controls if the drawer is open or closed.
+     */
     isOpen: boolean;
 };
 export interface FocusLockProps {
-    /** Controls whether to focus the first tabbable element inside the focus lock. */
+    /**
+     * Controls whether to focus the first tabbable element inside the focus lock.
+     */
     autoFocusFirstElem?: boolean | (() => HTMLElement | null);
-    /** Content inside the focus lock. */
+    /**
+     * Content inside the focus lock.
+     */
     children?: ReactNode;
-    /**  Whether the focus lock is active or not. */
+    /**
+     *  Whether the focus lock is active or not.
+     */
     isFocusLockEnabled?: boolean;
-    /** Whether to return the focus to the previous active element on closing the drawer. */
+    /**
+     * Whether to return the focus to the previous active element on closing the drawer.
+     */
     shouldReturnFocus?: boolean;
 }
-/** Type of keyboard event that triggers which key will should close the drawer. */
+/**
+ * Type of keyboard event that triggers which key will should close the drawer.
+ */
 export declare type CloseTrigger = 'backButton' | 'blanket' | 'escKey';

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@atlaskit/drawer",
-  "version": "7.1.9",
+  "version": "7.1.12",
   "description": "A drawer is a panel that slides in from the left side of the screen.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
   "main": "dist/cjs/index.js",
@@ -13,24 +13,25 @@
   "module:es2019": "dist/es2019/index.js",
   "types": "dist/types/index.d.ts",
   "sideEffects": false,
-  "atlaskit:src": "src/index.ts",
+  "atlaskit:src": "src/index.tsx",
   "homepage": "https://atlassian.design/components/drawer",
   "atlassian": {
     "team": "Design System Team",
     "deprecatedAutoEntryPoints": true,
     "releaseModel": "scheduled",
     "website": {
-      "name": "Drawer"
+      "name": "Drawer",
+      "category": "Components"
     }
   },
   "dependencies": {
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/blanket": "^12.1.0",
     "@atlaskit/icon": "^21.10.0",
-    "@atlaskit/motion": "^1.0.3",
+    "@atlaskit/motion": "^1.2.0",
     "@atlaskit/portal": "^4.0.0",
     "@atlaskit/theme": "^12.1.0",
-    "@atlaskit/tokens": "^0.9.0",
+    "@atlaskit/tokens": "^0.10.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/core": "^10.0.9",
     "exenv": "^1.2.2",
@@ -45,7 +46,8 @@
     "@atlaskit/checkbox": "^12.3.9",
     "@atlaskit/code": "^14.3.3",
     "@atlaskit/docs": "*",
-    "@atlaskit/dropdown-menu": "^11.1.0",
+    "@atlaskit/dropdown-menu": "^11.3.0",
+    "@atlaskit/ds-lib": "^2.1.0",
     "@atlaskit/menu": "^1.3.0",
     "@atlaskit/section-message": "^6.0.0",
     "@atlaskit/ssr": "*",
@@ -59,7 +61,7 @@
     "lodash": "^4.17.21",
     "react-dom": "^16.8.0",
     "react-lorem-component": "^0.13.0",
-    "typescript": "4.2.4",
+    "typescript": "4.3.5",
     "wait-for-expect": "^1.2.0"
   },
   "techstack": {
@@ -67,6 +69,8 @@
       "import-structure": "atlassian-conventions"
     },
     "@repo/internal": {
+      "dom-events": "use-bind-event-listener",
+      "design-system": "v1",
       "analytics": "analytics-next",
       "theming": "tokens",
       "styling": [

package/report.api.md

@@ -0,0 +1,196 @@
+## API Report File for "@atlaskit/drawer"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+import { ComponentType } from 'react';
+import { CSSObject } from '@emotion/core';
+import { default as React_2 } from 'react';
+import { ReactNode } from 'react';
+import { SyntheticEvent } from 'react';
+import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+import { WithContextProps } from '@atlaskit/analytics-next';
+
+export declare interface BaseProps {
+  /** A unique hook to be used for testing. */
+  testId?: string;
+  /** The content of the drawer. */
+  children?: ReactNode;
+  /** Icon to be rendered in your drawer as a component, if available. */
+  icon?: ComponentType<any>;
+  /** Available drawer sizes. */
+  width?: DrawerWidth;
+  /** A callback function that will be called when the drawer has finished its opening transition. */
+  onOpenComplete?: (node: HTMLElement | null) => void;
+  /** A callback function that will be called when the drawer has finished its close transition. */
+  onCloseComplete?: (node: HTMLElement | null) => void;
+  /**
+   *  * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release.
+   * Boolean that controls if drawer should be retained/discarded
+   * */
+  shouldUnmountOnExit?: boolean;
+  /** Override drawer components. */
+  overrides?: OverridesType;
+}
+
+/** Type of keyboard event that triggers which key will should close the drawer. */
+export declare type CloseTrigger = 'backButton' | 'blanket' | 'escKey';
+
+export declare type ContentCSSProps = Omit<ContentProps, 'cssFn'>;
+
+export declare interface ContentProps extends React.HTMLProps<HTMLDivElement> {
+  /**
+   * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release. See DSP-2673 for more information.
+   */
+  cssFn: (defaultStyles: CSSObject) => CSSObject;
+}
+
+declare const _default: React_2.ForwardRefExoticComponent<
+  Pick<
+    Pick<
+      Omit<DrawerProps, keyof WithAnalyticsEventsProps>,
+      | 'children'
+      | 'onKeyDown'
+      | 'isOpen'
+      | 'testId'
+      | 'icon'
+      | 'onClose'
+      | 'onCloseComplete'
+      | 'onOpenComplete'
+      | 'overrides'
+      | 'shouldUnmountOnExit'
+    > &
+      Partial<
+        Pick<
+          Omit<DrawerProps, keyof WithAnalyticsEventsProps>,
+          | 'width'
+          | 'isFocusLockEnabled'
+          | 'autoFocusFirstElem'
+          | 'shouldReturnFocus'
+        >
+      > &
+      Partial<
+        Pick<
+          {
+            width: DrawerWidth;
+            isFocusLockEnabled: boolean;
+            shouldReturnFocus: boolean;
+            autoFocusFirstElem: boolean;
+          },
+          never
+        >
+      > &
+      React_2.RefAttributes<any> &
+      WithContextProps,
+    | 'width'
+    | 'children'
+    | 'onKeyDown'
+    | 'key'
+    | 'isOpen'
+    | 'analyticsContext'
+    | 'testId'
+    | 'isFocusLockEnabled'
+    | 'autoFocusFirstElem'
+    | 'shouldReturnFocus'
+    | 'icon'
+    | 'onClose'
+    | 'onCloseComplete'
+    | 'onOpenComplete'
+    | 'overrides'
+    | 'shouldUnmountOnExit'
+  > &
+    React_2.RefAttributes<any>
+>;
+export default _default;
+
+export declare type DefaultsType = {
+  Sidebar: {
+    component: React.ComponentType<SidebarProps>;
+    cssFn: (defaultStyles: CSSObject) => CSSObject;
+  };
+  Content: {
+    component: React.ComponentType<ContentProps>;
+    cssFn: (defaultStyles: CSSObject) => CSSObject;
+  };
+};
+
+export declare type DrawerPrimitiveDefaults = Pick<
+  DefaultsType,
+  'Sidebar' | 'Content'
+>;
+
+export declare type DrawerPrimitiveOverrides = Pick<
+  OverridesType,
+  'Sidebar' | 'Content'
+>;
+
+export declare interface DrawerPrimitiveProps extends BaseProps {
+  in: boolean;
+  onClose: (event: SyntheticEvent<HTMLElement>) => void;
+}
+
+export declare type DrawerProps = BaseProps &
+  FocusLockProps &
+  WithAnalyticsEventsProps & {
+    /** Callback function called while the drawer is displayed and `keydown` event is triggered. */
+    onKeyDown?: (event: SyntheticEvent) => void;
+    /** Callback function called when the drawer is closed. */
+    onClose?: (event: SyntheticEvent<HTMLElement>, analyticsEvent: any) => void;
+    /** Controls if the drawer is open or closed. */
+    isOpen: boolean;
+  };
+
+export declare type DrawerWidth =
+  | 'extended'
+  | 'full'
+  | 'medium'
+  | 'narrow'
+  | 'wide';
+
+export declare interface FocusLockProps {
+  /** Controls whether to focus the first tabbable element inside the focus lock. */
+  autoFocusFirstElem?: boolean | (() => HTMLElement | null);
+  /** Content inside the focus lock. */
+  children?: ReactNode;
+  /**  Whether the focus lock is active or not. */
+  isFocusLockEnabled?: boolean;
+  /** Whether to return the focus to the previous active element on closing the drawer. */
+  shouldReturnFocus?: boolean;
+}
+
+export declare type OverridesType = {
+  Sidebar?: {
+    component?: React.ComponentType<SidebarProps>;
+    /**
+     * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release. See DSP-2673 for more information.
+     */
+    cssFn?: (defaultStyles: CSSObject) => CSSObject;
+  };
+  Content?: {
+    component?: React.ComponentType<ContentProps>;
+    /**
+     * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release. See DSP-2673 for more information.
+     */
+    cssFn?: (defaultStyles: CSSObject) => CSSObject;
+  };
+};
+
+export declare type SidebarCSSProps = Omit<SidebarProps, 'cssFn'>;
+
+export declare interface SidebarProps extends React.HTMLProps<HTMLDivElement> {
+  /**
+   * @deprecated Please avoid using this prop as we intend to remove the prop completely in a future release. See DSP-2673 for more information.
+   */
+  cssFn: (defaultStyles: CSSObject) => CSSObject;
+}
+
+export declare type Widths = {
+  extended: string;
+  full: string;
+  medium: number;
+  narrow: number;
+  wide: number;
+};
+
+export {};
+```