@hhgtech/hhg-components 1.29.88 → 1.29.90

package/build/{index-a97a7a53.js → index-5e1337b4.js}

@@ -2,37 +2,39 @@
 
 var React = require('react');
 var core = require('@mantine/core');
-var index = require('./index-1d528960.js');
-var togetherComponentGlobalContext = require('./utils-1a876a51.js');
-var index$7 = require('./index-e4004288.js');
+var index = require('./index-0e1519d2.js');
+var togetherComponentGlobalContext = require('./utils-1b9bc7e0.js');
+var index$8 = require('./index-330e16a8.js');
 var constantsRiskScreener = require('./constantsRiskScreener.js');
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
-var index$1 = require('./index-6c2d2f25.js');
-var routing = require('./routing-d764168d.js');
-var useTranslations = require('./useTranslations-5d28e8df.js');
+var tslib_es6 = require('./tslib.es6-5d65f18f.js');
+var index$1 = require('./index-f373b62b.js');
+var routing = require('./routing-7ba14d2a.js');
+var useTranslations = require('./useTranslations-4fb7a5ac.js');
 var form = require('@mantine/form');
+var index$5 = require('./index-67fa5818.js');
 require('@mantine/dates');
-require('./index-0772398f.js');
-require('./useMantineLocale-992ae094.js');
-var index$3 = require('./index-2de1a14d.js');
-var index$4 = require('./index-92e82d0d.js');
+require('./index-1b1ac8fe.js');
+require('./useMantineLocale-b8eca90b.js');
+var index$3 = require('./index-6266a5df.js');
+var index$4 = require('./index-fa8957ac.js');
+require('./index.styles-07f26519.js');
 var hooks = require('@mantine/hooks');
-require('./utils-a1cfbdac.js');
-require('./other-a7f01b3d.js');
+require('./utils-97ffdcb1.js');
+require('./other-5c1524b3.js');
 var togetherApiPaths = require('./togetherApiPaths.js');
-require('./translationsContext-951038ad.js');
+require('./translationsContext-9b528bb0.js');
 require('string-format');
-var index$2 = require('./index-227e17fd.js');
-var useHealthToolCache = require('./useHealthToolCache-cbe4b1b4.js');
-var index$5 = require('./index-b040447b.js');
+var index$2 = require('./index-7b74a414.js');
+var useHealthToolCache = require('./useHealthToolCache-c0468424.js');
+var index$6 = require('./index-2f31063d.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
 var core$1 = require('@hhgtech/icons/core');
-var index$6 = require('./index-1489f027.js');
+var index$7 = require('./index-b1181a62.js');
 var Cookies = require('js-cookie');
 var flatten = require('lodash/flatten');
 var uniqBy = require('lodash/uniqBy');
-var Locale = require('./Locale-e3b7ae56.js');
+var Locale = require('./Locale-e697d040.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -533,13 +535,13 @@ const BannerWithOptions = (props) => {
                     paddingLeft: core.rem(16),
                 },
             }) },
-            React__default["default"].createElement(index$1.Checkbox.Group, Object.assign({}, form$1.getInputProps('bannerOptions', { type: 'checkbox' })),
-                React__default["default"].createElement(core.Flex, { gap: core.rem(16) }, items.map((i, idx) => (React__default["default"].createElement(index$1.Checkbox, { key: String(idx), value: i.value, label: i.label, styles: {
+            React__default["default"].createElement(index$5.Checkbox.Group, Object.assign({}, form$1.getInputProps('bannerOptions', { type: 'checkbox' })),
+                React__default["default"].createElement(core.Flex, { gap: core.rem(16) }, items.map((i, idx) => (React__default["default"].createElement(index$5.Checkbox, { key: String(idx), value: i.value, label: i.label, styles: {
                         label: {
                             cursor: 'pointer',
                         },
                     } }))))),
-            React__default["default"].createElement(index$4.Button, Object.assign({ size: "sm" }, submitBtnTracking, buttonProps, { disabled: form$1.getInputProps('bannerOptions').value.length === 0, leftIcon: isMobile ? (React__default["default"].createElement(index$5.Icon.ArrowRightTail, { size: 18, useCurrentColor: true })) : undefined, onClick: () => {
+            React__default["default"].createElement(index$4.Button, Object.assign({ size: "sm" }, submitBtnTracking, buttonProps, { disabled: form$1.getInputProps('bannerOptions').value.length === 0, leftIcon: isMobile ? (React__default["default"].createElement(index$6.Icon.ArrowRightTail, { size: 18, useCurrentColor: true })) : undefined, onClick: () => {
                     const curValues = form$1.getInputProps('bannerOptions').value;
                     saveStep(curValues.join('|'));
                     handleClickOption(curValues.join('|'));
@@ -638,7 +640,7 @@ const SideBannerModal = (_a) => {
     const curBannerHeight = (viewportWidth * mobileBannerRatio.height) / mobileBannerRatio.width;
     const minHeightNha = (viewportHeight <= 667 ? 190 : 265) + curBannerHeight + 74;
     const [isFullScreen, setIsFullScreen] = React.useState(false);
-    return (React__default["default"].createElement(index$6.Modal, Object.assign({ styles: (theme) => ({
+    return (React__default["default"].createElement(index$7.Modal, Object.assign({ styles: (theme) => ({
             header: {
                 display: 'none',
             },
@@ -764,7 +766,7 @@ const PremiumNewsletterModalContext = React.createContext({});
 
 const _NormalTopic = (_a) => {
     var { value, name } = _a, rest = tslib_es6.__rest(_a, ["value", "name"]);
-    return (React__default["default"].createElement(index$1.ChipButton, Object.assign({ value: value, withIcon: true }, rest, { buttonProps: {
+    return (React__default["default"].createElement(index$5.ChipButton, Object.assign({ value: value, withIcon: true }, rest, { buttonProps: {
             styles: () => ({
                 leftIcon: {
                     marginRight: core.rem(6),
@@ -933,7 +935,7 @@ const MainForm = () => {
         React__default["default"].createElement(Layout, { heading: t('healthToolPNModal.heading'), stickyActions: React__default["default"].createElement(React__default["default"].Fragment, null,
                 React__default["default"].createElement(index$4.Button, { fullWidth: true, type: "submit", dataEventCategory: "Newsletter", dataEventAction: "Register Click", dataEventLabel: currentUrl, loading: submitLoading, sx: { maxWidth: core.rem(240) } }, t('healthToolPNModal.register'))) },
             React__default["default"].createElement(core.Stack, { spacing: core.rem(16) },
-                React__default["default"].createElement(index$1.Input, Object.assign({ label: t('newsletter.welcome.description') }, form$1.getInputProps('name'))),
+                React__default["default"].createElement(index$5.Input, Object.assign({ label: t('newsletter.welcome.description') }, form$1.getInputProps('name'))),
                 React__default["default"].createElement(TopicSection, { topicsGroup: [
                         ...(pnSuggestCategory.length === 0 &&
                             interestedTopics.length === 0
@@ -1009,7 +1011,7 @@ const HistorySection = ({ history, onDelete }) => {
                 height: 32,
                 background: '#ffffff',
                 padding: '5px 12px',
-                border: `1px solid ${index$1.themeColors.neutral[4]}`,
+                border: `1px solid ${index$5.themeColors.neutral[4]}`,
                 borderRadius: 32,
                 textTransform: 'unset',
             },
@@ -1081,7 +1083,7 @@ const _TopicSlide = (_a) => {
                 React__default["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.66699 9.99984C1.66699 5.39984 5.40033 1.6665 10.0003 1.6665C14.6003 1.6665 18.3337 5.39984 18.3337 9.99984C18.3337 14.5998 14.6003 18.3332 10.0003 18.3332C5.40033 18.3332 1.66699 14.5998 1.66699 9.99984ZM4.75066 10.5827L7.74232 13.5744C8.06732 13.8994 8.60066 13.8994 8.91732 13.5744L15.2423 7.2494C15.5673 6.9244 15.5673 6.3994 15.2423 6.0744C14.9173 5.7494 14.3923 5.7494 14.0673 6.0744L8.33399 11.8077L5.92566 9.40773C5.60066 9.08273 5.07566 9.08273 4.75066 9.40773C4.59461 9.56342 4.50692 9.7748 4.50692 9.99523C4.50692 10.2157 4.59461 10.427 4.75066 10.5827Z", fill: "#2D87F3" }),
                 React__default["default"].createElement("path", { d: "M7.74224 13.5772L4.75057 10.5856C4.59453 10.4299 4.50684 10.2185 4.50684 9.99808C4.50684 9.77765 4.59453 9.56627 4.75057 9.41058C5.07557 9.08558 5.60057 9.08558 5.92557 9.41058L8.33391 11.8106L14.0672 6.07725C14.3922 5.75225 14.9172 5.75225 15.2422 6.07725C15.5672 6.40225 15.5672 6.92725 15.2422 7.25225L8.91724 13.5772C8.60057 13.9022 8.06724 13.9022 7.74224 13.5772Z", fill: "white" })))),
         React__default["default"].createElement(core.Box, { sx: { borderRadius: '8px' } },
-            React__default["default"].createElement(index$1.AspectRatio, { ratio: 3 / 2, mb: 10, sx: (theme) => ({
+            React__default["default"].createElement(index$5.AspectRatio, { ratio: 3 / 2, mb: 10, sx: (theme) => ({
                     background: theme.colors.neutral[0],
                 }) },
                 React__default["default"].createElement(core.Box, null,
@@ -1281,7 +1283,7 @@ const PremiumTopicSelect = (_a) => {
                         fontSize: 12,
                         lineHeight: '18px',
                         textTransform: 'uppercase',
-                        color: index$1.themeColors.gray[4],
+                        color: index$5.themeColors.gray[4],
                         '&::after': { display: 'none' },
                     },
                     searchInput: {
@@ -1402,7 +1404,7 @@ const PremiumNewsletterModal = ({ isMobile, isLoggedIn, pnSuggestCategory = [],
                 },
                 method: 'POST',
                 data: {
-                    ga_client_id: Cookies__default["default"].get(index$7.GA_TOKEN_COOKIE),
+                    ga_client_id: Cookies__default["default"].get(index$8.GA_TOKEN_COOKIE),
                     client_ip: window.clientIP || '',
                     user_info: Object.assign(Object.assign({}, acquisitionInfo.userInfo), { name: name || formValues.name, type_subscription: 1 }),
                     domain: constantsDomainLocales.domainLocales[locale || Locale.LOCALE.Vietnam],

package/build/{index-2de1a14d.js → index-6266a5df.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-5d65f18f.js');
 var React = require('react');
 var core = require('@mantine/core');
-var other = require('./other-a7f01b3d.js');
+var other = require('./other-5c1524b3.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-f3553904.js → index-62f912e0.js}

@@ -1,14 +1,15 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-5d65f18f.js');
 var React = require('react');
-require('./index-0772398f.js');
+require('./index-1b1ac8fe.js');
 var styled = require('@emotion/styled');
-var index$1 = require('./index-1d528960.js');
+var index$1 = require('./index-0e1519d2.js');
 var miscTheme = require('./miscTheme.js');
-var index = require('./index-6c2d2f25.js');
-var index$2 = require('./index-519a6287.js');
-var Locale = require('./Locale-e3b7ae56.js');
+var index = require('./index-f373b62b.js');
+var index$2 = require('./index-81dcaeb1.js');
+var Locale = require('./Locale-e697d040.js');
+var index$3 = require('./index-67fa5818.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -75,13 +76,13 @@ const Pill = (_a) => {
 const StyledPill = styled__default["default"](Pill) `
   box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.08);
 `;
-const StyledSlide = styled__default["default"](index.CentralCarousel.Slide) `
+const StyledSlide = styled__default["default"](index$3.CentralCarousel.Slide) `
   cursor: pointer;
   > div * {
     pointer-events: none;
   }
 `;
-const StyledCarousel = styled__default["default"](index.CentralCarousel) `
+const StyledCarousel = styled__default["default"](index$3.CentralCarousel) `
   .centerred-pill-wrapper {
     padding: 16px 0;
   }

package/build/{index-84e8b355.js → index-63f2aaa5.js}

@@ -1,23 +1,24 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-5d65f18f.js');
 var React = require('react');
 var core = require('@mantine/core');
 var form = require('@mantine/form');
-var LastPeriod = require('./LastPeriod-235fc10e.js');
-var index$2 = require('./index-6c2d2f25.js');
-var index$1 = require('./index-a136cba7.js');
-var index$3 = require('./index-2de1a14d.js');
-require('./index-92e82d0d.js');
-var useTranslations = require('./useTranslations-5d28e8df.js');
+var LastPeriod = require('./LastPeriod-5e6d2274.js');
+var index$2 = require('./index-67fa5818.js');
+var index$1 = require('./index-87d6e499.js');
+var index$3 = require('./index-6266a5df.js');
+require('./index-fa8957ac.js');
+require('./index.styles-07f26519.js');
+var useTranslations = require('./useTranslations-4fb7a5ac.js');
 require('@mantine/hooks');
-require('./index-0772398f.js');
-require('./index-1d528960.js');
-require('./utils-a1cfbdac.js');
-require('./useMantineLocale-992ae094.js');
-require('./index-e4004288.js');
-require('./other-a7f01b3d.js');
-var index = require('./index-d39f2445.js');
+require('./index-1b1ac8fe.js');
+require('./index-0e1519d2.js');
+require('./utils-97ffdcb1.js');
+require('./useMantineLocale-b8eca90b.js');
+require('./index-330e16a8.js');
+require('./other-5c1524b3.js');
+var index = require('./index-6cda2bed.js');
 var other = require('@hhgtech/icons/other');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-9f995309.js → index-65eb73e7.js}

@@ -1,31 +1,34 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-5d65f18f.js');
 var React = require('react');
-var index$5 = require('./index-b8620e16.js');
-var index$2 = require('./index-227e17fd.js');
-var useTranslations = require('./useTranslations-5d28e8df.js');
+var index$5 = require('./index-3c6a1bfc.js');
+var index$2 = require('./index-7b74a414.js');
+var useTranslations = require('./useTranslations-4fb7a5ac.js');
 var innertext = require('innertext');
-var index = require('./index-2ce324cf.js');
-var index$1 = require('./index-1d528960.js');
-var constants = require('./constants-9c314450.js');
+var index = require('./index-69cd0b40.js');
+var index$1 = require('./index-0e1519d2.js');
+var constants = require('./constants-0f0f1c47.js');
 var togetherApiPaths = require('./togetherApiPaths.js');
-var togetherComponentGlobalContext = require('./utils-1a876a51.js');
+var togetherComponentGlobalContext = require('./utils-1b9bc7e0.js');
 var useTogetherAuthRequiredAction = require('./useTogetherAuthRequiredAction.js');
-var treePopoverMenu = require('./treePopoverMenu-0cbe3fd0.js');
+var treePopoverMenu = require('./treePopoverMenu-86c7db6d.js');
 var styled = require('@emotion/styled');
-var utils = require('./utils-a1cfbdac.js');
+var utils = require('./utils-97ffdcb1.js');
 var miscTheme = require('./miscTheme.js');
-var dataTransform = require('./dataTransform-945e5f4f.js');
-var index$7 = require('./index-e7b871b4.js');
-var index$6 = require('./index-186f9324.js');
-require('./index-e4004288.js');
+var dataTransform = require('./dataTransform-27a22c74.js');
+var index$7 = require('./index-2d391b09.js');
+var togetherMoleculesCardAuthor = require('./index-137b351f.js');
+var togetherMoleculesProfileDetail = require('./index-5cc887da.js');
+var togetherMoleculesPostImagePreview = require('./index-4b1b3672.js');
+var index$6 = require('./index-db2b38f4.js');
+require('./index-330e16a8.js');
 var core$1 = require('@hhgtech/icons/core');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
-var index$4 = require('./index-6ce119f5.js');
-var index$3 = require('./index-2de1a14d.js');
-var routing = require('./routing-d764168d.js');
+var index$4 = require('./index-7b8badf9.js');
+var index$3 = require('./index-6266a5df.js');
+var routing = require('./routing-7ba14d2a.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -626,16 +629,16 @@ const SourceItem = ({ postTitle, articleReviewed, modifiedTime, href, }) => {
     return (React__default["default"].createElement(StyledItem, { href: href, title: postTitle, target: "_blank" },
         React__default["default"].createElement(index$3.Text, { size: "s3", as: "h5", weight: "bold" }, postTitle),
         React__default["default"].createElement("div", null,
-            React__default["default"].createElement(index.CardAuthor, { avatar: getDetail === null || getDetail === void 0 ? void 0 : getDetail.avatar, avatarProps: {
+            React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor, { avatar: getDetail === null || getDetail === void 0 ? void 0 : getDetail.avatar, avatarProps: {
                     size: 32,
                 }, name: getDetail === null || getDetail === void 0 ? void 0 : getDetail.name, role: getDetail === null || getDetail === void 0 ? void 0 : getDetail.role, hideBackground: true },
-                React__default["default"].createElement(index.CardAuthor.SubTextRow, null,
-                    React__default["default"].createElement(index.CardAuthor.SubText, null, getDetail === null || getDetail === void 0 ? void 0 :
+                React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor.SubTextRow, null,
+                    React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor.SubText, null, getDetail === null || getDetail === void 0 ? void 0 :
                         getDetail.title,
                         ' ',
                         React__default["default"].createElement("span", { style: { color: miscTheme.theme.colors.gray800 } }, getDetail === null || getDetail === void 0 ? void 0 : getDetail.name)),
-                    React__default["default"].createElement(index.CardAuthor.SubDivider, null),
-                    React__default["default"].createElement(index.CardAuthor.SubText, null, modifiedTime))))));
+                    React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor.SubDivider, null),
+                    React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor.SubText, null, modifiedTime))))));
 };
 
 var styles$1 = {"accordion":"CnNZq8D","header":"F4mmgSy","heading":"_8jLruY3","headingIcon":"FE8w-fe","panel":"Yd2a9Nj","chevron":"A7QrQ7A"};
@@ -720,7 +723,7 @@ const SourceList = (_a) => {
             React__default["default"].createElement(index$3.Text, { size: "s3", as: "span", dangerouslySetInnerHTML: {
                     __html: t('cardReply.disclaimer'),
                 } }))),
-        !hideSourceList ? (loading ? (React__default["default"].createElement(index.Loading, null)) : data.length > 0 || editMode ? (React__default["default"].createElement(StyledContainer$1, null,
+        !hideSourceList ? (loading ? (React__default["default"].createElement(togetherMoleculesCardAuthor.Loading, null)) : data.length > 0 || editMode ? (React__default["default"].createElement(StyledContainer$1, null,
             React__default["default"].createElement(core.Accordion, { defaultValue: !collapseSource && 'accordion', styles: {
                     control: {
                         borderRadius: 'inherit',
@@ -996,8 +999,8 @@ const VerifiedTag = ({ userId, avatar, name, role, title, className, }) => {
                 t('cardReply.verifyBy', {
                     name: `${name || ''}`,
                 }))),
-        React__default["default"].createElement(index.ProfileDetailModal, { open: openPopup, onClose: () => setOpenPopup(false), profileModalProps: { zIndex: 1000 } },
-            React__default["default"].createElement(index.ProfileDetail, { authorProps: {
+        React__default["default"].createElement(togetherMoleculesCardAuthor.ProfileDetailModal, { open: openPopup, onClose: () => setOpenPopup(false), profileModalProps: { zIndex: 1000 } },
+            React__default["default"].createElement(togetherMoleculesProfileDetail.ProfileDetail, { authorProps: {
                     userId,
                     avatar: avatar,
                     name,
@@ -1122,18 +1125,18 @@ const CardReply = ({ className, style, comment: CommentProps, type = 'comment',
         React__default["default"].createElement(StyledCardPost, { className: className, style: style, "data-is-reply": !!level, "data-is-marrybaby": isMarryBaby, "data-has-booking": hasQuickBooking },
             type === 'reply' && React__default["default"].createElement(index$6.Divider, { className: "top-divider", type: "solid" }),
             React__default["default"].createElement("div", { style: { padding: '16px 16px 0' } },
-                React__default["default"].createElement(index.CardAuthor, Object.assign({ avatar: avatar, name: name, username: username, timeText: post === null || post === void 0 ? void 0 : post.createdTime, community: post === null || post === void 0 ? void 0 : post.community, 
+                React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor, Object.assign({ avatar: avatar, name: name, username: username, timeText: post === null || post === void 0 ? void 0 : post.createdTime, community: post === null || post === void 0 ? void 0 : post.community, 
                     // miniIcon="./svg/icon-tag.svg"
                     // authorLabelType={getAuthorLabelFromRoles(author?.role || [])}
                     className: `post-author ${hasPopover ? 'with-popover' : ''}`, type: type, userId: author === null || author === void 0 ? void 0 : author.id, role: authorRole, expertId: author === null || author === void 0 ? void 0 : author.partnerId, title: author === null || author === void 0 ? void 0 : author.title, doctorId: author === null || author === void 0 ? void 0 : author.doctorId, hospitalId: author === null || author === void 0 ? void 0 : author.hospitalId, hasQuickBooking: hasQuickBooking, handleMakeAppointment: handleMakeAppointment, isAnonymous: (comment === null || comment === void 0 ? void 0 : comment.isAnonymous) ||
                         (Boolean(post === null || post === void 0 ? void 0 : post.isAnonymous) &&
                             ((_g = post === null || post === void 0 ? void 0 : post.author) === null || _g === void 0 ? void 0 : _g.username) === (author === null || author === void 0 ? void 0 : author.username)), hideBackground: isChatbotAuthor, userType: author === null || author === void 0 ? void 0 : author.type }, cardAuthorProps)),
                 Boolean(comment === null || comment === void 0 ? void 0 : comment.isVerify) && !Boolean(comment === null || comment === void 0 ? void 0 : comment.isOppose) && (React__default["default"].createElement(VerifiedTag, { title: (_h = comment === null || comment === void 0 ? void 0 : comment.userVerify) === null || _h === void 0 ? void 0 : _h.title, name: (_j = comment === null || comment === void 0 ? void 0 : comment.userVerify) === null || _j === void 0 ? void 0 : _j.name, userId: (_k = comment === null || comment === void 0 ? void 0 : comment.userVerify) === null || _k === void 0 ? void 0 : _k.id, role: (_l = comment === null || comment === void 0 ? void 0 : comment.userVerify) === null || _l === void 0 ? void 0 : _l.role, avatar: (_m = comment === null || comment === void 0 ? void 0 : comment.userVerify) === null || _m === void 0 ? void 0 : _m.avatar, className: "verify-tag" }))),
-            React__default["default"].createElement(index.PostContent, { className: "post-content-wrapper", replyingTo: replyingTo, mentionedUser: mentionedUser, description: text, mentions: listMentions, maxChars: maxChars, disableShortenContent: disableShortenContent }),
+            React__default["default"].createElement(togetherMoleculesProfileDetail.PostContent, { className: "post-content-wrapper", replyingTo: replyingTo, mentionedUser: mentionedUser, description: text, mentions: listMentions, maxChars: maxChars, disableShortenContent: disableShortenContent }),
             React__default["default"].createElement("span", null),
             React__default["default"].createElement("span", null),
             images && images.length > 0 ? (React__default["default"].createElement("div", { key: "image-preview", className: "image-preview-wrapper", "data-is-reply": true },
-                React__default["default"].createElement(index.PostImagePreview, { images: images, authorName: author === null || author === void 0 ? void 0 : author.username }))) : null,
+                React__default["default"].createElement(togetherMoleculesPostImagePreview.PostImagePreview, { images: images, authorName: author === null || author === void 0 ? void 0 : author.username }))) : null,
             (!images || images.length === 0) && link ? (React__default["default"].createElement("div", { key: "link-preview", className: "link-preview-wrapper", "data-is-reply": true },
                 React__default["default"].createElement(index$7.CardLink, { url: link }))) : null,
             type !== 'most-engaging' ? (React__default["default"].createElement(React__default["default"].Fragment, null,
@@ -1290,19 +1293,19 @@ const CardPost = ({ className, style, hideViewMoreComment, showMostEngaging, onC
         React__default["default"].createElement(StyledCardPost$1, { className: className, style: style, "data-is-marrybaby": isMarryBaby },
             isPin ? React__default["default"].createElement(treePopoverMenu.LabelPin, { className: "post-pin" }) : null,
             React__default["default"].createElement("div", { style: { position: 'relative', padding: '1rem 1rem 0' } },
-                React__default["default"].createElement(index.CardAuthor, Object.assign({ avatar: avatar, name: name, username: username, url: disableCardLink ? undefined : postRelativeHref, community: community, 
+                React__default["default"].createElement(togetherMoleculesCardAuthor.CardAuthor, Object.assign({ avatar: avatar, name: name, username: username, url: disableCardLink ? undefined : postRelativeHref, community: community, 
                     // miniIcon="./svg/icon-tag.svg"
                     timeText: post === null || post === void 0 ? void 0 : post.createdTime, className: "post-author", role: authorRole, userId: author === null || author === void 0 ? void 0 : author.id, expertId: author === null || author === void 0 ? void 0 : author.partnerId, doctorId: author === null || author === void 0 ? void 0 : author.doctorId, hospitalId: author === null || author === void 0 ? void 0 : author.hospitalId, title: author === null || author === void 0 ? void 0 : author.title, hasQuickBooking: hasQuickBooking, handleMakeAppointment: handleMakeAppointment, "data-testid": "name", isAnonymous: !!(post === null || post === void 0 ? void 0 : post.isAnonymous), extendEle: React__default["default"].createElement(CardPostPopoverMore, { authorEmail: String(author === null || author === void 0 ? void 0 : author.email), onDeletePost: onDeletePost, shareUrl: postHref, post: post, className: "popover", onEditPost: onEditPost }) }, cardAuthorProps))),
             React__default["default"].createElement("a", { href: disableCardLink ? undefined : postRelativeHref, className: "post-content-link-wrapper" },
                 title && (React__default["default"].createElement(index$2.Heading, { className: "post-content-title", as: "h2", tag: "h5", fontWeight: "bold", "data-testid": "Title of the Post" }, innertext__default["default"](title))),
-                React__default["default"].createElement(index.PostContent, { className: "post-content-wrapper", description: description, disableShortenContent: disableShortenContent, mentions: mentions, "data-testid": "Content of the Post" })),
+                React__default["default"].createElement(togetherMoleculesProfileDetail.PostContent, { className: "post-content-wrapper", description: description, disableShortenContent: disableShortenContent, mentions: mentions, "data-testid": "Content of the Post" })),
             React__default["default"].createElement("span", null),
             React__default["default"].createElement("span", null),
             React__default["default"].createElement("div", { key: "tag-topic" }, topics && topics.length > 0 ? (React__default["default"].createElement(treePopoverMenu.TagTopic, { topics: topics, className: "post-topics" })) : null),
             React__default["default"].createElement("div", { key: "social-preview" }, (post === null || post === void 0 ? void 0 : post.introUrl) ? (React__default["default"].createElement("div", { className: `social-preview-wrapper ${!!(photos === null || photos === void 0 ? void 0 : photos.length) ? 'has-image' : ''}` },
                 React__default["default"].createElement(index.SocialLinkPreview, { url: post.introUrl, image: post.bannerImage }))) : null),
             React__default["default"].createElement("div", { key: "image-preview" }, !!(photos === null || photos === void 0 ? void 0 : photos.length) ? (React__default["default"].createElement("div", { className: "image-preview-wrapper" },
-                React__default["default"].createElement(index.PostImagePreview, { images: photos, authorName: author === null || author === void 0 ? void 0 : author.name }))) : null),
+                React__default["default"].createElement(togetherMoleculesPostImagePreview.PostImagePreview, { images: photos, authorName: author === null || author === void 0 ? void 0 : author.name }))) : null),
             React__default["default"].createElement("div", { key: "link-preview" }, !(post === null || post === void 0 ? void 0 : post.introUrl) && !(photos === null || photos === void 0 ? void 0 : photos.length) && (previewUrl === null || previewUrl === void 0 ? void 0 : previewUrl.url) ? (React__default["default"].createElement("div", { className: "link-preview-wrapper" },
                 React__default["default"].createElement(index$7.CardLink, { title: previewUrl.title, url: previewUrl.url, image: previewUrl.image }))) : null),
             React__default["default"].createElement(treePopoverMenu.CardReactions, { isMarryBaby: isMarryBaby, type: treePopoverMenu.CardReactionType.post, loveCount: likesCount, replyCount: commentsCount, className: `post-reaction ${(photos === null || photos === void 0 ? void 0 : photos.length) || (previewUrl === null || previewUrl === void 0 ? void 0 : previewUrl.url) ? 'hide-top-border' : ''}`, liked: isLikeLoading ? !liked : liked, isReplied: commented, onCommentClick: () => authActionWrapper(() => {

package/build/{index-6c2d2f25.js → index-67fa5818.js}

@@ -1,23 +1,25 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-145af9ce.js');
+var tslib_es6 = require('./tslib.es6-5d65f18f.js');
 var React = require('react');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
 var hooks = require('@mantine/hooks');
-var index$2 = require('./index-1d528960.js');
-var utils = require('./utils-a1cfbdac.js');
+var index$2 = require('./index-0e1519d2.js');
+var index_styles = require('./index.styles-07f26519.js');
 var styled = require('@emotion/styled');
 var carousel = require('@mantine/carousel');
-var index$3 = require('./index-2de1a14d.js');
-require('./index-0772398f.js');
+var index$4 = require('./index-6266a5df.js');
+require('./index-1b1ac8fe.js');
 var miscTheme = require('./miscTheme.js');
-var useMantineLocale = require('./useMantineLocale-992ae094.js');
-var index = require('./index-e4004288.js');
-var index$1 = require('./index-92e82d0d.js');
-var Locale = require('./Locale-e3b7ae56.js');
+var utils = require('./utils-97ffdcb1.js');
+var useMantineLocale = require('./useMantineLocale-b8eca90b.js');
+var index = require('./index-330e16a8.js');
+var index$1 = require('./index-fa8957ac.js');
+var Locale = require('./Locale-e697d040.js');
+var index$3 = require('./index-f373b62b.js');
 var cn = require('classnames');
-var useUniqueId = require('./useUniqueId-17c2097b.js');
+var useUniqueId = require('./useUniqueId-5fc9f536.js');
 var constantsSite = require('./constantsSite.js');
 var core$1 = require('@hhgtech/icons/core');
 
@@ -347,25 +349,8 @@ const getMantineThemeOverride = (locale, template = 'hb') => {
     };
 };
 
-const ImageWrap = (_a) => {
-    var { alt, backupSrc, src, placeholderSrc, style, ref } = _a, props = tslib_es6.__rest(_a, ["alt", "backupSrc", "src", "placeholderSrc", "style", "ref"]);
-    const [hasError, setHasError] = React.useState(false);
-    return (React__namespace["default"].createElement(StyledImage, Object.assign({ loading: "lazy", alt: alt, onError: () => !hasError && setHasError(true), src: hasError ? backupSrc || src : src || backupSrc, style: Object.assign(Object.assign({}, (placeholderSrc
-            ? {
-                backgroundImage: `url(${placeholderSrc})`,
-            }
-            : {})), style), "data-has-placeholder": !!placeholderSrc, ref: ref }, props)));
-};
-const StyledImage = styled__default["default"].img `
-  &[data-has-placeholder='true'] {
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-  }
-`;
-
-const CambodiaRoundIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "round cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
-const CambodiaSquareIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "square cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaSquare.png') }, props)));
+const CambodiaRoundIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "round cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
+const CambodiaSquareIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "square cambodia flag", src: index$2.CommonGAssets.getAssetPath('flags/cambodiaSquare.png') }, props)));
 
 const EnglishRoundIcon = (props) => (React__namespace["default"].createElement("svg", Object.assign({ viewBox: "0 0 20 20", fill: "none", style: Object.assign({ borderRadius: '50%' }, props.style) }, props),
     React__namespace["default"].createElement("g", null,
@@ -412,8 +397,8 @@ const EnglishSquareIcon = (props) => (React__namespace["default"].createElement(
         React__namespace["default"].createElement("path", { d: "M9.32609 10.8334L1.08301 5.79537V7.06504L7.24826 10.8334H9.32609ZM24.0004 5.41675L15.1376 10.8334H17.2149L24.9163 6.12687V5.41675H24.0004ZM17.9191 15.1667L24.9163 19.4432V18.1735L19.9964 15.1667H17.9191ZM8.62192 15.1667L1.08301 19.7742V20.5834H1.83701L10.6992 15.1667H8.62192ZM1.08301 11.9167H24.9163V14.0834H1.08301V11.9167Z", fill: "#E53935" }),
         React__namespace["default"].createElement("path", { d: "M11.917 5.41675H14.0837V20.5834H11.917V5.41675Z", fill: "#E53935" }))));
 
-const IndiaRoundIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "round india flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
-const IndiaSquareIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "square indian flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaSquare.png') }, props)));
+const IndiaRoundIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "round india flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
+const IndiaSquareIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "square indian flag", src: index$2.CommonGAssets.getAssetPath('flags/indiaSquare.png') }, props)));
 
 const IndonesiaRoundIcon = (_a) => {
     var rest = tslib_es6.__rest(_a, []);
@@ -495,8 +480,8 @@ const MyanmarSquareIcon = (props) => (React__namespace["default"].createElement(
     React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.6667 7.4589L16.3104 7.41087L12.5218 9.79821L11.6667 7.4589Z", fill: "white" }),
     React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.2361 7.90629L14.7225 11.8171L10.9974 9.35207L13.2361 7.90629Z", fill: "white" })));
 
-const PhilippinesRoundIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "round philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
-const PhilippinesSquareIcon = (props) => (React__namespace["default"].createElement(ImageWrap, Object.assign({ alt: "square philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineSquare.png') }, props)));
+const PhilippinesRoundIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "round philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineRound.png'), style: Object.assign({ borderRadius: '50%' }, props.style) }, props)));
+const PhilippinesSquareIcon = (props) => (React__namespace["default"].createElement(index$3.ImageWrap, Object.assign({ alt: "square philippines flag", src: index$2.CommonGAssets.getAssetPath('flags/philippineSquare.png') }, props)));
 
 const TaiwanRoundIcon = (props) => (React__namespace["default"].createElement("svg", Object.assign({ viewBox: "0 0 20 20", fill: "none", style: Object.assign({ borderRadius: '50%' }, props.style) }, props),
     React__namespace["default"].createElement("g", null,
@@ -702,33 +687,6 @@ const _Select = React.forwardRef((_a, ref) => {
 const _IconSelect = () => (React__namespace["default"].createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" },
     React__namespace["default"].createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.6665 9.99996C1.6665 5.39163 5.3915 1.66663 9.99984 1.66663C14.6082 1.66663 18.3332 5.39163 18.3332 9.99996C18.3332 14.6083 14.6082 18.3333 9.99984 18.3333C5.3915 18.3333 1.6665 14.6083 1.6665 9.99996ZM12.4083 13.5831C12.7333 13.9081 13.2583 13.9081 13.5833 13.5831C13.9 13.2581 13.9 12.7247 13.5833 12.4081L11.175 9.99973L13.5833 7.5914C13.9083 7.2664 13.9083 6.7414 13.5833 6.4164C13.2583 6.0914 12.7333 6.0914 12.4083 6.4164L10 8.82473L7.59167 6.4164C7.26667 6.0914 6.74167 6.0914 6.41667 6.4164C6.26063 6.57209 6.17293 6.78347 6.17293 7.0039C6.17293 7.22433 6.26063 7.43571 6.41667 7.5914L8.825 9.99973L6.41667 12.4081C6.26063 12.5638 6.17293 12.7751 6.17293 12.9956C6.17293 13.216 6.26063 13.4274 6.41667 13.5831C6.74167 13.9081 7.26667 13.9081 7.59167 13.5831L10 11.1747L12.4083 13.5831Z", fill: "#8C8C8C" })));
 
-const getIsMobile = () => {
-    return (typeof window !== 'undefined' &&
-        window.innerWidth < utils.Breakpoints.BREAK_POINT_MOBILE);
-};
-const getIsLargeMobile = () => {
-    return (typeof window !== 'undefined' &&
-        window.innerWidth >= utils.Breakpoints.BREAK_POINT_MOBILE &&
-        window.innerWidth < utils.Breakpoints.BREAK_POINT_PC);
-};
-const useScreenSize = () => {
-    const [isMobile, setIsMobile] = React.useState(getIsMobile());
-    const [isLargeMobile, setIsLargeMobile] = React.useState(getIsLargeMobile());
-    React.useEffect(() => {
-        const handleResize = () => {
-            setIsMobile(getIsMobile());
-            setIsLargeMobile(getIsLargeMobile());
-        };
-        window.addEventListener('resize', handleResize, {
-            passive: true,
-        });
-        return () => {
-            window.removeEventListener('resize', handleResize);
-        };
-    }, []);
-    return { isMobile, isLargeMobile };
-};
-
 class ErrorBoundary extends React.Component {
     constructor() {
         super(...arguments);
@@ -804,7 +762,7 @@ const StyledCarousel = styled__default["default"](Carousel) `
   }
 `;
 
-var useStyles$3 = core.createStyles((_theme, _params) => {
+var useStyles$2 = core.createStyles((_theme, _params) => {
     return {
         root: {
             color: _params.color ||
@@ -817,8 +775,8 @@ var useStyles$3 = core.createStyles((_theme, _params) => {
 
 const Anchor = (_a) => {
     var { color, styles, className } = _a, rest = tslib_es6.__rest(_a, ["color", "styles", "className"]);
-    const { classes, cx } = useStyles$3({ color }, { name: 'Anchor', styles });
-    return React__namespace["default"].createElement(index$3.Text, Object.assign({ as: "a", className: cx(classes.root, className) }, rest));
+    const { classes, cx } = useStyles$2({ color }, { name: 'Anchor', styles });
+    return React__namespace["default"].createElement(index$4.Text, Object.assign({ as: "a", className: cx(classes.root, className) }, rest));
 };
 
 const BreadcrumbItem = (_a) => {
@@ -842,7 +800,7 @@ const _Breadcrumbs = (_a) => {
     const theme = core.useMantineTheme();
     const isMarryBaby = ((_b = theme === null || theme === void 0 ? void 0 : theme.other) === null || _b === void 0 ? void 0 : _b.template) === 'mb';
     const [embla, setEmbla] = React.useState(null);
-    const { isMobile } = useScreenSize();
+    const { isMobile } = index_styles.useScreenSize();
     const [, setShouldAllowClick] = React.useState(true);
     const handleScroll = React.useCallback(() => {
         setShouldAllowClick(false);
@@ -900,36 +858,6 @@ const StyledTextArea = styled__default["default"](core.Textarea) `
   }
 `;
 
-var useStyles$2 = core.createStyles((theme) => {
-    return {
-        root: {},
-        inner: {},
-        content: {},
-        header: {
-            borderBottom: `1px solid ${theme.colors.neutral[1]}`,
-            marginRight: 0,
-            marginBottom: 0,
-            padding: '12px',
-        },
-        overlay: {},
-        title: {
-            fontSize: 16,
-            fontWeight: 700,
-            lineHeight: 1.5,
-        },
-        body: {},
-        close: {
-            cursor: 'pointer',
-            width: 'unset',
-            height: 'unset',
-            svg: {
-                width: '24px !important',
-                height: '24px !important',
-            },
-        },
-    };
-});
-
 const StyledAccordion = styled__default["default"](core.Accordion) `
   .mantine-Accordion-label {
     padding: 0;
@@ -984,7 +912,7 @@ const Avatar = (_a) => {
                     backgroundColor: avatarProps.color,
                     color: 'white',
                 },
-            } }), children ? (children) : placeholderText ? (placeholderText) : (React__namespace["default"].createElement(ImageWrap, { src: DEFAULT_AVATAR, width: size, alt: avatarProps.alt || 'avatar' }))));
+            } }), children ? (children) : placeholderText ? (placeholderText) : (React__namespace["default"].createElement(index$3.ImageWrap, { src: DEFAULT_AVATAR, width: size, alt: avatarProps.alt || 'avatar' }))));
     };
     if (withIndicator)
         return (React__namespace["default"].createElement(core.Indicator, Object.assign({ inline: true, position: "bottom-end", offset: 9 }, indicatorConfig, { styles: Object.assign({ indicator: {
@@ -1606,7 +1534,7 @@ const _Tabs = (_a) => {
         setDisableNext(((_a = viewport === null || viewport === void 0 ? void 0 : viewport.current) === null || _a === void 0 ? void 0 : _a.clientWidth) + scrollPosition.x ===
             ((_b = viewport === null || viewport === void 0 ? void 0 : viewport.current) === null || _b === void 0 ? void 0 : _b.scrollWidth));
     }, [scrollPosition]);
-    const TabTextComponent = ({ text, dataEventCategory, dataEventAction, dataEventLabel, }) => TabComponentDisplay ? (React__namespace["default"].createElement(TabComponentDisplay, null, text)) : (React__namespace["default"].createElement(index$3.Text, { size: "s3", color: "inherit", weight: "semiBold", "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-event-label": dataEventLabel }, text));
+    const TabTextComponent = ({ text, dataEventCategory, dataEventAction, dataEventLabel, }) => TabComponentDisplay ? (React__namespace["default"].createElement(TabComponentDisplay, null, text)) : (React__namespace["default"].createElement(index$4.Text, { size: "s3", color: "inherit", weight: "semiBold", "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-event-label": dataEventLabel }, text));
     return (React__namespace["default"].createElement(core.Tabs, Object.assign({}, props, rest), children || (React__namespace["default"].createElement(React__namespace["default"].Fragment, null,
         React__namespace["default"].createElement(core.ScrollArea, { className: cx(classes.scrollArea, `${!disablePrevious ? 'prev-bg' : ''} ${!disableNext ? 'next-bg' : ''}`), scrollbarSize: 0, viewportRef: viewport, onScrollPositionChange: onScrollPositionChange },
             React__namespace["default"].createElement(core.Tabs.List, Object.assign({ className: classes.list, ref: listRef }, listProps), dataList.map((i, idx) => (React__namespace["default"].createElement(core.Tabs.Tab, Object.assign({ ref: (e) => (tabRef.current[idx] = e), className: classes.tab, key: String(i.value), value: String(i.value) }, tabProps),
@@ -1705,7 +1633,6 @@ exports.Checkbox = Checkbox;
 exports.ChipButton = ChipButton;
 exports.DEBOUNCED_TIME = DEBOUNCED_TIME;
 exports.Flag = Flag;
-exports.ImageWrap = ImageWrap;
 exports.Input = Input;
 exports.NumberInput = NumberInput;
 exports.OTP = OTP;
@@ -1720,5 +1647,3 @@ exports.Tabs = Tabs;
 exports.emotionCache = emotionCache;
 exports.getMantineThemeOverride = getMantineThemeOverride;
 exports.themeColors = themeColors;
-exports.useScreenSize = useScreenSize;
-exports.useStyles = useStyles$2;