import { forwardRef, useState, createElement } from 'react';
import classnames from 'classnames';
import { n as noop } from './index-QWVp_Xt6.js';
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import Tooltip from './Tooltip.js';
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 _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
import Avatar from './Avatar.js';
import { Neeto } from '@bigbinary/neeto-icons/logos';
import { useLocation, NavLink } from 'react-router-dom';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@bigbinary/neeto-cist';
import 'qs';
import './en-Dmu3B4Vs.js';
import './index-DyUNP5G9.js';
import '@babel/runtime/helpers/toConsumableArray';
import 'dayjs';
import 'dayjs/plugin/localeData';
import 'dayjs/plugin/utc';
import 'dayjs/plugin/weekday';
import 'dayjs/plugin/weekOfYear';
import 'i18next';
import '@tippyjs/react';
import 'tippy.js';
import '@bigbinary/neeto-hotkeys';
import './overlayManager.js';
import './usePrefersReducedMotion-n4ZJtExQ.js';
import 'avvvatars-react';

var FeaturedTooltip = function FeaturedTooltip(_ref) {
  var label = _ref.label,
    description = _ref.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 = {
  featured: "featured"
};
var NavIconWrapper = function NavIconWrapper(_ref) {
  var tooltipStyle = _ref.tooltipStyle,
    description = _ref.description,
    icon = _ref.icon,
    label = _ref.label,
    children = _ref.children;
  var tooltipContent = tooltipStyle === TOOLTIP_STYLES$1.featured ? /*#__PURE__*/jsx(FeaturedTooltip, {
    description: description,
    icon: icon,
    label: label
  }) : label;
  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
  });
};

var AppSwitcher = function AppSwitcher(_ref) {
  var tooltipStyle = _ref.tooltipStyle,
    onAppSwitcherToggle = _ref.onAppSwitcherToggle;
  return /*#__PURE__*/jsx(NavIconWrapper, {
    tooltipStyle: tooltipStyle,
    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-testid": "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__*/jsx("button", {
    ref: ref,
    className: "neeto-ui-sidebar__link neeto-ui-sidebar__link--button shadow-none",
    "data-testid": "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__*/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$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$2(_objectSpread$2({}, documentationProps), {}, {
    label: "Documentation",
    icon: Book,
    "data-testid": "help-link-documentation-button"
  }), keyboardShortcutProps && _objectSpread$2(_objectSpread$2({}, keyboardShortcutProps), {}, {
    label: "Keyboard shortcuts",
    icon: Keyboard,
    "data-testid": "help-link-keyboard-shortcut-button"
  }), liveChatProps && _objectSpread$2(_objectSpread$2({}, liveChatProps), {}, {
    label: "Chat with us",
    icon: ChatEmpty,
    "data-testid": "help-link-live-chat-button"
  }), changelogProps && _objectSpread$2(_objectSpread$2({}, changelogProps), {}, {
    label: "What's new?",
    icon: Gift,
    "data-testid": "help-link-changelog-button"
  })].filter(Boolean);
  return /*#__PURE__*/jsx(HelpLinkSection, {
    links: values(helpLinks)
  });
};

/* eslint-disable react/display-name */
var ProfileSection = /*#__PURE__*/forwardRef(function (_ref, ref) {
  var profileInfo = _ref.profileInfo,
    onClick = _ref.onClick;
  var dataTestid = profileInfo["data-testid"] || "profile-section";
  return /*#__PURE__*/jsx("button", {
    onClick: onClick,
    ref: ref,
    className: "neeto-ui-w-full neeto-ui-text-left neeto-ui-sidebar__profile-wrapper",
    "data-testid": dataTestid,
    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$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__*/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) {
  return str && str.length > length ? "".concat(str.substring(0, length - 3), "...") : str;
};

var ProfileSectionTooltip = function ProfileSectionTooltip(_ref) {
  var profileInfo = _ref.profileInfo;
  var name = profileInfo.name,
    email = profileInfo.email,
    topLinks = profileInfo.topLinks,
    bottomLinks = profileInfo.bottomLinks,
    customContent = profileInfo.customContent;
  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) {
  var profileInfo = _ref.profileInfo,
    tooltipStyle = _ref.tooltipStyle,
    _ref$showAppSwitcher = _ref.showAppSwitcher,
    showAppSwitcher = _ref$showAppSwitcher === void 0 ? false : _ref$showAppSwitcher,
    onAppSwitcherToggle = _ref.onAppSwitcherToggle,
    helpLinks = _ref.helpLinks;
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isProfileDropdownOpen = _useState2[0],
    setIsProfileDropdownOpen = _useState2[1];
  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__*/jsx("div", {
    className: "neeto-ui-flex neeto-ui-items-center neeto-ui-sidebar__header",
    "data-testid": "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__*/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 = {
  featured: "featured"
};
var Sidebar = function Sidebar(_ref) {
  var organizationInfo = _ref.organizationInfo,
    _ref$navLinks = _ref.navLinks,
    navLinks = _ref$navLinks === void 0 ? [] : _ref$navLinks,
    _ref$tooltipStyle = _ref.tooltipStyle,
    tooltipStyle = _ref$tooltipStyle === void 0 ? TOOLTIP_STYLES.featured : _ref$tooltipStyle,
    profileInfo = _ref.profileInfo,
    helpLinks = _ref.helpLinks,
    _ref$showAppSwitcher = _ref.showAppSwitcher,
    showAppSwitcher = _ref$showAppSwitcher === void 0 ? false : _ref$showAppSwitcher,
    _ref$onAppSwitcherTog = _ref.onAppSwitcherToggle,
    onAppSwitcherToggle = _ref$onAppSwitcherTog === void 0 ? noop : _ref$onAppSwitcherTog;
  return /*#__PURE__*/jsxs("div", {
    "data-testid": "sidebar-wrapper",
    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 };
//# sourceMappingURL=Sidebar.js.map
