@hhgtech/hhg-components 1.29.487 → 1.29.488-beta-1

package/build/esm/{index-acaae81c.js → index-2060ad35.js}

@@ -2,13 +2,13 @@ import * as React from 'react';
 import React__default, { useState, useEffect } from 'react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { I as ImageWrap } from './index-178296cf.js';
-import { T as Text } from './index-78c5b9df.js';
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { I as ImageWrap } from './index-acedfc74.js';
+import { T as Text } from './index-d75dfe57.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import { clsx, Modal } from '@mantine/core';
-import { D as DrawerComponent, u as useDrawerDrag } from './index-b29b9dca.js';
+import { D as DrawerComponent, u as useDrawerDrag } from './index-2cc1d845.js';
 import { Drawer } from 'vaul';
-import { Z as ZINDEX_SSO } from './index-497c82ed.js';
+import { Z as ZINDEX_SSO } from './index-33eca899.js';
 
 /* eslint-disable prettier/prettier */
 const ShapedArrowDown = (props) => (React.createElement("svg", Object.assign({ width: "1em", height: "1em", viewBox: "0 0 16 16", fill: "none" }, props),

package/build/esm/{index-de17701a.js → index-25285448.js}

@@ -1,6 +1,6 @@
 import React__default from 'react';
-import { u as useTranslations } from './index-4892ecbc.js';
-import { B as Button } from './index-19ccd15a.js';
+import { u as useTranslations } from './index-26c7d66b.js';
+import { B as Button } from './index-f9887126.js';
 
 var styles = {"loading":"PD6nRZX"};
 

package/build/esm/{index-4892ecbc.js → index-26c7d66b.js}

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { useContext, useMemo } from 'react';
-import { T as TranslationsContext } from './translationsContext-b889fd35.js';
+import { T as TranslationsContext } from './translationsContext-df3bba8b.js';
 
 // SRC: https://github.com/berezh/react-string-format
 function format(text, params) {

package/build/esm/{index-01f01de5.js → index-296597f9.js}

@@ -1,7 +1,7 @@
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default from 'react';
 import { useMantineTheme } from '@mantine/core';
-import { T as Text } from './index-78c5b9df.js';
+import { T as Text } from './index-d75dfe57.js';
 
 /**
  * @deprecated Consider to use import { Title } from '@mantine/core'

package/build/esm/{index-b29b9dca.js → index-2cc1d845.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { useState, useCallback, useMemo, useEffect } from 'react';
 import { clsx } from '@mantine/core';
 import { Drawer } from 'vaul';
 import styled from '@emotion/styled';
-import { Z as ZINDEX_SSO } from './index-497c82ed.js';
+import { Z as ZINDEX_SSO } from './index-33eca899.js';
 
 const TIME_FOR_MOTION = 300;
 const useDrawerDrag = (motionDelay = TIME_FOR_MOTION) => {

package/build/esm/{index-e87437e8.js → index-2def82af.js}

@@ -1,18 +1,18 @@
 import React__default, { useState, useMemo } from 'react';
-import { F as Flag } from './index-be45cb68.js';
+import { F as Flag } from './index-5bf0841f.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { T as Text } from './index-78c5b9df.js';
-import { C as CommonGAssets } from './index-9869c049.js';
-import { _ as __rest } from './tslib.es6-d22eea34.js';
-import { a as ZINDEX_HEADER, V as VIDEO_DETAIL_TEMP_STORAGE } from './index-497c82ed.js';
-import { V as VideoType } from './index-d4b5612b.js';
+import { T as Text } from './index-d75dfe57.js';
+import { C as CommonGAssets } from './index-f63f72a3.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
+import { a as ZINDEX_HEADER, V as VIDEO_DETAIL_TEMP_STORAGE } from './index-33eca899.js';
+import { V as VideoType } from './index-768cd3ba.js';
 import { createStyles, Stack, Box, AspectRatio, getStylesRef, rem, Flex } from '@mantine/core';
-import { a as abbreviateNumber } from './number-42c21c3f.js';
-import { u as useTranslations } from './index-4892ecbc.js';
+import { a as abbreviateNumber } from './number-15dc9bc2.js';
+import { u as useTranslations } from './index-26c7d66b.js';
 import { useOs } from '@mantine/hooks';
-import { M as Modal } from './index-f41f433b.js';
-import { S as SocialLinkPreview } from './index-8feffb1f.js';
+import { M as Modal } from './index-f31554d9.js';
+import { S as SocialLinkPreview } from './index-5fedf033.js';
 import { domainLocales } from './constantsDomainLocales.js';
 
 const ALLOW_DOMAIN_URL = [

package/build/esm/{index-7b49d2af.js → index-2f47a15b.js}

@@ -3,24 +3,24 @@ import { CrossLogo, ShieldCheck } from '@hhgtech/icons/other';
 import { createStyles, Box, Flex, Button as Button$1, rem } from '@mantine/core';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { u as useTranslations } from './index-4892ecbc.js';
-import { M as MediaQueries, t as toggleNoScroll } from './utils-a4d83ba9.js';
-import { A as AuthorBadge, B as BookingBtn } from './index-5adba011.js';
-import { I as Icon } from './index-78c5cb83.js';
-import { _ as __rest } from './tslib.es6-d22eea34.js';
-import { U as UserAvatar } from './index-03ce768e.js';
-import { I as ImageWrap, u as useScreenSize } from './index-178296cf.js';
-import './index-497c82ed.js';
-import { C as CommonGAssets } from './index-9869c049.js';
-import { c as callApi, g as getCarePath, l as domainLocales, m as getCareHospitalUrl, n as getCareDoctorUrl, k as getCurrentBaseUrl, o as getDiscoverApiPath, T as TogetherComponentGlobalContext } from './utils-3a2b9dcf.js';
-import { B as Button } from './index-19ccd15a.js';
-import { T as Text } from './index-78c5b9df.js';
+import { u as useTranslations } from './index-26c7d66b.js';
+import { M as MediaQueries, t as toggleNoScroll } from './utils-976b3f49.js';
+import { A as AuthorBadge, B as BookingBtn } from './index-755e1e88.js';
+import { I as Icon } from './index-ad8b86d9.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
+import { U as UserAvatar } from './index-0bdc3a96.js';
+import { I as ImageWrap, u as useScreenSize } from './index-acedfc74.js';
+import './index-33eca899.js';
+import { C as CommonGAssets } from './index-f63f72a3.js';
+import { c as callApi, g as getCarePath, l as domainLocales, m as getCareHospitalUrl, n as getCareDoctorUrl, k as getCurrentBaseUrl, o as getDiscoverApiPath, T as TogetherComponentGlobalContext } from './utils-d2b04bb0.js';
+import { B as Button } from './index-f9887126.js';
+import { T as Text } from './index-d75dfe57.js';
 import { theme } from './miscTheme.js';
 import styled from '@emotion/styled';
 import { CARE_PATHS, DISCOVER_PATHS } from './togetherApiPaths.js';
-import { L as Loading } from './index-964fee78.js';
-import { H as Heading } from './index-01f01de5.js';
-import { M as Modal } from './index-f41f433b.js';
+import { L as Loading } from './index-dd28f6bb.js';
+import { H as Heading } from './index-296597f9.js';
+import { M as Modal } from './index-f31554d9.js';
 import { domainLocales as domainLocales$1 } from './constantsDomainLocales.js';
 
 var styles$2 = {"row":"dZWeHns","flex":"_8z2nszB","mainTxt":"tMiOKib","subTxt":"uDcqD-2","subTxtRow":"pDlsows","subDivider":"m-HVXw1"};
@@ -911,7 +911,7 @@ const _CardAuthor = (props) => {
     useEffect(() => {
         if (open && !ProfileDetail) {
             if (userType === 'chatbot') {
-                import('./index-d71417aa.js').then((module) => {
+                import('./index-ad93eba5.js').then((module) => {
                     setProfileDetail(() => module.ProfileChatbot);
                 });
             }

package/build/esm/{index-b292580e.js → index-3077ac2c.js}

@@ -1,20 +1,20 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-d22eea34.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-534fb60b.js';
 import React__default, { useMemo, useEffect, useRef, useContext, useState } from 'react';
 import { User } from '@hhgtech/icons/core';
-import { S as Spinner } from './Spinner-2054256e.js';
-import { a as Avatar } from './index-be45cb68.js';
-import { B as Button } from './index-2809f342.js';
-import { T as Text } from './index-78c5b9df.js';
-import { u as useTranslations } from './index-4892ecbc.js';
-import { C as CommonGAssets } from './index-9869c049.js';
+import { S as Spinner } from './Spinner-ad8ca74b.js';
+import { a as Avatar } from './index-5bf0841f.js';
+import { B as Button } from './index-47d711f9.js';
+import { T as Text } from './index-d75dfe57.js';
+import { u as useTranslations } from './index-26c7d66b.js';
+import { C as CommonGAssets } from './index-f63f72a3.js';
 import { theme } from './miscTheme.js';
 import styled from '@emotion/styled';
-import { M as MediaQueries } from './utils-a4d83ba9.js';
+import { M as MediaQueries } from './utils-976b3f49.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
 import classNames from 'classnames';
-import { e as CARE_LOCALES, f as CARE_BOOKING_LOCALES, d as LOCALE_HAS_COMMUNITY_SITE, E as ECOM_LOCALES, c as VIDEO_LOCALES, H as HAS_CLINITY_DOWNLOAD_SITE } from './index-497c82ed.js';
-import { i as domainLocalesMarryBaby } from './utils-3a2b9dcf.js';
-import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain } from './normalizeLink-4ba71f22.js';
+import { e as CARE_LOCALES, f as CARE_BOOKING_LOCALES, d as LOCALE_HAS_COMMUNITY_SITE, E as ECOM_LOCALES, c as VIDEO_LOCALES, H as HAS_CLINITY_DOWNLOAD_SITE } from './index-33eca899.js';
+import { i as domainLocalesMarryBaby } from './utils-d2b04bb0.js';
+import { g as getCurrentBaseUrl, a as getCurrentSsoUrl, b as getTogetherApiDomain, c as getDiscoverApiDomain } from './normalizeLink-b00abe15.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { ProfileNavigation } from './profileNavigation.js';
 import { NavigationLogoutPopup } from './navigationLogoutPopup.js';

package/build/esm/{index-bf2a403c.js → index-3394489d.js}

@@ -1,21 +1,21 @@
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { useState, useRef, useMemo, useEffect } from 'react';
 import { BabyBoyMB, BabyGirlMB } from '@hhgtech/icons/other';
 import { createStyles, rem, Box, Flex } from '@mantine/core';
-import { R as Radio } from './index-be45cb68.js';
+import { R as Radio } from './index-5bf0841f.js';
 import '@mantine/dates';
-import './index-497c82ed.js';
-import './index-d4b5612b.js';
-import { C as CommonGAssets } from './index-9869c049.js';
-import './index-52ff640d.js';
-import { T as Text } from './index-78c5b9df.js';
-import './index-2809f342.js';
-import './index-19c19aa7.js';
-import './index.styles-a8e4f235.js';
-import { u as useTranslations } from './index-4892ecbc.js';
+import './index-33eca899.js';
+import './index-768cd3ba.js';
+import { C as CommonGAssets } from './index-f63f72a3.js';
+import './index-35a24b49.js';
+import { T as Text } from './index-d75dfe57.js';
+import './index-47d711f9.js';
+import './index-e568f35c.js';
+import './index.styles-abe9fcce.js';
+import { u as useTranslations } from './index-26c7d66b.js';
 import '@mantine/hooks';
-import './utils-a4d83ba9.js';
-import './index-d070b323.js';
+import './utils-976b3f49.js';
+import './index-34b321b1.js';
 
 var useStyles = createStyles((theme, { type }) => {
     const isMarryBaby = theme.other.template === 'mb';

package/build/esm/{index-497c82ed.js → index-33eca899.js}

@@ -1,10 +1,10 @@
 import { enUS, vi, km, hi, id, ms, th, zhTW } from 'date-fns/locale';
-import './index-d4b5612b.js';
+import './index-768cd3ba.js';
 import { siteHost, siteOptions, COUNTRY_CURRENCY_SYMBOL } from './constantsSite.js';
 import { domainLocales, MAP_DOMAIN_BY_LOCALE } from './constantsDomainLocales.js';
 import { RISK_SCREENER_NAME, RISK_SCREENER_SLUG } from './constantsRiskScreener.js';
 import { isProduction } from './constantsIsProduction.js';
-import { L as LOCALE } from './Locale-ba642b43.js';
+import { L as LOCALE } from './Locale-79fe819f.js';
 
 const basePath = process.env.NEXT_PUBLIC_DEPLOY_LOCALE === 'tl-PH' ? '/fil' : '';
 const SSO_URL = process.env.NEXT_PUBLIC_SSO;

package/build/esm/{index-d070b323.js → index-34b321b1.js}

@@ -1,9 +1,9 @@
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { useRef, useState, useEffect } from 'react';
 import { ArrowLeft, ArrowRight } from '@hhgtech/icons/other';
 import { createStyles, rem, Tabs as Tabs$1, ScrollArea } from '@mantine/core';
-import { B as Button } from './index-2809f342.js';
-import { T as Text } from './index-78c5b9df.js';
+import { B as Button } from './index-47d711f9.js';
+import { T as Text } from './index-d75dfe57.js';
 
 var useStyles = createStyles((theme, params) => {
     const { variant } = params;

package/build/esm/{index-52ff640d.js → index-35a24b49.js}

@@ -1,16 +1,16 @@
-import { a as __awaiter, _ as __rest } from './tslib.es6-d22eea34.js';
+import { a as __awaiter, _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { useState, useEffect } from 'react';
 import dayjs from 'dayjs';
-import './index-d4b5612b.js';
-import { L as LOCALE } from './Locale-ba642b43.js';
+import './index-768cd3ba.js';
+import { L as LOCALE } from './Locale-79fe819f.js';
 import { notifications, Notifications } from '@mantine/notifications';
-import { Z as ZINDEX_SSO, I as ISO_FORMAT } from './index-497c82ed.js';
+import { Z as ZINDEX_SSO, I as ISO_FORMAT } from './index-33eca899.js';
 import { em } from '@mantine/core';
-import { C as CommonGAssets } from './index-9869c049.js';
+import { C as CommonGAssets } from './index-f63f72a3.js';
 import { theme } from './miscTheme.js';
-import { S as Screens, M as MediaQueries, B as Breakpoints } from './utils-a4d83ba9.js';
-import { C as CustomStylesType, F as FontWeight } from './index-19c19aa7.js';
-import { A as ANIMATION_DURATION } from './shared-dbf7ee95.js';
+import { S as Screens, M as MediaQueries, B as Breakpoints } from './utils-976b3f49.js';
+import { C as CustomStylesType, F as FontWeight } from './index-e568f35c.js';
+import { A as ANIMATION_DURATION } from './shared-6ee89a61.js';
 
 // Available locale list https://cdn.jsdelivr.net/npm/dayjs@1/locale.json
 const MAPPED_LOCALE = {

package/build/esm/{index-1a7799e2.js → index-3a0b26aa.js}

@@ -1,6 +1,6 @@
 import { createStyles, clsx, Box, useMantineTheme } from '@mantine/core';
-import { G as GlobalTextStyleNew, C as CustomStylesType } from './index-19c19aa7.js';
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { G as GlobalTextStyleNew, C as CustomStylesType } from './index-e568f35c.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { createContext, useState, useEffect, useContext, useCallback } from 'react';
 import { useClickOutside } from '@mantine/hooks';
 import { css } from '@emotion/react';

package/build/esm/{index-d865b591.js → index-3ebda84a.js}

@@ -1,6 +1,6 @@
 import React__default, { useContext, useState, useRef, useEffect } from 'react';
-import { B as Button } from './index-19ccd15a.js';
-import { T as TogetherComponentGlobalContext } from './utils-3a2b9dcf.js';
+import { B as Button } from './index-f9887126.js';
+import { T as TogetherComponentGlobalContext } from './utils-d2b04bb0.js';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
 

package/build/esm/{index-9ba89930.js → index-474f84eb.js}

@@ -1,48 +1,48 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-d22eea34.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-534fb60b.js';
 import React__default, { useContext, useState, useCallback, useEffect, useMemo, useRef } from 'react';
-import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-e87437e8.js';
-import { L as LOCALE_SPECS, S as STATIC_PAGES, a as ZINDEX_HEADER, c as VIDEO_LOCALES, d as LOCALE_HAS_COMMUNITY_SITE, e as CARE_LOCALES } from './index-497c82ed.js';
-import { e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-4ba71f22.js';
-import { a as formatCommunity, b as formatPost } from './dataTransform-8076dba6.js';
+import { i as isInternalLink, V as VideoItem, L as LanguageSwitcher } from './index-2def82af.js';
+import { L as LOCALE_SPECS, S as STATIC_PAGES, a as ZINDEX_HEADER, c as VIDEO_LOCALES, d as LOCALE_HAS_COMMUNITY_SITE, e as CARE_LOCALES } from './index-33eca899.js';
+import { e as normalizeLink, n as normalizeLinkSlash, g as getCurrentBaseUrl, c as getDiscoverApiDomain, b as getTogetherApiDomain, d as getCareApiDomain } from './normalizeLink-b00abe15.js';
+import { a as formatCommunity, b as formatPost } from './dataTransform-d1d9c65b.js';
 import { Close, Logo } from '@hhgtech/icons/core';
-import './translationsContext-b889fd35.js';
+import './translationsContext-df3bba8b.js';
 import styled from '@emotion/styled';
-import { I as Input } from './index-be45cb68.js';
+import { I as Input } from './index-5bf0841f.js';
 import { theme } from './miscTheme.js';
-import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-b292580e.js';
+import { a as NavigationContext, u as useCSSFocusPopupHelper, N as NavigationProfileButton, b as NavigationProvider } from './index-3077ac2c.js';
 import { ArrowRight, ChatAi } from '@hhgtech/icons/other';
 import { createStyles, Box, Indicator, useMantineTheme, clsx } from '@mantine/core';
-import { L as Logo$1 } from './index-578ee73d.js';
+import { L as Logo$1 } from './index-86ca1e59.js';
 import throttle from 'lodash/throttle';
 import '@mantine/dates';
-import { V as VideoType } from './index-d4b5612b.js';
-import { C as CommonGAssets } from './index-9869c049.js';
-import './index-52ff640d.js';
-import { T as Text } from './index-78c5b9df.js';
-import { B as Button } from './index-2809f342.js';
-import './index-19c19aa7.js';
-import './index.styles-a8e4f235.js';
+import { V as VideoType } from './index-768cd3ba.js';
+import { C as CommonGAssets } from './index-f63f72a3.js';
+import './index-35a24b49.js';
+import { T as Text } from './index-d75dfe57.js';
+import { B as Button } from './index-47d711f9.js';
+import './index-e568f35c.js';
+import './index.styles-abe9fcce.js';
 import '@mantine/hooks';
-import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-a4d83ba9.js';
-import './index-d070b323.js';
-import { L as LOCALISED_SLUGS } from './constants-85a9b713.js';
-import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-33e4e5ed.js';
-import { L as LOCALIZED_SLUGS } from './constants-3a8fffbd.js';
-import { u as useTranslations } from './index-4892ecbc.js';
-import { H as Heading } from './index-01f01de5.js';
-import { I as Indicator$1 } from './index-7d0eafd8.js';
-import { u as useIsInit } from './useIsInit-3d93f40e.js';
+import { g as getBoundariesFromMediaQueryKey, M as MediaQueries } from './utils-976b3f49.js';
+import './index-34b321b1.js';
+import { L as LOCALISED_SLUGS } from './constants-49b50246.js';
+import { u as useSSOV2Store, I as IS_SSOV2_ENABLED } from './store-d68f8307.js';
+import { L as LOCALIZED_SLUGS } from './constants-42113a68.js';
+import { u as useTranslations } from './index-26c7d66b.js';
+import { H as Heading } from './index-296597f9.js';
+import { I as Indicator$1 } from './index-728c74fd.js';
+import { u as useIsInit } from './useIsInit-85469979.js';
 import { setDefaultClass } from './miscDefaultClassWrapper.js';
-import { B as Button$1 } from './index-19ccd15a.js';
+import { B as Button$1 } from './index-f9887126.js';
 import formatString from 'string-format';
 import { domainLocales } from './constantsDomainLocales.js';
 import dayjs from 'dayjs';
 import relativeTime from 'dayjs/plugin/relativeTime';
-import { U as UserAvatar } from './index-03ce768e.js';
-import { C as Container } from './index-4ded97ac.js';
-import { L as LOCALE } from './Locale-ba642b43.js';
+import { U as UserAvatar } from './index-0bdc3a96.js';
+import { C as Container } from './index-90912d00.js';
+import { L as LOCALE } from './Locale-79fe819f.js';
 import debounce from 'lodash/debounce';
-import { g as getDataWithCache } from './core-3fafcbe1.js';
+import { g as getDataWithCache } from './core-49887365.js';
 
 const StyleInput = styled(Input) `
   .mantine-Input-input {

package/build/esm/{index-2809f342.js → index-47d711f9.js}

@@ -1,14 +1,14 @@
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { forwardRef } from 'react';
-import { createStyles, useMantineTheme, Button as Button$1 } from '@mantine/core';
-import { A as ANIMATION_DURATION } from './shared-dbf7ee95.js';
-import { C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-19c19aa7.js';
+import { createStyles, getStylesRef, useMantineTheme, Button as Button$1 } from '@mantine/core';
+import { A as ANIMATION_DURATION } from './shared-6ee89a61.js';
+import { C as CustomStylesType, F as FontWeight, u as useTemplateVariant } from './index-e568f35c.js';
 
 var useStyles = createStyles((_theme, _params) => {
     var _a, _b, _c, _d, _e, _f;
     const { other } = _theme;
     const { template } = other;
-    const { size, variant, skipHover, withColorHover, isError, isSuccess, color, children, theme: themeProp, customStylesType, } = _params;
+    const { size, variant, skipHover, withColorHover, isError, isSuccess, color, gradient, children, theme: themeProp, customStylesType, } = _params;
     const isMb = template === 'mb' || themeProp === 'marryBaby';
     const finalColor = color || (themeProp && isMb ? 'mb' : _theme.primaryColor);
     const isHexColor = finalColor.startsWith('#');
@@ -23,9 +23,20 @@ var useStyles = createStyles((_theme, _params) => {
         : (_f = (_e = _theme.colors) === null || _e === void 0 ? void 0 : _e[finalColor]) === null || _f === void 0 ? void 0 : _f[_theme.fn.primaryShade() + 1];
     const isLeadgen = customStylesType === CustomStylesType.LEADGEN;
     return {
-        root: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ transition: `all ${ANIMATION_DURATION} ease-in-out`, '&:focus': {
+        root: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ transition: `all ${ANIMATION_DURATION} ease-in-out` }, (gradient && Object.assign({ border: 0, position: 'relative' }, (variant === 'secondary' && {
+            '&:before': {
+                content: '""',
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                right: 0,
+                bottom: 0,
+                backgroundColor: '#fff',
+                borderRadius: 'inherit',
+            },
+        })))), { '&:focus': {
                 outline: 'none',
-            } }, (isLeadgen && {
+            } }), (isLeadgen && {
             borderRadius: 12,
         })), (!children && {
             paddingLeft: '10px',
@@ -59,14 +70,28 @@ var useStyles = createStyles((_theme, _params) => {
         })()), (() => {
             switch (variant) {
                 case 'primary': {
-                    return Object.assign({ color: _theme.white, backgroundColor: hexColor }, (!skipHover && {
-                        '&:hover': {
+                    return Object.assign(Object.assign({ color: _theme.white, backgroundColor: hexColor }, (gradient && {
+                        backgroundImage: gradient,
+                    })), (!skipHover && {
+                        '&:hover': Object.assign({}, (!gradient && {
                             backgroundColor: hoverHexColor,
-                        },
+                        })),
                     }));
                 }
                 case 'secondary':
-                    return Object.assign(Object.assign({ color: hexColor, backgroundColor: 'transparent', border: `1px solid ${hexColor}` }, (!skipHover && {
+                    return Object.assign(Object.assign(Object.assign({ color: hexColor, backgroundColor: 'transparent', border: `1px solid ${hexColor}` }, (gradient && {
+                        backgroundImage: gradient,
+                        borderColor: 'transparent',
+                        // '&:hover': {
+                        // '&:before': {
+                        //   backgroundColor: 'red',
+                        // },
+                        // borderColor: 'transparent',
+                        // [`.${getStylesRef('inner')}`]: {
+                        //   backgroundColor: 'transparent',
+                        // },
+                        // },
+                    })), (!skipHover && {
                         '&:hover': {
                             backgroundColor: hexColor50,
                             border: `1px solid ${hexColor}`,
@@ -142,9 +167,19 @@ var useStyles = createStyles((_theme, _params) => {
                     backgroundColor: _theme.colors.green[0],
                 },
             })) : {})),
+        inner: Object.assign({ ref: getStylesRef('inner') }, (gradient && {
+            position: 'relative',
+        })),
         leftIcon: {
             marginRight: 8,
         },
+        rightIcon: {},
+        label: Object.assign({}, (gradient &&
+            variant === 'secondary' && {
+            background: gradient,
+            '-webkit-background-clip': 'text',
+            '-webkit-text-fill-color': 'transparent',
+        })),
     };
 });
 
@@ -168,13 +203,14 @@ function filterObject(obj) {
 const Button = forwardRef((props, ref) => {
     var _a, _b;
     const theme = useMantineTheme();
-    const _c = Object.assign(Object.assign({}, (_b = (_a = theme.components) === null || _a === void 0 ? void 0 : _a.Button) === null || _b === void 0 ? void 0 : _b.defaultProps), filterObject(props)), { variant, size, color, skipHover, withColorHover, className, dataEventCategory, dataEventAction, dataEventLabel, children, theme: themeProp, component, styles, classNames } = _c, rest = __rest(_c, ["variant", "size", "color", "skipHover", "withColorHover", "className", "dataEventCategory", "dataEventAction", "dataEventLabel", "children", "theme", "component", "styles", "classNames"]);
+    const _c = Object.assign(Object.assign({}, (_b = (_a = theme.components) === null || _a === void 0 ? void 0 : _a.Button) === null || _b === void 0 ? void 0 : _b.defaultProps), filterObject(props)), { variant, size, color, gradient, skipHover, withColorHover, className, dataEventCategory, dataEventAction, dataEventLabel, children, theme: themeProp, component, styles, classNames } = _c, rest = __rest(_c, ["variant", "size", "color", "gradient", "skipHover", "withColorHover", "className", "dataEventCategory", "dataEventAction", "dataEventLabel", "children", "theme", "component", "styles", "classNames"]);
     const isError = variant === 'error';
     const variantStyle = useTemplateVariant();
     const { classes, cx } = useStyles({
         variant,
         size,
         color,
+        gradient,
         skipHover,
         withColorHover,
         isError,
@@ -185,7 +221,10 @@ const Button = forwardRef((props, ref) => {
     }, { name: 'ButtonMantine', styles, classNames });
     return (React__default.createElement(Button$1, Object.assign({ component: component, className: cx(className, variant), classNames: {
             root: classes.root,
+            inner: classes.inner,
             leftIcon: classes.leftIcon,
+            rightIcon: classes.rightIcon,
+            label: classes.label,
         }, variant: MAPPED_VARIANT[variant], "data-variant": variant, "data-event-category": dataEventCategory, "data-event-action": dataEventAction, "data-event-label": dataEventLabel, ref: ref, loaderProps: rest.disabled ? { color: 'currentColor' } : undefined }, rest), children));
 });
 

package/build/esm/{index-189bb940.js → index-4fcbce50.js}

@@ -1,28 +1,28 @@
-import { _ as __rest, a as __awaiter } from './tslib.es6-d22eea34.js';
+import { _ as __rest, a as __awaiter } from './tslib.es6-534fb60b.js';
 import React__default, { createContext, useContext, useState, useMemo, useEffect } from 'react';
 import { Controller, useForm } from 'react-hook-form';
-import { u as useHealthToolsCache } from './useHealthToolCache-7f12da82.js';
-import { H as HEALTH_TOOL_TYPE } from './constants-efe9be40.js';
+import { u as useHealthToolsCache } from './useHealthToolCache-e92495dd.js';
+import { H as HEALTH_TOOL_TYPE } from './constants-47af98fa.js';
 import { Flex, rem, Stack, clsx, createStyles, Box } from '@mantine/core';
-import { G as GenderOptionControl } from './index-bf2a403c.js';
-import { I as Input, R as Radio, c as ErrorLabel, d as Checkbox } from './index-be45cb68.js';
+import { G as GenderOptionControl } from './index-3394489d.js';
+import { I as Input, R as Radio, c as ErrorLabel, d as Checkbox } from './index-5bf0841f.js';
 import '@mantine/dates';
-import './index-497c82ed.js';
-import './index-d4b5612b.js';
-import './index-9869c049.js';
-import './index-52ff640d.js';
-import { T as Text } from './index-78c5b9df.js';
-import './index-2809f342.js';
+import './index-33eca899.js';
+import './index-768cd3ba.js';
+import './index-f63f72a3.js';
+import './index-35a24b49.js';
+import { T as Text } from './index-d75dfe57.js';
+import './index-47d711f9.js';
 import { theme } from './miscTheme.js';
-import './index-19c19aa7.js';
-import './index.styles-a8e4f235.js';
-import { u as useTranslations } from './index-4892ecbc.js';
+import './index-e568f35c.js';
+import './index.styles-abe9fcce.js';
+import { u as useTranslations } from './index-26c7d66b.js';
 import '@mantine/hooks';
-import './utils-a4d83ba9.js';
-import './index-d070b323.js';
-import { H as HealthToolFormWrapper } from './index-6a4cd81f.js';
-import { C as CardWrapperContext } from './context-636027ff.js';
-import { L as LOCALE } from './Locale-ba642b43.js';
+import './utils-976b3f49.js';
+import './index-34b321b1.js';
+import { H as HealthToolFormWrapper } from './index-ebfc37c0.js';
+import { C as CardWrapperContext } from './context-fd3d5e5f.js';
+import { L as LOCALE } from './Locale-79fe819f.js';
 import { domainLocales } from './constantsDomainLocales.js';
 import { getBmi } from './embeddedHeathToolCards_helpers.js';
 

package/build/esm/{index-db7a77e7.js → index-5407293c.js}

@@ -1,22 +1,22 @@
-import { _ as __rest } from './tslib.es6-d22eea34.js';
+import { _ as __rest } from './tslib.es6-534fb60b.js';
 import React__default, { useContext } from 'react';
 import { createStyles, rem, Box, clsx } from '@mantine/core';
-import './index-be45cb68.js';
+import './index-5bf0841f.js';
 import '@mantine/dates';
-import './index-497c82ed.js';
-import './index-d4b5612b.js';
-import './index-9869c049.js';
-import './index-52ff640d.js';
-import { T as Text } from './index-78c5b9df.js';
-import { B as Button } from './index-2809f342.js';
-import './index-19c19aa7.js';
-import './index.styles-a8e4f235.js';
-import { u as useTranslations } from './index-4892ecbc.js';
+import './index-33eca899.js';
+import './index-768cd3ba.js';
+import './index-f63f72a3.js';
+import './index-35a24b49.js';
+import { T as Text } from './index-d75dfe57.js';
+import { B as Button } from './index-47d711f9.js';
+import './index-e568f35c.js';
+import './index.styles-abe9fcce.js';
+import { u as useTranslations } from './index-26c7d66b.js';
 import '@mantine/hooks';
-import './utils-a4d83ba9.js';
-import './index-d070b323.js';
-import { C as CardWrapperContext } from './context-636027ff.js';
-import { H as HealthToolFormWrapper } from './index-6a4cd81f.js';
+import './utils-976b3f49.js';
+import './index-34b321b1.js';
+import { C as CardWrapperContext } from './context-fd3d5e5f.js';
+import { H as HealthToolFormWrapper } from './index-ebfc37c0.js';
 
 var useStyles = createStyles((theme, { hasOnClickFn }) => {
     return {

package/build/esm/{index-011fdd2b.js → index-575de084.js}

@@ -1,11 +1,11 @@
 import React__default, { useRef, useEffect } from 'react';
 import { Portal } from '@mantine/core';
-import { t as toggleNoScroll } from './utils-a4d83ba9.js';
+import { t as toggleNoScroll } from './utils-976b3f49.js';
 import { css } from '@emotion/react';
 import styled from '@emotion/styled';
 import { theme } from './miscTheme.js';
-import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-ceafa1ba.js';
-import { T as Text } from './index-78c5b9df.js';
+import { s as slideInUp, e as slideOutDown, b as slideInLeft, f as slideOutLeft, c as slideInRight, g as slideOutRight, a as slideInDown, d as slideOutUp } from './animation-63933563.js';
+import { T as Text } from './index-d75dfe57.js';
 
 const DURATION = '600ms';
 const generateStyleBasedOnPlacement = (placement, open) => {