@bigbinary/neeto-molecules 1.0.64 → 1.0.65-beta

package/dist/Sidebar.js

@@ -1,16 +1,16 @@
 import React, { useRef, useCallback, useEffect, Children, isValidElement, cloneElement, forwardRef, useState } from 'react';
+import { NeetoIcon, Close, Search, AppSwitcher as AppSwitcher$1, ChatEmpty, Book, Gift, Keyboard, User, Settings, LeftArrow, Help, Down, Expand } from '@bigbinary/neeto-icons';
+import { Typography, Button, Input, Avatar, Tooltip } from '@bigbinary/neetoui';
 import { toLower, mergeDeepLeft, curry, is, includes, __, not } from 'ramda';
-import { Link, useLocation, NavLink } from 'react-router-dom';
-import { NeetoIcon, Close, Search, AppSwitcher as AppSwitcher$1, ChatEmpty, Book, Gift, Keyboard, User, Settings, LeftArrow, Help } from '@bigbinary/neeto-icons';
-import { Typography, Button, Input, Tooltip, Avatar } from '@bigbinary/neetoui';
 import { useTranslation } from 'react-i18next';
-import { capitalize, isPresent, truncate, _findBy } from '@bigbinary/neeto-commons-frontend/pure';
+import { Link, useLocation, NavLink } from 'react-router-dom';
+import { capitalize, truncate, _findBy } from '@bigbinary/neeto-commons-frontend/pure';
 import * as AppIcons from '@bigbinary/neeto-icons/app-icons';
 import { t as t$1 } from 'i18next';
 import { resetAuthTokens } from '@bigbinary/neeto-commons-frontend/utils';
 import KeyboardShortcuts from '@bigbinary/neeto-molecules/KeyboardShortcuts';
-import * as ProductLogos from '@bigbinary/neeto-icons/logos';
-import { Neeto } from '@bigbinary/neeto-icons/logos';
+import * as ProductLogos from '@bigbinary/neeto-icons/typeface-logos';
+import { Neeto } from '@bigbinary/neeto-icons/typeface-logos';
 import { globalProps as globalProps$1 } from '@bigbinary/neeto-commons-frontend/initializers';
 
 function _arrayWithHoles(arr) {
@@ -31485,7 +31485,7 @@ SwitchTransition.defaultProps = {
 
 var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
 
-var css$1 = ".neeto-molecules-app-switcher__backdrop{align-items:center;background-color:rgba(27,31,35,.867);flex-direction:row;left:var(--neeto-ui-sidebar-width);overflow:hidden;position:fixed;top:0;width:100vw;z-index:99996}.neeto-molecules-app-switcher__backdrop,.neeto-molecules-app-switcher__wrapper{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;height:100vh;justify-content:flex-start;transition:all .3s}.neeto-molecules-app-switcher__wrapper{align-items:flex-start;animation:nuifadeIn .3s ease-in;background-color:rgb(var(--neeto-ui-white));flex-direction:column;max-width:100%;overflow-y:auto;padding:72px;position:relative;width:calc(100vw - var(--neeto-ui-sidebar-width))}.neeto-molecules-app-switcher__grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}.neeto-molecules-app-switcher__header{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}.neeto-molecules-app-switcher__close-btn{position:absolute;right:24px;top:24px}.neeto-molecules-app-switcher__search-wrapper{width:316px}.neeto-molecules-app-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-app-switcher-link{align-items:center;background-color:rgb(var(--neeto-ui-gray-100));border-color:rgb(var(--neeto-ui-gray-100));border-radius:var(--neeto-ui-rounded-lg);border-style:solid;border-width:2px;cursor:pointer;display:flex;gap:12px;max-width:100%;padding:12px 16px;text-decoration:none;transition:background-color .3s ease-in-out;width:100%}.neeto-molecules-app-switcher-link:focus,.neeto-molecules-app-switcher-link:focus-visible{outline:none}.neeto-molecules-app-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link:not(.neeto-molecules-app-switcher-link--active):hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link--active{background:rgb(var(--neeto-ui-primary-100));border-color:rgb(var(--neeto-ui-primary-600))}.neeto-molecules-app-switcher-link__icon-holder{align-items:center;border-radius:var(--neeto-ui-rounded-lg);display:flex;flex-shrink:0;height:42px;justify-content:center;width:42px}.neeto-molecules-app-switcher-link__content{flex-grow:1}.neeto-molecules-app-switcher-link__content span{display:block}.neeto-molecules-app-switcher-enter.neeto-molecules-app-switcher__backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0}.neeto-molecules-app-switcher-enter-active.neeto-molecules-app-switcher__backdrop,.neeto-molecules-app-switcher-enter-done.neeto-molecules-app-switcher__backdrop,.neeto-molecules-app-switcher-exit.neeto-molecules-app-switcher__backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:1}.neeto-molecules-app-switcher-exit-active.neeto-molecules-app-switcher__backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0}";
+var css$1 = ".neeto-molecules-app-switcher__backdrop{align-items:center;background-color:rgba(27,31,35,.867);flex-direction:row;left:240px;overflow:hidden;position:fixed;top:0;width:100vw;z-index:99996}.neeto-molecules-app-switcher__backdrop,.neeto-molecules-app-switcher__wrapper{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;height:100vh;justify-content:flex-start;transition:all .3s}.neeto-molecules-app-switcher__wrapper{align-items:flex-start;animation:nuifadeIn .3s ease-in;background-color:rgb(var(--neeto-ui-white));flex-direction:column;max-width:100%;overflow-y:auto;padding:72px;position:relative;width:calc(100% - 240px)}.neeto-molecules-app-switcher__grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}.neeto-molecules-app-switcher__header{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}.neeto-molecules-app-switcher__close-btn{position:absolute;right:24px;top:24px}.neeto-molecules-app-switcher__search-wrapper{width:316px}.neeto-molecules-app-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-app-switcher-link{align-items:center;background-color:rgb(var(--neeto-ui-gray-100));border-color:rgb(var(--neeto-ui-gray-100));border-radius:var(--neeto-ui-rounded-lg);border-style:solid;border-width:2px;cursor:pointer;display:flex;gap:12px;max-width:100%;padding:12px 16px;text-decoration:none;transition:background-color .3s ease-in-out;width:100%}.neeto-molecules-app-switcher-link:focus,.neeto-molecules-app-switcher-link:focus-visible{outline:none}.neeto-molecules-app-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link:not(.neeto-molecules-app-switcher-link--active):hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-app-switcher-link--active{background:rgb(var(--neeto-ui-primary-100));border-color:rgb(var(--neeto-ui-primary-600))}.neeto-molecules-app-switcher-link__icon-holder{align-items:center;border-radius:var(--neeto-ui-rounded-lg);display:flex;flex-shrink:0;height:42px;justify-content:center;width:42px}.neeto-molecules-app-switcher-link__content{flex-grow:1}.neeto-molecules-app-switcher-link__content span{display:block}.neeto-molecules-app-switcher-enter.neeto-molecules-app-switcher__backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0}.neeto-molecules-app-switcher-enter-active.neeto-molecules-app-switcher__backdrop,.neeto-molecules-app-switcher-enter-done.neeto-molecules-app-switcher__backdrop,.neeto-molecules-app-switcher-exit.neeto-molecules-app-switcher__backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:1}.neeto-molecules-app-switcher-exit-active.neeto-molecules-app-switcher__backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0}";
 n(css$1,{});
 
 function _extends() {
@@ -31580,6 +31580,7 @@ var AppLink = function AppLink(_ref) {
     weight: "normal"
   }, description)));
 };
+var AppLink$1 = /*#__PURE__*/React.memo(AppLink);
 
 var Body = function Body(_ref) {
   var _globalProps$neetoApp;
@@ -31625,7 +31626,7 @@ var Body = function Body(_ref) {
   }, (filteredApps === null || filteredApps === void 0 ? void 0 : filteredApps.length) > 0 ? /*#__PURE__*/React.createElement("div", {
     className: "neeto-molecules-app-switcher__grid"
   }, filteredApps.map(function (app) {
-    return /*#__PURE__*/React.createElement(AppLink, _extends({
+    return /*#__PURE__*/React.createElement(AppLink$1, _extends({
       key: app.name
     }, app));
   })) : /*#__PURE__*/React.createElement(Typography, {
@@ -31713,50 +31714,14 @@ var AppSwitcher = function AppSwitcher(_ref) {
   })))));
 };
 
-var css = ".neeto-molecules-sidebar{background-color:rgb(var(--neeto-ui-white));border-right:1px solid rgb(var(--neeto-ui-gray-200));height:100vh;max-width:300px;padding:40px 0;transition:all .3s;width:300px;z-index:99997}.neeto-molecules-sidebar::-webkit-scrollbar{height:0;width:0}.neeto-molecules-sidebar::-webkit-scrollbar-thumb{background:rgb(var(--neeto-ui-gray-300));border-radius:50px}.neeto-molecules-sidebar::-webkit-scrollbar-track{background:\"transparent\"}@media (min-width:1440px){.neeto-molecules-sidebar{max-width:320px;width:320px}}.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed{max-width:var(--neeto-ui-sidebar-width);width:var(--neeto-ui-sidebar-width)}.neeto-molecules-sidebar__header{margin-bottom:40px;padding:0 20px;width:100%}.neeto-molecules-sidebar__logo,.neeto-molecules-sidebar__logo svg{height:40px;width:40px}.neeto-molecules-sidebar__info{padding-left:10px;width:calc(100% - 40px)}.neeto-molecules-sidebar__info .neeto-molecules-typography{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.neeto-molecules-sidebar__links{margin-bottom:20px;padding-left:12px;padding-right:12px;width:100%}.neeto-molecules-sidebar__link{border-radius:var(--neeto-ui-rounded);color:rgb(var(--neeto-ui-gray-600));cursor:pointer;margin:8px 0;padding:8px;position:relative;text-decoration:none;transition:all .3s}.neeto-molecules-sidebar__link.mb-0{margin-bottom:0}.neeto-molecules-sidebar__link-icon{flex-shrink:0;width:40px}.neeto-molecules-sidebar__link-label{overflow:hidden;padding-left:10px;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 40px)}.neeto-molecules-sidebar__link-sub-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 56px)}.neeto-molecules-sidebar__link:hover{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-gray-800));text-decoration:none}.neeto-molecules-sidebar__link:focus,.neeto-molecules-sidebar__link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-gray-800));outline:none;text-decoration:none}.neeto-molecules-sidebar__link.active{background-color:rgb(var(--neeto-ui-primary-100));color:rgb(var(--neeto-ui-primary-600));text-decoration:none}.neeto-molecules-sidebar__link--button:focus{background-color:transparent}.neeto-molecules-sidebar__link--button:focus-visible{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-gray-800))}.neeto-molecules-sidebar__link--change-log{outline:none!important}.neeto-molecules-sidebar__sublink{border-radius:var(--neeto-ui-rounded);color:rgb(var(--neeto-ui-gray-600));cursor:pointer;margin:4px 0;padding:8px 8px 8px 58px;text-decoration:none;transition:all .3s}.neeto-molecules-sidebar__sublink:hover{color:rgb(var(--neeto-ui-gray-700));text-decoration:none}.neeto-molecules-sidebar__sublink:focus,.neeto-molecules-sidebar__sublink:focus-visible{background-color:rgb(var(--neeto-ui-gray-300));color:rgb(var(--neeto-ui-gray-700));outline:none;text-decoration:none}.neeto-molecules-sidebar__sublink.active,.neeto-molecules-sidebar__sublink:active{color:rgb(var(--neeto-ui-gray-800));text-decoration:none}.neeto-molecules-sidebar__footer{margin-top:auto;padding:0 12px;width:100%}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile-wrapper{outline:none!important}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile{background-color:rgb(var(--neeto-ui-white));border-radius:var(--neeto-ui-rounded);box-shadow:var(--neeto-ui-shadow-sm);cursor:pointer;padding:8px;transition:var(--neeto-ui-transition);width:100%}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile-content{padding-left:10px;padding-right:30px;position:relative;width:calc(100% - 40px)}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile-content .neeto-molecules-typography{margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile-drop-icon{color:rgb(var(--neeto-ui-gray-500));position:absolute;right:8px;top:50%;transform:translateY(-50%)}.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed{padding:24px 0}.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed .neeto-molecules-sidebar__profile{background-color:transparent;box-shadow:none;padding:0}.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed .neeto-molecules-sidebar__header,.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed .neeto-molecules-sidebar__links{padding-left:16px;padding-right:16px}.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed .neeto-molecules-sidebar__link-icon{width:24px}.neeto-molecules-sidebar.neeto-molecules-sidebar--collapsed .neeto-molecules-sidebar__footer{padding-left:16px;padding-right:16px}.sidebar-featured-tooltip__content{border-radius:8px!important;box-shadow:var(--neeto-ui-shadow-sm)!important}.sidebar-featured-tooltip__content .tippy-content{padding:0}.sidebar-featured-tooltip{padding:12px;width:150px}.sidebar-featured-tooltip__icon-wrap{background-color:rgb(var(--neeto-ui-gray-100));border-radius:8px;height:40px;margin-bottom:8px;margin-left:auto;margin-right:auto;width:40px}.sidebar-featured-tooltip__title{margin-bottom:4px}.neeto-molecules-help-popup-wrapper,.neeto-molecules-profile-popup-wrapper{border:1px solid rgb(var(--neeto-ui-gray-400));border-radius:var(--neeto-ui-rounded)!important;box-shadow:var(--neeto-ui-shadow-xs)!important}.neeto-molecules-help-popup-wrapper .tippy-content,.neeto-molecules-profile-popup-wrapper .tippy-content{padding:0}.neeto-molecules-help-popup-wrapper .tippy-svg-arrow,.neeto-molecules-profile-popup-wrapper .tippy-svg-arrow{display:none!important}.neeto-molecules-profile-sublist{border-top:1px solid rgb(var(--neeto-ui-gray-400));list-style:none;margin:0;padding:4px 0}.neeto-molecules-help-sublist__item,.neeto-molecules-profile-sublist__item{width:100%}.neeto-molecules-profile-sublist__item-btn{align-items:center;border-radius:0;color:rgb(var(--neeto-ui-gray-800));cursor:pointer;display:flex;font-size:var(--neeto-ui-text-sm);font-weight:var(--neeto-ui-font-normal);gap:8px;line-height:1.143;min-height:32px;outline-color:transparent;padding:6px 40px 6px 12px;position:relative;text-decoration:none;transition:var(--neeto-ui-transition);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%}.neeto-molecules-profile-sublist__item-btn.disabled{color:rgb(var(--neeto-ui-gray-500));cursor:not-allowed}.neeto-molecules-profile-sublist__item-btn:focus,.neeto-molecules-profile-sublist__item-btn:hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-profile-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-profile-sublist__item-btn--style-danger{color:rgb(var(--neeto-ui-error-800))}.neeto-molecules-profile-sublist__item-btn-icon{color:rgb(var(--neeto-ui-gray-600))}.neeto-molecules-profile-sublist__item-btn-icon svg{height:20px;width:20px}.neeto-molecules-help-sublist__item-btn{border-radius:0;color:rgb(var(--neeto-ui-gray-800));cursor:pointer;display:flex;font-size:var(--neeto-ui-text-sm);font-weight:var(--neeto-ui-font-normal);gap:8px;justify-content:flex-end;line-height:1.143;min-height:32px;outline-color:transparent;padding:6px 40px 6px 12px;position:relative;text-decoration:none;transition:var(--neeto-ui-transition);-webkit-user-select:none;-moz-user-select:none;user-select:none;white-space:nowrap;width:100%}.neeto-molecules-help-sublist__item-btn.disabled{color:rgb(var(--neeto-ui-gray-500));cursor:not-allowed}.neeto-molecules-help-sublist__item-btn:focus,.neeto-molecules-help-sublist__item-btn:hover{background-color:rgb(var(--neeto-ui-gray-200));box-shadow:none}.neeto-molecules-help-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-help-sublist__item-btn--style-danger{color:rgb(var(--neeto-ui-error-800))}.neeto-molecules-help-sublist__item-btn-icon{color:rgb(var(--neeto-ui-gray-600))}.neeto-molecules-help-sublist__item-btn-icon svg{height:20px;width:20px}.neeto-molecules-help-sublist__item-btn-count,.neeto-molecules-sidebar__notif-count{align-items:center;background-color:rgb(var(--neeto-ui-primary-500));border-radius:var(--neeto-ui-rounded-full);color:rgb(var(--neeto-ui-white));display:inline-flex;font-size:10px;justify-content:center;min-height:16px;min-width:16px;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:1}.neeto-molecules-help-sublist__item-btn-count{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.neeto-molecules-sidebar__notif-count{position:absolute;right:-2px;top:-2px}";
+var css = ":root{--neeto-molecules-sidebar-width:240px;--neeto-molecules-sidebar-z-index:99998}.neeto-molecules-sidebar__wrapper{display:flex;max-width:240px;max-width:var(--neeto-molecules-sidebar-width);position:relative;transition:all .15s;width:240px;width:var(--neeto-molecules-sidebar-width)}.neeto-molecules-sidebar__wrapper--collapsed{max-width:0;width:0}.neeto-molecules-sidebar__wrapper--collapsed .neeto-molecules-sidebar__toggler{transform:scale(1)}.neeto-molecules-sidebar{background-color:rgb(var(--neeto-ui-gray-100));border-right:1px solid rgb(var(--neeto-ui-gray-100));height:100vh;padding:24px 0;width:100%;z-index:99998;z-index:var(--neeto-molecules-sidebar-z-index)}.neeto-molecules-sidebar__no-shrinkable{max-width:240px;max-width:var(--neeto-molecules-sidebar-width);width:240px;width:var(--neeto-molecules-sidebar-width)}.neeto-molecules-sidebar::-webkit-scrollbar{height:0;width:0}.neeto-molecules-sidebar::-webkit-scrollbar-thumb{background:rgb(var(--neeto-ui-gray-300));border-radius:50px}.neeto-molecules-sidebar::-webkit-scrollbar-track{background:\"transparent\"}.neeto-molecules-sidebar__toggler{left:calc(100% + 4px);position:absolute;top:32px;transform:scale(-1);z-index:99996;z-index:calc(var(--neeto-molecules-sidebar-z-index) - 2)}.neeto-molecules-sidebar__header{margin-bottom:40px;padding:0 24px}.neeto-molecules-sidebar__logo svg{height:20px;max-width:100%;width:auto}.neeto-molecules-sidebar__links{margin-bottom:40px}.neeto-molecules-sidebar__link{color:rgb(var(--neeto-ui-gray-800));gap:10px;padding:8px 24px;position:relative;text-decoration:none!important;transition:var(--neeto-ui-transition);width:100%}.neeto-molecules-sidebar__link:not(:first-child){margin-top:10px}.neeto-molecules-sidebar__link-icon{flex-shrink:0;transition:var(--neeto-ui-transition)}.neeto-molecules-sidebar__link-icon svg path{vector-effect:non-scaling-stroke}.neeto-molecules-sidebar__link-icon--rotate{transform:scale(-1)}.neeto-molecules-sidebar__link-label,.neeto-molecules-sidebar__link-sub-label{flex-grow:1;min-width:0;overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.neeto-molecules-sidebar__link:hover{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black))}.neeto-molecules-sidebar__link:focus,.neeto-molecules-sidebar__link:focus-visible,.neeto-molecules-sidebar__link[aria-expanded=true]{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black));outline:none}.neeto-molecules-sidebar__link.active{background-color:rgb(var(--neeto-ui-white));color:rgb(var(--neeto-ui-black))}.neeto-molecules-sidebar__link.active .neeto-molecules-sidebar__link-label{font-weight:var(--neeto-ui-font-medium)}.neeto-molecules-sidebar__link--button:focus{background-color:transparent}.neeto-molecules-sidebar__link--button:focus-visible{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-gray-800))}.neeto-molecules-sidebar__link--change-log{outline:none!important}.neeto-molecules-sidebar__sublink-wrapper{background-color:rgb(var(--neeto-ui-white));padding:4px 0}.neeto-molecules-sidebar__sublink{background-color:rgb(var(--neeto-ui-white));color:rgb(var(--neeto-ui-gray-700));cursor:pointer;padding:8px 24px 8px 58px;text-decoration:none;transition:all .3s}.neeto-molecules-sidebar__sublink:not(:last-child){margin-bottom:4px}.neeto-molecules-sidebar__sublink .neeto-molecules-sidebar__link-sub-count{opacity:.75}.neeto-molecules-sidebar__sublink:hover{color:rgb(var(--neeto-ui-gray-800));text-decoration:none}.neeto-molecules-sidebar__sublink:hover .neeto-molecules-sidebar__link-sub-count{opacity:1}.neeto-molecules-sidebar__sublink:focus,.neeto-molecules-sidebar__sublink:focus-visible{color:rgb(var(--neeto-ui-gray-800));outline:none;text-decoration:none}.neeto-molecules-sidebar__sublink:focus .neeto-molecules-sidebar__link-sub-count,.neeto-molecules-sidebar__sublink:focus-visible .neeto-molecules-sidebar__link-sub-count{opacity:1}.neeto-molecules-sidebar__sublink.active,.neeto-molecules-sidebar__sublink:active{color:rgb(var(--neeto-ui-black));font-weight:var(--neeto-ui-font-medium);text-decoration:none}.neeto-molecules-sidebar__sublink.active .neeto-molecules-sidebar__link-sub-count,.neeto-molecules-sidebar__sublink:active .neeto-molecules-sidebar__link-sub-count{opacity:1}.neeto-molecules-sidebar__footer{margin-top:auto}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile-name{flex-grow:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile:hover{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black));text-decoration:none}.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile:focus,.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile:focus-visible,.neeto-molecules-sidebar__footer .neeto-molecules-sidebar__profile[aria-expanded=true]{background-color:rgb(var(--neeto-ui-gray-200));color:rgb(var(--neeto-ui-black));outline:none;text-decoration:none}.sidebar-featured-tooltip__content{border-radius:8px!important;box-shadow:var(--neeto-ui-shadow-sm)!important}.sidebar-featured-tooltip__content .tippy-content{padding:0}.sidebar-featured-tooltip{padding:12px;width:150px}.sidebar-featured-tooltip__icon-wrap{background-color:rgb(var(--neeto-ui-gray-100));border-radius:8px;height:40px;margin-bottom:8px;margin-left:auto;margin-right:auto;width:40px}.sidebar-featured-tooltip__title{margin-bottom:4px}.neeto-molecules-help-popup-wrapper,.neeto-molecules-profile-popup-wrapper{border:1px solid rgb(var(--neeto-ui-gray-400));border-radius:var(--neeto-ui-rounded)!important;box-shadow:var(--neeto-ui-shadow-xs)!important}.neeto-molecules-help-popup-wrapper .tippy-content,.neeto-molecules-profile-popup-wrapper .tippy-content{padding:0}.neeto-molecules-help-popup-wrapper .tippy-svg-arrow,.neeto-molecules-profile-popup-wrapper .tippy-svg-arrow{display:none!important}.neeto-molecules-profile-sublist{border-top:1px solid rgb(var(--neeto-ui-gray-400))}.neeto-molecules-help-sublist,.neeto-molecules-profile-sublist{list-style:none;margin:0;padding:4px 0}.neeto-molecules-help-sublist__item,.neeto-molecules-profile-sublist__item{width:100%}.neeto-molecules-help-sublist__item-btn,.neeto-molecules-profile-sublist__item-btn{border-radius:0;justify-content:flex-end!important}.neeto-molecules-help-sublist__item-btn.active,.neeto-molecules-profile-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-help-sublist__item-btn-icon svg path,.neeto-molecules-profile-sublist__item-btn-icon svg path{vector-effect:non-scaling-stroke}";
 n(css,{});
 
-var FeaturedTooltip = function FeaturedTooltip(_ref) {
-  var label = _ref.label,
-    description = _ref.description;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-flex neeto-ui-flex-col sidebar-featured-tooltip"
-  }, /*#__PURE__*/React.createElement(Typography, {
-    className: "neeto-ui-text-center sidebar-featured-tooltip__title",
-    lineHeight: "tight",
-    style: "h5",
-    weight: "semibold"
-  }, label), description && /*#__PURE__*/React.createElement(Typography, {
-    className: "neeto-ui-text-center neeto-ui-text-gray-400 sidebar-featured-tooltip__description",
-    lineHeight: "normal",
-    style: "body3"
-  }, description));
-};
-
-var NavIconWrapper = function NavIconWrapper(_ref) {
-  var description = _ref.description,
-    label = _ref.label,
-    children = _ref.children;
-  return /*#__PURE__*/React.createElement(Tooltip, {
-    className: "sidebar-featured-tooltip__content",
-    content: /*#__PURE__*/React.createElement(FeaturedTooltip, {
-      description: description,
-      label: label
-    }),
-    delay: [400, 40],
-    distance: "20rem",
-    duration: [200, 200],
-    position: "right"
-  }, children);
-};
-
 var AppSwitcherButton = function AppSwitcherButton(_ref) {
   var onAppSwitcherToggle = _ref.onAppSwitcherToggle;
   var _useTranslation = useTranslation(),
     t = _useTranslation.t;
-  return /*#__PURE__*/React.createElement(NavIconWrapper, {
-    label: t("neetoMolecules.sidebar.productSwitcher")
-  }, /*#__PURE__*/React.createElement("button", {
+  return /*#__PURE__*/React.createElement("button", {
     className: "neeto-molecules-sidebar__link neeto-molecules-sidebar__link--app-switcher neeto-molecules-sidebar__link--button neeto-ui-flex neeto-ui-w-full neeto-ui-select-none neeto-ui-items-center neeto-ui-justify-start neeto-ui-shadow-none",
     "data-cy": "app-switcher-button",
     onClick: onAppSwitcherToggle
@@ -31764,7 +31729,12 @@ var AppSwitcherButton = function AppSwitcherButton(_ref) {
     className: "neeto-molecules-sidebar__link-icon neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center"
   }, /*#__PURE__*/React.createElement(AppSwitcher$1, {
     size: 24
-  }))));
+  })), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-molecules-sidebar__link-label",
+    component: "span",
+    style: "body2",
+    weight: "normal"
+  }, t("neetoMolecules.sidebar.productSwitcher")));
 };
 
 var MY_PROFILE_URL = "/auth/profile/edit";
@@ -31835,24 +31805,26 @@ var getProfileInfo = function getProfileInfo(profileInfoOverrides) {
 };
 
 var HelpSection = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var changesCount = _ref.changesCount;
+  _ref.changesCount;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var showChangesCount = false;
   return /*#__PURE__*/React.createElement("button", {
-    className: "neeto-molecules-sidebar__link neeto-molecules-sidebar__link--button neeto-ui-shadow-none",
+    className: "neeto-molecules-sidebar__link neeto-molecules-sidebar__link--button neeto-ui-shadow-none neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none",
     "data-cy": "help-button",
     ref: ref
   }, /*#__PURE__*/React.createElement("span", {
     className: "neeto-molecules-sidebar__link-icon neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center"
   }, /*#__PURE__*/React.createElement(Help, {
     size: 24
-  }), isPresent(changesCount) && /*#__PURE__*/React.createElement("span", {
-    className: "neeto-molecules-sidebar__notif-count",
-    "data-testid": "help-icon-changes-count"
-  }, changesCount)));
+  }), showChangesCount  ), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-molecules-sidebar__link-label",
+    component: "span",
+    style: "body2",
+    weight: "normal"
+  }, t("neetoMolecules.sidebar.helpLinks.helpCenter")));
 });
 HelpSection.displayName = "HelpSection";
-HelpSection.propTypes = {
-  changesCount: propTypes.exports.number
-};
 
 function _typeof(obj) {
   "@babel/helpers - typeof";
@@ -31903,6 +31875,7 @@ var HelpSectionMenu = function HelpSectionMenu(_ref) {
   var _KeyboardShortcuts$us = KeyboardShortcuts.usePaneState(),
     _KeyboardShortcuts$us2 = _slicedToArray(_KeyboardShortcuts$us, 2),
     setIsOpen = _KeyboardShortcuts$us2[1];
+  var showChangesCount = false;
   var helpLinks = Object.keys(DEFAULT_HELP_LINK_PROPS).map(function (key) {
     return _objectSpread(_objectSpread(_objectSpread({}, DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
       onClick: function onClick() {
@@ -31913,37 +31886,40 @@ var HelpSectionMenu = function HelpSectionMenu(_ref) {
     var hide = _ref2.hide;
     return !hide;
   });
-  return /*#__PURE__*/React.createElement("ul", null, helpLinks.map(function (_ref3, idx) {
+  return /*#__PURE__*/React.createElement("ul", {
+    className: "neeto-molecules-help-sublist"
+  }, helpLinks.map(function (_ref3, idx) {
     var label = _ref3.label,
       buttonProps = _objectWithoutProperties(_ref3, _excluded$2);
     return /*#__PURE__*/React.createElement("li", {
       className: "neeto-molecules-help-sublist__item",
       key: idx
     }, /*#__PURE__*/React.createElement(Button, _extends({
+      fullWidth: true,
       className: "neeto-molecules-help-sublist__item-btn",
       iconPosition: "left",
       iconSize: 18,
       style: "text"
-    }, buttonProps), label, isPresent(buttonProps.changesCount) && /*#__PURE__*/React.createElement("span", {
-      className: "neeto-molecules-help-sublist__item-btn-count",
-      "data-testid": "help-section-menu-changes-count"
-    }, buttonProps.changesCount)));
+    }, buttonProps), label, showChangesCount  ));
   }));
 };
 
 var ProfileSection = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var profileInfo = _ref.profileInfo;
   return /*#__PURE__*/React.createElement("button", {
-    className: "neeto-molecules-sidebar__profile-wrapper neeto-ui-w-full neeto-ui-text-left",
+    className: "neeto-molecules-sidebar__profile neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-molecules-sidebar__link",
     "data-cy": "profile-section",
     ref: ref
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "neeto-molecules-sidebar__profile neeto-ui-flex neeto-ui-w-full neeto-ui-flex-shrink-0 neeto-ui-items-center"
   }, /*#__PURE__*/React.createElement(Avatar, {
-    className: "neeto-ui-flex-shrink-0",
-    size: "large",
+    className: "neeto-ui-flex-shrink-0 neeto-molecules-sidebar__profile-avatar",
+    size: "small",
     user: profileInfo
-  })));
+  }), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-molecules-sidebar__link-label",
+    component: "span",
+    style: "body2",
+    weight: "normal"
+  }, truncate(profileInfo.name, 18)));
 });
 ProfileSection.displayName = "ProfileSection";
 
@@ -31974,22 +31950,19 @@ var LinkSection = function LinkSection(_ref) {
       _ref2$icon = _ref2.icon,
       icon = _ref2$icon === void 0 ? null : _ref2$icon,
       otherProps = _objectWithoutProperties(_ref2, _excluded$1);
-    var IconSVG = icon;
     return /*#__PURE__*/React.createElement("li", {
       className: "neeto-molecules-profile-sublist__item",
       key: idx
-    }, /*#__PURE__*/React.createElement("button", _extends({
+    }, /*#__PURE__*/React.createElement(Button, _extends({
+      fullWidth: true,
+      className: "neeto-molecules-profile-sublist__item-btn",
+      icon: icon,
+      iconPosition: "left",
+      iconSize: 18,
+      label: label,
+      style: "text",
       onClick: onClick
-    }, otherProps, {
-      className: "neeto-molecules-profile-sublist__item-btn"
-    }), icon && /*#__PURE__*/React.createElement("span", {
-      className: "neeto-molecules-profile-sublist__item-btn-icon"
-    }, /*#__PURE__*/React.createElement(IconSVG, null)), /*#__PURE__*/React.createElement(Typography, {
-      className: "neeto-molecules-profile-sublist__item-btn-label",
-      component: "span",
-      style: "body2",
-      weight: "normal"
-    }, label)));
+    }, otherProps)));
   }));
 };
 
@@ -32043,7 +32016,7 @@ var Footer = function Footer(_ref) {
   var profileInfo = getProfileInfo(profileInfoOverrides);
   var changesCount = (_helpLinkOverrides$ch = helpLinkOverrides.changelogProps) === null || _helpLinkOverrides$ch === void 0 ? void 0 : _helpLinkOverrides$ch.changesCount;
   return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-molecules-sidebar__footer"
+    className: "neeto-molecules-sidebar__footer neeto-molecules-sidebar__no-shrinkable"
   }, /*#__PURE__*/React.createElement(Tooltip, {
     interactive: true,
     className: "neeto-molecules-help-popup-wrapper",
@@ -32051,6 +32024,8 @@ var Footer = function Footer(_ref) {
       helpLinkOverrides: helpLinkOverrides
     }),
     hideOnClick: false,
+    interactiveDebounce: 30,
+    offset: 0,
     position: "right",
     theme: "light"
   }, /*#__PURE__*/React.createElement(HelpSection, {
@@ -32061,6 +32036,8 @@ var Footer = function Footer(_ref) {
     interactive: true,
     className: "neeto-molecules-profile-popup-wrapper",
     hideOnClick: false,
+    interactiveDebounce: 30,
+    offset: 0,
     position: "right",
     theme: "light",
     content: /*#__PURE__*/React.createElement(ProfileMenu, {
@@ -32080,16 +32057,17 @@ var Header = function Header() {
     name: globalProps.appName.split("neeto")[1]
   }, globalProps.neetoApps)) === null || _findBy2 === void 0 ? void 0 : _findBy2.url) !== null && _findBy$url !== void 0 ? _findBy$url : window.location.origin);
   return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-ui-flex neeto-ui-items-center neeto-molecules-sidebar__header",
+    className: "neeto-molecules-sidebar__header neeto-molecules-sidebar__no-shrinkable",
     "data-cy": "sidebar-info"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "neeto-molecules-sidebar__logo flex flex-shrink-0 items-center justify-center"
   }, /*#__PURE__*/React.createElement(Link, {
+    className: "neeto-molecules-sidebar__logo neeto-ui-w-full",
     to: homeUrl.pathname
-  }, ProductLogo ? /*#__PURE__*/React.createElement(ProductLogo, null) : /*#__PURE__*/React.createElement(Neeto, null))));
+  }, ProductLogo ? /*#__PURE__*/React.createElement(ProductLogo, null) : /*#__PURE__*/React.createElement(Neeto, null)));
 };
+var Header$1 = /*#__PURE__*/React.memo(Header);
 
-var _excluded = ["label", "to", "icon", "description"];
+var _excluded = ["label", "to", "icon", "items"],
+  _excluded2 = ["label", "to", "count"];
 var Links = function Links(_ref) {
   var navLinks = _ref.navLinks;
   var location = useLocation();
@@ -32101,31 +32079,61 @@ var Links = function Links(_ref) {
     return true;
   });
   return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-molecules-sidebar__links"
+    className: "neeto-molecules-sidebar__links neeto-molecules-sidebar__no-shrinkable"
   }, navLinks.filter(filterByPermissions).map(function (_ref3, mainIndex) {
     var label = _ref3.label,
       to = _ref3.to,
       icon = _ref3.icon,
-      description = _ref3.description,
+      items = _ref3.items,
       otherProps = _objectWithoutProperties(_ref3, _excluded);
     var IconSVG = icon;
     var url = new URL(to, window.location.href);
     var isActive = function isActive() {
       return location.pathname.startsWith(url.pathname);
     };
-    return /*#__PURE__*/React.createElement(NavIconWrapper, {
-      description: description,
-      key: mainIndex,
-      label: label
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: mainIndex
     }, /*#__PURE__*/React.createElement(NavLink, _extends({
       activeClassName: "active",
       className: "neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-molecules-sidebar__link",
       isActive: isActive,
       to: to
-    }, otherProps), icon && /*#__PURE__*/React.createElement("div", {
-      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-molecules-sidebar__link-icon",
+    }, otherProps), icon && /*#__PURE__*/React.createElement("span", {
+      className: "neeto-molecules-sidebar__link-icon",
       "data-testid": label
-    }, /*#__PURE__*/React.createElement(IconSVG, null))));
+    }, /*#__PURE__*/React.createElement(IconSVG, null)), /*#__PURE__*/React.createElement(Typography, {
+      className: "neeto-molecules-sidebar__link-label",
+      component: "span",
+      style: "body2",
+      weight: "normal"
+    }, label), items && /*#__PURE__*/React.createElement("span", {
+      className: classnames("neeto-molecules-sidebar__link-icon", {
+        "neeto-molecules-sidebar__link-icon--rotate": isActive()
+      })
+    }, /*#__PURE__*/React.createElement(Down, {
+      size: 16
+    }))), items && isActive() && /*#__PURE__*/React.createElement("div", {
+      className: "neeto-molecules-sidebar__sublink-wrapper"
+    }, items.map(function (_ref4, subIndex) {
+      var subLabel = _ref4.label,
+        subRoute = _ref4.to,
+        count = _ref4.count,
+        otherProps = _objectWithoutProperties(_ref4, _excluded2);
+      return /*#__PURE__*/React.createElement(NavLink, _extends({
+        activeClassName: "active",
+        className: "neeto-molecules-sidebar__sublink neeto-ui-flex neeto-ui-items-center neeto-ui-select-none",
+        key: subIndex,
+        to: subRoute
+      }, otherProps), /*#__PURE__*/React.createElement(Typography, {
+        className: "neeto-molecules-sidebar__link-sub-label neeto-ui-flex-grow",
+        component: "span",
+        style: "body2"
+      }, subLabel), /*#__PURE__*/React.createElement(Typography, {
+        className: "neeto-molecules-sidebar__link-sub-count neeto-ui-flex-shrink-0",
+        component: "span",
+        style: "body2"
+      }, count));
+    })));
   }));
 };
 
@@ -32143,16 +32151,26 @@ var Sidebar = function Sidebar(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     isAppSwitcherOpen = _useState2[0],
     setIsAppSwitcherOpen = _useState2[1];
+  var _useState3 = useState(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isSidebarCollapsed = _useState4[0],
+    setIsSidebarCollapsed = _useState4[1];
   var location = useLocation();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
   useEffect(function () {
     isAppSwitcherOpen && setIsAppSwitcherOpen(false);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [location]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: classnames("neeto-molecules-sidebar__wrapper", {
+      "neeto-molecules-sidebar__wrapper--collapsed": isSidebarCollapsed
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-sidebar neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-shrink-0 neeto-ui-overflow-y-auto neeto-ui-overflow-x-hidden",
     "data-cy": "sidebar-wrapper",
-    "data-testid": "sidebar",
-    className: classnames("neeto-molecules-sidebar neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-shrink-0 neeto-ui-overflow-y-auto neeto-ui-overflow-x-hidden", "neeto-molecules-sidebar--collapsed")
-  }, /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement(Links, {
+    "data-testid": "sidebar"
+  }, /*#__PURE__*/React.createElement(Header$1, null), /*#__PURE__*/React.createElement(Links, {
     navLinks: navLinks
   }), /*#__PURE__*/React.createElement(Footer, {
     extraTopLinks: extraTopLinks,
@@ -32162,6 +32180,17 @@ var Sidebar = function Sidebar(_ref) {
     onAppSwitcherToggle: function onAppSwitcherToggle() {
       return setIsAppSwitcherOpen(not);
     }
+  })), /*#__PURE__*/React.createElement(Button, {
+    className: "neeto-molecules-sidebar__toggler",
+    icon: Expand,
+    style: "text",
+    tooltipProps: {
+      content: isSidebarCollapsed ? t("neetoMolecules.sidebar.showMenu") : t("neetoMolecules.sidebar.hideMenu"),
+      position: "bottom"
+    },
+    onClick: function onClick() {
+      return setIsSidebarCollapsed(!isSidebarCollapsed);
+    }
   })), showAppSwitcher && /*#__PURE__*/React.createElement(AppSwitcher, {
     isOpen: isAppSwitcherOpen,
     onClose: function onClose() {