@atlaskit/page-layout 1.3.7 → 1.3.9

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

@@ -1,11 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 /** @jsx jsx */
 import { useCallback, useContext, useMemo, useRef, useState } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -19,9 +16,7 @@ import { SidebarResizeContext } from '../../controllers/sidebar-resize-context';
 import GrabArea from './grab-area';
 import ResizeButton from './resize-button';
 import Shadow from './shadow';
-
 var cssSelector = _defineProperty({}, RESIZE_CONTROL_SELECTOR, true);
-
 var resizeControlStyles = css({
   position: 'absolute',
   top: 0,
@@ -32,62 +27,52 @@ var resizeControlStyles = css({
 var showResizeButtonStyles = css({
   '--ds--resize-button--opacity': 1
 });
-
 var ResizeControl = function ResizeControl(_ref) {
   var testId = _ref.testId,
-      overrides = _ref.overrides,
-      _ref$resizeButtonLabe = _ref.resizeButtonLabel,
-      resizeButtonLabel = _ref$resizeButtonLabe === void 0 ? '' : _ref$resizeButtonLabe,
-      _ref$resizeGrabAreaLa = _ref.resizeGrabAreaLabel,
-      resizeGrabAreaLabel = _ref$resizeGrabAreaLa === void 0 ? 'Resize' : _ref$resizeGrabAreaLa,
-      onResizeStart = _ref.onResizeStart,
-      onResizeEnd = _ref.onResizeEnd;
-
+    overrides = _ref.overrides,
+    _ref$resizeButtonLabe = _ref.resizeButtonLabel,
+    resizeButtonLabel = _ref$resizeButtonLabe === void 0 ? '' : _ref$resizeButtonLabe,
+    _ref$resizeGrabAreaLa = _ref.resizeGrabAreaLabel,
+    resizeGrabAreaLabel = _ref$resizeGrabAreaLa === void 0 ? 'Resize' : _ref$resizeGrabAreaLa,
+    onResizeStart = _ref.onResizeStart,
+    onResizeEnd = _ref.onResizeEnd;
   var _useContext = useContext(SidebarResizeContext),
-      expandLeftSidebar = _useContext.expandLeftSidebar,
-      collapseLeftSidebar = _useContext.collapseLeftSidebar,
-      leftSidebarState = _useContext.leftSidebarState,
-      setLeftSidebarState = _useContext.setLeftSidebarState;
-
+    expandLeftSidebar = _useContext.expandLeftSidebar,
+    collapseLeftSidebar = _useContext.collapseLeftSidebar,
+    leftSidebarState = _useContext.leftSidebarState,
+    setLeftSidebarState = _useContext.setLeftSidebarState;
   var isLeftSidebarCollapsed = leftSidebarState.isLeftSidebarCollapsed,
-      isResizing = leftSidebarState.isResizing;
-  var x = useRef(leftSidebarState[VAR_LEFT_SIDEBAR_WIDTH]); // Distance of mouse from left sidebar onMouseDown
-
+    isResizing = leftSidebarState.isResizing;
+  var x = useRef(leftSidebarState[VAR_LEFT_SIDEBAR_WIDTH]);
+  // Distance of mouse from left sidebar onMouseDown
   var offset = useRef(0);
   var keyboardEventTimeout = useRef();
-
   var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isGrabAreaFocused = _useState2[0],
-      setIsGrabAreaFocused = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    isGrabAreaFocused = _useState2[0],
+    setIsGrabAreaFocused = _useState2[1];
   var unbindEvents = useRef(null);
-
   var toggleSideBar = function toggleSideBar(e) {
     if (isResizing) {
       return;
     }
-
     if (isLeftSidebarCollapsed) {
       expandLeftSidebar();
     } else {
       collapseLeftSidebar();
-    } // Bring focus to the resize button if the grab area is
-    // "clicked" using enter/space on keyboard.
-
+    }
 
+    // Bring focus to the resize button if the grab area is
+    // "clicked" using enter/space on keyboard.
     if (e && e.nativeEvent.detail === 0) {
       var _resizeButton = document.querySelector("[".concat(RESIZE_BUTTON_SELECTOR, "]"));
-
       _resizeButton && _resizeButton.focus();
     }
   };
-
   var onMouseDown = function onMouseDown(event) {
     if (isLeftSidebarCollapsed) {
       return;
     }
-
     offset.current = event.clientX - leftSidebarState[VAR_LEFT_SIDEBAR_WIDTH] - getLeftPanelWidth();
     unbindEvents.current = bindAll(document, [{
       type: 'mousemove',
@@ -97,18 +82,14 @@ var ResizeControl = function ResizeControl(_ref) {
       listener: onMouseUp
     }]);
     document.documentElement.setAttribute(IS_SIDEBAR_DRAGGING, 'true');
-
     var newLeftbarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, {
       isResizing: true
     });
-
     setLeftSidebarState(newLeftbarState);
     onResizeStart && onResizeStart(newLeftbarState);
   };
-
   var cancelDrag = function cancelDrag(shouldCollapse) {
     var _unbindEvents$current;
-
     onMouseMove.cancel();
     (_unbindEvents$current = unbindEvents.current) === null || _unbindEvents$current === void 0 ? void 0 : _unbindEvents$current.call(unbindEvents);
     unbindEvents.current = null;
@@ -116,51 +97,44 @@ var ResizeControl = function ResizeControl(_ref) {
     offset.current = 0;
     collapseLeftSidebar(undefined, true);
   };
-
   var onMouseMove = rafSchd(function (event) {
     // Allow the sidebar to be 50% of the available page width
     var maxWidth = Math.round(window.innerWidth / 2);
     var leftPanelWidth = getLeftPanelWidth();
     var leftSidebarWidth = leftSidebarState.leftSidebarWidth;
     var invalidDrag = event.clientX < 0;
-
     if (invalidDrag) {
       cancelDrag();
     }
-
     var delta = Math.max(Math.min(event.clientX - leftSidebarWidth - leftPanelWidth, maxWidth - leftSidebarWidth - leftPanelWidth), COLLAPSED_LEFT_SIDEBAR_WIDTH - leftSidebarWidth - leftPanelWidth);
     x.current = Math.max(leftSidebarWidth + delta - offset.current, COLLAPSED_LEFT_SIDEBAR_WIDTH);
     document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(x.current, "px"));
   });
-
   var cleanupAfterResize = function cleanupAfterResize() {
     var _unbindEvents$current2;
-
     x.current = 0;
     offset.current = 0;
     (_unbindEvents$current2 = unbindEvents.current) === null || _unbindEvents$current2 === void 0 ? void 0 : _unbindEvents$current2.call(unbindEvents);
     unbindEvents.current = null;
   };
-
   var updatedLeftSidebarState = {};
-
   var onMouseUp = function onMouseUp(event) {
     if (isLeftSidebarCollapsed) {
       return;
     }
+    document.documentElement.removeAttribute(IS_SIDEBAR_DRAGGING);
 
-    document.documentElement.removeAttribute(IS_SIDEBAR_DRAGGING); // If it is dragged to below the threshold,
+    // If it is dragged to below the threshold,
     // collapse the navigation
-
     if (x.current < MIN_LEFT_SIDEBAR_DRAG_THRESHOLD) {
       document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(COLLAPSED_LEFT_SIDEBAR_WIDTH, "px"));
       collapseLeftSidebar(undefined, true);
-    } // If it is dragged to position in between the
+    }
+    // If it is dragged to position in between the
     // min threshold and default width
     // expand the nav to the default width
     else if (x.current > MIN_LEFT_SIDEBAR_DRAG_THRESHOLD && x.current < DEFAULT_LEFT_SIDEBAR_WIDTH) {
       var _objectSpread2;
-
       document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(DEFAULT_LEFT_SIDEBAR_WIDTH, "px"));
       updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread2 = {
         isResizing: false
@@ -168,14 +142,12 @@ var ResizeControl = function ResizeControl(_ref) {
       setLeftSidebarState(updatedLeftSidebarState);
     } else {
       var _objectSpread3;
-
       // otherwise resize it to the desired width
       updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread3 = {
         isResizing: false
       }, _defineProperty(_objectSpread3, VAR_LEFT_SIDEBAR_WIDTH, x.current), _defineProperty(_objectSpread3, "lastLeftSidebarWidth", x.current), _objectSpread3));
       setLeftSidebarState(updatedLeftSidebarState);
     }
-
     requestAnimationFrame(function () {
       onMouseMove.cancel();
       setIsGrabAreaFocused(false);
@@ -183,25 +155,20 @@ var ResizeControl = function ResizeControl(_ref) {
       cleanupAfterResize();
     });
   };
-
   var onKeyDown = function onKeyDown(event) {
     if (isLeftSidebarCollapsed || !isGrabAreaFocused) {
       return false;
     }
-
     var key = event.key;
     var isLeftOrTopArrow = key === 'ArrowLeft' || key === 'ArrowUp' || key === 'Left' || key === 'Up';
     var isRightOrBottomArrow = key === 'ArrowRight' || key === 'ArrowDown' || key === 'Right' || key === 'Down';
     var isSpaceOrEnter = key === 'Enter' || key === 'Spacebar' || key === ' ';
-
     if (isSpaceOrEnter) {
       toggleSideBar(event);
       event.preventDefault();
     }
-
     if (isLeftOrTopArrow || isRightOrBottomArrow) {
       event.preventDefault(); // prevent content scroll
-
       onResizeStart && onResizeStart(leftSidebarState);
       var step = 10;
       var stepValue = isLeftOrTopArrow ? -step : step;
@@ -209,7 +176,6 @@ var ResizeControl = function ResizeControl(_ref) {
       var maxWidth = Math.round(window.innerWidth / 2) - getLeftPanelWidth();
       var hasModifierKey = event.metaKey || event.altKey || event.ctrlKey || event.shiftKey;
       var width = leftSidebarWidth + stepValue;
-
       if (width <= DEFAULT_LEFT_SIDEBAR_WIDTH) {
         width = DEFAULT_LEFT_SIDEBAR_WIDTH;
         document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(DEFAULT_LEFT_SIDEBAR_WIDTH - 20, "px"));
@@ -218,49 +184,44 @@ var ResizeControl = function ResizeControl(_ref) {
         document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(maxWidth + 20, "px"));
       } else if (hasModifierKey) {
         width = isRightOrBottomArrow ? maxWidth : DEFAULT_LEFT_SIDEBAR_WIDTH;
-      } // Nesting the setTimeout within requestAnimationFrame helps
-      // the browser schedule the setTimeout call in an efficient manner
-
+      }
 
+      // Nesting the setTimeout within requestAnimationFrame helps
+      // the browser schedule the setTimeout call in an efficient manner
       requestAnimationFrame(function () {
         keyboardEventTimeout.current = window.setTimeout(function () {
           var _objectSpread4;
-
           keyboardEventTimeout.current && clearTimeout(keyboardEventTimeout.current);
           document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(width, "px"));
-
           var updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread4 = {}, _defineProperty(_objectSpread4, VAR_LEFT_SIDEBAR_WIDTH, width), _defineProperty(_objectSpread4, "lastLeftSidebarWidth", width), _objectSpread4));
-
           setLeftSidebarState(updatedLeftSidebarState);
           onResizeEnd && onResizeEnd(updatedLeftSidebarState);
         }, 50);
       });
     }
   };
-
   var onFocus = useCallback(function () {
     setIsGrabAreaFocused(true);
   }, []);
   var onBlur = useCallback(function () {
     setIsGrabAreaFocused(false);
   }, []);
-
   var resizeButton = _objectSpread({
     render: function render(Component, props) {
       return jsx(Component, props);
     }
-  }, overrides && overrides.ResizeButton); // This width is calculated once only on mount.
+  }, overrides && overrides.ResizeButton);
+
+  // This width is calculated once only on mount.
   // This means resizing the window will cause this value to be incorrect for screen reader users,
   // however this comes with a substantial performance gain and so is considered acceptable.
-
-
   var maxAriaWidth = useMemo(function () {
     var innerWidth = typeof window === 'undefined' ? 0 : window.innerWidth;
     return Math.round(innerWidth / 2) - getLeftPanelWidth();
   }, []);
   var leftSidebarPercentageExpanded = getLeftSidebarPercentage(leftSidebarState.leftSidebarWidth, maxAriaWidth);
-  /* eslint-disable jsx-a11y/role-supports-aria-props */
 
+  /* eslint-disable jsx-a11y/role-supports-aria-props */
   return jsx("div", _extends({}, cssSelector, {
     css: [resizeControlStyles, (isGrabAreaFocused || isLeftSidebarCollapsed) && showResizeButtonStyles]
   }), jsx(Shadow, {
@@ -286,7 +247,7 @@ var ResizeControl = function ResizeControl(_ref) {
     testId: testId && "".concat(testId, "-resize-button")
   }));
   /* eslint-enable jsx-a11y/role-supports-aria-props */
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export default ResizeControl;

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

@@ -2,8 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["isLeftSidebarCollapsed", "label", "testId"];
-
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import ChevronRight from '@atlaskit/icon/glyph/chevron-right';
 import { easeOut } from '@atlaskit/motion/curves';
@@ -27,7 +27,6 @@ var resizeIconButtonStyles = css({
   backgroundColor: "var(--ds-surface-overlay, ".concat(N0, ")"),
   border: 0,
   borderRadius: '50%',
-
   /**
    * TODO: https://product-fabric.atlassian.net/browse/DSP-3392
    * This shadow needs further investigation,
@@ -37,7 +36,6 @@ var resizeIconButtonStyles = css({
   boxShadow: "0 0 0 1px ".concat(N30A, ", 0 2px 4px 1px ").concat(N30A),
   color: "var(--ds-text-subtle, ".concat(N200, ")"),
   cursor: 'pointer',
-
   /**
    * The fallback value of 0 ensures that the button is hidden by default,
    * unless some parent (or the button itself) overrides it.
@@ -61,36 +59,33 @@ var resizeIconButtonExpandedStyles = css({
   transform: 'rotate(180deg)',
   transformOrigin: 7
 });
-
 var preventDefault = function preventDefault(event) {
   return event.preventDefault();
 };
-
 var cssSelector = _defineProperty({}, RESIZE_BUTTON_SELECTOR, true);
-
 var ResizeButton = function ResizeButton(_ref) {
   var isLeftSidebarCollapsed = _ref.isLeftSidebarCollapsed,
-      label = _ref.label,
-      testId = _ref.testId,
-      props = _objectWithoutProperties(_ref, _excluded);
-
+    label = _ref.label,
+    testId = _ref.testId,
+    props = _objectWithoutProperties(_ref, _excluded);
   return jsx("button", _extends({}, cssSelector, {
     // DO NOT remove. used as a CSS selector.
     "aria-expanded": !isLeftSidebarCollapsed,
     "aria-label": label,
     type: "button",
     css: [resizeIconButtonStyles, !isLeftSidebarCollapsed && resizeIconButtonExpandedStyles],
-    "data-testid": testId // Prevents focus staying attached to the button
+    "data-testid": testId
+    // Prevents focus staying attached to the button
     // when pressed
     ,
-    onMouseDown: preventDefault // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
-
+    onMouseDown: preventDefault
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
   }, props), jsx(ChevronRight, {
     label: ""
   }), jsx("div", {
     css: increaseHitAreaStyles
   }));
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export default ResizeButton;

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

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import { easeOut } from '@atlaskit/motion';
 import { useIsSidebarDragging } from '../../common/hooks';
@@ -24,7 +25,6 @@ var draggingStyles = css({
   background: "var(--ds-background-neutral-subtle, ".concat("linear-gradient(".concat(direction, ", ").concat(colorStops, ")"), ")"),
   opacity: 0.8
 });
-
 var Shadow = function Shadow(_ref) {
   var testId = _ref.testId;
   var isDragging = useIsSidebarDragging();
@@ -32,7 +32,7 @@ var Shadow = function Shadow(_ref) {
     "data-testid": testId,
     css: [shadowStyles, isDragging && draggingStyles]
   });
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export default Shadow;

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

@@ -1,13 +1,10 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 /* eslint-disable @repo/internal/dom-events/no-unsafe-event-listeners */
-
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import { easeOut, prefersReducedMotion } from '@atlaskit/motion';
 import { N30A, N60A } from '@atlaskit/theme/colors';
@@ -26,7 +23,6 @@ var skipLinkStyles = css({
   borderRadius: 3,
   boxShadow: "var(--ds-shadow-overlay, ".concat("0 0 0 1px ".concat(N30A, ", 0 2px 10px ").concat(N30A, ", 0 0 20px -4px ").concat(N60A), ")"),
   opacity: 0,
-
   /* Do the transform when focused */
   transform: 'translateY(-50%)',
   transition: "transform 0.3s ".concat(easeOut),
@@ -53,14 +49,13 @@ var skipLinkListStyles = css({
 var skipLinkListItemStyles = css({
   marginTop: 0
 });
-
 var assignIndex = function assignIndex(num, arr) {
   if (!arr.includes(num)) {
     return num;
   }
-
   return assignIndex(num + 1, arr);
 };
+
 /**
  * The default label will be used when the `skipLinksLabel` attribute is not
  * provided or the attribute is an empty string. If a string comprised only of
@@ -68,27 +63,20 @@ var assignIndex = function assignIndex(num, arr) {
  * default label will still be used in `title` attribute of the skip links
  * themselves.
  */
-
-
 export var SkipLinkWrapper = function SkipLinkWrapper(_ref) {
   var skipLinksLabel = _ref.skipLinksLabel;
-
   var _useSkipLinks = useSkipLinks(),
-      skipLinksData = _useSkipLinks.skipLinksData;
-
+    skipLinksData = _useSkipLinks.skipLinksData;
   if (skipLinksData.length === 0) {
     return null;
   }
-
   var sortSkipLinks = function sortSkipLinks(arr) {
     var customLinks = arr.filter(function (link) {
       return Number.isInteger(link.listIndex);
     });
-
     if (customLinks.length === 0) {
       return arr;
     }
-
     var usedIndexes = customLinks.map(function (a) {
       return a.listIndex;
     });
@@ -105,25 +93,20 @@ export var SkipLinkWrapper = function SkipLinkWrapper(_ref) {
       return a.listIndex - b.listIndex;
     });
   };
-
   var escapeHandler = function escapeHandler(event) {
     if (event.keyCode === 27) {
       var container = document.querySelector("[".concat(PAGE_LAYOUT_CONTAINER_SELECTOR, "=\"true\"]"));
-
       if (container !== null) {
         container.focus();
       }
     }
   };
-
   var attachEscHandler = function attachEscHandler() {
     return window.addEventListener('keydown', escapeHandler, false);
   };
-
   var removeEscHandler = function removeEscHandler() {
     return window.removeEventListener('keydown', escapeHandler, false);
   };
-
   var emptyLabelOverride = !!(skipLinksLabel !== null && skipLinksLabel !== void 0 && skipLinksLabel.match(/^\s+$/));
   var label = skipLinksLabel || DEFAULT_I18N_PROPS_SKIP_LINKS;
   return jsx("div", {
@@ -137,7 +120,7 @@ export var SkipLinkWrapper = function SkipLinkWrapper(_ref) {
     css: skipLinkListStyles
   }, sortSkipLinks(skipLinksData).map(function (_ref2) {
     var id = _ref2.id,
-        skipLinkTitle = _ref2.skipLinkTitle;
+      skipLinkTitle = _ref2.skipLinkTitle;
     return jsx(SkipLink, {
       key: id,
       href: "#".concat(id),
@@ -146,48 +129,45 @@ export var SkipLinkWrapper = function SkipLinkWrapper(_ref) {
     }, skipLinkTitle);
   })));
 };
-
 var handleBlur = function handleBlur(event) {
   // @ts-ignore
-  event.target.removeAttribute('tabindex'); // @ts-ignore
-
+  event.target.removeAttribute('tabindex');
+  // @ts-ignore
   event.target.removeEventListener('blur', handleBlur);
 };
-
 var focusTargetRef = function focusTargetRef(href) {
   return function (event) {
     event.preventDefault();
-    var targetRef = document.querySelector(href); // @ts-ignore
+    var targetRef = document.querySelector(href);
 
-    var key = event.which || event.keycode; // if it is a keypress and the key is not
+    // @ts-ignore
+    var key = event.which || event.keycode;
+    // if it is a keypress and the key is not
     // space or enter, just ignore it.
-
     if (key && key !== 13 && key !== 32) {
       return;
     }
-
     if (targetRef) {
-      targetRef.setAttribute('tabindex', '-1'); // @ts-ignore
-
-      targetRef.addEventListener('blur', handleBlur); // @ts-ignore
-
+      targetRef.setAttribute('tabindex', '-1');
+      // @ts-ignore
+      targetRef.addEventListener('blur', handleBlur);
+      // @ts-ignore
       targetRef.focus();
       document.activeElement && document.activeElement.scrollIntoView({
         behavior: 'smooth'
       });
       window.scrollTo(0, 0);
     }
-
     return false;
   };
-}; // eslint-disable-next-line @repo/internal/react/require-jsdoc
-
+};
 
+// eslint-disable-next-line @repo/internal/react/require-jsdoc
 export var SkipLink = function SkipLink(_ref3) {
   var href = _ref3.href,
-      children = _ref3.children,
-      isFocusable = _ref3.isFocusable,
-      title = _ref3.title;
+    children = _ref3.children,
+    isFocusable = _ref3.isFocusable,
+    title = _ref3.title;
   return jsx("li", {
     css: skipLinkListItemStyles
   }, jsx("a", {

package/dist/esm/components/skip-links/use-custom-skip-link.js

@@ -3,11 +3,9 @@ import { useEffect } from 'react';
 import { useSkipLinks } from '../../controllers';
 export var useCustomSkipLink = function useCustomSkipLink(id, skipLinkTitle) {
   var listIndex = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
-
   var _useSkipLinks = useSkipLinks(),
-      registerSkipLink = _useSkipLinks.registerSkipLink,
-      unregisterSkipLink = _useSkipLinks.unregisterSkipLink;
-
+    registerSkipLink = _useSkipLinks.registerSkipLink,
+    unregisterSkipLink = _useSkipLinks.unregisterSkipLink;
   useEffect(function () {
     registerSkipLink({
       id: id,

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

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
@@ -20,6 +19,7 @@ var bannerFixedStyles = css({
   right: RIGHT_PANEL_WIDTH,
   left: LEFT_PANEL_WIDTH
 });
+
 /**
  * __Banner__
  *
@@ -28,17 +28,16 @@ var bannerFixedStyles = css({
  * - [Examples](https://atlassian.design/components/page-layout/examples)
  * - [Code](https://atlassian.design/components/page-layout/code)
  */
-
 var Banner = function Banner(props) {
   var children = props.children,
-      _props$height = props.height,
-      height = _props$height === void 0 ? DEFAULT_BANNER_HEIGHT : _props$height,
-      _props$isFixed = props.isFixed,
-      isFixed = _props$isFixed === void 0 ? true : _props$isFixed,
-      shouldPersistHeight = props.shouldPersistHeight,
-      testId = props.testId,
-      skipLinkTitle = props.skipLinkTitle,
-      id = props.id;
+    _props$height = props.height,
+    height = _props$height === void 0 ? DEFAULT_BANNER_HEIGHT : _props$height,
+    _props$isFixed = props.isFixed,
+    isFixed = _props$isFixed === void 0 ? true : _props$isFixed,
+    shouldPersistHeight = props.shouldPersistHeight,
+    testId = props.testId,
+    skipLinkTitle = props.skipLinkTitle,
+    id = props.id;
   var bannerHeight = resolveDimension(VAR_BANNER_HEIGHT, height, shouldPersistHeight);
   useEffect(function () {
     publishGridState(_defineProperty({}, VAR_BANNER_HEIGHT, bannerHeight));
@@ -60,5 +59,4 @@ var Banner = function Banner(props) {
     }), children);
   });
 };
-
 export default Banner;

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

@@ -1,4 +1,5 @@
 /** @jsx jsx */
+
 import { css, jsx } from '@emotion/react';
 import { CONTENT } from '../../common/constants';
 var contentStyles = css({
@@ -7,6 +8,7 @@ var contentStyles = css({
   position: 'relative',
   gridArea: CONTENT
 });
+
 /**
  * __Content__
  *
@@ -15,14 +17,12 @@ var contentStyles = css({
  * - [Examples](https://atlassian.design/components/page-layout/examples)
  * - [Code](https://atlassian.design/components/page-layout/code)
  */
-
 var Content = function Content(props) {
   var children = props.children,
-      testId = props.testId;
+    testId = props.testId;
   return jsx("div", {
     "data-testid": testId,
     css: contentStyles
   }, children);
 };
-
 export default Content;