@atlaskit/navigation-system 9.1.0 → 9.1.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlassian/navigation-system
 
+## 9.1.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 9.1.1
+
+### Patch Changes
+
+- [`0d8519bedea15`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0d8519bedea15) -
+  Cleanup feature gate `platform_themed_button_use_icon_renderer`. Icon renderer is now always used
+  for themed button icons.
+
 ## 9.1.0
 
 ### Minor Changes

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

@@ -125,8 +125,8 @@ var MaybeTooltip = function MaybeTooltip(_ref2) {
       mousePosition: "right",
       isScreenReaderAnnouncementDisabled: true,
       component: PanelSplitterTooltip,
-      UNSAFE_shouldAlwaysFadeIn: true,
-      UNSAFE_shouldRenderToParent: true
+      shouldAlwaysFadeIn: true,
+      shouldRenderToParent: true
     }, children);
   }
   return children;

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

@@ -20,6 +20,7 @@ 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 _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _adapter = require("@atlaskit/pragmatic-drag-and-drop/element/adapter");
 var _responsive = require("@atlaskit/primitives/responsive");
 var _useSkipLinkInternal = require("../../../context/skip-links/use-skip-link-internal");
@@ -357,14 +358,23 @@ function SideNavInternal(_ref) {
 
     // Sync the visibility in context (provided in `<Root>`) with the local `defaultCollapsed` prop provided to `SideNav`
     // after SSR hydration. This should only run once, after the initial render on the client.
-    (0, _react.startTransition)(function () {
+    if ((0, _platformFeatureFlags.fg)('navx-4418-fix-effect-state-updates-in-gsn')) {
+      (0, _react.startTransition)(function () {
+        setSideNavState({
+          desktop: initialDefaultCollapsed ? 'collapsed' : 'expanded',
+          mobile: 'collapsed',
+          flyout: 'closed',
+          lastTrigger: null
+        });
+      });
+    } else {
       setSideNavState({
         desktop: initialDefaultCollapsed ? 'collapsed' : 'expanded',
         mobile: 'collapsed',
         flyout: 'closed',
         lastTrigger: null
       });
-    });
+    }
   }, [initialDefaultCollapsed, setSideNavState, sideNavState]);
   var handleExpand = (0, _react.useCallback)(function (_ref2) {
     var screen = _ref2.screen,

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

@@ -12,7 +12,6 @@ var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _iconRenderer = _interopRequireDefault(require("../icon-renderer"));
 var _themedPressable = require("./themed-pressable");
 var _excluded = ["iconBefore", "children"];
@@ -29,11 +28,8 @@ var ThemedButton = exports.ThemedButton = /*#__PURE__*/(0, _react.forwardRef)(fu
     ref: ref
   }), IconBefore && /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _runtime.ax)([textButtonStyles.iconBefore])
-  }, (0, _platformFeatureFlags.fg)('platform_themed_button_use_icon_renderer') ? /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
+  }, /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
     icon: IconBefore
-  }) : /*#__PURE__*/_react.default.createElement(IconBefore, {
-    label: "",
-    color: "currentColor"
   })), /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _runtime.ax)([textButtonStyles.text])
   }, children));

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

@@ -12,7 +12,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
 var _iconRenderer = _interopRequireDefault(require("../icon-renderer"));
@@ -74,11 +73,8 @@ var ThemedIconButton = exports.ThemedIconButton = /*#__PURE__*/(0, _react.forwar
           (_triggerProps$onBlur = triggerProps.onBlur) === null || _triggerProps$onBlur === void 0 || _triggerProps$onBlur.call(triggerProps, e);
           (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, e);
         }
-      }), (0, _platformFeatureFlags.fg)('platform_themed_button_use_icon_renderer') ? /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
+      }), /*#__PURE__*/_react.default.createElement(_iconRenderer.default, {
         icon: Icon
-      }) : /*#__PURE__*/_react.default.createElement(Icon, {
-        label: "",
-        color: "currentColor"
       }), /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, null, label))
     );
   });

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

@@ -113,8 +113,8 @@ const MaybeTooltip = ({
       mousePosition: "right",
       isScreenReaderAnnouncementDisabled: true,
       component: PanelSplitterTooltip,
-      UNSAFE_shouldAlwaysFadeIn: true,
-      UNSAFE_shouldRenderToParent: true
+      shouldAlwaysFadeIn: true,
+      shouldRenderToParent: true
     }, children);
   }
   return children;

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

@@ -9,6 +9,7 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import mergeRefs from '@atlaskit/ds-lib/merge-refs';
 import useStableRef from '@atlaskit/ds-lib/use-stable-ref';
 import { OpenLayerObserverNamespaceProvider, useOpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { media } from '@atlaskit/primitives/responsive';
 import { useSkipLinkInternal } from '../../../context/skip-links/use-skip-link-internal';
@@ -338,14 +339,23 @@ function SideNavInternal({
 
     // Sync the visibility in context (provided in `<Root>`) with the local `defaultCollapsed` prop provided to `SideNav`
     // after SSR hydration. This should only run once, after the initial render on the client.
-    startTransition(() => {
+    if (fg('navx-4418-fix-effect-state-updates-in-gsn')) {
+      startTransition(() => {
+        setSideNavState({
+          desktop: initialDefaultCollapsed ? 'collapsed' : 'expanded',
+          mobile: 'collapsed',
+          flyout: 'closed',
+          lastTrigger: null
+        });
+      });
+    } else {
       setSideNavState({
         desktop: initialDefaultCollapsed ? 'collapsed' : 'expanded',
         mobile: 'collapsed',
         flyout: 'closed',
         lastTrigger: null
       });
-    });
+    }
   }, [initialDefaultCollapsed, setSideNavState, sideNavState]);
   const handleExpand = useCallback(({
     screen,

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

@@ -3,7 +3,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import "./themed-button.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef } from 'react';
-import { fg } from '@atlaskit/platform-feature-flags';
 import IconRenderer from '../icon-renderer';
 import { ThemedPressable } from './themed-pressable';
 const textButtonStyles = {
@@ -19,11 +18,8 @@ export const ThemedButton = /*#__PURE__*/forwardRef(function ThemedButton({
     ref: ref
   }), IconBefore && /*#__PURE__*/React.createElement("span", {
     className: ax([textButtonStyles.iconBefore])
-  }, fg('platform_themed_button_use_icon_renderer') ? /*#__PURE__*/React.createElement(IconRenderer, {
+  }, /*#__PURE__*/React.createElement(IconRenderer, {
     icon: IconBefore
-  }) : /*#__PURE__*/React.createElement(IconBefore, {
-    label: "",
-    color: "currentColor"
   })), /*#__PURE__*/React.createElement("span", {
     className: ax([textButtonStyles.text])
   }, children));

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

@@ -3,7 +3,6 @@ import _extends from "@babel/runtime/helpers/extends";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef } from 'react';
 import mergeRefs from '@atlaskit/ds-lib/merge-refs';
-import { fg } from '@atlaskit/platform-feature-flags';
 import Tooltip from '@atlaskit/tooltip';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import IconRenderer from '../icon-renderer';
@@ -63,10 +62,7 @@ export const ThemedIconButton = /*#__PURE__*/forwardRef(function ThemedIconButto
       (_triggerProps$onBlur = triggerProps.onBlur) === null || _triggerProps$onBlur === void 0 ? void 0 : _triggerProps$onBlur.call(triggerProps, e);
       (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 ? void 0 : _props$onBlur.call(props, e);
     }
-  }), fg('platform_themed_button_use_icon_renderer') ? /*#__PURE__*/React.createElement(IconRenderer, {
+  }), /*#__PURE__*/React.createElement(IconRenderer, {
     icon: Icon
-  }) : /*#__PURE__*/React.createElement(Icon, {
-    label: "",
-    color: "currentColor"
   }), /*#__PURE__*/React.createElement(VisuallyHidden, null, label)));
 });

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

@@ -116,8 +116,8 @@ var MaybeTooltip = function MaybeTooltip(_ref2) {
       mousePosition: "right",
       isScreenReaderAnnouncementDisabled: true,
       component: PanelSplitterTooltip,
-      UNSAFE_shouldAlwaysFadeIn: true,
-      UNSAFE_shouldRenderToParent: true
+      shouldAlwaysFadeIn: true,
+      shouldRenderToParent: true
     }, children);
   }
   return children;

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

@@ -13,6 +13,7 @@ import { useAnalyticsEvents } from '@atlaskit/analytics-next';
 import mergeRefs from '@atlaskit/ds-lib/merge-refs';
 import useStableRef from '@atlaskit/ds-lib/use-stable-ref';
 import { OpenLayerObserverNamespaceProvider, useOpenLayerObserver } from '@atlaskit/layering/experimental/open-layer-observer';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { monitorForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
 import { media } from '@atlaskit/primitives/responsive';
 import { useSkipLinkInternal } from '../../../context/skip-links/use-skip-link-internal';
@@ -347,14 +348,23 @@ function SideNavInternal(_ref) {
 
     // Sync the visibility in context (provided in `<Root>`) with the local `defaultCollapsed` prop provided to `SideNav`
     // after SSR hydration. This should only run once, after the initial render on the client.
-    startTransition(function () {
+    if (fg('navx-4418-fix-effect-state-updates-in-gsn')) {
+      startTransition(function () {
+        setSideNavState({
+          desktop: initialDefaultCollapsed ? 'collapsed' : 'expanded',
+          mobile: 'collapsed',
+          flyout: 'closed',
+          lastTrigger: null
+        });
+      });
+    } else {
       setSideNavState({
         desktop: initialDefaultCollapsed ? 'collapsed' : 'expanded',
         mobile: 'collapsed',
         flyout: 'closed',
         lastTrigger: null
       });
-    });
+    }
   }, [initialDefaultCollapsed, setSideNavState, sideNavState]);
   var handleExpand = useCallback(function (_ref2) {
     var screen = _ref2.screen,

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

@@ -5,7 +5,6 @@ var _excluded = ["iconBefore", "children"];
 import "./themed-button.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef } from 'react';
-import { fg } from '@atlaskit/platform-feature-flags';
 import IconRenderer from '../icon-renderer';
 import { ThemedPressable } from './themed-pressable';
 var textButtonStyles = {
@@ -20,11 +19,8 @@ export var ThemedButton = /*#__PURE__*/forwardRef(function ThemedButton(_ref, re
     ref: ref
   }), IconBefore && /*#__PURE__*/React.createElement("span", {
     className: ax([textButtonStyles.iconBefore])
-  }, fg('platform_themed_button_use_icon_renderer') ? /*#__PURE__*/React.createElement(IconRenderer, {
+  }, /*#__PURE__*/React.createElement(IconRenderer, {
     icon: IconBefore
-  }) : /*#__PURE__*/React.createElement(IconBefore, {
-    label: "",
-    color: "currentColor"
   })), /*#__PURE__*/React.createElement("span", {
     className: ax([textButtonStyles.text])
   }, children));

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

@@ -5,7 +5,6 @@ var _excluded = ["icon", "label", "tooltip"];
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef } from 'react';
 import mergeRefs from '@atlaskit/ds-lib/merge-refs';
-import { fg } from '@atlaskit/platform-feature-flags';
 import Tooltip from '@atlaskit/tooltip';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import IconRenderer from '../icon-renderer';
@@ -65,11 +64,8 @@ export var ThemedIconButton = /*#__PURE__*/forwardRef(function ThemedIconButton(
           (_triggerProps$onBlur = triggerProps.onBlur) === null || _triggerProps$onBlur === void 0 || _triggerProps$onBlur.call(triggerProps, e);
           (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, e);
         }
-      }), fg('platform_themed_button_use_icon_renderer') ? /*#__PURE__*/React.createElement(IconRenderer, {
+      }), /*#__PURE__*/React.createElement(IconRenderer, {
         icon: Icon
-      }) : /*#__PURE__*/React.createElement(Icon, {
-        label: "",
-        color: "currentColor"
       }), /*#__PURE__*/React.createElement(VisuallyHidden, null, label))
     );
   });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/navigation-system",
-	"version": "9.1.0",
+	"version": "9.1.2",
 	"description": "The latest navigation system for Atlassian apps.",
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
 	"author": "Atlassian Pty Ltd",
@@ -86,7 +86,7 @@
 		"@atlaskit/primitives": "^19.0.0",
 		"@atlaskit/side-nav-items": "^1.13.0",
 		"@atlaskit/tokens": "^13.0.0",
-		"@atlaskit/tooltip": "^21.2.0",
+		"@atlaskit/tooltip": "^22.0.0",
 		"@atlaskit/visually-hidden": "^3.1.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.20.0",
@@ -163,9 +163,6 @@
 		"navx-full-height-sidebar": {
 			"type": "boolean"
 		},
-		"platform_themed_button_use_icon_renderer": {
-			"type": "boolean"
-		},
 		"platform_dst_button_chevron_sizing": {
 			"type": "boolean"
 		},
@@ -175,6 +172,9 @@
 		"platform_dst_nav4_flyout_menu_slots_close_button": {
 			"type": "boolean"
 		},
+		"navx-4418-fix-effect-state-updates-in-gsn": {
+			"type": "boolean"
+		},
 		"platform_dst_nav4_custom_theming_fhs_1": {
 			"type": "boolean"
 		},