@bigbinary/neeto-molecules 1.0.73-beta → 1.0.74

package/dist/Sidebar.js

@@ -1,11 +1,11 @@
 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, SidebarOpen, SidebarClose } from '@bigbinary/neeto-icons';
-import { Typography, Button, Input, Spinner, Avatar, Tooltip } from '@bigbinary/neetoui';
-import { toLower, mergeDeepLeft, all, curry, is, includes, __, not } from 'ramda';
-import { useTranslation } from 'react-i18next';
+import { toLower, mergeDeepLeft, curry, is, includes, __, not } from 'ramda';
 import { Link, useLocation, NavLink } from 'react-router-dom';
 import { useFetchNeetoApps } from '@bigbinary/neeto-commons-frontend/react-utils';
-import { capitalize, truncate, findBy } from '@bigbinary/neeto-commons-frontend/pure';
+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, Spinner, Avatar } from '@bigbinary/neetoui';
+import { useTranslation } from 'react-i18next';
+import { capitalize, truncate, isPresent, 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';
@@ -31486,7 +31486,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: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}";
+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}";
 n(css$1,{});
 
 function _extends() {
@@ -31717,7 +31717,42 @@ var AppSwitcher = function AppSwitcher(_ref) {
   })))));
 };
 
-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{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;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}";
+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 FeaturedTooltip$1 = /*#__PURE__*/React.memo(FeaturedTooltip);
+
+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$1, {
+      description: description,
+      label: label
+    }),
+    delay: [400, 40],
+    distance: "20rem",
+    duration: [200, 200],
+    position: "right"
+  }, children);
+};
+
+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}";
 n(css,{});
 
 var AppSwitcherButton = function AppSwitcherButton(_ref) {
@@ -31733,7 +31768,9 @@ var AppSwitcherButton = function AppSwitcherButton(_ref) {
   var handleAppSwitcherToggle = function handleAppSwitcherToggle(event) {
     if (isFreshLoading) event.stopPropagation();else onAppSwitcherToggle();
   };
-  return /*#__PURE__*/React.createElement("button", {
+  return /*#__PURE__*/React.createElement(NavIconWrapper, {
+    label: t("neetoMolecules.sidebar.productSwitcher")
+  }, /*#__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: handleAppSwitcherToggle,
@@ -31744,12 +31781,7 @@ var AppSwitcherButton = function AppSwitcherButton(_ref) {
     className: "neeto-molecules-sidebar__link-icon neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center h-6 w-6"
   }, hasHovered && isFreshLoading ? /*#__PURE__*/React.createElement(Spinner, null) : /*#__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";
@@ -31767,7 +31799,7 @@ var DEFAULT_HELP_LINK_PROPS = {
     }
   },
   helpCenterProps: {
-    label: t$1("neetoMolecules.sidebar.helpLinks.helpArticles"),
+    label: t$1("neetoMolecules.sidebar.helpLinks.helpCenter"),
     icon: Book,
     "data-cy": "help-link-help-center-button",
     href: "https://help.".concat(toLower(globalProps.appName), ".com/"),
@@ -31828,26 +31860,21 @@ var ProfileSection = function ProfileSection(_ref, ref) {
   var _useFetchNeetoApps = useFetchNeetoApps(),
     isFreshLoading = _useFetchNeetoApps.isFreshLoading;
   return /*#__PURE__*/React.createElement("button", {
-    className: "neeto-molecules-sidebar__profile-wrapper neeto-ui-w-full neeto-ui-text-lef",
+    className: "neeto-molecules-sidebar__profile-wrapper neeto-ui-w-full neeto-ui-text-left",
     "data-cy": "profile-section",
     ref: ref,
     onMouseEnter: function onMouseEnter() {
       return setHasHovered(true);
     }
   }, /*#__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 neeto-molecules-sidebar__link"
+    className: "neeto-molecules-sidebar__profile neeto-ui-flex neeto-ui-w-full neeto-ui-flex-shrink-0 neeto-ui-items-center"
   }, isFreshLoading && hasHovered ? /*#__PURE__*/React.createElement("span", {
     className: "flex h-11 w-10 items-center justify-center"
-  }, /*#__PURE__*/React.createElement(Spinner, null)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Avatar, {
-    className: "neeto-ui-flex-shrink-0 neeto-molecules-sidebar__profile-avatar",
-    size: "small",
+  }, /*#__PURE__*/React.createElement(Spinner, null)) : /*#__PURE__*/React.createElement(Avatar, {
+    className: "neeto-ui-flex-shrink-0",
+    size: "large",
     user: profileInfo
-  }), /*#__PURE__*/React.createElement(Typography, {
-    className: "neeto-molecules-sidebar__link-label",
-    component: "span",
-    style: "body2",
-    weight: "normal"
-  }, truncate(profileInfo.name, 18)))));
+  })));
 };
 var ProfileSection$1 = /*#__PURE__*/forwardRef(ProfileSection);
 
@@ -31878,19 +31905,22 @@ var LinkSection = function LinkSection(_ref) {
       _ref2$icon = _ref2.icon,
       icon = _ref2$icon === void 0 ? null : _ref2$icon,
       otherProps = _objectWithoutProperties(_ref2, _excluded$2);
+    var IconSVG = icon;
     return /*#__PURE__*/React.createElement("li", {
       className: "neeto-molecules-profile-sublist__item",
       key: idx
-    }, /*#__PURE__*/React.createElement(Button, _extends({
-      fullWidth: true,
-      className: "neeto-molecules-profile-sublist__item-btn",
-      icon: icon,
-      iconPosition: "left",
-      iconSize: 18,
-      label: label,
-      style: "text",
+    }, /*#__PURE__*/React.createElement("button", _extends({
       onClick: onClick
-    }, otherProps)));
+    }, 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)));
   }));
 };
 
@@ -31958,24 +31988,19 @@ var ProfileButton = function ProfileButton(_ref) {
 };
 
 var HelpSection = function HelpSection(_ref, ref) {
-  _ref.changesCount;
-  var _useTranslation = useTranslation(),
-    t = _useTranslation.t;
-  var showChangesCount = false;
+  var changesCount = _ref.changesCount;
   return /*#__PURE__*/React.createElement("button", {
-    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",
+    className: "neeto-molecules-sidebar__link neeto-molecules-sidebar__link--button neeto-ui-shadow-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
-  }), showChangesCount  ), /*#__PURE__*/React.createElement(Typography, {
-    className: "neeto-molecules-sidebar__link-label",
-    component: "span",
-    style: "body2",
-    weight: "normal"
-  }, t("neetoMolecules.sidebar.helpLinks.helpCenter")));
+  }), isPresent(changesCount) && /*#__PURE__*/React.createElement("span", {
+    className: "neeto-molecules-sidebar__notif-count",
+    "data-testid": "help-icon-changes-count"
+  }, changesCount)));
 };
 var HelpSection$1 = /*#__PURE__*/forwardRef(HelpSection);
 
@@ -32029,7 +32054,6 @@ 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$1(_objectSpread$1(_objectSpread$1(_objectSpread$1({}, DEFAULT_HELP_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
       onClick: function onClick() {
@@ -32042,21 +32066,21 @@ var HelpSectionMenu = function HelpSectionMenu(_ref) {
     var hide = _ref2.hide;
     return !hide;
   });
-  return /*#__PURE__*/React.createElement("ul", {
-    className: "neeto-molecules-help-sublist"
-  }, helpLinks.map(function (_ref3, idx) {
+  return /*#__PURE__*/React.createElement("ul", null, helpLinks.map(function (_ref3, idx) {
     var label = _ref3.label,
       buttonProps = _objectWithoutProperties(_ref3, _excluded$1);
     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, showChangesCount  ));
+    }, 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)));
   }));
 };
 
@@ -32085,7 +32109,7 @@ var Footer = function Footer(_ref) {
     window.Nv = window.Nv ? Object.assign(window.Nv, Nv) : Nv;
   }, []);
   return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-molecules-sidebar__footer neeto-molecules-sidebar__no-shrinkable"
+    className: "neeto-molecules-sidebar__footer"
   }, /*#__PURE__*/React.createElement(Tooltip, {
     interactive: true,
     className: "neeto-molecules-help-popup-wrapper",
@@ -32094,8 +32118,6 @@ var Footer = function Footer(_ref) {
       helpLinkOverrides: helpLinkOverrides
     }),
     hideOnClick: false,
-    interactiveDebounce: 30,
-    offset: 0,
     position: "right",
     theme: "light"
   }, /*#__PURE__*/React.createElement(HelpSection$1, {
@@ -32125,30 +32147,17 @@ var Header = function Header() {
     }
   }
   return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-molecules-sidebar__header neeto-molecules-sidebar__no-shrinkable",
+    className: "neeto-ui-flex neeto-ui-items-center neeto-molecules-sidebar__header",
     "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: homePath
-  }, /*#__PURE__*/React.createElement(ProductLogo, null)));
+  }, /*#__PURE__*/React.createElement(ProductLogo, null))));
 };
 var Header$1 = /*#__PURE__*/React.memo(Header);
 
-var isSubRouteActive = function isSubRouteActive(subRoute, location) {
-  var currentBrowserUrl = new URL(location.pathname + location.search, window.location.origin);
-  var targetUrl = new URL(subRoute, window.location.origin);
-  if (!currentBrowserUrl.pathname.startsWith(targetUrl.pathname)) {
-    return false;
-  }
-  var targetSearchParams = targetUrl.searchParams;
-  var targetSearchKeys = Array.from(targetSearchParams.keys());
-  return all(function (key) {
-    return currentBrowserUrl.searchParams.get(key) === targetSearchParams.get(key);
-  }, targetSearchKeys);
-};
-
-var _excluded = ["label", "to", "icon", "items"],
-  _excluded2 = ["label", "to", "count"];
+var _excluded = ["label", "to", "icon", "description"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var Links = function Links(_ref) {
@@ -32162,19 +32171,21 @@ var Links = function Links(_ref) {
     return true;
   });
   return /*#__PURE__*/React.createElement("div", {
-    className: "neeto-molecules-sidebar__links neeto-molecules-sidebar__no-shrinkable"
+    className: "neeto-molecules-sidebar__links"
   }, navLinks.filter(filterByPermissions).map(function (_ref3, mainIndex) {
     var label = _ref3.label,
       to = _ref3.to,
       icon = _ref3.icon,
-      items = _ref3.items,
+      description = _ref3.description,
       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(React.Fragment, {
+    return /*#__PURE__*/React.createElement(NavIconWrapper, {
+      description: description,
+      label: label,
       key: mainIndex
     }, /*#__PURE__*/React.createElement(NavLink, _extends({
       activeClassName: "active",
@@ -32182,45 +32193,10 @@ var Links = function Links(_ref) {
     }, _objectSpread({
       isActive: isActive,
       to: to
-    }, otherProps)), icon && /*#__PURE__*/React.createElement("span", {
-      className: "neeto-molecules-sidebar__link-icon",
+    }, otherProps)), icon && /*#__PURE__*/React.createElement("div", {
+      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-molecules-sidebar__link-icon",
       "data-testid": label
-    }, /*#__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",
-        isActive: function isActive() {
-          return isSubRouteActive(subRoute, location);
-        },
-        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));
-    })));
+    }, /*#__PURE__*/React.createElement(IconSVG, null))));
   }));
 };
 
@@ -32238,25 +32214,15 @@ 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"
+    "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$1, null), /*#__PURE__*/React.createElement(Links, {
     navLinks: navLinks
   }), /*#__PURE__*/React.createElement(Footer, {
@@ -32267,17 +32233,6 @@ var Sidebar = function Sidebar(_ref) {
     onAppSwitcherToggle: function onAppSwitcherToggle() {
       return setIsAppSwitcherOpen(not);
     }
-  })), /*#__PURE__*/React.createElement(Button, {
-    className: "neeto-molecules-sidebar__toggler",
-    icon: isSidebarCollapsed ? SidebarOpen : SidebarClose,
-    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() {