scorer-ui-kit 2.6.2 → 2.6.3

package/dist/Global/atoms/NavigationItem.d.ts

@@ -4,12 +4,10 @@ interface IProps {
     item: IMenuItemTop;
     contextKey: number;
     submenuOpen: boolean;
-    loading: boolean;
     menuOpen?: boolean;
     topLevelPath: string;
-    minHeight?: number;
+    mobileMenu?: boolean;
     onClickCallback?: (...args: any[]) => void;
-    readyCallback?: (...args: any[]) => void;
 }
 declare const NavigationItem: React.FC<IProps>;
 export default NavigationItem;

package/dist/index.js

@@ -12845,7 +12845,7 @@ var useMenu = function useMenu(defaultMenuOpen, canAlwaysPin) {
   };
 };
 
-var _templateObject$1z, _templateObject2$1k, _templateObject3$1c, _templateObject4$15, _templateObject5$$, _templateObject6$M, _templateObject7$I, _templateObject8$z, _templateObject9$q, _templateObject10$l, _templateObject11$f, _templateObject12$d, _templateObject13$b, _templateObject14$9;
+var _templateObject$1z, _templateObject2$1k, _templateObject3$1c, _templateObject4$15, _templateObject5$$, _templateObject6$M, _templateObject7$I, _templateObject8$z, _templateObject9$q, _templateObject10$l, _templateObject11$f, _templateObject12$d, _templateObject13$b;
 var Submenu = styled__default.ul(_templateObject$1z || (_templateObject$1z = _taggedTemplateLiteralLoose(["\n  display: block;\n  position: relative;\n  margin-left: 40px;\n  padding: 0;\n\n"])));
 var SubmenuHeader = styled__default.div(_templateObject2$1k || (_templateObject2$1k = _taggedTemplateLiteralLoose(["\n  display: block;\n  height: 40px;\n  margin-left: 40px;\n"])));
 var SubmenuContainerInner = styled__default.div(_templateObject3$1c || (_templateObject3$1c = _taggedTemplateLiteralLoose(["\n  overflow: hidden;\n"])));
@@ -12858,22 +12858,22 @@ var SubmenuItem = styled__default.li(_templateObject8$z || (_templateObject8$z =
   return styled.css(_templateObject9$q || (_templateObject9$q = _taggedTemplateLiteralLoose(["\n    \n      &:hover {\n        color: var(--grey-12);\n      }\n\n      ", "\n\n    "])), isActive && styled.css(_templateObject10$l || (_templateObject10$l = _taggedTemplateLiteralLoose(["\n        &, &:hover {\n          color: var(--grey-11);\n          font-weight: 600;\n        }\n      "]))));
 });
 var SubmenuContainer = styled__default.div(_templateObject11$f || (_templateObject11$f = _taggedTemplateLiteralLoose(["\n  position: relative;\n  overflow: hidden;\n\n  transition:\n    grid-template-rows var(--speed-normal) var(--easing-primary-in-out),\n    opacity var(--speed-fast) var(--easing-primary-in-out);\n\n  &::after {\n    display: block;\n    content: '';\n    width: 1px;\n    position: absolute;\n    left: 40px;\n    top: 0;\n    bottom: 35px;\n    background: var(--dividing-line);\n  }\n\n"])));
-var ContextContainer = styled__default.div(_templateObject12$d || (_templateObject12$d = _taggedTemplateLiteralLoose(["\n  min-height: 70px;\n  width: inherit;\n\n  ", "{\n    display: grid;\n    grid-template-rows: 0fr;\n  };\n\n  ", ";\n\n  ", ";\n\n"])), SubmenuContainer, function (_ref2) {
-  var open = _ref2.open;
+var ContextContainer = styled__default.div(_templateObject12$d || (_templateObject12$d = _taggedTemplateLiteralLoose(["\n  min-height: ", ";\n  width: inherit;\n\n  ", "{\n    display: grid;\n    grid-template-rows: 0fr;\n  };\n\n  ", ";\n"])), function (_ref2) {
+  var mobileMenu = _ref2.mobileMenu;
+  return mobileMenu ? '30px' : '70px';
+}, SubmenuContainer, function (_ref3) {
+  var open = _ref3.open;
   return open && styled.css(_templateObject13$b || (_templateObject13$b = _taggedTemplateLiteralLoose(["\n    ", "{\n      grid-template-rows: 1fr;\n      \n      transition:\n        grid-template-rows var(--speed-normal) var(--easing-primary-in-out),\n        opacity var(--speed-fast) var(--easing-primary-in-out);\n      \n      opacity: 1;\n    }\n  "])), SubmenuContainer);
-}, function (_ref3) {
-  var loading = _ref3.loading;
-  return loading === 'true' && styled.css(_templateObject14$9 || (_templateObject14$9 = _taggedTemplateLiteralLoose(["\n    ", "{\n      max-height: none !important;\n      opacity: 1;\n    }\n  "])), SubmenuContainer);
 });
 var NavigationItem = function NavigationItem(_ref4) {
   var item = _ref4.item,
     menuOpen = _ref4.menuOpen,
     submenuOpen = _ref4.submenuOpen,
     contextKey = _ref4.contextKey,
-    loading = _ref4.loading,
     topLevelPath = _ref4.topLevelPath,
-    onClickCallback = _ref4.onClickCallback,
-    readyCallback = _ref4.readyCallback;
+    _ref4$mobileMenu = _ref4.mobileMenu,
+    mobileMenu = _ref4$mobileMenu === void 0 ? false : _ref4$mobileMenu,
+    onClickCallback = _ref4.onClickCallback;
   var icon = item.icon,
     title = item.title,
     href = item.href,
@@ -12883,15 +12883,11 @@ var NavigationItem = function NavigationItem(_ref4) {
   var refSubmenu = React.useRef(null);
   var submenus = generateSubmenus(submenu, onClickCallback) || [];
   var hasSubmenu = submenus.length > 0;
-  React.useEffect(function () {
-    if (readyCallback) {
-      readyCallback(contextKey);
-    }
-  }, [refSubmenu, readyCallback, contextKey]);
-  return React__default.createElement(ContextContainer, {
-    open: submenuOpen,
-    loading: loading ? 'true' : 'false'
-  }, React__default.createElement(ContextItem, Object.assign({}, {
+  return React__default.createElement(ContextContainer, Object.assign({
+    open: submenuOpen
+  }, {
+    mobileMenu: mobileMenu
+  }), React__default.createElement(ContextItem, Object.assign({}, {
     title: title,
     href: href,
     isActive: isActive,
@@ -12958,7 +12954,7 @@ var generateSubmenus = function generateSubmenus(submenu, onClickCallback) {
   return output;
 };
 
-var _templateObject$1A, _templateObject2$1l, _templateObject3$1d, _templateObject4$16, _templateObject5$10, _templateObject6$N, _templateObject7$J, _templateObject8$A, _templateObject9$r, _templateObject10$m, _templateObject11$g, _templateObject12$e, _templateObject13$c, _templateObject14$a;
+var _templateObject$1A, _templateObject2$1l, _templateObject3$1d, _templateObject4$16, _templateObject5$10, _templateObject6$N, _templateObject7$J, _templateObject8$A, _templateObject9$r, _templateObject10$m, _templateObject11$g, _templateObject12$e, _templateObject13$c, _templateObject14$9;
 var Logo = styled__default(reactRouterDom.Link)(_templateObject$1A || (_templateObject$1A = _taggedTemplateLiteralLoose(["\n  height: 50px;\n  margin: 0 20px 55px 15px;\n  display: flex;\n\n  object {\n    pointer-events: none;\n  }\n"])));
 var LogoMark = styled__default.div(_templateObject2$1l || (_templateObject2$1l = _taggedTemplateLiteralLoose(["\n  height: 50px;\n  flex: 0 0 50px;\n  margin-right: 15px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n\n"])));
 var LogoType = styled__default.div(_templateObject3$1d || (_templateObject3$1d = _taggedTemplateLiteralLoose(["\n  opacity: 0;\n  flex: 1;\n  height: 50px;\n  display: flex;\n  justify-content: left;\n  align-items: center;\n"])));
@@ -12976,7 +12972,7 @@ var Container$10 = styled__default.div(_templateObject11$g || (_templateObject11
     desktopSize = _ref2.desktopSize;
   return styled.css(_templateObject12$e || (_templateObject12$e = _taggedTemplateLiteralLoose(["\n    background-color: var(--global-element-background);\n    box-shadow: 0px 0px 7px 0px var(--primary-a2);\n    width: ", ";\n    border-right: 1px solid var(--dividing-line);\n\n    ", ";\n\n    ", "{\n      transition: opacity var(--speed-normal) var(--easing-primary-in-out);\n      opacity: ", ";\n    }\n  "])), open ? "var(--global-menu-width-open)" : "var(--global-menu-width-closed)", desktopSize === 'xxlarge' ? "" : styled.css(_templateObject13$c || (_templateObject13$c = _taggedTemplateLiteralLoose(["\n      transition: width var(--speed-normal) var(--easing-primary-in);\n    "]))), LogoType, open ? 1 : 0);
 });
-var ContainerInner = styled__default.div(_templateObject14$a || (_templateObject14$a = _taggedTemplateLiteralLoose(["\n  width: var(--global-menu-width-open);\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"])));
+var ContainerInner = styled__default.div(_templateObject14$9 || (_templateObject14$9 = _taggedTemplateLiteralLoose(["\n  width: var(--global-menu-width-open);\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n"])));
 var MainMenu = function MainMenu(_ref3) {
   var content = _ref3.content,
     _ref3$home = _ref3.home,
@@ -13002,11 +12998,7 @@ var MainMenu = function MainMenu(_ref3) {
   var _useState = React.useState(0),
     focusedContext = _useState[0],
     setFocusedContext = _useState[1];
-  var _useState2 = React.useState(true),
-    loading = _useState2[0],
-    setLoading = _useState2[1];
   var location = reactRouterDom.useLocation();
-  var checkedInItems = 0;
   var autoMenuOpen = React.useCallback(function (e) {
     if (e.pointerType === 'touch') {
       return;
@@ -13031,12 +13023,6 @@ var MainMenu = function MainMenu(_ref3) {
     }
     setFocusedContext(focusedContext !== contextKey ? contextKey : -1);
   }, [setFocusedContext, focusedContext]);
-  var readyCallback = React.useCallback(function () {
-    checkedInItems++;
-    if (checkedInItems === content.items.length) {
-      setLoading(false);
-    }
-  }, [checkedInItems, content]);
   return React__default.createElement(PushContainer, {
     isPinned: menuState.isMenuPinned
   }, ReactDom.createPortal(React__default.createElement(Container$10, {
@@ -13065,9 +13051,7 @@ var MainMenu = function MainMenu(_ref3) {
       onClickCallback: setFocusedContextCb
     }, {
       item: item,
-      loading: loading,
-      focusedContext: focusedContext,
-      readyCallback: readyCallback
+      focusedContext: focusedContext
     }));
   })), React__default.createElement(MenuFooter, null, supportUrl && React__default.createElement(FooterItemContainer, null, React__default.createElement(ContextItem, {
     compact: true,
@@ -13180,7 +13164,7 @@ var DrawerBottomMenu = function DrawerBottomMenu(_ref) {
   }), React__default.createElement(ColumnContainer, null, React__default.createElement(Title$8, null, title), React__default.createElement(SubTitle$1, null, subTitle)));
 };
 
-var _templateObject$1D, _templateObject2$1o, _templateObject3$1g, _templateObject4$19, _templateObject5$12, _templateObject6$P, _templateObject7$L, _templateObject8$C, _templateObject9$t, _templateObject10$o, _templateObject11$h, _templateObject12$f, _templateObject13$d, _templateObject14$b;
+var _templateObject$1D, _templateObject2$1o, _templateObject3$1g, _templateObject4$19, _templateObject5$12, _templateObject6$P, _templateObject7$L, _templateObject8$C, _templateObject9$t, _templateObject10$o, _templateObject11$h, _templateObject12$f, _templateObject13$d, _templateObject14$a;
 var DrawerTop = styled__default.div(_templateObject$1D || (_templateObject$1D = _taggedTemplateLiteralLoose([""])));
 var DrawerBottom = styled__default.div(_templateObject2$1o || (_templateObject2$1o = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  position: fixed;\n  bottom: 50px;\n  @media ", " {\n    position: static;\n    bottom: 0;\n  }\n"])), deviceMediaQuery.medium);
 var DrawerHeader = styled__default.h2(_templateObject3$1g || (_templateObject3$1g = _taggedTemplateLiteralLoose(["\n  font-size: 14px;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.35px;\n  color: var(--grey-11);\n  padding: 0;\n  margin: 0 0 5px;\n"])));
@@ -13199,7 +13183,7 @@ var FooterMeta = styled__default.div(_templateObject12$f || (_templateObject12$f
   return icon !== '' ? '31px;' : '21px;';
 });
 var NavigationContainer$1 = styled__default.div(_templateObject13$d || (_templateObject13$d = _taggedTemplateLiteralLoose(["\n  max-height: 300px;\n  overflow: scroll;\n  overflow-x: hidden;\n  overflow-y: auto;\n  border-bottom: var(--dividing-line) 1px solid;\n"])));
-var FooterText = styled__default.div(_templateObject14$b || (_templateObject14$b = _taggedTemplateLiteralLoose(["\n  white-space: break-spaces;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  max-width: 136px;\n  max-width: ", ";\n  color: var(--grey-11);\n  opacity: 0.5;\n"])), function (_ref3) {
+var FooterText = styled__default.div(_templateObject14$a || (_templateObject14$a = _taggedTemplateLiteralLoose(["\n  white-space: break-spaces;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  max-width: 136px;\n  max-width: ", ";\n  color: var(--grey-11);\n  opacity: 0.5;\n"])), function (_ref3) {
   var icon = _ref3.icon;
   return icon !== '' ? '136px;' : '164px;';
 });
@@ -13737,14 +13721,10 @@ var MobileMenu = function MobileMenu(_ref) {
   var content = _ref.content,
     supportUrl = _ref.supportUrl,
     closeId = _ref.closeId;
-  var _useState = React.useState(true),
-    loading = _useState[0],
-    setLoading = _useState[1];
-  var _useState2 = React.useState(0),
-    focusedContext = _useState2[0],
-    setFocusedContext = _useState2[1];
+  var _useState = React.useState(0),
+    focusedContext = _useState[0],
+    setFocusedContext = _useState[1];
   var location = reactRouterDom.useLocation();
-  var checkedInItems = 0;
   var _useContext = React.useContext(TabContext),
     setSelected = _useContext.setSelected;
   var setFocusedContextCb = React.useCallback(function (contextKey) {
@@ -13756,12 +13736,6 @@ var MobileMenu = function MobileMenu(_ref) {
     }
     setFocusedContext(focusedContext !== contextKey ? contextKey : -1);
   }, [closeId, content.items, focusedContext, setSelected]);
-  var readyCallback = React.useCallback(function () {
-    checkedInItems++;
-    if (checkedInItems === content.items.length) {
-      setLoading(false);
-    }
-  }, [checkedInItems, content.items.length]);
   var handleCloseMenu = React.useCallback(function () {
     setSelected(closeId);
   }, [closeId, setSelected]);
@@ -13770,7 +13744,7 @@ var MobileMenu = function MobileMenu(_ref) {
       key: key,
       "data-key": key
     }, React__default.createElement(NavigationItem, Object.assign({
-      minHeight: 30,
+      mobileMenu: true,
       topLevelPath: getTopLevelPath(location.pathname),
       contextKey: key,
       menuOpen: true,
@@ -13778,9 +13752,7 @@ var MobileMenu = function MobileMenu(_ref) {
       onClickCallback: setFocusedContextCb
     }, {
       item: item,
-      loading: loading,
-      focusedContext: focusedContext,
-      readyCallback: readyCallback
+      focusedContext: focusedContext
     })));
   }), supportUrl && React__default.createElement(ItemWrapper, null, React__default.createElement(ContextItem, {
     compact: true,