@atlaskit/navigation-system 10.6.0 → 10.7.1

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # @atlassian/navigation-system
 
+## 10.7.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 10.7.0
+
+### Minor Changes
+
+- [`90aa712679ee0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/90aa712679ee0) -
+  `AppSwitcher` now accepts a custom `icon` component via the `icon` prop, allowing image-backed
+  visuals (such as a product logo) to be rendered in place of the default Atlassian app switcher
+  icon. The `icon` prop is optional and defaults to the standard app switcher icon, so existing
+  usage is unaffected.
+
+  ```tsx
+  import { AppSwitcher } from '@atlaskit/navigation-system/top-nav-items';
+  import { UnitTile } from '@atlassian/unit-tile';
+
+  const CustomAppSwitcherIcon = () => (
+  	<UnitTile unitName="Confluence" size="small" iconUrl={dstLogo} />
+  );
+
+  <AppSwitcher
+  	icon={CustomAppSwitcherIcon}
+  	label="App switcher"
+  	onClick={() => {
+  		/* open app switcher */
+  	}}
+  />;
+  ```
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 10.6.0
 
 ### Minor Changes

package/dist/cjs/components/badge-container.js

@@ -1,4 +1,4 @@
-/* badge-container.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* badge-container.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/components/list-item.js

@@ -1,4 +1,4 @@
-/* list-item.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* list-item.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/components/list.js

@@ -1,4 +1,4 @@
-/* list.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* list.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/components/skip-links/skip-link.compiled.css

@@ -1,2 +1 @@
-
 ._1rjcu2gc{padding-block:var(--ds-space-100,8px)}._1pfhze3t{margin-block-start:var(--ds-space-0,0)}

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

@@ -1,4 +1,4 @@
-/* skip-link.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* skip-link.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/components/skip-links/skip-links-container.compiled.css

@@ -1,4 +1,3 @@
-
 ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
 ._zulp1b66{gap:var(--ds-space-050,4px)}
 ._18zrutpp{padding-inline:var(--ds-space-150,9pt)}

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

@@ -1,4 +1,4 @@
-/* skip-links-container.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* skip-links-container.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

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

@@ -1,4 +1,4 @@
-/* skip-links-popup.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* skip-links-popup.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/page-layout/aside.compiled.css

@@ -1,4 +1,3 @@
-
 ._nd5lns35{grid-area:aside}._152timx3{inset-block-start:calc(var(--n_bnrM, 0px) + var(--n_tNvM, 0px))}
 ._18m91wug{overflow-y:auto}
 ._1reo1wug{overflow-x:auto}

package/dist/cjs/ui/page-layout/aside.js

@@ -1,4 +1,4 @@
-/* aside.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* aside.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/page-layout/banner.compiled.css

@@ -1,4 +1,3 @@
-
 ._nd5ldkfm{grid-area:banner}._152tidpf{inset-block-start:0}
 ._18m915vq{overflow-y:hidden}
 ._1pby11wp{z-index:3}

package/dist/cjs/ui/page-layout/banner.js

@@ -1,4 +1,4 @@
-/* banner.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* banner.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/ui/page-layout/main/main-sticky-header.js

@@ -1,4 +1,4 @@
-/* main-sticky-header.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* main-sticky-header.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/page-layout/main/main.compiled.css

@@ -1,4 +1,3 @@
-
 ._nd5l1gzg{grid-area:main}._152timx3{inset-block-start:calc(var(--n_bnrM, 0px) + var(--n_tNvM, 0px))}
 ._18m91wug{overflow-y:auto}
 ._19121cl4{isolation:isolate}

package/dist/cjs/ui/page-layout/main/main.js

@@ -1,4 +1,4 @@
-/* main.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* main.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

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

@@ -1,4 +1,4 @@
-/* panel-splitter.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* panel-splitter.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -20,7 +20,7 @@ var _reactDom = require("react-dom");
 var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
 var _useId = require("@atlaskit/ds-lib/use-id");
 var _useStableRef = _interopRequireDefault(require("@atlaskit/ds-lib/use-stable-ref"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _useOpenLayerObserver = require("@atlaskit/layering/use-open-layer-observer");
 var _combine = require("@atlaskit/pragmatic-drag-and-drop/combine");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _blockDraggingToIframes = require("@atlaskit/pragmatic-drag-and-drop/element/block-dragging-to-iframes");
@@ -28,7 +28,7 @@ var _disableNativeDragPreview = require("@atlaskit/pragmatic-drag-and-drop/eleme
 var _preventUnhandled = require("@atlaskit/pragmatic-drag-and-drop/prevent-unhandled");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _TooltipContainer = _interopRequireDefault(require("@atlaskit/tooltip/TooltipContainer"));
-var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
+var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden/visually-hidden"));
 var _useIsFhsEnabled = require("../../fhs-rollout/use-is-fhs-enabled");
 var _constants = require("../constants");
 var _convertResizeBoundToPixels = require("./convert-resize-bound-to-pixels");
@@ -173,7 +173,7 @@ var PortaledPanelSplitter = function PortaledPanelSplitter(_ref3) {
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     rangeInputBounds = _useState4[0],
     setRangeInputBounds = _useState4[1];
-  var openLayerObserver = (0, _openLayerObserver.useOpenLayerObserver)();
+  var openLayerObserver = (0, _useOpenLayerObserver.useOpenLayerObserver)();
 
   /**
    * This is a temporary workaround to enable the `SideNavPanelSplitter` component

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

@@ -9,7 +9,7 @@ exports.SideNavPanelSplitter = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _useOpenLayerObserver = require("@atlaskit/layering/use-open-layer-observer");
 var _useIsFhsEnabled = require("../../fhs-rollout/use-is-fhs-enabled");
 var _constants = require("../constants");
 var _useToggleSideNav = require("../side-nav/use-toggle-side-nav");
@@ -33,7 +33,7 @@ _constants.openLayerObserverTopNavStartNamespace, _constants.openLayerObserverTo
  */
 function useHasOpenPopupsInSideNavOrTopNav() {
   var isFhsEnabled = (0, _useIsFhsEnabled.useIsFhsEnabled)();
-  var openLayerObserver = (0, _openLayerObserver.useOpenLayerObserver)();
+  var openLayerObserver = (0, _useOpenLayerObserver.useOpenLayerObserver)();
   // Setting the initial state to false, as it is unlikely that there would be any open popups when the app starts.
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),

package/dist/cjs/ui/page-layout/panel.compiled.css

@@ -1,4 +1,3 @@
-
 ._nd5l1b6c{grid-area:main/aside/aside/aside}
 ._y44v1s3l{animation:var(--ds-panel-enter,.25s cubic-bezier(0,.4,0,1) SlideIn100PercentRight)}
 ._y44vqhwn{animation:var(--ds-panel-exit,.2s cubic-bezier(.6,0,.8,.6) SlideOut100PercentRight)}

package/dist/cjs/ui/page-layout/panel.js

@@ -1,4 +1,4 @@
-/* panel.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* panel.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/page-layout/ribbon.compiled.css

@@ -1,4 +1,3 @@
-
 ._nd5l1c99{grid-area:ribbon}._152tidpf{inset-block-start:0}
 ._18m915vq{overflow-y:hidden}
 ._1e0cglyw{display:none}

package/dist/cjs/ui/page-layout/ribbon.js

@@ -1,4 +1,4 @@
-/* ribbon.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* ribbon.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

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

@@ -1,4 +1,4 @@
-/* root.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* root.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");
@@ -10,7 +10,7 @@ exports.gridRootId = void 0;
 require("./root.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireWildcard(require("react"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _openLayerObserver = require("@atlaskit/layering/open-layer-observer");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _skipLinksProvider = require("../../context/skip-links/skip-links-provider");
 var _topNavStartContextProvider = require("../../context/top-nav-start/top-nav-start-context-provider");

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

@@ -1,4 +1,4 @@
-/* side-nav-content.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* side-nav-content.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/page-layout/side-nav/side-nav-footer.js

@@ -1,4 +1,4 @@
-/* side-nav-footer.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* side-nav-footer.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

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

@@ -1,4 +1,4 @@
-/* side-nav-header.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* side-nav-header.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

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

@@ -1,4 +1,3 @@
-
 ._nd5l1b6c{grid-area:main/aside/aside/aside}
 ._191wglyw{border-inline-start:none}
 ._t51zglyw{border-inline-end:none}._152timx3{inset-block-start:calc(var(--n_bnrM, 0px) + var(--n_tNvM, 0px))}

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

@@ -1,4 +1,4 @@
-/* side-nav.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* side-nav.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -19,7 +19,8 @@ var _reactDom = require("react-dom");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
 var _useStableRef = _interopRequireDefault(require("@atlaskit/ds-lib/use-stable-ref"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _openLayerObserverNamespaceProvider = require("@atlaskit/layering/open-layer-observer-namespace-provider");
+var _useOpenLayerObserver = require("@atlaskit/layering/use-open-layer-observer");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _responsive = require("@atlaskit/primitives/responsive");
@@ -242,7 +243,7 @@ function SideNavInternal(_ref) {
   var toggleButtonElement = (0, _react.useContext)(_sideNavToggleButtonElement.SideNavToggleButtonElement);
   var topNavStartElement = (0, _react.useContext)(_topNavStartElement.TopNavStartElement);
   var devTimeOnlyAttributes = {};
-  var openLayerObserver = (0, _openLayerObserver.useOpenLayerObserver)();
+  var openLayerObserver = (0, _useOpenLayerObserver.useOpenLayerObserver)();
   var flyoutStateRef = (0, _react.useRef)({
     type: 'not-active'
   });
@@ -852,7 +853,7 @@ function SideNav(_ref9) {
     onPeekEnd = _ref9.onPeekEnd,
     canToggleWithShortcut = _ref9.canToggleWithShortcut,
     id = _ref9.id;
-  return /*#__PURE__*/_react.default.createElement(_openLayerObserver.OpenLayerObserverNamespaceProvider, {
+  return /*#__PURE__*/_react.default.createElement(_openLayerObserverNamespaceProvider.OpenLayerObserverNamespaceProvider, {
     namespace: _constants.openLayerObserverSideNavNamespace
   }, /*#__PURE__*/_react.default.createElement(SideNavInternal, {
     defaultCollapsed: defaultCollapsed,

package/dist/cjs/ui/page-layout/side-nav/toggle-button.js

@@ -1,4 +1,4 @@
-/* toggle-button.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* toggle-button.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -16,7 +16,7 @@ var _bindEventListener = require("bind-event-listener");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _sidebarCollapse = _interopRequireDefault(require("@atlaskit/icon/core/sidebar-collapse"));
 var _sidebarExpand = _interopRequireDefault(require("@atlaskit/icon/core/sidebar-expand"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _useOpenLayerObserver = require("@atlaskit/layering/use-open-layer-observer");
 var _useIsFhsEnabled = require("../../fhs-rollout/use-is-fhs-enabled");
 var _iconButton = require("../../top-nav-items/themed/icon-button");
 var _sideNavToggleButtonAttachRef = require("./side-nav-toggle-button-attach-ref");
@@ -101,7 +101,7 @@ var SideNavToggleButton = exports.SideNavToggleButton = function SideNavToggleBu
   });
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
-  var openLayerObserver = (0, _openLayerObserver.useOpenLayerObserver)();
+  var openLayerObserver = (0, _useOpenLayerObserver.useOpenLayerObserver)();
   var handleClick = (0, _react.useCallback)(function (event, analyticsEvent) {
     onClick === null || onClick === void 0 || onClick(event, analyticsEvent, {
       isSideNavVisible: isSideNavExpanded

package/dist/cjs/ui/page-layout/side-nav/use-side-nav-toggle-keyboard-shortcut.js

@@ -8,7 +8,7 @@ exports.useSideNavToggleKeyboardShortcut = useSideNavToggleKeyboardShortcut;
 var _react = require("react");
 var _bindEventListener = require("bind-event-listener");
 var _useStableRef = _interopRequireDefault(require("@atlaskit/ds-lib/use-stable-ref"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _useOpenLayerObserver = require("@atlaskit/layering/use-open-layer-observer");
 var _useIsFhsEnabled = require("../../fhs-rollout/use-is-fhs-enabled");
 var _useIsSideNavShortcutEnabled = require("./use-is-side-nav-shortcut-enabled");
 var _useToggleSideNav = require("./use-toggle-side-nav");
@@ -18,7 +18,7 @@ var _useToggleSideNav = require("./use-toggle-side-nav");
 function useSideNavToggleKeyboardShortcut(_ref) {
   var canToggleWithShortcut = _ref.canToggleWithShortcut;
   var isFhsEnabled = (0, _useIsFhsEnabled.useIsFhsEnabled)();
-  var openLayerObserver = (0, _openLayerObserver.useOpenLayerObserver)();
+  var openLayerObserver = (0, _useOpenLayerObserver.useOpenLayerObserver)();
   var toggleVisibilityByShortcut = (0, _useToggleSideNav.useToggleSideNav)({
     trigger: 'keyboard'
   });

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

@@ -1,4 +1,3 @@
-
 ._1yt4u2gc{padding:var(--ds-space-100,8px)}
 ._zulp1b66{gap:var(--ds-space-050,4px)}
 ._yyhy11wp{grid-column:3}._1bahh9n0{justify-content:end}

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

@@ -1,4 +1,4 @@
-/* top-nav-end.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* top-nav-end.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -15,7 +15,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@compiled/react");
 var _useLayoutEffect = require("@atlaskit/ds-lib/use-layout-effect");
 var _showMoreHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/show-more-horizontal"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _openLayerObserverNamespaceProvider = require("@atlaskit/layering/open-layer-observer-namespace-provider");
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
 var _compiled = require("@atlaskit/primitives/compiled");
 var _list = require("../../../components/list");
@@ -86,7 +86,7 @@ function TopNavEnd(_ref) {
         value: false
       }, /*#__PURE__*/_react.default.createElement(_list.List, {
         xcss: (0, _react2.cx)(listStyles.root, listStyles.popupContainer)
-      }, /*#__PURE__*/_react.default.createElement(_openLayerObserver.OpenLayerObserverNamespaceProvider, {
+      }, /*#__PURE__*/_react.default.createElement(_openLayerObserverNamespaceProvider.OpenLayerObserverNamespaceProvider, {
         namespace: _constants.openLayerObserverTopNavEndNamespace
       }, children)));
     },
@@ -103,7 +103,7 @@ function TopNavEnd(_ref) {
     }
   }) : /*#__PURE__*/_react.default.createElement(_list.List, {
     xcss: (0, _react2.cx)(listStyles.root, listStyles.hideOnSmallViewport)
-  }, /*#__PURE__*/_react.default.createElement(_openLayerObserver.OpenLayerObserverNamespaceProvider, {
+  }, /*#__PURE__*/_react.default.createElement(_openLayerObserverNamespaceProvider.OpenLayerObserverNamespaceProvider, {
     namespace: _constants.openLayerObserverTopNavEndNamespace
   }, children)));
 }

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

@@ -1,4 +1,3 @@
-
 ._zulpu2gc{gap:var(--ds-space-100,8px)}
 ._yyhycs5v{grid-column:2}._1bahh9n0{justify-content:end}
 ._1bsb1osq{width:100%}

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

@@ -1,4 +1,4 @@
-/* top-nav-middle.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* top-nav-middle.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -9,7 +9,7 @@ exports.TopNavMiddle = TopNavMiddle;
 require("./top-nav-middle.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _react = _interopRequireDefault(require("react"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _openLayerObserverNamespaceProvider = require("@atlaskit/layering/open-layer-observer-namespace-provider");
 var _constants = require("../constants");
 var styles = {
   root: "_zulpu2gc _yyhycs5v _1bsb1osq _4cvr1h6o _1e0c1txw _1bahh9n0 _181n11p5 _1j8b15b0 _lagd1bp4 _1t4c1ris _12e8h9n0"
@@ -27,7 +27,7 @@ function TopNavMiddle(_ref) {
   var children = _ref.children;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _runtime.ax)([styles.root])
-  }, /*#__PURE__*/_react.default.createElement(_openLayerObserver.OpenLayerObserverNamespaceProvider, {
+  }, /*#__PURE__*/_react.default.createElement(_openLayerObserverNamespaceProvider.OpenLayerObserverNamespaceProvider, {
     namespace: _constants.openLayerObserverTopNavMiddleNamespace
   }, children));
 }

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

@@ -1,4 +1,3 @@
-
 ._zulp1b66{gap:var(--ds-space-050,4px)}
 ._zulp1kw7{gap:inherit}
 ._yyhykb7n{grid-column:1}._15yekb7n{--animation-direction:1}

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

@@ -1,4 +1,4 @@
-/* top-nav-start.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* top-nav-start.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -12,7 +12,7 @@ var _runtime = require("@compiled/react/runtime");
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _useStableRef = _interopRequireDefault(require("@atlaskit/ds-lib/use-stable-ref"));
-var _openLayerObserver = require("@atlaskit/layering/experimental/open-layer-observer");
+var _openLayerObserverNamespaceProvider = require("@atlaskit/layering/open-layer-observer-namespace-provider");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _compiled = require("@atlaskit/primitives/compiled");
 var _topNavStartAttachRef = require("../../../context/top-nav-start/top-nav-start-attach-ref");
@@ -145,7 +145,7 @@ var TopNavStartInnerFHS = /*#__PURE__*/(0, _react.forwardRef)(function TopNavSta
     ref: ref,
     "data-testid": testId,
     className: (0, _runtime.ax)([innerStyles.root, isExpandedOnDesktop && innerStyles.fullHeightSidebarExpanded])
-  }, /*#__PURE__*/_react.default.createElement(_openLayerObserver.OpenLayerObserverNamespaceProvider, {
+  }, /*#__PURE__*/_react.default.createElement(_openLayerObserverNamespaceProvider.OpenLayerObserverNamespaceProvider, {
     namespace: _constants.openLayerObserverTopNavStartNamespace
   }, children)));
 });

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

@@ -1,4 +1,3 @@
-
 ._nd5l8cbt{grid-area:top-bar}
 ._zulpu2gc{gap:var(--ds-space-100,8px)}
 ._18zrutpp{padding-inline:var(--ds-space-150,9pt)}

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

@@ -1,4 +1,4 @@
-/* top-nav.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* top-nav.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/ui/top-nav-items/app-switcher.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.AppSwitcher = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _appSwitcher = _interopRequireDefault(require("@atlaskit/icon/core/app-switcher"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _iconButton = require("./themed/icon-button");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var toggleButtonTooltipOptions = {
@@ -23,19 +24,22 @@ var toggleButtonTooltipOptions = {
  */
 var AppSwitcher = exports.AppSwitcher = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var label = _ref.label,
+    icon = _ref.icon,
     onClick = _ref.onClick,
     onMouseEnter = _ref.onMouseEnter,
     interactionName = _ref.interactionName,
     isSelected = _ref.isSelected,
+    testId = _ref.testId,
     ariaControls = _ref['aria-controls'],
     ariaExpanded = _ref['aria-expanded'],
     ariaHasPopup = _ref['aria-haspopup'];
+  var pickedAppSwitcherIcon = (0, _platformFeatureFlags.fg)('platform_dst_ads_appswitcher_improvements') ? icon !== null && icon !== void 0 ? icon : _appSwitcher.default : _appSwitcher.default;
   return /*#__PURE__*/_react.default.createElement(_iconButton.IconButton, {
     ref: ref,
     "aria-controls": ariaControls,
     "aria-expanded": ariaExpanded,
     "aria-haspopup": ariaHasPopup,
-    icon: _appSwitcher.default,
+    icon: pickedAppSwitcherIcon,
     label: label,
     appearance: "subtle",
     onClick: onClick,
@@ -43,6 +47,7 @@ var AppSwitcher = exports.AppSwitcher = /*#__PURE__*/(0, _react.forwardRef)(func
     interactionName: interactionName,
     isTooltipDisabled: false,
     tooltip: toggleButtonTooltipOptions,
-    isSelected: isSelected
+    isSelected: isSelected,
+    testId: testId
   });
 });

package/dist/cjs/ui/top-nav-items/custom-title.js

@@ -1,4 +1,4 @@
-/* custom-title.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* custom-title.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/ui/top-nav-items/nav-logo/app-logo.compiled.css

@@ -1,4 +1,3 @@
-
 ._2rko19bv{border-radius:10px}
 ._2rko1mok{border-radius:var(--ds-radius-large,8px)}
 ._18zr1b66{padding-inline:var(--ds-space-050,4px)}._18m915vq{overflow-y:hidden}

package/dist/cjs/ui/top-nav-items/nav-logo/app-logo.js

@@ -1,4 +1,4 @@
-/* app-logo.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* app-logo.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/top-nav-items/nav-logo/custom-logo.compiled.css

@@ -1,4 +1,3 @@
-
 ._2rko1mok{border-radius:var(--ds-radius-large,8px)}
 ._2rkofajl{border-radius:var(--ds-radius-small,3px)}
 ._18zr1b66{padding-inline:var(--ds-space-050,4px)}._18m915vq{overflow-y:hidden}

package/dist/cjs/ui/top-nav-items/nav-logo/custom-logo.js

@@ -1,4 +1,4 @@
-/* custom-logo.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* custom-logo.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/ui/top-nav-items/nav-logo/logo-renderer.js

@@ -1,4 +1,4 @@
-/* logo-renderer.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* logo-renderer.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _typeof = require("@babel/runtime/helpers/typeof");

package/dist/cjs/ui/top-nav-items/search.compiled.css

@@ -1,4 +1,3 @@
-
 ._2rko12b0{border-radius:var(--ds-radius-small,4px)}
 ._2rko1qi0{border-radius:var(--ds-radius-medium,6px)}._18zr12x7{padding-inline:var(--ds-space-075,6px)}
 ._1ii7kb7n{grid-row:1}

package/dist/cjs/ui/top-nav-items/search.js

@@ -1,4 +1,4 @@
-/* search.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* search.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/top-nav-items/themed/themed-anchor.compiled.css

@@ -1,4 +1,3 @@
-
 ._11c8fhey{font:var(--ds-font-body,normal 400 14px/20px "Atlassian Sans",ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Ubuntu,"Helvetica Neue",sans-serif)}
 ._11q71c9b{background:var(--ds-top-bar-button-disabled-background)}
 ._11q71qds{background:var(--ds-top-bar-button-selected-background)}

package/dist/cjs/ui/top-nav-items/themed/themed-anchor.js

@@ -1,4 +1,4 @@
-/* themed-anchor.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* themed-anchor.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/top-nav-items/themed/themed-button.js

@@ -1,4 +1,4 @@
-/* themed-button.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* themed-button.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/top-nav-items/themed/themed-icon-button.js

@@ -1,4 +1,4 @@
-/* themed-icon-button.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* themed-icon-button.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -13,7 +13,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 var _react = _interopRequireWildcard(require("react"));
 var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
+var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden/visually-hidden"));
 var _iconRenderer = _interopRequireDefault(require("../icon-renderer"));
 var _themedPressable = require("./themed-pressable");
 var _excluded = ["icon", "label", "tooltip"];

package/dist/cjs/ui/top-nav-items/themed/themed-link-button.js

@@ -1,4 +1,4 @@
-/* themed-link-button.tsx generated by @compiled/babel-plugin v0.39.1 */
+/* themed-link-button.tsx generated by @compiled/babel-plugin v0.40.0 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/ui/top-nav-items/themed/themed-link-icon-button.js

@@ -11,7 +11,7 @@ var _react = _interopRequireDefault(require("react"));
 var _forwardRefWithGeneric = _interopRequireDefault(require("@atlaskit/ds-lib/forward-ref-with-generic"));
 var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
+var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden/visually-hidden"));
 var _themedAnchor = require("./themed-anchor");
 var _excluded = ["icon", "label", "tooltip"];
 /**