@atlaskit/drawer 7.11.0 → 7.12.0

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/drawer
 
+## 7.12.0
+
+### Minor Changes
+
+- [#111878](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111878)
+  [`223959ef57c80`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/223959ef57c80) -
+  Explicitly set jsxRuntime to classic via pragma comments in order to avoid issues where jsxRuntime
+  is implicitly set to automatic.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 7.11.0
 
 ### Minor Changes
@@ -23,7 +36,7 @@
 
 - [#102398](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/102398)
   [`872ce80f5ef9`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/872ce80f5ef9) -
-  Add support for React 18.
+  Add support for React 18 in non-strict mode.
 
 ## 7.8.0
 

package/dist/cjs/components/blanket.js

@@ -10,8 +10,13 @@ var _react2 = require("@emotion/react");
 var _blanket = _interopRequireDefault(require("@atlaskit/blanket"));
 var _motion = require("@atlaskit/motion");
 var _constants = require("../constants");
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
 var blanketStyles = (0, _react2.css)({
   position: 'relative'
 });

package/dist/cjs/components/index.js

@@ -27,7 +27,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
 var packageName = "@atlaskit/drawer";
-var packageVersion = "7.11.0";
+var packageVersion = "7.12.0";
 var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
 var createAndFireOnClick = function createAndFireOnClick(createAnalyticsEvent, trigger) {
   return createAndFireEventOnAtlaskit({

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

@@ -11,7 +11,11 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _excluded = ["cssFn", "scrollContentLabel"];
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var defaultStyles = {
   flex: 1,
   overflow: 'auto',
@@ -45,7 +49,7 @@ var Content = function Content(_ref) {
    * a complete override with no chance of partially changing styles.
    */
   return (0, _react2.jsx)("div", (0, _extends2.default)({
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     css: (0, _react2.css)(cssFn(defaultStyles)),
     ref: scrollableRef
     // tabindex is allowed here so that keyboard users can scroll content

package/dist/cjs/components/primitives/drawer-wrapper.js

@@ -13,7 +13,11 @@ var _colors = require("@atlaskit/theme/colors");
 var _tokens = require("@atlaskit/tokens");
 var _usePreventProgrammaticScroll = _interopRequireDefault(require("./hooks/use-prevent-programmatic-scroll"));
 var _css;
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var wrapperWidth = exports.wrapperWidth = {
   full: {
     width: '100vw'

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

@@ -20,7 +20,11 @@ var _focusLock = _interopRequireDefault(require("./focus-lock"));
 var _sidebar = _interopRequireDefault(require("./sidebar"));
 var _excluded = ["component"],
   _excluded2 = ["component"];
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 // Misc.
 // ------------------------------
 

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

@@ -10,7 +10,11 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _excluded = ["cssFn"];
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var defaultStyle = {
   alignItems: 'center',
   boxSizing: 'border-box',
@@ -29,7 +33,7 @@ var sidebarCSS = function sidebarCSS() {
 var Sidebar = function Sidebar(_ref) {
   var cssFn = _ref.cssFn,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
+  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   return (0, _react.jsx)("div", (0, _extends2.default)({
     css: (0, _react.css)(cssFn(defaultStyle))
   }, props));

package/dist/es2019/components/blanket.js

@@ -1,5 +1,10 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import React from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import AkBlanket from '@atlaskit/blanket';
 import { ExitingPersistence, FadeIn } from '@atlaskit/motion';

package/dist/es2019/components/index.js

@@ -8,7 +8,7 @@ import { defaultFocusLockSettings } from '../constants';
 import Blanket from './blanket';
 import DrawerPrimitive from './primitives';
 const packageName = "@atlaskit/drawer";
-const packageVersion = "7.11.0";
+const packageVersion = "7.12.0";
 const createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 const createAndFireOnClick = (createAnalyticsEvent, trigger) => createAndFireEventOnAtlaskit({
   action: 'dismissed',

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

@@ -1,7 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
 import { useEffect, useRef, useState } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 const defaultStyles = {
   flex: 1,
@@ -31,7 +36,7 @@ const Content = ({
    * a complete override with no chance of partially changing styles.
    */
   return jsx("div", _extends({
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     css: css(cssFn(defaultStyles)),
     ref: scrollableRef
     // tabindex is allowed here so that keyboard users can scroll content

package/dist/es2019/components/primitives/drawer-wrapper.js

@@ -1,5 +1,10 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { forwardRef, useCallback } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { useMergeRefs } from 'use-callback-ref';
 import { N0 } from '@atlaskit/theme/colors';

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

@@ -1,7 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
 import { useCallback, useRef } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { IconButton } from '@atlaskit/button/new';
 import ArrowLeft from '@atlaskit/icon/glyph/arrow-left';

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

@@ -1,6 +1,10 @@
 import _extends from "@babel/runtime/helpers/extends";
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N500 } from '@atlaskit/theme/colors';
 const defaultStyle = {
@@ -20,7 +24,7 @@ const Sidebar = ({
   cssFn,
   ...props
 }) => {
-  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
+  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   return jsx("div", _extends({
     css: css(cssFn(defaultStyle))
   }, props));

package/dist/esm/components/blanket.js

@@ -1,5 +1,10 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import React from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import AkBlanket from '@atlaskit/blanket';
 import { ExitingPersistence, FadeIn } from '@atlaskit/motion';

package/dist/esm/components/index.js

@@ -18,7 +18,7 @@ import { defaultFocusLockSettings } from '../constants';
 import Blanket from './blanket';
 import DrawerPrimitive from './primitives';
 var packageName = "@atlaskit/drawer";
-var packageVersion = "7.11.0";
+var packageVersion = "7.12.0";
 var createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 var createAndFireOnClick = function createAndFireOnClick(createAnalyticsEvent, trigger) {
   return createAndFireEventOnAtlaskit({

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

@@ -2,9 +2,14 @@ import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["cssFn", "scrollContentLabel"];
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
 import { useEffect, useRef, useState } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 var defaultStyles = {
   flex: 1,
@@ -39,7 +44,7 @@ var Content = function Content(_ref) {
    * a complete override with no chance of partially changing styles.
    */
   return jsx("div", _extends({
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage
+    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
     css: css(cssFn(defaultStyles)),
     ref: scrollableRef
     // tabindex is allowed here so that keyboard users can scroll content

package/dist/esm/components/primitives/drawer-wrapper.js

@@ -1,7 +1,12 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _css;
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { forwardRef, useCallback } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { useMergeRefs } from 'use-callback-ref';
 import { N0 } from '@atlaskit/theme/colors';

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

@@ -2,9 +2,14 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["component"],
   _excluded2 = ["component"];
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
 import { useCallback, useRef } from 'react';
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { IconButton } from '@atlaskit/button/new';
 import ArrowLeft from '@atlaskit/icon/glyph/arrow-left';

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

@@ -1,8 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["cssFn"];
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { N500 } from '@atlaskit/theme/colors';
 var defaultStyle = {
@@ -23,7 +27,7 @@ var sidebarCSS = function sidebarCSS() {
 var Sidebar = function Sidebar(_ref) {
   var cssFn = _ref.cssFn,
     props = _objectWithoutProperties(_ref, _excluded);
-  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props
+  // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @repo/internal/react/no-unsafe-spread-props, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   return jsx("div", _extends({
     css: css(cssFn(defaultStyle))
   }, props));

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

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';

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

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type CSSObject, jsx } from '@emotion/react';
 import { type ContentProps } from '../types';

package/dist/types/components/primitives/drawer-wrapper.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type ReactElement, type Ref } from 'react';
 import { type DrawerPrimitiveProps, type Widths } from '../types';

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

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import { type DrawerPrimitiveProps } from '../types';

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

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type FC } from 'react';
 import { type CSSObject } from '@emotion/react';

package/dist/types-ts4.5/components/blanket.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import React from 'react';
 import { jsx } from '@emotion/react';

package/dist/types-ts4.5/components/primitives/content.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type CSSObject, jsx } from '@emotion/react';
 import { type ContentProps } from '../types';

package/dist/types-ts4.5/components/primitives/drawer-wrapper.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type ReactElement, type Ref } from 'react';
 import { type DrawerPrimitiveProps, type Widths } from '../types';

package/dist/types-ts4.5/components/primitives/index.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import { type DrawerPrimitiveProps } from '../types';

package/dist/types-ts4.5/components/primitives/sidebar.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @jsxRuntime classic
+ */
 /** @jsx jsx */
 import { type FC } from 'react';
 import { type CSSObject } from '@emotion/react';

package/package.json

@@ -1,101 +1,101 @@
 {
-  "name": "@atlaskit/drawer",
-  "version": "7.11.0",
-  "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-mirror",
-  "author": "Atlassian Pty Ltd",
-  "license": "Apache-2.0",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "module:es2019": "dist/es2019/index.js",
-  "types": "dist/types/index.d.ts",
-  "typesVersions": {
-    ">=4.5 <4.9": {
-      "*": [
-        "dist/types-ts4.5/*",
-        "dist/types-ts4.5/index.d.ts"
-      ]
-    }
-  },
-  "sideEffects": false,
-  "atlaskit:src": "src/index.tsx",
-  "af:exports": {
-    ".": "./src/index.tsx",
-    "./constants": "./src/constants.tsx"
-  },
-  "homepage": "https://atlassian.design/components/drawer",
-  "atlassian": {
-    "team": "Design System Team",
-    "releaseModel": "continuous",
-    "productPushConsumption": [
-      "jira"
-    ],
-    "website": {
-      "name": "Drawer",
-      "category": "Components"
-    },
-    "runReact18": true
-  },
-  "dependencies": {
-    "@atlaskit/analytics-next": "^9.3.0",
-    "@atlaskit/blanket": "^13.1.0",
-    "@atlaskit/button": "^17.17.0",
-    "@atlaskit/icon": "^22.3.0",
-    "@atlaskit/motion": "^1.6.0",
-    "@atlaskit/portal": "^4.5.0",
-    "@atlaskit/theme": "^12.8.0",
-    "@atlaskit/tokens": "^1.49.0",
-    "@babel/runtime": "^7.0.0",
-    "@emotion/react": "^11.7.1",
-    "bind-event-listener": "^3.0.0",
-    "exenv": "^1.2.2",
-    "react-focus-lock": "^2.9.5",
-    "react-scrolllock": "^5.0.1",
-    "tiny-invariant": "^1.2.0",
-    "use-callback-ref": "^1.2.3"
-  },
-  "peerDependencies": {
-    "react": "^16.8.0 || ^17.0.0 || ~18.2.0"
-  },
-  "devDependencies": {
-    "@af/accessibility-testing": "*",
-    "@af/integration-testing": "*",
-    "@af/visual-regression": "*",
-    "@atlaskit/ds-lib": "^2.3.0",
-    "@atlaskit/ssr": "*",
-    "@atlaskit/visual-regression": "*",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/user-event": "^14.4.3",
-    "@types/exenv": "^1.2.0",
-    "lodash": "^4.17.21",
-    "react-dom": "^16.8.0",
-    "react-lorem-component": "^0.13.0",
-    "typescript": "~5.4.2",
-    "wait-for-expect": "^1.2.0"
-  },
-  "techstack": {
-    "@atlassian/frontend": {
-      "import-structure": "atlassian-conventions"
-    },
-    "@repo/internal": {
-      "dom-events": "use-bind-event-listener",
-      "design-system": "v1",
-      "analytics": "analytics-next",
-      "design-tokens": [
-        "color",
-        "spacing"
-      ],
-      "styling": [
-        "static",
-        "emotion"
-      ],
-      "deprecation": "no-deprecated-imports",
-      "ui-components": [
-        "primitives"
-      ]
-    }
-  }
-}
+	"name": "@atlaskit/drawer",
+	"version": "7.12.0",
+	"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-mirror",
+	"author": "Atlassian Pty Ltd",
+	"license": "Apache-2.0",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"module:es2019": "dist/es2019/index.js",
+	"types": "dist/types/index.d.ts",
+	"typesVersions": {
+		">=4.5 <4.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
+		}
+	},
+	"sideEffects": false,
+	"atlaskit:src": "src/index.tsx",
+	"af:exports": {
+		".": "./src/index.tsx",
+		"./constants": "./src/constants.tsx"
+	},
+	"homepage": "https://atlassian.design/components/drawer",
+	"atlassian": {
+		"team": "Design System Team",
+		"releaseModel": "continuous",
+		"productPushConsumption": [
+			"jira"
+		],
+		"website": {
+			"name": "Drawer",
+			"category": "Components"
+		},
+		"runReact18": true
+	},
+	"dependencies": {
+		"@atlaskit/analytics-next": "^9.3.0",
+		"@atlaskit/blanket": "^13.2.0",
+		"@atlaskit/button": "^17.19.0",
+		"@atlaskit/icon": "^22.4.0",
+		"@atlaskit/motion": "^1.7.0",
+		"@atlaskit/portal": "^4.6.0",
+		"@atlaskit/theme": "^12.10.0",
+		"@atlaskit/tokens": "^1.51.0",
+		"@babel/runtime": "^7.0.0",
+		"@emotion/react": "^11.7.1",
+		"bind-event-listener": "^3.0.0",
+		"exenv": "^1.2.2",
+		"react-focus-lock": "^2.9.5",
+		"react-scrolllock": "^5.0.1",
+		"tiny-invariant": "^1.2.0",
+		"use-callback-ref": "^1.2.3"
+	},
+	"peerDependencies": {
+		"react": "^16.8.0 || ^17.0.0 || ~18.2.0"
+	},
+	"devDependencies": {
+		"@af/accessibility-testing": "*",
+		"@af/integration-testing": "*",
+		"@af/visual-regression": "*",
+		"@atlaskit/ds-lib": "^2.3.0",
+		"@atlaskit/ssr": "*",
+		"@atlaskit/visual-regression": "*",
+		"@testing-library/react": "^12.1.5",
+		"@testing-library/user-event": "^14.4.3",
+		"@types/exenv": "^1.2.0",
+		"lodash": "^4.17.21",
+		"react-dom": "^16.8.0",
+		"react-lorem-component": "^0.13.0",
+		"typescript": "~5.4.2",
+		"wait-for-expect": "^1.2.0"
+	},
+	"techstack": {
+		"@atlassian/frontend": {
+			"import-structure": "atlassian-conventions"
+		},
+		"@repo/internal": {
+			"dom-events": "use-bind-event-listener",
+			"design-system": "v1",
+			"analytics": "analytics-next",
+			"design-tokens": [
+				"color",
+				"spacing"
+			],
+			"styling": [
+				"static",
+				"emotion"
+			],
+			"deprecation": "no-deprecated-imports",
+			"ui-components": [
+				"primitives"
+			]
+		}
+	}
+}

package/report.api.md

@@ -2,7 +2,8 @@
 
 ## API Report File for "@atlaskit/drawer"
 
-> Do not edit this file. This report is auto-generated using [API Extractor](https://api-extractor.com/).
+> Do not edit this file. This report is auto-generated using
+> [API Extractor](https://api-extractor.com/).
 > [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
 
 ### Table of contents
@@ -26,15 +27,15 @@ import { WithContextProps } from '@atlaskit/analytics-next';
 
 // @public (undocumented)
 export interface BaseProps {
-  children?: ReactNode;
-  icon?: ComponentType<any>;
-  onCloseComplete?: (node: HTMLElement | null) => void;
-  onOpenComplete?: (node: HTMLElement | null) => void;
-  overrides?: OverridesType;
-  // @deprecated (undocumented)
-  shouldUnmountOnExit?: boolean;
-  testId?: string;
-  width?: DrawerWidth;
+	children?: ReactNode;
+	icon?: ComponentType<any>;
+	onCloseComplete?: (node: HTMLElement | null) => void;
+	onOpenComplete?: (node: HTMLElement | null) => void;
+	overrides?: OverridesType;
+	// @deprecated (undocumented)
+	shouldUnmountOnExit?: boolean;
+	testId?: string;
+	width?: DrawerWidth;
 }
 
 // @public
@@ -45,145 +46,133 @@ export type ContentCSSProps = Omit<ContentProps, 'cssFn'>;
 
 // @public (undocumented)
 export interface ContentProps extends React.HTMLProps<HTMLDivElement> {
-  // @deprecated (undocumented)
-  cssFn: (defaultStyles: CSSObject) => CSSObject;
+	// @deprecated (undocumented)
+	cssFn: (defaultStyles: CSSObject) => CSSObject;
 }
 
 // @public (undocumented)
 const _default: React_2.ForwardRefExoticComponent<
-  Pick<
-    Pick<
-      Omit<DrawerProps, keyof WithAnalyticsEventsProps>,
-      | 'children'
-      | 'icon'
-      | 'isOpen'
-      | 'onClose'
-      | 'onCloseComplete'
-      | 'onKeyDown'
-      | 'onOpenComplete'
-      | 'overrides'
-      | 'shouldUnmountOnExit'
-      | 'testId'
-      | 'zIndex'
-      | keyof DrawerLabel
-    > &
-      Partial<
-        Pick<
-          Omit<DrawerProps, keyof WithAnalyticsEventsProps>,
-          'width' | keyof FocusLockSettings
-        >
-      > &
-      Partial<
-        Pick<
-          {
-            autoFocusFirstElem?:
-              | (() => HTMLElement | null)
-              | boolean
-              | undefined;
-            isFocusLockEnabled?: boolean | undefined;
-            shouldReturnFocus?: boolean | undefined;
-            width: DrawerWidth;
-          },
-          never
-        >
-      > &
-      React_2.RefAttributes<any> &
-      WithContextProps,
-    | 'analyticsContext'
-    | 'children'
-    | 'icon'
-    | 'isOpen'
-    | 'key'
-    | 'onClose'
-    | 'onCloseComplete'
-    | 'onKeyDown'
-    | 'onOpenComplete'
-    | 'overrides'
-    | 'shouldUnmountOnExit'
-    | 'testId'
-    | 'width'
-    | 'zIndex'
-    | keyof DrawerLabel
-    | keyof FocusLockSettings
-  > &
-    React_2.RefAttributes<any>
+	Pick<
+		Pick<
+			Omit<DrawerProps, keyof WithAnalyticsEventsProps>,
+			| 'children'
+			| 'icon'
+			| 'isOpen'
+			| 'onClose'
+			| 'onCloseComplete'
+			| 'onKeyDown'
+			| 'onOpenComplete'
+			| 'overrides'
+			| 'shouldUnmountOnExit'
+			| 'testId'
+			| 'zIndex'
+			| keyof DrawerLabel
+		> &
+			Partial<
+				Pick<Omit<DrawerProps, keyof WithAnalyticsEventsProps>, 'width' | keyof FocusLockSettings>
+			> &
+			Partial<
+				Pick<
+					{
+						autoFocusFirstElem?: (() => HTMLElement | null) | boolean | undefined;
+						isFocusLockEnabled?: boolean | undefined;
+						shouldReturnFocus?: boolean | undefined;
+						width: DrawerWidth;
+					},
+					never
+				>
+			> &
+			React_2.RefAttributes<any> &
+			WithContextProps,
+		| 'analyticsContext'
+		| 'children'
+		| 'icon'
+		| 'isOpen'
+		| 'key'
+		| 'onClose'
+		| 'onCloseComplete'
+		| 'onKeyDown'
+		| 'onOpenComplete'
+		| 'overrides'
+		| 'shouldUnmountOnExit'
+		| 'testId'
+		| 'width'
+		| 'zIndex'
+		| keyof DrawerLabel
+		| keyof FocusLockSettings
+	> &
+		React_2.RefAttributes<any>
 >;
 export default _default;
 
 // @public (undocumented)
 export type DefaultsType = {
-  Sidebar: {
-    component: React.ComponentType<SidebarProps>;
-    cssFn: (defaultStyles: CSSObject) => CSSObject;
-  };
-  Content: {
-    component: React.ComponentType<ContentProps>;
-    cssFn: (defaultStyles: CSSObject) => CSSObject;
-  };
+	Sidebar: {
+		component: React.ComponentType<SidebarProps>;
+		cssFn: (defaultStyles: CSSObject) => CSSObject;
+	};
+	Content: {
+		component: React.ComponentType<ContentProps>;
+		cssFn: (defaultStyles: CSSObject) => CSSObject;
+	};
 };
 
 // @public (undocumented)
 interface DrawerLabel {
-  label?: string;
-  titleId?: string;
+	label?: string;
+	titleId?: string;
 }
 
 // @public (undocumented)
 export type DrawerPrimitiveDefaults = Pick<DefaultsType, 'Content' | 'Sidebar'>;
 
 // @public (undocumented)
-export type DrawerPrimitiveOverrides = Pick<
-  OverridesType,
-  'Content' | 'Sidebar'
->;
+export type DrawerPrimitiveOverrides = Pick<OverridesType, 'Content' | 'Sidebar'>;
 
 // @public (undocumented)
-export interface DrawerPrimitiveProps
-  extends BaseProps,
-    FocusLockSettings,
-    DrawerLabel {
-  // (undocumented)
-  in: boolean;
-  // (undocumented)
-  onClose: (event: SyntheticEvent<HTMLElement>) => void;
+export interface DrawerPrimitiveProps extends BaseProps, FocusLockSettings, DrawerLabel {
+	// (undocumented)
+	in: boolean;
+	// (undocumented)
+	onClose: (event: SyntheticEvent<HTMLElement>) => void;
 }
 
 // @public (undocumented)
 export type DrawerProps = BaseProps &
-  FocusLockSettings &
-  WithAnalyticsEventsProps &
-  DrawerLabel & {
-    onKeyDown?: (event: SyntheticEvent) => void;
-    onClose?: (event: SyntheticEvent<HTMLElement>, analyticsEvent: any) => void;
-    isOpen: boolean;
-    zIndex?: number;
-  };
+	FocusLockSettings &
+	WithAnalyticsEventsProps &
+	DrawerLabel & {
+		onKeyDown?: (event: SyntheticEvent) => void;
+		onClose?: (event: SyntheticEvent<HTMLElement>, analyticsEvent: any) => void;
+		isOpen: boolean;
+		zIndex?: number;
+	};
 
 // @public (undocumented)
 export type DrawerWidth = 'extended' | 'full' | 'medium' | 'narrow' | 'wide';
 
 // @public (undocumented)
 export interface FocusLockProps extends FocusLockSettings {
-  children?: ReactElement;
+	children?: ReactElement;
 }
 
 // @public (undocumented)
 interface FocusLockSettings {
-  autoFocusFirstElem?: (() => HTMLElement | null) | boolean;
-  isFocusLockEnabled?: boolean;
-  shouldReturnFocus?: boolean;
+	autoFocusFirstElem?: (() => HTMLElement | null) | boolean;
+	isFocusLockEnabled?: boolean;
+	shouldReturnFocus?: boolean;
 }
 
 // @public (undocumented)
 export type OverridesType = {
-  Sidebar?: {
-    component?: React.ComponentType<SidebarProps>;
-    cssFn?: (defaultStyles: CSSObject) => CSSObject;
-  };
-  Content?: {
-    component?: React.ComponentType<ContentProps>;
-    cssFn?: (defaultStyles: CSSObject) => CSSObject;
-  };
+	Sidebar?: {
+		component?: React.ComponentType<SidebarProps>;
+		cssFn?: (defaultStyles: CSSObject) => CSSObject;
+	};
+	Content?: {
+		component?: React.ComponentType<ContentProps>;
+		cssFn?: (defaultStyles: CSSObject) => CSSObject;
+	};
 };
 
 // @public (undocumented)
@@ -191,27 +180,27 @@ export type SidebarCSSProps = Omit<SidebarProps, 'cssFn'>;
 
 // @public (undocumented)
 export interface SidebarProps extends React.HTMLProps<HTMLDivElement> {
-  // @deprecated (undocumented)
-  cssFn: (defaultStyles: CSSObject) => CSSObject;
+	// @deprecated (undocumented)
+	cssFn: (defaultStyles: CSSObject) => CSSObject;
 }
 
 // @public (undocumented)
 export type Widths = {
-  extended: {
-    width: string;
-  };
-  full: {
-    width: string;
-  };
-  medium: {
-    width: number;
-  };
-  narrow: {
-    width: number;
-  };
-  wide: {
-    width: number;
-  };
+	extended: {
+		width: string;
+	};
+	full: {
+		width: string;
+	};
+	medium: {
+		width: number;
+	};
+	narrow: {
+		width: number;
+	};
+	wide: {
+		width: number;
+	};
 };
 
 // (No @packageDocumentation comment for this package)
@@ -225,7 +214,7 @@ export type Widths = {
 
 ```json
 {
-  "react": "^16.8.0"
+	"react": "^16.8.0"
 }
 ```