@hhgtech/hhg-components 1.29.133 → 1.29.135

package/build/{index-79c4bc9d.js → index-2869b1c0.js}

@@ -1,11 +1,11 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-df02c56c.js');
+var tslib_es6 = require('./tslib.es6-47d67e4a.js');
 var React = require('react');
 var core = require('@mantine/core');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var utils = require('./utils-e210bc6d.js');
+var utils = require('./utils-3e457c21.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-2cb21706.js → index-37f0e64e.js}

@@ -1,27 +1,27 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-df02c56c.js');
+var tslib_es6 = require('./tslib.es6-47d67e4a.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var useHealthToolCache = require('./useHealthToolCache-7f0c5e6f.js');
-var useTranslations = require('./useTranslations-9e0af18e.js');
-var constants$1 = require('./constants-596c022d.js');
-var index$1 = require('./index-fdc49362.js');
+var useHealthToolCache = require('./useHealthToolCache-e5cefbfb.js');
+var index = require('./index-53b9a5ed.js');
+var constants$1 = require('./constants-c7ece436.js');
+var index$2 = require('./index-1e469a64.js');
 require('@mantine/dates');
-require('./index-d4c38659.js');
-require('./index-9cfee4c5.js');
-require('./index-aa02edde.js');
-require('./useMantineLocale-60b9eddd.js');
-require('./index-1ab696a1.js');
-require('./index-3f644168.js');
-require('./index.styles-22f2187e.js');
+require('./index-f49e8023.js');
+require('./index-4a39b1e7.js');
+require('./index-76e88882.js');
+require('./useMantineLocale-b6730670.js');
+require('./index-ce9a0d0b.js');
+require('./index-f5b2b3bf.js');
+require('./index.styles-575a2293.js');
 require('@mantine/hooks');
-require('./utils-e210bc6d.js');
-require('./other-d0af0028.js');
-require('./index-151b9037.js');
-var index = require('./index-ab723e6b.js');
-var constants = require('./constants-e9520349.js');
+require('./utils-3e457c21.js');
+require('./other-06d775ca.js');
+require('./index-f47b3df8.js');
+var index$1 = require('./index-81150842.js');
+var constants = require('./constants-51b63c53.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -32,87 +32,87 @@ const PWGFormContext = React.createContext({});
 
 const DefaultForm = (_a) => {
     var props = tslib_es6.__rest(_a, []);
-    const { t, locale } = useTranslations.useTranslations();
+    const { t, locale } = index.useTranslations();
     const { linkTool, form, submitProps } = React.useContext(PWGFormContext);
     const theme = core.useMantineTheme();
     const isMarryBaby = theme.other.template === 'mb';
-    return (React__default["default"].createElement(index.HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props),
-        React__default["default"].createElement(index$1.Input.Number, Object.assign({ label: t('pregnancyWeightGain.weekInput'), min: constants.INPUT_RANGE.pregnantWeek.min, max: constants.INPUT_RANGE.pregnantWeek.max, placeholder: `${constants.INPUT_RANGE.pregnantWeek.min} - ${constants.INPUT_RANGE.pregnantWeek.max}` }, form.getInputProps('pregnantWeek'))),
-        React__default["default"].createElement(index$1.Input.Number, Object.assign({ label: t('pregnancyWeightGain.weightBeforeInput'), min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
+    return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props),
+        React__default["default"].createElement(index$2.Input.Number, Object.assign({ label: t('pregnancyWeightGain.weekInput'), min: constants.INPUT_RANGE.pregnantWeek.min, max: constants.INPUT_RANGE.pregnantWeek.max, placeholder: `${constants.INPUT_RANGE.pregnantWeek.min} - ${constants.INPUT_RANGE.pregnantWeek.max}` }, form.getInputProps('pregnantWeek'))),
+        React__default["default"].createElement(index$2.Input.Number, Object.assign({ label: t('pregnancyWeightGain.weightBeforeInput'), min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
                 content: '50',
             }) }, form.getInputProps('lastWeight'))),
-        React__default["default"].createElement(index$1.Input.Number, Object.assign({ label: t('pregnancyWeightGain.heightInput'), min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max, placeholder: t('tools.inputPlaceholder', {
+        React__default["default"].createElement(index$2.Input.Number, Object.assign({ label: t('pregnancyWeightGain.heightInput'), min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max, placeholder: t('tools.inputPlaceholder', {
                 content: '160',
             }) }, form.getInputProps('height'))),
-        React__default["default"].createElement(index$1.Input.Number, Object.assign({ label: t('pregnancyWeightGain.weightInput'), min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
+        React__default["default"].createElement(index$2.Input.Number, Object.assign({ label: t('pregnancyWeightGain.weightInput'), min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
                 content: '50',
             }) }, form.getInputProps('weight'))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.Switching, Object.assign({ label: t('pregnancyWeightGain.havingTwins') }, form.getInputProps('hasTwin'))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "Embedded Pregnancy Weight Gain", dataEventLabel: `https://${constantsDomainLocales.domainLocales[isMarryBaby ? 'vi-VN_MB' : locale]}/${linkTool}`, className: "due-date-calculate-button" }, submitProps), t('dueDatePage.lastPeriod.calculate'))));
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.Switching, Object.assign({ label: t('pregnancyWeightGain.havingTwins') }, form.getInputProps('hasTwin'))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "Embedded Pregnancy Weight Gain", dataEventLabel: `https://${constantsDomainLocales.domainLocales[isMarryBaby ? 'vi-VN_MB' : locale]}/${linkTool}`, className: "due-date-calculate-button" }, submitProps), t('dueDatePage.lastPeriod.calculate'))));
 };
 
 const InlineForm = (_a) => {
     var props = tslib_es6.__rest(_a, []);
-    const { t, locale } = useTranslations.useTranslations();
+    const { t, locale } = index.useTranslations();
     const { linkTool, form, submitProps } = React.useContext(PWGFormContext);
     const theme = core.useMantineTheme();
     const isMarryBaby = theme.other.template === 'mb';
-    return (React__default["default"].createElement(index.HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props),
-        React__default["default"].createElement(index.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.weekInput') },
-            React__default["default"].createElement(index$1.Input.Number, Object.assign({ min: constants.INPUT_RANGE.pregnantWeek.min, max: constants.INPUT_RANGE.pregnantWeek.max, placeholder: `${constants.INPUT_RANGE.pregnantWeek.min} - ${constants.INPUT_RANGE.pregnantWeek.max}`, rightSection: React__default["default"].createElement(index.HealthToolFormWrapper.Unit, null, t('pwgForm.week')) }, form.getInputProps('pregnantWeek')))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.weightBeforeInput') },
-            React__default["default"].createElement(index$1.Input.Number, Object.assign({}, form.getInputProps('lastWeight'), { min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
+    return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.weekInput') },
+            React__default["default"].createElement(index$2.Input.Number, Object.assign({ min: constants.INPUT_RANGE.pregnantWeek.min, max: constants.INPUT_RANGE.pregnantWeek.max, placeholder: `${constants.INPUT_RANGE.pregnantWeek.min} - ${constants.INPUT_RANGE.pregnantWeek.max}`, rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('pwgForm.week')) }, form.getInputProps('pregnantWeek')))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.weightBeforeInput') },
+            React__default["default"].createElement(index$2.Input.Number, Object.assign({}, form.getInputProps('lastWeight'), { min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
                     content: '50',
-                }), rightSection: React__default["default"].createElement(index.HealthToolFormWrapper.Unit, null, t('babyGrowth.kg')) }))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.heightInput') },
-            React__default["default"].createElement(index$1.Input.Number, Object.assign({}, form.getInputProps('height'), { min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max, placeholder: t('tools.inputPlaceholder', {
+                }), rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('babyGrowth.kg')) }))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.heightInput') },
+            React__default["default"].createElement(index$2.Input.Number, Object.assign({}, form.getInputProps('height'), { min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max, placeholder: t('tools.inputPlaceholder', {
                     content: '160',
-                }), rightSection: React__default["default"].createElement(index.HealthToolFormWrapper.Unit, null, t('babyGrowth.cm')) }))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.weightInput') },
-            React__default["default"].createElement(index$1.Input.Number, Object.assign({}, form.getInputProps('weight'), { min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
+                }), rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('babyGrowth.cm')) }))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.weightInput') },
+            React__default["default"].createElement(index$2.Input.Number, Object.assign({}, form.getInputProps('weight'), { min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max, placeholder: t('tools.inputPlaceholder', {
                     content: '50',
-                }), rightSection: React__default["default"].createElement(index.HealthToolFormWrapper.Unit, null, t('babyGrowth.kg')) }))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.havingTwins'), width: 'none' },
-            React__default["default"].createElement(index.HealthToolFormWrapper.Switching, Object.assign({}, form.getInputProps('hasTwin')))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "Embedded Pregnancy Weight Gain", dataEventLabel: `https://${constantsDomainLocales.domainLocales[isMarryBaby ? 'vi-VN_MB' : locale]}/${linkTool}`, className: "due-date-calculate-button" }, submitProps), t('dueDatePage.lastPeriod.calculate'))));
+                }), rightSection: React__default["default"].createElement(index$1.HealthToolFormWrapper.Unit, null, t('babyGrowth.kg')) }))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderInlineControl, { label: t('pregnancyWeightGain.havingTwins'), width: 'none' },
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.Switching, Object.assign({}, form.getInputProps('hasTwin')))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "Embedded Pregnancy Weight Gain", dataEventLabel: `https://${constantsDomainLocales.domainLocales[isMarryBaby ? 'vi-VN_MB' : locale]}/${linkTool}`, className: "due-date-calculate-button" }, submitProps), t('dueDatePage.lastPeriod.calculate'))));
 };
 
 const MbLayout = (_a) => {
     var props = tslib_es6.__rest(_a, []);
-    const { t, locale } = useTranslations.useTranslations();
+    const { t, locale } = index.useTranslations();
     const { linkTool, form, submitProps } = React.useContext(PWGFormContext);
     const theme = core.useMantineTheme();
     const isMarryBaby = theme.other.template === 'mb';
-    return (React__default["default"].createElement(index.HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props),
-        React__default["default"].createElement(index.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.weekInput'), rightSection: t('pregnancy.week') },
-                React__default["default"].createElement(index$1.Input.Number, Object.assign({ min: constants.INPUT_RANGE.pregnantWeek.min, max: constants.INPUT_RANGE.pregnantWeek.max, placeholder: `${constants.INPUT_RANGE.pregnantWeek.min} - ${constants.INPUT_RANGE.pregnantWeek.max}` }, form.getInputProps('pregnantWeek')))),
-            form.errors.pregnantWeek && (React__default["default"].createElement(index.HealthToolFormWrapper.Error, null, form.errors.pregnantWeek))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.weightBeforeInput'), rightSection: "kg" },
-                React__default["default"].createElement(index$1.Input.Number, Object.assign({ min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max }, form.getInputProps('lastWeight'), { placeholder: t('tools.inputPlaceholder', {
+    return (React__default["default"].createElement(index$1.HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.weekInput'), rightSection: t('pregnancy.week') },
+                React__default["default"].createElement(index$2.Input.Number, Object.assign({ min: constants.INPUT_RANGE.pregnantWeek.min, max: constants.INPUT_RANGE.pregnantWeek.max, placeholder: `${constants.INPUT_RANGE.pregnantWeek.min} - ${constants.INPUT_RANGE.pregnantWeek.max}` }, form.getInputProps('pregnantWeek')))),
+            form.errors.pregnantWeek && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.pregnantWeek))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.weightBeforeInput'), rightSection: "kg" },
+                React__default["default"].createElement(index$2.Input.Number, Object.assign({ min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max }, form.getInputProps('lastWeight'), { placeholder: t('tools.inputPlaceholder', {
                         content: '50',
                     }) }))),
-            form.errors.lastWeight && (React__default["default"].createElement(index.HealthToolFormWrapper.Error, null, form.errors.lastWeight))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.heightInput'), rightSection: "cm" },
-                React__default["default"].createElement(index$1.Input.Number, Object.assign({ min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max }, form.getInputProps('height'), { placeholder: t('tools.inputPlaceholder', {
+            form.errors.lastWeight && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.lastWeight))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.heightInput'), rightSection: "cm" },
+                React__default["default"].createElement(index$2.Input.Number, Object.assign({ min: constants.INPUT_RANGE.height.min, max: constants.INPUT_RANGE.height.max }, form.getInputProps('height'), { placeholder: t('tools.inputPlaceholder', {
                         content: '160',
                     }) }))),
-            form.errors.height && (React__default["default"].createElement(index.HealthToolFormWrapper.Error, null, form.errors.height))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.FormRow, null,
-            React__default["default"].createElement(index.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.weightInput'), rightSection: "kg" },
-                React__default["default"].createElement(index$1.Input.Number, Object.assign({ min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max }, form.getInputProps('weight'), { placeholder: t('tools.inputPlaceholder', {
+            form.errors.height && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.height))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.FormRow, null,
+            React__default["default"].createElement(index$1.HealthToolFormWrapper.BorderBoxControl, { label: t('pregnancyWeightGain.weightInput'), rightSection: "kg" },
+                React__default["default"].createElement(index$2.Input.Number, Object.assign({ min: constants.INPUT_RANGE.weight.min, max: constants.INPUT_RANGE.weight.max }, form.getInputProps('weight'), { placeholder: t('tools.inputPlaceholder', {
                         content: '50',
                     }) }))),
-            form.errors.weight && (React__default["default"].createElement(index.HealthToolFormWrapper.Error, null, form.errors.weight))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.Switching, Object.assign({ label: t('pregnancyWeightGain.havingTwins') }, form.getInputProps('hasTwin'))),
-        React__default["default"].createElement(index.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "Embedded Pregnancy Weight Gain", dataEventLabel: `https://${constantsDomainLocales.domainLocales[isMarryBaby ? 'vi-VN_MB' : locale]}/${linkTool}`, className: "due-date-calculate-button" }, submitProps), t('dueDatePage.lastPeriod.calculate'))));
+            form.errors.weight && (React__default["default"].createElement(index$1.HealthToolFormWrapper.Error, null, form.errors.weight))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.Switching, Object.assign({ label: t('pregnancyWeightGain.havingTwins') }, form.getInputProps('hasTwin'))),
+        React__default["default"].createElement(index$1.HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "Embedded Pregnancy Weight Gain", dataEventLabel: `https://${constantsDomainLocales.domainLocales[isMarryBaby ? 'vi-VN_MB' : locale]}/${linkTool}`, className: "due-date-calculate-button" }, submitProps), t('dueDatePage.lastPeriod.calculate'))));
 };
 
 const PWGForm = (_a) => {
     var { formLayout = 'default', submitProps, onSubmit } = _a, rest = tslib_es6.__rest(_a, ["formLayout", "submitProps", "onSubmit"]);
-    const { t, locale } = useTranslations.useTranslations();
+    const { t, locale } = index.useTranslations();
     const theme = core.useMantineTheme();
     const isMarryBaby = theme.other.template === 'mb';
     const form$1 = form.useForm({

package/build/{index-8c477dfe.js → index-45ec86f5.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-df02c56c.js');
+var tslib_es6 = require('./tslib.es6-47d67e4a.js');
 var React = require('react');
 var styled = require('@emotion/styled');
 

package/build/{index-9cfee4c5.js → index-4a39b1e7.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var Locale = require('./Locale-7a688288.js');
+var Locale = require('./Locale-a2291568.js');
 
 exports.Gender = void 0;
 (function (Gender) {

package/build/{index-de655e79.js → index-4ca36edc.js}

@@ -1,8 +1,8 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-4c87c3c3.js');
-var togetherComponentGlobalContext = require('./utils-cb71a1c8.js');
+var index = require('./index-ed1c09df.js');
+var togetherComponentGlobalContext = require('./utils-362e4f85.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
 

package/build/{index-19be3db7.js → index-4f88181c.js}

@@ -1,14 +1,14 @@
 'use strict';
 
 var React = require('react');
-var useTranslations = require('./useTranslations-9e0af18e.js');
+var index = require('./index-53b9a5ed.js');
 var miscCookieHelper = require('./miscCookieHelper.js');
-var index$1 = require('./index-aa02edde.js');
-var normalizeLink = require('./normalizeLink-d0991dbf.js');
+var index$2 = require('./index-76e88882.js');
+var normalizeLink = require('./normalizeLink-9e7b2355.js');
 var miscTheme = require('./miscTheme.js');
-var index = require('./index-9018c82f.js');
-var index$2 = require('./index-8fcd672e.js');
-var index$3 = require('./index-4c87c3c3.js');
+var index$1 = require('./index-27cbd1fe.js');
+var index$3 = require('./index-c4f4f933.js');
+var index$4 = require('./index-ed1c09df.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -27,7 +27,7 @@ const INTERNAL_CARD_URLS = {
 var styles$4 = {"navHeader":"uJQBNNg","navAvatar":"TfG3dM5","navHeaderUserInfos":"aMtjFNf","navHeaderUserName":"cSz2RR-","navHeaderMyProfileButton":"GyFm00F"};
 
 function NavHeader({ userInfo, onClickMyProfileButton, themeName = 'helloSites', }) {
-    const { t } = useTranslations.useTranslations();
+    const { t } = index.useTranslations();
     const nameFirstLetter = React.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) {
@@ -41,14 +41,14 @@ function NavHeader({ userInfo, onClickMyProfileButton, themeName = 'helloSites',
         }
     };
     return (React__default["default"].createElement("div", { className: styles$4.navHeader, onClick: handleClickMyProfileButton },
-        React__default["default"].createElement(index.Avatar, { className: styles$4.navAvatar, type: "rounded", size: "xl", avatarUrl: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, firstLetter: nameFirstLetter, backgroundColor: themeName === 'marryBaby'
+        React__default["default"].createElement(index$1.Avatar, { className: styles$4.navAvatar, type: "rounded", size: "xl", avatarUrl: userInfo === null || userInfo === void 0 ? void 0 : userInfo.avatar, firstLetter: nameFirstLetter, backgroundColor: themeName === 'marryBaby'
                 ? miscTheme.theme.mbColors.pink
                 : miscTheme.theme.colors.secondaryBase }),
         React__default["default"].createElement("div", { className: styles$4.navHeaderUserInfos },
             React__default["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["default"].createElement("div", { className: styles$4.navHeaderMyProfileButton, style: {
-                    '--bg-hellosites': `url(${index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-chevronRight.svg')})`,
-                    '--bg-marrybaby': `url(${index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-arrowRight.svg')})`,
+                    '--bg-hellosites': `url(${index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-chevronRight.svg')})`,
+                    '--bg-marrybaby': `url(${index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-arrowRight.svg')})`,
                 } }, t('userProfile.nav.header.viewProfile')))));
 }
 
@@ -62,21 +62,21 @@ const iconBgColorMap = {
 // type CardIconUrlMap = IconUrlMap<UserProfileMenuCard>
 const cardIconUrlMap = {
     helloSites: {
-        myBooking: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myBooking.svg'),
-        myCommunity: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myCommunity.svg'),
-        myFamily: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myFamily.svg'),
-        myHealth: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myHealth.svg'),
-        mySaved: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-mySaved.svg'),
-        eCom: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-eCom.svg'),
+        myBooking: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myBooking.svg'),
+        myCommunity: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myCommunity.svg'),
+        myFamily: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myFamily.svg'),
+        myHealth: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-myHealth.svg'),
+        mySaved: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-mySaved.svg'),
+        eCom: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-eCom.svg'),
     },
     marryBaby: {
-        mySaved: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-mySaved.svg'),
-        myCommunity: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-myCommunity.svg'),
-        myHealth: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-myHealth.svg'),
+        mySaved: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-mySaved.svg'),
+        myCommunity: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-myCommunity.svg'),
+        myHealth: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-myHealth.svg'),
     },
 };
 const NavigationCard = ({ type, themeName, className, onClick = () => undefined, }) => {
-    const { t } = useTranslations.useTranslations();
+    const { t } = index.useTranslations();
     const iconUrl = React.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)) || '';
@@ -101,7 +101,7 @@ const NavigationCard = ({ type, themeName, className, onClick = () => undefined,
 const navMenuItemsHelloSites = () => [
     {
         key: 'userProfile.nav.menu.accountSettings',
-        icon: index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-settingsWheel.svg'),
+        icon: index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-settingsWheel.svg'),
         subMenu: [
             // {
             //   key: 'common.profileNavigator.newsletterSubscription',
@@ -131,19 +131,19 @@ const navMenuItemsHelloSites = () => [
     },
     {
         key: 'userProfile.nav.menu.help',
-        icon: index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-helpCircle.svg'),
+        icon: index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-helpCircle.svg'),
         link: 'help',
     },
 ];
 const navMenuItemsMarryBaby = () => [
     {
         key: 'userProfile.nav.menu.password',
-        icon: index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-lock.svg'),
+        icon: index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-lock.svg'),
         link: 'password',
     },
     {
         key: 'userProfile.nav.menu.logout',
-        icon: index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-logOut.svg'),
+        icon: index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-logOut.svg'),
         link: 'logout',
     },
 ];
@@ -172,7 +172,7 @@ const NavMenu = ({ themeName, locale, onClickItem }) => {
 };
 const NavMenuItem = ({ item, openKey, onClickItem, locale, }) => {
     var _a;
-    const { t } = useTranslations.useTranslations();
+    const { t } = index.useTranslations();
     if ((_a = item.disableLocale) === null || _a === void 0 ? void 0 : _a.includes(locale)) {
         return null;
     }
@@ -181,7 +181,7 @@ const NavMenuItem = ({ item, openKey, onClickItem, locale, }) => {
             item.icon && (React__default["default"].createElement("div", { className: styles$2.navMenuItemIcon, style: { backgroundImage: `url("${item.icon}")` } })),
             t(item.key),
             item.subMenu && (React__default["default"].createElement("div", { className: styles$2.navMenuItemDropdown, style: {
-                    '--after-bg': `url(${index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-chevronDown.svg')})`,
+                    '--after-bg': `url(${index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-chevronDown.svg')})`,
                 } }))),
         item.subMenu && (React__default["default"].createElement("div", { className: styles$2.navFooterSubMenu }, item.subMenu.map((subItem) => (React__default["default"].createElement(NavMenuItem, { key: subItem.key, item: subItem, openKey: openKey, onClickItem: onClickItem, locale: locale })))))));
 };
@@ -192,22 +192,22 @@ var styles = {"userStats":"_4y-O0w3","wrapper":"kO8iNgD","header":"a1d4E10","hea
 
 const rankIconUrlMap = {
     helloSites: {
-        member: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-member.svg'),
-        ambassador: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-ambassador.svg'),
-        doctor: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-doctor.svg'),
-        expert: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-expert.svg'),
-        influencer: () => index$1.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-influencer.svg'),
+        member: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-member.svg'),
+        ambassador: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-ambassador.svg'),
+        doctor: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-doctor.svg'),
+        expert: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-expert.svg'),
+        influencer: () => index$2.CommonGAssets.getAssetPath('userProfileNav/helloSites/icon-rank-influencer.svg'),
     },
     marryBaby: {
-        member: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-member.svg'),
-        ambassador: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-ambassador.svg'),
-        doctor: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-doctor.svg'),
-        expert: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-expert.svg'),
-        influencer: () => index$1.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-influencer.svg'),
+        member: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-member.svg'),
+        ambassador: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-ambassador.svg'),
+        doctor: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-doctor.svg'),
+        expert: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-expert.svg'),
+        influencer: () => index$2.CommonGAssets.getAssetPath('userProfileNav/marryBaby/icon-rank-influencer.svg'),
     },
 };
 const UserStats = ({ themeName, rank = 'member', numberOfPosts = 0, }) => {
-    const { t } = useTranslations.useTranslations();
+    const { t } = index.useTranslations();
     const iconUrl = React.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)) || '';
@@ -224,14 +224,14 @@ const UserStats = ({ themeName, rank = 'member', numberOfPosts = 0, }) => {
 };
 
 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.useTranslations();
+    const { t } = index.useTranslations();
     const [numberOfPosts, setNumberOfPosts] = React.useState(userPostsNumber || 0);
     const isMarryBaby = themeName === 'marryBaby';
     React.useEffect(() => {
         if (userInfo && typeof userPostsNumber === 'undefined') {
             const token = miscCookieHelper.getCookie('hhg_user_token');
             if (!!token) {
-                fetch(normalizeLink.normalizeLinkSlash(index$2.getTogetherUserPostsApiPath(locale, isMarryBaby, togetherApiDomain)), {
+                fetch(normalizeLink.normalizeLinkSlash(index$3.getTogetherUserPostsApiPath(locale, isMarryBaby, togetherApiDomain)), {
                     headers: {
                         Authorization: `Bearer ${token}`,
                     },
@@ -284,7 +284,7 @@ const UserProfileNavigation = ({ SSO_URL, UP_BASEPATH = 'user', themeName = 'hel
         if (themeName === 'marryBaby') {
             return null;
         }
-        return (React__default["default"].createElement(index$3.Button, { color: "tertiary", icon: React__default["default"].createElement("img", { src: index$1.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')));
+        return (React__default["default"].createElement(index$4.Button, { color: "tertiary", icon: React__default["default"].createElement("img", { src: index$2.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('/')) {

package/build/{index-0210beeb.js → index-52586f0d.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-var index$1 = require('./index-997afcb6.js');
-var index$2 = require('./index-d4c38659.js');
-var index = require('./index-9cfee4c5.js');
+var index$1 = require('./index-bca7b38a.js');
+var index$2 = require('./index-f49e8023.js');
+var index = require('./index-4a39b1e7.js');
 var Cookies = require('js-cookie');
 var uuid = require('uuid');
 var constantsIsProduction = require('./constantsIsProduction.js');

package/build/index-53b9a5ed.js

@@ -0,0 +1,121 @@
+'use strict';
+
+var React = require('react');
+var translationsContext = require('./translationsContext-571827e1.js');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+// SRC: https://github.com/berezh/react-string-format
+function format(text, params) {
+    let result = [text];
+    Object.keys(params).forEach((key) => {
+        result = parseAndReplace(result, params[key], key);
+    });
+    if (result.length === 0) {
+        return '';
+    }
+    else if (result.length === 1 && typeof result[0] === 'string') {
+        return result[0];
+    }
+    else if (result.every((x) => typeof x === 'string')) {
+        return result.join('');
+    }
+    else {
+        return (React__namespace.createElement(React__namespace.Fragment, null, result.map((x, i) => {
+            return React__namespace.createElement(React__namespace.Fragment, { key: i }, x);
+        })));
+    }
+}
+function replaceWhiteSpace(text) {
+    const result = [];
+    let start = false;
+    let end = false;
+    if (!!text.match(/^\s+/gi)) {
+        text = text.replace(/^\s+/gi, '');
+        start = true;
+    }
+    if (!!text.match(/\s+$/gi)) {
+        text = text.replace(/\s+$/gi, '');
+        end = true;
+    }
+    if (start) {
+        result.push(React__namespace.createElement(React__namespace.Fragment, null, "\u00A0"));
+    }
+    result.push(text);
+    if (end) {
+        result.push(React__namespace.createElement(React__namespace.Fragment, null, "\u00A0"));
+    }
+    return result;
+}
+function parseAndReplace(source, replaceWith, key) {
+    const result = [];
+    source.forEach((possibleText) => {
+        if (typeof possibleText === 'string') {
+            const pattern = new RegExp(`\\{${key}\\}`, 'gi');
+            if (typeof replaceWith === 'string' || typeof replaceWith === 'number') {
+                result.push(possibleText.replace(pattern, `${replaceWith}`));
+            }
+            else {
+                const splits = possibleText.split(pattern);
+                splits.forEach((splitText, i) => {
+                    if (splitText) {
+                        replaceWhiteSpace(splitText).forEach((text) => result.push(text));
+                    }
+                    // if NOT last
+                    if (i + 1 < splits.length) {
+                        result.push(replaceWith);
+                    }
+                });
+            }
+        }
+        else {
+            result.push(possibleText);
+        }
+    });
+    return result;
+}
+
+function useTranslations() {
+    const { values, locale } = React.useContext(translationsContext.TranslationsContext) || {
+        locale: 'en-PH',
+    };
+    return React.useMemo(() => ({
+        t(k, option) {
+            if (!values) {
+                // console.error(
+                //   '[useTranslations] t method called before translation values are loaded',
+                // )
+                return k;
+            }
+            if (values[k]) {
+                return option ? format(values[k] || k, option) : values[k] || k;
+            }
+            // console.warn(
+            //   `[useTranslations] Missing translation for key ${k} and locale ${locale}`,
+            // )
+            return option ? format(k, option) : k;
+        },
+        // @ts-ignore
+        locale,
+    }), [values, locale]);
+}
+
+exports.useTranslations = useTranslations;