@bigbinary/neeto-molecules 1.1.78 → 1.2.0-beta2

package/dist/FloatingActionMenu.js

@@ -0,0 +1,646 @@
+import _extends from '@babel/runtime/helpers/extends';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import React__default, { useState, useEffect, forwardRef } from 'react';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { isNotPresent, isPresent, truncate, noop } from '@bigbinary/neeto-cist';
+import useFetchNeetoApps from '@bigbinary/neeto-commons-frontend/react-utils/useFetchNeetoApps';
+import { Profile } from '@bigbinary/neeto-team-members-frontend';
+import { Typography, Input, Modal as Modal$1, Dropdown as Dropdown$1, Spinner, Avatar } from '@bigbinary/neetoui';
+import KeyboardShortcuts from './KeyboardShortcuts.js';
+import { withT } from '@bigbinary/neeto-commons-frontend/react-utils';
+import classnames from 'classnames';
+import { NeetoIcon, Search, Book, Help, Right, Check } from '@bigbinary/neeto-icons';
+import { useTranslation } from 'react-i18next';
+import { n } from './inject-css-c86de496.js';
+import * as AppIcons from '@bigbinary/neeto-icons/app-icons';
+import { toLower, omit, mergeDeepLeft } from 'ramda';
+import { t } from 'i18next';
+import useBreakpoints from '@bigbinary/neeto-commons-frontend/react-utils/useBreakpoints';
+import useLocalStorage from '@bigbinary/neeto-commons-frontend/react-utils/useLocalStorage';
+import { getFromLocalStorage } from '@bigbinary/neeto-commons-frontend/utils';
+import { resetAuthTokens } from '@bigbinary/neeto-commons-frontend/utils/axios';
+import { removeFromLocalStorage } from '@bigbinary/neeto-commons-frontend/utils/general';
+import 'zustand/shallow';
+import '@bigbinary/neeto-commons-frontend/react-utils/withImmutableActions';
+import 'zustand';
+import '@bigbinary/neetoui/managers';
+import '@bigbinary/neeto-hotkeys';
+import 'platform';
+
+var css$1 = ".neeto-molecules-product-switcher__wrapper{align-items:flex-start;background-color:rgb(var(--neeto-ui-white));display:flex;flex-direction:column;justify-content:flex-start;max-width:100%;overflow-y:auto;padding:40px;position:relative;transition:all .3s;width:100%}@media only screen and (max-width:992px){.neeto-molecules-product-switcher__wrapper{padding:32px}}@media screen and (max-width:768px){.neeto-molecules-product-switcher__wrapper{padding:16px}}.neeto-molecules-product-switcher__grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(288px,1fr))}@media only screen and (max-width:992px){.neeto-molecules-product-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(248px,1fr))}}@media only screen and (max-width:640px){.neeto-molecules-product-switcher__grid{grid-template-columns:repeat(auto-fill,minmax(100%,1fr))}}.neeto-molecules-product-switcher__header{align-items:center;display:flex;gap:32px;justify-content:space-between;margin-bottom:32px;position:relative;width:100%}@media only screen and (max-width:768px){.neeto-molecules-product-switcher__header{align-items:flex-start;flex-direction:column;gap:24px}}@media only screen and (max-width:640px){.neeto-molecules-product-switcher__header h1{font-size:24px}}@media only screen and (max-width:768px){.neeto-molecules-product-switcher_modal-container .neeto-molecules-product-switcher__header-mobile{align-items:flex-start;margin-bottom:24px}}.neeto-molecules-product-switcher__close-btn{position:absolute;right:12px;top:12px}.neeto-molecules-product-switcher__search-wrapper{flex-grow:1}@media only screen and (min-width:992px){.neeto-molecules-product-switcher__search-wrapper{flex-grow:0;width:296px}}.neeto-molecules-product-switcher__body{display:flex;flex-direction:column;font-size:var(--neeto-ui-text-sm);gap:12px;margin-bottom:24px;width:100%}.neeto-molecules-product-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-product-switcher-link:focus,.neeto-molecules-product-switcher-link:focus-visible{outline:none}.neeto-molecules-product-switcher-link:focus-visible{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-product-switcher-link:not(.neeto-molecules-product-switcher-link--active):hover{background-color:rgb(var(--neeto-ui-gray-200))}.neeto-molecules-product-switcher-link--active{background:rgb(var(--neeto-ui-primary-100));border-color:rgb(var(--neeto-ui-primary-600))}.neeto-molecules-product-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-product-switcher-link__content{flex-grow:1}.neeto-molecules-product-switcher-link__content span{display:block}.neeto-molecules-product-switcher_modal{z-index:100000}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen{display:flex;flex-direction:column;height:100dvh!important;width:100vw!important}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__header{flex-shrink:0}.neeto-molecules-product-switcher_modal .neeto-ui-modal__wrapper--fullscreen .neeto-ui-modal__body{flex-grow:1;min-height:0;overflow-y:auto}";
+n(css$1,{});
+
+var ProductLink = function ProductLink(_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__default.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-product-switcher-link", {
+      "neeto-molecules-product-switcher-link--active": globalProps.appName.includes(name)
+    })
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames("neeto-molecules-product-switcher-link__icon-holder", {
+      "neeto-ui-bg-primary-500": !AppIcon
+    })
+  }, AppIcon ? /*#__PURE__*/React__default.createElement(AppIcon, {
+    size: 42
+  }) : /*#__PURE__*/React__default.createElement(NeetoIcon, {
+    color: "white",
+    size: 42
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-molecules-product-switcher-link__content"
+  }, /*#__PURE__*/React__default.createElement(Typography, {
+    component: "span",
+    lineHeight: "relaxed",
+    style: "h4",
+    weight: "medium"
+  }, name), /*#__PURE__*/React__default.createElement(Typography, {
+    component: "span",
+    style: "body3",
+    weight: "normal"
+  }, description)));
+};
+var ProductLink$1 = /*#__PURE__*/React__default.memo(ProductLink);
+
+var Menu$1 = function Menu(_ref) {
+  var _ref$isMobile = _ref.isMobile,
+    isMobile = _ref$isMobile === void 0 ? false : _ref$isMobile;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(""),
+    _useState2 = _slicedToArray(_useState, 2),
+    searchTerm = _useState2[0],
+    setSearchTerm = _useState2[1];
+  var _useFetchNeetoApps = useFetchNeetoApps({
+      enabled: false
+    }),
+    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__default.createElement("div", {
+    className: "neeto-molecules-product-switcher__wrapper",
+    "data-cy": "switcher-wrapper",
+    "data-testid": "switcher-wrapper",
+    key: "switcher-wrapper"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    "data-cy": "product-switcher-body-wrapper",
+    className: classnames("neeto-molecules-product-switcher__header", {
+      "neeto-molecules-product-switcher__header-mobile": isMobile
+    })
+  }, !isMobile && /*#__PURE__*/React__default.createElement(Typography, {
+    style: "h1"
+  }, t("neetoMolecules.productSwitcher.chooseNeetoProduct")), /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-molecules-product-switcher__search-wrapper"
+  }, /*#__PURE__*/React__default.createElement(Input, {
+    autoFocus: true,
+    "data-cy": "product-switcher-search-input",
+    placeholder: t("neetoMolecules.productSwitcher.searchProducts"),
+    prefix: /*#__PURE__*/React__default.createElement(Search, null),
+    type: "search",
+    value: searchTerm,
+    onChange: handleSearch
+  }))), /*#__PURE__*/React__default.createElement("div", {
+    className: classnames("neeto-molecules-product-switcher__body", _defineProperty({}, "neeto-molecules-product-switcher__body-mobile", isMobile))
+  }, (filteredApps === null || filteredApps === void 0 ? void 0 : filteredApps.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-molecules-product-switcher__grid"
+  }, filteredApps.map(function (app) {
+    return /*#__PURE__*/React__default.createElement(ProductLink$1, _extends({
+      key: app.name
+    }, app));
+  })) : /*#__PURE__*/React__default.createElement(Typography, {
+    className: "neeto-ui-text-center",
+    style: "body1"
+  }, t("neetoMolecules.productSwitcher.noApps"))));
+};
+
+var Modal = withT(function (_ref) {
+  var t = _ref.t,
+    isOpen = _ref.isOpen,
+    onClose = _ref.onClose;
+  return /*#__PURE__*/React__default.createElement(Modal$1, {
+    isOpen: isOpen,
+    onClose: onClose,
+    backdropClassName: "neeto-molecules-product-switcher_modal",
+    size: "fullScreen"
+  }, /*#__PURE__*/React__default.createElement(Modal$1.Header, null, /*#__PURE__*/React__default.createElement(Typography, {
+    className: "pr-4",
+    style: "h2"
+  }, t("neetoMolecules.productSwitcher.chooseNeetoProduct"))), /*#__PURE__*/React__default.createElement(Modal$1.Body, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-molecules-product-switcher_modal-container",
+    "data-testid": "product-switcher-modal"
+  }, /*#__PURE__*/React__default.createElement(Menu$1, {
+    isMobile: true
+  }))));
+});
+
+var shouldShowWhatsNew = function shouldShowWhatsNew() {
+  var _window$globalProps, _window$globalProps$u;
+  var currentUserEmail = (_window$globalProps = window.globalProps) === null || _window$globalProps === void 0 ? void 0 : (_window$globalProps$u = _window$globalProps.user) === null || _window$globalProps$u === void 0 ? void 0 : _window$globalProps$u.email;
+  return window.location.hostname === "localhost" || currentUserEmail === "oliver@example.com" || (currentUserEmail === null || currentUserEmail === void 0 ? void 0 : currentUserEmail.endsWith("@bigbinary.com"));
+};
+var MY_ORGANIZATION_URL = "/auth/organization/edit";
+var CHANGELOG_WIDGET_TRIGGER_ID = "neetochangelog-trigger";
+var MENU_ITEMS_WITH_ICONS = ["Chat with support", "Help articles"];
+var DEFAULT_HELP_LINK_PROPS = {
+  helpCenterProps: {
+    label: t("neetoMolecules.sidebar.helpLinks.helpArticles"),
+    icon: Book,
+    "data-cy": "help-link-help-center-button",
+    "data-btn-weight": "bold",
+    href: "https://help.".concat(toLower(globalProps.appName), ".com/"),
+    target: "_blank"
+  },
+  liveChatProps: {
+    label: t("neetoMolecules.sidebar.helpLinks.liveChat"),
+    icon: Help,
+    "data-cy": "help-link-live-chat-button",
+    "data-btn-weight": "bold",
+    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();
+    }
+  }
+};
+var DEFAULT_MENU_LINK_PROPS = {
+  changelogProps: {
+    id: CHANGELOG_WIDGET_TRIGGER_ID,
+    label: t("neetoMolecules.sidebar.helpLinks.whatsNew"),
+    "data-cy": "help-link-changelog-button",
+    isVisible: shouldShowWhatsNew
+  },
+  keyboardShortcutProps: {
+    label: t("neetoMolecules.sidebar.helpLinks.keyboardShortcuts"),
+    "data-cy": "help-link-keyboard-shortcut-button"
+  }
+};
+var NON_BUTTON_PROPS = ["isVisible"];
+
+// Theme switcher
+var APP_THEME_LOCALSTORAGE_KEY = "appTheme";
+var THEMES = {
+  LIGHT: "neeto-ui-theme--light",
+  DARK: "neeto-ui-theme--dark"
+};
+
+var _excluded$2 = ["label", "icon", "changesCount"];
+var LinkSection = function LinkSection(_ref) {
+  var links = _ref.links;
+  var MenuItem = Dropdown$1.MenuItem;
+  if (isNotPresent(links)) return null;
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, links.map(function (_ref2, idx) {
+    var label = _ref2.label,
+      Icon = _ref2.icon,
+      changesCount = _ref2.changesCount,
+      otherProps = _objectWithoutProperties(_ref2, _excluded$2);
+    return /*#__PURE__*/React__default.createElement(MenuItem.Button, _extends({
+      className: "neeto-molecules-menu-sublist__item-btn",
+      "data-cy": "floating-action-menu-link-section",
+      key: idx,
+      style: "text",
+      prefix: MENU_ITEMS_WITH_ICONS.includes(label) ? /*#__PURE__*/React__default.createElement(Icon, {
+        size: 18
+      }) : undefined
+    }, omit(NON_BUTTON_PROPS, otherProps)), label, isPresent(changesCount) && /*#__PURE__*/React__default.createElement("span", {
+      className: "neeto-molecules-menu-list__item-btn-count",
+      "data-cy": "help-section-menu-changes-count",
+      "data-testid": "help-section-menu-changes-count"
+    }, changesCount));
+  }));
+};
+
+var _excluded$1 = ["isLoading", "onMouseEnter"];
+var MenuButton$1 = function MenuButton(_ref) {
+  var isLoading = _ref.isLoading,
+    onMouseEnter = _ref.onMouseEnter,
+    otherProps = _objectWithoutProperties(_ref, _excluded$1);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var MenuItem = Dropdown$1.MenuItem;
+  return /*#__PURE__*/React__default.createElement(MenuItem.Button, _extends({
+    onMouseEnter: onMouseEnter,
+    className: "neeto-molecules-menu-sublist__item-btn",
+    "data-cy": "product-switcher-button",
+    "data-testid": "product-switcher-button",
+    label: t("neetoMolecules.sidebar.productSwitcher"),
+    style: "text",
+    suffix: isLoading ? /*#__PURE__*/React__default.createElement(Spinner, null) : /*#__PURE__*/React__default.createElement(Right, {
+      size: 18
+    })
+  }, otherProps), t("neetoMolecules.sidebar.productSwitcher"));
+};
+
+var Dropdown = function Dropdown() {
+  var Menu = Dropdown$1.Menu,
+    MenuItem = Dropdown$1.MenuItem;
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    data = _useFetchNeetoApps.data,
+    isLoading = _useFetchNeetoApps.isLoading,
+    isStale = _useFetchNeetoApps.isStale,
+    refetchNeetoApps = _useFetchNeetoApps.refetch;
+  var onMouseEnter = function onMouseEnter() {
+    if (!isStale) return;
+    refetchNeetoApps();
+  };
+  return /*#__PURE__*/React__default.createElement(Dropdown$1, {
+    className: "neeto-molecules-product-switcher-menu-popup-wrapper",
+    closeOnSelect: false,
+    customTarget: /*#__PURE__*/React__default.createElement(MenuButton$1, {
+      isLoading: isLoading,
+      onMouseEnter: onMouseEnter
+    }),
+    disabled: !data || isLoading,
+    interactiveDebounce: 30,
+    isOpen: !data ? false : undefined,
+    offset: [0, 5],
+    position: "right",
+    trigger: "all",
+    zIndex: 99999,
+    dropdownProps: {
+      classNames: "neeto-molecules-product-switcher-menu-popup__dropdown"
+    }
+  }, /*#__PURE__*/React__default.createElement(Menu, null, /*#__PURE__*/React__default.createElement(MenuItem, null, /*#__PURE__*/React__default.createElement(Menu$1, null))));
+};
+
+var ProductSwitcher = function ProductSwitcher(_ref) {
+  var toggleModal = _ref.toggleModal;
+  var _useBreakpoints = useBreakpoints(),
+    isSize = _useBreakpoints.isSize;
+  var isMobile = isSize("mobile");
+  return isMobile ? /*#__PURE__*/React__default.createElement(MenuButton$1, {
+    onClick: function onClick() {
+      return toggleModal(true);
+    }
+  }) : /*#__PURE__*/React__default.createElement(Dropdown, null);
+};
+
+var ProfileHeader = function ProfileHeader(_ref) {
+  var profileInfo = _ref.profileInfo;
+  var name = profileInfo.name,
+    email = profileInfo.email;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "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",
+    "data-cy": "floating-action-menu-profile-header"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "left-0 top-0"
+  }, /*#__PURE__*/React__default.createElement(Avatar, {
+    "data-cy": "floating-action-menu-header-profile-icon",
+    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",
+    "data-cy": "floating-action-menu-header-user-name",
+    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-700",
+    "data-cy": "floating-action-menu-header-user-email",
+    lineHeight: "tight",
+    style: "body3"
+  }, email)));
+};
+
+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 getDefaultTopLinks = function getDefaultTopLinks(isOwner, setIsProfilePaneOpen) {
+  return [{
+    label: t("neetoMolecules.sidebar.myProfile"),
+    onClick: function onClick() {
+      return setIsProfilePaneOpen(true);
+    },
+    "data-cy": "my-profile-button",
+    "data-testid": "my-profile-button"
+  }, isOwner && {
+    label: t("neetoMolecules.sidebar.myWorkspace"),
+    onClick: function onClick() {
+      return window.open(MY_ORGANIZATION_URL, "_self");
+    },
+    "data-cy": "profile-organization-settings-button"
+  }].filter(Boolean);
+};
+var getDefaultBottomLinks = function getDefaultBottomLinks() {
+  return [{
+    label: t("neetoMolecules.sidebar.logout"),
+    onClick: function onClick() {
+      resetAuthTokens();
+      removeFromLocalStorage(getSidebarStateLocalStorageKey());
+      // eslint-disable-next-line xss/no-location-href-assign
+      window.location.href = "/logout";
+    },
+    "data-cy": "profile-logout-button"
+  }];
+};
+var getProfileInfo = function getProfileInfo(profileInfoOverrides) {
+  var _globalProps$user3, _globalProps$user4, _globalProps$user5, _globalProps$user6, _globalProps$user7;
+  return mergeDeepLeft(profileInfoOverrides, {
+    name: "".concat((_globalProps$user3 = globalProps.user) === null || _globalProps$user3 === void 0 ? void 0 : _globalProps$user3.firstName, " ").concat((_globalProps$user4 = globalProps.user) === null || _globalProps$user4 === void 0 ? void 0 : _globalProps$user4.lastName),
+    imageUrl: (_globalProps$user5 = globalProps.user) === null || _globalProps$user5 === void 0 ? void 0 : _globalProps$user5.profileImageUrl,
+    email: ((_globalProps$user6 = globalProps.user) === null || _globalProps$user6 === void 0 ? void 0 : _globalProps$user6.email) || ((_globalProps$user7 = globalProps.user) === null || _globalProps$user7 === void 0 ? void 0 : _globalProps$user7.phoneNumber)
+  });
+};
+
+// Theme switcher utils.
+var setDarkTheme = function setDarkTheme() {
+  document.body.classList.remove(THEMES.LIGHT);
+  document.body.classList.add(THEMES.DARK);
+};
+var setLightTheme = function setLightTheme() {
+  document.body.classList.remove(THEMES.DARK);
+  document.body.classList.add(THEMES.LIGHT);
+};
+var setAppTheme = function setAppTheme() {
+  var isDarkTheme = getFromLocalStorage(APP_THEME_LOCALSTORAGE_KEY) === THEMES.DARK;
+  isDarkTheme ? setDarkTheme() : setLightTheme();
+};
+
+var MenuItem$1 = Dropdown$1.MenuItem;
+var MenuButton = withT(function (_ref) {
+  var t = _ref.t,
+    selectedThemeName = _ref.selectedThemeName;
+  return /*#__PURE__*/React__default.createElement(MenuItem$1.Button, {
+    className: "neeto-molecules-menu-sublist__item-btn",
+    "data-cy": "theme-switcher-button",
+    "data-testid": "theme-switcher-button",
+    style: "text",
+    suffix: /*#__PURE__*/React__default.createElement(Right, {
+      size: 18
+    })
+  }, t("neetoMolecules.sidebar.themeSwitcher.label", {
+    selectedTheme: selectedThemeName
+  }));
+});
+
+var Menu = Dropdown$1.Menu,
+  MenuItem = Dropdown$1.MenuItem;
+var ThemeSwitcher = function ThemeSwitcher() {
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useBreakpoints = useBreakpoints(),
+    isSize = _useBreakpoints.isSize;
+  var _useLocalStorage = useLocalStorage(APP_THEME_LOCALSTORAGE_KEY, THEMES.LIGHT),
+    _useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
+    appTheme = _useLocalStorage2[0],
+    setAppTheme = _useLocalStorage2[1];
+  var isDarkThemeSelected = appTheme === THEMES.DARK;
+  var selectedThemeName = isDarkThemeSelected ? t("neetoMolecules.sidebar.themeSwitcher.dark") : t("neetoMolecules.sidebar.themeSwitcher.light");
+  var isMobile = isSize("mobile");
+  var switchTheme = function switchTheme(theme) {
+    theme === THEMES.LIGHT ? setLightTheme() : setDarkTheme();
+    setAppTheme(theme);
+  };
+  return /*#__PURE__*/React__default.createElement(Dropdown$1, {
+    className: "neeto-molecules-theme-switcher-menu-popup-wrapper",
+    closeOnSelect: false,
+    customTarget: /*#__PURE__*/React__default.createElement(MenuButton, {
+      selectedThemeName: selectedThemeName
+    }),
+    interactiveDebounce: 30,
+    offset: [0, 5],
+    position: isMobile ? "bottom" : "right",
+    trigger: "all",
+    zIndex: 99999
+  }, /*#__PURE__*/React__default.createElement(Menu, null, /*#__PURE__*/React__default.createElement(MenuItem.Button, {
+    suffix: !isDarkThemeSelected && /*#__PURE__*/React__default.createElement(Check, {
+      size: 18
+    }),
+    className: classnames({
+      "neeto-molecules-theme-switcher-active-button": !isDarkThemeSelected
+    }),
+    onClick: function onClick() {
+      return switchTheme(THEMES.LIGHT);
+    }
+  }, t("neetoMolecules.sidebar.themeSwitcher.light")), /*#__PURE__*/React__default.createElement(MenuItem.Button, {
+    suffix: isDarkThemeSelected && /*#__PURE__*/React__default.createElement(Check, {
+      size: 18
+    }),
+    className: classnames({
+      "neeto-molecules-theme-switcher-active-button": isDarkThemeSelected
+    }),
+    onClick: function onClick() {
+      return switchTheme(THEMES.DARK);
+    }
+  }, t("neetoMolecules.sidebar.themeSwitcher.dark"))));
+};
+
+var ProfileMenu = function ProfileMenu(_ref) {
+  var profileInfo = _ref.profileInfo,
+    showProductSwitcher = _ref.showProductSwitcher,
+    helpLinks = _ref.helpLinks,
+    defaultLinks = _ref.defaultLinks,
+    topLinks = _ref.topLinks,
+    bottomLinks = _ref.bottomLinks,
+    customContent = _ref.customContent,
+    toggleModal = _ref.toggleModal,
+    isThemeSwitcherEnabled = _ref.isThemeSwitcherEnabled;
+  var Menu = Dropdown$1.Menu,
+    MenuItem = Dropdown$1.MenuItem,
+    Divider = Dropdown$1.Divider;
+  return /*#__PURE__*/React__default.createElement(Menu, {
+    className: "pb-1"
+  }, /*#__PURE__*/React__default.createElement(MenuItem, {
+    className: "neeto-molecules-profile-popup mb-1",
+    "data-cy": "profile-popup",
+    "data-testid": "profile-popup"
+  }, /*#__PURE__*/React__default.createElement(ProfileHeader, {
+    profileInfo: profileInfo
+  })), showProductSwitcher && /*#__PURE__*/React__default.createElement(ProductSwitcher, {
+    toggleModal: toggleModal
+  }), isThemeSwitcherEnabled && /*#__PURE__*/React__default.createElement(ThemeSwitcher, null), /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(LinkSection, {
+    links: topLinks
+  }), isPresent(customContent) && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(MenuItem, {
+    className: "neeto-molecules-floating-action-button__profile-wrapper-custom-content"
+  }, customContent)), /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(LinkSection, {
+    links: defaultLinks
+  }), /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(LinkSection, {
+    links: helpLinks
+  }), /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(LinkSection, {
+    links: bottomLinks
+  }));
+};
+
+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), !0).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 ProfileButton = function ProfileButton(_ref) {
+  var helpLinkOverrides = _ref.helpLinkOverrides,
+    profileInfoOverrides = _ref.profileInfoOverrides,
+    showProductSwitcher = _ref.showProductSwitcher,
+    bottomLinks = _ref.bottomLinks,
+    topLinks = _ref.topLinks,
+    customContent = _ref.customContent,
+    isThemeSwitcherEnabled = _ref.isThemeSwitcherEnabled;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isModalOpen = _useState2[0],
+    setIsModalOpen = _useState2[1];
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    changesCount = _useState4[0],
+    setChangesCount = _useState4[1];
+  var _KeyboardShortcuts$us = KeyboardShortcuts.usePaneState(),
+    _KeyboardShortcuts$us2 = _slicedToArray(_KeyboardShortcuts$us, 2),
+    setIsOpen = _KeyboardShortcuts$us2[1];
+  var _Profile$usePaneState = Profile.usePaneState(),
+    _Profile$usePaneState2 = _slicedToArray(_Profile$usePaneState, 2),
+    setIsProfilePaneOpen = _Profile$usePaneState2[1];
+  var _useFetchNeetoApps = useFetchNeetoApps(),
+    data = _useFetchNeetoApps.data,
+    refetch = _useFetchNeetoApps.refetch,
+    isStale = _useFetchNeetoApps.isStale;
+  var profileInfo = getProfileInfo(profileInfoOverrides);
+  useEffect(function () {
+    var Nv = {
+      onReceiveData: function onReceiveData(data) {
+        if (!data.unreadCount) return;
+        setChangesCount(data.unreadCount);
+      },
+      onShow: function onShow() {
+        setChangesCount(null);
+      }
+    };
+    window.Nv = window.Nv ? Object.assign(window.Nv, Nv) : Nv;
+  }, []);
+  useEffect(function () {
+    if (!isStale) return;
+    refetch();
+  }, [isStale]);
+  var newTopLinks = globalProps.appName !== "neetoAuth" ? [].concat(_toConsumableArray(getDefaultTopLinks(data === null || data === void 0 ? void 0 : data.isOwner, setIsProfilePaneOpen)), _toConsumableArray(topLinks)) : topLinks;
+  var newBottomLinks = [].concat(_toConsumableArray(getDefaultBottomLinks()), _toConsumableArray(bottomLinks));
+  var helpLinks = Object.keys(DEFAULT_HELP_LINK_PROPS).map(function (key) {
+    return _objectSpread({}, DEFAULT_HELP_LINK_PROPS[key]);
+  }).filter(function (_ref2) {
+    var hide = _ref2.hide;
+    return !hide;
+  });
+  var defaultLinks = Object.keys(DEFAULT_MENU_LINK_PROPS).filter(function (key) {
+    var _DEFAULT_MENU_LINK_PR, _DEFAULT_MENU_LINK_PR2, _DEFAULT_MENU_LINK_PR3;
+    return (_DEFAULT_MENU_LINK_PR = (_DEFAULT_MENU_LINK_PR2 = (_DEFAULT_MENU_LINK_PR3 = DEFAULT_MENU_LINK_PROPS[key]).isVisible) === null || _DEFAULT_MENU_LINK_PR2 === void 0 ? void 0 : _DEFAULT_MENU_LINK_PR2.call(_DEFAULT_MENU_LINK_PR3)) !== null && _DEFAULT_MENU_LINK_PR !== void 0 ? _DEFAULT_MENU_LINK_PR : true;
+  }).map(function (key) {
+    return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, DEFAULT_MENU_LINK_PROPS[key]), helpLinkOverrides[key]), key === "keyboardShortcutProps" && {
+      onClick: function onClick() {
+        return setIsOpen(function (prev) {
+          return !prev;
+        });
+      }
+    }), key === "changelogProps" && changesCount && {
+      changesCount: changesCount
+    });
+  }).filter(function (_ref3) {
+    var hide = _ref3.hide;
+    return !hide;
+  });
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Profile.Pane, null), /*#__PURE__*/React__default.createElement(Dropdown$1, {
+    isMultiLevel: true,
+    appendTo: function appendTo() {
+      return document.body;
+    },
+    buttonStyle: "link",
+    closeOnSelect: false,
+    "data-cy": "floating-action-button",
+    "data-testid": "floating-action-button",
+    icon: noop,
+    interactiveDebounce: 30,
+    offset: [15, 10],
+    position: "right-end",
+    strategy: "fixed",
+    theme: "light",
+    trigger: "all",
+    zIndex: 99999,
+    customTarget: /*#__PURE__*/React__default.createElement("button", {
+      className: "neeto-molecules-floating-action-button",
+      type: "button"
+    }, /*#__PURE__*/React__default.createElement(Avatar, {
+      className: "neeto-ui-flex-shrink-0 neeto-molecules-floating-action-button__profile-avatar",
+      "data-cy": "profile-avatar",
+      "data-testid": "profile-avatar",
+      size: "medium",
+      user: profileInfo
+    })),
+    dropdownProps: {
+      classNames: "neeto-molecules-floating-action-button__dropdown"
+    }
+  }, /*#__PURE__*/React__default.createElement(ProfileMenu, {
+    customContent: customContent,
+    defaultLinks: defaultLinks,
+    helpLinks: helpLinks,
+    isThemeSwitcherEnabled: isThemeSwitcherEnabled,
+    profileInfo: profileInfo,
+    showProductSwitcher: showProductSwitcher,
+    bottomLinks: newBottomLinks,
+    toggleModal: setIsModalOpen,
+    topLinks: newTopLinks
+  })), isPresent(changesCount) && /*#__PURE__*/React__default.createElement("span", {
+    className: "neeto-molecules-menu__notif-count",
+    "data-cy": "help-icon-changes-count",
+    "data-testid": "help-icon-changes-count"
+  }, changesCount), /*#__PURE__*/React__default.createElement(Modal, {
+    isOpen: isModalOpen,
+    onClose: function onClose() {
+      return setIsModalOpen(false);
+    }
+  }));
+};
+
+var css = ":root{--neeto-molecules-floating-menu-z-index:99999}.neeto-molecules-floating-action-menu__container{background-color:rgb(var(--neeto-ui-white));border-bottom-right-radius:30px;border-top-right-radius:30px;bottom:16px;left:0;position:fixed;z-index:99999;z-index:var(--neeto-molecules-floating-menu-z-index)}.neeto-molecules-floating-action-button{align-items:center;background-color:rgba(var(--neeto-ui-primary-500),.6);border-bottom-right-radius:30px;border-color:rgba(var(--neeto-ui-primary-500),.6);border-top-right-radius:30px;display:flex;justify-content:center;padding:4px}.neeto-molecules-floating-action-button__profile-avatar{border:2px solid #fff;border-radius:100px}.neeto-molecules-floating-action-button__profile-avatar .neeto-ui-avatar{height:100%!important;width:100%!important}.neeto-molecules-floating-action-button__dropdown{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;flex-shrink:0;max-height:none!important;max-width:none;width:256px;z-index:99999;z-index:var(--neeto-molecules-floating-menu-z-index)}.neeto-molecules-floating-action-button__dropdown ul{padding-top:0!important}.neeto-molecules-product-switcher-menu-popup__dropdown{max-height:none!important;max-width:none}.neeto-molecules-menu__notif-count{position:absolute;right:3px;top:3px;z-index:1}.neeto-molecules-menu-list__item-btn-count,.neeto-molecules-menu__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:flex;flex-shrink:0;font-size:var(--neeto-ui-text-xxs);height:15px;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:15px}.neeto-ui-dropdown__popup .neeto-molecules-product-switcher-menu-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-ui-dropdown__popup .neeto-molecules-product-switcher-menu-popup-wrapper .tippy-content{padding:0}.neeto-ui-dropdown__popup .neeto-molecules-product-switcher-menu-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-menu-sublist__item-btn{font-weight:500!important;height:40px}.neeto-molecules-menu-sublist__item-btn[data-btn-weight=bold]{font-weight:700!important}.neeto-molecules-menu-sublist__item-btn.active{background-color:rgb(var(--neeto-ui-gray-800));color:rgb(var(--neeto-ui-white))}.neeto-molecules-menu-sublist__item-btn-icon svg path{vector-effect:non-scaling-stroke}.neeto-molecules-menu-sublist__item-btn span{align-items:center;display:flex;gap:8px}.neeto-molecules-product-switcher-menu-popup-wrapper{height:95vh;overflow-y:auto;width:calc(100vw - 400px)}.neeto-molecules-floating-action-button__profile-wrapper-custom-content:hover{background-color:rgb(var(--neeto-ui-white))!important}.neeto-molecules-theme-switcher-menu-popup-wrapper .neeto-ui-dropdown__popup-menu{padding-top:4px!important}.neeto-molecules-theme-switcher-active-button{color:rgb(var(--neeto-ui-primary-600))!important}";
+n(css,{});
+
+var _excluded = ["profileInfoOverrides", "helpLinkOverrides", "topLinks", "bottomLinks", "showProductSwitcher", "isThemeSwitcherEnabled", "customContent"];
+var FloatingActionMenu = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$profileInfoOverr = _ref.profileInfoOverrides,
+    profileInfoOverrides = _ref$profileInfoOverr === void 0 ? {} : _ref$profileInfoOverr,
+    _ref$helpLinkOverride = _ref.helpLinkOverrides,
+    helpLinkOverrides = _ref$helpLinkOverride === void 0 ? {} : _ref$helpLinkOverride,
+    _ref$topLinks = _ref.topLinks,
+    topLinks = _ref$topLinks === void 0 ? [] : _ref$topLinks,
+    _ref$bottomLinks = _ref.bottomLinks,
+    bottomLinks = _ref$bottomLinks === void 0 ? [] : _ref$bottomLinks,
+    _ref$showProductSwitc = _ref.showProductSwitcher,
+    showProductSwitcher = _ref$showProductSwitc === void 0 ? true : _ref$showProductSwitc,
+    _ref$isThemeSwitcherE = _ref.isThemeSwitcherEnabled,
+    isThemeSwitcherEnabled = _ref$isThemeSwitcherE === void 0 ? false : _ref$isThemeSwitcherE,
+    customContent = _ref.customContent,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  useEffect(function () {
+    isThemeSwitcherEnabled && setAppTheme();
+  }, []);
+  return /*#__PURE__*/React__default.createElement("div", _extends({
+    ref: ref,
+    className: "neeto-molecules-floating-action-menu__container",
+    "data-cy": "floating-action-menu-container",
+    "data-testid": "floating-action-menu-container"
+  }, otherProps), /*#__PURE__*/React__default.createElement(ProfileButton, {
+    bottomLinks: bottomLinks,
+    customContent: customContent,
+    helpLinkOverrides: helpLinkOverrides,
+    isThemeSwitcherEnabled: isThemeSwitcherEnabled,
+    profileInfoOverrides: profileInfoOverrides,
+    showProductSwitcher: showProductSwitcher,
+    topLinks: topLinks
+  }));
+});
+FloatingActionMenu.displayName = "FloatingActionMenu";
+
+export { FloatingActionMenu as default };
+//# sourceMappingURL=FloatingActionMenu.js.map