andoncloud-sdk 1.2.4 → 1.3.2

package/dist/andoncloud-sdk.js

@@ -7,7 +7,6 @@ var reactRouterDom = require('react-router-dom');
 var propTypes = require('prop-types');
 var CssBaseline = _interopDefault(require('@mui/material/CssBaseline'));
 var styles = require('@mui/material/styles');
-var useModalHook = require('use-modal-hook');
 var material = require('@mui/material');
 var mobxReactLite = require('mobx-react-lite');
 var Dialog = _interopDefault(require('@mui/material/Dialog'));
@@ -26,7 +25,6 @@ var IconButton = _interopDefault(require('@mui/material/IconButton'));
 var MenuItem = _interopDefault(require('@mui/material/MenuItem'));
 var Menu = _interopDefault(require('@mui/material/Menu'));
 var AccessTimeIcon = _interopDefault(require('@mui/icons-material/AccessTime'));
-var styles$1 = require('@mui/styles');
 
 let e={data:""},t=t=>"object"==typeof window?((t?t.querySelector("#_goober"):window._goober)||Object.assign((t||document.head).appendChild(document.createElement("style")),{innerHTML:" ",id:"_goober"})).firstChild:t||e,l=/(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g,a=/\/\*[^]*?\*\/|\s\s+|\n/g,n=(e,t)=>{let r="",l="",a="";for(let o in e){let s=e[o];"@"==o[0]?"i"==o[1]?r=o+" "+s+";":l+="f"==o[1]?n(s,o):o+"{"+n(s,"k"==o[1]?"":t)+"}":"object"==typeof s?l+=n(s,t?t.replace(/([^,])+/g,e=>o.replace(/(^:.*)|([^,])+/g,t=>/&/.test(t)?t.replace(/&/g,e):e?e+" "+t:t)):o):null!=s&&(o=/^--/.test(o)?o:o.replace(/[A-Z]/g,"-$&").toLowerCase(),a+=n.p?n.p(o,s):o+":"+s+";");}return r+(t&&a?t+"{"+a+"}":a)+l},o={},s=e=>{if("object"==typeof e){let t="";for(let r in e)t+=r+s(e[r]);return t}return e},c=(e,t,r,c,i)=>{let u=s(e),p=o[u]||(o[u]=(e=>{let t=0,r=11;for(;t<e.length;)r=101*r+e.charCodeAt(t++)>>>0;return "go"+r})(u));if(!o[p]){let t=u!==e?e:(e=>{let t,r=[{}];for(;t=l.exec(e.replace(a,""));)t[4]?r.shift():t[3]?r.unshift(r[0][t[3]]=r[0][t[3]]||{}):r[0][t[1]]=t[2];return r[0]})(e);o[p]=n(i?{["@keyframes "+p]:t}:t,r?"":"."+p);}return ((e,t,r)=>{-1==t.data.indexOf(e)&&(t.data=r?e+t.data:t.data+e);})(o[p],t,c),p},i=(e,t,r)=>e.reduce((e,l,a)=>{let o=t[a];if(o&&o.call){let e=o(r),t=e&&e.props&&e.props.className||/^go/.test(e)&&e;o=t?"."+t:e&&"object"==typeof e?e.props?"":n(e,""):!1===e?"":e;}return e+l+(null==o?"":o)},"");function u(e){let r=this||{},l=e.call?e(r.p):e;return c(l.unshift?l.raw?i(l,[].slice.call(arguments,1),r.p):l.reduce((e,t)=>Object.assign(e,t&&t.call?t(r.p):t),{}):l,t(r.target),r.g,r.o,r.k)}let p,d,f,g=u.bind({g:1}),b=u.bind({k:1});function h(e,t,r,l){n.p=t,p=e,d=r,f=l;}function m(e,t){let r=this||{};return function(){let l=arguments;function a(n,o){let s=Object.assign({},n),c=s.className||a.className;r.p=Object.assign({theme:d&&d()},s),r.o=/ *go\d+/.test(c),s.className=u.apply(r,l)+(c?" "+c:""),t&&(s.ref=o);let i=e;return e[0]&&(i=s.as||e,delete s.as),f&&i[0]&&f(s),p(i,s)}return t?t(a):a}}
 
@@ -792,6 +790,92 @@ function _extends$1() {
   return _extends$1.apply(this, arguments);
 }
 
+var ModalContext = React__default.createContext({
+  showModal: null,
+  hideModal: null,
+  isOpenedModal: false
+});
+
+var ModalProvider = function ModalProvider(_ref) {
+  var children = _ref.children;
+
+  var _useState = React.useState({}),
+      modalsConfig = _useState[0],
+      setConfig = _useState[1];
+
+  var hideModal = React.useCallback(function (modalKey, onClose) {
+    setConfig(function (prevConfig) {
+      var _extends2;
+
+      return _extends$1({}, prevConfig, (_extends2 = {}, _extends2[modalKey] = _extends$1({}, prevConfig[modalKey], {
+        isOpen: false
+      }), _extends2));
+    });
+
+    if (onClose) {
+      onClose();
+    }
+  }, [setConfig]);
+  var showModal = React.useCallback(function (modalKey, component, modalData) {
+    setConfig(function (prevConfig) {
+      var _extends3;
+
+      return _extends$1({}, prevConfig, (_extends3 = {}, _extends3[modalKey] = {
+        isOpen: true,
+        component: component,
+        data: modalData
+      }, _extends3));
+    });
+  }, [setConfig]);
+  var contextValue = React.useMemo(function () {
+    return {
+      showModal: showModal,
+      hideModal: hideModal,
+      isOpenedModal: Object.values(modalsConfig).some(function (_ref2) {
+        var isOpen = _ref2.isOpen;
+        return isOpen;
+      })
+    };
+  }, [hideModal, showModal, modalsConfig]);
+  return /*#__PURE__*/React__default.createElement(ModalContext.Provider, {
+    value: contextValue
+  }, children, Object.keys(modalsConfig).map(function (modalKey) {
+    var _modalsConfig$modalKe = modalsConfig[modalKey],
+        Component = _modalsConfig$modalKe.component,
+        isOpen = _modalsConfig$modalKe.isOpen,
+        data = _modalsConfig$modalKe.data;
+    return isOpen && /*#__PURE__*/React__default.createElement(Component, _extends$1({
+      onClose: function onClose() {
+        return hideModal(modalKey);
+      },
+      key: modalKey,
+      isOpen: isOpen
+    }, data));
+  }));
+};
+
+var generateModalKey = function () {
+  var count = 0;
+  return function () {
+    return "" + ++count;
+  };
+}();
+
+function useModal(component, data, onClose) {
+  var key = React.useMemo(generateModalKey, []);
+  var context = React.useContext(ModalContext);
+  var showModal = React.useCallback(function (modalData) {
+    return context.showModal(key, component, modalData instanceof Event ? data : _extends$1({}, data, modalData));
+  }, [data, context.showModal]);
+  var hideModal = React.useCallback(function () {
+    return context.hideModal(key, onClose);
+  }, [context.hideModal, onClose, key]);
+  return [showModal, hideModal];
+}
+
+useModal.ModalContext = ModalContext;
+useModal.ModalProvider = ModalProvider;
+
 var AuthConfigContext = React.createContext();
 var AuthConfigProvider = function AuthConfigProvider(_ref) {
   var children = _ref.children,
@@ -2791,7 +2875,7 @@ var useLogin = function useLogin(scope, loginProps) {
       redirectUri = _useAuthConfig.redirectUri,
       defaultRedirectPath = _useAuthConfig.redirectPath;
 
-  var _useModal = useModalHook.useModal(LoginModal$1, _extends$1({
+  var _useModal = useModal(LoginModal$1, _extends$1({
     scope: scope
   }, loginProps)),
       showModal = _useModal[0];
@@ -2817,54 +2901,51 @@ var useLogin = function useLogin(scope, loginProps) {
   };
 };
 
-var useStyles = styles$1.makeStyles({
-  root: function root(_ref) {
-    var styles = _ref.styles;
-    return styles;
-  },
-  nav: {
-    marginRight: 10
-  },
-  user: {
-    marginRight: 20,
-    backgroundColor: "rgba(0,0,0,0.05)",
-    borderRadius: 5,
-    border: "1px solid rgba(0,0,0, 0.25)"
-  },
-  userInfo: {
-    paddingLeft: "1em"
-  },
-  button: {
-    color: "white",
-    backgroundColor: "transparent",
-    "&:hover": {
-      backgroundColor: "rgba(0,0,0,0.05)"
-    }
-  },
-  loginButton: {
-    padding: "6px 18px"
-  },
-  logoutButton: {
-    paddingRight: 18
-  },
-  avatar: {
-    paddingRight: "0.5em"
-  },
-  menu: function menu(_ref2) {
-    var menuStyles = _ref2.menuStyles;
-    return _extends$1({
-      marginTop: 48,
+var useStyles = (function (_ref) {
+  var styles = _ref.styles,
+      menuStyles = _ref.menuStyles,
+      menuDropdownStyles = _ref.menuDropdownStyles;
+  return {
+    root: styles,
+    nav: {
+      marginRight: "10px"
+    },
+    user: {
+      marginRight: "20px",
+      backgroundColor: "rgba(0,0,0,0.05)",
+      borderRadius: "5px",
+      border: "1px solid rgba(0,0,0, 0.25)"
+    },
+    userInfo: {
+      paddingLeft: "1em"
+    },
+    button: {
+      color: "white",
+      backgroundColor: "transparent",
+      "&:hover": {
+        backgroundColor: "rgba(0,0,0,0.05)"
+      }
+    },
+    loginButton: {
+      padding: "6px 18px"
+    },
+    logoutButton: {
+      paddingRight: "18px"
+    },
+    avatar: {
+      paddingRight: "0.5em"
+    },
+    menu: _extends$1({
+      marginTop: "48px",
       backgroundColor: "rgba(0,0,0,0.5)"
-    }, menuStyles);
-  },
-  popover: function popover(_ref3) {
-    var menuDropdownStyles = _ref3.menuDropdownStyles;
-    return _extends$1({
-      minWidth: "20%",
-      backgroundColor: "#2d2d2d",
-      color: "white"
-    }, menuDropdownStyles);
-  }
+    }, menuStyles, {
+      "& .MuiPaper-root": _extends$1({
+        minWidth: "20%",
+        backgroundColor: "#2d2d2d",
+        color: "white"
+      }, menuDropdownStyles)
+    })
+  };
 });
 
 var Header = function Header(_ref) {
@@ -2911,7 +2992,7 @@ var Header = function Header(_ref) {
       menuAnchorEl = _useState2[0],
       setMenuAnchorEl = _useState2[1];
 
-  var classes = useStyles({
+  var headerStyles = useStyles({
     styles: styles,
     menuStyles: menuStyles,
     menuDropdownStyles: menuDropdownStyles
@@ -2979,14 +3060,14 @@ var Header = function Header(_ref) {
     var currentUser = userStore.currentUser;
     return /*#__PURE__*/React__default.createElement(Box, {
       display: "inline-block",
-      className: classes.avatar
+      sx: headerStyles.avatar
     }, currentUser && currentUser.name);
   };
 
   var renderNav = function renderNav() {
     return navItems && /*#__PURE__*/React__default.createElement(Box, {
       display: "flex",
-      className: classes.nav
+      sx: headerStyles.nav
     }, navItems.map(function (item) {
       return /*#__PURE__*/React__default.createElement(Button, {
         key: item.label,
@@ -2994,7 +3075,7 @@ var Header = function Header(_ref) {
           return handleItemClick(item);
         },
         endIcon: item.icon,
-        className: classes.button
+        sx: headerStyles.button
       }, item.label);
     }));
   };
@@ -3003,23 +3084,23 @@ var Header = function Header(_ref) {
     var currentUser = userStore.getCurrentUserJS;
     return /*#__PURE__*/React__default.createElement(Box, {
       display: "flex",
-      className: classes.user
+      sx: headerStyles.user
     }, currentUser ? /*#__PURE__*/React__default.createElement(Box, {
       display: "flex",
       alignItems: "center",
-      className: classes.userInfo
+      sx: headerStyles.userInfo
     }, showCompanyLogo && renderUserCompanyLogo(), renderUserAvatar(), /*#__PURE__*/React__default.createElement(Button, {
       id: "logout-button",
       onClick: handleLogout,
       endIcon: /*#__PURE__*/React__default.createElement(ExitToAppIcon, null),
-      className: classes.button + " " + classes.logoutButton,
+      sx: _extends$1({}, headerStyles.button, headerStyles.logoutButton),
       "data-testid": "ac-sdk-header-logout-button"
     }, languageStore.translations.headerLogoutButton)) : /*#__PURE__*/React__default.createElement(Button, {
       id: "login-button",
       onClick: function onClick() {
         return navigate("/login");
       },
-      className: classes.button + " " + classes.loginButton,
+      sx: _extends$1({}, headerStyles.button, headerStyles.loginButton),
       "data-testid": "ac-sdk-header-login-button"
     }, languageStore.translations.headerLoginButton));
   };
@@ -3046,10 +3127,7 @@ var Header = function Header(_ref) {
       },
       open: Boolean(menuAnchorEl),
       onClose: handleMenuClose,
-      className: classes.menu,
-      PopoverClasses: {
-        paper: classes.popover
-      }
+      sx: headerStyles.menu
     }, menuItems.map(function (item) {
       return /*#__PURE__*/React__default.createElement(MenuItem, {
         key: item.label,
@@ -3063,7 +3141,7 @@ var Header = function Header(_ref) {
   return /*#__PURE__*/React__default.createElement(AppBar, {
     position: position,
     elevation: 0,
-    className: classes.root,
+    sx: headerStyles.root,
     "data-testid": dataTestID || "ac-sdk-header"
   }, /*#__PURE__*/React__default.createElement(Toolbar, {
     variant: "dense"
@@ -3348,7 +3426,7 @@ var App = mobxReactLite.observer(function (_ref) {
     }, authProps)
   }, sessionStore.networkError ? /*#__PURE__*/React__default.createElement(NetworkError, null) : appReady && /*#__PURE__*/React__default.createElement(Router, null, /*#__PURE__*/React__default.createElement(reactRouterDom.Route, {
     path: "*",
-    element: /*#__PURE__*/React__default.createElement(useModalHook.ModalProvider, null, children)
+    element: /*#__PURE__*/React__default.createElement(ModalProvider, null, children)
   }))));
 });
 App.propTypes = {