@hhgtech/hhg-components 1.29.82 → 1.29.83

package/build/esm/index-64dff9b0.js

@@ -0,0 +1,233 @@
+import { _ as __rest } from './tslib.es6-2d738692.js';
+import React__default, { createContext, useContext, useRef, useMemo, useState, useEffect } from 'react';
+import { useForm, isNotEmpty } from '@mantine/form';
+import { u as useHealthToolsCache } from './useHealthToolCache-fe7dc697.js';
+import { u as useTranslations } from './useTranslations-ba901edf.js';
+import { C as CommonGAssets } from './index-b9c4dfcb.js';
+import { H as HEALTH_TOOL_TYPE } from './constants-697503a2.js';
+import { G as GenderOptionControl } from './index-3e2f70fe.js';
+import { c as Input, S as Select } from './index-03d7200e.js';
+import { D as DatePicker } from './index-96a5f239.js';
+import '@mantine/core';
+import './index-7a1552e9.js';
+import './index-bdc3bd61.js';
+import '@mantine/hooks';
+import './index-38ced379.js';
+import './utils-40533779.js';
+import './useMantineLocale-faa72172.js';
+import './index-39aa0c9f.js';
+import './other-9b439f19.js';
+import { H as HealthToolFormWrapper } from './index-a1d2c38b.js';
+import { domainLocales } from './constantsDomainLocales.js';
+
+const ThrFormContext = createContext({});
+
+const DefaultForm = (_a) => {
+    var _b;
+    var props = __rest(_a, []);
+    const { t, locale } = useTranslations();
+    const { isAdult, activeValueNote, linkTool, form, submitProps } = useContext(ThrFormContext);
+    return (React__default.createElement(HealthToolFormWrapper, Object.assign({ formLayout: "default" }, props),
+        React__default.createElement(GenderOptionControl, Object.assign({}, form.getInputProps('gender'))),
+        React__default.createElement(DatePicker, Object.assign({}, form.getInputProps('age'), { placeholder: 'DD/MM/YYYY', popoverProps: {
+                withinPortal: true,
+            }, label: t('targetHeartRate.ageInput'), maxDate: new Date() })),
+        React__default.createElement(Input.Number, Object.assign({ label: t('targetHeartRate.heartRateInput'), placeholder: t('tools.inputPlaceholder', {
+                content: '60',
+            }) }, form.getInputProps('heartRate'), { min: 40, max: 200, styles: () => ({
+                rightSection: {
+                    width: 'auto',
+                },
+            }) })),
+        isAdult && (React__default.createElement(Select, Object.assign({ label: t('targetHeartRate.selectActive'), defaultValue: (_b = activeValueNote === null || activeValueNote === void 0 ? void 0 : activeValueNote[0]) === null || _b === void 0 ? void 0 : _b.value, data: activeValueNote.map((option) => ({
+                value: option.value,
+                label: option.label,
+            })), styles: {
+                item: {
+                    whiteSpace: 'nowrap',
+                    padding: '10px 12px',
+                    fontSize: '14px',
+                },
+            }, withinPortal: true }, form.getInputProps('activeValue')))),
+        React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "THR", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}` }, submitProps), t('bmi.submit'))));
+};
+
+const InlineForm = (_a) => {
+    var _b;
+    var props = __rest(_a, []);
+    const { t, locale } = useTranslations();
+    const { isAdult, activeValueNote, linkTool, form, submitProps } = useContext(ThrFormContext);
+    return (React__default.createElement(HealthToolFormWrapper, Object.assign({ formLayout: "inline" }, props),
+        React__default.createElement(HealthToolFormWrapper.FormRow, null,
+            React__default.createElement(HealthToolFormWrapper.BorderInlineControl, { label: t('tools.selectGender'), width: 'none' },
+                React__default.createElement(GenderOptionControl, Object.assign({ type: "radio", hideLabel: true, error: null }, form.getInputProps('gender')))),
+            form.errors.gender && (React__default.createElement(HealthToolFormWrapper.Error, null, form.errors.gender))),
+        React__default.createElement(HealthToolFormWrapper.FormRow, null,
+            React__default.createElement(HealthToolFormWrapper.BorderInlineControl, { label: t('targetHeartRate.ageInput') },
+                React__default.createElement(DatePicker, Object.assign({}, form.getInputProps('age'), { placeholder: 'DD/MM/YYYY', popoverProps: {
+                        withinPortal: true,
+                    }, error: null, maxDate: new Date() }))),
+            form.errors.age && (React__default.createElement(HealthToolFormWrapper.Error, null, form.errors.age))),
+        React__default.createElement(HealthToolFormWrapper.FormRow, null,
+            React__default.createElement(HealthToolFormWrapper.BorderInlineControl, { label: t('targetHeartRate.heartRateInput') },
+                React__default.createElement(Input.Number, Object.assign({ placeholder: t('tools.inputPlaceholder', {
+                        content: '60',
+                    }) }, form.getInputProps('heartRate'), { error: null, min: 40, max: 200, rightSection: React__default.createElement(HealthToolFormWrapper.Unit, null, "bmp"), styles: () => ({
+                        rightSection: {
+                            width: 'auto',
+                        },
+                    }) }))),
+            form.errors.heartRate && (React__default.createElement(HealthToolFormWrapper.Error, null, form.errors.heartRate))),
+        isAdult && (React__default.createElement(HealthToolFormWrapper.BorderInlineControl, { label: t('targetHeartRate.selectActive') },
+            React__default.createElement(Select, Object.assign({ defaultValue: (_b = activeValueNote === null || activeValueNote === void 0 ? void 0 : activeValueNote[0]) === null || _b === void 0 ? void 0 : _b.value, data: activeValueNote.map((option) => ({
+                    value: option.value,
+                    label: option.label,
+                })), styles: {
+                    item: {
+                        whiteSpace: 'nowrap',
+                        padding: '10px 12px',
+                        fontSize: '14px',
+                    },
+                }, withinPortal: true }, form.getInputProps('activeValue'))))),
+        React__default.createElement(HealthToolFormWrapper.Submit, Object.assign({ type: "submit", dataEventCategory: "Health Tool", dataEventAction: "THR", dataEventLabel: `https://${domainLocales[locale]}/${linkTool}` }, submitProps), t('bmi.submit'))));
+};
+
+const ThrForm = (_a) => {
+    var { formLayout, onSubmit, onError, submitProps } = _a, rest = __rest(_a, ["formLayout", "onSubmit", "onError", "submitProps"]);
+    const { t, locale } = useTranslations();
+    const minRange = useRef(40);
+    const { getHealthToolLink } = useHealthToolsCache(locale);
+    const form = useForm({
+        initialValues: {
+            heartRate: 60,
+            activeValue: 'low_intensity',
+        },
+        validate: {
+            gender: isNotEmpty(t('validation.error.requiredField')),
+            age: isNotEmpty(t('validation.error.requiredField')),
+            heartRate: (value) => {
+                return Number(value) >= minRange.current && Number(value) <= 200
+                    ? null
+                    : t('tools.heartRateRangeErr', {
+                        min: minRange.current,
+                        max: 200,
+                    });
+            },
+        },
+    });
+    const linkTool = useMemo(() => getHealthToolLink(HEALTH_TOOL_TYPE.THR), [getHealthToolLink]);
+    const [isAdult, setIsAdult] = useState(false);
+    const rangeHeartRateByAge = [
+        {
+            idAge: 0,
+            minAge: 0,
+            maxAge: 18,
+            rangeMale: 40,
+            rangeFemale: 40,
+        },
+        {
+            idAge: 1,
+            minAge: 18,
+            maxAge: 25,
+            rangeMale: 49,
+            rangeFemale: 54,
+        },
+        {
+            idAge: 2,
+            minAge: 25,
+            maxAge: 35,
+            rangeMale: 49,
+            rangeFemale: 54,
+        },
+        {
+            idAge: 3,
+            minAge: 35,
+            maxAge: 45,
+            rangeMale: 50,
+            rangeFemale: 54,
+        },
+        {
+            idAge: 4,
+            minAge: 45,
+            maxAge: 55,
+            rangeMale: 50,
+            rangeFemale: 54,
+        },
+        {
+            idAge: 5,
+            minAge: 55,
+            maxAge: 65,
+            rangeMale: 51,
+            rangeFemale: 54,
+        },
+        {
+            idAge: 6,
+            minAge: 65,
+            maxAge: 120,
+            rangeMale: 50,
+            rangeFemale: 54,
+        },
+    ];
+    const activeValueNote = [
+        {
+            value: 'low_intensity',
+            label: t('targetHeartRate.lowIntensity.title'),
+            image: CommonGAssets.getAssetPath(`/low.svg`),
+            imageActive: CommonGAssets.getAssetPath(`/low-active.svg`),
+            content: t('targetHeartRate.lowIntensity.note'),
+        },
+        {
+            value: 'moderate_intensity',
+            label: t('targetHeartRate.moderateIntensity.title'),
+            image: CommonGAssets.getAssetPath(`/moderate.svg`),
+            imageActive: CommonGAssets.getAssetPath(`/moderate-active.svg`),
+            content: t('targetHeartRate.moderateIntensity.note'),
+        },
+        {
+            value: 'aerobic_zone',
+            label: t('targetHeartRate.aerobicZone.title'),
+            image: CommonGAssets.getAssetPath(`/aerobic.svg`),
+            imageActive: CommonGAssets.getAssetPath(`/aerobic-active.svg`),
+            content: t('targetHeartRate.aerobicZone.note'),
+        },
+        {
+            value: 'vigorous_intensity',
+            label: t('targetHeartRate.vigorousIntensity.title'),
+            image: CommonGAssets.getAssetPath(`/vigorous.svg`),
+            imageActive: CommonGAssets.getAssetPath(`/vigorous-active.svg`),
+            content: t('targetHeartRate.vigorousIntensity.note'),
+        },
+        {
+            value: 'maximum_intensity',
+            label: t('targetHeartRate.maximumIntensity.title'),
+            image: CommonGAssets.getAssetPath(`/maximum.svg`),
+            imageActive: CommonGAssets.getAssetPath(`/maximum-active.svg`),
+            content: t('targetHeartRate.maximumIntensity.note'),
+        },
+    ];
+    useEffect(() => {
+        const ageDate = form.getInputProps('age').value;
+        const gender = form.getInputProps('gender').value;
+        if (ageDate instanceof Date) {
+            const age = (new Date().getTime() - ageDate.getTime()) / 1000;
+            if (age >= 18 * 365 * 24 * 60 * 60)
+                setIsAdult(true);
+            else
+                setIsAdult(false);
+            const rangeByAge = rangeHeartRateByAge.find((item) => age >= item.minAge * 365 * 24 * 60 * 60 &&
+                age < item.maxAge * 365 * 24 * 60 * 60) || rangeHeartRateByAge[0];
+            minRange.current =
+                gender === 'male' ? rangeByAge.rangeMale : rangeByAge.rangeFemale;
+        }
+    }, [form]);
+    const commonProps = Object.assign(Object.assign({}, rest), { onSubmit: form.onSubmit(onSubmit, onError) });
+    return (React__default.createElement(ThrFormContext.Provider, { value: {
+            isAdult,
+            activeValueNote,
+            linkTool,
+            form,
+            submitProps,
+        } }, formLayout === 'inline' ? (React__default.createElement(InlineForm, Object.assign({}, commonProps))) : (React__default.createElement(DefaultForm, Object.assign({}, commonProps)))));
+};
+
+export { ThrForm as T };

package/build/esm/{index-fa67d66e.js → index-6dd92895.js}

@@ -1,31 +1,33 @@
-import { a as __awaiter, _ as __rest } from './tslib.es6-06ba3978.js';
+import { a as __awaiter, _ as __rest } from './tslib.es6-2d738692.js';
 import React__default, { useState, useRef, useEffect, useCallback, useContext, useMemo } from 'react';
 import { Info, Ask } from '@hhgtech/icons/other';
 import { Checkbox, useMantineTheme, Popover } from '@mantine/core';
-import { D as Dropdown } from './index-29908d2c.js';
-import { u as useTranslations } from './useTranslations-b970f667.js';
+import { D as Dropdown } from './index-03050142.js';
+import { u as useTranslations } from './useTranslations-ba901edf.js';
 import innertext from 'innertext';
-import { t as theme } from './theme-7dadf4a1.js';
-import './index-9b3a8b6d.js';
+import { theme } from './miscTheme.js';
+import './index-03d7200e.js';
 import '@mantine/dates';
-import './index-6210f454.js';
-import './index-189d7601.js';
-import { C as CommonGAssets } from './index-9471fca1.js';
-import './useMantineLocale-453f8013.js';
-import { T as Text } from './index-5723381f.js';
-import { B as Button } from './index-1d3c6ce7.js';
+import './index-39aa0c9f.js';
+import './index-38ced379.js';
+import { C as CommonGAssets } from './index-b9c4dfcb.js';
+import './useMantineLocale-faa72172.js';
+import { T as Text } from './index-7a1552e9.js';
+import { B as Button } from './index-bdc3bd61.js';
 import '@mantine/hooks';
-import './utils-d7bbdb52.js';
-import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, P as PATHS, b as callApiWithAuth } from './utils-3b29eb79.js';
-import { u as useImagePicker, n as StyledCreatePostDescription, R as RichTextEditor, L as Loading, o as IconCloseCircle, p as highlightBadWords, q as decodeMention, r as decodePostUrl, s as getDefaultFailNoti, t as getPostFormData, v as editPost, w as createPost } from './index-c430773c.js';
+import './utils-40533779.js';
+import './other-9b439f19.js';
+import { T as TogetherComponentGlobalContext, c as callApi, d as getApiPath, b as callApiWithAuth } from './utils-c730ad5d.js';
+import { u as useImagePicker, n as StyledCreatePostDescription, R as RichTextEditor, L as Loading, o as IconCloseCircle, p as highlightBadWords, q as decodeMention, r as decodePostUrl, s as getDefaultFailNoti, t as getPostFormData, v as editPost, w as createPost } from './index-e6b9c7d8.js';
 import styled from '@emotion/styled';
-import { B as BtnChoice } from './index-cdc50618.js';
-import { g as formatTopic, b as formatPost } from './dataTransform-623716c3.js';
-import { M as MAX_IMAGE_UPLOADS } from './constants-a5827634.js';
-import { C as CardLink } from './index-10ab6596.js';
-import { I as Input } from './index-f660abb7.js';
+import { B as BtnChoice } from './index-4d06fffe.js';
+import { g as formatTopic, b as formatPost } from './dataTransform-8852461c.js';
+import { M as MAX_IMAGE_UPLOADS } from './constants-697503a2.js';
+import { C as CardLink } from './index-3288f45c.js';
+import { I as Input } from './index-288b564e.js';
 import debounce from 'lodash/debounce';
 import ContentEditable from 'react-contenteditable';
+import { PATHS } from './togetherApiPaths.js';
 import { Close, Check } from '@hhgtech/icons/core';
 
 const StyledCreateNewPost = styled.div `

package/build/esm/{index-c2584051.js → index-7720a710.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-06ba3978.js';
+import { _ as __rest } from './tslib.es6-2d738692.js';
 import React__default, { useState } from 'react';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-d7bbdb52.js';
-import { t as theme } from './theme-7dadf4a1.js';
-import { L as Label, S as StyledDisplayIcon, a as StyledActionIcon, b as StyledErrorLabel } from './index-f660abb7.js';
+import { M as MediaQueries } from './utils-40533779.js';
+import { theme } from './miscTheme.js';
+import { L as Label, S as StyledDisplayIcon, a as StyledActionIcon, b as StyledErrorLabel } from './index-288b564e.js';
 
 const StyledInput = styled.div `
   position: relative;

package/build/esm/{index-5723381f.js → index-7a1552e9.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-06ba3978.js';
+import { _ as __rest } from './tslib.es6-2d738692.js';
 import React__default from 'react';
 import { createStyles, Text as Text$1 } from '@mantine/core';
-import { O as OTHER_THEME_CONFIG, F as FontWeight } from './utils-d7bbdb52.js';
+import { O as OTHER_THEME_CONFIG, F as FontWeight } from './other-9b439f19.js';
 
 var useStyles = createStyles((theme, _params) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;

package/build/esm/index-7c678785.js

@@ -0,0 +1,259 @@
+import { _ as __rest } from './tslib.es6-2d738692.js';
+import React__default, { createContext, useContext } from 'react';
+import { useMantineTheme, Flex, rem, Box, createStyles } from '@mantine/core';
+import { t as themeColors } from './index-03d7200e.js';
+import '@mantine/dates';
+import './index-39aa0c9f.js';
+import './index-38ced379.js';
+import './index-b9c4dfcb.js';
+import './useMantineLocale-faa72172.js';
+import { T as Text } from './index-7a1552e9.js';
+import './index-bdc3bd61.js';
+import { u as useTranslations } from './useTranslations-ba901edf.js';
+import '@mantine/hooks';
+import { M as MediaQueries } from './utils-40533779.js';
+import './other-9b439f19.js';
+import styled from '@emotion/styled';
+import { setDefaultClass } from './miscDefaultClassWrapper.js';
+
+const StyledIconContainerClass = 'hhgcomp-toolbanner-iconcontainer';
+const StyledInnerClass = 'hhgcomp-toolbanner-inner';
+const StyledWrapper = setDefaultClass(styled.div `
+    position: relative;
+    width: 100%;
+    height: 100%;
+  `, 'hhgcomp-toolbanner-wrapper');
+const StyledContainer = styled.div `
+  width: 100%;
+  a {
+    text-decoration: none;
+    color: inherit;
+  }
+
+  background-color: ${(props) => props['data-banner-color'] || themeColors.blue[1]};
+
+  &[data-site='marryBaby'] {
+    a {
+      text-decoration: underline;
+    }
+    ${MediaQueries.mbDown} {
+      padding-bottom: 0;
+    }
+  }
+
+  ${MediaQueries.tdDown} {
+    height: auto;
+    ${StyledWrapper.classSelector} {
+      .${StyledInnerClass} {
+        display: flex;
+        align-items: center;
+        ${MediaQueries.mbDown} {
+          justify-content: space-between;
+        }
+        .${StyledIconContainerClass} {
+          position: relative;
+          right: -50px;
+          bottom: -20px;
+          width: 110px;
+          min-width: 0;
+          height: auto;
+          min-height: 0;
+          align-self: flex-end;
+          margin-bottom: -20px;
+          ${MediaQueries.mbDown} {
+            right: unset;
+          }
+        }
+      }
+    }
+  }
+`;
+
+const ToolsBannerCard = ({ className, heading, bannerColor, medicalReview = {
+    link: '#',
+    reviewer: '',
+    date: '',
+}, icon, style, isPregTool, }) => {
+    const { t } = useTranslations();
+    const theme = useMantineTheme();
+    const isMarryBaby = theme.other.template === 'mb';
+    const siteType = isMarryBaby ? 'marryBaby' : 'helloSites';
+    const headingAs = 'h2';
+    const medicalReviewEle = (medicalReview === null || medicalReview === void 0 ? void 0 : medicalReview.reviewer) ? (React__default.createElement(Text, { size: "label2", as: "div", className: "embedded-review", sx: {
+            a: {
+                textUnderlineOffset: '2px',
+                textDecoration: 'underline',
+            },
+        } },
+        React__default.createElement("div", { dangerouslySetInnerHTML: {
+                __html: t('toolPage.toolReviewer', {
+                    expert_name: `<a href="${medicalReview.link}">${medicalReview.reviewer.trim()}</a>`,
+                    date: medicalReview.date,
+                }),
+            } }))) : null;
+    return (React__default.createElement(StyledContainer, { className: className, style: style, "data-site": siteType, "data-banner-color": bannerColor ||
+            (isMarryBaby
+                ? theme.colors.mb[1]
+                : isPregTool
+                    ? theme.colors.pink[1]
+                    : theme.colors.blue[1]) },
+        React__default.createElement(StyledWrapper, null,
+            React__default.createElement(Flex, { gap: rem(24), align: 'center', justify: 'space-between', sx: { padding: rem(16), gap: rem(24), '.heading': {} } },
+                React__default.createElement(Box, null,
+                    React__default.createElement(Text, { size: isMarryBaby ? 'h4' : 'h3', as: headingAs, className: 'heading' }, heading),
+                    medicalReview && (React__default.createElement(Text, { size: "n1", as: "div" }, medicalReviewEle))),
+                React__default.createElement(Flex, { justify: 'center', align: 'center', sx: (theme) => ({
+                        width: rem(80),
+                        height: rem(80),
+                        borderRadius: isMarryBaby ? '24px' : '50%',
+                        backgroundColor: '#fff',
+                        flexShrink: 0,
+                        img: {
+                            maxWidth: rem(48),
+                            maxHeight: rem(48),
+                        },
+                        [theme.fn.smallerThan('sm')]: {
+                            width: rem(64),
+                            height: rem(64),
+                            img: {
+                                maxWidth: rem(40),
+                                maxHeight: rem(40),
+                            },
+                        },
+                    }) }, icon)))));
+};
+
+var useStyles$2 = createStyles(() => {
+    return {
+        root: {
+            borderTopLeftRadius: 'inherit',
+            borderTopRightRadius: 'inherit',
+        },
+    };
+});
+
+const CardWrapperContext = createContext({});
+
+const Banner = (_a) => {
+    var { styles, classNames, className } = _a, rest = __rest(_a, ["styles", "classNames", "className"]);
+    const { classes, cx } = useStyles$2(undefined, {
+        name: 'HealthToolCardWrapper__Banner',
+        styles,
+        classNames,
+    });
+    const { isPregTool } = useContext(CardWrapperContext);
+    return (React__default.createElement(ToolsBannerCard, Object.assign({ isPregTool: isPregTool, className: cx(className, classes.root) }, rest)));
+};
+
+var useStyles$1 = createStyles(() => {
+    return {
+        root: {
+            padding: rem(16),
+        },
+    };
+});
+
+const Body = (_a) => {
+    var { children, styles, classNames, className } = _a, rest = __rest(_a, ["children", "styles", "classNames", "className"]);
+    const { classes, cx } = useStyles$1(undefined, {
+        name: 'HealthToolCardWrapper',
+        styles,
+        classNames,
+    });
+    return (React__default.createElement(Box, Object.assign({ className: cx(className, classes.root) }, rest), children));
+};
+
+var useStyles = createStyles((theme, { isPregTool }) => {
+    const isMarryBaby = theme.other.template === 'mb';
+    return {
+        root: {
+            display: 'flex',
+            flexDirection: 'column',
+            borderRadius: rem(isMarryBaby ? 16 : 8),
+            backgroundColor: '#fff',
+            border: `1px solid ${isMarryBaby
+                ? theme.colors.mb[2]
+                : isPregTool
+                    ? theme.colors.pink[1]
+                    : theme.colors.blue[2]}`,
+        },
+        row: {
+            display: 'flex',
+            alignItems: 'stretch',
+            justifyContent: 'space-between',
+            gap: rem(16),
+        },
+        labelWrapper: {
+            flex: '1 1 0px',
+            display: 'flex',
+            alignItems: 'center',
+            borderBottom: `1px solid ${theme.colors.neutral[1]}`,
+        },
+        label: {
+            fontSize: rem(14),
+            color: theme.colors.gray[6],
+        },
+        control: {
+            width: rem(180),
+            flexShrink: 1,
+            '&.error': {
+                'button, input': {
+                    borderColor: theme.colors.red[7],
+                },
+            },
+        },
+        radioLabel: {
+            fontSize: rem(16),
+        },
+        radioRoot: {
+            padding: `${rem(10)} 0`,
+            margin: 0,
+        },
+        bmiVal: {
+            display: 'inline-block',
+        },
+        inputWithUnit__wrapper: {
+            position: 'relative',
+        },
+        inputWithUnit__unit: {
+            position: 'absolute',
+            top: 0,
+            right: 0,
+            bottom: 0,
+            paddingRight: rem(10),
+            display: 'flex',
+            alignItems: 'center',
+        },
+        inputWithUnit__unitText: {
+            color: theme.colors.gray[6],
+        },
+        inputWithUnit__input: {
+            input: {
+                paddingRight: rem(30),
+                '::-webkit-inner-spin-button': { '-webkit-appearance': 'none' },
+            },
+        },
+        submitBtn: {},
+        switchRoot: {
+            padding: '16px 0',
+        },
+    };
+});
+
+const _HealthToolCardWrapper = (_a) => {
+    var { children, styles, classNames, className, isPregTool } = _a, rest = __rest(_a, ["children", "styles", "classNames", "className", "isPregTool"]);
+    const { classes, cx } = useStyles({ isPregTool }, {
+        name: 'HealthToolCardWrapper',
+        styles,
+        classNames,
+    });
+    return (React__default.createElement(CardWrapperContext.Provider, { value: {
+            isPregTool,
+        } },
+        React__default.createElement(Box, Object.assign({ className: cx(className, classes.root) }, rest), children)));
+};
+const HealthToolCardWrapper = _HealthToolCardWrapper;
+HealthToolCardWrapper.Body = Body;
+HealthToolCardWrapper.Banner = Banner;
+
+export { HealthToolCardWrapper as H, ToolsBannerCard as T };

package/build/esm/{index-0ca9b175.js → index-88c06a7e.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-06ba3978.js';
+import { _ as __rest } from './tslib.es6-2d738692.js';
 import React__default from 'react';
 import { Indicator as Indicator$1 } from '@mantine/core';
-import { t as theme } from './theme-7dadf4a1.js';
+import { theme } from './miscTheme.js';
 
 const Indicator = (_a) => {
     var { styles, color = theme.colors.red700 } = _a, props = __rest(_a, ["styles", "color"]);

package/build/esm/{index-13d8dd4b.js → index-90d58b18.js}

@@ -1,11 +1,12 @@
-import { _ as __rest } from './tslib.es6-06ba3978.js';
+import { _ as __rest } from './tslib.es6-2d738692.js';
 import React__default, { useMemo, useState, useEffect } from 'react';
-import { L as LOCALE } from './index-189d7601.js';
+import './index-38ced379.js';
 import styled from '@emotion/styled';
-import { C as CommonGAssets } from './index-9471fca1.js';
-import { t as theme } from './theme-7dadf4a1.js';
-import { I as ImageWrap, d as CentralCarousel } from './index-9b3a8b6d.js';
-import { T as Text } from './index-219e3a35.js';
+import { C as CommonGAssets } from './index-b9c4dfcb.js';
+import { theme } from './miscTheme.js';
+import { I as ImageWrap, d as CentralCarousel } from './index-03d7200e.js';
+import { T as Text } from './index-a51336b9.js';
+import { L as LOCALE } from './Locale-c6a90240.js';
 
 const StyledIconContainer = styled.div `
   display: inline-flex;

package/build/esm/{index-7c384ae6.js → index-96a5f239.js}

@@ -1,11 +1,12 @@
-import { _ as __rest } from './tslib.es6-06ba3978.js';
+import { _ as __rest } from './tslib.es6-2d738692.js';
 import React__default from 'react';
 import { useMantineTheme, Image } from '@mantine/core';
 import { DatePickerInput } from '@mantine/dates';
-import { I as ISO_FORMAT } from './index-6210f454.js';
-import { L as LOCALE } from './index-189d7601.js';
-import { C as CommonGAssets } from './index-9471fca1.js';
-import { M as MAPPED_LOCALE } from './useMantineLocale-453f8013.js';
+import { I as ISO_FORMAT } from './index-39aa0c9f.js';
+import './index-38ced379.js';
+import { C as CommonGAssets } from './index-b9c4dfcb.js';
+import { M as MAPPED_LOCALE } from './useMantineLocale-faa72172.js';
+import { L as LOCALE } from './Locale-c6a90240.js';
 
 // Omit<MantineDatePickerInputProps, 'value'>
 const DatePicker = (_a) => {