@atlaskit/page-layout 4.2.26 → 4.2.28

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/page-layout
 
+## 4.2.28
+
+### Patch Changes
+
+- Updated dependencies
+
+## 4.2.27
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 4.2.26
 
 ### Patch Changes

package/dist/cjs/components/resize-control/index.js

@@ -23,7 +23,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /**
  * @jsxRuntime classic
  * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+ */ // eslint-disable-next-line @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled
 /* import useUpdateCssVar from '../../controllers/use-update-css-vars'; */
 var cssSelector = (0, _defineProperty2.default)({}, _constants.RESIZE_CONTROL_SELECTOR, true);
 var resizeControlStyles = (0, _react2.css)({
@@ -172,11 +172,14 @@ var ResizeControl = function ResizeControl(_ref) {
         // Will return sidebar to the same size it was before the resizing started
         if (event.key === 'Escape') {
           sidebarWidth.current = Math.max(leftSidebarState.lastLeftSidebarWidth, _constants.COLLAPSED_LEFT_SIDEBAR_WIDTH);
+
+          // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
           document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(sidebarWidth.current, "px"));
           onFinishResizing();
         }
       }
     }]);
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.setAttribute(_constants.IS_SIDEBAR_DRAGGING, 'true');
     var newLeftbarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, {
       isResizing: true
@@ -189,6 +192,7 @@ var ResizeControl = function ResizeControl(_ref) {
     onUpdateResize.cancel();
     (_unbindEvents$current = unbindEvents.current) === null || _unbindEvents$current === void 0 || _unbindEvents$current.call(unbindEvents);
     unbindEvents.current = null;
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.removeAttribute(_constants.IS_SIDEBAR_DRAGGING);
     offset.current = 0;
     collapseLeftSidebar(undefined, true);
@@ -212,6 +216,8 @@ var ResizeControl = function ResizeControl(_ref) {
         }
         var delta = Math.max(Math.min(clientX - leftSidebarWidth - leftPanelWidth, maxWidth - leftSidebarWidth - leftPanelWidth), _constants.COLLAPSED_LEFT_SIDEBAR_WIDTH - leftSidebarWidth - leftPanelWidth);
         sidebarWidth.current = Math.max(leftSidebarWidth + delta - offset.current, _constants.COLLAPSED_LEFT_SIDEBAR_WIDTH);
+
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(sidebarWidth.current, "px"));
       });
     }),
@@ -222,6 +228,8 @@ var ResizeControl = function ResizeControl(_ref) {
     if (isLeftSidebarCollapsed) {
       return;
     }
+
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.removeAttribute(_constants.IS_SIDEBAR_DRAGGING);
 
     // TODO: the control flow is pretty strange as the first codepath which calls `collapseLeftSidebar()`
@@ -232,6 +240,7 @@ var ResizeControl = function ResizeControl(_ref) {
     // collapse the navigation
     if (sidebarWidth.current < _constants.MIN_LEFT_SIDEBAR_DRAG_THRESHOLD) {
       // TODO: for this codepath, `onCollapse` occurs before `onResizeEnd` which seems wrong
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(_constants.COLLAPSED_LEFT_SIDEBAR_WIDTH, "px"));
       collapseLeftSidebar(undefined, true);
     }
@@ -239,6 +248,7 @@ var ResizeControl = function ResizeControl(_ref) {
     // min threshold and default width
     // expand the nav to the default width
     else if (sidebarWidth.current > _constants.MIN_LEFT_SIDEBAR_DRAG_THRESHOLD && sidebarWidth.current < _constants.DEFAULT_LEFT_SIDEBAR_WIDTH) {
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(_constants.DEFAULT_LEFT_SIDEBAR_WIDTH, "px"));
       updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)({
         isResizing: false
@@ -288,9 +298,11 @@ var ResizeControl = function ResizeControl(_ref) {
       var width = leftSidebarWidth + stepValue;
       if (width <= _constants.DEFAULT_LEFT_SIDEBAR_WIDTH) {
         width = _constants.DEFAULT_LEFT_SIDEBAR_WIDTH;
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(_constants.DEFAULT_LEFT_SIDEBAR_WIDTH - 20, "px"));
       } else if (width > maxWidth) {
         width = maxWidth;
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(maxWidth + 20, "px"));
       } else if (hasModifierKey) {
         width = isRightOrBottomArrow ? maxWidth : _constants.DEFAULT_LEFT_SIDEBAR_WIDTH;
@@ -301,6 +313,8 @@ var ResizeControl = function ResizeControl(_ref) {
       requestAnimationFrame(function () {
         keyboardEventTimeout.current = window.setTimeout(function () {
           keyboardEventTimeout.current && clearTimeout(keyboardEventTimeout.current);
+
+          // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
           document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(width, "px"));
           var updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _constants.VAR_LEFT_SIDEBAR_WIDTH, width), "lastLeftSidebarWidth", width));
           setLeftSidebarState(updatedLeftSidebarState);

package/dist/cjs/components/resize-control/resize-button.js

@@ -24,7 +24,7 @@ var _excluded = ["isLeftSidebarCollapsed", "label", "onClick", "testId"],
  * @jsxRuntime classic
  * @jsx jsx
  */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 var hitAreaSpanStyles = (0, _react.css)({
   position: 'absolute',
   insetBlockEnd: "var(--ds-space-negative-300, -24px)",

package/dist/cjs/components/resize-control/shadow.js

@@ -12,7 +12,7 @@ var _hooks = require("../../common/hooks");
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var colorStops = "\n    rgba(0, 0, 0, 0.2) 0px,\n    rgba(0, 0, 0, 0.2) 1px,\n    rgba(0, 0, 0, 0.1) 1px,\n    rgba(0, 0, 0, 0) 100%\n  ";
 var direction = 'to left';

package/dist/cjs/components/skip-links/skip-link-components.js

@@ -17,7 +17,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */ /**
  * @jsxRuntime classic
  * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 // 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
 var prefersReducedMotionStyles = (0, _react.css)((0, _motion.prefersReducedMotion)());
 var skipLinkStyles = (0, _react.css)({
@@ -98,7 +98,8 @@ var SkipLinkWrapper = exports.SkipLinkWrapper = function SkipLinkWrapper(_ref) {
   };
   var escapeHandler = function escapeHandler(event) {
     if (event.keyCode === 27) {
-      var container = document.querySelector("[".concat(_constants.PAGE_LAYOUT_CONTAINER_SELECTOR, "=\"true\"]"));
+      var container = document.querySelector("[".concat(_constants.PAGE_LAYOUT_CONTAINER_SELECTOR, "=\"true\"]") // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+      );
       if (container !== null) {
         container.focus();
       }
@@ -142,6 +143,7 @@ var focusTargetRef = function focusTargetRef(href) {
     event.preventDefault();
     var targetRef = document.querySelector(href);
 
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     // @ts-ignore
     var key = event.which || event.keycode;
     // if it is a keypress and the key is not
@@ -156,7 +158,9 @@ var focusTargetRef = function focusTargetRef(href) {
       // @ts-ignore
       targetRef.focus();
       document.activeElement && document.activeElement.scrollIntoView({
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         behavior: 'smooth'
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       });
       window.scrollTo(0, 0);
     }

package/dist/cjs/components/slots/banner-slot.js

@@ -19,7 +19,7 @@ var _slotDimensions = _interopRequireDefault(require("./slot-dimensions"));
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var bannerStyles = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

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

@@ -11,7 +11,7 @@ var _constants = require("../../common/constants");
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var contentStyles = (0, _react.css)({
   display: 'flex',

package/dist/cjs/components/slots/internal/left-sidebar-inner.js

@@ -16,7 +16,7 @@ var _hooks = require("../../../common/hooks");
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 // 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
 var prefersReducedMotionStyles = (0, _react.css)((0, _motion.prefersReducedMotion)());

package/dist/cjs/components/slots/internal/resizable-children-wrapper.js

@@ -13,7 +13,7 @@ var _hooks = require("../../../common/hooks");
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 // 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
 var prefersReducedMotionStyles = (0, _react.css)((0, _motion.prefersReducedMotion)());

package/dist/cjs/components/slots/internal/slot-focus-ring.js

@@ -11,7 +11,7 @@ var _colors = require("@atlaskit/theme/colors");
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var focusStyles = (0, _react.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766

package/dist/cjs/components/slots/left-panel.js

@@ -19,7 +19,7 @@ var _slotDimensions = _interopRequireDefault(require("./slot-dimensions"));
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var leftPanelStyles = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

package/dist/cjs/components/slots/left-sidebar-without-resize.js

@@ -19,7 +19,7 @@ var _slotDimensions = _interopRequireDefault(require("./slot-dimensions"));
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 /**
  * __Left sidebar without resize__

package/dist/cjs/components/slots/left-sidebar.js

@@ -24,7 +24,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */ /**
  * @jsxRuntime classic
  * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 var openBackdropStyles = (0, _react2.css)({
   width: '100%',
   height: '100%',
@@ -99,6 +99,8 @@ var LeftSidebar = function LeftSidebar(props) {
       handlerRef.current = function (event) {
         mouseXRef.current = event.clientX;
       };
+
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.addEventListener('mousemove', handlerRef.current);
     }
     if (!isLocked && handlerRef.current) {
@@ -109,11 +111,13 @@ var LeftSidebar = function LeftSidebar(props) {
           });
         });
       }
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.removeEventListener('mousemove', handlerRef.current);
       handlerRef.current = null;
     }
     return function () {
       if (handlerRef.current) {
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.removeEventListener('mousemove', handlerRef.current);
       }
     };
@@ -192,6 +196,8 @@ var LeftSidebar = function LeftSidebar(props) {
         }
       };
     }
+
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.addEventListener('mouseover', mouseOverEventRef.current, {
       capture: true,
       passive: true
@@ -206,7 +212,9 @@ var LeftSidebar = function LeftSidebar(props) {
     }, _constants.FLYOUT_DELAY);
   };
   var removeMouseOverListener = function removeMouseOverListener() {
-    mouseOverEventRef.current && document.removeEventListener('mouseover', mouseOverEventRef.current, {
+    mouseOverEventRef.current &&
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    document.removeEventListener('mouseover', mouseOverEventRef.current, {
       capture: true,
       passive: true
     });

package/dist/cjs/components/slots/main.js

@@ -20,7 +20,7 @@ var _slotFocusRing = _interopRequireDefault(require("./internal/slot-focus-ring"
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 // 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
 var prefersReducedMotionStyles = (0, _react2.css)((0, _accessibility.prefersReducedMotion)());

package/dist/cjs/components/slots/page-layout.js

@@ -18,7 +18,7 @@ var _skipLinks = require("../skip-links");
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var pageLayoutSelector = (0, _defineProperty2.default)({}, _constants.PAGE_LAYOUT_CONTAINER_SELECTOR, true);
 var gridTemplateAreasMobile = "\n".concat("\n  \"", _constants.LEFT_PANEL, " ").concat(_constants.BANNER, "\"\n  ", "\n  \"").concat(_constants.LEFT_PANEL, " ").concat(_constants.TOP_NAVIGATION, "\"\n  ", "\n  \"").concat(_constants.LEFT_PANEL, " ").concat(_constants.CONTENT, "\"\n ");

package/dist/cjs/components/slots/right-panel.js

@@ -19,7 +19,7 @@ var _slotDimensions = _interopRequireDefault(require("./slot-dimensions"));
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var baseStyles = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

package/dist/cjs/components/slots/right-sidebar.js

@@ -19,7 +19,7 @@ var _slotDimensions = _interopRequireDefault(require("./slot-dimensions"));
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 /**
  * This inner wrapper is required to allow the sidebar to be `position: fixed`.

package/dist/cjs/components/slots/top-navigation.js

@@ -19,7 +19,7 @@ var _slotDimensions = _interopRequireDefault(require("./slot-dimensions"));
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 
 var topNavigationStyles = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766

package/dist/es2019/components/resize-control/index.js

@@ -5,7 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
  */
 import { Fragment, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @typescript-eslint/consistent-type-imports, @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled
 import { css, Global, jsx } from '@emotion/react';
 import { bindAll } from 'bind-event-listener';
 import rafSchd from 'raf-schd';
@@ -165,11 +165,14 @@ const ResizeControl = ({
         // Will return sidebar to the same size it was before the resizing started
         if (event.key === 'Escape') {
           sidebarWidth.current = Math.max(leftSidebarState.lastLeftSidebarWidth, COLLAPSED_LEFT_SIDEBAR_WIDTH);
+
+          // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
           document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${sidebarWidth.current}px`);
           onFinishResizing();
         }
       }
     }]);
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.setAttribute(IS_SIDEBAR_DRAGGING, 'true');
     const newLeftbarState = {
       ...leftSidebarState,
@@ -183,6 +186,7 @@ const ResizeControl = ({
     onUpdateResize.cancel();
     (_unbindEvents$current = unbindEvents.current) === null || _unbindEvents$current === void 0 ? void 0 : _unbindEvents$current.call(unbindEvents);
     unbindEvents.current = null;
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.removeAttribute(IS_SIDEBAR_DRAGGING);
     offset.current = 0;
     collapseLeftSidebar(undefined, true);
@@ -206,6 +210,8 @@ const ResizeControl = ({
     }
     const delta = Math.max(Math.min(clientX - leftSidebarWidth - leftPanelWidth, maxWidth - leftSidebarWidth - leftPanelWidth), COLLAPSED_LEFT_SIDEBAR_WIDTH - leftSidebarWidth - leftPanelWidth);
     sidebarWidth.current = Math.max(leftSidebarWidth + delta - offset.current, COLLAPSED_LEFT_SIDEBAR_WIDTH);
+
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${sidebarWidth.current}px`);
   }));
   const onFinishResizing = () => {
@@ -213,6 +219,8 @@ const ResizeControl = ({
     if (isLeftSidebarCollapsed) {
       return;
     }
+
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.documentElement.removeAttribute(IS_SIDEBAR_DRAGGING);
 
     // TODO: the control flow is pretty strange as the first codepath which calls `collapseLeftSidebar()`
@@ -223,6 +231,7 @@ const ResizeControl = ({
     // collapse the navigation
     if (sidebarWidth.current < MIN_LEFT_SIDEBAR_DRAG_THRESHOLD) {
       // TODO: for this codepath, `onCollapse` occurs before `onResizeEnd` which seems wrong
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${COLLAPSED_LEFT_SIDEBAR_WIDTH}px`);
       collapseLeftSidebar(undefined, true);
     }
@@ -230,6 +239,7 @@ const ResizeControl = ({
     // min threshold and default width
     // expand the nav to the default width
     else if (sidebarWidth.current > MIN_LEFT_SIDEBAR_DRAG_THRESHOLD && sidebarWidth.current < DEFAULT_LEFT_SIDEBAR_WIDTH) {
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${DEFAULT_LEFT_SIDEBAR_WIDTH}px`);
       updatedLeftSidebarState = {
         ...leftSidebarState,
@@ -290,9 +300,11 @@ const ResizeControl = ({
       let width = leftSidebarWidth + stepValue;
       if (width <= DEFAULT_LEFT_SIDEBAR_WIDTH) {
         width = DEFAULT_LEFT_SIDEBAR_WIDTH;
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${DEFAULT_LEFT_SIDEBAR_WIDTH - 20}px`);
       } else if (width > maxWidth) {
         width = maxWidth;
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${maxWidth + 20}px`);
       } else if (hasModifierKey) {
         width = isRightOrBottomArrow ? maxWidth : DEFAULT_LEFT_SIDEBAR_WIDTH;
@@ -303,6 +315,8 @@ const ResizeControl = ({
       requestAnimationFrame(() => {
         keyboardEventTimeout.current = window.setTimeout(() => {
           keyboardEventTimeout.current && clearTimeout(keyboardEventTimeout.current);
+
+          // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
           document.documentElement.style.setProperty(`--${VAR_LEFT_SIDEBAR_WIDTH}`, `${width}px`);
           const updatedLeftSidebarState = {
             ...leftSidebarState,

package/dist/es2019/components/resize-control/resize-button.js

@@ -6,7 +6,7 @@ import _extends from "@babel/runtime/helpers/extends";
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import ChevronRight from '@atlaskit/icon/core/chevron-right';
 import { easeOut } from '@atlaskit/motion/curves';

package/dist/es2019/components/resize-control/shadow.js

@@ -3,7 +3,7 @@
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { easeOut } from '@atlaskit/motion';
 import { useIsSidebarDragging } from '../../common/hooks';

package/dist/es2019/components/skip-links/skip-link-components.js

@@ -4,7 +4,7 @@
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import Link from '@atlaskit/link';
 import { easeOut, prefersReducedMotion } from '@atlaskit/motion';
@@ -86,7 +86,9 @@ export const SkipLinkWrapper = ({
   };
   const escapeHandler = event => {
     if (event.keyCode === 27) {
-      const container = document.querySelector(`[${PAGE_LAYOUT_CONTAINER_SELECTOR}="true"]`);
+      const container = document.querySelector(`[${PAGE_LAYOUT_CONTAINER_SELECTOR}="true"]`
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+      );
       if (container !== null) {
         container.focus();
       }
@@ -124,6 +126,7 @@ const focusTargetRef = href => event => {
   event.preventDefault();
   const targetRef = document.querySelector(href);
 
+  // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
   // @ts-ignore
   const key = event.which || event.keycode;
   // if it is a keypress and the key is not
@@ -138,7 +141,9 @@ const focusTargetRef = href => event => {
     // @ts-ignore
     targetRef.focus();
     document.activeElement && document.activeElement.scrollIntoView({
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       behavior: 'smooth'
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     });
     window.scrollTo(0, 0);
   }

package/dist/es2019/components/slots/banner-slot.js

@@ -5,7 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
  */
 import { useEffect } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { BANNER, BANNER_HEIGHT, DEFAULT_BANNER_HEIGHT, LEFT_PANEL_WIDTH, RIGHT_PANEL_WIDTH, VAR_BANNER_HEIGHT } from '../../common/constants';
 import { getPageLayoutSlotSelector, resolveDimension } from '../../common/utils';

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

@@ -3,7 +3,7 @@
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { CONTENT } from '../../common/constants';
 const contentStyles = css({

package/dist/es2019/components/slots/internal/left-sidebar-inner.js

@@ -3,7 +3,7 @@
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { easeOut, prefersReducedMotion } from '@atlaskit/motion';
 import { UNSAFE_media } from '@atlaskit/primitives/responsive';

package/dist/es2019/components/slots/internal/resizable-children-wrapper.js

@@ -3,7 +3,7 @@
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { prefersReducedMotion } from '@atlaskit/motion';
 import { TRANSITION_DURATION } from '../../../common/constants';

package/dist/es2019/components/slots/internal/slot-focus-ring.js

@@ -3,7 +3,7 @@
  * @jsx jsx
  */
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { ClassNames, css, jsx } from '@emotion/react';
 import { B100 } from '@atlaskit/theme/colors';
 const focusStyles = css({

package/dist/es2019/components/slots/left-panel.js

@@ -5,7 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
  */
 import { useEffect } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { DEFAULT_LEFT_PANEL_WIDTH, LEFT_PANEL, LEFT_PANEL_WIDTH, VAR_LEFT_PANEL_WIDTH } from '../../common/constants';
 import { getPageLayoutSlotSelector, resolveDimension } from '../../common/utils';

package/dist/es2019/components/slots/left-sidebar-without-resize.js

@@ -4,7 +4,7 @@
  */
 import { useEffect } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { jsx } from '@emotion/react';
 import { VAR_LEFT_SIDEBAR_WIDTH } from '../../common/constants';
 import { resolveDimension } from '../../common/utils';

package/dist/es2019/components/slots/left-sidebar.js

@@ -5,7 +5,7 @@
  */
 import { Fragment, useCallback, useContext, useEffect, useRef } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import useCloseOnEscapePress from '@atlaskit/ds-lib/use-close-on-escape-press';
 import { easeOut } from '@atlaskit/motion';
@@ -97,6 +97,8 @@ const LeftSidebar = props => {
       handlerRef.current = event => {
         mouseXRef.current = event.clientX;
       };
+
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.addEventListener('mousemove', handlerRef.current);
     }
     if (!isLocked && handlerRef.current) {
@@ -106,11 +108,13 @@ const LeftSidebar = props => {
           isFlyoutOpen: false
         }));
       }
+      // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
       document.removeEventListener('mousemove', handlerRef.current);
       handlerRef.current = null;
     }
     return () => {
       if (handlerRef.current) {
+        // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
         document.removeEventListener('mousemove', handlerRef.current);
       }
     };
@@ -191,6 +195,8 @@ const LeftSidebar = props => {
         }
       };
     }
+
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
     document.addEventListener('mouseover', mouseOverEventRef.current, {
       capture: true,
       passive: true
@@ -204,7 +210,9 @@ const LeftSidebar = props => {
     }, FLYOUT_DELAY);
   };
   const removeMouseOverListener = () => {
-    mouseOverEventRef.current && document.removeEventListener('mouseover', mouseOverEventRef.current, {
+    mouseOverEventRef.current &&
+    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
+    document.removeEventListener('mouseover', mouseOverEventRef.current, {
       capture: true,
       passive: true
     });

package/dist/es2019/components/slots/main.js

@@ -5,7 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
  */
 import { useContext } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { prefersReducedMotion } from '@atlaskit/motion/accessibility';
 import { easeOut } from '@atlaskit/motion/curves';

package/dist/es2019/components/slots/page-layout.js

@@ -5,7 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
  */
 import { Fragment } from 'react';
 
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports
 import { css, jsx } from '@emotion/react';
 import { UNSAFE_media } from '@atlaskit/primitives/responsive';
 import { BANNER, BANNER_HEIGHT, CONTENT, DEFAULT_I18N_PROPS_SKIP_LINKS, LEFT_PANEL, LEFT_PANEL_WIDTH, PAGE_LAYOUT_CONTAINER_SELECTOR, RIGHT_PANEL, RIGHT_PANEL_WIDTH, TOP_NAVIGATION, TOP_NAVIGATION_HEIGHT } from '../../common/constants';