Merge branch 'main' into fix-multiple-tooltop-layer

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## [1.1.2](https://github.com/gravity-ui/navigation/compare/v1.1.1...v1.1.2) (2023-10-17)
+
+
+### Bug Fixes
+
+* **CompositeBar:** recalc mounted PopupPosition if compact mode changed ([#138](https://github.com/gravity-ui/navigation/issues/138)) ([56ac451](https://github.com/gravity-ui/navigation/commit/56ac451bebb55a8d8163fb9ccd38acb236f1eb99))
+
 ## [1.1.1](https://github.com/gravity-ui/navigation/compare/v1.1.0...v1.1.1) (2023-10-13)
 
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/navigation",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "Gravity UI Navigation components",
   "license": "MIT",
   "repository": {

src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx

@@ -155,6 +155,7 @@ export const AsideHeaderShowcase: FC<AsideHeaderShowcaseProps> = ({
                             popupPlacement={['right-end']}
                             popupOffset={[-20, 10]}
                             onClosePopup={() => setPopupVisible(false)}
+                            popupKeepMounted={true}
                             renderPopupContent={() => {
                                 return (
                                     <div className={b('settings')}>

src/components/CompositeBar/Item/Item.tsx

@@ -102,6 +102,19 @@ export const Item: React.FC<ItemInnerProps> = (props) => {
     const iconSize = item.iconSize || ASIDE_HEADER_ICON_SIZE;
     const collapsedItem = item.id === COLLAPSE_ITEM_ID;
 
+    const modifiers: Required<PopupProps>['modifiers'] = React.useMemo(
+        () => [
+            {
+                name: 'compact',
+                enabled: true,
+                options: {compact},
+                phase: 'main',
+                fn() {},
+            },
+        ],
+        [compact],
+    );
+
     const onClose = React.useCallback(
         (event: MouseEvent | KeyboardEvent) => {
             if (
@@ -191,6 +204,7 @@ export const Item: React.FC<ItemInnerProps> = (props) => {
                         offset={popupOffset}
                         anchorRef={anchorRef}
                         onClose={onClose}
+                        modifiers={modifiers}
                     >
                         {renderPopupContent()}
                     </Popup>