@atlaskit/navigation-system 6.1.0 → 6.2.1

package/dist/esm/ui/page-layout/panel-splitter/panel-splitter.js

@@ -47,8 +47,7 @@ var lineStyles = {
   root: "_kqswstnw _1e0c1ule _1bsb1l7b _4t3i1osq _syaz1kw7 _bfhk1r31 _1e021v6z"
 };
 var tooltipStyles = {
-  root: "_ahbq196n",
-  fullHeightSidebarWithLayeringFixes: "_1bsb1ris"
+  root: "_ahbq196n _1bsb1ris"
 };
 var panelSplitterDragDataSymbol = Symbol('panel-splitter-drag-data');
 function signPanelSplitterDragData(data) {
@@ -90,7 +89,7 @@ var PanelSplitterTooltip = /*#__PURE__*/forwardRef(function (_ref, ref) {
     // Must be statically passed
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/design-system/no-unsafe-style-overrides
     ,
-    className: ax([tooltipStyles.root, fg('platform-dst-side-nav-layering-fixes') && tooltipStyles.fullHeightSidebarWithLayeringFixes, className])
+    className: ax([tooltipStyles.root, className])
     // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides
     ,
 

package/dist/esm/ui/page-layout/panel-splitter/provider.js

@@ -1,5 +1,4 @@
 import React, { Fragment, useMemo, useRef } from 'react';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { PanelSplitterContext } from './context';
 /**
  * Provides the context required for the panel splitter to work within a page layout slot.
@@ -31,13 +30,13 @@ export var PanelSplitterProvider = function PanelSplitterProvider(_ref) {
       position: position,
       panelRef: panelRef,
       isEnabled: isEnabled,
-      portalRef: typeof providedPortalRef !== 'undefined' && fg('platform-dst-side-nav-layering-fixes') ? providedPortalRef : portalRef,
+      portalRef: typeof providedPortalRef !== 'undefined' ? providedPortalRef : portalRef,
       shortcut: shortcut
     };
   }, [panelId, panelWidth, onCompleteResize, getResizeBounds, resizingCssVar, position, panelRef, isEnabled, providedPortalRef, shortcut]);
   return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(PanelSplitterContext.Provider, {
     value: context
-  }, children), typeof providedPortalRef !== 'undefined' && fg('platform-dst-side-nav-layering-fixes') ? null : /*#__PURE__*/React.createElement("div", {
+  }, children), typeof providedPortalRef !== 'undefined' ? null : /*#__PURE__*/React.createElement("div", {
     ref: portalRef
   }));
 };

package/dist/esm/ui/page-layout/panel-splitter/side-nav-panel-splitter.js

@@ -2,7 +2,6 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useContext, useEffect, useState } from 'react';
 import invariant from 'tiny-invariant';
 import { useOpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { useIsFhsEnabled } from '../../fhs-rollout/use-is-fhs-enabled';
 import { openLayerObserverSideNavNamespace, openLayerObserverTopNavEndNamespace, openLayerObserverTopNavMiddleNamespace, openLayerObserverTopNavStartNamespace, sideNavPanelSplitterId } from '../constants';
 import { useToggleSideNav } from '../side-nav/use-toggle-side-nav';
@@ -32,7 +31,7 @@ function useHasOpenPopupsInSideNavOrTopNav() {
     hasOpenPopups = _useState2[0],
     setHasOpenPopups = _useState2[1];
   useEffect(function () {
-    if (!openLayerObserver || !isFhsEnabled || !fg('platform-dst-side-nav-layering-fixes')) {
+    if (!openLayerObserver || !isFhsEnabled) {
       return;
     }
     function updateState() {
@@ -97,7 +96,7 @@ export var SideNavPanelSplitter = function SideNavPanelSplitter(_ref) {
   // in the side nav or top nav is being placed here, instead of in `SideNav`, to prevent
   // re-rendering the side nav anytime the number of open popups changes.
   var hasOpenLayersInSideNavOrTopNav = useHasOpenPopupsInSideNavOrTopNav();
-  if (hasOpenLayersInSideNavOrTopNav && isFhsEnabled && fg('platform-dst-side-nav-layering-fixes')) {
+  if (hasOpenLayersInSideNavOrTopNav && isFhsEnabled) {
     return null;
   }
   return /*#__PURE__*/React.createElement(OnDoubleClickContext.Provider, {

package/dist/esm/ui/page-layout/root.js

@@ -63,7 +63,7 @@ export function Root(_ref) {
     testId: testId
   }, /*#__PURE__*/React.createElement("div", {
     ref: ref,
-    className: ax([styles.root, isFhsEnabled && fg('platform-dst-side-nav-layering-fixes') && !fg('platform_dst_nav4_fhs_feedback_1') && styles.sideNavScrollTimeline, fg('platform_dst_nav4_ribbon_slot') && styles.ribbon, xcss]),
+    className: ax([styles.root, isFhsEnabled && !fg('platform_dst_nav4_fhs_feedback_1') && styles.sideNavScrollTimeline, fg('platform_dst_nav4_ribbon_slot') && styles.ribbon, xcss]),
     id: gridRootId,
     "data-testid": testId
   }, children)))))))));

package/dist/esm/ui/page-layout/side-nav/side-nav-content.compiled.css

@@ -1,14 +1,10 @@
-
-._1un9baqb{scroll-timeline:--sNcst block}._16jlkb7n{flex-grow:1}
+._16jlkb7n{flex-grow:1}
 ._18m91wug{overflow-y:auto}
 ._1o9zkb7n{flex-shrink:1}
 ._1q51utpp{padding-block-start:var(--ds-space-150,9pt)}
 ._1reo1wug{overflow-x:auto}
-._21o1gc9s{animation-timeline:--sNcst}
 ._85i5utpp{padding-block-end:var(--ds-space-150,9pt)}
 ._bozgutpp{padding-inline-start:var(--ds-space-150,9pt)}
 ._i0dlf1ug{flex-basis:0%}
-._j7hq4n8p{animation-name:k1gwhnxc}
 ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
-@keyframes k1gwhnxc{0%{box-shadow:none}0.1%{box-shadow:0 -1px var(--ds-border,#0b120e24)}to{box-shadow:0 -1px var(--ds-border,#0b120e24)}}
 @media (min-width:64rem){@supports (scroll-timeline-axis:block){._1sfqgc9s{scroll-timeline-name:--sNcst}._1q1x1ule{scroll-timeline-axis:block}html:has([data-private-side-nav-header]) ._8pm2gc9s{animation-timeline:--sNcst}html:has([data-private-side-nav-header]) ._1gd94n8p{animation-name:k1gwhnxc}}@supports (scroll-timeline-axis:block){@keyframes k1gwhnxc{0%{box-shadow:none}0.1%{box-shadow:0 -1px var(--ds-border,#0b120e24)}to{box-shadow:0 -1px var(--ds-border,#0b120e24)}}}}

package/dist/esm/ui/page-layout/side-nav/side-nav-content.js

@@ -32,10 +32,8 @@ var styles = {
  * whereas this CSS approach should show even before hydration.
  */
 var scrolledBorder = null;
-var scrollTimelineVar = '--sNcst';
 var fullHeightSidebarStyles = {
-  scrollContainer: "_1un9baqb _21o1gc9s _j7hq4n8p",
-  scrollContainerWithLayeringFixes: "_1sfqgc9s _1q1x1ule _8pm2gc9s _1gd94n8p"
+  scrollContainer: "_1sfqgc9s _1q1x1ule _8pm2gc9s _1gd94n8p"
 };
 function _SideNavContent(_ref, forwardedRef) {
   var children = _ref.children,
@@ -50,7 +48,7 @@ function _SideNavContent(_ref, forwardedRef) {
   return /*#__PURE__*/React.createElement("div", {
     ref: isFhsEnabled ? mergedRef : forwardedRef,
     "data-testid": testId,
-    className: ax([styles.scrollContainer, isFhsEnabled && !fg('platform-dst-side-nav-layering-fixes') && !fg('platform_dst_nav4_fhs_feedback_1') && fullHeightSidebarStyles.scrollContainer, isFhsEnabled && isExpandedOnDesktop && fg('platform-dst-side-nav-layering-fixes') && !fg('platform_dst_nav4_fhs_feedback_1') && fullHeightSidebarStyles.scrollContainerWithLayeringFixes])
+    className: ax([styles.scrollContainer, isFhsEnabled && isExpandedOnDesktop && !fg('platform_dst_nav4_fhs_feedback_1') && fullHeightSidebarStyles.scrollContainer])
   }, /*#__PURE__*/React.createElement("div", {
     className: ax([styles.paddingContainer])
   }, children));

package/dist/esm/ui/page-layout/side-nav/side-nav-header.js

@@ -28,7 +28,7 @@ export var SideNavHeader = function SideNavHeader(_ref) {
      * - If SideNavHeader does not exist, the scroll indicator line is applied to TopNavStart. This ensures
      * the scroll indicator line is visible even when the top nav has a z-index higher than the side nav.
      */
-    "data-private-side-nav-header": fg('platform-dst-side-nav-layering-fixes') ? 'true' : undefined,
+    "data-private-side-nav-header": fg('platform_dst_nav4_fhs_feedback_1') ? undefined : 'true',
     className: ax([styles.root])
   }, children);
 };

package/dist/esm/ui/page-layout/side-nav/side-nav.compiled.css

@@ -22,7 +22,7 @@
 [dir=rtl] ._65m41mrw{--animation-direction:-1}
 @media (prefers-reduced-motion:no-preference){._10t88iot{transition-property:transform,display}._1vrh1a5r{transition-behavior:allow-discrete}._xrrpfnf5{transition-duration:.2s}._1lh81gzg{grid-area:main}._1xq51mm8{transition-timing-function:cubic-bezier(0,.4,0,1)}@starting-style{._1nu51p9u{transform:translateX(calc(-100%*var(--animation-direction)))}}._1xq51ku9{transition-timing-function:cubic-bezier(.6,0,0,1)}}
 @media (min-width:48rem){._14b5hc79{width:var(--n_snvRsz,var(--n_sNvw))}}
-@media (min-width:64rem){._165t56xv{height:calc(100vh - var(--n_bnrM, 0px))}._180k1wjm{inset-block-start:calc(var(--n_bnrM, 0px))}._26vxoned{padding-block-start:calc(var(--n_tNvM, 0px))}._1mt19dtb{margin-block-start:calc(var(--n_tNvM, 0px)*-1)}._p0az1elq{transform:translateX(calc(var(--n_snvRsz, var(--n_snvW, 0px)) - var(--ds-border-width, 1px)))}._dm2518uv{display:initial}._dm25glyw{display:none}._qiln1gzg{grid-area:main}._p5clglyw{border-inline-end:none}._4ap31bhr{background-color:var(--ds-surface-overlay,#fff)}._scbp130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}._qilnk0mc{grid-area:side-nav}._p5clia51{border-inline-end:var(--ds-border-width,1px) solid var(--ds-border,#0b120e24)}._4ap3vuon{background-color:var(--ds-surface,#fff)}._scbpglyw{box-shadow:none}}
+@media (min-width:64rem){._165t56xv{height:calc(100vh - var(--n_bnrM, 0px))}._p0az1elq{transform:translateX(calc(var(--n_snvRsz, var(--n_snvW, 0px)) - var(--ds-border-width, 1px)))}._dm2518uv{display:initial}._dm25glyw{display:none}._qiln1gzg{grid-area:main}._p5clglyw{border-inline-end:none}._4ap31bhr{background-color:var(--ds-surface-overlay,#fff)}._scbp130s{box-shadow:var(--ds-shadow-overlay,0 8px 9pt #1e1f2126,0 0 1px #1e1f214f)}._qilnk0mc{grid-area:side-nav}._p5clia51{border-inline-end:var(--ds-border-width,1px) solid var(--ds-border,#0b120e24)}._4ap3vuon{background-color:var(--ds-surface,#fff)}._scbpglyw{box-shadow:none}}
 @media (prefers-reduced-motion:no-preference) and (min-width:64rem){._17ly8iot{transition-property:transform,display}._177m1a5r{transition-behavior:allow-discrete}._1sg81gzg{grid-area:main}._vgub1mm8{transition-timing-function:cubic-bezier(0,.4,0,1)}._hh1u1p9u{transform:translateX(calc(-100%*var(--animation-direction)))}@starting-style{._s2eg1p9u{transform:translateX(calc(-100%*var(--animation-direction)))}}._1sg8k0mc{grid-area:side-nav}._vgub1ku9{transition-timing-function:cubic-bezier(.6,0,0,1)}._hjoifnf5{transition-duration:.2s}}
 @media (prefers-reduced-motion:no-preference) and (not (min-width:64rem)){._aadi1p9u{transform:translateX(calc(-100%*var(--animation-direction)))}}
 @supports not (-moz-appearance:none){@media (prefers-reduced-motion:no-preference){._139f8iot{transition-property:transform,display}._1tpvfnf5{transition-duration:.2s}._sylc1a5r{transition-behavior:allow-discrete}._1uwsjq3t{transform:translateX(-100%)}}@media (prefers-reduced-motion:no-preference){@starting-style{._oyeijq3t{transform:translateX(-100%)}}._139f8iot{transition-property:transform,display}._1tpvfnf5{transition-duration:.2s}._sylc1a5r{transition-behavior:allow-discrete}}}

package/dist/esm/ui/page-layout/side-nav/side-nav.js

@@ -19,7 +19,7 @@ import { media } from '@atlaskit/primitives/responsive';
 import { useSkipLinkInternal } from '../../../context/skip-links/skip-links-context';
 import { TopNavStartElement } from '../../../context/top-nav-start/top-nav-start-context';
 import { useIsFhsEnabled } from '../../fhs-rollout/use-is-fhs-enabled';
-import { bannerMountedVar, contentHeightWhenFixed, contentInsetBlockStart, localSlotLayers, openLayerObserverSideNavNamespace, openLayerObserverTopNavStartNamespace, sideNavLiveWidthVar, sideNavPanelSplitterId, sideNavVar, topNavMountedVar, UNSAFE_sideNavLayoutVar } from '../constants';
+import { bannerMountedVar, contentHeightWhenFixed, contentInsetBlockStart, localSlotLayers, openLayerObserverSideNavNamespace, openLayerObserverTopNavStartNamespace, sideNavLiveWidthVar, sideNavPanelSplitterId, sideNavVar, UNSAFE_sideNavLayoutVar } from '../constants';
 import { DangerouslyHoistSlotSizes } from '../hoist-slot-sizes-context';
 import { DangerouslyHoistCssVarToDocumentRoot } from '../hoist-utils';
 import { useLayoutId } from '../id-utils';
@@ -74,8 +74,7 @@ var styles = {
   expandAnimationMobile: "_1xq51ku9 _1nu51p9u",
   collapseAnimationMobile: "_1lh81gzg _1xq51mm8 _aadi1p9u",
   expandAnimationDesktop: "_1sg8k0mc _vgub1ku9 _s2eg1p9u",
-  collapseAnimationDesktop: "_1sg81gzg _vgub1mm8 _hh1u1p9u",
-  fullHeightSidebar: "_165t56xv _180k1wjm _26vxoned _1mt19dtb"
+  collapseAnimationDesktop: "_1sg81gzg _vgub1mm8 _hh1u1p9u"
 };
 var fallbackDefaultWidth = 320;
 export var onPeekStartDelayMs = 500;
@@ -681,7 +680,6 @@ function SideNavInternal(_ref) {
     cssVar: panelSplitterResizingVar,
     panelId: sideNavPanelSplitterId
   });
-  var isFlyoutClosed = (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'closed' || (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === undefined;
   var isExpandedStateDifferentFromInitial = isExpandedOnMobile || isExpandedOnDesktop !== initialIsExpandedOnDesktop;
 
   /**
@@ -739,7 +737,7 @@ function SideNavInternal(_ref) {
     style: _defineProperty({}, sideNavVar, clampedWidth),
     ref: mergedRef,
     "data-testid": testId,
-    className: ax([styles.root, isExpandedOnDesktop && !isExpandedOnMobile && !isFlyoutVisible && styles.hiddenMobileOnly, !isExpandedOnDesktop && isExpandedOnMobile && !isFlyoutVisible && styles.hiddenDesktopOnly, !isExpandedOnDesktop && !isExpandedOnMobile && !isFlyoutVisible && styles.hiddenMobileAndDesktop, isFhsEnabled && styles.animationRTLSupport, shouldShowSidebarToggleAnimation && styles.animationBaseStyles, isExpandedOnMobile && shouldShowSidebarToggleAnimation && styles.expandAnimationMobile, !isExpandedOnMobile && shouldShowSidebarToggleAnimation && styles.collapseAnimationMobile, isExpandedOnDesktop && shouldShowSidebarToggleAnimation && styles.expandAnimationDesktop, !isExpandedOnDesktop && shouldShowSidebarToggleAnimation && styles.collapseAnimationDesktop, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'open' && !isFhsEnabled && styles.flyoutOpen, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close' && !isFhsEnabled && styles.flyoutAnimateClosed, ((sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'open' || (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close') && !isFirefox && isFhsEnabled && styles.flyoutBaseStylesFullHeightSidebar, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close' && !isFirefox && isFhsEnabled && styles.flyoutAnimateClosedFullHeightSidebar, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'open' && !isFirefox && isFhsEnabled && styles.flyoutOpenFullHeightSidebar, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close' && !isFirefox && isFhsEnabled && styles.flyoutAnimateClosedFullHeightSidebar, isFlyoutClosed && isFhsEnabled && !fg('platform-dst-side-nav-layering-fixes') && styles.fullHeightSidebar])
+    className: ax([styles.root, isExpandedOnDesktop && !isExpandedOnMobile && !isFlyoutVisible && styles.hiddenMobileOnly, !isExpandedOnDesktop && isExpandedOnMobile && !isFlyoutVisible && styles.hiddenDesktopOnly, !isExpandedOnDesktop && !isExpandedOnMobile && !isFlyoutVisible && styles.hiddenMobileAndDesktop, isFhsEnabled && styles.animationRTLSupport, shouldShowSidebarToggleAnimation && styles.animationBaseStyles, isExpandedOnMobile && shouldShowSidebarToggleAnimation && styles.expandAnimationMobile, !isExpandedOnMobile && shouldShowSidebarToggleAnimation && styles.collapseAnimationMobile, isExpandedOnDesktop && shouldShowSidebarToggleAnimation && styles.expandAnimationDesktop, !isExpandedOnDesktop && shouldShowSidebarToggleAnimation && styles.collapseAnimationDesktop, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'open' && !isFhsEnabled && styles.flyoutOpen, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close' && !isFhsEnabled && styles.flyoutAnimateClosed, ((sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'open' || (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close') && !isFirefox && isFhsEnabled && styles.flyoutBaseStylesFullHeightSidebar, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close' && !isFirefox && isFhsEnabled && styles.flyoutAnimateClosedFullHeightSidebar, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'open' && !isFirefox && isFhsEnabled && styles.flyoutOpenFullHeightSidebar, (sideNavState === null || sideNavState === void 0 ? void 0 : sideNavState.flyout) === 'triggered-animate-close' && !isFirefox && isFhsEnabled && styles.flyoutAnimateClosedFullHeightSidebar])
   }), /*#__PURE__*/React.createElement(DangerouslyHoistCssVarToDocumentRoot, {
     variableName: sideNavLiveWidthVar,
     value: "0px",
@@ -758,21 +756,18 @@ function SideNavInternal(_ref) {
   , /*#__PURE__*/React.createElement(PanelSplitterProvider, {
     panelId: sideNavPanelSplitterId,
     panelRef: navRef,
-    portalRef: isFhsEnabled && fg('platform-dst-side-nav-layering-fixes') ? panelSplitterPortalTargetRef : undefined,
+    portalRef: isFhsEnabled ? panelSplitterPortalTargetRef : undefined,
     panelWidth: width,
     onCompleteResize: setWidth,
     getResizeBounds: getResizeBounds,
     resizingCssVar: panelSplitterResizingVar
     // Not resizable when in peek (flyout) mode.
     ,
-    isEnabled: fg('platform-dst-side-nav-layering-fixes') ? !isFlyoutVisible :
-    // Old behaviour has a bug: the panel splitter would only be visible on sm screens (between 48rem and 64rem)
-    // if the side nav was expanded on desktop.
-    isExpandedOnDesktop && !isFlyoutVisible,
+    isEnabled: !isFlyoutVisible,
     shortcut: isShortcutEnabled ? sideNavToggleTooltipKeyboardShortcut : undefined
   }, /*#__PURE__*/React.createElement("div", {
     className: ax([styles.flexContainer])
-  }, children))), isFhsEnabled && fg('platform-dst-side-nav-layering-fixes') && /*#__PURE__*/React.createElement("div", {
+  }, children))), isFhsEnabled && /*#__PURE__*/React.createElement("div", {
     ref: panelSplitterPortalTargetRef,
     "data-layout-slot": true,
     style: _defineProperty({}, sideNavClampedWidthVar, clampedWidth),

package/dist/esm/ui/page-layout/top-nav/top-nav-end.compiled.css

@@ -6,7 +6,6 @@
 ._1e0cglyw{display:none}
 ._1ul9zwfg{min-width:2pc}
 ._4cvr1h6o{align-items:center}
-._lcxv1wug{pointer-events:auto}
 ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
 @media (min-width:48rem){._181n1txw{display:flex}._1d2y1ris{min-width:max-content}}
 @media (min-width:64rem){._glte1ris{width:max-content}._15rip2n4{min-width:330px}._1gs5usvi{box-sizing:border-box}._ndwch9n0{justify-self:end}}

package/dist/esm/ui/page-layout/top-nav/top-nav-end.js

@@ -8,7 +8,6 @@ import { cx } from '@compiled/react';
 import { useLayoutEffect } from '@atlaskit/ds-lib/use-layout-effect';
 import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
 import { OpenLayerObserverNamespaceProvider } from '@atlaskit/layering/experimental/open-layer-observer';
-import { fg } from '@atlaskit/platform-feature-flags';
 import Popup from '@atlaskit/popup';
 import { UNSAFE_useMediaQuery as useMediaQuery } from '@atlaskit/primitives/compiled';
 import { List } from '../../../components/list';
@@ -18,20 +17,13 @@ import { IconButton } from '../../top-nav-items/themed/migration';
 import { openLayerObserverTopNavEndNamespace } from '../constants';
 var containerStyles = {
   root: "_yyhy11wp _1e0c1txw _1bahh9n0 _1ul9zwfg _1d2y1ris _glte1ris _15rip2n4 _1gs5usvi _ndwch9n0",
-  fullHeightSidebar: "_y4tiutpp _lcxv1wug",
-  fullHeightSidebarWithLayeringFixes: "_y4tiutpp"
+  fullHeightSidebar: "_y4tiutpp"
 };
 var listStyles = {
   root: "_zulp1b66 _4cvr1h6o _1e0c1txw",
   hideOnSmallViewport: "_1e0cglyw _181n1txw",
   popupContainer: "_1yt4u2gc"
 };
-function OpenLayerObserverNamespaceProviderBehindFG(_ref) {
-  var children = _ref.children;
-  return fg('platform-dst-side-nav-layering-fixes') ? /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
-    namespace: openLayerObserverTopNavEndNamespace
-  }, children) : children;
-}
 
 /**
  * __TopNavEnd__
@@ -41,12 +33,12 @@ function OpenLayerObserverNamespaceProviderBehindFG(_ref) {
  * On small viewports, the children will be placed inside a popup, and a button will be rendered to open the popup.
  * This is to prevent the actions from overflowing the top navigation.
  */
-export function TopNavEnd(_ref2) {
-  var children = _ref2.children,
-    _ref2$label = _ref2.label,
-    label = _ref2$label === void 0 ? 'Actions' : _ref2$label,
-    _ref2$showMoreButtonL = _ref2.showMoreButtonLabel,
-    showMoreButtonLabel = _ref2$showMoreButtonL === void 0 ? 'Show more' : _ref2$showMoreButtonL;
+export function TopNavEnd(_ref) {
+  var children = _ref.children,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? 'Actions' : _ref$label,
+    _ref$showMoreButtonLa = _ref.showMoreButtonLabel,
+    showMoreButtonLabel = _ref$showMoreButtonLa === void 0 ? 'Show more' : _ref$showMoreButtonLa;
   var isFhsEnabled = useIsFhsEnabled();
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -72,7 +64,7 @@ export function TopNavEnd(_ref2) {
   }, [query]);
   return /*#__PURE__*/React.createElement("nav", {
     "aria-label": label,
-    className: ax([containerStyles.root, isFhsEnabled && !fg('platform-dst-side-nav-layering-fixes') && containerStyles.fullHeightSidebar, isFhsEnabled && fg('platform-dst-side-nav-layering-fixes') && containerStyles.fullHeightSidebarWithLayeringFixes])
+    className: ax([containerStyles.root, isFhsEnabled && containerStyles.fullHeightSidebar])
   }, isMobile ? /*#__PURE__*/React.createElement(Popup, {
     isOpen: isOpen,
     onClose: function onClose() {
@@ -85,7 +77,9 @@ export function TopNavEnd(_ref2) {
         value: false
       }, /*#__PURE__*/React.createElement(List, {
         xcss: cx(listStyles.root, listStyles.popupContainer)
-      }, /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProviderBehindFG, null, children)));
+      }, /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
+        namespace: openLayerObserverTopNavEndNamespace
+      }, children)));
     },
     trigger: function trigger(triggerProps) {
       return /*#__PURE__*/React.createElement(IconButton, _extends({}, triggerProps, {
@@ -100,5 +94,7 @@ export function TopNavEnd(_ref2) {
     }
   }) : /*#__PURE__*/React.createElement(List, {
     xcss: cx(listStyles.root, listStyles.hideOnSmallViewport)
-  }, /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProviderBehindFG, null, children)));
+  }, /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
+    namespace: openLayerObserverTopNavEndNamespace
+  }, children)));
 }

package/dist/esm/ui/page-layout/top-nav/top-nav-middle.compiled.css

@@ -4,5 +4,4 @@
 ._1bsb1osq{width:100%}
 ._1e0c1txw{display:flex}
 ._4cvr1h6o{align-items:center}
-._lcxv1wug{pointer-events:auto}
 @media (min-width:48rem){._181n11p5{display:grid}._1j8b15b0{grid-template-columns:minmax(min-content,780px)}._lagd1bp4{grid-auto-flow:column}._1t4c1ris{grid-auto-columns:max-content}._12e8h9n0{justify-items:end}}

package/dist/esm/ui/page-layout/top-nav/top-nav-middle.js

@@ -3,12 +3,9 @@ import "./top-nav-middle.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React from 'react';
 import { OpenLayerObserverNamespaceProvider } from '@atlaskit/layering/experimental/open-layer-observer';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { useIsFhsEnabled } from '../../fhs-rollout/use-is-fhs-enabled';
 import { openLayerObserverTopNavMiddleNamespace } from '../constants';
 var styles = {
-  root: "_zulpu2gc _yyhycs5v _1bsb1osq _4cvr1h6o _1e0c1txw _1bahh9n0 _181n11p5 _1j8b15b0 _lagd1bp4 _1t4c1ris _12e8h9n0",
-  fullHeightSidebar: "_lcxv1wug"
+  root: "_zulpu2gc _yyhycs5v _1bsb1osq _4cvr1h6o _1e0c1txw _1bahh9n0 _181n11p5 _1j8b15b0 _lagd1bp4 _1t4c1ris _12e8h9n0"
 };
 
 /**
@@ -21,10 +18,9 @@ var styles = {
  */
 export function TopNavMiddle(_ref) {
   var children = _ref.children;
-  var isFhsEnabled = useIsFhsEnabled();
   return /*#__PURE__*/React.createElement("div", {
-    className: ax([styles.root, isFhsEnabled && !fg('platform-dst-side-nav-layering-fixes') && styles.fullHeightSidebar])
-  }, fg('platform-dst-side-nav-layering-fixes') ? /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
+    className: ax([styles.root])
+  }, /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
     namespace: openLayerObserverTopNavMiddleNamespace
-  }, children) : children);
+  }, children));
 }

package/dist/esm/ui/page-layout/top-nav/top-nav-start.compiled.css

@@ -9,10 +9,9 @@
 ._4t3i1osq{height:100%}
 ._ahbq1wug{margin-inline-start:auto}
 ._bozgutpp{padding-inline-start:var(--ds-space-150,9pt)}
-._lcxv1wug{pointer-events:auto}
 ._vchhusvi{box-sizing:border-box}
 [dir=rtl] ._65m41mrw{--animation-direction:-1}
 @media (prefers-reduced-motion:no-preference){._10t81e03{transition-property:transform}._10t81rjc{transition-property:transform,opacity}._1xq51ytf{transition-timing-function:ease-in-out}._1xq55ucs{transition-timing-function:ease}._mjvc1efy{transform:translateX(calc(100%*var(--animation-direction)))}._bgpzidpf{opacity:0}._mjvc1p9u{transform:translateX(calc(-100%*var(--animation-direction)))}._mjvco0k7{transform:translateX(calc((-2rem + var(--ds-space-050, 4px)*-1)*var(--animation-direction)))}._mjvcyrjp{transform:translateX(calc((2rem + var(--ds-space-050, 4px))*var(--animation-direction)))}._mjvcz12g{transform:translateX(0)}._xrrpfnf5{transition-duration:.2s}._bgpzkb7n{opacity:1}}
-@media (min-width:64rem){._13wnh2mm{position:relative}._1l3vb3bt:after{content:""}._juxdstnw:after{position:absolute}._1vinidpf:after{inset-block-start:0}._1719idpf:after{inset-block-end:0}._e6znidpf:after{inset-inline-end:0}._1kyhe4h9:after{border-inline-end-width:var(--ds-border-width,1px)}._4cwynqa1:after{border-inline-end-style:solid}._435s1l7x:after{border-inline-end-color:var(--ds-border,#0b120e24)}._m7c3idpf:after{opacity:0}._15rin7od{min-width:unset}._glte1osq{width:100%}._4ap3vuon{background-color:var(--ds-surface,#fff)}._m7c3kb7n:after{opacity:1}._exxmutpp{padding-inline-end:var(--ds-space-150,9pt)}._glte1ris{width:max-content}._15rip2n4{min-width:330px}._1gs5usvi{box-sizing:border-box}._glte93mn{width:var(--n_sNvlw,100%)}._exxmpxbi{padding-inline-end:var(--ds-space-200,1pc)}}
+@media (min-width:64rem){._13wnh2mm{position:relative}._1l3vb3bt:after{content:""}._juxdstnw:after{position:absolute}._1vinidpf:after{inset-block-start:0}._1719idpf:after{inset-block-end:0}._e6znidpf:after{inset-inline-end:0}._1kyhe4h9:after{border-inline-end-width:var(--ds-border-width,1px)}._4cwynqa1:after{border-inline-end-style:solid}._435s1l7x:after{border-inline-end-color:var(--ds-border,#0b120e24)}._m7c3idpf:after{opacity:0}._15rin7od{min-width:unset}._glte1osq{width:100%}._exxmutpp{padding-inline-end:var(--ds-space-150,9pt)}._glte1ris{width:max-content}._15rip2n4{min-width:330px}._1gs5usvi{box-sizing:border-box}._glte93mn{width:var(--n_sNvlw,100%)}._exxmpxbi{padding-inline-end:var(--ds-space-200,1pc)}._4ap3vuon{background-color:var(--ds-surface,#fff)}._m7c3kb7n:after{opacity:1}}
 @media (prefers-reduced-motion:no-preference) and (min-width:64rem){._n8qabrmi:after{transition-property:opacity}._wc72fnf5:after{transition-duration:.2s}._j3mr1v42:after{transition-timing-function:ease-in}}
 @supports (scroll-timeline-axis:block){@keyframes khj1qz3{0%{box-shadow:inset 0 -1px 0 0 transparent}0.1%{box-shadow:inset 0 -1px 0 0 var(--ds-border,#0b120e24)}to{box-shadow:inset 0 -1px 0 0 var(--ds-border,#0b120e24)}}html:not(:has([data-private-side-nav-header])) ._5gdsgc9s{animation-timeline:--sNcst}html:not(:has([data-private-side-nav-header])) ._53fr1ybg{animation-name:khj1qz3}html:not(:has([data-private-side-nav-header])) ._bt1c1hrf{animation-fill-mode:both}}

package/dist/esm/ui/page-layout/top-nav/top-nav-start.js

@@ -33,7 +33,6 @@ var flexGap = "var(--ds-space-050, 4px)";
  */
 var innerStyles = {
   root: "_zulp1b66 _yyhykb7n _4t3i1osq _4cvr1h6o _1e0c1txw _glte1ris _15rip2n4 _1gs5usvi",
-  fullHeightSidebar: "_lcxv1wug",
   fullHeightSidebarExpanded: "_15rin7od _glte1osq"
 };
 
@@ -50,11 +49,9 @@ var scrolledShadow = null;
  * This wrapper element is only rendered when `useIsFhsEnabled` is true.
  */
 var wrapperStyles = {
-  root: "_vchhusvi _bozgutpp _4t3i1osq",
-  fullHeightSidebarExpanded: "_glte93mn _exxmpxbi",
-  fullHeightSidebarWithLayeringFixes: "_13wnh2mm _1l3vb3bt _juxdstnw _1vinidpf _1719idpf _e6znidpf _1kyhe4h9 _4cwynqa1 _435s1l7x _m7c3idpf",
-  fullHeightSidebarExpandedWithLayeringFixes: "_4ap3vuon _m7c3kb7n",
-  fullHeightSidebarExpandedWithLayeringFixesScrollTimeline: "_5gdsgc9s _53fr1ybg _bt1c1hrf",
+  root: "_vchhusvi _bozgutpp _4t3i1osq _13wnh2mm _1l3vb3bt _juxdstnw _1vinidpf _1719idpf _e6znidpf _1kyhe4h9 _4cwynqa1 _435s1l7x _m7c3idpf",
+  fullHeightSidebarExpanded: "_glte93mn _exxmpxbi _4ap3vuon _m7c3kb7n",
+  fullHeightSidebarExpandedScrollTimeline: "_5gdsgc9s _53fr1ybg _bt1c1hrf",
   fullHeightSidebarBorderTransition: "_n8qabrmi _wc72fnf5 _j3mr1v42",
   fullHeightSidebarExpandedWithFeedback: "_exxmutpp"
 };
@@ -127,10 +124,6 @@ var TopNavStartInnerFHS = /*#__PURE__*/forwardRef(function TopNavStartInnerFHS(_
   var sideNavState = useContext(SideNavVisibilityState);
   var isFirstRenderRef = useRef(true);
   useEffect(function () {
-    if (!fg('platform-dst-side-nav-layering-fixes')) {
-      return;
-    }
-
     // Ignore renders until the side nav state is initialized
     // So that apps using the legacy API for setting side nav default state do not see
     // animations when they shouldn't
@@ -142,14 +135,14 @@ var TopNavStartInnerFHS = /*#__PURE__*/forwardRef(function TopNavStartInnerFHS(_
     }
   }, [sideNavState]);
   return /*#__PURE__*/React.createElement("div", {
-    className: ax([wrapperStyles.root, isExpandedOnDesktop && wrapperStyles.fullHeightSidebarExpanded, isExpandedOnDesktop && fg('platform_dst_nav4_fhs_feedback_1') && wrapperStyles.fullHeightSidebarExpandedWithFeedback, fg('platform-dst-side-nav-layering-fixes') && wrapperStyles.fullHeightSidebarWithLayeringFixes, !isFirstRenderRef.current && isExpandedOnDesktop && fg('platform-dst-side-nav-layering-fixes') && wrapperStyles.fullHeightSidebarBorderTransition, isExpandedOnDesktop && fg('platform-dst-side-nav-layering-fixes') && wrapperStyles.fullHeightSidebarExpandedWithLayeringFixes, isExpandedOnDesktop && fg('platform-dst-side-nav-layering-fixes') && !fg('platform_dst_nav4_fhs_feedback_1') && wrapperStyles.fullHeightSidebarExpandedWithLayeringFixesScrollTimeline])
+    className: ax([wrapperStyles.root, isExpandedOnDesktop && wrapperStyles.fullHeightSidebarExpanded, isExpandedOnDesktop && fg('platform_dst_nav4_fhs_feedback_1') && wrapperStyles.fullHeightSidebarExpandedWithFeedback, !isFirstRenderRef.current && isExpandedOnDesktop && wrapperStyles.fullHeightSidebarBorderTransition, isExpandedOnDesktop && !fg('platform_dst_nav4_fhs_feedback_1') && wrapperStyles.fullHeightSidebarExpandedScrollTimeline])
   }, /*#__PURE__*/React.createElement("div", {
     ref: ref,
     "data-testid": testId,
-    className: ax([innerStyles.root, !fg('platform-dst-side-nav-layering-fixes') && innerStyles.fullHeightSidebar, isExpandedOnDesktop && innerStyles.fullHeightSidebarExpanded])
-  }, fg('platform-dst-side-nav-layering-fixes') ? /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
+    className: ax([innerStyles.root, isExpandedOnDesktop && innerStyles.fullHeightSidebarExpanded])
+  }, /*#__PURE__*/React.createElement(OpenLayerObserverNamespaceProvider, {
     namespace: openLayerObserverTopNavStartNamespace
-  }, children) : children));
+  }, children)));
 });
 
 /**
@@ -161,6 +154,9 @@ export function TopNavStart(_ref3) {
   var children = _ref3.children,
     testId = _ref3.testId,
     sideNavToggleButton = _ref3.sideNavToggleButton;
+  if (fg('platform_editor_topnavstart_delay_browser_check')) {
+    isFirefox = typeof navigator !== 'undefined' && navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
+  }
   var isFhsEnabled = useIsFhsEnabled();
   var ref = useContext(TopNavStartAttachRef);
   var elementRef = useRef(null);

package/dist/esm/ui/page-layout/top-nav/top-nav.compiled.css

@@ -7,7 +7,6 @@
 ._179ria51{border-block-end:var(--ds-border-width,1px) solid var(--ds-border,#0b120e24)}._152t1nws{inset-block-start:var(--n_bnrM,0)}
 ._18postnw:after{position:absolute}
 ._1beue4h9:after{border-block-end-width:var(--ds-border-width,1px)}
-._1bsb1osq{width:100%}
 ._1cte1l7x:after{border-block-end-color:var(--ds-border,#0b120e24)}
 ._1czdidpf:after{inset-inline-end:0}
 ._1e0c11p5{display:grid}
@@ -16,18 +15,15 @@
 ._1pbyegat{z-index:4}
 ._4cvr1h6o{align-items:center}
 ._4t3i1dgc{height:var(--n_tNvM)}
-._4t3i1osq{height:100%}
 ._aetrb3bt:after{content:""}
-._bfhkglyw{background-color:none}
 ._bfhkvuon{background-color:var(--ds-surface,#fff)}
 ._d6vu1bgi >span[data-ep-placeholder-id=top_navigation_skeleton]{display:contents}
 ._g0nf3tht:after{inset-inline-start:var(--n_sNvlw,0)}
 ._kqsw1if8{position:sticky}
 ._lcxv1wug{pointer-events:auto}
-._lcxvglyw{pointer-events:none}
 ._uaeunqa1:after{border-block-end-style:solid}
 ._vchhusvi{box-sizing:border-box}
 ._yv0e1mfv{grid-template-columns:auto 1fr auto}
 @media (min-width:48rem){._1j8b18ax{grid-template-columns:1fr minmax(min-content,max-content) 1fr}}
-@media (min-width:64rem){._1rqt16a9{grid-template-columns:0fr minmax(min-content,max-content) 1fr}._hyzqcs5v{z-index:2}._pdlmutpp{gap:var(--ds-space-150,9pt)}}
+@media (min-width:64rem){._1rqt16a9{grid-template-columns:0fr minmax(min-content,max-content) 1fr}._pdlmutpp{gap:var(--ds-space-150,9pt)}}
 @media (min-width:110.5rem){._jh1g18ax{grid-template-columns:1fr minmax(min-content,max-content) 1fr}}

package/dist/esm/ui/page-layout/top-nav/top-nav.js

@@ -1,10 +1,8 @@
 /* top-nav.tsx generated by @compiled/babel-plugin v0.39.1 */
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["backgroundColor"];
 import "./top-nav.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";
-import { useContext, useMemo } from 'react';
+import { useContext } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { useSkipLink } from '../../../context/skip-links/skip-links-context';
 import { useIsFhsEnabled } from '../../fhs-rollout/use-is-fhs-enabled';
@@ -25,19 +23,8 @@ import { useSideNavVisibility } from '../side-nav/use-side-nav-visibility';
  */
 var styles = {
   root: "_nd5l8cbt _zulpu2gc _18zrutpp _179ria51 _1e0c11p5 _yv0e1mfv _4cvr1h6o _bfhkvuon _vchhusvi _4t3i1dgc _152t1nws _kqsw1if8 _1pbyegat _d6vu1bgi _1j8b18ax",
-  fullHeightSidebar: "_18zrze3t _179rglyw _bfhkglyw _lcxvglyw _pdlmutpp",
-  fullHeightSidebarExpanded: "_1rqt16a9 _jh1g18ax",
-  fullHeightSidebarWithLayeringFixes: "_1pby11wp _lcxv1wug _bfhkvuon _aetrb3bt _18postnw _1gufidpf _1czdidpf _g0nf3tht _1beue4h9 _uaeunqa1 _1cte1l7x"
-};
-
-/**
- * Styles for the visible 'bar' of the top nav, including background and border.
- *
- * This is on a lower z-index than the expanded side nav, and is separate to the top nav items which are above the expanded side nav.
- */
-var backgroundStyles = {
-  root: "_nd5l8cbt _179ria51 _1bsb1osq _4t3i1osq _bfhkvuon _vchhusvi _152t1nws _kqsw1if8 _lcxvglyw _1pbyegat",
-  sideNavExpanded: "_hyzqcs5v"
+  fullHeightSidebar: "_18zrze3t _179rglyw _lcxv1wug _bfhkvuon _1pby11wp _aetrb3bt _18postnw _1gufidpf _1czdidpf _g0nf3tht _1beue4h9 _uaeunqa1 _1cte1l7x _pdlmutpp",
+  fullHeightSidebarExpanded: "_1rqt16a9 _jh1g18ax"
 };
 
 /**
@@ -61,56 +48,18 @@ export function TopNav(_ref) {
   var hasIncreasedDefaultHeight = isFhsEnabled && fg('platform_dst_nav4_top_nav_increase_height');
   var height = heightProp !== null && heightProp !== void 0 ? heightProp : hasIncreasedDefaultHeight ? 56 : 48;
   var customTheme = useCustomTheme(UNSAFE_theme);
-
-  /**
-   * Note: this is no longer the case when fg('platform-dst-side-nav-layering-fixes') is enabled.
-   *
-   * With the full height sidebar we have a foreground and background element,
-   * so we need to apply the custom theme styles to the correct element.
-   *
-   * The foreground element should not have a background color,
-   * and the background element doesn't need any of the other styles.
-   */
-  var _useMemo = useMemo(function () {
-      if (!customTheme.isEnabled) {
-        return {
-          backgroundStyle: undefined,
-          foregroundStyle: undefined
-        };
-      }
-      var _customTheme$style = customTheme.style,
-        backgroundColor = _customTheme$style.backgroundColor,
-        foregroundStyle = _objectWithoutProperties(_customTheme$style, _excluded);
-      return {
-        backgroundStyle: {
-          backgroundColor: backgroundColor
-        },
-        foregroundStyle: foregroundStyle
-      };
-    }, [customTheme]),
-    backgroundStyle = _useMemo.backgroundStyle,
-    foregroundStyle = _useMemo.foregroundStyle;
   var _useSideNavVisibility = useSideNavVisibility(),
     isExpandedOnDesktop = _useSideNavVisibility.isExpandedOnDesktop;
   return /*#__PURE__*/React.createElement(HasCustomThemeContext.Provider, {
     value: customTheme.isEnabled
-  }, isFhsEnabled && !fg('platform-dst-side-nav-layering-fixes') && /*#__PURE__*/React.createElement("div", {
-    "data-layout-slot": true,
-    "aria-hidden": true
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
-    ,
-    style: isFhsEnabled ? backgroundStyle : undefined,
-    className: ax([backgroundStyles.root, isExpandedOnDesktop && backgroundStyles.sideNavExpanded])
-  }), /*#__PURE__*/React.createElement("header", {
+  }, /*#__PURE__*/React.createElement("header", {
     id: id,
     "data-layout-slot": true,
-    className: ax([styles.root, isFhsEnabled && styles.fullHeightSidebar, isFhsEnabled && fg('platform-dst-side-nav-layering-fixes') && styles.fullHeightSidebarWithLayeringFixes, isExpandedOnDesktop && isFhsEnabled && styles.fullHeightSidebarExpanded, xcss]),
+    className: ax([styles.root, isFhsEnabled && styles.fullHeightSidebar, isExpandedOnDesktop && isFhsEnabled && styles.fullHeightSidebarExpanded, xcss]),
     "data-testid": testId
     // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
     ,
-    style:
-    // When the layering fixes are enabled, we no longer have separate elements for the foreground and background.
-    isFhsEnabled && !fg('platform-dst-side-nav-layering-fixes') ? foregroundStyle : customTheme.isEnabled ? customTheme.style : undefined
+    style: customTheme.isEnabled ? customTheme.style : undefined
   }, /*#__PURE__*/React.createElement(HoistCssVarToLocalGrid, {
     variableName: topNavMountedVar,
     value: height

package/dist/types/ui/page-layout/constants.d.ts

@@ -26,9 +26,9 @@ export declare const UNSAFE_sideNavLayoutVar = "--leftSidebarWidth";
 export declare const UNSAFE_ribbonVar = "--leftPanelWidth";
 export declare const UNSAFE_asideLayoutVar = "--rightSidebarWidth";
 export declare const UNSAFE_panelLayoutVar = "--rightPanelWidth";
-export declare const UNSAFE_MAIN_BLOCK_START_FOR_LEGACY_PAGES_ONLY = "calc(var(--bannerHeight, 0px) + var(--topNavigationHeight, 0px))";
-export declare const UNSAFE_MAIN_INLINE_START_FOR_LEGACY_PAGES_ONLY = "calc(var(--leftPanelWidth, 0px) + var(--leftSidebarWidth, 0px))";
-export declare const UNSAFE_MAIN_INLINE_END_FOR_LEGACY_PAGES_ONLY = "calc(var(--rightSidebarWidth, 0px) + var(--rightPanelWidth, 0px))";
+export declare const UNSAFE_MAIN_BLOCK_START_FOR_LEGACY_PAGES_ONLY: 'calc(var(--bannerHeight, 0px) + var(--topNavigationHeight, 0px))';
+export declare const UNSAFE_MAIN_INLINE_START_FOR_LEGACY_PAGES_ONLY: 'calc(var(--leftPanelWidth, 0px) + var(--leftSidebarWidth, 0px))';
+export declare const UNSAFE_MAIN_INLINE_END_FOR_LEGACY_PAGES_ONLY: 'calc(var(--rightSidebarWidth, 0px) + var(--rightPanelWidth, 0px))';
 /**
  * We define the z-indexes here so each page slot can be locally layered against each other.
  * For globally defined values such as flag, modal, etc, we can continue to

package/dist/types/ui/page-layout/panel-splitter/context.d.ts

@@ -25,8 +25,6 @@ export type PanelSplitterContextType = {
     getResizeBounds: () => ResizeBounds;
     /**
      * A ref to the portal element where the panel splitter will be rendered.
-     * It can optionally be provided by consumers of <PanelSplitterProvider> (when the feature gate
-     * `platform-dst-side-nav-layering-fixes` is enabled).
      * If not provided, it will be internally set by the PanelSplitterProvider.
      *
      * This prop is useful for:

package/dist/types/ui/page-layout/panel-splitter/provider.d.ts

@@ -12,8 +12,6 @@ export type PanelSplitterProviderProps = Omit<PanelSplitterContextType, 'portalR
     position?: 'start' | 'end';
     /**
      * A ref to the portal element where the panel splitter will be rendered.
-     * It can optionally be provided by consumers of <PanelSplitterProvider> (when the feature gate
-     * `platform-dst-side-nav-layering-fixes` is enabled).
      * If not provided, it will be internally set by the PanelSplitterProvider.
      *
      * This prop is useful for:

package/dist/types/ui/page-layout/ribbon.d.ts

@@ -7,5 +7,5 @@ type RibbonProps = CommonSlotProps & {
     width: string | number;
     children: React.ReactNode;
 };
-export declare function UNSAFE_Ribbon({ children, testId, id: providedId, width }: RibbonProps): JSX.Element | null;
+export declare function UNSAFE_Ribbon({ children, testId, id: providedId, width, }: RibbonProps): JSX.Element | null;
 export {};

package/dist/types/ui/top-nav-items/themed/search.d.ts

@@ -19,8 +19,8 @@ declare const legacySearchTheme: {
          * When expanded the input ignores the custom theme,
          * except for its border which is derived from the highlight color.
          */
-        color: "var(--ds-text)";
-        backgroundColor: "var(--ds-background-input-pressed)";
+        color: 'var(--ds-text)';
+        backgroundColor: 'var(--ds-background-input-pressed)';
         borderColor: string;
         boxShadow: string;
     };

package/dist/types-ts4.5/ui/page-layout/constants.d.ts

@@ -26,9 +26,9 @@ export declare const UNSAFE_sideNavLayoutVar = "--leftSidebarWidth";
 export declare const UNSAFE_ribbonVar = "--leftPanelWidth";
 export declare const UNSAFE_asideLayoutVar = "--rightSidebarWidth";
 export declare const UNSAFE_panelLayoutVar = "--rightPanelWidth";
-export declare const UNSAFE_MAIN_BLOCK_START_FOR_LEGACY_PAGES_ONLY = "calc(var(--bannerHeight, 0px) + var(--topNavigationHeight, 0px))";
-export declare const UNSAFE_MAIN_INLINE_START_FOR_LEGACY_PAGES_ONLY = "calc(var(--leftPanelWidth, 0px) + var(--leftSidebarWidth, 0px))";
-export declare const UNSAFE_MAIN_INLINE_END_FOR_LEGACY_PAGES_ONLY = "calc(var(--rightSidebarWidth, 0px) + var(--rightPanelWidth, 0px))";
+export declare const UNSAFE_MAIN_BLOCK_START_FOR_LEGACY_PAGES_ONLY: 'calc(var(--bannerHeight, 0px) + var(--topNavigationHeight, 0px))';
+export declare const UNSAFE_MAIN_INLINE_START_FOR_LEGACY_PAGES_ONLY: 'calc(var(--leftPanelWidth, 0px) + var(--leftSidebarWidth, 0px))';
+export declare const UNSAFE_MAIN_INLINE_END_FOR_LEGACY_PAGES_ONLY: 'calc(var(--rightSidebarWidth, 0px) + var(--rightPanelWidth, 0px))';
 /**
  * We define the z-indexes here so each page slot can be locally layered against each other.
  * For globally defined values such as flag, modal, etc, we can continue to

package/dist/types-ts4.5/ui/page-layout/panel-splitter/context.d.ts

@@ -25,8 +25,6 @@ export type PanelSplitterContextType = {
     getResizeBounds: () => ResizeBounds;
     /**
      * A ref to the portal element where the panel splitter will be rendered.
-     * It can optionally be provided by consumers of <PanelSplitterProvider> (when the feature gate
-     * `platform-dst-side-nav-layering-fixes` is enabled).
      * If not provided, it will be internally set by the PanelSplitterProvider.
      *
      * This prop is useful for: