@zenpatient-org/healthspan-marketing-ui 0.1.169 → 0.1.171

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (49) hide show
  1. package/dist/components/Button/Button.cjs.js +1 -1
  2. package/dist/components/Button/Button.d.ts +3 -0
  3. package/dist/components/Button/Button.es.js +34 -28
  4. package/dist/components/Callback/Callback.d.ts +1 -0
  5. package/dist/components/Pricing/Pricing.cjs.js +1 -1
  6. package/dist/components/Pricing/Pricing.d.ts +1 -1
  7. package/dist/components/Pricing/Pricing.es.js +51 -37
  8. package/dist/components/Pricing/types.d.ts +2 -0
  9. package/dist/components/ProductGallery/ProductGallery.cjs.js +1 -1
  10. package/dist/components/ProductGallery/ProductGallery.es.js +4 -3
  11. package/dist/components/ProductGalleryCard/ProductGalleryCard.cjs.js +1 -1
  12. package/dist/components/ProductGalleryCard/ProductGalleryCard.d.ts +1 -1
  13. package/dist/components/ProductGalleryCard/ProductGalleryCard.es.js +51 -22
  14. package/dist/components/ProductGalleryCard/types.d.ts +1 -0
  15. package/dist/components/ProductListing/ProductListing.cjs.js +1 -1
  16. package/dist/components/ProductListing/ProductListing.d.ts +3 -1
  17. package/dist/components/ProductListing/ProductListing.es.js +48 -25
  18. package/dist/modules/CallToAction/CallToAction.cjs.js +1 -1
  19. package/dist/modules/CallToAction/CallToAction.es.js +86 -73
  20. package/dist/modules/Callback/Callback.cjs.js +1 -1
  21. package/dist/modules/Callback/Callback.d.ts +3 -1
  22. package/dist/modules/Callback/Callback.es.js +46 -24
  23. package/dist/modules/Compare/Compare.cjs.js +1 -1
  24. package/dist/modules/Compare/Compare.es.js +12 -12
  25. package/dist/modules/Compare/types.d.ts +2 -2
  26. package/dist/modules/FeaturedIn/FeaturedIn.cjs.js +1 -1
  27. package/dist/modules/FeaturedIn/FeaturedIn.es.js +23 -32
  28. package/dist/modules/FeaturedIn/components/CtaFeaturedIn.cjs.js +1 -0
  29. package/dist/modules/FeaturedIn/components/CtaFeaturedIn.d.ts +5 -0
  30. package/dist/modules/FeaturedIn/components/CtaFeaturedIn.es.js +22 -0
  31. package/dist/modules/HowItWorks/HowItWorks.cjs.js +1 -1
  32. package/dist/modules/HowItWorks/HowItWorks.es.js +61 -30
  33. package/dist/modules/IndividualProductCard/IndividualProductCard.cjs.js +1 -1
  34. package/dist/modules/IndividualProductCard/IndividualProductCard.d.ts +2 -1
  35. package/dist/modules/IndividualProductCard/IndividualProductCard.es.js +84 -64
  36. package/dist/modules/ProgramsDetailsHero/ProgramsDetailsHero.cjs.js +1 -1
  37. package/dist/modules/ProgramsDetailsHero/ProgramsDetailsHero.es.js +38 -26
  38. package/dist/modules/YourProtocol/YourProtocol.cjs.js +1 -1
  39. package/dist/modules/YourProtocol/YourProtocol.es.js +48 -35
  40. package/dist/pageComponents/HomepageHero/HomepageHero.cjs.js +1 -1
  41. package/dist/pageComponents/HomepageHero/HomepageHero.es.js +19 -28
  42. package/dist/pageComponents/LabsHero/LabsHero.cjs.js +1 -1
  43. package/dist/pageComponents/LabsHero/LabsHero.es.js +54 -43
  44. package/dist/pageComponents/PersonalizedProtocolHero/PersonalizedProtocolHero.cjs.js +1 -1
  45. package/dist/pageComponents/PersonalizedProtocolHero/PersonalizedProtocolHero.es.js +73 -60
  46. package/dist/types/analytics/analytics.cjs.js +1 -1
  47. package/dist/types/analytics/analytics.es.js +3 -3
  48. package/dist/types/analytics.d.ts +26 -3
  49. package/package.json +1 -1
@@ -1 +1 @@
1
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),q=require("react"),v=require("../../utils/cn/cn.cjs.js"),c=require("../Icon/Icon.cjs.js"),t=require("./button.module.css.cjs.js"),o=q.forwardRef(({variant:r="primary",size:l="md",as:u="button",disabled:s=!1,children:i,prefixIcon:n,suffixIcon:a,...d},m)=>{const f=t.default[r]||"",j=t.default[l]||"",b=s?t.default.disabled:"";return e.jsx(u,{ref:m,...d,className:v.cn(t.default.button,f,j,b),disabled:s,children:e.jsxs("div",{className:t.default.content,children:[n&&e.jsx("div",{className:t.default.iconWrap,children:e.jsx(c.Icon,{name:n})}),e.jsx("div",{children:i}),a&&e.jsx("div",{className:t.default.iconWrap,children:e.jsx(c.Icon,{name:a})})]})})});o.displayName="Button";exports.Button=o;
1
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),y=require("react"),N=require("../../utils/cn/cn.cjs.js"),u=require("../Icon/Icon.cjs.js"),t=require("./button.module.css.cjs.js"),d=y.forwardRef(({variant:r="primary",size:m="md",as:f="button",disabled:a=!1,children:j,prefixIcon:s,suffixIcon:c,analyticsProps:l,...n},b)=>{const v=t.default[r]||"",q=t.default[m]||"",C=a?t.default.disabled:"",h=x=>{var i,o;l&&((i=window.eventBus)==null||i.emit("analytics",l)),(o=n.onClick)==null||o.call(n,x)};return e.jsx(f,{ref:b,...n,className:N.cn(t.default.button,v,q,C),disabled:a,onClick:h,"data-type":"button",children:e.jsxs("div",{className:t.default.content,children:[s&&e.jsx("div",{className:t.default.iconWrap,children:e.jsx(u.Icon,{name:s})}),e.jsx("div",{children:j}),c&&e.jsx("div",{className:t.default.iconWrap,children:e.jsx(u.Icon,{name:c})})]})})});d.displayName="Button";exports.Button=d;
@@ -1,5 +1,6 @@
1
1
  import { default as React, ElementType, ButtonHTMLAttributes, AnchorHTMLAttributes } from 'react';
2
2
  import { EIconName } from '../Icon';
3
+ import { TAnalyticsEvent } from '../../types/analytics';
3
4
 
4
5
  type ButtonVariant = 'primary' | 'primary-invert' | 'secondary' | 'muted' | 'muted-invert' | 'ghost';
5
6
  type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
@@ -9,6 +10,8 @@ interface BaseButtonProps {
9
10
  as?: ElementType;
10
11
  prefixIcon?: EIconName;
11
12
  suffixIcon?: EIconName;
13
+ analyticsProps?: TAnalyticsEvent;
14
+ onClick?: (event: React.MouseEvent<HTMLButtonElement> | React.MouseEvent<HTMLAnchorElement>) => void;
12
15
  }
13
16
  export type ButtonProps = BaseButtonProps & ButtonHTMLAttributes<HTMLButtonElement> & AnchorHTMLAttributes<HTMLAnchorElement>;
14
17
  export declare const Button: React.ForwardRefExoticComponent<Omit<ButtonProps, "className"> & React.RefAttributes<HTMLElement>>;
@@ -1,38 +1,44 @@
1
1
  "use client";
2
- import { jsx as a, jsxs as v } from "react/jsx-runtime";
3
- import { forwardRef as N } from "react";
4
- import { cn as h } from "../../utils/cn/cn.es.js";
5
- import { Icon as n } from "../Icon/Icon.es.js";
6
- import s from "./button.module.css.es.js";
7
- const b = N(
2
+ import { jsx as n, jsxs as k } from "react/jsx-runtime";
3
+ import { forwardRef as w } from "react";
4
+ import { cn as B } from "../../utils/cn/cn.es.js";
5
+ import { Icon as m } from "../Icon/Icon.es.js";
6
+ import t from "./button.module.css.es.js";
7
+ const j = w(
8
8
  ({
9
- variant: e = "primary",
10
- size: i = "md",
11
- as: m = "button",
12
- disabled: t = !1,
13
- children: c,
14
- prefixIcon: r,
15
- suffixIcon: o,
16
- ...l
17
- }, d) => {
18
- const p = s[e] || "", f = s[i] || "", u = t ? s.disabled : "";
19
- return /* @__PURE__ */ a(
20
- m,
9
+ variant: r = "primary",
10
+ size: d = "md",
11
+ as: u = "button",
12
+ disabled: e = !1,
13
+ children: f,
14
+ prefixIcon: i,
15
+ suffixIcon: s,
16
+ analyticsProps: o,
17
+ ...a
18
+ }, v) => {
19
+ const C = t[r] || "", h = t[d] || "", N = e ? t.disabled : "", b = (y) => {
20
+ var c, l;
21
+ o && ((c = window.eventBus) == null || c.emit("analytics", o)), (l = a.onClick) == null || l.call(a, y);
22
+ };
23
+ return /* @__PURE__ */ n(
24
+ u,
21
25
  {
22
- ref: d,
23
- ...l,
24
- className: h(s.button, p, f, u),
25
- disabled: t,
26
- children: /* @__PURE__ */ v("div", { className: s.content, children: [
27
- r && /* @__PURE__ */ a("div", { className: s.iconWrap, children: /* @__PURE__ */ a(n, { name: r }) }),
28
- /* @__PURE__ */ a("div", { children: c }),
29
- o && /* @__PURE__ */ a("div", { className: s.iconWrap, children: /* @__PURE__ */ a(n, { name: o }) })
26
+ ref: v,
27
+ ...a,
28
+ className: B(t.button, C, h, N),
29
+ disabled: e,
30
+ onClick: b,
31
+ "data-type": "button",
32
+ children: /* @__PURE__ */ k("div", { className: t.content, children: [
33
+ i && /* @__PURE__ */ n("div", { className: t.iconWrap, children: /* @__PURE__ */ n(m, { name: i }) }),
34
+ /* @__PURE__ */ n("div", { children: f }),
35
+ s && /* @__PURE__ */ n("div", { className: t.iconWrap, children: /* @__PURE__ */ n(m, { name: s }) })
30
36
  ] })
31
37
  }
32
38
  );
33
39
  }
34
40
  );
35
- b.displayName = "Button";
41
+ j.displayName = "Button";
36
42
  export {
37
- b as Button
43
+ j as Button
38
44
  };
@@ -9,5 +9,6 @@ export type CallbackProps = {
9
9
  button: ButtonProps;
10
10
  size: CallbackSize;
11
11
  shape?: CallbackShape;
12
+ onClick?: () => void;
12
13
  };
13
14
  export declare const Callback: ({ image, title, description, price, button, size, shape, }: CallbackProps) => import("react/jsx-runtime").JSX.Element;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../utils/cn/cn.cjs.js"),t=require("../Button/Button.cjs.js"),c=require("../Label/Label.cjs.js"),o=require("../Typography/Typography.cjs.js"),m=require("./components/BenefitItem/BenefitItem.cjs.js"),a=require("./pricing.module.css.cjs.js"),g=({label:i,price:d,items:u,link:r,button:s})=>e.jsxs("div",{className:a.default.root,children:[e.jsx(c.Label,{size:"lg",color:i.color,className:n.cn(a.default.pricingLabel,a.default.pricingLabelDesktop),children:i.label}),e.jsx(c.Label,{size:"sm",color:i.color,className:n.cn(a.default.pricingLabel,a.default.pricingLabelMobile),children:i.label}),e.jsxs("p",{className:a.default.pricing,children:[e.jsx(o.Typography,{as:"span",defaultVariant:"displayMd",mobileVariant:"displaySm",className:a.default.pricingTextPrimary,children:`$${d}`}),e.jsx(o.Typography,{as:"span",defaultVariant:"headingSm",mobileVariant:"headingXs",className:a.default.pricingTextSecondary,children:"/ mo"})]}),e.jsx("div",{className:a.default.benefits,children:u.map((l,p)=>e.jsx(m.BenefitItem,{badge:l.badge,label:l.label},p))}),e.jsx("div",{className:a.default.pricingButtonContainerDesktop,children:e.jsx(t.Button,{...s,size:"lg",as:"a",href:r,children:"GET STARTED"})}),e.jsx("div",{className:a.default.pricingButtonContainerMobile,children:e.jsx(t.Button,{...s,size:"md",as:"a",href:r,children:"GET STARTED"})}),e.jsx("div",{className:a.default.leftBorder}),e.jsx("div",{className:a.default.rightBorder})]});exports.Pricing=g;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../utils/cn/cn.cjs.js"),l=require("../Button/Button.cjs.js"),o=require("../Label/Label.cjs.js"),d=require("../Typography/Typography.cjs.js"),h=require("./components/BenefitItem/BenefitItem.cjs.js"),a=require("./pricing.module.css.cjs.js"),p=require("../../types/analytics/analytics.cjs.js"),b=({label:i,price:u,items:m,link:t,button:n,zenpatientId:g,element:y})=>{const s={event:p.EAnalyticsEvent.ctaClicked,type:p.EAnalyticsEventType.interaction,component:"Pricing",element:y,payload:{ctaLabel:"GET STARTED",ctaLink:t,productId:g}};return e.jsxs("div",{className:a.default.root,children:[e.jsx(o.Label,{size:"lg",color:i.color,className:c.cn(a.default.pricingLabel,a.default.pricingLabelDesktop),children:i.label}),e.jsx(o.Label,{size:"sm",color:i.color,className:c.cn(a.default.pricingLabel,a.default.pricingLabelMobile),children:i.label}),e.jsxs("p",{className:a.default.pricing,children:[e.jsx(d.Typography,{as:"span",defaultVariant:"displayMd",mobileVariant:"displaySm",className:a.default.pricingTextPrimary,children:`$${u}`}),e.jsx(d.Typography,{as:"span",defaultVariant:"headingSm",mobileVariant:"headingXs",className:a.default.pricingTextSecondary,children:"/ mo"})]}),e.jsx("div",{className:a.default.benefits,children:m.map((r,f)=>e.jsx(h.BenefitItem,{badge:r.badge,label:r.label},f))}),e.jsx("div",{className:a.default.pricingButtonContainerDesktop,children:e.jsx(l.Button,{...n,size:"lg",as:"a",href:t,analyticsProps:s,children:"GET STARTED"})}),e.jsx("div",{className:a.default.pricingButtonContainerMobile,children:e.jsx(l.Button,{...n,size:"md",as:"a",href:t,analyticsProps:s,children:"GET STARTED"})}),e.jsx("div",{className:a.default.leftBorder}),e.jsx("div",{className:a.default.rightBorder})]})};exports.Pricing=b;
@@ -1,3 +1,3 @@
1
1
  import { PricingElementView } from './types';
2
2
 
3
- export declare const Pricing: ({ label, price, items, link, button }: PricingElementView) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const Pricing: ({ label, price, items, link, button, zenpatientId, element }: PricingElementView) => import("react/jsx-runtime").JSX.Element;
@@ -1,41 +1,55 @@
1
- import { jsxs as o, jsx as e } from "react/jsx-runtime";
2
- import { cn as n } from "../../utils/cn/cn.es.js";
3
- import { Button as c } from "../Button/Button.es.js";
1
+ import { jsxs as t, jsx as a } from "react/jsx-runtime";
2
+ import { cn as o } from "../../utils/cn/cn.es.js";
3
+ import { Button as l } from "../Button/Button.es.js";
4
4
  import { Label as m } from "../Label/Label.es.js";
5
- import { Typography as t } from "../Typography/Typography.es.js";
6
- import { BenefitItem as h } from "./components/BenefitItem/BenefitItem.es.js";
5
+ import { Typography as p } from "../Typography/Typography.es.js";
6
+ import { BenefitItem as b } from "./components/BenefitItem/BenefitItem.es.js";
7
7
  import i from "./pricing.module.css.es.js";
8
- const u = ({ label: r, price: d, items: p, link: a, button: s }) => /* @__PURE__ */ o("div", { className: i.root, children: [
9
- /* @__PURE__ */ e(m, { size: "lg", color: r.color, className: n(i.pricingLabel, i.pricingLabelDesktop), children: r.label }),
10
- /* @__PURE__ */ e(m, { size: "sm", color: r.color, className: n(i.pricingLabel, i.pricingLabelMobile), children: r.label }),
11
- /* @__PURE__ */ o("p", { className: i.pricing, children: [
12
- /* @__PURE__ */ e(
13
- t,
14
- {
15
- as: "span",
16
- defaultVariant: "displayMd",
17
- mobileVariant: "displaySm",
18
- className: i.pricingTextPrimary,
19
- children: `$${d}`
20
- }
21
- ),
22
- /* @__PURE__ */ e(
23
- t,
24
- {
25
- as: "span",
26
- defaultVariant: "headingSm",
27
- mobileVariant: "headingXs",
28
- className: i.pricingTextSecondary,
29
- children: "/ mo"
30
- }
31
- )
32
- ] }),
33
- /* @__PURE__ */ e("div", { className: i.benefits, children: p.map((l, g) => /* @__PURE__ */ e(h, { badge: l.badge, label: l.label }, g)) }),
34
- /* @__PURE__ */ e("div", { className: i.pricingButtonContainerDesktop, children: /* @__PURE__ */ e(c, { ...s, size: "lg", as: "a", href: a, children: "GET STARTED" }) }),
35
- /* @__PURE__ */ e("div", { className: i.pricingButtonContainerMobile, children: /* @__PURE__ */ e(c, { ...s, size: "md", as: "a", href: a, children: "GET STARTED" }) }),
36
- /* @__PURE__ */ e("div", { className: i.leftBorder }),
37
- /* @__PURE__ */ e("div", { className: i.rightBorder })
38
- ] });
8
+ import { EAnalyticsEventType as T, EAnalyticsEvent as E } from "../../types/analytics/analytics.es.js";
9
+ const D = ({ label: e, price: d, items: g, link: r, button: n, zenpatientId: h, element: f }) => {
10
+ const c = {
11
+ event: E.ctaClicked,
12
+ type: T.interaction,
13
+ component: "Pricing",
14
+ element: f,
15
+ payload: {
16
+ ctaLabel: "GET STARTED",
17
+ ctaLink: r,
18
+ productId: h
19
+ }
20
+ };
21
+ return /* @__PURE__ */ t("div", { className: i.root, children: [
22
+ /* @__PURE__ */ a(m, { size: "lg", color: e.color, className: o(i.pricingLabel, i.pricingLabelDesktop), children: e.label }),
23
+ /* @__PURE__ */ a(m, { size: "sm", color: e.color, className: o(i.pricingLabel, i.pricingLabelMobile), children: e.label }),
24
+ /* @__PURE__ */ t("p", { className: i.pricing, children: [
25
+ /* @__PURE__ */ a(
26
+ p,
27
+ {
28
+ as: "span",
29
+ defaultVariant: "displayMd",
30
+ mobileVariant: "displaySm",
31
+ className: i.pricingTextPrimary,
32
+ children: `$${d}`
33
+ }
34
+ ),
35
+ /* @__PURE__ */ a(
36
+ p,
37
+ {
38
+ as: "span",
39
+ defaultVariant: "headingSm",
40
+ mobileVariant: "headingXs",
41
+ className: i.pricingTextSecondary,
42
+ children: "/ mo"
43
+ }
44
+ )
45
+ ] }),
46
+ /* @__PURE__ */ a("div", { className: i.benefits, children: g.map((s, y) => /* @__PURE__ */ a(b, { badge: s.badge, label: s.label }, y)) }),
47
+ /* @__PURE__ */ a("div", { className: i.pricingButtonContainerDesktop, children: /* @__PURE__ */ a(l, { ...n, size: "lg", as: "a", href: r, analyticsProps: c, children: "GET STARTED" }) }),
48
+ /* @__PURE__ */ a("div", { className: i.pricingButtonContainerMobile, children: /* @__PURE__ */ a(l, { ...n, size: "md", as: "a", href: r, analyticsProps: c, children: "GET STARTED" }) }),
49
+ /* @__PURE__ */ a("div", { className: i.leftBorder }),
50
+ /* @__PURE__ */ a("div", { className: i.rightBorder })
51
+ ] });
52
+ };
39
53
  export {
40
- u as Pricing
54
+ D as Pricing
41
55
  };
@@ -3,6 +3,7 @@ import { LabelColor } from '../Label';
3
3
  import { ETypeBadge } from '../TypeBadge';
4
4
 
5
5
  export type PricingElementView = {
6
+ zenpatientId: string;
6
7
  label: {
7
8
  label: string;
8
9
  color: LabelColor;
@@ -14,4 +15,5 @@ export type PricingElementView = {
14
15
  price: number;
15
16
  button: ButtonProps;
16
17
  link: string;
18
+ element: 'left_card' | 'right_card';
17
19
  };
@@ -1 +1 @@
1
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),q=require("../../node_modules/swiper/modules/navigation.cjs.js"),p=require("../../node_modules/swiper/swiper-react.cjs.js"),f=require("../../utils/cn/cn.cjs.js"),x=require("../../utils/useSwiper/useSwiper.cjs.js"),h=require("../ProgressButton/ProgressButton.cjs.js"),j=require("../ProductGalleryCard/ProductGalleryCard.cjs.js");;/* empty css */;/* empty css */;/* empty css */const r=require("./productGallery.module.css.cjs.js"),b=[q.default],v=({slides:i,header:m,isTabbed:l=!1})=>{const{swiper:t,activeIndex:n,isEnd:a,setIsEnd:w,hideNav:S,handleSlideChange:g,handlePrevClick:o,handleNextClick:c,onSwiperInit:C,handleSwiperResize:P,handleSlideTo:d}=x.useSwiper();return u.useEffect(()=>{t==null||t.setProgress(0,300)},[t]),u.useEffect(()=>{i.length&&d(0)},[i,d]),e.jsxs("div",{className:r.default.root,children:[e.jsxs("div",{className:f.cn(r.default.topRow,{[r.default.topRowTabbed]:l}),children:[e.jsx("div",{className:r.default.headerWrapper,children:m}),e.jsx("div",{className:f.cn(r.default.swiperControlsDesktop,{[r.default.swiperControlsHidden]:S,[r.default.swiperControlsTabbed]:l}),children:e.jsx(h.ProgressButton,{left:{disabled:n<=0,onClick:o},right:{disabled:a,onClick:c}})})]}),e.jsx("div",{className:r.default.carouselArea,children:e.jsx(p.Swiper,{onSwiper:C,onResize:P,onSlideChange:g,onReachEnd:()=>w(!0),modules:b,spaceBetween:0,slidesPerView:"auto",className:r.default.swiper,children:i.map(s=>e.jsx(p.SwiperSlide,{className:r.default.swiperSlide,children:e.jsx(j.ProductGalleryCard,{name:s.name,price:s.price,image:s.image,link:s.link,buttons:s.buttons})},`${s.name}_${s.link}`))})}),e.jsx("div",{className:r.default.swiperControlsMobile,children:e.jsx(h.ProgressButton,{left:{disabled:n<=0,onClick:o},right:{disabled:a,onClick:c}})})]})};exports.ProductGallery=v;
1
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),q=require("../../node_modules/swiper/modules/navigation.cjs.js"),p=require("../../node_modules/swiper/swiper-react.cjs.js"),f=require("../../utils/cn/cn.cjs.js"),x=require("../../utils/useSwiper/useSwiper.cjs.js"),h=require("../ProgressButton/ProgressButton.cjs.js"),j=require("../ProductGalleryCard/ProductGalleryCard.cjs.js");;/* empty css */;/* empty css */;/* empty css */const r=require("./productGallery.module.css.cjs.js"),b=[q.default],v=({slides:n,header:m,isTabbed:i=!1})=>{const{swiper:s,activeIndex:a,isEnd:l,setIsEnd:w,hideNav:S,handleSlideChange:g,handlePrevClick:o,handleNextClick:d,onSwiperInit:C,handleSwiperResize:P,handleSlideTo:c}=x.useSwiper();return u.useEffect(()=>{s==null||s.setProgress(0,300)},[s]),u.useEffect(()=>{n.length&&c(0)},[n,c]),e.jsxs("div",{className:r.default.root,children:[e.jsxs("div",{className:f.cn(r.default.topRow,{[r.default.topRowTabbed]:i}),children:[e.jsx("div",{className:r.default.headerWrapper,children:m}),e.jsx("div",{className:f.cn(r.default.swiperControlsDesktop,{[r.default.swiperControlsHidden]:S,[r.default.swiperControlsTabbed]:i}),children:e.jsx(h.ProgressButton,{left:{disabled:a<=0,onClick:o},right:{disabled:l,onClick:d}})})]}),e.jsx("div",{className:r.default.carouselArea,children:e.jsx(p.Swiper,{onSwiper:C,onResize:P,onSlideChange:g,onReachEnd:()=>w(!0),modules:b,spaceBetween:0,slidesPerView:"auto",className:r.default.swiper,children:n.map(t=>e.jsx(p.SwiperSlide,{className:r.default.swiperSlide,children:e.jsx(j.ProductGalleryCard,{name:t.name,price:t.price,image:t.image,link:t.link,buttons:t.buttons,zenpatientId:t.zenpatientId})},`${t.name}_${t.link}`))})}),e.jsx("div",{className:r.default.swiperControlsMobile,children:e.jsx(h.ProgressButton,{left:{disabled:a<=0,onClick:o},right:{disabled:l,onClick:d}})})]})};exports.ProductGallery=v;
@@ -11,7 +11,7 @@ import { ProductGalleryCard as E } from "../ProductGalleryCard/ProductGalleryCar
11
11
  /* empty css */
12
12
  /* empty css */
13
13
  import e from "./productGallery.module.css.es.js";
14
- const R = [k], $ = ({ slides: n, header: w, isTabbed: t = !1 }) => {
14
+ const I = [k], $ = ({ slides: n, header: w, isTabbed: t = !1 }) => {
15
15
  const {
16
16
  swiper: o,
17
17
  activeIndex: a,
@@ -70,7 +70,7 @@ const R = [k], $ = ({ slides: n, header: w, isTabbed: t = !1 }) => {
70
70
  onResize: g,
71
71
  onSlideChange: S,
72
72
  onReachEnd: () => u(!0),
73
- modules: R,
73
+ modules: I,
74
74
  spaceBetween: 0,
75
75
  slidesPerView: "auto",
76
76
  className: e.swiper,
@@ -81,7 +81,8 @@ const R = [k], $ = ({ slides: n, header: w, isTabbed: t = !1 }) => {
81
81
  price: i.price,
82
82
  image: i.image,
83
83
  link: i.link,
84
- buttons: i.buttons
84
+ buttons: i.buttons,
85
+ zenpatientId: i.zenpatientId
85
86
  }
86
87
  ) }, `${i.name}_${i.link}`))
87
88
  }
@@ -1 +1 @@
1
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Button/Button.cjs.js"),s=require("../Typography/Typography.cjs.js"),c=require("../../utils/cn/cn.cjs.js"),a=require("./productGalleryCard.module.css.cjs.js"),m=({name:i,price:u,image:d,link:p,buttons:t,isHoverable:n=!0})=>e.jsxs("a",{href:p,rel:"noopener noreferrer",className:a.default.root,children:[e.jsxs("div",{className:a.default.productInfo,children:[e.jsx(s.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:a.default.title,children:i}),e.jsx(s.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:a.default.price,children:u})]}),e.jsx("img",{src:d,alt:"product image",className:a.default.productImage}),e.jsx("div",{className:c.cn(a.default.buttonContainerDesktop,n&&a.default.hoverableButtons),children:t.map((r,l)=>e.jsx(o.Button,{size:"sm",...r,children:r.label},l))}),e.jsx("div",{className:c.cn(a.default.buttonContainerMobile,n&&a.default.hoverableButtons),children:t.map((r,l)=>e.jsx(o.Button,{size:"xs",...r,children:r.label},l))})]});exports.ProductGalleryCard=m;
1
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),u=require("../Button/Button.cjs.js"),p=require("../Typography/Typography.cjs.js"),y=require("../../utils/cn/cn.cjs.js"),l=require("./productGalleryCard.module.css.cjs.js"),r=require("../../types/analytics/analytics.cjs.js"),v=({name:n,price:m,image:h,zenpatientId:c,link:o,buttons:s,isHoverable:i=!0})=>{const f=()=>{var t;const e={event:r.EAnalyticsEvent.productGalleryCardClicked,type:r.EAnalyticsEventType.interaction,component:"ProductGalleryCard",element:"card",payload:{zenpatientId:c,link:o,productName:n}};(t=window.eventBus)==null||t.emit("analytics",e)},d=(e,t)=>({event:r.EAnalyticsEvent.ctaClicked,type:r.EAnalyticsEventType.interaction,component:"ProductGalleryCard",element:`button_${t}`,payload:{ctaLabel:e.label,productId:c,productName:n}});return a.jsxs("a",{href:o,rel:"noopener noreferrer",className:l.default.root,onClick:f,children:[a.jsxs("div",{className:l.default.productInfo,children:[a.jsx(p.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:l.default.title,children:n}),a.jsx(p.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:l.default.price,children:m})]}),a.jsx("img",{src:h,alt:"product image",className:l.default.productImage}),a.jsx("div",{className:y.cn(l.default.buttonContainerDesktop,i&&l.default.hoverableButtons),children:s.map((e,t)=>a.jsx(u.Button,{size:"sm",...e,analyticsProps:d(e,t),children:e.label},t))}),a.jsx("div",{className:y.cn(l.default.buttonContainerMobile,i&&l.default.hoverableButtons),children:s.map((e,t)=>a.jsx(u.Button,{size:"xs",...e,analyticsProps:d(e,t),children:e.label},t))})]})};exports.ProductGalleryCard=v;
@@ -3,5 +3,5 @@ import { TProductGalleryCardView } from './types';
3
3
  type ProductGalleryCardProps = {
4
4
  isHoverable?: boolean;
5
5
  } & TProductGalleryCardView;
6
- export declare const ProductGalleryCard: ({ name, price, image, link, buttons, isHoverable, }: ProductGalleryCardProps) => import("react/jsx-runtime").JSX.Element;
6
+ export declare const ProductGalleryCard: ({ name, price, image, zenpatientId, link, buttons, isHoverable, }: ProductGalleryCardProps) => import("react/jsx-runtime").JSX.Element;
7
7
  export {};
@@ -1,25 +1,54 @@
1
1
  "use client";
2
- import { jsxs as i, jsx as r } from "react/jsx-runtime";
3
- import { Button as s } from "../Button/Button.es.js";
4
- import { Typography as n } from "../Typography/Typography.es.js";
5
- import { cn as m } from "../../utils/cn/cn.es.js";
6
- import e from "./productGalleryCard.module.css.es.js";
7
- const v = ({
8
- name: c,
9
- price: d,
10
- image: p,
11
- link: h,
12
- buttons: o,
13
- isHoverable: t = !0
14
- }) => /* @__PURE__ */ i("a", { href: h, rel: "noopener noreferrer", className: e.root, children: [
15
- /* @__PURE__ */ i("div", { className: e.productInfo, children: [
16
- /* @__PURE__ */ r(n, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: e.title, children: c }),
17
- /* @__PURE__ */ r(n, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: e.price, children: d })
18
- ] }),
19
- /* @__PURE__ */ r("img", { src: p, alt: "product image", className: e.productImage }),
20
- /* @__PURE__ */ r("div", { className: m(e.buttonContainerDesktop, t && e.hoverableButtons), children: o.map((a, l) => /* @__PURE__ */ r(s, { size: "sm", ...a, children: a.label }, l)) }),
21
- /* @__PURE__ */ r("div", { className: m(e.buttonContainerMobile, t && e.hoverableButtons), children: o.map((a, l) => /* @__PURE__ */ r(s, { size: "xs", ...a, children: a.label }, l)) })
22
- ] });
2
+ import { jsxs as d, jsx as t } from "react/jsx-runtime";
3
+ import { Button as m } from "../Button/Button.es.js";
4
+ import { Typography as p } from "../Typography/Typography.es.js";
5
+ import { cn as u } from "../../utils/cn/cn.es.js";
6
+ import r from "./productGalleryCard.module.css.es.js";
7
+ import { EAnalyticsEventType as y, EAnalyticsEvent as h } from "../../types/analytics/analytics.es.js";
8
+ const k = ({
9
+ name: l,
10
+ price: f,
11
+ image: v,
12
+ zenpatientId: o,
13
+ link: c,
14
+ buttons: n,
15
+ isHoverable: i = !0
16
+ }) => {
17
+ const C = () => {
18
+ var a;
19
+ const e = {
20
+ event: h.productGalleryCardClicked,
21
+ type: y.interaction,
22
+ component: "ProductGalleryCard",
23
+ element: "card",
24
+ payload: {
25
+ zenpatientId: o,
26
+ link: c,
27
+ productName: l
28
+ }
29
+ };
30
+ (a = window.eventBus) == null || a.emit("analytics", e);
31
+ }, s = (e, a) => ({
32
+ event: h.ctaClicked,
33
+ type: y.interaction,
34
+ component: "ProductGalleryCard",
35
+ element: `button_${a}`,
36
+ payload: {
37
+ ctaLabel: e.label,
38
+ productId: o,
39
+ productName: l
40
+ }
41
+ });
42
+ return /* @__PURE__ */ d("a", { href: c, rel: "noopener noreferrer", className: r.root, onClick: C, children: [
43
+ /* @__PURE__ */ d("div", { className: r.productInfo, children: [
44
+ /* @__PURE__ */ t(p, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: r.title, children: l }),
45
+ /* @__PURE__ */ t(p, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: r.price, children: f })
46
+ ] }),
47
+ /* @__PURE__ */ t("img", { src: v, alt: "product image", className: r.productImage }),
48
+ /* @__PURE__ */ t("div", { className: u(r.buttonContainerDesktop, i && r.hoverableButtons), children: n.map((e, a) => /* @__PURE__ */ t(m, { size: "sm", ...e, analyticsProps: s(e, a), children: e.label }, a)) }),
49
+ /* @__PURE__ */ t("div", { className: u(r.buttonContainerMobile, i && r.hoverableButtons), children: n.map((e, a) => /* @__PURE__ */ t(m, { size: "xs", ...e, analyticsProps: s(e, a), children: e.label }, a)) })
50
+ ] });
51
+ };
23
52
  export {
24
- v as ProductGalleryCard
53
+ k as ProductGalleryCard
25
54
  };
@@ -4,6 +4,7 @@ export type TProductGalleryCardView = {
4
4
  name: string;
5
5
  price: string;
6
6
  image: string;
7
+ zenpatientId: string;
7
8
  link: string;
8
9
  buttons: Array<{
9
10
  label: string;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../utils/cn/cn.cjs.js"),n=require("../Button/Button.cjs.js"),h=require("../Label/Label.cjs.js"),y=require("../TypeBadge/TypeBadge.cjs.js"),t=require("../Typography/Typography.cjs.js"),a=require("./productListing.module.css.cjs.js"),g=({name:d,description:o,image:u,price:p,buttons:i,features:m,label:r})=>e.jsxs("section",{className:a.default.root,children:[e.jsxs("div",{className:a.default.imageWrapper,children:[e.jsx("img",{src:u,alt:d,className:a.default.image}),r&&e.jsx(h.Label,{color:"black",size:"sm",className:a.default.label,children:r})]}),e.jsxs("div",{className:a.default.content,children:[e.jsxs("div",{className:a.default.header,children:[e.jsx(t.Typography,{as:"h3",defaultVariant:"headingXl",mobileVariant:"headingMd",children:d}),e.jsx(t.Typography,{as:"p",defaultVariant:"bodySm",children:o})]}),e.jsx("div",{className:a.default.features,children:m.map((s,l)=>e.jsxs("div",{className:a.default.feature,children:[e.jsx(y.TypeBadge,{type:s.type},l),e.jsx(t.Typography,{as:"span",defaultVariant:"bodyMd",className:a.default.featureLabel,children:s.label})]},`${s.label}-${l}`))}),e.jsx("div",{className:a.default.divider}),e.jsx(t.Typography,{defaultVariant:"bodyLg",mobileVariant:"bodyMd",emphasis:!0,children:p}),e.jsx("div",{className:c.cn(a.default.actions,a.default.desktop),children:i.map((s,l)=>e.jsx(n.Button,{...s,size:"lg",children:s.label},l))}),e.jsx("div",{className:c.cn(a.default.actions,a.default.mobile),children:i.map((s,l)=>e.jsx(n.Button,{...s,size:"md",children:s.label},l))})]})]});exports.ProductListing=g;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("../../types/analytics/analytics.cjs.js"),o=require("../../utils/cn/cn.cjs.js"),u=require("../Button/Button.cjs.js"),f=require("../Label/Label.cjs.js"),j=require("../TypeBadge/TypeBadge.cjs.js"),l=require("../Typography/Typography.cjs.js"),a=require("./productListing.module.css.cjs.js"),b=({name:i,description:p,image:y,price:m,buttons:c,features:h,label:n,zenpatientId:g})=>{const r=(s,t)=>({event:d.EAnalyticsEvent.ctaClicked,type:d.EAnalyticsEventType.interaction,component:"ProductListing",element:`button_${t}`,payload:{ctaLabel:s.label,productId:g,productName:i}});return e.jsxs("section",{className:a.default.root,children:[e.jsxs("div",{className:a.default.imageWrapper,children:[e.jsx("img",{src:y,alt:i,className:a.default.image}),n&&e.jsx(f.Label,{color:"black",size:"sm",className:a.default.label,children:n})]}),e.jsxs("div",{className:a.default.content,children:[e.jsxs("div",{className:a.default.header,children:[e.jsx(l.Typography,{as:"h3",defaultVariant:"headingXl",mobileVariant:"headingMd",children:i}),e.jsx(l.Typography,{as:"p",defaultVariant:"bodySm",children:p})]}),e.jsx("div",{className:a.default.features,children:h.map((s,t)=>e.jsxs("div",{className:a.default.feature,children:[e.jsx(j.TypeBadge,{type:s.type},t),e.jsx(l.Typography,{as:"span",defaultVariant:"bodyMd",className:a.default.featureLabel,children:s.label})]},`${s.label}-${t}`))}),e.jsx("div",{className:a.default.divider}),e.jsx(l.Typography,{defaultVariant:"bodyLg",mobileVariant:"bodyMd",emphasis:!0,children:m}),e.jsx("div",{className:o.cn(a.default.actions,a.default.desktop),children:c.map((s,t)=>e.jsx(u.Button,{...s,size:"lg",analyticsProps:r(s,t),children:s.label},t))}),e.jsx("div",{className:o.cn(a.default.actions,a.default.mobile),children:c.map((s,t)=>e.jsx(u.Button,{...s,size:"md",analyticsProps:r(s,t),children:s.label},t))})]})]})};exports.ProductListing=b;
@@ -14,6 +14,8 @@ type ProductListingProps = {
14
14
  label: string;
15
15
  } & ButtonProps>;
16
16
  label?: string;
17
+ zenpatientId?: string;
18
+ analyticsLocation: string;
17
19
  };
18
- export declare const ProductListing: ({ name, description, image, price, buttons, features, label }: ProductListingProps) => import("react/jsx-runtime").JSX.Element;
20
+ export declare const ProductListing: ({ name, description, image, price, buttons, features, label, zenpatientId, }: ProductListingProps) => import("react/jsx-runtime").JSX.Element;
19
21
  export {};
@@ -1,30 +1,53 @@
1
- import { jsxs as r, jsx as e } from "react/jsx-runtime";
2
- import { cn as o } from "../../utils/cn/cn.es.js";
3
- import { Button as t } from "../Button/Button.es.js";
4
- import { Label as N } from "../Label/Label.es.js";
5
- import { TypeBadge as b } from "../TypeBadge/TypeBadge.es.js";
1
+ import { jsxs as r, jsx as i } from "react/jsx-runtime";
2
+ import { EAnalyticsEventType as N, EAnalyticsEvent as b } from "../../types/analytics/analytics.es.js";
3
+ import { cn as m } from "../../utils/cn/cn.es.js";
4
+ import { Button as n } from "../Button/Button.es.js";
5
+ import { Label as g } from "../Label/Label.es.js";
6
+ import { TypeBadge as u } from "../TypeBadge/TypeBadge.es.js";
6
7
  import { Typography as s } from "../Typography/Typography.es.js";
7
8
  import a from "./productListing.module.css.es.js";
8
- const M = ({ name: d, description: n, image: p, price: h, buttons: m, features: f, label: c }) => /* @__PURE__ */ r("section", { className: a.root, children: [
9
- /* @__PURE__ */ r("div", { className: a.imageWrapper, children: [
10
- /* @__PURE__ */ e("img", { src: p, alt: d, className: a.image }),
11
- c && /* @__PURE__ */ e(N, { color: "black", size: "sm", className: a.label, children: c })
12
- ] }),
13
- /* @__PURE__ */ r("div", { className: a.content, children: [
14
- /* @__PURE__ */ r("div", { className: a.header, children: [
15
- /* @__PURE__ */ e(s, { as: "h3", defaultVariant: "headingXl", mobileVariant: "headingMd", children: d }),
16
- /* @__PURE__ */ e(s, { as: "p", defaultVariant: "bodySm", children: n })
9
+ const T = ({
10
+ name: t,
11
+ description: p,
12
+ image: h,
13
+ price: y,
14
+ buttons: c,
15
+ features: f,
16
+ label: d,
17
+ zenpatientId: v
18
+ }) => {
19
+ const o = (e, l) => ({
20
+ event: b.ctaClicked,
21
+ type: N.interaction,
22
+ component: "ProductListing",
23
+ element: `button_${l}`,
24
+ payload: {
25
+ ctaLabel: e.label,
26
+ productId: v,
27
+ productName: t
28
+ }
29
+ });
30
+ return /* @__PURE__ */ r("section", { className: a.root, children: [
31
+ /* @__PURE__ */ r("div", { className: a.imageWrapper, children: [
32
+ /* @__PURE__ */ i("img", { src: h, alt: t, className: a.image }),
33
+ d && /* @__PURE__ */ i(g, { color: "black", size: "sm", className: a.label, children: d })
17
34
  ] }),
18
- /* @__PURE__ */ e("div", { className: a.features, children: f.map((i, l) => /* @__PURE__ */ r("div", { className: a.feature, children: [
19
- /* @__PURE__ */ e(b, { type: i.type }, l),
20
- /* @__PURE__ */ e(s, { as: "span", defaultVariant: "bodyMd", className: a.featureLabel, children: i.label })
21
- ] }, `${i.label}-${l}`)) }),
22
- /* @__PURE__ */ e("div", { className: a.divider }),
23
- /* @__PURE__ */ e(s, { defaultVariant: "bodyLg", mobileVariant: "bodyMd", emphasis: !0, children: h }),
24
- /* @__PURE__ */ e("div", { className: o(a.actions, a.desktop), children: m.map((i, l) => /* @__PURE__ */ e(t, { ...i, size: "lg", children: i.label }, l)) }),
25
- /* @__PURE__ */ e("div", { className: o(a.actions, a.mobile), children: m.map((i, l) => /* @__PURE__ */ e(t, { ...i, size: "md", children: i.label }, l)) })
26
- ] })
27
- ] });
35
+ /* @__PURE__ */ r("div", { className: a.content, children: [
36
+ /* @__PURE__ */ r("div", { className: a.header, children: [
37
+ /* @__PURE__ */ i(s, { as: "h3", defaultVariant: "headingXl", mobileVariant: "headingMd", children: t }),
38
+ /* @__PURE__ */ i(s, { as: "p", defaultVariant: "bodySm", children: p })
39
+ ] }),
40
+ /* @__PURE__ */ i("div", { className: a.features, children: f.map((e, l) => /* @__PURE__ */ r("div", { className: a.feature, children: [
41
+ /* @__PURE__ */ i(u, { type: e.type }, l),
42
+ /* @__PURE__ */ i(s, { as: "span", defaultVariant: "bodyMd", className: a.featureLabel, children: e.label })
43
+ ] }, `${e.label}-${l}`)) }),
44
+ /* @__PURE__ */ i("div", { className: a.divider }),
45
+ /* @__PURE__ */ i(s, { defaultVariant: "bodyLg", mobileVariant: "bodyMd", emphasis: !0, children: y }),
46
+ /* @__PURE__ */ i("div", { className: m(a.actions, a.desktop), children: c.map((e, l) => /* @__PURE__ */ i(n, { ...e, size: "lg", analyticsProps: o(e, l), children: e.label }, l)) }),
47
+ /* @__PURE__ */ i("div", { className: m(a.actions, a.mobile), children: c.map((e, l) => /* @__PURE__ */ i(n, { ...e, size: "md", analyticsProps: o(e, l), children: e.label }, l)) })
48
+ ] })
49
+ ] });
50
+ };
28
51
  export {
29
- M as ProductListing
52
+ T as ProductListing
30
53
  };
@@ -1 +1 @@
1
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),G=require("../../components/Button/Button.cjs.js"),p=require("../../components/Typography/Typography.cjs.js"),M=require("../../components/Icon/Icon.cjs.js"),A=require("../../components/Icon/constants.cjs.js"),R=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),a=require("../../node_modules/gsap/index.cjs.js"),K=require("../../node_modules/@gsap/react/src/index.cjs.js"),C=require("../../node_modules/gsap/ScrollTrigger.cjs.js"),J=require("../../utils/debounce.cjs.js"),t=require("./callToAction.module.css.cjs.js");a.gsap.registerPlugin(C.ScrollTrigger);const Q=({subtitle:k,titleTop:P,scrollableLabels:v,titleBottom:B,description:W,hsaText:$,buttonText:O,buttonLink:h,backgroundImage:X})=>{const o=l.useRef(null),i=l.useRef(null),T=l.useRef(null),g=l.useRef(null),m=l.useRef(null),N=l.useRef(null),y=l.useRef(null),b=l.useRef(null),x=l.useRef(null);return K.useGSAP(()=>{var V,w,I;const u=o.current&&o.current.getBoundingClientRect().top<window.innerHeight*.8,d=(V=T.current)==null?void 0:V.querySelector("p"),q=(w=N.current)==null?void 0:w.querySelector("p"),z=[d,g.current,i.current,m.current,q,y.current,b.current,x.current].filter(Boolean);a.gsap.set(z,{clipPath:"inset(0% 0% 100% 0%)",yPercent:100});const f=a.gsap.to([d,g.current,i.current,m.current,q,y.current,b.current,x.current],{clipPath:"inset(0% 0% 0% 0%)",yPercent:0,duration:1,ease:"power2.out",delay:.3,stagger:{amount:1,from:"start"},paused:!0});C.ScrollTrigger.create({trigger:o.current,start:"top 80%",end:"+=500",onEnter:()=>f.play(),onEnterBack:()=>f.play(),onLeaveBack:()=>f.reverse()}),u&&a.gsap.delayedCall(.1,()=>{f.play()});const r=(I=i.current)==null?void 0:I.querySelector("ul");if(!r)return;const _=r.innerHTML;let n=null,H=!0;const S=()=>{n&&n.kill(),r.innerHTML=_,a.gsap.set(r,{y:0});const s=Array.from(r.querySelectorAll("li"));if(s.length<=1)return;const j=s[0].clientHeight;if(!j)return;a.gsap.set(i.current,{height:()=>j,overflow:"hidden"});const L=Array.from(s);L.forEach(E=>{r.appendChild(E.cloneNode(!0))});const F=H&&!u?.3:0;n=a.gsap.timeline({repeat:-1,delay:F,onRepeat:()=>{a.gsap.set(r,{y:0})}}),L.forEach((E,D)=>{n&&n.to({},{duration:2}).to(r,{y:`-${(D+1)*j}`,duration:.5,ease:"power1.inOut"})}),H=!1},c=J.default(S,200);return S(),window.addEventListener("resize",c),()=>{var s;window.removeEventListener("resize",c),(s=c.kill)==null||s.call(c),n&&n.kill(),r&&(r.innerHTML=_,a.gsap.set(r,{y:0}))}},[v]),e.jsxs("section",{ref:o,className:t.default.root,children:[e.jsx("div",{className:t.default.backgroundImage,style:{backgroundImage:`url(${X})`}}),e.jsxs("div",{className:t.default.container,children:[e.jsx("div",{className:t.default.leftContent,children:e.jsxs("div",{className:t.default.content,children:[e.jsx("div",{ref:g,children:e.jsx(R.HighlightedTitle,{defaultVariant:"displayXl",mobileVariant:"displayMd",as:"div",className:t.default.title,title:P})}),e.jsx("div",{ref:i,className:t.default.scrollableLabelsWrapper,children:e.jsx("ul",{className:t.default.scrollableLabels,children:v.map((u,d)=>e.jsx("li",{className:t.default.scrollableLabel,children:e.jsx(p.Typography,{defaultVariant:"displayXl",mobileVariant:"displayMd",as:"span",children:u})},d))})}),e.jsx("div",{ref:m,children:e.jsx(R.HighlightedTitle,{defaultVariant:"displayXl",mobileVariant:"displayMd",as:"div",className:t.default.title,title:B})})]})}),e.jsx("div",{ref:T,className:t.default.subtitleWrapper,children:e.jsx(R.HighlightedTitle,{defaultVariant:"labelMd",mobileVariant:"labelSm",as:"div",className:t.default.subtitle,title:k})}),e.jsx("div",{ref:N,className:t.default.arrowWrapper,children:e.jsxs(p.Typography,{defaultVariant:"labelMd",mobileVariant:"labelXs",emphasis:!0,className:t.default.arrow,as:"p",children:["(",e.jsx(M.Icon,{name:A.EIconName.ARROW_FORWARD}),")"]})}),e.jsx("div",{className:t.default.rightContent,children:e.jsxs("div",{className:t.default.descriptionWrapper,children:[e.jsx("div",{ref:y,children:e.jsx(p.Typography,{as:"p",defaultVariant:"bodyLg",mobileVariant:"bodyMd",className:t.default.description,children:W})}),e.jsx("div",{ref:b,className:t.default.buttonWrapper,children:h&&e.jsx(G.Button,{as:h?"a":"button",href:h,variant:"secondary",size:"lg",children:O})}),e.jsxs("div",{ref:x,className:t.default.hsaEligible,children:[e.jsx(M.Icon,{name:A.EIconName.CIRCLE_CHECK_FILL,className:t.default.checkIcon}),e.jsx(p.Typography,{as:"p",defaultVariant:"bodySm",mobileVariant:"bodySm",className:t.default.hsaText,children:$})]})]})})]})]})};exports.CallToAction=Q;
1
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),J=require("../../components/Button/Button.cjs.js"),m=require("../../components/Typography/Typography.cjs.js"),I=require("../../components/Icon/Icon.cjs.js"),k=require("../../components/Icon/constants.cjs.js"),j=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),a=require("../../node_modules/gsap/index.cjs.js"),Q=require("../../node_modules/@gsap/react/src/index.cjs.js"),M=require("../../node_modules/gsap/ScrollTrigger.cjs.js"),U=require("../../utils/debounce.cjs.js"),t=require("./callToAction.module.css.cjs.js"),L=require("../../types/analytics/analytics.cjs.js");a.gsap.registerPlugin(M.ScrollTrigger);const Y=({subtitle:B,titleTop:P,scrollableLabels:R,titleBottom:W,description:$,hsaText:O,buttonText:X,buttonLink:u,backgroundImage:z})=>{const d=r.useRef(null),c=r.useRef(null),T=r.useRef(null),h=r.useRef(null),g=r.useRef(null),N=r.useRef(null),y=r.useRef(null),b=r.useRef(null),v=r.useRef(null),F=()=>{var n;(n=window.eventBus)==null||n.emit("analytics",{event:L.EAnalyticsEvent.ctaClicked,type:L.EAnalyticsEventType.interaction,component:"CallToAction",element:"primary_button",payload:{link:u}})};return Q.useGSAP(()=>{var C,H,S;const n=d.current&&d.current.getBoundingClientRect().top<window.innerHeight*.8,p=(C=T.current)==null?void 0:C.querySelector("p"),q=(H=N.current)==null?void 0:H.querySelector("p"),D=[p,h.current,c.current,g.current,q,y.current,b.current,v.current].filter(Boolean);a.gsap.set(D,{clipPath:"inset(0% 0% 100% 0%)",yPercent:100});const f=a.gsap.to([p,h.current,c.current,g.current,q,y.current,b.current,v.current],{clipPath:"inset(0% 0% 0% 0%)",yPercent:0,duration:1,ease:"power2.out",delay:.3,stagger:{amount:1,from:"start"},paused:!0});M.ScrollTrigger.create({trigger:d.current,start:"top 80%",end:"+=500",onEnter:()=>f.play(),onEnterBack:()=>f.play(),onLeaveBack:()=>f.reverse()}),n&&a.gsap.delayedCall(.1,()=>{f.play()});const l=(S=c.current)==null?void 0:S.querySelector("ul");if(!l)return;const _=l.innerHTML;let s=null,w=!0;const E=()=>{s&&s.kill(),l.innerHTML=_,a.gsap.set(l,{y:0});const i=Array.from(l.querySelectorAll("li"));if(i.length<=1)return;const x=i[0].clientHeight;if(!x)return;a.gsap.set(c.current,{height:()=>x,overflow:"hidden"});const V=Array.from(i);V.forEach(A=>{l.appendChild(A.cloneNode(!0))});const G=w&&!n?.3:0;s=a.gsap.timeline({repeat:-1,delay:G,onRepeat:()=>{a.gsap.set(l,{y:0})}}),V.forEach((A,K)=>{s&&s.to({},{duration:2}).to(l,{y:`-${(K+1)*x}`,duration:.5,ease:"power1.inOut"})}),w=!1},o=U.default(E,200);return E(),window.addEventListener("resize",o),()=>{var i;window.removeEventListener("resize",o),(i=o.kill)==null||i.call(o),s&&s.kill(),l&&(l.innerHTML=_,a.gsap.set(l,{y:0}))}},[R]),e.jsxs("section",{ref:d,className:t.default.root,children:[e.jsx("div",{className:t.default.backgroundImage,style:{backgroundImage:`url(${z})`}}),e.jsxs("div",{className:t.default.container,children:[e.jsx("div",{className:t.default.leftContent,children:e.jsxs("div",{className:t.default.content,children:[e.jsx("div",{ref:h,children:e.jsx(j.HighlightedTitle,{defaultVariant:"displayXl",mobileVariant:"displayMd",as:"div",className:t.default.title,title:P})}),e.jsx("div",{ref:c,className:t.default.scrollableLabelsWrapper,children:e.jsx("ul",{className:t.default.scrollableLabels,children:R.map((n,p)=>e.jsx("li",{className:t.default.scrollableLabel,children:e.jsx(m.Typography,{defaultVariant:"displayXl",mobileVariant:"displayMd",as:"span",children:n})},p))})}),e.jsx("div",{ref:g,children:e.jsx(j.HighlightedTitle,{defaultVariant:"displayXl",mobileVariant:"displayMd",as:"div",className:t.default.title,title:W})})]})}),e.jsx("div",{ref:T,className:t.default.subtitleWrapper,children:e.jsx(j.HighlightedTitle,{defaultVariant:"labelMd",mobileVariant:"labelSm",as:"div",className:t.default.subtitle,title:B})}),e.jsx("div",{ref:N,className:t.default.arrowWrapper,children:e.jsxs(m.Typography,{defaultVariant:"labelMd",mobileVariant:"labelXs",emphasis:!0,className:t.default.arrow,as:"p",children:["(",e.jsx(I.Icon,{name:k.EIconName.ARROW_FORWARD}),")"]})}),e.jsx("div",{className:t.default.rightContent,children:e.jsxs("div",{className:t.default.descriptionWrapper,children:[e.jsx("div",{ref:y,children:e.jsx(m.Typography,{as:"p",defaultVariant:"bodyLg",mobileVariant:"bodyMd",className:t.default.description,children:$})}),e.jsx("div",{ref:b,className:t.default.buttonWrapper,children:u&&e.jsx(J.Button,{as:u?"a":"button",href:u,variant:"secondary",size:"lg",onClick:F,children:X})}),e.jsxs("div",{ref:v,className:t.default.hsaEligible,children:[e.jsx(I.Icon,{name:k.EIconName.CIRCLE_CHECK_FILL,className:t.default.checkIcon}),e.jsx(m.Typography,{as:"p",defaultVariant:"bodySm",mobileVariant:"bodySm",className:t.default.hsaText,children:O})]})]})})]})]})};exports.CallToAction=Y;