magneto365.ui 2.59.2 → 2.59.4

package/dist/cjs/index.js

@@ -276,6 +276,8 @@ var Add2 = "https://static.magneto365.com/lib/assets/4a5507815cef1554.svg";
 
 var AddSquareBlackOutline = "https://static.magneto365.com/lib/assets/7802bad8f709827a.svg";
 
+var AllJobs = "https://static.magneto365.com/lib/assets/c0801a55ef2c85e6.svg";
+
 var AnimatedSpinnerBlack = "https://static.magneto365.com/lib/assets/gif/6f5219c0a4f28bcb.gif";
 
 var AnimatedSpinnerBlue = "https://static.magneto365.com/lib/assets/gif/e67f4a6ee6def0b9.gif";
@@ -290,6 +292,8 @@ var ArchiveAdd = "https://static.magneto365.com/lib/assets/93858404062779b6.svg"
 
 var ArchiveRemove = "https://static.magneto365.com/lib/assets/7b9b613a82ce5a7e.svg";
 
+var ArchiveTick = "https://static.magneto365.com/lib/assets/2032b2bd88b4ed5b.svg";
+
 var ArrowDown2 = "https://static.magneto365.com/lib/assets/cd4e261bd404d56c.svg";
 
 var ArrowDown3 = "https://static.magneto365.com/lib/assets/59e0a621450cbb17.svg";
@@ -350,6 +354,8 @@ var DocumentForward = "https://static.magneto365.com/lib/assets/1aba91fa564f11d7
 
 var DocumentSearch = "https://static.magneto365.com/lib/assets/3a1c54796cd5e026.svg";
 
+var DocumentText = "https://static.magneto365.com/lib/assets/89e029edfa166388.svg";
+
 var DocumentTextGray = "https://static.magneto365.com/lib/assets/e6c25ccc7957e05e.svg";
 
 var DollarCircle = "https://static.magneto365.com/lib/assets/e398388dfbd7a649.svg";
@@ -434,6 +440,8 @@ var LogoutIcon = "https://static.magneto365.com/lib/assets/69e73b9b021eccd7.svg"
 
 var MagicStarBlackOutline = "https://static.magneto365.com/lib/assets/3cce32a33c03fccd.svg";
 
+var MessageQuestion = "https://static.magneto365.com/lib/assets/4be843dae5de2ab7.svg";
+
 var Messages2BlackOutline = "https://static.magneto365.com/lib/assets/801c14292dfce9f7.svg";
 
 var MiniArrowGrayDown = "https://static.magneto365.com/lib/assets/0385a8005062bc95.svg";
@@ -490,10 +498,14 @@ var SpinnerWhite = "https://static.magneto365.com/lib/assets/b97768a94b8e244b.sv
 
 var Success = "https://static.magneto365.com/lib/assets/d08d09ab2ca482fb.svg";
 
+var SuggestedJobs = "https://static.magneto365.com/lib/assets/a589f2bfa7334c2f.svg";
+
 var Tag = "https://static.magneto365.com/lib/assets/ec8bb6c5ab3d8964.svg";
 
 var TaskBlueBold = "https://static.magneto365.com/lib/assets/546c3401e6c1ab39.svg";
 
+var TaskSquare = "https://static.magneto365.com/lib/assets/236599155bcd9912.svg";
+
 var TaskWhiteOutline = "https://static.magneto365.com/lib/assets/e8987356bcb0eb69.svg";
 
 var TickCircleGreenBold = "https://static.magneto365.com/lib/assets/b7c5dd6900f044db.svg";
@@ -2243,25 +2255,28 @@ var MenuIcon = Component$1$;
 
 var style$L = {"mangeto-ui-list-menu-icons":"mg_list_menu_icons_mangeto-ui-list-menu-icons_u92cd"};
 
+var getIcons = function (iconName) {
+    if (!iconName || !(iconName in megaMenuUserLoggedIcons))
+        return null;
+    return megaMenuUserLoggedIcons[iconName];
+};
+
 var Component$1_ = function (_a) {
-    var urlParam = _a.urlParam, menuItems = _a.menuItems, menuItems1440 = _a.menuItems1440, logout = _a.logout, settings = _a.settings, haveGif = _a.haveGif;
+    var menuItems1440 = _a.menuItems1440, haveGif = _a.haveGif, urlParam = _a.urlParam, menuItems = _a.menuItems, logout = _a.logout;
     var logoutText = logout.logoutText, onClick = logout.onClick;
-    var settingsText = settings.settingsText, onClickSettings = settings.onClick;
     var userMenu = useMediaQuery(menuItems1440 && !haveGif ? menuItems1440 : menuItems, { xl: menuItems });
     return (React__default["default"].createElement("div", { className: style$L['mangeto-ui-list-menu-icons'] },
-        React__default["default"].createElement("div", null, userMenu === null || userMenu === void 0 ? void 0 :
-            userMenu.map(function (_a, i) {
-                var _b = _a.title, title = _b === void 0 ? '' : _b, items = _a.items;
-                return (React__default["default"].createElement("div", { key: i },
-                    React__default["default"].createElement("p", null, title ? title : null),
-                    items.map(function (_a, i) {
-                        var slug = _a.slug, icon = _a.icon, props = __rest(_a, ["slug", "icon"]);
-                        return (React__default["default"].createElement(React.Fragment, { key: i },
-                            React__default["default"].createElement(MenuIcon, __assign({ icon: icon, isActive: Array.isArray(slug) ? slug.includes(urlParam) : urlParam === slug }, props))));
-                    })));
-            }),
-            React__default["default"].createElement(MenuIcon, { type: "button", onClick: onClickSettings, icon: Setting2, text: settingsText })),
-        React__default["default"].createElement(Divider, null),
+        React__default["default"].createElement("div", null, userMenu === null || userMenu === void 0 ? void 0 : userMenu.map(function (_a, i) {
+            var _b = _a.title, title = _b === void 0 ? '' : _b, items = _a.items;
+            return (React__default["default"].createElement("div", { key: i },
+                React__default["default"].createElement("p", null, title ? title : null),
+                items.map(function (_a, i) {
+                    var slug = _a.slug, icon = _a.icon, props = __rest(_a, ["slug", "icon"]);
+                    return (React__default["default"].createElement(React.Fragment, { key: i },
+                        React__default["default"].createElement(MenuIcon, __assign({ icon: icon && icon in megaMenuUserLoggedIcons ? getIcons(icon) : icon, isActive: Array.isArray(slug) ? slug.includes(urlParam) : urlParam === slug }, props))));
+                }),
+                React__default["default"].createElement(Divider, { spacing: 30 })));
+        })),
         React__default["default"].createElement(MenuIcon, { type: "button", onClick: onClick, icon: LogoutIcon, text: logoutText })));
 };
 var ListMenuIcons = Component$1_;
@@ -2363,7 +2378,22 @@ var initialContext = {
     jobsProps: {
         tabs: []
     },
-    mainHeaderProps: {}
+    mainHeaderProps: {},
+    listMenuUserProps: {
+        urlParam: '',
+        menuItems: [],
+        menuItems1440: [],
+        logout: {
+            logoutText: '',
+            onClick: function () { return ({}); }
+        },
+        settings: {
+            settingsText: '',
+            onClick: function () { return ({}); }
+        },
+        profileImage: {},
+        isAuthenticated: false
+    }
 };
 var MegaMenuContext = React.createContext(initialContext);
 var MegaMenuProvider = function (_a) {
@@ -2383,6 +2413,10 @@ var useMegaMenuMain = function () {
     var mainHeaderProps = React.useContext(MegaMenuContext).mainHeaderProps;
     return mainHeaderProps;
 };
+var useLoggedInUser = function () {
+    var listMenuUserProps = React.useContext(MegaMenuContext).listMenuUserProps;
+    return listMenuUserProps;
+};
 
 var styles$1M = {"button-link":"mg_button_link_button-link_1iyy1","button-link__text":"mg_button_link_button-link_text_1iyy1"};
 
@@ -4304,6 +4338,15 @@ Array(36).fill(megaMenuJobIcon);
 Array(36).fill(megaMenuJobImage);
 var megaMenuHelpIcons = [QuestionCircle, HeadsetBlackOutline];
 var megaMenuJobsIcons = [LocationBlue, CourthouseBlue, BriefcaseBlue, BuildingBlue];
+var megaMenuUserLoggedIcons = {
+    allJobs: AllJobs,
+    suggestedJobs: SuggestedJobs,
+    savedJobs: ArchiveTick,
+    inProcess: TaskSquare,
+    resume: DocumentText,
+    settings: Setting2,
+    help: MessageQuestion
+};
 var mobileSocialIcons = [Book, HeadsetBlackOutline, QuestionCircle];
 
 var CNM = /** @class */ (function () {
@@ -4415,9 +4458,9 @@ var styles$1d = {"magneto-ui-button":"mg_button_magneto-ui-button_2zrcl","magnet
 var Component$1r = function (_a) {
     var buttonText = _a.buttonText, buttonTitle = _a.buttonTitle, addHover = _a.addHover, onClick = _a.onClick, suffixIcon = _a.suffixIcon, prefixIcon = _a.prefixIcon, className = _a.className, _b = _a.iconSize, iconSize = _b === void 0 ? 20 : _b;
     return (React__default["default"].createElement("button", { className: "".concat(className, " ").concat(styles$1d['magneto-ui-button'], " ").concat(addHover ? styles$1d['hover-effect'] : '', " "), type: "button", onClick: onClick, title: buttonTitle },
-        suffixIcon && (React__default["default"].createElement(IconItem, { size: iconSize, icon: suffixIcon, hover: addHover, className: styles$1d['magneto-ui-button__icon'] })),
+        typeof suffixIcon === 'string' ? (React__default["default"].createElement(IconItem, { size: iconSize, icon: suffixIcon, hover: addHover, className: styles$1d['magneto-ui-button__icon'] })) : (suffixIcon),
         buttonText && React__default["default"].createElement("p", { className: styles$1d['magneto-ui-button__mobile-text'] }, buttonText),
-        prefixIcon && (React__default["default"].createElement(IconItem, { size: iconSize, icon: prefixIcon, hover: addHover, className: styles$1d['magneto-ui-button__icon'] }))));
+        typeof prefixIcon === 'string' ? (React__default["default"].createElement(IconItem, { size: iconSize, icon: prefixIcon, hover: addHover, className: styles$1d['magneto-ui-button__icon'] })) : (prefixIcon)));
 };
 /**
  * UI Atom Component of Save Button
@@ -8136,7 +8179,10 @@ var styles$1 = {"mega-menu-main-header":"mg_mega_menu_main_header_mega-menu-main
 var Component$4 = function (_a) {
     var toggleDrawerMenu = _a.toggleDrawerMenu;
     var _b = React.useState(false), showSearchBar = _b[0], setShowSearchBar = _b[1];
-    var _c = useMegaMenuMain(), homeUrl = _c.homeUrl, searchBarProps = _c.searchBarProps, loginProps = _c.loginProps;
+    var _c = React.useState(false), toggleMobileDrawer = _c[0], setToggleMobileDrawer = _c[1];
+    var _d = useMegaMenuMain(), homeUrl = _d.homeUrl, searchBarProps = _d.searchBarProps, loginProps = _d.loginProps;
+    var listMenuUserProps = useLoggedInUser();
+    var profileImage = listMenuUserProps.profileImage, isAuthenticated = listMenuUserProps.isAuthenticated;
     var toggleSearchBar = function () {
         setShowSearchBar(!showSearchBar);
     };
@@ -8157,15 +8203,20 @@ var Component$4 = function (_a) {
     });
     var loginAction = (React__default["default"].createElement(Link, { type: 'button', href: (loginProps === null || loginProps === void 0 ? void 0 : loginProps.loginUrl) || '', text: (loginProps === null || loginProps === void 0 ? void 0 : loginProps.loginText) || '', iconProps: __assign(__assign({}, SignInIcon), { size: 15 }), linkStyles: __assign(__assign({}, SignInStyles), { buttonColor: '#FFFFFF' }) }));
     var logoutAction = (React__default["default"].createElement(MainButton, __assign({}, SignUpButtonStyle, { buttonText: (loginProps === null || loginProps === void 0 ? void 0 : loginProps.signUpText) || '', onClick: (loginProps === null || loginProps === void 0 ? void 0 : loginProps.onClickSignUp) || undefined, buttonSize: 'medium', iconProps: __assign(__assign({}, SignUpButtonStyle.iconProps), { size: 15 }) })));
+    var loginHeaderPopover = useMediaQuery(React__default["default"].createElement(UserMenu, { listMenuUserProps: listMenuUserProps, profileImage: profileImage }), {
+        md: React__default["default"].createElement(Avatar, __assign({}, profileImage, { onClick: function () { return setToggleMobileDrawer(true); } }))
+    });
     return (React__default["default"].createElement("div", { className: styles$1['mega-menu-main-header'] },
         React__default["default"].createElement("div", { className: styles$1['mega-menu-main-header__main'] },
             LogoutHeaderMobileSearchbar,
             LogoutHeaderMenuButton,
             React__default["default"].createElement("a", { href: homeUrl }, renderLogo),
             React__default["default"].createElement("div", { className: styles$1['mega-menu-main-header__search'] }, renderSearchBar)),
-        React__default["default"].createElement("div", { className: styles$1['mega-menu-main-header__login'] },
+        React__default["default"].createElement("div", { className: styles$1['mega-menu-main-header__login'] }, isAuthenticated ? (loginHeaderPopover) : (React__default["default"].createElement(React__default["default"].Fragment, null,
             loginAction,
-            logoutAction)));
+            logoutAction))),
+        React__default["default"].createElement(MobileDrawer, { isOpen: toggleMobileDrawer, onClose: function () { return setToggleMobileDrawer(false); } },
+            React__default["default"].createElement(ListMenuIcons, __assign({}, listMenuUserProps)))));
 };
 var MegaMenuMainHeader = Component$4;
 
@@ -8408,6 +8459,7 @@ exports.BrandsMenuPopover = BrandsMenuPopover$1;
 exports.Breadcrumb = Breadcrumb;
 exports.Breadcrumbs = Breadcrumbs;
 exports.Button = Button;
+exports.ButtonLink = ButtonLink;
 exports.Checkbox = Checkbox;
 exports.CitiesDetailDrawer = CitiesDetailDrawer;
 exports.ComparativeCounter = ComparativeCounter;