@skbkontur/side-menu 4.0.6 → 4.0.7

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.0.7](/compare/@skbkontur/side-menu@4.0.6...@skbkontur/side-menu@4.0.7) (2026-07-07)
+
+
+### Bug Fixes
+
+* **Logotype:** deprecate konturLogo, update docs Logos → CdnLogo 4bc8889
+
+
+
+
+
 ## [4.0.6](/compare/@skbkontur/side-menu@4.0.5...@skbkontur/side-menu@4.0.6) (2026-05-19)
 
 **Note:** Version bump only for package @skbkontur/side-menu

package/README.md

@@ -21,7 +21,7 @@ const myTheme = ThemeFactory.create<SideMenuThemeIn>({
 
 ```jsx harmony
 import { getKonturAvatarUrl } from '@skbkontur/react-ui-addons';
-import { Kontur, Ofd } from '@skbkontur/logos';
+import { CdnLogo } from '@skbkontur/ui-cdn-components';
 import { ThemeContext, ThemeFactory, MenuItem, MenuSeparator } from '@skbkontur/react-ui';
 import { SideMenu } from '@skbkontur/side-menu';
 import { IconDocTextRegular24 } from '@skbkontur/icons/IconDocTextRegular24';
@@ -37,7 +37,7 @@ import { IconAttachLinkRegular24 } from '@skbkontur/icons/IconAttachLinkRegular2
 <div style={{height: '600px', position: 'relative'}}>
   <ThemeContext.Provider value={ThemeFactory.create({ sideMenuProductColor: '#64b419' })}>
     <SideMenu>
-          <SideMenu.Header konturLogo={<Kontur/>} productLogo={<Ofd/>}/>
+          <SideMenu.Header productLogo={<CdnLogo logo="ofd" />}/>
           <SideMenu.Body>
               <SideMenu.Item icon={<IconDocTextRegular24/>} caption={'Документы к подписанию'} marker={'2'}>
                   <SideMenu.SubItem caption={'Входящие'}/>
@@ -100,7 +100,7 @@ import { IconAttachLinkRegular24 } from '@skbkontur/icons/IconAttachLinkRegular2
 
 ```jsx harmony
 import { getKonturAvatarUrl } from '@skbkontur/react-ui-addons';
-import { Buhgalteria, Kontur } from '@skbkontur/logos';
+import { CdnLogo } from '@skbkontur/ui-cdn-components';
 import { ThemeContext, ThemeFactory, MenuItem, Modal, Input, MenuSeparator } from '@skbkontur/react-ui';
 import { SideMenu } from '@skbkontur/side-menu';
 import { IconDocTextRegular24 } from '@skbkontur/icons/IconDocTextRegular24';
@@ -145,7 +145,7 @@ const renderModal = () => {
 <div style={{height: '600px', width: '100%', position: 'relative', display: 'flex'}}>
   <ThemeContext.Provider value={ThemeFactory.create({ sideMenuProductColor: '#b750d1' })}>
     <SideMenu isSeparatedMenu={true}>
-      <SideMenu.Header konturLogo={<Kontur/>} productLogo={<Buhgalteria/>} withWidget={false}/>
+      <SideMenu.Header productLogo={<CdnLogo logo="extern" />} withWidget={false}/>
       <SideMenu.Body>
         <SideMenu.Item icon={<IconDocTextRegular24/>} caption={'Документы'} marker={'2'}>
           <SideMenu.SubItem caption={'Входящие'} marker={'5'}>
@@ -225,7 +225,7 @@ const renderModal = () => {
 ```jsx harmony
 import { useState } from 'react';
 import { getKonturAvatarUrl } from '@skbkontur/react-ui-addons';
-import { Kontur, Ofd } from '@skbkontur/logos';
+import { CdnLogo } from '@skbkontur/ui-cdn-components';
 import { ThemeContext, ThemeFactory, MenuItem, Select, Switcher, MenuSeparator} from '@skbkontur/react-ui';
 import { SideMenu } from '@skbkontur/side-menu';
 import { IconDocTextRegular24 } from '@skbkontur/icons/IconDocTextRegular24';
@@ -268,7 +268,7 @@ const items = [
 <div style={{ height: '600px', display: 'flex', position: 'relative' }}>
   <ThemeContext.Provider value={ThemeFactory.create({ sideMenuProductColor: '#64b419' })}>
     <SideMenu activeItem={activeItem} onActiveItemChange={setActiveItem} isSeparatedMenu={isSeparatedMenu}>
-      <SideMenu.Header konturLogo={<Kontur />} productLogo={<Ofd />} withWidget={false} />
+      <SideMenu.Header productLogo={<CdnLogo logo="ofd" />} withWidget={false} />
       <SideMenu.Body>
         <SideMenu.Item icon={<IconDocTextRegular24 />} caption={'Документы к подписанию id=100'} marker={'2'} id={'100'}>
           <SideMenu.SubItem caption={'Входящие id=110'} id={'110'} />
@@ -508,7 +508,7 @@ import { SideMenu } from '@skbkontur/side-menu';
 #### Пример кастомизации
 
 ```jsx harmony
-import { Kontur, Ofd } from '@skbkontur/logos';
+import { CdnLogo } from '@skbkontur/ui-cdn-components';
 import { SideMenu } from '@skbkontur/side-menu';
 import { IconDocTextRegular24 } from '@skbkontur/icons/IconDocTextRegular24';
 import { IconSettingsGearRegular24 } from '@skbkontur/icons/IconSettingsGearRegular24';
@@ -517,7 +517,7 @@ import { ThemeContext, ThemeFactory } from '@skbkontur/react-ui';
 <div style={{ height: '200px', position: 'relative' }}>
   <ThemeContext.Provider value={ThemeFactory.create({ sideMenuWidth: '300px', sideMenuIconSize: '32px', sideMenuProductColor: '#64b419' })}>
     <SideMenu>
-      <SideMenu.Header konturLogo={<Kontur />} productLogo={<Ofd />} />
+      <SideMenu.Header productLogo={<CdnLogo logo="ofd" />} />
       <SideMenu.Body>
         <SideMenu.Item icon={<IconDocTextRegular24 />} caption={'Документы к подписанию'} marker={'2'} />
       </SideMenu.Body>
@@ -532,7 +532,7 @@ import { ThemeContext, ThemeFactory } from '@skbkontur/react-ui';
 #### Пример с использованием пропа `isOpen`
 
 ```jsx harmony
-import { Kontur, Ofd } from '@skbkontur/logos';
+import { CdnLogo } from '@skbkontur/ui-cdn-components';
 import { SideMenu } from '@skbkontur/side-menu';
 import { IconDocTextRegular24 } from '@skbkontur/icons/IconDocTextRegular24';
 import { IconSettingsGearRegular24 } from '@skbkontur/icons/IconSettingsGearRegular24';
@@ -544,7 +544,7 @@ const [isOpen, setIsOpen] = React.useState(true);
   <ThemeContext.Provider
     value={ThemeFactory.create({ sideMenuWidth: '300px', sideMenuProductColor: '#64b419' })}>
     <SideMenu isOpen={isOpen} onOpen={() => console.log('onOpen')} onClose={() => console.log('onClose')}>
-      <SideMenu.Header konturLogo={<Kontur />} productLogo={<Ofd />} />
+      <SideMenu.Header productLogo={<CdnLogo logo="ofd" />} />
       <SideMenu.Body>
         <SideMenu.Item icon={<IconDocTextRegular24 />} caption={'Документы к подписанию'} />
       </SideMenu.Body>
@@ -562,7 +562,7 @@ const [isOpen, setIsOpen] = React.useState(true);
 #### Пример с использованием пропа `isPinned`
 
 ```jsx harmony
-import { Kontur, Ofd } from '@skbkontur/logos';
+import { CdnLogo } from '@skbkontur/ui-cdn-components';
 import { SideMenu } from '@skbkontur/side-menu';
 import { IconDocTextRegular24 } from '@skbkontur/icons/IconDocTextRegular24';
 import { IconSettingsGearRegular24 } from '@skbkontur/icons/IconSettingsGearRegular24';
@@ -583,7 +583,7 @@ React.useEffect(() => {
               onPinnedValueChange={(isPinned) => {
                 localStorage.setItem('sideMenuIsPinned', String(isPinned));
               }}>
-      <SideMenu.Header konturLogo={<Kontur />} productLogo={<Ofd />} />
+      <SideMenu.Header productLogo={<CdnLogo logo="ofd" />} />
       <SideMenu.Body>
         <SideMenu.Item icon={<IconDocTextRegular24 />} caption={'Документы к подписанию'} />
       </SideMenu.Body>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skbkontur/side-menu",
-  "version": "4.0.6",
+  "version": "4.0.7",
   "private": false,
   "license": "UNLICENSED",
   "author": "Kontur",
@@ -28,13 +28,13 @@
     "@skbkontur/bell-widget-npm-loader": "^0.3.0",
     "@skbkontur/colors": "^2.1.7",
     "@skbkontur/empty-state": "^2.0.2",
-    "@skbkontur/icons": ">=2 <3",
-    "@skbkontur/react-ui-addons": "^6.0.4",
+    "@skbkontur/icons": "^2.0.0",
+    "@skbkontur/react-ui-addons": "^6.0.5",
     "@skbkontur/widget-consumer-react-utils": "^1.6.12",
     "tslib": "^2.8.0"
   },
   "devDependencies": {
-    "@skbkontur/ui-cdn-components": "^1.9.0"
+    "@skbkontur/ui-cdn-components": "^2.1.0"
   },
   "peerDependencies": {
     "@skbkontur/react-ui": ">=6 <7",

package/src/internal/SideMenuLogotype.js

@@ -16,9 +16,12 @@ var changeCamelCaseToKebabCase = function (str) {
         .join('');
 };
 var getProductName = function (productLogo) {
-    var _a;
+    var _a, _b;
+    if (typeof ((_a = productLogo === null || productLogo === void 0 ? void 0 : productLogo.props) === null || _a === void 0 ? void 0 : _a.logo) === 'string') {
+        return productLogo.props.logo;
+    }
     // @ts-expect-error: accessing private property
-    return ((_a = productLogo === null || productLogo === void 0 ? void 0 : productLogo.type) === null || _a === void 0 ? void 0 : _a.__KONTUR_REACT_UI__)
+    return ((_b = productLogo === null || productLogo === void 0 ? void 0 : productLogo.type) === null || _b === void 0 ? void 0 : _b.__KONTUR_REACT_UI__)
         ? // @ts-expect-error: accessing private property
             changeCamelCaseToKebabCase(productLogo.type.__KONTUR_REACT_UI__.replace(/EN$/i, ''))
         : 'kontur';
@@ -49,7 +52,8 @@ var SideMenuLogotype = forwardRef(function (_a, ref) {
         var logotypeWidth = (_b = (_a = refLogotype.current) === null || _a === void 0 ? void 0 : _a.logotypeRef) === null || _b === void 0 ? void 0 : _b.clientWidth;
         var maxWidth = parseInt(theme.sideMenuWidth) -
             2 * parseInt(theme.sideMenuMarginX) -
-            parseInt(theme.sideMenuLogotypePaddingLeft);
+            parseInt(theme.sideMenuLogotypePaddingLeft) +
+            (withWidget ? -28 : 0);
         if (logotypeWidth && logotypeWidth > maxWidth && !rest.size) {
             setSize(24);
         }