@bigbinary/neeto-molecules 1.1.16 → 1.1.18

package/dist/Sidebar.js

@@ -0,0 +1,972 @@
+import React, { forwardRef, useState, useRef, useEffect } from 'react';
+import classnames from 'classnames';
+import { globalProps as globalProps$1 } from '@bigbinary/neeto-commons-frontend/initializers';
+import { useFetchNeetoApps, useHotKeys, useLocalStorage } from '@bigbinary/neeto-commons-frontend/react-utils';
+import { Typography, Button, Input, Spinner, Avatar, Tooltip } from '@bigbinary/neetoui';
+import { toLower, all, mergeDeepLeft, curry, is, includes, __, not } from 'ramda';
+import { useTranslation } from 'react-i18next';
+import { Link, useLocation, NavLink } from 'react-router-dom';
+import { CSSTransition } from 'react-transition-group';
+import { NeetoIcon, Close, Search, AppSwitcher as AppSwitcher$1, ChatEmpty, Book, Gift, Keyboard, User, Settings, LeftArrow, Help, Down } from '@bigbinary/neeto-icons';
+import { capitalize, truncate, isPresent, findBy, isNotPresent } from '@bigbinary/neeto-commons-frontend/pure';
+import * as AppIcons from '@bigbinary/neeto-icons/app-icons';
+import { createPortal } from 'react-dom';
+import { t as t$1 } from 'i18next';
+import { resetAuthTokens } from '@bigbinary/neeto-commons-frontend/utils';
+import KeyboardShortcuts from '@bigbinary/neeto-molecules/KeyboardShortcuts';
+import * as ProductTypefaceLogos from '@bigbinary/neeto-icons/typeface-logos';
+import { Neeto } from '@bigbinary/neeto-icons/typeface-logos';
+
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+
+function _iterableToArrayLimit(arr, i) {
+  var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+  if (null != _i) {
+    var _s,
+      _e,
+      _x,
+      _r,
+      _arr = [],
+      _n = !0,
+      _d = !1;
+    try {
+      if (_x = (_i = _i.call(arr)).next, 0 === i) {
+        if (Object(_i) !== _i) return;
+        _n = !1;
+      } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0);
+    } catch (err) {
+      _d = !0, _e = err;
+    } finally {
+      try {
+        if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+      } finally {
+        if (_d) throw _e;
+      }
+    }
+    return _arr;
+  }
+}
+
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+
+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:0;overflow:hidden;position:fixed;top:0;z-index:99998}.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;width:100vw}.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:40px;position:relative}.neeto-molecules-app-switcher__wrapper--collapsed{width:100vw}.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__header h1{font-size:40px;line-height:var(--neeto-ui-leading-tight);margin-top:-16px}.neeto-molecules-app-switcher__close-btn{position:absolute;right:12px;top:12px}.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() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+
+var _excluded$3 = ["children"];
+var Backdrop = function Backdrop(_ref, ref) {
+  var children = _ref.children,
+    otherProps = _objectWithoutProperties(_ref, _excluded$3);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    "data-testid": "neeto-backdrop",
+    ref: ref
+  }, otherProps), children);
+};
+var Backdrop$1 = /*#__PURE__*/forwardRef(Backdrop);
+
+var AppLink = function AppLink(_ref) {
+  var name = _ref.name,
+    description = _ref.description,
+    url = _ref.url;
+  var appName = "Neeto".concat(name.charAt(0)).concat(name.slice(1).toLowerCase());
+  var AppIcon = AppIcons[appName];
+  return /*#__PURE__*/React.createElement("a", {
+    "data-cy": "".concat(name, "-app-link"),
+    "data-test-id": "neetoapp-link-".concat(name),
+    href: url,
+    rel: "noreferrer",
+    target: "_blank",
+    className: classnames("neeto-molecules-app-switcher-link", {
+      "neeto-molecules-app-switcher-link--active": capitalize(globalProps.appName) === appName
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classnames("neeto-molecules-app-switcher-link__icon-holder", {
+      "neeto-ui-bg-primary-500": !AppIcon
+    })
+  }, AppIcon ? /*#__PURE__*/React.createElement(AppIcon, {
+    size: 42
+  }) : /*#__PURE__*/React.createElement(NeetoIcon, {
+    color: "white",
+    size: 42
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-app-switcher-link__content"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    component: "span",
+    lineHeight: "relaxed",
+    style: "h4",
+    weight: "medium"
+  }, name), /*#__PURE__*/React.createElement(Typography, {
+    component: "span",
+    style: "body3",
+    weight: "normal"
+  }, description)));
+};
+var AppLink$1 = /*#__PURE__*/React.memo(AppLink);
+
+var Body = function Body(_ref) {
+  var onClose = _ref.onClose;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(""),
+    _useState2 = _slicedToArray(_useState, 2),
+    searchTerm = _useState2[0],
+    setSearchTerm = _useState2[1];
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    data = _useFetchNeetoApps.data;
+  var substring = searchTerm.replace(/ /g, "").toLowerCase();
+  var filteredApps = data === null || data === void 0 ? void 0 : data.neetoApps.filter(function (_ref2) {
+    var name = _ref2.name;
+    return name.toLowerCase().includes(substring);
+  });
+  var handleSearch = function handleSearch(e) {
+    return setSearchTerm(e.target.value);
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button, {
+    className: "neeto-molecules-app-switcher__close-btn",
+    "data-cy": "app-switcher-back-button",
+    "data-testid": "app-switcher-back-button",
+    icon: Close,
+    iconPosition: "left",
+    size: "small",
+    style: "text",
+    onClick: onClose
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-app-switcher__header",
+    "data-cy": "app-switcher-body-wrapper"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    style: "h1"
+  }, t("neetoMolecules.appSwitcher.chooseNeetoProduct")), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-app-switcher__search-wrapper"
+  }, /*#__PURE__*/React.createElement(Input, {
+    autoFocus: true,
+    "data-cy": "app-switcher-search-input",
+    placeholder: t("neetoMolecules.appSwitcher.searchProducts"),
+    prefix: /*#__PURE__*/React.createElement(Search, null),
+    type: "search",
+    value: searchTerm,
+    onChange: handleSearch
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-app-switcher__body"
+  }, (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$1, _extends({
+      key: app.name
+    }, app));
+  })) : /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-text-center",
+    style: "body1"
+  }, t("neetoMolecules.appSwitcher.noApps"))));
+};
+
+var Portal = function Portal(_ref) {
+  var rootId = _ref.rootId,
+    children = _ref.children;
+  var target = useRef(null);
+  useEffect(function () {
+    var container = document.getElementById(rootId);
+    if (!container) {
+      container = document.createElement("div");
+      container.setAttribute("id", rootId);
+      document.body.appendChild(container);
+    }
+    container.appendChild(target.current);
+    return function () {
+      target.current.remove();
+      if (container.childNodes.length === 0) {
+        container.remove();
+      }
+    };
+  }, [rootId]);
+  if (!target.current) {
+    target.current = document.createElement("div");
+  }
+  return /*#__PURE__*/createPortal(children, target.current);
+};
+
+var useOnClickOutside = function useOnClickOutside(insideRef, outsideRef, handler) {
+  useEffect(function () {
+    var listener = function listener(event) {
+      // Do nothing if clicking ref's element or descendent elements
+      if (!insideRef.current || insideRef.current.contains(event.target)) {
+        return;
+      }
+      if (outsideRef.current) {
+        // If Outside ref exists, trigger the handler if it contains the event target.
+        if (outsideRef.current.contains(event.target)) {
+          handler(event);
+        }
+        return;
+      }
+      handler(event);
+    };
+    document.addEventListener("mousedown", listener);
+    document.addEventListener("touchstart", listener);
+    return function () {
+      document.removeEventListener("mousedown", listener);
+      document.removeEventListener("touchstart", listener);
+    };
+  }, [insideRef, outsideRef, handler]);
+};
+
+var AppSwitcher = function AppSwitcher(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    isSidebarCollapsed = _ref.isSidebarCollapsed;
+  var paneWrapper = useRef(null);
+  var backdropRef = useRef(null);
+  useOnClickOutside(paneWrapper, backdropRef, onClose);
+  useHotKeys("esc", onClose, {
+    enabled: isOpen,
+    mode: "global"
+  });
+  return /*#__PURE__*/React.createElement(Portal, {
+    rootId: "neeto-ui-portal"
+  }, /*#__PURE__*/React.createElement(CSSTransition, {
+    appear: true,
+    unmountOnExit: true,
+    classNames: "neeto-molecules-app-switcher",
+    "in": isOpen,
+    timeout: 300
+  }, /*#__PURE__*/React.createElement(Backdrop$1, {
+    key: "switcher-backdrop",
+    ref: backdropRef,
+    className: classnames("neeto-molecules-app-switcher__backdrop", {
+      "neeto-molecules-app-switcher__backdrop--collapsed": isSidebarCollapsed
+    })
+  }, /*#__PURE__*/React.createElement("div", {
+    "data-cy": "switcher-wrapper",
+    "data-testid": "switcher-wrapper",
+    key: "switcher-wrapper",
+    ref: paneWrapper,
+    className: classnames("neeto-molecules-app-switcher__wrapper", {
+      "neeto-molecules-app-switcher__wrapper--collapsed": isSidebarCollapsed
+    })
+  }, /*#__PURE__*/React.createElement(Body, {
+    onClose: onClose
+  })))));
+};
+
+var Chevron = function Chevron(_ref) {
+  var style = _ref.style;
+  return /*#__PURE__*/React.createElement("svg", {
+    height: "16",
+    viewBox: "0 0 16 16",
+    width: "16",
+    style: style
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M7.07031 13.8887C7.2207 14.0391 7.40527 14.1211 7.62402 14.1211C8.06836 14.1211 8.41699 13.7725 8.41699 13.3281C8.41699 13.1094 8.32812 12.9043 8.17773 12.7539L3.37207 8.05762L8.17773 3.375C8.32812 3.21777 8.41699 3.0127 8.41699 2.80078C8.41699 2.35645 8.06836 2.00781 7.62402 2.00781C7.40527 2.00781 7.2207 2.08984 7.07031 2.24023L1.73828 7.44922C1.56055 7.62012 1.46484 7.8252 1.46484 8.06445C1.46484 8.29688 1.55371 8.49512 1.73828 8.67969L7.07031 13.8887ZM13.1748 13.8887C13.3252 14.0391 13.5098 14.1211 13.7354 14.1211C14.1797 14.1211 14.5283 13.7725 14.5283 13.3281C14.5283 13.1094 14.4395 12.9043 14.2891 12.7539L9.4834 8.05762L14.2891 3.375C14.4395 3.21777 14.5283 3.0127 14.5283 2.80078C14.5283 2.35645 14.1797 2.00781 13.7354 2.00781C13.5098 2.00781 13.3252 2.08984 13.1748 2.24023L7.84961 7.44922C7.66504 7.62012 7.57617 7.8252 7.56934 8.06445C7.56934 8.29688 7.66504 8.49512 7.84961 8.67969L13.1748 13.8887Z",
+    fill: "currentColor"
+  }));
+};
+
+var css = ":root{--neeto-molecules-sidebar-width:240px;--neeto-molecules-sidebar-z-index:99998;--neeto-chat-primary:136,134,255;--neeto-wireframe-primary:106,103,232;--neeto-site-primary:129,118,255;--neeto-desk-primary:253,148,55;--neeto-planner-primary:82,169,198;--neeto-replay-primary:32,199,189;--neeto-course-primary:140,214,114;--neeto-ci-primary:255,133,184;--neeto-invoice-primary:70,160,211;--neeto-quiz-primary:254,99,99;--neeto-runner-primary:75,71,255;--neeto-form-primary:254,128,114;--neeto-crm-primary:96,154,240;--neeto-changelog-primary:255,135,135;--neeto-deploy-primary:20,209,164;--neeto-kb-primary:101,205,161;--neeto-cal-primary:238,77,95;--neeto-invisible-primary:121,157,250;--neeto-testify-primary:255,158,69;--neeto-monitor-primary:70,181,197;--neeto-git-primary:255,78,110}.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{right:-36px;transform:scale(-1)}.neeto-molecules-sidebar__wrapper:hover .neeto-molecules-sidebar__toggler{opacity: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-hover-area{bottom:0;left:100%;position:absolute;top:0;width:40px;z-index:99998;z-index:var(--neeto-molecules-sidebar-z-index)}.neeto-molecules-sidebar__toggler{opacity:0;position:absolute;right:8px;top:8px;transition:opacity .3s ease-in-out;z-index:99999;z-index:calc(var(--neeto-molecules-sidebar-z-index) + 1)}.neeto-molecules-sidebar__toggler:focus{opacity:1}.neeto-molecules-sidebar__header{margin:14px 0 28px;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:12px 24px;position:relative;text-decoration:none!important;transition:var(--neeto-ui-transition);width:100%}.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-icon--caret{opacity:0;transition:opacity .3s ease-in-out}.neeto-molecules-sidebar__link-label,.neeto-molecules-sidebar__link-sub-label{flex-grow:1;text-align:left}.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.active .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link:focus .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link:focus-visible .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link:hover .neeto-molecules-sidebar__link-icon--caret,.neeto-molecules-sidebar__link[aria-expanded=true] .neeto-molecules-sidebar__link-icon--caret{opacity:1}.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;gap:8px;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}.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:0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12),0 5px 5px -3px rgba(0,0,0,.2)!important;min-width:240px}.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-popup__top-section{border-top-left-radius:var(--neeto-ui-rounded);border-top-right-radius:var(--neeto-ui-rounded)}.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;min-height:40px;text-align:left}.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}.neeto-molecules-help-sublist__item-btn span,.neeto-molecules-profile-sublist__item-btn span{align-items:center;display:flex;gap:8px}.neeto-molecules-sidebar__link-icon{position:relative}.neeto-molecules-sidebar__notif-count{position:absolute;right:-6px;top:-6px;z-index:1}.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;flex-shrink:0;font-size:var(--neeto-ui-text-xxs);height:16px;justify-content:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:16px}";
+n(css,{});
+
+var AppSwitcherButton = function AppSwitcherButton(_ref) {
+  var onAppSwitcherToggle = _ref.onAppSwitcherToggle;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasHovered = _useState2[0],
+    setHasHovered = _useState2[1];
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    data = _useFetchNeetoApps.data,
+    refetchNeetoApps = _useFetchNeetoApps.refetch,
+    isStale = _useFetchNeetoApps.isStale,
+    isLoading = _useFetchNeetoApps.isLoading;
+  var handleAppSwitcherToggle = function handleAppSwitcherToggle(event) {
+    if (!data) event.stopPropagation();else onAppSwitcherToggle();
+  };
+  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",
+    "data-testid": "app-switcher-button",
+    onClick: handleAppSwitcherToggle,
+    onMouseEnter: function onMouseEnter() {
+      if (!hasHovered && isStale) {
+        refetchNeetoApps();
+        setHasHovered(true);
+      }
+    }
+  }, /*#__PURE__*/React.createElement("span", {
+    className: "neeto-molecules-sidebar__link-icon neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center h-6 w-6"
+  }, hasHovered && isLoading ? /*#__PURE__*/React.createElement("span", {
+    "data-testid": "app-switcher-button-loader"
+  }, /*#__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";
+var MY_ORGANIZATION_URL = "/auth/organization/edit";
+var CHANGELOG_WIDGET_TRIGGER_ID = "neetochangelog-trigger";
+var DEFAULT_HELP_LINK_PROPS = {
+  liveChatProps: {
+    label: t$1("neetoMolecules.sidebar.helpLinks.liveChat"),
+    icon: ChatEmpty,
+    "data-cy": "help-link-live-chat-button",
+    onClick: function onClick() {
+      var _window$NeetoChat, _window$NeetoChat$con, _window$NeetoChat2, _window$NeetoChat2$co;
+      (_window$NeetoChat = window.NeetoChat) === null || _window$NeetoChat === void 0 ? void 0 : (_window$NeetoChat$con = _window$NeetoChat.contextualHelp) === null || _window$NeetoChat$con === void 0 ? void 0 : _window$NeetoChat$con.maximizeWidget();
+      (_window$NeetoChat2 = window.NeetoChat) === null || _window$NeetoChat2 === void 0 ? void 0 : (_window$NeetoChat2$co = _window$NeetoChat2.contextualHelp) === null || _window$NeetoChat2$co === void 0 ? void 0 : _window$NeetoChat2$co.openWidget();
+    }
+  },
+  helpCenterProps: {
+    label: t$1("neetoMolecules.sidebar.helpLinks.helpArticles"),
+    icon: Book,
+    "data-cy": "help-link-help-center-button",
+    href: "https://help.".concat(toLower(globalProps.appName), ".com/"),
+    target: "_blank"
+  },
+  changelogProps: {
+    id: CHANGELOG_WIDGET_TRIGGER_ID,
+    label: t$1("neetoMolecules.sidebar.helpLinks.whatsNew"),
+    icon: Gift,
+    "data-cy": "help-link-changelog-button"
+  },
+  keyboardShortcutProps: {
+    label: t$1("neetoMolecules.sidebar.helpLinks.keyboardShortcuts"),
+    icon: Keyboard,
+    "data-cy": "help-link-keyboard-shortcut-button"
+  }
+};
+
+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 getSidebarStateLocalStorageKey = function getSidebarStateLocalStorageKey() {
+  var _globalProps$user, _globalProps$user2;
+  var user = ((_globalProps$user = globalProps.user) === null || _globalProps$user === void 0 ? void 0 : _globalProps$user.email) || ((_globalProps$user2 = globalProps.user) === null || _globalProps$user2 === void 0 ? void 0 : _globalProps$user2.phoneNumber);
+  return "sidebarState-".concat(user);
+};
+
+var getProfileInfo = function getProfileInfo(isOwner, profileInfoOverrides) {
+  var _globalProps$user, _globalProps$user2, _globalProps$user3, _globalProps$user4, _globalProps$user5;
+  return mergeDeepLeft(profileInfoOverrides, {
+    name: "".concat((_globalProps$user = globalProps.user) === null || _globalProps$user === void 0 ? void 0 : _globalProps$user.firstName, " ").concat((_globalProps$user2 = globalProps.user) === null || _globalProps$user2 === void 0 ? void 0 : _globalProps$user2.lastName),
+    imageUrl: (_globalProps$user3 = globalProps.user) === null || _globalProps$user3 === void 0 ? void 0 : _globalProps$user3.profileImageUrl,
+    email: ((_globalProps$user4 = globalProps.user) === null || _globalProps$user4 === void 0 ? void 0 : _globalProps$user4.email) || ((_globalProps$user5 = globalProps.user) === null || _globalProps$user5 === void 0 ? void 0 : _globalProps$user5.phoneNumber),
+    topLinks: [{
+      label: t$1("neetoMolecules.sidebar.myProfile"),
+      icon: User,
+      onClick: function onClick() {
+        return window.open(MY_PROFILE_URL, "_blank");
+      },
+      "data-cy": "my-profile-button"
+    }, isOwner && {
+      label: t$1("neetoMolecules.sidebar.myOrganization"),
+      icon: Settings,
+      onClick: function onClick() {
+        return window.open(MY_ORGANIZATION_URL, "_blank");
+      },
+      "data-cy": "profile-organization-settings-button"
+    }].filter(Boolean),
+    bottomLinks: [{
+      icon: LeftArrow,
+      label: t$1("neetoMolecules.sidebar.logout"),
+      onClick: function onClick() {
+        resetAuthTokens();
+        localStorage.removeItem(getSidebarStateLocalStorageKey());
+        window.location.href = "/logout";
+      },
+      "data-cy": "profile-logout-button"
+    }]
+  });
+};
+
+var ProfileSection = function ProfileSection(_ref, ref) {
+  var profileInfo = _ref.profileInfo;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasHovered = _useState2[0],
+    setHasHovered = _useState2[1];
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    refetchNeetoApps = _useFetchNeetoApps.refetch,
+    isLoading = _useFetchNeetoApps.isLoading,
+    isStale = _useFetchNeetoApps.isStale;
+  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",
+    "data-cy": "profile-section",
+    "data-testid": "profile-section",
+    ref: ref,
+    onMouseEnter: function onMouseEnter() {
+      if (!hasHovered && isStale) {
+        refetchNeetoApps();
+        setHasHovered(true);
+      }
+    }
+  }, isLoading && hasHovered ? /*#__PURE__*/React.createElement("span", {
+    "data-testid": "profile-avatar-loader"
+  }, /*#__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",
+    "data-testid": "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))));
+};
+var ProfileSection$1 = /*#__PURE__*/forwardRef(ProfileSection);
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+
+function _iterableToArray(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+
+function _nonIterableSpread() {
+  throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+
+function _typeof(obj) {
+  "@babel/helpers - typeof";
+
+  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
+    return typeof obj;
+  } : function (obj) {
+    return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
+  }, _typeof(obj);
+}
+
+function _toPrimitive(input, hint) {
+  if (_typeof(input) !== "object" || input === null) return input;
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (_typeof(res) !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}
+
+function _toPropertyKey(arg) {
+  var key = _toPrimitive(arg, "string");
+  return _typeof(key) === "symbol" ? key : String(key);
+}
+
+function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+
+var _excluded$2 = ["onClick", "label", "icon"];
+function ownKeys$2(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$2(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$2(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var LinkSection = function LinkSection(_ref) {
+  var links = _ref.links;
+  return /*#__PURE__*/React.createElement("ul", {
+    className: "neeto-molecules-profile-sublist"
+  }, links.map(function (_ref2, idx) {
+    var onClick = _ref2.onClick,
+      label = _ref2.label,
+      _ref2$icon = _ref2.icon,
+      icon = _ref2$icon === void 0 ? null : _ref2$icon,
+      otherProps = _objectWithoutProperties(_ref2, _excluded$2);
+    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",
+      iconPosition: "left",
+      iconSize: 18,
+      style: "text"
+    }, _objectSpread$2({
+      icon: icon,
+      label: label,
+      onClick: onClick
+    }, otherProps))));
+  }));
+};
+
+var ProfileMenu = function ProfileMenu(_ref) {
+  var profileInfo = _ref.profileInfo,
+    extraTopLinks = _ref.extraTopLinks;
+  var name = profileInfo.name,
+    email = profileInfo.email,
+    topLinks = profileInfo.topLinks,
+    bottomLinks = profileInfo.bottomLinks,
+    customContent = profileInfo.customContent;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-flex neeto-ui-flex-col neeto-molecules-profile-popup",
+    "data-cy": "profile-popup",
+    "data-testid": "profile-popup"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classnames("neeto-ui-relative neeto-ui-flex neeto-ui-items-center neeto-ui-p-3 neeto-ui-bg-primary-100 neeto-molecules-profile-popup__top-section")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "top-0 left-0"
+  }, /*#__PURE__*/React.createElement(Avatar, {
+    size: "large",
+    user: profileInfo
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-grow neeto-ui-min-w-0 neeto-ui-pl-3"
+  }, /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-m-0",
+    component: "h2",
+    lineHeight: "tight",
+    style: "h5",
+    title: name,
+    weight: "semibold"
+  }, truncate(name, 18)), email && /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-ui-w-full neeto-ui-truncate neeto-ui-text-gray-700",
+    lineHeight: "tight",
+    style: "body3"
+  }, email))), /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-sidebar__profile-wrapper-custom-content"
+  }, customContent), topLinks && /*#__PURE__*/React.createElement(LinkSection, {
+    links: [].concat(_toConsumableArray(extraTopLinks), _toConsumableArray(topLinks))
+  }), bottomLinks && /*#__PURE__*/React.createElement(LinkSection, {
+    links: bottomLinks
+  }));
+};
+
+var ProfileButton = function ProfileButton(_ref) {
+  var extraTopLinks = _ref.extraTopLinks,
+    profileInfoOverrides = _ref.profileInfoOverrides;
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    data = _useFetchNeetoApps.data;
+  var profileInfo = getProfileInfo(data === null || data === void 0 ? void 0 : data.isOwner, profileInfoOverrides);
+  return /*#__PURE__*/React.createElement(Tooltip, {
+    interactive: true,
+    className: "neeto-molecules-profile-popup-wrapper",
+    content: /*#__PURE__*/React.createElement(ProfileMenu, {
+      extraTopLinks: extraTopLinks,
+      profileInfo: profileInfo
+    }),
+    disabled: !data,
+    hideOnClick: false,
+    interactiveDebounce: 20,
+    offset: [0, -70],
+    position: "right",
+    theme: "light"
+  }, /*#__PURE__*/React.createElement(ProfileSection$1, {
+    profileInfo: profileInfo
+  }));
+};
+
+// Rule can be enabled once the ticket - https://github.com/bigbinary/neeto-commons-frontend/issues/905 is closed.
+// eslint-disable-next-line @bigbinary/neeto/no-dumb-components-with-use-translation
+var HelpSection = function HelpSection(_ref, ref) {
+  var changesCount = _ref.changesCount;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  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",
+    "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)), /*#__PURE__*/React.createElement(Typography, {
+    className: "neeto-molecules-sidebar__link-label",
+    component: "span",
+    style: "body2",
+    weight: "normal"
+  }, t("neetoMolecules.sidebar.helpLinks.helpCenter")));
+};
+var HelpSection$1 = /*#__PURE__*/forwardRef(HelpSection);
+
+var _excluded$1 = ["label"];
+function ownKeys$1(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$1(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$1(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var HelpSectionMenu = function HelpSectionMenu(_ref) {
+  var helpLinkOverrides = _ref.helpLinkOverrides,
+    changesCount = _ref.changesCount;
+  var _KeyboardShortcuts$us = KeyboardShortcuts.usePaneState(),
+    _KeyboardShortcuts$us2 = _slicedToArray(_KeyboardShortcuts$us, 2),
+    setIsOpen = _KeyboardShortcuts$us2[1];
+  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() {
+        return setIsOpen(true);
+      }
+    }), key === "changelogProps" && changesCount && {
+      changesCount: changesCount
+    });
+  }).filter(function (_ref2) {
+    var hide = _ref2.hide;
+    return !hide;
+  });
+  return /*#__PURE__*/React.createElement("ul", {
+    className: "neeto-molecules-help-sublist"
+  }, 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, isPresent(buttonProps.changesCount) && /*#__PURE__*/React.createElement("span", {
+      className: "neeto-molecules-help-sublist__item-btn-count",
+      "data-testid": "help-section-menu-changes-count"
+    }, buttonProps.changesCount)));
+  }));
+};
+
+var Footer = function Footer(_ref) {
+  var extraTopLinks = _ref.extraTopLinks,
+    helpLinkOverrides = _ref.helpLinkOverrides,
+    profileInfoOverrides = _ref.profileInfoOverrides,
+    _ref$showAppSwitcher = _ref.showAppSwitcher,
+    showAppSwitcher = _ref$showAppSwitcher === void 0 ? false : _ref$showAppSwitcher,
+    onAppSwitcherToggle = _ref.onAppSwitcherToggle;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    changesCount = _useState2[0],
+    setChangesCount = _useState2[1];
+  useEffect(function () {
+    var Nv = {
+      onReceiveData: function onReceiveData(data) {
+        if (data.unreadCount) {
+          setChangesCount(data.unreadCount);
+        }
+      },
+      onShow: function onShow() {
+        setChangesCount(null);
+      }
+    };
+    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"
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    interactive: true,
+    className: "neeto-molecules-help-popup-wrapper",
+    content: /*#__PURE__*/React.createElement(HelpSectionMenu, {
+      changesCount: changesCount,
+      helpLinkOverrides: helpLinkOverrides
+    }),
+    hideOnClick: false,
+    interactiveDebounce: 20,
+    offset: [0, -70],
+    position: "right",
+    theme: "light"
+  }, /*#__PURE__*/React.createElement(HelpSection$1, {
+    changesCount: changesCount
+  })), showAppSwitcher && /*#__PURE__*/React.createElement(AppSwitcherButton, {
+    onAppSwitcherToggle: onAppSwitcherToggle
+  }), /*#__PURE__*/React.createElement(ProfileButton, {
+    extraTopLinks: extraTopLinks,
+    profileInfoOverrides: profileInfoOverrides
+  }));
+};
+
+var Header = function Header(_ref) {
+  var _ProductTypefaceLogos;
+  var customLogo = _ref.customLogo;
+  var productName = globalProps.appName.substr(5);
+  var logoName = "Neeto".concat(capitalize(productName.toLowerCase()));
+  var ProductTypefaceLogo = (_ProductTypefaceLogos = ProductTypefaceLogos[logoName]) !== null && _ProductTypefaceLogos !== void 0 ? _ProductTypefaceLogos : Neeto;
+  var LogoComponent = customLogo !== null && customLogo !== void 0 ? customLogo : ProductTypefaceLogo;
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    data = _useFetchNeetoApps.data;
+  var homePath = "/";
+  if (data !== null && data !== void 0 && data.neetoApps) {
+    var thisApp = findBy({
+      name: productName
+    }, data.neetoApps);
+    if (thisApp !== null && thisApp !== void 0 && thisApp.url) {
+      homePath = new URL(thisApp === null || thisApp === void 0 ? void 0 : thisApp.url).pathname;
+    }
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-sidebar__header neeto-molecules-sidebar__no-shrinkable",
+    "data-cy": "sidebar-info"
+  }, /*#__PURE__*/React.createElement(Link, {
+    className: "neeto-molecules-sidebar__logo neeto-ui-w-full",
+    to: homePath
+  }, /*#__PURE__*/React.createElement(LogoComponent, null)));
+};
+var Header$1 = /*#__PURE__*/React.memo(Header);
+
+var _excluded = ["label", "to", "icon", "items"],
+  _excluded2 = ["label", "to", "count", "dataCy"];
+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) {
+  var navLinks = _ref.navLinks;
+  var location = useLocation();
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    isActiveLinkExpanded = _useState2[0],
+    setIsActiveLinkExpanded = _useState2[1];
+  var filterByPermissions = curry(function (_ref2) {
+    var permissions = _ref2.permissions;
+    if (permissions) {
+      return is(Array, permissions) ? permissions.some(includes(__, globalProps$1.permissions)) : globalProps$1.permissions.includes(permissions);
+    }
+    return true;
+  });
+  var handleNavLinkClick = function handleNavLinkClick(event, isActive, items) {
+    if (isNotPresent(items)) return;
+    if (isActive()) {
+      setIsActiveLinkExpanded(not);
+      event.preventDefault();
+      return;
+    }
+    setIsActiveLinkExpanded(true);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    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,
+      items = _ref3.items,
+      otherProps = _objectWithoutProperties(_ref3, _excluded);
+    var IconSVG = icon;
+    var url = new URL(to, window.location.href);
+    var isActive = function isActive() {
+      return is(Function, otherProps.isActive) ? otherProps.isActive() : location.pathname.startsWith(url.pathname);
+    };
+    var isMenuExpanded = isActive() && isActiveLinkExpanded;
+    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",
+      onClick: function onClick(event) {
+        return handleNavLinkClick(event, isActive, items);
+      }
+    }, _objectSpread({
+      isActive: isActive,
+      to: to
+    }, otherProps)), icon && /*#__PURE__*/React.createElement("span", {
+      className: "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--caret", {
+        "neeto-molecules-sidebar__link-icon--rotate": isMenuExpanded
+      })
+    }, /*#__PURE__*/React.createElement(Down, {
+      size: 16
+    }))), items && isMenuExpanded && /*#__PURE__*/React.createElement("div", {
+      className: "neeto-molecules-sidebar__sublink-wrapper",
+      "data-cy": "sidebar-sub-link-wrapper"
+    }, items.filter(filterByPermissions).map(function (_ref4, subIndex) {
+      var subLabel = _ref4.label,
+        subRoute = _ref4.to,
+        count = _ref4.count,
+        dataCy = _ref4.dataCy,
+        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",
+        "data-cy": "".concat(dataCy, "-sub-link"),
+        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",
+        "data-cy": "".concat(dataCy, "-sub-link-label"),
+        style: "body2"
+      }, subLabel), /*#__PURE__*/React.createElement(Typography, {
+        className: "neeto-molecules-sidebar__link-sub-count neeto-ui-flex-shrink-0",
+        component: "span",
+        "data-cy": "".concat(dataCy, "-sub-link-count"),
+        style: "body2"
+      }, count > 999 ? "999+" : count));
+    })));
+  }));
+};
+
+var Sidebar = function Sidebar(_ref) {
+  var navLinks = _ref.navLinks,
+    customLogo = _ref.customLogo,
+    _ref$profileInfoOverr = _ref.profileInfoOverrides,
+    profileInfoOverrides = _ref$profileInfoOverr === void 0 ? {} : _ref$profileInfoOverr,
+    _ref$helpLinkOverride = _ref.helpLinkOverrides,
+    helpLinkOverrides = _ref$helpLinkOverride === void 0 ? {} : _ref$helpLinkOverride,
+    _ref$extraTopLinks = _ref.extraTopLinks,
+    extraTopLinks = _ref$extraTopLinks === void 0 ? [] : _ref$extraTopLinks,
+    _ref$showAppSwitcher = _ref.showAppSwitcher,
+    showAppSwitcher = _ref$showAppSwitcher === void 0 ? true : _ref$showAppSwitcher;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isAppSwitcherOpen = _useState2[0],
+    setIsAppSwitcherOpen = _useState2[1];
+  var _useLocalStorage = useLocalStorage(getSidebarStateLocalStorageKey(), false),
+    _useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
+    isSidebarCollapsed = _useLocalStorage2[0],
+    setIsSidebarCollapsed = _useLocalStorage2[1];
+  var location = useLocation();
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  useEffect(function () {
+    isAppSwitcherOpen && setIsAppSwitcherOpen(false);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [location]);
+  var productName = globalProps$1.appName.substr(5).toLowerCase();
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    "data-testid": "sidebar-container",
+    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"
+  }, /*#__PURE__*/React.createElement(Header$1, {
+    customLogo: customLogo
+  }), /*#__PURE__*/React.createElement(Links, {
+    navLinks: navLinks
+  }), /*#__PURE__*/React.createElement(Footer, {
+    extraTopLinks: extraTopLinks,
+    helpLinkOverrides: helpLinkOverrides,
+    profileInfoOverrides: profileInfoOverrides,
+    showAppSwitcher: showAppSwitcher,
+    onAppSwitcherToggle: function onAppSwitcherToggle() {
+      return setIsAppSwitcherOpen(not);
+    }
+  })), isSidebarCollapsed && /*#__PURE__*/React.createElement("div", {
+    className: "neeto-molecules-sidebar__toggler-hover-area"
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: "neeto-molecules-sidebar__toggler",
+    "data-cy": "neeto-molecules-sidebar-toggler",
+    "data-testid": "sidebar-toggleButton",
+    style: "text",
+    icon: function icon() {
+      return /*#__PURE__*/React.createElement(Chevron, {
+        style: {
+          color: "rgb(var(--neeto-".concat(productName, "-primary))")
+        }
+      });
+    },
+    tooltipProps: {
+      content: isSidebarCollapsed ? t("neetoMolecules.sidebar.showMenu") : t("neetoMolecules.sidebar.hideMenu"),
+      position: "bottom"
+    },
+    onClick: function onClick() {
+      setIsSidebarCollapsed(!isSidebarCollapsed);
+    }
+  })), showAppSwitcher && /*#__PURE__*/React.createElement(AppSwitcher, {
+    isSidebarCollapsed: isSidebarCollapsed,
+    isOpen: isAppSwitcherOpen,
+    onClose: function onClose() {
+      return setIsAppSwitcherOpen(false);
+    }
+  }));
+};
+
+export { Sidebar as default };
+//# sourceMappingURL=Sidebar.js.map