@hhgtech/hhg-components 1.29.420 → 1.29.422

package/build/vaccination.js

@@ -2,47 +2,47 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-be8ffa66.js');
+var tslib_es6 = require('./tslib.es6-28cc9ba6.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index$5 = require('./index-b933a724.js');
+var index$5 = require('./index-7e29c5a6.js');
 require('@mantine/dates');
-require('./index-34fe84fb.js');
-var index$7 = require('./index-72e000d1.js');
-require('./index-e6a7d94d.js');
-var index$3 = require('./index-21508af0.js');
-var index$2 = require('./index-08577c8d.js');
-var index$1 = require('./index-65d76c34.js');
+require('./index-c93c0698.js');
+var index$7 = require('./index-c0ea3ee3.js');
+require('./index-ac9116e4.js');
+var index$3 = require('./index-f2de1ac3.js');
+var index$2 = require('./index-daab7fd3.js');
+var index$1 = require('./index-2150a6f4.js');
 var miscTheme = require('./miscTheme.js');
-require('./index.styles-2195db6d.js');
-var index = require('./index-ec2fee71.js');
+require('./index.styles-0781cd6d.js');
+var index = require('./index-60cac7ff.js');
 var hooks = require('@mantine/hooks');
-require('./text-4e7204f2.js');
-var utils = require('./utils-abc89637.js');
-require('./index-2c166dd2.js');
+require('./text-dec98bc9.js');
+var utils = require('./utils-f733e5ff.js');
+require('./index-e21711b1.js');
 var styled = require('@emotion/styled');
-var index$4 = require('./index-db90720b.js');
-require('./translationsContext-1db8dd97.js');
+var index$4 = require('./index-61d44d43.js');
+require('./translationsContext-810206a1.js');
 var other = require('@hhgtech/icons/other');
-var index$6 = require('./index-9de3df3b.js');
-var index$8 = require('./index-4525bacb.js');
+var index$6 = require('./index-f853d61a.js');
+var index$8 = require('./index-75d27ef8.js');
 var form = require('@mantine/form');
 var dayjs = require('dayjs');
 var customParseFormat = require('dayjs/plugin/customParseFormat');
-var index$a = require('./index-143f0d05.js');
-var index$9 = require('./index-47901325.js');
+var index$a = require('./index-39bf2c53.js');
+var index$9 = require('./index-112b5b48.js');
 require('@mantine/carousel');
 require('classnames');
-require('./useUniqueId-6fad50ff.js');
+require('./useUniqueId-2231b202.js');
 require('./constantsSite.js');
-require('./Locale-da12b1cd.js');
+require('./Locale-e34f5ebf.js');
 require('@hhgtech/icons/core');
 require('date-fns/locale');
 require('./constantsDomainLocales.js');
 require('./constantsRiskScreener.js');
 require('./constantsIsProduction.js');
 require('@mantine/notifications');
-require('./shared-ad5cbb92.js');
+require('./shared-545baa9e.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hhgtech/hhg-components",
-  "version": "1.29.420",
+  "version": "1.29.422",
   "main": "build/index.js",
   "module": "build/esm/index.js",
   "files": [

package/build/esm/index-55c23387.js

@@ -1,352 +0,0 @@
-import React__default, { useMemo, useState, useEffect } from 'react';
-import { u as useTranslations } from './index-845f30fa.js';
-import { getCookie } from './miscCookieHelper.js';
-import { C as CommonGAssets } from './index-cd524a04.js';
-import { e as normalizeLinkSlash, n as normalizeLink } from './normalizeLink-63935680.js';
-import { theme } from './miscTheme.js';
-import { A as Avatar } from './index-eb1a84ba.js';
-import { b as getTogetherUserPostsApiPath } from './index-cc1ea344.js';
-import { B as Button } from './index-47b87e94.js';
-
-const INTERNAL_CARD_URLS = {
-    myBooking: 'booking',
-    mySaved: 'saved',
-    myHealth: 'health',
-    myFamily: 'family',
-    myCommunity: 'my-communities',
-    // TODO: this is hardcoded for VN, need to adapt to dynamic slug depend on locale
-    eCom: '/shop/ho-so/quan-li-don-hang/',
-};
-
-var styles$4 = {"navHeader":"uJQBNNg","navAvatar":"TfG3dM5","navHeaderUserInfos":"aMtjFNf","navHeaderUserName":"cSz2RR-","navHeaderMyProfileButton":"GyFm00F"};
-
-function NavHeader({ userInfo, onClickMyProfileButton, themeName = 'helloSites', }) {
-    const { t } = useTranslations();
-    const nameFirstLetter = useMemo(() => {
-        const name = (userInfo === null || userInfo === void 0 ? void 0 : userInfo.name) || (userInfo === null || userInfo === void 0 ? void 0 : userInfo.username);
-        if (name && name.length) {
-            return name[0].toUpperCase();
-        }
-        return 'A';
-    }, [userInfo === null || userInfo === void 0 ? void 0 : userInfo.username, userInfo === null || userInfo === void 0 ? void 0 : userInfo.name]);
-    const handleClickMyProfileButton = () => {
-        if (onClickMyProfileButton) {
-            onClickMyProfileButton();
-        }
-    };
-    return (React__default.createElement("div", { className: styles$4.navHeader, onClick: handleClickMyProfileButton },
-        React__default.createElement(Avatar, { className: styles$4.navAvatar, type: "rounded", size: "xl", avatarUrl: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, firstLetter: nameFirstLetter, backgroundColor: themeName === 'marryBaby'
-                ? theme.mbColors.pink
-                : theme.colors.secondaryBase }),
-        React__default.createElement("div", { className: styles$4.navHeaderUserInfos },
-            React__default.createElement("div", { className: styles$4.navHeaderUserName }, (userInfo === null || userInfo === void 0 ? void 0 : userInfo.name) || (userInfo === null || userInfo === void 0 ? void 0 : userInfo.username)),
-            React__default.createElement("div", { className: styles$4.navHeaderMyProfileButton, style: {
-                    '--bg-hellosites': `url(${CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-chevronRight.svg')})`,
-                    '--bg-marrybaby': `url(${CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-arrowRight.svg')})`,
-                } }, t('userProfile.nav.header.viewProfile')))));
-}
-
-var styles$3 = {"navigationCard":"fVk18fq","navigationCardLabel":"v8TCvUb","navigationCardIconWrapper":"mx7T4V3"};
-
-const iconBgColorMap = {
-    myHealth: theme.mbColors.toneYellow,
-    myCommunity: theme.mbColors.toneBlue,
-    mySaved: theme.mbColors.toneGreen,
-};
-// type CardIconUrlMap = IconUrlMap<UserProfileMenuCard>
-const cardIconUrlMap = {
-    helloSites: {
-        myBooking: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myBooking.svg'),
-        myCommunity: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myCommunity.svg'),
-        myFamily: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myFamily.svg'),
-        myHealth: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myHealth.svg'),
-        mySaved: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-mySaved.svg'),
-        eCom: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-eCom.svg'),
-    },
-    marryBaby: {
-        mySaved: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-mySaved.svg'),
-        myCommunity: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-myCommunity.svg'),
-        myHealth: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-myHealth.svg'),
-    },
-};
-const NavigationCard = ({ type, themeName, className, onClick = () => undefined, }) => {
-    const { t } = useTranslations();
-    const iconUrl = useMemo(() => {
-        var _a, _b;
-        return ((_b = (_a = cardIconUrlMap[themeName]) === null || _a === void 0 ? void 0 : _a[type]) === null || _b === void 0 ? void 0 : _b.call(_a)) || '';
-    }, [type, themeName]);
-    const iconBgColor = useMemo(() => {
-        if (themeName !== 'marryBaby') {
-            return 'transparent';
-        }
-        return iconBgColorMap[type];
-    }, [type, themeName]);
-    function handleCardClick() {
-        onClick(type);
-    }
-    return (React__default.createElement("div", { onClick: handleCardClick, className: `${styles$3.navigationCard} ${className}` },
-        React__default.createElement("div", { className: styles$3.navigationCardIconWrapper, style: {
-                backgroundColor: iconBgColor,
-                backgroundImage: `url("${iconUrl}")`,
-            } }),
-        React__default.createElement("h3", { className: styles$3.navigationCardLabel }, t(`userProfile.nav.card.${type}`))));
-};
-
-const navMenuItemsHelloSites = () => [
-    {
-        key: 'userProfile.nav.menu.accountSettings',
-        icon: CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-settingsWheel.svg'),
-        subMenu: [
-            // {
-            //   key: 'common.profileNavigator.newsletterSubscription',
-            //   link: 'subscriptions',
-            //   disableLocale: [
-            //     'id-ID',
-            //     'ms-MY',
-            //     'km-KH',
-            //     'en-PH',
-            //     'tl-PH',
-            //     'th-TH',
-            //     'my-MM',
-            //     'zh-TW',
-            //     'hi-IN',
-            //   ],
-            // },
-            {
-                key: 'userProfile.nav.menu.password',
-                link: 'password',
-            },
-            {
-                key: 'userProfile.nav.menu.disableAccount',
-                link: 'disable-account',
-                disableLocale: ['hi-IN'],
-            },
-            {
-                key: 'userProfile.nav.menu.dataPrivacy',
-                link: 'data-privacy',
-                disableLocale: [
-                    // 'id-ID',
-                    'vi-VN',
-                    'ms-MY',
-                    'km-KH',
-                    'en-PH',
-                    'th-TH',
-                    'my-MM',
-                    'zh-TW',
-                    'hi-IN',
-                    'tl-PH',
-                    // 'vi-VN_MB',
-                ],
-            },
-        ],
-    },
-    {
-        key: 'userProfile.nav.menu.help',
-        icon: CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-helpCircle.svg'),
-        link: 'help',
-    },
-];
-const navMenuItemsMarryBaby = () => [
-    {
-        key: 'userProfile.nav.menu.password',
-        icon: CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-lock.svg'),
-        link: 'password',
-    },
-    {
-        key: 'userProfile.nav.menu.logout',
-        icon: CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-logOut.svg'),
-        link: 'logout',
-    },
-];
-
-var styles$2 = {"navMenu":"gn6HmGG","navMenuItem":"FCx8FEM","navMenuItemContent":"zMiRxaE","navMenuItemIcon":"lZ2Z9MQ","navMenuItemDropdown":"rwm-agG","navFooterSubMenu":"qMOscoq"};
-
-const NavMenu = ({ themeName, locale, onClickItem }) => {
-    const [openKey, setOpenKey] = useState('');
-    const navMenuItems = useMemo(() => themeName === 'marryBaby'
-        ? navMenuItemsMarryBaby()
-        : navMenuItemsHelloSites(), [themeName]);
-    function handleParentItemClick(item) {
-        if (item.subMenu) {
-            setOpenKey((k) => {
-                if (k) {
-                    return '';
-                }
-                return item.key;
-            });
-        }
-        else if (onClickItem) {
-            onClickItem(item);
-        }
-    }
-    return (React__default.createElement("div", { className: styles$2.navMenu }, navMenuItems.map((item) => (React__default.createElement(NavMenuItem, { key: item.key, item: item, openKey: openKey, onClickItem: handleParentItemClick, locale: locale })))));
-};
-const NavMenuItem = ({ item, openKey, onClickItem, locale, }) => {
-    var _a;
-    const { t } = useTranslations();
-    if ((_a = item.disableLocale) === null || _a === void 0 ? void 0 : _a.includes(locale)) {
-        return null;
-    }
-    return (React__default.createElement("div", { className: `${styles$2.navMenuItem} nav-menu-item`, "data-is-open": openKey === item.key, key: item.key, "data-has-submenu": !!item.subMenu },
-        React__default.createElement("div", { className: styles$2.navMenuItemContent, onClick: () => onClickItem(item) },
-            item.icon && (React__default.createElement("div", { className: styles$2.navMenuItemIcon, style: { backgroundImage: `url("${item.icon}")` } })),
-            t(item.key),
-            item.subMenu && (React__default.createElement("div", { className: styles$2.navMenuItemDropdown, style: {
-                    '--after-bg': `url(${CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-chevronDown.svg')})`,
-                } }))),
-        item.subMenu && (React__default.createElement("div", { className: styles$2.navFooterSubMenu }, item.subMenu.map((subItem) => (React__default.createElement(NavMenuItem, { key: subItem.key, item: subItem, openKey: openKey, onClickItem: onClickItem, locale: locale })))))));
-};
-
-var styles$1 = {"userNavScreen":"-AZt1au","navigationCardsWrapper":"IvSIfCI","navigationCard":"eahCJov","logoutButton":"XIyViFs"};
-
-var styles = {"userStats":"_4y-O0w3","wrapper":"kO8iNgD","header":"a1d4E10","headerIcon":"Tdguxxf","headerTitle":"-mOxsaU","headerPoints":"yPeDBNZ"};
-
-const rankIconUrlMap = {
-    helloSites: {
-        member: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-member.svg'),
-        ambassador: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-ambassador.svg'),
-        doctor: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-doctor.svg'),
-        expert: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-expert.svg'),
-        influencer: () => CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-influencer.svg'),
-    },
-    marryBaby: {
-        member: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-member.svg'),
-        ambassador: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-ambassador.svg'),
-        doctor: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-doctor.svg'),
-        expert: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-expert.svg'),
-        influencer: () => CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-influencer.svg'),
-    },
-};
-const UserStats = ({ themeName, rank = 'member', numberOfPosts = 0, }) => {
-    const { t } = useTranslations();
-    const iconUrl = useMemo(() => {
-        var _a, _b;
-        return ((_b = (_a = rankIconUrlMap[themeName]) === null || _a === void 0 ? void 0 : _a[rank]) === null || _b === void 0 ? void 0 : _b.call(_a)) || '';
-    }, [rank, themeName]);
-    return (React__default.createElement("div", { className: styles.userStats, "data-user-rank": rank },
-        React__default.createElement("div", { className: styles.wrapper },
-            React__default.createElement("div", { className: styles.header },
-                React__default.createElement("div", { className: styles.headerIcon, style: { backgroundImage: `url("${iconUrl}")` } }),
-                React__default.createElement("h3", { className: styles.headerTitle }, t(`userProfile.userRank.${rank}`)),
-                numberOfPosts > 0 && (React__default.createElement("p", { className: styles.headerPoints },
-                    numberOfPosts,
-                    " ",
-                    t('userProfile.nav.header.count.posts')))))));
-};
-
-const UserProfileNavigation = ({ SSO_URL, UP_BASEPATH = 'user', themeName = 'helloSites', cardUrls = INTERNAL_CARD_URLS, enableCare, enableTogether, enableEcom, enableMySaved, userInfo, togetherApiDomain, userPostsNumber, onClickNavigationCard, onClickMyProfileButton, onClickMenuItem, onClickLogout, isUserProfileNavigatorMenuHidden = false, isMyHealthEnabled = false, locale, }) => {
-    const { t } = useTranslations();
-    const [numberOfPosts, setNumberOfPosts] = useState(userPostsNumber || 0);
-    const isMarryBaby = themeName === 'marryBaby';
-    useEffect(() => {
-        if (userInfo && typeof userPostsNumber === 'undefined') {
-            const token = getCookie('hhg_user_token');
-            if (!!token) {
-                fetch(normalizeLinkSlash(getTogetherUserPostsApiPath(locale, isMarryBaby, togetherApiDomain)), {
-                    headers: {
-                        Authorization: `Bearer ${token}`,
-                    },
-                })
-                    .then((r) => r.json())
-                    .then((r) => {
-                    var _a, _b, _c;
-                    if ((r === null || r === void 0 ? void 0 : r.status) === 1 && ((_a = r === null || r === void 0 ? void 0 : r.data) === null || _a === void 0 ? void 0 : _a.pagination)) {
-                        setNumberOfPosts(((_c = (_b = r === null || r === void 0 ? void 0 : r.data) === null || _b === void 0 ? void 0 : _b.pagination) === null || _c === void 0 ? void 0 : _c.total_items) || 0);
-                    }
-                })
-                    .catch((err) => console.error('Error fetching post number', err));
-            }
-        }
-    }, [
-        locale,
-        userInfo !== null,
-        userPostsNumber,
-        togetherApiDomain,
-        isMarryBaby,
-    ]);
-    const cards = useMemo(() => {
-        let allCards;
-        if (isMarryBaby) {
-            allCards = ['myHealth', 'myCommunity', 'mySaved'];
-        }
-        else {
-            allCards = ['myHealth', 'mySaved', 'myBooking', 'myCommunity', 'eCom'];
-        }
-        return allCards.filter((cardType) => {
-            if (cardType === 'myBooking') {
-                return enableCare;
-            }
-            else if (cardType === 'myCommunity') {
-                return enableTogether;
-            }
-            else if (cardType === 'myHealth') {
-                return isMyHealthEnabled;
-            }
-            else if (cardType === 'eCom') {
-                return enableEcom;
-            }
-            else if (cardType === 'mySaved') {
-                return enableMySaved;
-            }
-            return true;
-        });
-    }, [isMarryBaby, isMyHealthEnabled]);
-    const logoutButton = useMemo(() => {
-        if (themeName === 'marryBaby') {
-            return null;
-        }
-        return (React__default.createElement(Button, { color: "tertiary", icon: React__default.createElement("img", { src: CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-logOut.svg'), width: 15, height: 15, loading: "lazy" }), size: "md", onClick: onClickLogout, className: styles$1.logoutButton }, t('userProfile.nav.menu.logout')));
-    }, [themeName]);
-    const push = (link) => {
-        if (link.startsWith('http') || link.startsWith('/')) {
-            // direct to external link
-            window.location.href = normalizeLink(link);
-        }
-        else if (SSO_URL) {
-            // relative link go to user profile
-            window.location.href = normalizeLink(`${SSO_URL}${UP_BASEPATH}/${link}`);
-        }
-    };
-    const handleClickMenuItem = (item) => {
-        if (item.link === 'logout' && onClickLogout) {
-            onClickLogout();
-        }
-        else if (item.link && !item.subMenu) {
-            if (onClickMenuItem) {
-                onClickMenuItem(item.link);
-            }
-            else {
-                push(item.link);
-            }
-        }
-    };
-    const handleClickCardItem = (item) => {
-        const url = cardUrls[item];
-        if (onClickNavigationCard) {
-            onClickNavigationCard(url);
-        }
-        else {
-            push(url);
-        }
-    };
-    const handleClickViewProfile = () => {
-        if (onClickMyProfileButton) {
-            onClickMyProfileButton();
-        }
-        else {
-            push('profile');
-        }
-    };
-    if (!userInfo) {
-        return null;
-    }
-    return (React__default.createElement("div", { className: styles$1.userNavScreen, "data-theme": themeName },
-        React__default.createElement(NavHeader, { userInfo: userInfo, themeName: themeName, onClickMyProfileButton: handleClickViewProfile }),
-        React__default.createElement(UserStats, { themeName: themeName, rank: "member", numberOfPosts: numberOfPosts }),
-        React__default.createElement("div", { className: styles$1.navigationCardsWrapper }, cards.map((cardType) => (React__default.createElement(NavigationCard, { className: styles$1.navigationCard, key: cardType, themeName: themeName, type: cardType, onClick: handleClickCardItem })))),
-        !isUserProfileNavigatorMenuHidden && (React__default.createElement(React__default.Fragment, null,
-            React__default.createElement(NavMenu, { themeName: themeName, locale: locale, onClickItem: handleClickMenuItem }),
-            logoutButton))));
-};
-
-export { NavHeader as N, UserProfileNavigation as U, UserStats as a };