@bigbinary/neetoui 8.3.29 → 8.3.31

package/dist/Sidebar.js

@@ -1,13 +1,18 @@
-import React__default, { forwardRef, useState } from 'react';
+import { forwardRef, useState, createElement } from 'react';
 import classnames from 'classnames';
-import { n as noop } from './index-Dxaw6gl9.js';
+import { n as noop } from './index-D6vmwyYl.js';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import Tooltip from './Tooltip.js';
-import { AppSwitcher as AppSwitcher$1, Help, Book, Keyboard, ChatEmpty, Gift } from '@bigbinary/neeto-icons';
+import AppSwitcherIcon from '@bigbinary/neeto-icons/AppSwitcher';
 import Typography from './Typography.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import Help from '@bigbinary/neeto-icons/Help';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import Book from '@bigbinary/neeto-icons/Book';
+import Keyboard from '@bigbinary/neeto-icons/Keyboard';
+import Gift from '@bigbinary/neeto-icons/Gift';
+import ChatEmpty from '@bigbinary/neeto-icons/ChatEmpty';
 import { values } from 'ramda';
-import _extends from '@babel/runtime/helpers/extends';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import Avatar from './Avatar.js';
 import { Neeto } from '@bigbinary/neeto-icons/logos';
@@ -30,22 +35,24 @@ import 'avvvatars-react';
 var FeaturedTooltip = function FeaturedTooltip(_ref) {
   var label = _ref.label,
     description = _ref.description;
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: "neeto-ui-flex neeto-ui-flex-col sidebar-featured-tooltip"
-  }, /*#__PURE__*/React__default.createElement(Typography, {
-    className: "neeto-ui-text-center sidebar-featured-tooltip__title",
-    lineHeight: "tight",
-    style: "h5",
-    weight: "semibold"
-  }, label), description && /*#__PURE__*/React__default.createElement(Typography, {
-    className: "neeto-ui-text-center neeto-ui-text-gray-400 sidebar-featured-tooltip__description",
-    lineHeight: "normal",
-    style: "body3"
-  }, description));
+  return /*#__PURE__*/jsxs("div", {
+    className: "neeto-ui-flex neeto-ui-flex-col sidebar-featured-tooltip",
+    children: [/*#__PURE__*/jsx(Typography, {
+      className: "neeto-ui-text-center sidebar-featured-tooltip__title",
+      lineHeight: "tight",
+      style: "h5",
+      weight: "semibold",
+      children: label
+    }), description && /*#__PURE__*/jsx(Typography, {
+      className: "neeto-ui-text-center neeto-ui-text-gray-400 sidebar-featured-tooltip__description",
+      lineHeight: "normal",
+      style: "body3",
+      children: description
+    })]
+  });
 };
 
 var TOOLTIP_STYLES$1 = {
-  "default": "default",
   featured: "featured"
 };
 var NavIconWrapper = function NavIconWrapper(_ref) {
@@ -54,110 +61,124 @@ var NavIconWrapper = function NavIconWrapper(_ref) {
     icon = _ref.icon,
     label = _ref.label,
     children = _ref.children;
-  var tooltipContent = tooltipStyle === TOOLTIP_STYLES$1.featured ? /*#__PURE__*/React__default.createElement(FeaturedTooltip, {
+  var tooltipContent = tooltipStyle === TOOLTIP_STYLES$1.featured ? /*#__PURE__*/jsx(FeaturedTooltip, {
     description: description,
     icon: icon,
     label: label
   }) : label;
-  return /*#__PURE__*/React__default.createElement(Tooltip, {
+  return /*#__PURE__*/jsx(Tooltip, {
     content: tooltipContent,
     delay: [400, 40],
     duration: [200, 200],
     position: "right",
     className: classnames({
       "sidebar-featured-tooltip__content": tooltipStyle === TOOLTIP_STYLES$1.featured
-    })
-  }, children);
+    }),
+    children: children
+  });
 };
 
 var AppSwitcher = function AppSwitcher(_ref) {
   var tooltipStyle = _ref.tooltipStyle,
     onAppSwitcherToggle = _ref.onAppSwitcherToggle;
-  return /*#__PURE__*/React__default.createElement(NavIconWrapper, {
+  return /*#__PURE__*/jsx(NavIconWrapper, {
     tooltipStyle: tooltipStyle,
-    icon: /*#__PURE__*/React__default.createElement(AppSwitcher$1, null),
-    label: "Product switcher"
-  }, /*#__PURE__*/React__default.createElement("button", {
-    className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-start neeto-ui-w-full neeto-ui-select-none neeto-ui-sidebar__link neeto-ui-sidebar__link--app-switcher neeto-ui-sidebar__link--button shadow-none",
-    "data-cy": "app-switcher-button",
-    onClick: onAppSwitcherToggle
-  }, /*#__PURE__*/React__default.createElement("span", {
-    className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-sidebar__link-icon"
-  }, /*#__PURE__*/React__default.createElement(AppSwitcher$1, {
-    size: 24
-  }))));
+    icon: /*#__PURE__*/jsx(AppSwitcherIcon, {}),
+    label: "Product switcher",
+    children: /*#__PURE__*/jsx("button", {
+      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-start neeto-ui-w-full neeto-ui-select-none neeto-ui-sidebar__link neeto-ui-sidebar__link--app-switcher neeto-ui-sidebar__link--button shadow-none",
+      "data-cy": "app-switcher-button",
+      onClick: onAppSwitcherToggle,
+      children: /*#__PURE__*/jsx("span", {
+        className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-sidebar__link-icon",
+        children: /*#__PURE__*/jsx(AppSwitcherIcon, {
+          size: 24
+        })
+      })
+    })
+  });
 };
 
 /* eslint-disable react/display-name */
 
 var HelpSection = /*#__PURE__*/forwardRef(function (_, ref) {
-  return /*#__PURE__*/React__default.createElement("button", {
+  return /*#__PURE__*/jsx("button", {
     ref: ref,
     className: "neeto-ui-sidebar__link neeto-ui-sidebar__link--button shadow-none",
-    "data-cy": "help-button"
-  }, /*#__PURE__*/React__default.createElement("span", {
-    className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-sidebar__link-icon"
-  }, /*#__PURE__*/React__default.createElement(Help, {
-    size: 24
-  })));
+    "data-cy": "help-button",
+    children: /*#__PURE__*/jsx("span", {
+      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-sidebar__link-icon",
+      children: /*#__PURE__*/jsx(Help, {
+        size: 24
+      })
+    })
+  });
 });
 HelpSection.displayName = "HelpSection";
 
 var _excluded$2 = ["onClick", "label", "icon"];
+function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var HelpLinkSection = function HelpLinkSection(_ref) {
   var links = _ref.links;
-  return /*#__PURE__*/React__default.createElement("ul", null, links === null || links === void 0 ? void 0 : links.map(function (_ref2, idx) {
-    var _ref2$onClick = _ref2.onClick,
-      onClick = _ref2$onClick === void 0 ? noop : _ref2$onClick,
-      _ref2$label = _ref2.label,
-      label = _ref2$label === void 0 ? "" : _ref2$label,
-      _ref2$icon = _ref2.icon,
-      icon = _ref2$icon === void 0 ? null : _ref2$icon,
-      otherProps = _objectWithoutProperties(_ref2, _excluded$2);
-    var IconSVG = icon;
-    return /*#__PURE__*/React__default.createElement("li", {
-      className: "neeto-ui-help-sublist__item",
-      key: idx
-    }, /*#__PURE__*/React__default.createElement("button", _extends({
-      onClick: onClick,
-      className: "neeto-ui-help-sublist__item-btn"
-    }, otherProps), icon && /*#__PURE__*/React__default.createElement("span", {
-      className: "neeto-ui-help-sublist__item-btn-icon"
-    }, /*#__PURE__*/React__default.createElement(IconSVG, null)), /*#__PURE__*/React__default.createElement(Typography, {
-      className: "neeto-ui-help-sublist__item-btn-label",
-      component: "span",
-      style: "body2",
-      weight: "normal"
-    }, label)));
-  }));
+  return /*#__PURE__*/jsx("ul", {
+    children: links === null || links === void 0 ? void 0 : links.map(function (_ref2, idx) {
+      var _ref2$onClick = _ref2.onClick,
+        onClick = _ref2$onClick === void 0 ? noop : _ref2$onClick,
+        _ref2$label = _ref2.label,
+        label = _ref2$label === void 0 ? "" : _ref2$label,
+        _ref2$icon = _ref2.icon,
+        icon = _ref2$icon === void 0 ? null : _ref2$icon,
+        otherProps = _objectWithoutProperties(_ref2, _excluded$2);
+      var IconSVG = icon;
+      return /*#__PURE__*/jsx("li", {
+        className: "neeto-ui-help-sublist__item",
+        children: /*#__PURE__*/jsxs("button", _objectSpread$3(_objectSpread$3({
+          onClick: onClick,
+          className: "neeto-ui-help-sublist__item-btn"
+        }, otherProps), {}, {
+          children: [icon && /*#__PURE__*/jsx("span", {
+            className: "neeto-ui-help-sublist__item-btn-icon",
+            children: /*#__PURE__*/jsx(IconSVG, {})
+          }), /*#__PURE__*/jsx(Typography, {
+            className: "neeto-ui-help-sublist__item-btn-label",
+            component: "span",
+            style: "body2",
+            weight: "normal",
+            children: label
+          })]
+        }))
+      }, idx);
+    })
+  });
 };
 
-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; }
+function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var HelpSectionTooltip = function HelpSectionTooltip(_ref) {
   var helpSectionProps = _ref.helpSectionProps;
   var documentationProps = helpSectionProps.documentationProps,
     keyboardShortcutProps = helpSectionProps.keyboardShortcutProps,
     liveChatProps = helpSectionProps.liveChatProps,
     changelogProps = helpSectionProps.changelogProps;
-  var helpLinks = [documentationProps && _objectSpread$1(_objectSpread$1({}, documentationProps), {}, {
+  var helpLinks = [documentationProps && _objectSpread$2(_objectSpread$2({}, documentationProps), {}, {
     label: "Documentation",
     icon: Book,
     "data-cy": "help-link-documentation-button"
-  }), keyboardShortcutProps && _objectSpread$1(_objectSpread$1({}, keyboardShortcutProps), {}, {
+  }), keyboardShortcutProps && _objectSpread$2(_objectSpread$2({}, keyboardShortcutProps), {}, {
     label: "Keyboard shortcuts",
     icon: Keyboard,
     "data-cy": "help-link-keyboard-shortcut-button"
-  }), liveChatProps && _objectSpread$1(_objectSpread$1({}, liveChatProps), {}, {
+  }), liveChatProps && _objectSpread$2(_objectSpread$2({}, liveChatProps), {}, {
     label: "Chat with us",
     icon: ChatEmpty,
     "data-cy": "help-link-live-chat-button"
-  }), changelogProps && _objectSpread$1(_objectSpread$1({}, changelogProps), {}, {
+  }), changelogProps && _objectSpread$2(_objectSpread$2({}, changelogProps), {}, {
     label: "What's new?",
     icon: Gift,
     "data-cy": "help-link-changelog-button"
   })].filter(Boolean);
-  return /*#__PURE__*/React__default.createElement(HelpLinkSection, {
+  return /*#__PURE__*/jsx(HelpLinkSection, {
     links: values(helpLinks)
   });
 };
@@ -167,51 +188,57 @@ var ProfileSection = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var profileInfo = _ref.profileInfo,
     onClick = _ref.onClick;
   var dataCy = profileInfo["data-cy"] || "profile-section";
-  return /*#__PURE__*/React__default.createElement("button", {
+  return /*#__PURE__*/jsx("button", {
     onClick: onClick,
     ref: ref,
     className: "neeto-ui-w-full neeto-ui-text-left neeto-ui-sidebar__profile-wrapper",
-    "data-cy": dataCy
-  }, /*#__PURE__*/React__default.createElement("span", {
-    className: "neeto-ui-flex neeto-ui-items-center neeto-ui-flex-shrink-0 neeto-ui-w-full neeto-ui-sidebar__profile"
-  }, /*#__PURE__*/React__default.createElement(Avatar, {
-    className: "neeto-ui-flex-shrink-0",
-    size: "large",
-    user: profileInfo
-  })));
+    "data-cy": dataCy,
+    children: /*#__PURE__*/jsx("span", {
+      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-flex-shrink-0 neeto-ui-w-full neeto-ui-sidebar__profile",
+      children: /*#__PURE__*/jsx(Avatar, {
+        className: "neeto-ui-flex-shrink-0",
+        size: "large",
+        user: profileInfo
+      })
+    })
+  });
 });
 ProfileSection.displayName = "ProfileSection";
 
 var _excluded$1 = ["onClick", "label", "icon"];
-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; }
+function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var LinkSection = function LinkSection(_ref) {
   var links = _ref.links;
-  return /*#__PURE__*/React__default.createElement("ul", {
-    className: "neeto-ui-profile-sublist"
-  }, links === null || links === void 0 ? void 0 : 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$1);
-    var IconSVG = icon;
-    return /*#__PURE__*/React__default.createElement("li", {
-      className: "neeto-ui-profile-sublist__item",
-      key: idx
-    }, /*#__PURE__*/React__default.createElement("button", _extends({}, _objectSpread({
-      onClick: onClick
-    }, otherProps), {
-      className: "neeto-ui-profile-sublist__item-btn"
-    }), icon && /*#__PURE__*/React__default.createElement("span", {
-      className: "neeto-ui-profile-sublist__item-btn-icon"
-    }, /*#__PURE__*/React__default.createElement(IconSVG, null)), /*#__PURE__*/React__default.createElement(Typography, {
-      className: "neeto-ui-profile-sublist__item-btn-label",
-      component: "span",
-      style: "body2",
-      weight: "normal"
-    }, label)));
-  }));
+  return /*#__PURE__*/jsx("ul", {
+    className: "neeto-ui-profile-sublist",
+    children: links === null || links === void 0 ? void 0 : 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$1);
+      var IconSVG = icon;
+      return /*#__PURE__*/jsx("li", {
+        className: "neeto-ui-profile-sublist__item",
+        children: /*#__PURE__*/jsxs("button", _objectSpread$1(_objectSpread$1({}, _objectSpread$1({
+          onClick: onClick
+        }, otherProps)), {}, {
+          className: "neeto-ui-profile-sublist__item-btn",
+          children: [icon && /*#__PURE__*/jsx("span", {
+            className: "neeto-ui-profile-sublist__item-btn-icon",
+            children: /*#__PURE__*/jsx(IconSVG, {})
+          }), /*#__PURE__*/jsx(Typography, {
+            className: "neeto-ui-profile-sublist__item-btn-label",
+            component: "span",
+            style: "body2",
+            weight: "normal",
+            children: label
+          })]
+        }))
+      }, idx);
+    })
+  });
 };
 
 var truncate = function truncate(str, length) {
@@ -225,35 +252,42 @@ var ProfileSectionTooltip = function ProfileSectionTooltip(_ref) {
     topLinks = profileInfo.topLinks,
     bottomLinks = profileInfo.bottomLinks,
     customContent = profileInfo.customContent;
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: "neeto-ui-flex neeto-ui-flex-col neeto-ui-profile-popup"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: classnames("neeto-ui-relative neeto-ui-flex neeto-ui-items-center neeto-ui-p-3")
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "top-0 left-0"
-  }, /*#__PURE__*/React__default.createElement(Avatar, {
-    size: "large",
-    user: profileInfo
-  })), /*#__PURE__*/React__default.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__default.createElement(Typography, {
-    className: "neeto-ui-m-0",
-    component: "h2",
-    lineHeight: "tight",
-    style: "h5",
-    title: name,
-    weight: "semibold"
-  }, truncate(name, 18)), email && /*#__PURE__*/React__default.createElement(Typography, {
-    className: "neeto-ui-w-full neeto-ui-truncate neeto-ui-text-gray-600",
-    lineHeight: "tight",
-    style: "body3"
-  }, email))), /*#__PURE__*/React__default.createElement("div", {
-    className: "neeto-ui-sidebar__profile-wrapper-custom-content"
-  }, customContent), topLinks && /*#__PURE__*/React__default.createElement(LinkSection, {
-    links: topLinks
-  }), bottomLinks && /*#__PURE__*/React__default.createElement(LinkSection, {
-    links: bottomLinks
-  }));
+  return /*#__PURE__*/jsxs("div", {
+    className: "neeto-ui-flex neeto-ui-flex-col neeto-ui-profile-popup",
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classnames("neeto-ui-relative neeto-ui-flex neeto-ui-items-center neeto-ui-p-3"),
+      children: [/*#__PURE__*/jsx("div", {
+        className: "top-0 left-0",
+        children: /*#__PURE__*/jsx(Avatar, {
+          size: "large",
+          user: profileInfo
+        })
+      }), /*#__PURE__*/jsxs("div", {
+        className: "neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-grow neeto-ui-min-w-0 neeto-ui-pl-3",
+        children: [/*#__PURE__*/jsx(Typography, {
+          className: "neeto-ui-m-0",
+          component: "h2",
+          lineHeight: "tight",
+          style: "h5",
+          title: name,
+          weight: "semibold",
+          children: truncate(name, 18)
+        }), email && /*#__PURE__*/jsx(Typography, {
+          className: "neeto-ui-w-full neeto-ui-truncate neeto-ui-text-gray-600",
+          lineHeight: "tight",
+          style: "body3",
+          children: email
+        })]
+      })]
+    }), /*#__PURE__*/jsx("div", {
+      className: "neeto-ui-sidebar__profile-wrapper-custom-content",
+      children: customContent
+    }), topLinks && /*#__PURE__*/jsx(LinkSection, {
+      links: topLinks
+    }), bottomLinks && /*#__PURE__*/jsx(LinkSection, {
+      links: bottomLinks
+    })]
+  });
 };
 
 var Footer = function Footer(_ref) {
@@ -267,89 +301,103 @@ var Footer = function Footer(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     isProfileDropdownOpen = _useState2[0],
     setIsProfileDropdownOpen = _useState2[1];
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: "neeto-ui-sidebar__footer"
-  }, helpLinks && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(Tooltip, {
-    interactive: true,
-    className: "neeto-ui-help-popup-wrapper",
-    content: /*#__PURE__*/React__default.createElement(HelpSectionTooltip, {
-      helpSectionProps: helpLinks
-    }),
-    hideOnClick: false,
-    position: "right",
-    theme: "light"
-  }, /*#__PURE__*/React__default.createElement(HelpSection, null))), showAppSwitcher && /*#__PURE__*/React__default.createElement(AppSwitcher, {
-    onAppSwitcherToggle: onAppSwitcherToggle,
-    tooltipStyle: tooltipStyle
-  }), profileInfo && /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(Tooltip, {
-    interactive: true,
-    className: "neeto-ui-profile-popup-wrapper",
-    content: /*#__PURE__*/React__default.createElement(ProfileSectionTooltip, {
-      profileInfo: profileInfo
-    }),
-    hideOnClick: false,
-    position: "right",
-    theme: "light"
-  }, /*#__PURE__*/React__default.createElement(ProfileSection, {
-    profileInfo: profileInfo,
-    onClick: function onClick() {
-      setIsProfileDropdownOpen(!isProfileDropdownOpen);
-    }
-  }))));
+  return /*#__PURE__*/jsxs("div", {
+    className: "neeto-ui-sidebar__footer",
+    children: [helpLinks && /*#__PURE__*/jsx("div", {
+      children: /*#__PURE__*/jsx(Tooltip, {
+        interactive: true,
+        className: "neeto-ui-help-popup-wrapper",
+        content: /*#__PURE__*/jsx(HelpSectionTooltip, {
+          helpSectionProps: helpLinks
+        }),
+        hideOnClick: false,
+        position: "right",
+        theme: "light",
+        children: /*#__PURE__*/jsx(HelpSection, {})
+      })
+    }), showAppSwitcher && /*#__PURE__*/jsx(AppSwitcher, {
+      onAppSwitcherToggle: onAppSwitcherToggle,
+      tooltipStyle: tooltipStyle
+    }), profileInfo && /*#__PURE__*/jsx("div", {
+      children: /*#__PURE__*/jsx(Tooltip, {
+        interactive: true,
+        className: "neeto-ui-profile-popup-wrapper",
+        content: /*#__PURE__*/jsx(ProfileSectionTooltip, {
+          profileInfo: profileInfo
+        }),
+        hideOnClick: false,
+        position: "right",
+        theme: "light",
+        children: /*#__PURE__*/jsx(ProfileSection, {
+          profileInfo: profileInfo,
+          onClick: function onClick() {
+            setIsProfileDropdownOpen(!isProfileDropdownOpen);
+          }
+        })
+      })
+    })]
+  });
 };
 
 var Header = function Header(_ref) {
   var organizationInfo = _ref.organizationInfo;
   var LogoSVG = organizationInfo === null || organizationInfo === void 0 ? void 0 : organizationInfo.logo;
-  return /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/jsx("div", {
     className: "neeto-ui-flex neeto-ui-items-center neeto-ui-sidebar__header",
-    "data-cy": "sidebar-info"
-  }, /*#__PURE__*/React__default.createElement("div", {
-    className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-flex-shrink-0 neeto-ui-sidebar__logo"
-  }, LogoSVG || /*#__PURE__*/React__default.createElement(Neeto, null)));
+    "data-cy": "sidebar-info",
+    children: /*#__PURE__*/jsx("div", {
+      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-flex-shrink-0 neeto-ui-sidebar__logo",
+      children: LogoSVG || /*#__PURE__*/jsx(Neeto, {})
+    })
+  });
 };
 
 var _excluded = ["label", "to", "icon", "description"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var Links = function Links(_ref) {
   var _ref$navLinks = _ref.navLinks,
     navLinks = _ref$navLinks === void 0 ? [] : _ref$navLinks,
     tooltipStyle = _ref.tooltipStyle;
   var location = useLocation();
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: "neeto-ui-sidebar__links"
-  }, navLinks.map(function (_ref2, mainIndex) {
-    var label = _ref2.label,
-      to = _ref2.to,
-      icon = _ref2.icon,
-      description = _ref2.description,
-      otherProps = _objectWithoutProperties(_ref2, _excluded);
-    var IconSVG = icon;
-    var url = new URL(to, window.location.href);
-    var _isActive = location.pathname.startsWith(url.pathname);
-    return /*#__PURE__*/React__default.createElement(NavIconWrapper, {
-      description: description,
-      label: label,
-      tooltipStyle: tooltipStyle,
-      icon: /*#__PURE__*/React__default.createElement(IconSVG, {
-        color: "#68737D"
-      }),
-      key: mainIndex
-    }, /*#__PURE__*/React__default.createElement(NavLink, _extends({
-      to: to,
-      activeClassName: "active",
-      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-ui-sidebar__link",
-      isActive: function isActive() {
-        return _isActive;
-      }
-    }, otherProps), icon && /*#__PURE__*/React__default.createElement("div", {
-      className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-sidebar__link-icon",
-      "data-testid": label
-    }, /*#__PURE__*/React__default.createElement(IconSVG, null))));
-  }));
+  return /*#__PURE__*/jsx("div", {
+    className: "neeto-ui-sidebar__links",
+    children: navLinks.map(function (_ref2, mainIndex) {
+      var label = _ref2.label,
+        to = _ref2.to,
+        icon = _ref2.icon,
+        description = _ref2.description,
+        otherProps = _objectWithoutProperties(_ref2, _excluded);
+      var IconSVG = icon;
+      var url = new URL(to, window.location.href);
+      var _isActive = location.pathname.startsWith(url.pathname);
+      return /*#__PURE__*/createElement(NavIconWrapper, {
+        description: description,
+        label: label,
+        tooltipStyle: tooltipStyle,
+        icon: /*#__PURE__*/jsx(IconSVG, {
+          color: "#68737D"
+        }),
+        key: mainIndex
+      }, /*#__PURE__*/jsx(NavLink, _objectSpread(_objectSpread({
+        to: to,
+        activeClassName: "active",
+        className: "neeto-ui-flex neeto-ui-items-center neeto-ui-no-underline neeto-ui-select-none neeto-ui-sidebar__link",
+        isActive: function isActive() {
+          return _isActive;
+        }
+      }, otherProps), {}, {
+        children: icon && /*#__PURE__*/jsx("div", {
+          className: "neeto-ui-flex neeto-ui-items-center neeto-ui-justify-center neeto-ui-sidebar__link-icon",
+          "data-testid": label,
+          children: /*#__PURE__*/jsx(IconSVG, {})
+        })
+      })));
+    })
+  });
 };
 
 var TOOLTIP_STYLES = {
-  "default": "default",
   featured: "featured"
 };
 var Sidebar = function Sidebar(_ref) {
@@ -364,22 +412,23 @@ var Sidebar = function Sidebar(_ref) {
     showAppSwitcher = _ref$showAppSwitcher === void 0 ? false : _ref$showAppSwitcher,
     _ref$onAppSwitcherTog = _ref.onAppSwitcherToggle,
     onAppSwitcherToggle = _ref$onAppSwitcherTog === void 0 ? noop : _ref$onAppSwitcherTog;
-  return /*#__PURE__*/React__default.createElement("div", {
+  return /*#__PURE__*/jsxs("div", {
     "data-cy": "sidebar-wrapper",
     "data-testid": "sidebar",
-    className: classnames("neeto-ui-sidebar neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-shrink-0 neeto-ui-overflow-y-auto neeto-ui-overflow-x-hidden", "neeto-ui-sidebar--collapsed")
-  }, /*#__PURE__*/React__default.createElement(Header, {
-    organizationInfo: organizationInfo
-  }), /*#__PURE__*/React__default.createElement(Links, {
-    navLinks: navLinks,
-    tooltipStyle: tooltipStyle
-  }), /*#__PURE__*/React__default.createElement(Footer, {
-    helpLinks: helpLinks,
-    onAppSwitcherToggle: onAppSwitcherToggle,
-    profileInfo: profileInfo,
-    showAppSwitcher: showAppSwitcher,
-    tooltipStyle: tooltipStyle
-  }));
+    className: classnames("neeto-ui-sidebar neeto-ui-flex neeto-ui-flex-col neeto-ui-flex-shrink-0 neeto-ui-overflow-y-auto neeto-ui-overflow-x-hidden", "neeto-ui-sidebar--collapsed"),
+    children: [/*#__PURE__*/jsx(Header, {
+      organizationInfo: organizationInfo
+    }), /*#__PURE__*/jsx(Links, {
+      navLinks: navLinks,
+      tooltipStyle: tooltipStyle
+    }), /*#__PURE__*/jsx(Footer, {
+      helpLinks: helpLinks,
+      onAppSwitcherToggle: onAppSwitcherToggle,
+      profileInfo: profileInfo,
+      showAppSwitcher: showAppSwitcher,
+      tooltipStyle: tooltipStyle
+    })]
+  });
 };
 
 export { Sidebar as default };