@hhgtech/hhg-components 1.29.444 → 1.29.445-beta-2

package/build/{RatingStarsInput-30ef63b9.js → index-92f0492c.js}

@@ -1,52 +1,52 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
-var index$5 = require('./index-d0ff8123.js');
+var index$5 = require('./index-b02e6984.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-var index$7 = require('./index-20ca1bea.js');
-require('./index-4885f627.js');
-var index$b = require('./index-3457edab.js');
-require('./index-d8eca98a.js');
-var index$3 = require('./index-fc6d8ee1.js');
-var index$f = require('./index-62e6ff00.js');
-require('./index.styles-23370642.js');
-require('./translationsContext-d0f656cd.js');
+var index$7 = require('./index-2fbc2fb9.js');
+require('./index-c9ac94c1.js');
+var index$b = require('./index-9fa9adb2.js');
+require('./index-6a95fe70.js');
+var index$3 = require('./index-a2a7b761.js');
+var index$f = require('./index-ac6278c2.js');
+require('./index.styles-d3d2bbb1.js');
+require('./translationsContext-e2138078.js');
 require('@mantine/hooks');
-require('./text-6b8b876e.js');
-var utils = require('./utils-9c270ae9.js');
-require('./index-c33b57db.js');
-var index$2 = require('./index-a12c9111.js');
+require('./text-d3fb05a0.js');
+var utils = require('./utils-d06efb4f.js');
+require('./index-74f4ce84.js');
+var index$2 = require('./index-9bdf30c2.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var index$4 = require('./index-12daa1c3.js');
+var index$4 = require('./index-c9297ce4.js');
 var dateFns = require('date-fns');
 var DayPickerInput = require('react-day-picker/DayPickerInput');
-var index$6 = require('./index-e1eec2d7.js');
+var index$6 = require('./index-a6a97d89.js');
 var throttle = require('lodash/throttle');
 var parse = require('html-react-parser');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 var constantsIsProduction = require('./constantsIsProduction.js');
-var useOutsideClick = require('./useOutsideClick-35ad5edd.js');
+var useOutsideClick = require('./useOutsideClick-8d8b7b1f.js');
 var enUS = require('date-fns/locale/en-US');
 var id = require('date-fns/locale/id');
 var vi = require('date-fns/locale/vi');
 var zhTW = require('date-fns/locale/zh-TW');
-var index$a = require('./index-815d786b.js');
-var index$8 = require('./index-f6a456a2.js');
-var index$9 = require('./index-8e083bd5.js');
-var index$c = require('./index-0e3d7a81.js');
+var index$a = require('./index-7079be00.js');
+var index$8 = require('./index-71369cc8.js');
+var index$9 = require('./index-c8c7f128.js');
+var index$c = require('./index-04a36399.js');
 var miscGetSocialList = require('./miscGetSocialList.js');
-var index$e = require('./index-f02f08a0.js');
-var index$d = require('./index-b3e98c0b.js');
+var index$e = require('./index-f2625e60.js');
+var index$d = require('./index-7e6a61a1.js');
 var uuid = require('uuid');
-var Locale = require('./Locale-ae30da2d.js');
+var Locale = require('./Locale-f4bcfcca.js');
 var arrow = require('@hhgtech/icons/arrow');
 var other = require('@hhgtech/icons/other');
 var Lottie = require('lottie-light-react');
-var index$g = require('./index-d923984c.js');
-var index$h = require('./index-189d4bb5.js');
+var index$g = require('./index-4370f86e.js');
+var index$h = require('./index-75758d3c.js');
 var get = require('lodash/get');
 var debounce = require('lodash/debounce');
 
@@ -4727,7 +4727,7 @@ const StyledBox = styled__default["default"].div `
   border-radius: 12px;
   border: 1px solid ${miscTheme.theme.colors.neutral100};
 `;
-const StyledContent = styled__default["default"].div `
+const StyledContent$1 = styled__default["default"].div `
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
@@ -4809,7 +4809,7 @@ const HPVScreener = ({ onClick, className, style }) => {
     return (React__namespace["default"].createElement("div", { className: className, style: style },
         React__namespace["default"].createElement(StyledBox, null,
             React__namespace["default"].createElement(StyledContentBox, null,
-                React__namespace["default"].createElement(StyledContent, null,
+                React__namespace["default"].createElement(StyledContent$1, null,
                     React__namespace["default"].createElement(StyledBadge, null,
                         React__namespace["default"].createElement(StyledTextBadgeBox, null,
                             React__namespace["default"].createElement(StarUpgrade, { style: { width: '1rem', height: '1rem' } }),
@@ -5451,7 +5451,7 @@ GeneralInfo.Content = ProductContent;
 GeneralInfo.Title = ProductTitle;
 GeneralInfo.Description = ProductDescription;
 
-const StyledContainer$1 = styled__default["default"].div `
+const StyledContainer$2 = styled__default["default"].div `
   border-radius: 12px;
   padding: 0.875rem 0.75rem;
   background-color: ${miscTheme.theme.colors.neutral50};
@@ -5488,7 +5488,7 @@ const Center = styled__default["default"].div `
 `;
 
 const VoucherItem = ({ image, title, description, onClick, className, dataTracking = {}, }) => {
-    return (React__namespace["default"].createElement(StyledContainer$1, Object.assign({}, dataTracking, { className: className, onClick: onClick }),
+    return (React__namespace["default"].createElement(StyledContainer$2, Object.assign({}, dataTracking, { className: className, onClick: onClick }),
         React__namespace["default"].createElement(core.Grid, { gutter: "8px" },
             React__namespace["default"].createElement(core.Grid.Col, { span: "content" },
                 React__namespace["default"].createElement(Center, null,
@@ -5504,7 +5504,7 @@ const VoucherItem = ({ image, title, description, onClick, className, dataTracki
                     React__namespace["default"].createElement(StyledDescription, { size: "c2", weight: "halfBold" }, description))))));
 };
 
-const StyledContainer = styled__default["default"].div `
+const StyledContainer$1 = styled__default["default"].div `
   display: flex;
   flex-direction: column;
   align-items: center;
@@ -5520,7 +5520,7 @@ const StyledTextContainer = styled__default["default"].div `
 `;
 
 const CertificateItem = ({ image, description, title, className, }) => {
-    return (React__namespace["default"].createElement(StyledContainer, { className: className },
+    return (React__namespace["default"].createElement(StyledContainer$1, { className: className },
         React__namespace["default"].createElement(index$8.ImageWrap, { src: image, alt: title, style: {
                 width: core.rem(120),
                 height: core.rem(120),
@@ -5625,7 +5625,39 @@ const RatingStarsInput = ({ value, max = MAX_RATING, onChange, readOnly = false,
         error && (React__namespace["default"].createElement(index$3.Text, { className: "error-text", size: "c1", color: miscTheme.theme.colors.red600 }, error))));
 };
 
+const StyledContainer = styled__default["default"].div `
+  display: flex;
+  align-items: center;
+  gap: ${core.rem(8)};
+  padding: ${core.rem(10)} ${core.rem(8)};
+  background-color: ${miscTheme.theme.colors.neutral50};
+  border-radius: ${core.rem(8)};
+`;
+const StyledContent = styled__default["default"].div `
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+`;
+
+const AnsweredByDoctor = (props) => {
+    const { doctorName, doctorAvatar, defaultDoctorAvatar } = props;
+    const { t } = index$9.useTranslations();
+    return (React__namespace["default"].createElement(StyledContainer, null,
+        React__namespace["default"].createElement(index$8.ImageWrap, { alt: 'doctor-avatar', src: doctorAvatar || defaultDoctorAvatar, style: {
+                width: core.rem(32),
+                height: core.rem(32),
+                borderRadius: '50%',
+                objectFit: 'cover',
+            } }),
+        React__namespace["default"].createElement(StyledContent, null,
+            React__namespace["default"].createElement(index$3.Text, { size: "c2", weight: "regular", color: miscTheme.theme.colors.gray600 },
+                t('common.answeredBy'),
+                ":"),
+            React__namespace["default"].createElement(index$3.Text, { size: "p3", weight: "semiBold", color: miscTheme.theme.colors.gray800 }, doctorName))));
+};
+
 exports.AdBlock = AdBlock;
+exports.AnsweredByDoctor = AnsweredByDoctor;
 exports.Breadcrumbs = Breadcrumbs;
 exports.CardListItem = CardListItem;
 exports.CategoryCard = CategoryCard;

package/build/{index-6c8681f8.js → index-95535188.js}

@@ -1,29 +1,29 @@
 'use strict';
 
 var React = require('react');
-var index$1 = require('./index-56d6b7eb.js');
+var index$1 = require('./index-f947225e.js');
 var dayjs = require('dayjs');
-require('./index-20ca1bea.js');
-require('./index-d0ff8123.js');
+require('./index-2fbc2fb9.js');
+require('./index-b02e6984.js');
 var core = require('@mantine/core');
 require('@mantine/dates');
-require('./index-4885f627.js');
-require('./index-3457edab.js');
-require('./index-d8eca98a.js');
-var index$2 = require('./index-fc6d8ee1.js');
-require('./index-62e6ff00.js');
-require('./index.styles-23370642.js');
-require('./translationsContext-d0f656cd.js');
+require('./index-c9ac94c1.js');
+require('./index-9fa9adb2.js');
+require('./index-6a95fe70.js');
+var index$2 = require('./index-a2a7b761.js');
+require('./index-ac6278c2.js');
+require('./index.styles-d3d2bbb1.js');
+require('./translationsContext-e2138078.js');
 require('@mantine/hooks');
-require('./text-6b8b876e.js');
-var utils = require('./utils-9c270ae9.js');
-require('./index-c33b57db.js');
-var index = require('./index-f6a456a2.js');
+require('./text-d3fb05a0.js');
+var utils = require('./utils-d06efb4f.js');
+require('./index-74f4ce84.js');
+var index = require('./index-71369cc8.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
-var index$4 = require('./index-e1eec2d7.js');
-var index$3 = require('./index-cbbc0edc.js');
+var index$4 = require('./index-a6a97d89.js');
+var index$3 = require('./index-c9f38bdf.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-3799dd82.js → index-98c3adad.js}

@@ -1,26 +1,26 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
 var form = require('@mantine/form');
-var useHealthToolCache = require('./useHealthToolCache-27c2f13f.js');
-var index = require('./index-8e083bd5.js');
-var index$5 = require('./index-3457edab.js');
-var constants = require('./constants-42b48e64.js');
-var index$2 = require('./index-ebe463f1.js');
-var index$4 = require('./index-d0ff8123.js');
-var index$3 = require('./index-e9251564.js');
-require('./index-fc6d8ee1.js');
-require('./index-62e6ff00.js');
+var useHealthToolCache = require('./useHealthToolCache-fa3384ec.js');
+var index = require('./index-c8c7f128.js');
+var index$5 = require('./index-9fa9adb2.js');
+var constants = require('./constants-9d1f0fbf.js');
+var index$2 = require('./index-a26d9bf5.js');
+var index$4 = require('./index-b02e6984.js');
+var index$3 = require('./index-b1950c97.js');
+require('./index-a2a7b761.js');
+require('./index-ac6278c2.js');
 require('@mantine/core');
-require('./index.styles-23370642.js');
+require('./index.styles-d3d2bbb1.js');
 require('@mantine/hooks');
-require('./index-d8eca98a.js');
-require('./text-6b8b876e.js');
-require('./utils-9c270ae9.js');
-require('./index-c33b57db.js');
-require('./index-20ca1bea.js');
-var index$1 = require('./index-77932ace.js');
+require('./index-6a95fe70.js');
+require('./text-d3fb05a0.js');
+require('./utils-d06efb4f.js');
+require('./index-74f4ce84.js');
+require('./index-2fbc2fb9.js');
+var index$1 = require('./index-c87d20a4.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-ca83de7a.js → index-9a4bd56a.js}

@@ -1,14 +1,14 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
 var core = require('@mantine/core');
-var index$1 = require('./index-7eedce16.js');
-var index = require('./index-fc6d8ee1.js');
-var togetherComponentGlobalContext = require('./utils-740188a1.js');
+var index$1 = require('./index-b8d6d2cc.js');
+var index = require('./index-a2a7b761.js');
+var togetherComponentGlobalContext = require('./utils-d312921b.js');
 var styled = require('@emotion/styled');
 var togetherApiPaths = require('./togetherApiPaths.js');
-var constants = require('./constants-42b48e64.js');
+var constants = require('./constants-9d1f0fbf.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-a12c9111.js → index-9bdf30c2.js}

@@ -1,20 +1,20 @@
 'use strict';
 
 var React = require('react');
-var index$2 = require('./index-d0ff8123.js');
+var index$2 = require('./index-b02e6984.js');
 var styled = require('@emotion/styled');
 var miscTheme = require('./miscTheme.js');
-var index = require('./index-fc6d8ee1.js');
-var index$1 = require('./index-3457edab.js');
-var tslib_es6 = require('./tslib.es6-88957b36.js');
-var index$6 = require('./index-20ca1bea.js');
-var index$5 = require('./index-4885f627.js');
+var index = require('./index-a2a7b761.js');
+var index$1 = require('./index-9fa9adb2.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
+var index$7 = require('./index-2fbc2fb9.js');
+var index$5 = require('./index-c9ac94c1.js');
 var core = require('@mantine/core');
-var number = require('./number-4ebfe298.js');
-var index$3 = require('./index-8e083bd5.js');
+var number = require('./number-2ebe00d6.js');
+var index$3 = require('./index-c8c7f128.js');
 var hooks = require('@mantine/hooks');
-var index$4 = require('./index-c994b6f8.js');
-var index$7 = require('./index-66931f85.js');
+var index$4 = require('./index-6217f9e9.js');
+var index$6 = require('./index-86068bea.js');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -432,7 +432,6 @@ const VideoPlayerModal = (_a) => {
                 [theme.fn.smallerThan('sm')]: {},
             },
             inner: {
-                zIndex: index$6.ZINDEX_HEADER + 2,
                 [theme.fn.smallerThan('sm')]: {
                     padding: 0,
                 },
@@ -457,13 +456,12 @@ const VideoPlayerModal = (_a) => {
                 },
             },
             overlay: {
-                zIndex: index$6.ZINDEX_HEADER + 1,
                 [theme.fn.smallerThan('sm')]: {
                     backgroundColor: 'rgba(0, 0, 0, 0.85)',
                 },
             },
         }) }, rest), type === index$5.VideoType.SHORTS ? (React__default["default"].createElement(core.AspectRatio, { ratio: 315 / 560 },
-        React__default["default"].createElement("iframe", { width: "100%", height: "100%", src: `https://www.youtube.com/embed/${videoId}?autoplay=${Number(!isIos)}`, title: "YouTube video player", frameBorder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media;\ngyroscope; picture-in-picture;\nweb-share", allowFullScreen: true }))) : (React__default["default"].createElement(index$7.SocialLinkPreview, { key: url, url: url || '', autoPlay: !isIos }))));
+        React__default["default"].createElement("iframe", { width: "100%", height: "100%", src: `https://www.youtube.com/embed/${videoId}?autoplay=${Number(!isIos)}`, title: "YouTube video player", frameBorder: "0", allow: "accelerometer; autoplay; clipboard-write; encrypted-media;\ngyroscope; picture-in-picture;\nweb-share", allowFullScreen: true }))) : (React__default["default"].createElement(index$6.SocialLinkPreview, { key: url, url: url || '', autoPlay: !isIos }))));
 };
 
 const VideoItem = (_a) => {
@@ -484,7 +482,7 @@ const VideoItem = (_a) => {
             : !articleLink
                 ? (e) => {
                     if (redirectToLandingPage) {
-                        localStorage.setItem(index$6.VIDEO_DETAIL_TEMP_STORAGE, JSON.stringify({
+                        localStorage.setItem(index$7.VIDEO_DETAIL_TEMP_STORAGE, JSON.stringify({
                             articleLink,
                             id,
                             videoId,

package/build/{index-ed557478.js → index-9f5c888c.js}

@@ -2,7 +2,7 @@
 
 var React = require('react');
 var styled = require('@emotion/styled');
-var utils = require('./utils-9c270ae9.js');
+var utils = require('./utils-d06efb4f.js');
 var miscTheme = require('./miscTheme.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }

package/build/{index-ebe463f1.js → index-a26d9bf5.js}

@@ -1,23 +1,23 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
 var other = require('@hhgtech/icons/other');
 var core = require('@mantine/core');
-var index$2 = require('./index-d0ff8123.js');
+var index$2 = require('./index-b02e6984.js');
 require('@mantine/dates');
-require('./index-20ca1bea.js');
-require('./index-4885f627.js');
-var index$1 = require('./index-3457edab.js');
-require('./index-d8eca98a.js');
-var index$3 = require('./index-fc6d8ee1.js');
-require('./index-62e6ff00.js');
-require('./index.styles-23370642.js');
-var index = require('./index-8e083bd5.js');
+require('./index-2fbc2fb9.js');
+require('./index-c9ac94c1.js');
+var index$1 = require('./index-9fa9adb2.js');
+require('./index-6a95fe70.js');
+var index$3 = require('./index-a2a7b761.js');
+require('./index-ac6278c2.js');
+require('./index.styles-d3d2bbb1.js');
+var index = require('./index-c8c7f128.js');
 require('@mantine/hooks');
-require('./text-6b8b876e.js');
-require('./utils-9c270ae9.js');
-require('./index-c33b57db.js');
+require('./text-d3fb05a0.js');
+require('./utils-d06efb4f.js');
+require('./index-74f4ce84.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-fc6d8ee1.js → index-a2a7b761.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
 var core = require('@mantine/core');
-var text = require('./text-6b8b876e.js');
+var text = require('./text-d3fb05a0.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-3a52a107.js → index-a5a6119e.js}

@@ -1,50 +1,50 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
-var index$b = require('./index-4885f627.js');
-var index$8 = require('./index-a12c9111.js');
-var index$3 = require('./index-20ca1bea.js');
-var normalizeLink = require('./normalizeLink-c4d107b4.js');
-var dataTransform = require('./dataTransform-2b1d0314.js');
+var index$b = require('./index-c9ac94c1.js');
+var index$8 = require('./index-9bdf30c2.js');
+var index$3 = require('./index-2fbc2fb9.js');
+var normalizeLink = require('./normalizeLink-bf158704.js');
+var dataTransform = require('./dataTransform-dbd24255.js');
 var core = require('@hhgtech/icons/core');
-require('./translationsContext-d0f656cd.js');
+require('./translationsContext-e2138078.js');
 var styled = require('@emotion/styled');
-var index = require('./index-d0ff8123.js');
+var index = require('./index-b02e6984.js');
 var miscTheme = require('./miscTheme.js');
-var navigationProfileButton = require('./index-f85b9930.js');
+var navigationProfileButton = require('./index-8af2e55b.js');
 var other = require('@hhgtech/icons/other');
 var core$1 = require('@mantine/core');
-var index$d = require('./index-e1eec2d7.js');
+var index$d = require('./index-a6a97d89.js');
 var throttle = require('lodash/throttle');
 require('@mantine/dates');
-var index$5 = require('./index-3457edab.js');
-require('./index-d8eca98a.js');
-var index$4 = require('./index-fc6d8ee1.js');
-var index$2 = require('./index-62e6ff00.js');
-require('./index.styles-23370642.js');
+var index$5 = require('./index-9fa9adb2.js');
+require('./index-6a95fe70.js');
+var index$4 = require('./index-a2a7b761.js');
+var index$2 = require('./index-ac6278c2.js');
+require('./index.styles-d3d2bbb1.js');
 require('@mantine/hooks');
-require('./text-6b8b876e.js');
-var utils = require('./utils-9c270ae9.js');
-require('./index-c33b57db.js');
-var constants = require('./constants-70f76415.js');
-var store = require('./store-61997f61.js');
-var constants$1 = require('./constants-b18e39fc.js');
-var index$1 = require('./index-8e083bd5.js');
-var index$7 = require('./index-7eedce16.js');
-var index$6 = require('./index-af246cc1.js');
-var useIsInit = require('./useIsInit-a12cdf6a.js');
+require('./text-d3fb05a0.js');
+var utils = require('./utils-d06efb4f.js');
+require('./index-74f4ce84.js');
+var constants = require('./constants-bddafa24.js');
+var store = require('./store-32357fdc.js');
+var constants$1 = require('./constants-c2b89010.js');
+var index$1 = require('./index-c8c7f128.js');
+var index$7 = require('./index-b8d6d2cc.js');
+var index$6 = require('./index-85b664e2.js');
+var useIsInit = require('./useIsInit-49929e27.js');
 var miscDefaultClassWrapper = require('./miscDefaultClassWrapper.js');
-var index$9 = require('./index-815d786b.js');
+var index$9 = require('./index-7079be00.js');
 var dayjs = require('dayjs');
 var relativeTime = require('dayjs/plugin/relativeTime');
-var index$a = require('./index-781a97c6.js');
+var index$a = require('./index-0f2ee0ae.js');
 var formatString = require('string-format');
 var constantsDomainLocales = require('./constantsDomainLocales.js');
-var index$c = require('./index-56d6b7eb.js');
+var index$c = require('./index-f947225e.js');
 var debounce = require('lodash/debounce');
-var Locale = require('./Locale-ae30da2d.js');
-var core$2 = require('./core-73a0805e.js');
+var Locale = require('./Locale-f4bcfcca.js');
+var core$2 = require('./core-1f79e520.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 
@@ -835,10 +835,16 @@ const StyledContainerItems$4 = styled__default["default"].div `
 `;
 
 const StyledItem$4 = styled__default["default"].a `
+  position: relative;
   width: 100%;
   display: flex;
   align-items: center;
   text-decoration: none;
+
+  &[data-has-button='true'] {
+    cursor: default;
+    pointer-events: none;
+  }
   * {
     pointer-events: none;
   }
@@ -865,6 +871,50 @@ const StyledImageCard$2 = styled__default["default"].div `
     padding-top: 100px;
   }
 `;
+const StyledButton = styled__default["default"].button `
+  ${utils.MediaQueries.tdDown} {
+    position: relative;
+    bottom: 0;
+    left: 16px;
+    right: 0;
+    padding: 4px 8px;
+    width: 90px;
+    height: 24px;
+    min-height: 24px;
+    max-height: 24px;
+    font-size: 11px;
+    line-height: 16px;
+    border-radius: 8px;
+  }
+
+  position: absolute;
+  bottom: 8px;
+  left: 8px;
+  right: 8px;
+  height: 40px;
+  min-height: 40px;
+  max-height: 40px;
+  padding: 8px 16px;
+  pointer-events: auto;
+
+  background: ${(props) => props.bgColor};
+  border-radius: 12px;
+  border: none;
+  transition: all 0.2s ease-in-out;
+
+  color: ${(props) => props.textColor};
+  font-family: 'Inter';
+  font-weight: 500;
+  font-size: 15px;
+  text-align: center;
+  cursor: pointer;
+
+  &:hover {
+    opacity: 0.9;
+    color: ${(props) => props.bgColor};
+    background: ${(props) => props.textColor};
+  }
+`;
 const StyledTitle$3 = styled__default["default"].p `
   font-size: 16px;
   font-weight: 400;
@@ -880,10 +930,22 @@ const StyledTitle$3 = styled__default["default"].p `
 const Item$3 = ({ item, index = 0 }) => {
     if (!item)
         return null;
-    return (React__default["default"].createElement(StyledItem$4, { key: item.id, href: item.link, "data-event-category": "Hamburger Navigation", "data-event-action": `Spotlight Click ${index + 1}`, "data-event-label": item.link },
+    const linkProps = {
+        href: item.link,
+        'data-event-category': 'Hamburger Navigation',
+        'data-event-action': `Spotlight Click ${index + 1}`,
+        'data-event-label': item.link,
+    };
+    return (React__default["default"].createElement(StyledItem$4, Object.assign({ key: item.id, as: item.buttonDisplay ? 'div' : 'a', "data-has-button": item.buttonDisplay ? 'true' : 'false' }, linkProps),
         React__default["default"].createElement(StyledImageCard$2, null,
             React__default["default"].createElement("img", { loading: "lazy", alt: item.title, src: item.banner || '/images/notFound-min-small.jpg' })),
-        React__default["default"].createElement(StyledTitle$3, null, item.title)));
+        React__default["default"].createElement("div", { style: {
+                display: 'flex',
+                flexDirection: 'column',
+                gap: 8,
+            } },
+            React__default["default"].createElement(StyledTitle$3, null, item.title),
+            !!item.buttonDisplay && (React__default["default"].createElement(StyledButton, Object.assign({ as: item.buttonDisplay ? 'a' : 'button', bgColor: item.buttonDisplay.button_background_color, textColor: item.buttonDisplay.button_text_color }, linkProps), item.buttonDisplay.button_label)))));
 };
 
 const CategorySpotlights = ({ spotlightsList = [], hrefViewMore }) => {
@@ -894,6 +956,7 @@ const CategorySpotlights = ({ spotlightsList = [], hrefViewMore }) => {
             link: statics.HOME_PAGE_URL + spotlight.permalink,
             title: spotlight.name,
             banner: spotlight.image,
+            buttonDisplay: spotlight.buttonDisplay,
         } }))))) : (React__default["default"].createElement(SpotlightNoData, { title: t('home.navigator.menu.category.noDatas.title'), description: t('home.navigator.menu.category.noDatas.description'), link: hrefViewMore, cta: t('home.navigator.menu.category.noDatas.cta'), icon: index$5.CommonGAssets.getAssetPath('Spotlight.svg') }))));
 };
 
@@ -1920,6 +1983,7 @@ const formatSpotlightsList = (spotlight) => {
         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,
+        buttonDisplay: spotlight.button_display || null,
     };
 };
 const checkAvailableSpotlight = (spotlight) => {
@@ -2495,7 +2559,7 @@ const useNavServices = () => {
 };
 
 const StyledContainer = styled__default["default"].div `
-  --header-z-index: ${index$3.ZINDEX_HEADER};
+  --header-z-index: 305;
   top: 0;
   z-index: var(--header-z-index);
 

package/build/{index-e1eec2d7.js → index-a6a97d89.js}

@@ -1,13 +1,13 @@
 'use strict';
 
 var React = require('react');
-var Locale = require('./Locale-ae30da2d.js');
-var index$1 = require('./index-3457edab.js');
+var Locale = require('./Locale-f4bcfcca.js');
+var index$1 = require('./index-9fa9adb2.js');
 var styled = require('@emotion/styled');
-var utils = require('./utils-9c270ae9.js');
-var logoIcon = require('./logoIcon-b8eccd2d.js');
-require('./index-4885f627.js');
-var index = require('./index-f6a456a2.js');
+var utils = require('./utils-d06efb4f.js');
+var logoIcon = require('./logoIcon-2c2f5817.js');
+require('./index-c9ac94c1.js');
+var index = require('./index-71369cc8.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
 

package/build/{index-62e6ff00.js → index-ac6278c2.js}

@@ -1,10 +1,10 @@
 'use strict';
 
-var tslib_es6 = require('./tslib.es6-88957b36.js');
+var tslib_es6 = require('./tslib.es6-65e8cd55.js');
 var React = require('react');
 var core = require('@mantine/core');
-var shared = require('./shared-da83abe8.js');
-var text = require('./text-6b8b876e.js');
+var shared = require('./shared-106148b9.js');
+var text = require('./text-d3fb05a0.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }