@hhgtech/hhg-components/build/esm/index-2b787b26.js

Hello Health Group common components

import { _ as __rest } from './tslib.es6-00ab44b2.js';
import React__default, { useContext } from 'react';
import { createStyles, rem, Box, clsx } from '@mantine/core';
import './index-bd44bcb2.js';
import '@mantine/dates';
import './index-8c40504a.js';
import './index-fe4471f4.js';
import './index-7adf994c.js';
import './index-3f09210d.js';
import { T as Text } from './index-0b67696c.js';
import { B as Button } from './index-2d25b0f0.js';
import './index-17c85f76.js';
import './index.styles-3adef5f6.js';
import { u as useTranslations } from './index-09d9e570.js';
import '@mantine/hooks';
import './utils-538169b3.js';
import './index-04505e35.js';
import { C as CardWrapperContext } from './context-41a96757.js';
import { H as HealthToolFormWrapper } from './index-c6190f14.js';

var useStyles = createStyles((theme, { hasOnClickFn }) => {
    return {
        root: {
            position: 'relative',
            display: 'flex',
            flexDirection: 'column',
            gap: rem(16),
        },
        sponsorBox: {
            display: 'flex',
            gap: rem(12),
            alignItems: 'center',
            backgroundColor: theme.colors.neutral[0],
            border: `1px solid ${theme.colors.neutral[1]}`,
            borderRadius: rem(4),
            padding: '4px 12px',
            alignSelf: 'flex-start',
        },
        sponsorLogo: {
            maxHeight: rem(32),
        },
        btn: {
            minWidth: rem(180),
            [theme.fn.largerThan('sm')]: {
                alignSelf: 'flex-end',
            },
            visibility: hasOnClickFn ? 'visible' : 'hidden',
        },
    };
});

const BabyPoopForm = (_a) => {
    var { babyPoopPage, onClickFindOut, currentUrl, sponsorLogo, btnProps, styles, classNames } = _a, props = __rest(_a, ["babyPoopPage", "onClickFindOut", "currentUrl", "sponsorLogo", "btnProps", "styles", "classNames"]);
    const { t } = useTranslations();
    const { classes } = useStyles({ hasOnClickFn: Boolean(onClickFindOut) }, { name: 'BabyPoopForm', styles, classNames });
    const { classes: wrapperClasses = {} } = useContext(CardWrapperContext);
    return (React__default.createElement(HealthToolFormWrapper.FormRow, null,
        React__default.createElement(Box, Object.assign({ className: classes.root }, props),
            sponsorLogo && (React__default.createElement(Box, { className: classes.sponsorBox },
                React__default.createElement(Text, { size: "p4" }, t('common.sponsoredBy')),
                React__default.createElement("img", { loading: "lazy", src: sponsorLogo, alt: "sponsor", className: classes.sponsorLogo }))),
            React__default.createElement(Text, { size: "p3", as: "div", className: "description", dangerouslySetInnerHTML: {
                    __html: babyPoopPage.description,
                } }),
            React__default.createElement(Button, Object.assign({ className: clsx(classes.btn, wrapperClasses.submitBtn), onClick: onClickFindOut, dataEventCategory: "Health Tool", dataEventAction: "Baby Stool Inquiry", dataEventLabel: currentUrl }, btnProps), t('babyPoop.findOut')))));
};

export { BabyPoopForm as B };