@hhgtech/hhg-components 1.28.68 → 1.28.69

package/build/esm/index-b9b2c417.js

@@ -0,0 +1,837 @@
+import React__default, { useContext, useState } from 'react';
+import { M as MediaQueries } from './utils-2c484c05.js';
+import styled from 'styled-components';
+import { t as theme } from './theme-e74db08c.js';
+import { _ as __rest } from './tslib.es6-1b1533a9.js';
+import { T as TogetherComponentGlobalContext } from './utils-70718e9c.js';
+
+const StyledPopup = styled.div `
+  position: fixed;
+  left: 50%;
+
+  padding: 0 16px 32px;
+  background-color: ${theme.colors.white};
+  border-radius: ${theme.borderRadius};
+  box-shadow: 0px 4px 8px ${theme.colors.gray200};
+  transform: translate(-50%, -50%);
+  transition: all 0.5s ease-in-out;
+  visibility: hidden;
+
+  &[data-open='true'] {
+    z-index: 400;
+    top: 50%;
+    opacity: 1;
+    visibility: visible;
+  }
+
+  &[data-open='false'] {
+    top: -50%;
+  }
+
+  &[data-type='lead'] {
+    width: 332px;
+    height: 460px;
+
+    div {
+      top: -15px;
+      right: -15px;
+    }
+  }
+
+  &[data-type='form'] {
+    width: 496px;
+    height: 548px;
+    ${MediaQueries.mbDown} {
+      width: 340px;
+    }
+  }
+
+  &[data-type='confirm'] {
+    ${MediaQueries.mbDown} {
+      width: calc(100% - 32px);
+    }
+    ${MediaQueries.mbUp} {
+      width: 100%;
+      max-width: 407px;
+    }
+  }
+
+  .popup-content {
+    position: relative;
+    z-index: 111;
+    height: 100%;
+    padding: 16px;
+  }
+
+  .close-button {
+    position: absolute;
+    top: 16px;
+    right: 0;
+    cursor: pointer;
+
+    img {
+      width: 100%;
+      height: 100%;
+      border-radius: 50%;
+    }
+  }
+`;
+const StyledPopupWrapper = styled.div `
+  position: fixed;
+  z-index: 110;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  align-items: center;
+  background: rgba(38, 38, 38, 0.3);
+
+  &[data-open='false'] {
+    display: none;
+  }
+`;
+
+const Popup = ({ type = 'lead', closeIcon, isOpen = true, onClose, children, className = '', enableAnimation = true, }) => {
+    return (React__default.createElement(React__default.Fragment, null,
+        React__default.createElement(StyledPopup, { "data-open": isOpen, "data-type": type, "data-animation": enableAnimation },
+            React__default.createElement("div", { className: `${className || ''} popup-content` },
+                !!closeIcon && (React__default.createElement("div", { className: "close-button", onClick: onClose }, closeIcon)),
+                children)),
+        React__default.createElement(StyledPopupWrapper, { "data-open": isOpen, onClick: onClose })));
+};
+
+const formatAuthor = (author) => {
+    if (!author)
+        return {};
+    return {
+        displayName: author.display_name || null,
+        avatar: author.avatar || null,
+        thumbnailAvatar: author.avatar_thumbnail || null,
+        profileUrl: author.profile_url || null,
+        description: author.description || null,
+        metaTag: author.meta_tag || '',
+        specialty: author.specialty || '',
+        organisation: author.organisation || '',
+    };
+};
+const formatArticleExpert = (expert) => {
+    if (!expert)
+        return {};
+    return {
+        id: expert.ID || null,
+        name: expert.name || null,
+        specialty: expert.specialty || null,
+        avatar: expert.avatar || null,
+        permalink: expert.permalink || null,
+        thumbnailAvatar: expert.avatar_thumbnail || null,
+    };
+};
+const formatSpotlightsSummary = (spotlight) => {
+    if (typeof spotlight === 'undefined' || !spotlight)
+        return null;
+    return {
+        id: spotlight.ID,
+        name: spotlight.name,
+        permalink: spotlight.permalink,
+        image: (spotlight === null || spotlight === void 0 ? void 0 : spotlight.small_banner) || (spotlight === null || spotlight === void 0 ? void 0 : spotlight.image) || '',
+        imageMedium: (spotlight === null || spotlight === void 0 ? void 0 : spotlight.image_medium) || null,
+        imageThumbnail: (spotlight === null || spotlight === void 0 ? void 0 : spotlight.image_thumbnail) || null,
+        // desktopBanner: spotlight?.desktop_banner || '',
+        // mobileBanner: spotlight?.mobile_banner || '',
+        startDate: spotlight === null || spotlight === void 0 ? void 0 : spotlight.start_date,
+        endDate: spotlight === null || spotlight === void 0 ? void 0 : spotlight.end_date,
+    };
+};
+const formatArticleSubscriptionBanner = (banner) => {
+    if (!banner)
+        return {};
+    const { button_text, button_url, status, banner_desktop, banner_mobile } = banner, rest = __rest(banner, ["button_text", "button_url", "status", "banner_desktop", "banner_mobile"]);
+    return Object.assign({ buttonText: button_text || '', buttonUrl: button_url || '', status: Boolean(status), bannerDesktop: banner_desktop || '', bannerMobile: banner_mobile || '' }, rest);
+};
+const TRANSLATE_LANGUAGES = {
+    EN: 'English',
+    FIL: 'Filipino',
+};
+const formatTranslateOptions = (translate) => {
+    if (typeof translate === 'undefined' || Object.keys(translate).length < 2)
+        return [];
+    return Object.keys(translate).map((languageKey) => ({
+        label: languageKey.toUpperCase() in TRANSLATE_LANGUAGES
+            ? TRANSLATE_LANGUAGES[languageKey.toUpperCase()]
+            : languageKey.toUpperCase(),
+        value: translate[languageKey].slice(-1) === '/'
+            ? translate[languageKey]
+            : `${translate[languageKey]}/`,
+    }));
+};
+const formatArticle = (article) => {
+    var _a, _b, _c, _d;
+    if (!article)
+        return {};
+    return {
+        id: article.ID,
+        postName: article.post_name,
+        sponsor: article.sponsor ? formatSponsor(article.sponsor) : null,
+        isSponsored: article.is_sponsored || null,
+        isPremium: article.is_premium || false,
+        postTitle: article.post_title || '',
+        postModified: article.post_modified || '',
+        postDate: article.post_date || '',
+        modifiedTime: article.modified_time || '',
+        permalink: article.permalink || '',
+        featureImage: article.image || null,
+        featureImageMobile: article.image_medium || null,
+        featureImageMobileXs: article.image_thumbnail || null,
+        author: formatAuthor(article.author),
+        reviewer: article.reviewed_by
+            ? formatAuthor(article.reviewed_by) || null
+            : null,
+        articleReviewed: (article === null || article === void 0 ? void 0 : article.reviewed)
+            ? Object.assign(Object.assign({}, article === null || article === void 0 ? void 0 : article.reviewed), { author: formatUserProfile((_a = article === null || article === void 0 ? void 0 : article.reviewed) === null || _a === void 0 ? void 0 : _a.author), editor: formatUserProfile((_b = article === null || article === void 0 ? void 0 : article.reviewed) === null || _b === void 0 ? void 0 : _b.editor), expert: formatUserProfile((_c = article === null || article === void 0 ? void 0 : article.reviewed) === null || _c === void 0 ? void 0 : _c.expert), fact_check: formatUserProfile((_d = article === null || article === void 0 ? void 0 : article.reviewed) === null || _d === void 0 ? void 0 : _d.fact_check) }) : null,
+        category: formatCategory(article.category),
+        postContent: article.post_content || null,
+        keyTakeaways: article.key_takeaways || null,
+        categories: (article.categories || []).map(formatCategory),
+        sources: article.sources || null,
+        description: article.description || null,
+        excerpt: article.excerpt || null,
+        expert: formatArticleExpert(article.expert),
+        metaTag: article.meta_tag || null,
+        spotlight: formatSpotlightsSummary(article === null || article === void 0 ? void 0 : article.spotlight),
+        affiliate_message: article.affiliate_message || null,
+        turnOffComment: !!article.turn_off_comment,
+        hasAffiliate: !!article.is_affiliate,
+        // faqs: (article.faqs || []).map(formatArticleFaqs),
+        translateOptions: formatTranslateOptions(article.translate),
+        jumpingLink: article.jumping_link || [],
+        pregnancy: (article === null || article === void 0 ? void 0 : article.pregnancy) || false,
+        pregnancyWeek: (article === null || article === void 0 ? void 0 : article.week_pregnancy) || 1,
+        primaryCategory: formatCategory(article.primary_category),
+        turnOffIvsPlayer: !!article.turn_off_ivs_player,
+        turnOffArticleVoice: !!article.turn_off_article_voice,
+        enableAudio: !!article.enable_audio,
+        // breadcrumb: (article.breadcrumb || [])?.map(formatBreadcrumb) || [],
+        label: (article === null || article === void 0 ? void 0 : article.label) || '',
+        editLast: formatAuthor(article.edit_last),
+        subscriptionBanner: formatArticleSubscriptionBanner(article.subscription_banner),
+    };
+};
+const formatUserProfile = (user) => {
+    if (typeof user === 'undefined' || !user)
+        return null;
+    return Object.assign(Object.assign({}, user), { profile_url: (user === null || user === void 0 ? void 0 : user.slug)
+            ? ['expert', 'medical'].includes((user === null || user === void 0 ? void 0 : user.role) || '')
+                ? `/expert/${user === null || user === void 0 ? void 0 : user.slug}`
+                : `/author/${user === null || user === void 0 ? void 0 : user.slug}`
+            : user.profile_url });
+};
+const formatBMIResult = (data) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    if (!data || !data.status)
+        return {};
+    return {
+        status: data === null || data === void 0 ? void 0 : data.status,
+        comparison: (_a = data === null || data === void 0 ? void 0 : data.comparison) !== null && _a !== void 0 ? _a : '',
+        assessmentData: [
+            {
+                tab: 'tools.condition',
+                content: (_b = data === null || data === void 0 ? void 0 : data.condition) !== null && _b !== void 0 ? _b : '',
+            },
+            {
+                tab: 'tools.risks',
+                content: (_c = data === null || data === void 0 ? void 0 : data.risk) !== null && _c !== void 0 ? _c : '',
+            },
+            {
+                tab: 'tools.suggestion',
+                content: (_d = data === null || data === void 0 ? void 0 : data.suggestion) !== null && _d !== void 0 ? _d : '',
+            },
+        ],
+        chartData: ((_e = data === null || data === void 0 ? void 0 : data.chart_data) === null || _e === void 0 ? void 0 : _e.length) > 0 ? data === null || data === void 0 ? void 0 : data.chart_data : [],
+        disclaimer: (_f = data === null || data === void 0 ? void 0 : data.disclaimer) !== null && _f !== void 0 ? _f : '',
+        illustrator: (_g = data === null || data === void 0 ? void 0 : data.illustrator) !== null && _g !== void 0 ? _g : '',
+        faqs: (_h = data === null || data === void 0 ? void 0 : data.faqs) !== null && _h !== void 0 ? _h : [],
+        suggestedArticlesLink: (_j = data === null || data === void 0 ? void 0 : data.suggested_articles_link) !== null && _j !== void 0 ? _j : '',
+        // suggestedArticles: data?.suggested_articles?.map(formatArticle) ?? [],
+    };
+};
+const formatSponsor = (sponsor) => {
+    if (!sponsor)
+        return {};
+    return {
+        title: sponsor.title,
+        logo: sponsor.logo,
+        link: sponsor.link,
+    };
+};
+const formatReviewedCategory = (data) => {
+    return {
+        postTitle: data.post_title,
+        permalink: data.permalink,
+    };
+};
+const formatCategory = (category) => {
+    var _a, _b;
+    if (!category)
+        return {};
+    return {
+        termId: category.term_id || null,
+        sponsor: category.sponsor ? formatSponsor(category.sponsor) : null,
+        isSponsored: category.is_sponsored || null,
+        categoryName: category.cat_name || null,
+        name: category.name || null,
+        iconUrl: category.icon || '',
+        slugName: category.category_nicename || null,
+        description: category.description || null,
+        featureImage: category.image || null,
+        displayName: category.name || null,
+        parent: category.parent || null,
+        permalink: category.permalink || null,
+        slug: category.slug || null,
+        childCates: ((_a = category.child_cates) === null || _a === void 0 ? void 0 : _a.map((childCate) => {
+            return formatCategory(childCate);
+        })) || [],
+        colorFeatureImage: category.color_feature_image || null,
+        imageColor: category.image_color || null,
+        textColor: category.text_color || null,
+        catParent: ((_b = category.cat_parent) === null || _b === void 0 ? void 0 : _b.name)
+            ? {
+                name: category.cat_parent.name,
+                permalink: category.cat_parent.permalink,
+            }
+            : {},
+        metaTag: category.meta_tag || '',
+        reviewedBy: category.reviewed_by
+            ? formatReviewedCategory(category.reviewed_by)
+            : null,
+        reviewedDate: category.reviewed_date || '',
+        faqs: category.faqs
+            ? category.faqs.map((faq) => formatFaqsCategory(faq))
+            : null,
+    };
+};
+const formatCategoryApi = (category) => {
+    if (!category)
+        return {};
+    return {
+        categoryInfo: formatCategory(category.data.category) || null,
+        explainersPosts: (category.data.explainers_posts || []).map(formatArticle),
+        subCategories: (category.data.sub_categories || []).map(formatCategory),
+    };
+};
+const formatFaqsCategory = (data) => {
+    return {
+        title: data.title,
+        content: data.content,
+    };
+};
+const formatHealthTool = (healthTool) => {
+    if (!healthTool)
+        return {};
+    return {
+        icon: healthTool.icon,
+        link: healthTool.link.startsWith('http')
+            ? healthTool.link
+            : '/health-tools' + healthTool.link,
+        subtitle: healthTool.subtitle,
+        title: healthTool.title,
+    };
+};
+const formatHealthToolTypeCategory = (category) => {
+    var _a, _b;
+    if (!category)
+        return {};
+    return {
+        termId: (category === null || category === void 0 ? void 0 : category.term_id) || 0,
+        name: (category === null || category === void 0 ? void 0 : category.name) || '',
+        healthTools: (_b = (_a = category === null || category === void 0 ? void 0 : category.health_tools) === null || _a === void 0 ? void 0 : _a.map((tool) => formatHealthTool(tool))) !== null && _b !== void 0 ? _b : [],
+    };
+};
+const formatCommunity = (community) => {
+    if (!community)
+        return {};
+    return {
+        topicCount: community.topics_count || 0,
+        postCount: community.posts_count || 0,
+        memberCount: community.members_count || 0,
+        thumbnail: community.thumbnail || '',
+        coverImage: community.cover_image || '',
+        mobileCoverImage: community.mobile_cover_image || '',
+        name: community.name || '',
+        description: community.description || '',
+        slug: community.slug || '',
+        id: community.id || 0,
+        joined: Boolean(community.joined),
+        isActive: community.is_active !== null && typeof community.is_active !== 'undefined'
+            ? Boolean(community.is_active)
+            : true,
+        mappedCategoryId: community.mapped_category_id || 0,
+        discoverCategory: community.discover_category
+            ? {
+                categoryId: community.discover_category.category_id || 0,
+                name: community.discover_category.name || '',
+            }
+            : null,
+        isHidden: Boolean(community.is_hidden),
+    };
+};
+const formatTopic = (topic) => {
+    var _a, _b, _c, _d;
+    if (!topic)
+        return {};
+    return {
+        id: topic.id || 0,
+        name: topic.name || '',
+        image: topic.thumbnail || '',
+        slug: topic.slug || '',
+        url: '/' + ((_a = topic.community) === null || _a === void 0 ? void 0 : _a.slug) + '/' + (topic === null || topic === void 0 ? void 0 : topic.slug) || '',
+        description: topic.description || '',
+        joined: topic.joined || false,
+        postCount: topic.count_posts || 0,
+        memberCount: topic.count_members || 0,
+        communityId: String((_b = topic.community) === null || _b === void 0 ? void 0 : _b.id),
+        communitySlug: (_c = topic.community) === null || _c === void 0 ? void 0 : _c.slug,
+        communityName: (_d = topic.community) === null || _d === void 0 ? void 0 : _d.name,
+        order: topic.order || 0,
+        isActive: topic.is_active !== null && typeof topic.is_active !== 'undefined'
+            ? Boolean(topic.is_active)
+            : true,
+        mappedCategoryId: topic.mapped_category_id || 0,
+        discoverCategory: topic.discover_category
+            ? {
+                categoryId: topic.discover_category.category_id || 0,
+                name: topic.discover_category.name || '',
+            }
+            : null,
+        isHidden: Boolean(topic.is_hidden),
+    };
+};
+const formatExpertAnswer = (data) => {
+    if (!data)
+        return {};
+    return {
+        answer: data === null || data === void 0 ? void 0 : data.answer.map(formatComment),
+        expert: data === null || data === void 0 ? void 0 : data.expert,
+    };
+};
+const formatPost = (post) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
+    if (!post)
+        return {};
+    return {
+        id: post.id,
+        topics: ((_a = post.topics) === null || _a === void 0 ? void 0 : _a.map((topic) => {
+            var _a, _b, _c, _d;
+            return ({
+                id: topic.id || 0,
+                name: topic.name || '',
+                slug: topic.slug || '',
+                url: '/' + ((_a = post.community) === null || _a === void 0 ? void 0 : _a.slug) + '/' + topic.slug,
+                communityId: String((_b = post.community) === null || _b === void 0 ? void 0 : _b.id),
+                communitySlug: ((_c = post.community) === null || _c === void 0 ? void 0 : _c.slug) || '',
+                communityName: ((_d = post.community) === null || _d === void 0 ? void 0 : _d.name) || '',
+                isHidden: Boolean(topic.is_hidden),
+                isActive: true,
+            });
+        })) || [],
+        community: {
+            id: ((_b = post.community) === null || _b === void 0 ? void 0 : _b.id) || 0,
+            name: ((_c = post.community) === null || _c === void 0 ? void 0 : _c.name) || '',
+            slug: ((_d = post.community) === null || _d === void 0 ? void 0 : _d.slug) || '',
+            isActive: true,
+            isHidden: Boolean((_e = post.community) === null || _e === void 0 ? void 0 : _e.is_hidden),
+        },
+        slug: post.slug || '',
+        author: {
+            id: ((_f = post.user) === null || _f === void 0 ? void 0 : _f.id) || 0,
+            username: ((_g = post.user) === null || _g === void 0 ? void 0 : _g.user_name) || '',
+            email: ((_h = post.user) === null || _h === void 0 ? void 0 : _h.email) || '',
+            name: ((_j = post.user) === null || _j === void 0 ? void 0 : _j.name) || '',
+            avatar: ((_k = post.user) === null || _k === void 0 ? void 0 : _k.avatar) || '',
+            role: ((_l = post.user) === null || _l === void 0 ? void 0 : _l.role)
+                ? (_o = (_m = post.user) === null || _m === void 0 ? void 0 : _m.role) === null || _o === void 0 ? void 0 : _o.toLowerCase()
+                : '',
+            type: ((_p = post.user) === null || _p === void 0 ? void 0 : _p.type) || '',
+            partnerId: ((_q = post.user) === null || _q === void 0 ? void 0 : _q.partner_id) ? String((_r = post.user) === null || _r === void 0 ? void 0 : _r.partner_id) : '',
+            title: ((_s = post.user) === null || _s === void 0 ? void 0 : _s.title) || '',
+            doctorId: ((_t = post.user) === null || _t === void 0 ? void 0 : _t.doctor_id) ? String((_u = post.user) === null || _u === void 0 ? void 0 : _u.doctor_id) : '',
+            hospitalId: ((_v = post.user) === null || _v === void 0 ? void 0 : _v.hospital_id) ? String((_w = post.user) === null || _w === void 0 ? void 0 : _w.hospital_id) : '',
+        },
+        previewUrl: {
+            title: post.preview_title || '',
+            url: post.preview_link || '',
+            image: post.preview_image || '',
+            description: post.preview_description || '',
+        },
+        createdAt: post.created_at || '',
+        scheduleDateTime: post.schedule_datetime || '',
+        photos: post.images || [],
+        description: post.description || '',
+        commentsCount: post.comments_count || 0,
+        likesCount: post.likes_count || 0,
+        title: post.name || '',
+        isPin: !!post.is_pin,
+        pinDate: post.pin_date || '',
+        liked: post.liked || false,
+        bookmarked: Boolean(post.bookmarked) || false,
+        mentions: post.mentions || [],
+        commented: Boolean(post.commented) || false,
+        introUrl: post.intro_url || '',
+        bannerImage: post.banner_image || '',
+        isAnonymous: post.is_anonymous ? 1 : 0,
+        isAskDoctor: post.is_question ? 1 : 0,
+        expertAnswer: formatExpertAnswer(post === null || post === void 0 ? void 0 : post.expert_answer),
+        createdTime: post.created_time || '',
+        isMinigame: post.event_type === 'mini_game',
+        eventStart: post.event_start,
+        eventEnd: post.event_end,
+        // authorExpertId: post.author_expert_id ? String(post.author_expert_id) : '',
+    };
+};
+const formatPostPagination = (pagination) => {
+    if (!pagination)
+        return {};
+    return {
+        currentPage: pagination.current || 0,
+        lastPage: pagination.last || 0,
+        total: pagination.total_items || 0,
+    };
+};
+const formatNotification = (notification) => {
+    var _a, _b, _c;
+    if (!notification)
+        return {};
+    return {
+        time: notification.created_at,
+        content: notification.content,
+        postId: String(notification.post_id),
+        fromUser: {
+            name: (_a = notification.from_user) === null || _a === void 0 ? void 0 : _a.name,
+            id: (_b = notification.from_user) === null || _b === void 0 ? void 0 : _b.id,
+            avatar: (_c = notification.from_user) === null || _c === void 0 ? void 0 : _c.avatar,
+        },
+        toUserId: String(notification.to_user_id),
+        postSlug: notification.post_slug || '',
+        communitySlug: notification.community_slug || '',
+    };
+};
+const formatSpotlightsList = (spotligts) => {
+    if (!spotligts)
+        return [];
+    return spotligts.map((spotlight) => ({
+        id: spotlight.ID,
+        name: spotlight.name,
+        permalink: spotlight.permalink,
+        image: (spotlight === null || spotlight === void 0 ? void 0 : spotlight.small_banner) || (spotlight === null || spotlight === void 0 ? void 0 : spotlight.image),
+        imageMedium: (spotlight === null || spotlight === void 0 ? void 0 : spotlight.image_medium) || null,
+        imageThumbnail: (spotlight === null || spotlight === void 0 ? void 0 : spotlight.image_thumbnail) || null,
+        startDate: spotlight === null || spotlight === void 0 ? void 0 : spotlight.start_date,
+        endDate: spotlight === null || spotlight === void 0 ? void 0 : spotlight.end_date,
+    }));
+};
+const formatOvulationInfo = (data) => {
+    if (!data)
+        return {};
+    return {
+        disclaimer: data.disclaimer,
+        featuredImage: data.featured_image,
+        info: data.informations || [],
+        reviewedBy: data.reviewed_by
+            ? {
+                id: data.reviewed_by.ID,
+                permalink: data.reviewed_by.permalink,
+                name: data.reviewed_by.name,
+                postTitle: data.reviewed_by.post_title,
+            }
+            : null,
+        reviewedDate: data.reviewed_date,
+    };
+};
+const formatSuggestedArticle = (data) => {
+    if (!data)
+        return {};
+    return {
+        postId: data.post_id || null,
+        categoryId: data.category_id || null,
+        postUrl: data.post_url || null,
+        postReviewed: data.post_reviewed || null,
+        postPageviews: data.post_pageviews || null,
+        postRank: data.post_rank || null,
+        isPin: data.is_pin || null,
+        frequency: data.frequency || null,
+        topic: data.topic || null,
+    };
+};
+const formatTopicHealthTool = (data) => {
+    if (!data)
+        return {};
+    return {
+        id: data.tool_id || null,
+        topicFrequency: data.frequency || null,
+        topicId: data.topic_id || null,
+        topicName: data.topic_name || null,
+        isPinned: !!data.is_pin || null,
+        toolLink: data.tool_link || '',
+    };
+};
+const formatComment = (data) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7;
+    if (!data)
+        return {};
+    return {
+        content: data.content,
+        countLikes: data.likes_count,
+        countReplies: data.replies_count,
+        createdAt: data.created_at,
+        createdTime: data.created_time,
+        id: String(data.id),
+        images: data.image || [],
+        link: data.link || null,
+        replies: data.replies && data.replies.length > 0
+            ? data.replies.map(formatComment)
+            : [],
+        author: {
+            id: ((_a = data.user) === null || _a === void 0 ? void 0 : _a.id) || 0,
+            username: ((_b = data.user) === null || _b === void 0 ? void 0 : _b.user_name) || '',
+            name: ((_c = data.user) === null || _c === void 0 ? void 0 : _c.name) || '',
+            role: ((_d = data.user) === null || _d === void 0 ? void 0 : _d.role)
+                ? (_f = (_e = data.user) === null || _e === void 0 ? void 0 : _e.role) === null || _f === void 0 ? void 0 : _f.toLowerCase()
+                : '',
+            avatar: ((_g = data.user) === null || _g === void 0 ? void 0 : _g.avatar) || '',
+            type: ((_h = data.user) === null || _h === void 0 ? void 0 : _h.type) || '',
+            email: ((_j = data.user) === null || _j === void 0 ? void 0 : _j.email) || '',
+            partnerId: ((_k = data.user) === null || _k === void 0 ? void 0 : _k.partner_id) ? String((_l = data.user) === null || _l === void 0 ? void 0 : _l.partner_id) : '',
+            title: ((_m = data.user) === null || _m === void 0 ? void 0 : _m.title) || '',
+            doctorId: ((_o = data.user) === null || _o === void 0 ? void 0 : _o.doctor_id) ? String((_p = data.user) === null || _p === void 0 ? void 0 : _p.doctor_id) : '',
+            hospitalId: ((_q = data.user) === null || _q === void 0 ? void 0 : _q.hospital_id) ? String((_r = data.user) === null || _r === void 0 ? void 0 : _r.hospital_id) : '',
+        },
+        liked: !!data.liked,
+        mentionedUser: data.mentioned
+            ? {
+                id: ((_s = data.mentioned) === null || _s === void 0 ? void 0 : _s.id) || 0,
+                username: ((_t = data.mentioned) === null || _t === void 0 ? void 0 : _t.user_name) || '',
+                name: ((_u = data.mentioned) === null || _u === void 0 ? void 0 : _u.name) || '',
+                role: ((_v = data.mentioned) === null || _v === void 0 ? void 0 : _v.role)
+                    ? (_x = (_w = data.mentioned) === null || _w === void 0 ? void 0 : _w.role) === null || _x === void 0 ? void 0 : _x.toLowerCase()
+                    : '',
+                avatar: ((_y = data.mentioned) === null || _y === void 0 ? void 0 : _y.avatar) || '',
+                type: ((_z = data.mentioned) === null || _z === void 0 ? void 0 : _z.type) || '',
+                email: ((_0 = data.mentioned) === null || _0 === void 0 ? void 0 : _0.email) || '',
+                partnerId: ((_1 = data.mentioned) === null || _1 === void 0 ? void 0 : _1.partner_id)
+                    ? String((_2 = data.mentioned) === null || _2 === void 0 ? void 0 : _2.partner_id)
+                    : '',
+                doctorId: ((_3 = data.mentioned) === null || _3 === void 0 ? void 0 : _3.doctor_id)
+                    ? String((_4 = data.mentioned) === null || _4 === void 0 ? void 0 : _4.doctor_id)
+                    : '',
+                hospitalId: ((_5 = data.mentioned) === null || _5 === void 0 ? void 0 : _5.hospital_id)
+                    ? String((_6 = data.mentioned) === null || _6 === void 0 ? void 0 : _6.hospital_id)
+                    : '',
+                title: ((_7 = data.mentioned) === null || _7 === void 0 ? void 0 : _7.title) || '',
+            }
+            : null,
+        mentions: data.mentions || [],
+        isSensitive: data.is_sensitive || 0,
+        userReadComment: data.user_read_comment,
+        source: data.source || [],
+        isVerify: data.is_verify || 0,
+        isOppose: data.is_oppose || 0,
+        userVerify: data.user_verify || {},
+        categorySlug: data.categories || '',
+        isAnonymous: Boolean(Number(data.is_anonymous || 0)),
+    };
+};
+const formatReportedPostToPostDetail = (data) => {
+    if (!data)
+        return {};
+    return {
+        name: data.title,
+        description: data.description,
+        images: data.images,
+        likes_count: data.count_likes,
+        comments_count: data.count_comments,
+        topics: [],
+        // created_at:
+        // created_date?: string
+        // preview_image:
+        slug: data.post_slug,
+        id: data.post_id,
+        is_pin: data.is_pin,
+        pin_date: '',
+        post_type: data.post_type,
+        schedule_datetime: data.schedule_datetime,
+        is_active: data.is_active,
+        preview_title: data.preview_title || '',
+        preview_image: data.preview_image || '',
+        preview_description: data.preview_description || '',
+        preview_link: data.preview_link || '',
+        user: data.user,
+        created_at: '',
+        created_time: '',
+        community: {
+            id: data.community_id,
+            name: data.community_name,
+            slug: data.community_slug,
+            description: '',
+        },
+    };
+};
+const formatTopicSubot = (data) => {
+    if (!data)
+        return {};
+    return {
+        chatBotId: data.subot_id,
+        isPinned: data.is_pin,
+        topicId: data.topic_id,
+        topicFrequency: data.frequency,
+    };
+};
+const formatSiteWideBanner = (sitewide_banner, type) => {
+    if (typeof sitewide_banner === 'undefined' || !sitewide_banner)
+        return null;
+    return {
+        content: (sitewide_banner === null || sitewide_banner === void 0 ? void 0 : sitewide_banner.content) || '',
+        icon: (sitewide_banner === null || sitewide_banner === void 0 ? void 0 : sitewide_banner.icon) || '',
+        type: type || 'other',
+    };
+};
+const formatPWGContent = (data) => {
+    if (!data)
+        return {};
+    return {
+        disclaimer: data.disclaimer,
+        info: data.info || [],
+        reviewedBy: data.reviewed_by ? formatUserProfile(data.reviewed_by) : null,
+        reviewedDate: data.reviewed_date,
+        metaTag: data.meta_tag,
+    };
+};
+const formatUserProfileUrl = (user) => {
+    if (typeof user === 'undefined' || !user)
+        return '';
+    return (user === null || user === void 0 ? void 0 : user.turn_off_profile)
+        ? ''
+        : (user === null || user === void 0 ? void 0 : user.slug)
+            ? ['expert', 'medical'].includes((user === null || user === void 0 ? void 0 : user.role) || '')
+                ? `/expert/${user === null || user === void 0 ? void 0 : user.slug}`
+                : `/author/${user === null || user === void 0 ? void 0 : user.slug}`
+            : (user === null || user === void 0 ? void 0 : user.profile_url) || (user === null || user === void 0 ? void 0 : user.permalink) || '#';
+};
+const formatTHRContent = (data) => {
+    if (!data)
+        return {};
+    return {
+        disclaimer: data.disclaimer,
+        info: data.info || [],
+        reviewedBy: data.reviewed_by ? formatUserProfile(data.reviewed_by) : null,
+        reviewedDate: data.reviewed_date,
+        metaTag: data.meta_tag,
+    };
+};
+const formatBabyGrowthContent = (data) => {
+    var _a, _b, _c;
+    if (!data || !data.information)
+        return {};
+    return {
+        information: (_a = data.information.map((info) => ({
+            title: info.title,
+            description: info.description,
+        }))) !== null && _a !== void 0 ? _a : [],
+        reviewBy: {
+            reviewer: ((_b = data.reviewed_by) === null || _b === void 0 ? void 0 : _b.display_name) || ((_c = data.reviewed_by) === null || _c === void 0 ? void 0 : _c.name) || '',
+            date: data.reviewed_date || '',
+            link: formatUserProfileUrl(data === null || data === void 0 ? void 0 : data.reviewed_by),
+        },
+        metaTag: data.meta_tag || '',
+        title: data.title || '',
+        description: data.description || '',
+        disclaimer: data.disclaimer || '',
+        is_sponsored: data.is_sponsored || false,
+        sponsor: data.sponsor,
+        featuredImage: data.featured_image || '',
+    };
+};
+
+var dataTransform = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  formatAuthor: formatAuthor,
+  formatArticleExpert: formatArticleExpert,
+  formatSpotlightsSummary: formatSpotlightsSummary,
+  TRANSLATE_LANGUAGES: TRANSLATE_LANGUAGES,
+  formatTranslateOptions: formatTranslateOptions,
+  formatArticle: formatArticle,
+  formatUserProfile: formatUserProfile,
+  formatBMIResult: formatBMIResult,
+  formatSponsor: formatSponsor,
+  formatReviewedCategory: formatReviewedCategory,
+  formatCategory: formatCategory,
+  formatCategoryApi: formatCategoryApi,
+  formatFaqsCategory: formatFaqsCategory,
+  formatHealthTool: formatHealthTool,
+  formatHealthToolTypeCategory: formatHealthToolTypeCategory,
+  formatCommunity: formatCommunity,
+  formatTopic: formatTopic,
+  formatExpertAnswer: formatExpertAnswer,
+  formatPost: formatPost,
+  formatPostPagination: formatPostPagination,
+  formatNotification: formatNotification,
+  formatSpotlightsList: formatSpotlightsList,
+  formatOvulationInfo: formatOvulationInfo,
+  formatSuggestedArticle: formatSuggestedArticle,
+  formatTopicHealthTool: formatTopicHealthTool,
+  formatComment: formatComment,
+  formatReportedPostToPostDetail: formatReportedPostToPostDetail,
+  formatTopicSubot: formatTopicSubot,
+  formatSiteWideBanner: formatSiteWideBanner,
+  formatPWGContent: formatPWGContent,
+  formatUserProfileUrl: formatUserProfileUrl,
+  formatTHRContent: formatTHRContent,
+  formatBabyGrowthContent: formatBabyGrowthContent
+});
+
+const StyledUserAvatar = styled.div `
+  width: ${(props) => props.size || 40}px;
+  height: ${(props) => props.size || 40}px;
+  flex-shrink: 0;
+  cursor: pointer;
+
+  img {
+    border-radius: 50%;
+  }
+
+  .avatar {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+
+  .avatar-default {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background-color: ${theme.colors.secondaryBase};
+    border-radius: 50%;
+    color: white;
+    font-size: 1em;
+    font-weight: bold;
+    line-height: 1;
+  }
+
+  &[data-is-marrybaby='true'] {
+    .avatar-default {
+      background-color: ${theme.mbColors.pink};
+    }
+  }
+`;
+
+const UserAvatar = (_a) => {
+    var { className, isMarryBaby: isMarryBabyProp, style, avatar, username, size } = _a, rest = __rest(_a, ["className", "isMarryBaby", "style", "avatar", "username", "size"]);
+    const { data: { env: { isMarryBaby: isMarryBabyContext }, }, } = useContext(TogetherComponentGlobalContext);
+    const isMarryBaby = typeof isMarryBabyProp === 'boolean' ? isMarryBabyProp : isMarryBabyContext;
+    const [tempAvatar, setTempAvatar] = useState(false);
+    return (React__default.createElement(StyledUserAvatar, Object.assign({ "data-is-marrybaby": isMarryBaby, className: className, style: style, size: size }, rest), avatar && !tempAvatar ? (React__default.createElement("img", { loading: "lazy", src: avatar, className: `avatar`, alt: "avatar", onError: () => {
+            // e.currentTarget.onerror = null
+            if (!tempAvatar)
+                setTempAvatar(true);
+        } })) : (React__default.createElement("div", { className: "avatar avatar-default" }, username && (username === null || username === void 0 ? void 0 : username.length) > 0 ? username[0].toUpperCase() : 'A'))));
+};
+
+export { Popup as P, UserAvatar as U, formatPost as a, formatComment as b, formatCommunity as c, dataTransform as d, formatArticle as e, formatTopic as f, formatCategory as g, formatUserProfileUrl as h };