@hhgtech/hhg-components 1.29.352 → 1.29.353-beta-1

package/build/esm/{index-80703bdc.js → index-92e68d51.js}

@@ -1,49 +1,49 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-9e18a176.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-2a44ed14.js';
 import React__default, { useMemo, useEffect, useContext, useState, useRef, useCallback } from 'react';
-import { V as VideoType } from './index-2c1c0db7.js';
-import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-10c9da74.js';
-import { a as CARE_LOCALES, b as CARE_BOOKING_LOCALES, T as TOGETHER_LOCALES, E as ECOM_LOCALES, c as VIDEO_LOCALES, S as STATIC_PAGES, L as LOCALE_SPECS } from './index-5d16c4a4.js';
-import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain, n as normalizeLink, e as normalizeLinkSlash, d as getCareApiDomain } from './normalizeLink-3041abfd.js';
-import { a as formatCommunity, b as formatPost } from './dataTransform-f4eab95f.js';
+import { V as VideoType } from './index-583213bd.js';
+import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-7388b613.js';
+import { a as CARE_LOCALES, b as CARE_BOOKING_LOCALES, T as TOGETHER_LOCALES, E as ECOM_LOCALES, c as VIDEO_LOCALES, S as STATIC_PAGES, L as LOCALE_SPECS } from './index-71b7c1b5.js';
+import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain, n as normalizeLink, e as normalizeLinkSlash, d as getCareApiDomain } from './normalizeLink-26afcd67.js';
+import { a as formatCommunity, b as formatPost } from './dataTransform-5440f981.js';
 import { Close, Download } from '@hhgtech/icons/core';
 import { createStyles, Box, Indicator, useMantineTheme } from '@mantine/core';
-import { L as Logo } from './index-61e7a6c8.js';
-import { u as useTranslations } from './index-4f0741ae.js';
+import { L as Logo } from './index-04b3dc70.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
 import throttle from 'lodash/throttle';
-import { I as Input } from './index-06da0f65.js';
+import { I as Input } from './index-84de7d41.js';
 import '@mantine/dates';
-import { C as CommonGAssets } from './index-555a9046.js';
-import './useMantineLocale-4ae0a2e9.js';
-import { T as Text } from './index-9963d708.js';
-import { B as Button$1 } from './index-6ea55015.js';
-import './index.styles-af8036e9.js';
-import './translationsContext-6bfa920d.js';
+import { C as CommonGAssets } from './index-545e734a.js';
+import './useMantineLocale-6ce444df.js';
+import { T as Text } from './index-313f51ec.js';
+import { B as Button$1 } from './index-e0e92d06.js';
+import './index.styles-92bb2d94.js';
+import './translationsContext-42e8ee6d.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-d19d3707.js';
-import './other-c0e87e58.js';
-import './index-e2782fc8.js';
-import { L as LOCALISED_SLUGS } from './constants-39004c38.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-3bc17b89.js';
+import './other-d86984c1.js';
+import './index-052e7087.js';
+import { L as LOCALISED_SLUGS } from './constants-529bce8b.js';
 import styled from '@emotion/styled';
-import { u as useCSSFocusPopupHelper, N as NavigationProfileButton } from './index-5f22e761.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-cb1d7cbc.js';
-import { B as Button } from './index-8dd2e87c.js';
-import { i as domainLocalesMarryBaby } from './utils-8a48b37a.js';
+import { u as useCSSFocusPopupHelper, N as NavigationProfileButton } from './index-afc5a0ae.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-3ac7d314.js';
+import { B as Button } from './index-8b9cff05.js';
+import { i as domainLocalesMarryBaby } from './utils-865e1ed9.js';
 import { domainLocales } from './constantsDomainLocales.js';
-import { L as LOCALIZED_SLUGS } from './constants-b0019567.js';
+import { L as LOCALIZED_SLUGS } from './constants-02251a84.js';
 import { theme } from './miscTheme.js';
-import { H as Heading } from './index-895950d8.js';
-import { I as Indicator$1 } from './index-6696c80e.js';
-import { u as useIsInit } from './useIsInit-79d74d60.js';
+import { H as Heading } from './index-dc085ca0.js';
+import { I as Indicator$1 } from './index-c0ffa732.js';
+import { u as useIsInit } from './useIsInit-30d9d255.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-47b10849.js';
+import { U as UserAvatar } from './index-173b93fd.js';
 import { ArrowRight } from '@hhgtech/icons/other';
 import formatString from 'string-format';
-import { C as Container } from './index-faec40ea.js';
-import { L as LOCALE } from './Locale-64252d6f.js';
+import { C as Container } from './index-d376738e.js';
+import { L as LOCALE } from './Locale-bd94657e.js';
 import debounce from 'lodash/debounce';
-import { g as getDataWithCache } from './core-7c56e1ab.js';
+import { g as getDataWithCache } from './core-49e21b7f.js';
 
 const getEcomUrl = ({ path, locale, }) => {
     var _a;
@@ -311,6 +311,7 @@ const StyledItem$6 = styled.a `
   .name {
     font-size: 16px;
     font-weight: 400;
+    line-height: 24px;
   }
 
   &[data-theme='marryBaby']:hover,
@@ -332,6 +333,17 @@ const StyledItem$6 = styled.a `
   }
 
   &[data-theme='marryBaby'] {
+    &.tarot-menu {
+      .icon {
+        background: linear-gradient(148deg, #fc5e9a 16.04%, #fe98bf 94.24%);
+      }
+      .name {
+        background: linear-gradient(91deg, #ea4f8a 1.24%, #fe8eb8 46.02%);
+        background-clip: text;
+        -webkit-background-clip: text;
+        -webkit-text-fill-color: transparent;
+      }
+    }
     .icon {
       display: flex;
       align-items: center;
@@ -453,7 +465,8 @@ const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuI
                         ? item === null || item === void 0 ? void 0 : item.link
                         : `${UrlFE}/${item === null || item === void 0 ? void 0 : item.link.split('/').filter(Boolean).join('/')}/`
                     : '/';
-                return (React__default.createElement(StyledItem$6, Object.assign({ className: "iconMenu", "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": href, "data-is-heading-category": false, "data-active": item.id && item.id === activeItem, "data-is-mobile-tool": item.isMobileAppTool, href: href }, (!isInternalLink(href) && {
+                const isTarotItem = (item === null || item === void 0 ? void 0 : item.id) === 'game' && siteType === 'marryBaby';
+                return (React__default.createElement(StyledItem$6, Object.assign({ className: `iconMenu ${isTarotItem ? 'tarot-menu' : ''}`, "data-event-category": "Hamburger Navigation", "data-event-action": "Click", "data-event-label": href, "data-is-heading-category": false, "data-active": item.id && item.id === activeItem, "data-is-mobile-tool": item.isMobileAppTool, href: href }, (!isInternalLink(href) && {
                     target: '_blank',
                 }), { "data-theme": siteType, key: index, onClick: onClosePopup }),
                     React__default.createElement("div", { className: "icon" },
@@ -470,7 +483,9 @@ const Categories = ({ hrefViewMore, titleBtnViewMore, UrlFE, onClosePopup, menuI
                                 paddingRight: item.isNew ? 10 : 0,
                             } },
                             React__default.createElement("p", { className: "name" }, item.name),
-                            item.isMobileAppTool && (React__default.createElement(Text, { size: "n1", color: theme.fn.primaryColor(), weight: "regular" }, t('home.calcWithApp'))))),
+                            item.isMobileAppTool && (React__default.createElement(Text, { size: "n1", color: theme.fn.primaryColor(), weight: (item === null || item === void 0 ? void 0 : item.id) && (item === null || item === void 0 ? void 0 : item.id) === activeItem
+                                    ? 'semiBold'
+                                    : 'regular' }, t('home.calcWithApp'))))),
                     item.isMobileAppTool && (React__default.createElement(StyledIconNav, null,
                         React__default.createElement(Phone, { className: "phone-icon", size: 16 }))),
                     React__default.createElement(StyledIconNav, { className: "arrow-icon" },
@@ -1541,10 +1556,8 @@ const MenuServiceList = ({ closePopup, menuItems = [] }) => {
 };
 
 const HamburgerMenu = ({ menuItems }) => {
-    const { siteType,
-    // configs: { enableSearchBar },
-     } = useContext(NavigationContext);
-    const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = useCSSFocusPopupHelper();
+    const { siteType, configs: { enableNavTarotGame }, } = useContext(NavigationContext);
+    const { containerRef, onContainerFocus, onContainerBlur, onButtonMouseDown, onClose, } = useCSSFocusPopupHelper({ enableNavTarotGame });
     return (React__default.createElement(DisplayWrapper, { mediaQueryKey: "mbDown" },
         React__default.createElement("header", { className: styles$2.menuContainer },
             React__default.createElement("div", { className: styles$2.menuIcon, ref: containerRef, role: "button", tabIndex: 0, onBlur: onContainerBlur, onFocus: onContainerFocus },
@@ -1663,7 +1676,7 @@ const StyledHeader = styled.div `
   ${MediaQueries.mbDown} {
     position: relative;
     height: 56px;
-    background: white;
+    background-color: ${(props) => props.isMarryBaby ? 'transparent' : '#fff'};
     gap: 2px;
   }
 
@@ -2123,7 +2136,7 @@ const ItemNavButton = ({ item, color = 'blue' }) => {
                 });
             }
             if (item.id === 'care') {
-                import('./doctor-e2971278.js').then((data) => {
+                import('./doctor-3fa046ce.js').then((data) => {
                     if (data === null || data === void 0 ? void 0 : data.default)
                         setIconJson(() => data.default);
                 });
@@ -2352,7 +2365,7 @@ const NavigationBar = ({ onTopBarAppears, languageMenu, menuItems, logoComponent
     const careNavItem = menuItems.find((m) => m.id === 'care');
     return (React__default.createElement(StyledHeaderWrapper, { "data-site-type": siteType, "data-sponsored": isSponsored, "data-sitewide-banner-shown": isShowingSiteWideBanner, "data-header-type": "home", "data-collapsed": isCollapsed, "data-is-displayed": true, id: "site-header", ref: headerRef },
         sitewideBanner,
-        React__default.createElement(StyledHeader, { "data-site-type": siteType },
+        React__default.createElement(StyledHeader, { "data-site-type": siteType, isMarryBaby: siteType === 'marryBaby' },
             React__default.createElement(StyledLeftGroup, { "data-site-type": siteType },
                 isMobile && React__default.createElement(HamburgerMenu, { menuItems: menuItems }),
                 logoComponent || (React__default.createElement("a", { style: {
@@ -2525,7 +2538,7 @@ const useInsider = () => {
 
 const useNavServices = () => {
     const { t } = useTranslations();
-    const { siteType, locale, configs: { enableNavDiscover, enableNavHealthTools, enableNavCare, enableNavTogether, enableNavEcom, enableNavVideo, statics, }, } = useContext(NavigationContext);
+    const { siteType, locale, configs: { enableNavDiscover, enableNavHealthTools, enableNavCare, enableNavTogether, enableNavEcom, enableNavVideo, enableNavTarotGame, statics, }, } = useContext(NavigationContext);
     const isMarryBaby = siteType === 'marryBaby';
     const services = useMemo(() => {
         var _a;
@@ -2586,8 +2599,22 @@ const useNavServices = () => {
                 thumbnail: CommonGAssets.getAssetPath('nav-icons/care.svg'),
                 popupType: locale === 'id-ID' ? 'care' : null,
             });
+        enableNavTarotGame &&
+            _services.push({
+                name: 'MỚI - Tarot cho mẹ bầu',
+                id: 'game',
+                link: normalizeLinkSlash(statics.HOME_PAGE_URL + '/xem-bai-tarot-online/'),
+                thumbnail: CommonGAssets.getAssetPath('play-card.svg'),
+                popupType: 'none',
+            });
         return _services;
-    }, []);
+    }, [
+        locale,
+        enableNavCare,
+        enableNavTogether,
+        enableNavEcom,
+        enableNavTarotGame,
+    ]);
     return services;
 };
 

package/build/esm/{index-390f903e.js → index-9ec944ba.js}

@@ -1,8 +1,8 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { useMemo } from 'react';
 import { Spoiler as Spoiler$1 } from '@mantine/core';
-import { T as Text } from './index-9963d708.js';
-import { u as useTranslations } from './index-4f0741ae.js';
+import { T as Text } from './index-313f51ec.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
 import { theme } from './miscTheme.js';
 
 const Spoiler = (_a) => {

package/build/esm/{index-239067c8.js → index-9fac577f.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default from 'react';
 import { Modal as Modal$1 } from '@mantine/core';
-import { u as useStyles } from './index.styles-af8036e9.js';
+import { u as useStyles } from './index.styles-92bb2d94.js';
 
 const Modal = (_a) => {
     var { styles, classNames, transitionProps } = _a, rest = __rest(_a, ["styles", "classNames", "transitionProps"]);

package/build/esm/{index-82b4b81d.js → index-a28086b9.js}

@@ -1,11 +1,11 @@
 import React__default, { useRef, useEffect } from 'react';
 import { Portal } from '@mantine/core';
-import { t as toggleNoScroll } from './utils-d19d3707.js';
+import { t as toggleNoScroll } from './utils-3bc17b89.js';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-a52444b1.js';
-import { T as Text } from './index-9963d708.js';
+import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-1de154cd.js';
+import { T as Text } from './index-313f51ec.js';
 
 const DURATION = '600ms';
 const generateStyleBasedOnPlacement = (placement, open) => {

package/build/esm/{index-7e9a7034.js → index-a2d9d681.js}

@@ -1,25 +1,25 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { createContext, useContext, useMemo } from 'react';
 import { useMantineTheme } from '@mantine/core';
 import { useForm, isNotEmpty } from '@mantine/form';
-import { u as useHealthToolsCache } from './useHealthToolCache-5331ca8a.js';
-import { u as useTranslations } from './index-4f0741ae.js';
-import { H as HEALTH_TOOL_TYPE } from './constants-2483d488.js';
-import { I as Input } from './index-06da0f65.js';
+import { u as useHealthToolsCache } from './useHealthToolCache-7fbf7260.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
+import { H as HEALTH_TOOL_TYPE } from './constants-26c1fb1d.js';
+import { I as Input } from './index-84de7d41.js';
 import '@mantine/dates';
-import './index-5d16c4a4.js';
-import './index-2c1c0db7.js';
-import './index-555a9046.js';
-import './useMantineLocale-4ae0a2e9.js';
-import './index-9963d708.js';
-import './index-6ea55015.js';
-import './index.styles-af8036e9.js';
+import './index-71b7c1b5.js';
+import './index-583213bd.js';
+import './index-545e734a.js';
+import './useMantineLocale-6ce444df.js';
+import './index-313f51ec.js';
+import './index-e0e92d06.js';
+import './index.styles-92bb2d94.js';
 import '@mantine/hooks';
-import './utils-d19d3707.js';
-import './other-c0e87e58.js';
-import './index-e2782fc8.js';
-import { H as HealthToolFormWrapper } from './index-4e63da8b.js';
-import { I as INPUT_RANGE } from './constants-ece6384f.js';
+import './utils-3bc17b89.js';
+import './other-d86984c1.js';
+import './index-052e7087.js';
+import { H as HealthToolFormWrapper } from './index-91cde949.js';
+import { I as INPUT_RANGE } from './constants-ce088018.js';
 import { domainLocales } from './constantsDomainLocales.js';
 
 const PWGFormContext = createContext({});

package/build/esm/{index-f2c4758a.js → index-a32785ee.js}

@@ -1,13 +1,13 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { useState, useCallback, useMemo, useEffect } from 'react';
 import { clsx } from '@mantine/core';
 import { Drawer } from 'vaul';
 import styled from '@emotion/styled';
-import { Z as ZINDEX_SSO } from './index-5d16c4a4.js';
+import { Z as ZINDEX_SSO } from './index-71b7c1b5.js';
 
 const StyledDrawerComponentContent = styled(Drawer.Content) `
   position: fixed;
-  z-index: ${ZINDEX_SSO + 2};
+  z-index: ${ZINDEX_SSO - 9e6 + 1};
   inset: 0;
   background-color: #fff;
   outline: none !important;
@@ -49,7 +49,7 @@ const StyledDrawerComponentContent = styled(Drawer.Content) `
 const StyledDrawerComponentOverlay = styled(Drawer.Overlay) `
   position: fixed;
   inset: 0;
-  z-index: ${ZINDEX_SSO + 2};
+  z-index: ${ZINDEX_SSO - 9e6};
   width: 100%;
   max-height: 100%;
 
@@ -59,7 +59,7 @@ const StyledDrawerComponentOverlay = styled(Drawer.Overlay) `
 `;
 
 const DrawerComponent = (props) => {
-    const { open: openProps, onOpenChange: onOpenChangeProps, snapPoints, activeSnapPoint, setActiveSnapPoint, children, overlayClassName, className } = props, restProps = __rest(props, ["open", "onOpenChange", "snapPoints", "activeSnapPoint", "setActiveSnapPoint", "children", "overlayClassName", "className"]);
+    const { open: openProps, onOpenChange: onOpenChangeProps, snapPoints, activeSnapPoint, setActiveSnapPoint, children, overlayClassName, className, fadeFromIndex = ZINDEX_SSO - 9e6 } = props, restProps = __rest(props, ["open", "onOpenChange", "snapPoints", "activeSnapPoint", "setActiveSnapPoint", "children", "overlayClassName", "className", "fadeFromIndex"]);
     const [open, setOpen] = useState(openProps);
     const [snap, setSnap] = useState(snapPoints ? snapPoints === null || snapPoints === void 0 ? void 0 : snapPoints[0] : null);
     const onOpenChange = useCallback((_open) => {
@@ -73,7 +73,11 @@ const DrawerComponent = (props) => {
         return open;
     }, [snap, snapPoints]);
     const mergedProps = useMemo(() => {
-        const _mergedProps = { open, onOpenChange };
+        const _mergedProps = {
+            open,
+            onOpenChange,
+            fadeFromIndex,
+        };
         if (snapPoints && (snapPoints === null || snapPoints === void 0 ? void 0 : snapPoints.length)) {
             _mergedProps.snapPoints = snapPoints;
             _mergedProps.activeSnapPoint = snap;
@@ -83,7 +87,15 @@ const DrawerComponent = (props) => {
             };
         }
         return _mergedProps;
-    }, [open, onOpenChange, snap, setSnap, setActiveSnapPoint, snapPoints]);
+    }, [
+        open,
+        onOpenChange,
+        snap,
+        setSnap,
+        setActiveSnapPoint,
+        snapPoints,
+        fadeFromIndex,
+    ]);
     useEffect(() => {
         setOpen(openProps);
     }, [openProps]);

package/build/esm/{index-1d9e853a.js → index-a79576ee.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { useState } from 'react';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-d19d3707.js';
+import { M as MediaQueries } from './utils-3bc17b89.js';
 import { theme } from './miscTheme.js';
-import { L as Label, S as StyledDisplayIcon, a as StyledActionIcon, b as StyledErrorLabel } from './index-3eb3cc56.js';
+import { L as Label, S as StyledDisplayIcon, a as StyledActionIcon, b as StyledErrorLabel } from './index-3ddabe8b.js';
 
 const StyledInput = styled.div `
   position: relative;

package/build/esm/{index-ce33a9ef.js → index-ab8da35d.js}

@@ -1,20 +1,20 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { createContext, useContext } from 'react';
 import { useMantineTheme, Flex, rem, Box, createStyles } from '@mantine/core';
-import { t as themeColors } from './index-06da0f65.js';
+import { t as themeColors } from './index-84de7d41.js';
 import '@mantine/dates';
-import './index-5d16c4a4.js';
-import './index-2c1c0db7.js';
-import './index-555a9046.js';
-import './useMantineLocale-4ae0a2e9.js';
-import { T as Text } from './index-9963d708.js';
-import './index-6ea55015.js';
-import './index.styles-af8036e9.js';
-import { u as useTranslations } from './index-4f0741ae.js';
+import './index-71b7c1b5.js';
+import './index-583213bd.js';
+import './index-545e734a.js';
+import './useMantineLocale-6ce444df.js';
+import { T as Text } from './index-313f51ec.js';
+import './index-e0e92d06.js';
+import './index.styles-92bb2d94.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
 import '@mantine/hooks';
-import { M as MediaQueries } from './utils-d19d3707.js';
-import './other-c0e87e58.js';
-import './index-e2782fc8.js';
+import { M as MediaQueries } from './utils-3bc17b89.js';
+import './other-d86984c1.js';
+import './index-052e7087.js';
 import styled from '@emotion/styled';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 

package/build/esm/{index-49d3d319.js → index-ae42319b.js}

@@ -1,6 +1,6 @@
 import React__default from 'react';
-import { u as useTranslations } from './index-4f0741ae.js';
-import { B as Button } from './index-8dd2e87c.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
+import { B as Button } from './index-8b9cff05.js';
 
 var styles = {"loading":"PD6nRZX"};
 

package/build/esm/{index-5f22e761.js → index-afc5a0ae.js}

@@ -1,23 +1,23 @@
-import { a as __awaiter } from './tslib.es6-9e18a176.js';
+import { a as __awaiter } from './tslib.es6-2a44ed14.js';
 import React__default, { useRef, useState, useMemo } from 'react';
 import { User } from '@hhgtech/icons/core';
-import { S as Spinner } from './Spinner-63b6e515.js';
-import { a as Avatar } from './index-06da0f65.js';
-import { B as Button } from './index-6ea55015.js';
-import { T as Text } from './index-9963d708.js';
-import { u as useTranslations } from './index-4f0741ae.js';
-import './index-2c1c0db7.js';
-import { C as CommonGAssets } from './index-555a9046.js';
+import { S as Spinner } from './Spinner-7e9486a7.js';
+import { a as Avatar } from './index-84de7d41.js';
+import { B as Button } from './index-e0e92d06.js';
+import { T as Text } from './index-313f51ec.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
+import './index-583213bd.js';
+import { C as CommonGAssets } from './index-545e734a.js';
 import { theme } from './miscTheme.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-d19d3707.js';
+import { M as MediaQueries } from './utils-3bc17b89.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import { ProfileNavigation } from './profileNavigation.js';
 import { NavigationLogoutPopup } from './navigationLogoutPopup.js';
-import { L as LOCALE } from './Locale-64252d6f.js';
+import { L as LOCALE } from './Locale-bd94657e.js';
 
 const useCSSFocusPopupHelper = (configs) => {
-    const { allowBgScroll } = configs || {};
+    const { allowBgScroll, enableNavTarotGame = false } = configs || {};
     const ref = useRef();
     return {
         containerRef: ref,
@@ -31,9 +31,16 @@ const useCSSFocusPopupHelper = (configs) => {
         },
         onButtonMouseDown: (e) => {
             // this close popup when click, run after REact init
+            const elmSiteHeader = document.querySelector('#site-header');
+            if (enableNavTarotGame && elmSiteHeader) {
+                elmSiteHeader.style.backgroundColor = '#fff';
+            }
             if (ref.current &&
                 (document.activeElement === ref.current ||
                     ref.current.contains(document.activeElement))) {
+                if (enableNavTarotGame && elmSiteHeader) {
+                    elmSiteHeader.style.backgroundColor = 'transparent';
+                }
                 ref.current.blur();
                 document.activeElement.blur();
                 e.preventDefault();

package/build/esm/{index-0e13b7c2.js → index-b785d54e.js}

@@ -1,48 +1,48 @@
-import { a as __awaiter, _ as __rest } from './tslib.es6-9e18a176.js';
+import { a as __awaiter, _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { useState, useRef, useEffect, useCallback, useContext, useMemo } from 'react';
 import { Info, Ask } from '@hhgtech/icons/other';
-import { D as Dropdown } from './index-2d65f62b.js';
-import { u as useTranslations } from './index-4f0741ae.js';
+import { D as Dropdown } from './index-c2856de5.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
 import innertext from 'innertext';
 import { theme } from './miscTheme.js';
-import { I as Input$1 } from './index-06da0f65.js';
+import { I as Input$1 } from './index-84de7d41.js';
 import { useMantineTheme, Switch, Popover } from '@mantine/core';
 import '@mantine/dates';
-import './index-5d16c4a4.js';
-import './index-2c1c0db7.js';
-import './index-555a9046.js';
-import './useMantineLocale-4ae0a2e9.js';
-import { T as Text } from './index-9963d708.js';
-import { B as Button } from './index-6ea55015.js';
-import './index.styles-af8036e9.js';
+import './index-71b7c1b5.js';
+import './index-583213bd.js';
+import './index-545e734a.js';
+import './useMantineLocale-6ce444df.js';
+import { T as Text } from './index-313f51ec.js';
+import { B as Button } from './index-e0e92d06.js';
+import './index.styles-92bb2d94.js';
 import '@mantine/hooks';
-import { M as MediaQueries } from './utils-d19d3707.js';
-import './other-c0e87e58.js';
-import './index-e2782fc8.js';
-import { u as useImagePicker, a as PopupFrame, c as IconCloseCircle, g as getDefaultFailNoti, d as getPostFormData, e as editPost, f as createPost } from './index-5db04017.js';
-import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, p as getCurrentHref, b as callApiWithAuth, q as callApiWithAdminAuth, r as getChatbotAiApiPath } from './utils-8a48b37a.js';
+import { M as MediaQueries } from './utils-3bc17b89.js';
+import './other-d86984c1.js';
+import './index-052e7087.js';
+import { u as useImagePicker, a as PopupFrame, c as IconCloseCircle, g as getDefaultFailNoti, d as getPostFormData, e as editPost, f as createPost } from './index-77c41b72.js';
+import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, p as getCurrentHref, b as callApiWithAuth, q as callApiWithAdminAuth, r as getChatbotAiApiPath } from './utils-865e1ed9.js';
 import styled from '@emotion/styled';
-import { b as formatPost, a as formatCommunity, c as formatTopic } from './dataTransform-f4eab95f.js';
-import { M as MAX_IMAGE_UPLOADS, B as BEARER_TOKEN_COOKIE } from './constants-2483d488.js';
-import { h as highlightBadWords, f as fixMalformedMention, r as removeFontFormat, a as removeEdittedBannedWord, w as wrapAnchorAroundUrls, g as getUrlsFromEditorString, A as ALLOW_DOMAIN_URL, e as escapeRegExp, d as decodeMention, b as decodePostUrl, c as reformatUrl, i as getMentionIdsFromString, L as LIMIT_MENTION } from './post-68d98a9f.js';
-import { C as CardAuthor } from './index-dc213a5a.js';
-import { S as StyledCreatePostDescription$1, R as RichTextEditor$1, I as IconLink } from './editor-1363dd5e.js';
-import { I as Input } from './index-3eb3cc56.js';
+import { b as formatPost, a as formatCommunity, c as formatTopic } from './dataTransform-5440f981.js';
+import { M as MAX_IMAGE_UPLOADS, B as BEARER_TOKEN_COOKIE } from './constants-26c1fb1d.js';
+import { h as highlightBadWords, f as fixMalformedMention, r as removeFontFormat, a as removeEdittedBannedWord, w as wrapAnchorAroundUrls, g as getUrlsFromEditorString, A as ALLOW_DOMAIN_URL, e as escapeRegExp, d as decodeMention, b as decodePostUrl, c as reformatUrl, i as getMentionIdsFromString, L as LIMIT_MENTION } from './post-ad8fc415.js';
+import { C as CardAuthor } from './index-f9202032.js';
+import { S as StyledCreatePostDescription$1, R as RichTextEditor$1, I as IconLink } from './editor-882943b0.js';
+import { I as Input } from './index-3ddabe8b.js';
 import debounce from 'lodash/debounce';
 import ContentEditable from 'react-contenteditable';
 import { PATHS, ADMIN_PATHS } from './togetherApiPaths.js';
-import { L as Loading } from './index-66f0469e.js';
-import { C as CardLink } from './index-ea254a93.js';
-import { B as BtnChoice } from './index-e79629c6.js';
-import { L as LOCALE } from './Locale-64252d6f.js';
+import { L as Loading } from './index-f8f1b00a.js';
+import { C as CardLink } from './index-f13cc742.js';
+import { B as BtnChoice } from './index-c6ccedbb.js';
+import { L as LOCALE } from './Locale-bd94657e.js';
 import * as ReactDOM from 'react-dom';
-import { L as Loading$1 } from './index-65895e98.js';
-import { b as IconArrowLeft } from './index-e2a22dd0.js';
-import { B as Button$1 } from './index-8dd2e87c.js';
+import { L as Loading$1 } from './index-d9060488.js';
+import { b as IconArrowLeft } from './index-84806cde.js';
+import { B as Button$1 } from './index-8b9cff05.js';
 import { getCookie } from './miscCookieHelper.js';
-import { a as useUniqueId } from './useUniqueId-90ff9a41.js';
-import { U as UserAvatar } from './index-47b10849.js';
-import { P as PopoverMenu } from './index-2b3b972d.js';
+import { a as useUniqueId } from './useUniqueId-181cc22e.js';
+import { U as UserAvatar } from './index-173b93fd.js';
+import { P as PopoverMenu } from './index-c8070250.js';
 import { Close, Check } from '@hhgtech/icons/core';
 
 const StyledCreateNewPost$1 = styled.div `

package/build/esm/{index-b8f30871.js → index-b899f5f1.js}

@@ -1,23 +1,23 @@
-import { _ as __rest } from './tslib.es6-9e18a176.js';
+import { _ as __rest } from './tslib.es6-2a44ed14.js';
 import React__default, { createContext, useContext } from 'react';
 import { useMantineTheme } from '@mantine/core';
 import { useForm, isNotEmpty } from '@mantine/form';
-import './index-06da0f65.js';
-import { D as DatePicker } from './index-2360a528.js';
-import './index-9963d708.js';
-import './index-6ea55015.js';
-import './index.styles-af8036e9.js';
-import { u as useTranslations } from './index-4f0741ae.js';
+import './index-84de7d41.js';
+import { D as DatePicker } from './index-7e20015a.js';
+import './index-313f51ec.js';
+import './index-e0e92d06.js';
+import './index.styles-92bb2d94.js';
+import { u as useTranslations } from './index-d8ae3e9b.js';
 import '@mantine/hooks';
-import './useMantineLocale-4ae0a2e9.js';
-import './index-2c1c0db7.js';
-import './index-555a9046.js';
-import './utils-d19d3707.js';
-import './index-5d16c4a4.js';
-import './other-c0e87e58.js';
-import './index-e2782fc8.js';
-import { H as HealthToolFormWrapper } from './index-4e63da8b.js';
-import { G as GenderOptionControl } from './index-ab1f5d78.js';
+import './useMantineLocale-6ce444df.js';
+import './index-583213bd.js';
+import './index-545e734a.js';
+import './utils-3bc17b89.js';
+import './index-71b7c1b5.js';
+import './other-d86984c1.js';
+import './index-052e7087.js';
+import { H as HealthToolFormWrapper } from './index-91cde949.js';
+import { G as GenderOptionControl } from './index-66b57f24.js';
 import { CalendarMB } from '@hhgtech/icons/other';
 
 const BabyVaccineFormContext = createContext({});