@skbkontur/side-menu 0.11.0 → 0.12.0

package/CHANGELOG.md

@@ -3,6 +3,31 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.12.0](https://git.skbkontur.ru/ui/ui-parking/compare/@skbkontur/side-menu@0.11.1...@skbkontur/side-menu@0.12.0) (2023-06-05)
+
+
+### Features
+
+* **icons:** new icons, renaming icons, new API ([8d55b8d](https://git.skbkontur.ru/ui/ui-parking/commits/8d55b8d0459ea3e6af329813cbfe7b85ee239b51))
+
+
+### BREAKING CHANGES
+
+* **icons:** prop `disableCompensation` replaced with prop `align`
+* **icons:** icons now use numbers instead of letters for representing numbers
+
+
+
+
+
+## [0.11.1](https://git.skbkontur.ru/ui/ui-parking/compare/@skbkontur/side-menu@0.11.0...@skbkontur/side-menu@0.11.1) (2023-06-02)
+
+**Note:** Version bump only for package @skbkontur/side-menu
+
+
+
+
+
 # [0.11.0](https://git.skbkontur.ru/ui/ui-parking/compare/@skbkontur/side-menu@0.10.1...@skbkontur/side-menu@0.11.0) (2023-05-30)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skbkontur/side-menu",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
@@ -22,7 +22,7 @@
     "@skbkontur/react-ui": "4.13.0"
   },
   "dependencies": {
-    "@skbkontur/icons": "^0.16.0",
+    "@skbkontur/icons": "^0.17.0",
     "@skbkontur/react-ui-addons": "^4.7.0",
     "tslib": "^1"
   }

package/src/SideMenu/SideMenu.js

@@ -161,6 +161,7 @@ var SideMenuInner = forwardRef(function (_a, ref) {
     }, {
         opacity: 0,
     }), shouldShowBackdrop = _x[0], backdropStyle = _x[1];
+    var isSideMenuOverflowing = (isTabletOrMobile && isShown) || (isNarrowDesktop && !isMinimized);
     return (React.createElement(SideMenuContext.Provider, { value: {
             isMinimized: isMinimized,
             setIsMinimized: showMinimizedRoot,
@@ -188,7 +189,7 @@ var SideMenuInner = forwardRef(function (_a, ref) {
             headerHeight: headerHeight,
             setHeaderHeight: setHeaderHeight,
         } },
-        React.createElement(ZIndex, { priority: isTabletOrMobile || isNarrowDesktop ? 8 : 0, className: cx((_b = {},
+        React.createElement(ZIndex, { priority: isSideMenuOverflowing ? 8 : 0, className: cx((_b = {},
                 _b[jsStyles.root()] = true,
                 _b[customStyles.rootForTabletsOrMobiles(headerHeight)] = isTabletOrMobile,
                 _b[jsStyles.shownRootForTabletsOrMobiles()] = isShown && isTabletOrMobile,

package/src/internal/Burger.js

@@ -1,7 +1,7 @@
 import React, { useContext } from 'react';
 import { jsStyles } from './Burger.styles';
 import { SideMenuContext } from '../SideMenuContext';
-import { UiMenuBarsThreeHIcon24Regular } from '@skbkontur/icons';
+import { UiMenuBars3HIcon24Regular } from '@skbkontur/icons';
 import { SideMenuDataTids } from '../../SideMenuDataTids';
 import { getSideMenuTheme } from '../../lib/theming/ThemeHelpers';
 import { ThemeContext } from '@skbkontur/react-ui';
@@ -9,5 +9,5 @@ export var Burger = function () {
     var context = useContext(SideMenuContext);
     var theme = getSideMenuTheme(useContext(ThemeContext));
     return (React.createElement("button", { className: jsStyles.rootForTabletsOrMobiles(theme), onClick: context.toggleIsShown, "data-tid": SideMenuDataTids.burger },
-        React.createElement(UiMenuBarsThreeHIcon24Regular, null)));
+        React.createElement(UiMenuBars3HIcon24Regular, null)));
 };

package/src/internal/InnerSubMenu.d.ts

@@ -1,10 +1,9 @@
 import React from 'react';
-import { ZIndex } from '@skbkontur/react-ui/internal/ZIndex';
 interface InnerSubMenuProps {
     children?: React.ReactNode;
     generatedId?: string;
 }
-declare const InnerSubMenuWithStaticFields: React.ForwardRefExoticComponent<InnerSubMenuProps & React.RefAttributes<ZIndex>> & {
+declare const InnerSubMenuWithStaticFields: React.ForwardRefExoticComponent<InnerSubMenuProps & React.RefAttributes<HTMLDivElement>> & {
     __KONTUR_REACT_UI__: string;
 };
 export { InnerSubMenuWithStaticFields as InnerSubMenu };

package/src/internal/InnerSubMenu.js

@@ -1,6 +1,5 @@
 import React, { forwardRef } from 'react';
 import { isClickableSubElement } from '../../lib/utils/scripts';
-import { ZIndex } from '@skbkontur/react-ui/internal/ZIndex';
 /**
  * Подменю, раскрывающееся внутри основного меню
  *
@@ -9,7 +8,7 @@ import { ZIndex } from '@skbkontur/react-ui/internal/ZIndex';
 var InnerSubMenu = forwardRef(function (_a, ref) {
     var children = _a.children, generatedId = _a.generatedId;
     var levelIndex = 0;
-    return (React.createElement(ZIndex, { priority: 0, ref: ref }, React.Children.map(children, function (child) {
+    return (React.createElement("div", { ref: ref }, React.Children.map(children, function (child) {
         if (React.isValidElement(child)) {
             if (
             // @ts-expect-error: accessing private property

package/src/internal/ItemContent/Icon.js

@@ -21,7 +21,7 @@ export var Icon = function (_a) {
     return React.cloneElement(icon, {
         size: getIconSize(theme, _isSubMenu, _isBackButton),
         color: _isSubMenu ? theme.sideMenuIconSubItemColor : undefined,
-        disableCompensation: !_isBackButton,
+        align: _isBackButton ? 'baseline' : 'none',
         className: cx((_b = {},
             _b[jsStyles.root(theme)] = true,
             _b[jsStyles.rootMultiline()] = isMultiline && (!context.isMinimized || _isSubMenu),

package/src/internal/SeparatedSubMenu.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import { ZIndex } from '@skbkontur/react-ui/internal/ZIndex';
 interface SeparatedSubMenuProps {
     children?: React.ReactNode;
     generatedId?: string;
@@ -7,7 +6,7 @@ interface SeparatedSubMenuProps {
     href?: string;
     caption?: string;
 }
-declare const SeparatedSubMenuWithStaticFields: React.ForwardRefExoticComponent<SeparatedSubMenuProps & React.RefAttributes<ZIndex>> & {
+declare const SeparatedSubMenuWithStaticFields: React.ForwardRefExoticComponent<SeparatedSubMenuProps & React.RefAttributes<HTMLDivElement>> & {
     __KONTUR_REACT_UI__: string;
 };
 export { SeparatedSubMenuWithStaticFields as SeparatedSubMenu };

package/src/internal/SeparatedSubMenu.js

@@ -11,7 +11,6 @@ import { SideMenuDataTids } from '../../SideMenuDataTids';
 import { ScrollContainer } from '@skbkontur/react-ui';
 import { getSideMenuTheme } from '../../lib/theming/ThemeHelpers';
 import { isIE11 } from '@skbkontur/react-ui/lib/client';
-import { ZIndex } from '@skbkontur/react-ui/internal/ZIndex';
 /**
  * Отдельностоящее подменю
  *
@@ -37,7 +36,7 @@ var SeparatedSubMenu = forwardRef(function (_a, ref) {
     var levelIndex = 0;
     var isDesktopOverlayMenu = (context.isDesktop || context.isNarrowDesktop) && !context.separatedMenuWithoutOverlay;
     var isSeparatedSubMenuOverContent = (context.isTablet || isDesktopOverlayMenu) && !isIE11;
-    return (React.createElement(ZIndex, { priority: context.separatedMenuWithoutOverlay ? 8 : 0, className: cx((_b = {},
+    return (React.createElement("div", { className: cx((_b = {},
             _b[jsStyles.container(theme)] = true,
             _b[jsStyles.containerForTouchScreens(theme)] = context.isTouchScreen,
             _b[jsStylesForSeparatedSubMenu.root(theme)] = true,

package/src/internal/SeparatedSubMenu.styles.js

@@ -3,7 +3,7 @@ import { css } from '@skbkontur/react-ui/lib/theming/Emotion';
 import { memoizeStyle } from '../../lib/theming/ThemeHelpers';
 var styles = {
     root: function (t) {
-        return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      position: absolute;\n      top: 0;\n      background: ", ";\n      left: 100%;\n      justify-content: flex-start;\n      border-right: 1px solid ", ";\n    "], ["\n      position: absolute;\n      top: 0;\n      background: ", ";\n      left: 100%;\n      justify-content: flex-start;\n      border-right: 1px solid ", ";\n    "])), t.sideMenuSeparatedSubMenuBgColor, t.sideMenuSeparatedSubMenuBorderRightColor);
+        return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      position: absolute;\n      top: 0;\n      background: ", ";\n      left: 100%;\n      justify-content: flex-start;\n      border-right: 1px solid ", ";\n      z-index: 8000;\n    "], ["\n      position: absolute;\n      top: 0;\n      background: ", ";\n      left: 100%;\n      justify-content: flex-start;\n      border-right: 1px solid ", ";\n      z-index: 8000;\n    "])), t.sideMenuSeparatedSubMenuBgColor, t.sideMenuSeparatedSubMenuBorderRightColor);
     },
     rootWithoutOverlayForNarrowDesktop: function (t) {
         return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      left: ", ";\n      z-index: -1;\n    "], ["\n      left: ", ";\n      z-index: -1;\n    "])), t.sideMenuMinimizedWidth);

package/src/internal/SubMenu.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
-import { ZIndex } from '@skbkontur/react-ui/internal/ZIndex';
 interface SubMenuProps {
     children?: React.ReactNode;
     generatedId?: string;
@@ -11,7 +10,7 @@ interface SubMenuProps {
     href?: string;
     caption?: string;
 }
-declare const SubMenuWithStaticFields: React.ForwardRefExoticComponent<SubMenuProps & React.RefAttributes<ZIndex>> & {
+declare const SubMenuWithStaticFields: React.ForwardRefExoticComponent<SubMenuProps & React.RefAttributes<HTMLDivElement>> & {
     __KONTUR_REACT_UI__: string;
 };
 export { SubMenuWithStaticFields as SubMenu };