@zenpatient-org/healthspan-marketing-ui 0.1.168 → 0.1.170

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 (59) 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 +5 -1
  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/healthspan-marketing-ui.css +1 -1
  19. package/dist/modules/CallToAction/CallToAction.cjs.js +1 -1
  20. package/dist/modules/CallToAction/CallToAction.es.js +86 -73
  21. package/dist/modules/Callback/Callback.cjs.js +1 -1
  22. package/dist/modules/Callback/Callback.d.ts +3 -1
  23. package/dist/modules/Callback/Callback.es.js +46 -24
  24. package/dist/modules/Claims/Claims.cjs.js +1 -0
  25. package/dist/modules/Claims/Claims.es.js +35 -0
  26. package/dist/modules/Claims/claims.module.css.cjs.js +1 -0
  27. package/dist/modules/Claims/claims.module.css.es.js +19 -0
  28. package/dist/modules/Compare/Compare.cjs.js +1 -1
  29. package/dist/modules/Compare/Compare.es.js +12 -12
  30. package/dist/modules/FeaturedIn/FeaturedIn.cjs.js +1 -1
  31. package/dist/modules/FeaturedIn/FeaturedIn.es.js +23 -32
  32. package/dist/modules/FeaturedIn/components/CtaFeaturedIn.cjs.js +1 -0
  33. package/dist/modules/FeaturedIn/components/CtaFeaturedIn.d.ts +5 -0
  34. package/dist/modules/FeaturedIn/components/CtaFeaturedIn.es.js +22 -0
  35. package/dist/modules/HowItWorks/HowItWorks.cjs.js +1 -1
  36. package/dist/modules/HowItWorks/HowItWorks.es.js +61 -30
  37. package/dist/modules/ImageWithBenefits/ImageWithBenefits.cjs.js +1 -0
  38. package/dist/modules/ImageWithBenefits/ImageWithBenefits.d.ts +25 -0
  39. package/dist/modules/ImageWithBenefits/ImageWithBenefits.es.js +52 -0
  40. package/dist/modules/ImageWithBenefits/imageWithBenefits.module.css.cjs.js +1 -0
  41. package/dist/modules/ImageWithBenefits/imageWithBenefits.module.css.es.js +27 -0
  42. package/dist/modules/ImageWithBenefits/index.d.ts +1 -0
  43. package/dist/modules/IndividualProductCard/IndividualProductCard.cjs.js +1 -1
  44. package/dist/modules/IndividualProductCard/IndividualProductCard.d.ts +8 -3
  45. package/dist/modules/IndividualProductCard/IndividualProductCard.es.js +98 -67
  46. package/dist/modules/ProgramsDetailsHero/ProgramsDetailsHero.cjs.js +1 -1
  47. package/dist/modules/ProgramsDetailsHero/ProgramsDetailsHero.es.js +38 -26
  48. package/dist/modules/YourProtocol/YourProtocol.cjs.js +1 -1
  49. package/dist/modules/YourProtocol/YourProtocol.es.js +48 -35
  50. package/dist/pageComponents/HomepageHero/HomepageHero.cjs.js +1 -1
  51. package/dist/pageComponents/HomepageHero/HomepageHero.es.js +19 -28
  52. package/dist/pageComponents/LabsHero/LabsHero.cjs.js +1 -1
  53. package/dist/pageComponents/LabsHero/LabsHero.es.js +54 -43
  54. package/dist/pageComponents/PersonalizedProtocolHero/PersonalizedProtocolHero.cjs.js +1 -1
  55. package/dist/pageComponents/PersonalizedProtocolHero/PersonalizedProtocolHero.es.js +73 -60
  56. package/dist/types/analytics/analytics.cjs.js +1 -1
  57. package/dist/types/analytics/analytics.es.js +3 -3
  58. package/dist/types/analytics.d.ts +26 -3
  59. package/package.json +11 -1
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../components/Typography/Typography.cjs.js"),o=require("../../components/Button/Button.cjs.js"),a=require("./programsDetailsHero.module.css.cjs.js"),d=({title:t,description:i,button:r,backgroundImage:l})=>e.jsx("section",{className:a.default.root,"data-type":"hero",style:{backgroundImage:`url(${l})`},children:e.jsx("div",{className:a.default.container,children:e.jsxs("div",{className:a.default.headline,children:[e.jsx("div",{className:a.default.titleContainer,children:e.jsx(s.Typography,{className:a.default.title,as:"h2",defaultVariant:"displayMd",mobileVariant:"headingXl",children:t})}),e.jsx("div",{className:a.default.midBorder}),e.jsx("div",{className:a.default.infoContainer,children:e.jsxs("div",{className:a.default.infoBox,children:[e.jsx(s.Typography,{className:a.default.description,as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",children:i}),e.jsx(o.Button,{as:"a",href:r.link,variant:"secondary",size:"md",children:r.text})]})})]})})});exports.ProgramsDetailsHero=d;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../components/Typography/Typography.cjs.js"),c=require("../../components/Button/Button.cjs.js"),a=require("./programsDetailsHero.module.css.cjs.js"),r=require("../../types/analytics/analytics.cjs.js"),d=({title:i,description:n,button:t,backgroundImage:l})=>{const o={event:r.EAnalyticsEvent.ctaClicked,type:r.EAnalyticsEventType.interaction,component:"ProgramsDetailsHero",payload:{ctaLink:t.link,ctaLabel:t.text}};return e.jsx("section",{className:a.default.root,"data-type":"hero",style:{backgroundImage:`url(${l})`},children:e.jsx("div",{className:a.default.container,children:e.jsxs("div",{className:a.default.headline,children:[e.jsx("div",{className:a.default.titleContainer,children:e.jsx(s.Typography,{className:a.default.title,as:"h2",defaultVariant:"displayMd",mobileVariant:"headingXl",children:i})}),e.jsx("div",{className:a.default.midBorder}),e.jsx("div",{className:a.default.infoContainer,children:e.jsxs("div",{className:a.default.infoBox,children:[e.jsx(s.Typography,{className:a.default.description,as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",children:n}),e.jsx(c.Button,{as:"a",href:t.link,variant:"secondary",size:"md",analyticsProps:o,children:t.text})]})})]})})})};exports.ProgramsDetailsHero=d;
@@ -1,33 +1,45 @@
1
1
  import { jsx as e, jsxs as r } from "react/jsx-runtime";
2
- import { Typography as s } from "../../components/Typography/Typography.es.js";
3
- import { Button as o } from "../../components/Button/Button.es.js";
2
+ import { Typography as t } from "../../components/Typography/Typography.es.js";
3
+ import { Button as c } from "../../components/Button/Button.es.js";
4
4
  import a from "./programsDetailsHero.module.css.es.js";
5
- const p = ({ title: l, description: d, button: i, backgroundImage: n }) => /* @__PURE__ */ e("section", { className: a.root, "data-type": "hero", style: { backgroundImage: `url(${n})` }, children: /* @__PURE__ */ e("div", { className: a.container, children: /* @__PURE__ */ r("div", { className: a.headline, children: [
6
- /* @__PURE__ */ e("div", { className: a.titleContainer, children: /* @__PURE__ */ e(
7
- s,
8
- {
9
- className: a.title,
10
- as: "h2",
11
- defaultVariant: "displayMd",
12
- mobileVariant: "headingXl",
13
- children: l
5
+ import { EAnalyticsEventType as d, EAnalyticsEvent as m } from "../../types/analytics/analytics.es.js";
6
+ const N = ({ title: n, description: s, button: i, backgroundImage: l }) => {
7
+ const o = {
8
+ event: m.ctaClicked,
9
+ type: d.interaction,
10
+ component: "ProgramsDetailsHero",
11
+ payload: {
12
+ ctaLink: i.link,
13
+ ctaLabel: i.text
14
14
  }
15
- ) }),
16
- /* @__PURE__ */ e("div", { className: a.midBorder }),
17
- /* @__PURE__ */ e("div", { className: a.infoContainer, children: /* @__PURE__ */ r("div", { className: a.infoBox, children: [
18
- /* @__PURE__ */ e(
19
- s,
15
+ };
16
+ return /* @__PURE__ */ e("section", { className: a.root, "data-type": "hero", style: { backgroundImage: `url(${l})` }, children: /* @__PURE__ */ e("div", { className: a.container, children: /* @__PURE__ */ r("div", { className: a.headline, children: [
17
+ /* @__PURE__ */ e("div", { className: a.titleContainer, children: /* @__PURE__ */ e(
18
+ t,
20
19
  {
21
- className: a.description,
22
- as: "p",
23
- defaultVariant: "bodyMd",
24
- mobileVariant: "bodySm",
25
- children: d
20
+ className: a.title,
21
+ as: "h2",
22
+ defaultVariant: "displayMd",
23
+ mobileVariant: "headingXl",
24
+ children: n
26
25
  }
27
- ),
28
- /* @__PURE__ */ e(o, { as: "a", href: i.link, variant: "secondary", size: "md", children: i.text })
29
- ] }) })
30
- ] }) }) });
26
+ ) }),
27
+ /* @__PURE__ */ e("div", { className: a.midBorder }),
28
+ /* @__PURE__ */ e("div", { className: a.infoContainer, children: /* @__PURE__ */ r("div", { className: a.infoBox, children: [
29
+ /* @__PURE__ */ e(
30
+ t,
31
+ {
32
+ className: a.description,
33
+ as: "p",
34
+ defaultVariant: "bodyMd",
35
+ mobileVariant: "bodySm",
36
+ children: s
37
+ }
38
+ ),
39
+ /* @__PURE__ */ e(c, { as: "a", href: i.link, variant: "secondary", size: "md", analyticsProps: o, children: i.text })
40
+ ] }) })
41
+ ] }) }) });
42
+ };
31
43
  export {
32
- p as ProgramsDetailsHero
44
+ N as ProgramsDetailsHero
33
45
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../components/Callback/Callback.cjs.js"),a=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),n=require("../../utils/cn/cn.cjs.js"),c=require("./components/ProtocolTags/ProtocolTags.cjs.js"),o=require("./yourProtocol.module.css.cjs.js"),d=({title:s,image:r,tags:i,callbackView:t})=>e.jsx("section",{className:o.default.root,children:e.jsxs("div",{className:o.default.container,children:[e.jsxs("div",{className:o.default.content,children:[e.jsx(a.HighlightedTitle,{title:s,className:o.default.title,defaultVariant:"displaySm",mobileVariant:"headingXl"}),e.jsx(c.ProtocolTags,{tags:i}),t&&e.jsx("div",{className:o.default.callback,children:e.jsx(l.Callback,{title:t.title,description:t.description??"",price:t.price??"",image:t.image,button:{href:t.signupUrl??"",as:"a"},size:"sm",shape:t.shape})})]}),e.jsx("img",{src:r,alt:"Your Protocol",className:n.cn(o.default.image,o.default.desktop),width:481})]})});exports.YourProtocol=d;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../components/Callback/Callback.cjs.js"),c=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),u=require("../../utils/cn/cn.cjs.js"),d=require("./components/ProtocolTags/ProtocolTags.cjs.js"),o=require("./yourProtocol.module.css.cjs.js"),s=require("../../types/analytics/analytics.cjs.js"),m=({title:r,image:n,tags:i,callbackView:t})=>{const a={event:s.EAnalyticsEvent.ctaClicked,type:s.EAnalyticsEventType.interaction,component:"YourProtocol",element:"Callback",payload:{ctaLink:(t==null?void 0:t.signupUrl)??""}};return e.jsx("section",{className:o.default.root,children:e.jsxs("div",{className:o.default.container,children:[e.jsxs("div",{className:o.default.content,children:[e.jsx(c.HighlightedTitle,{title:r,className:o.default.title,defaultVariant:"displaySm",mobileVariant:"headingXl"}),e.jsx(d.ProtocolTags,{tags:i}),t&&e.jsx("div",{className:o.default.callback,children:e.jsx(l.Callback,{title:t.title,description:t.description??"",price:t.price??"",image:t.image,button:{href:t.signupUrl??"",as:"a",analyticsProps:a},size:"sm",shape:t.shape})})]}),e.jsx("img",{src:n,alt:"Your Protocol",className:u.cn(o.default.image,o.default.desktop),width:481})]})})};exports.YourProtocol=m;
@@ -1,39 +1,52 @@
1
- import { jsx as r, jsxs as i } from "react/jsx-runtime";
1
+ import { jsx as r, jsxs as e } from "react/jsx-runtime";
2
2
  import { Callback as a } from "../../components/Callback/Callback.es.js";
3
- import { HighlightedTitle as n } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
4
- import { cn as l } from "../../utils/cn/cn.es.js";
5
- import { ProtocolTags as p } from "./components/ProtocolTags/ProtocolTags.es.js";
3
+ import { HighlightedTitle as p } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
4
+ import { cn as d } from "../../utils/cn/cn.es.js";
5
+ import { ProtocolTags as l } from "./components/ProtocolTags/ProtocolTags.es.js";
6
6
  import o from "./yourProtocol.module.css.es.js";
7
- const N = ({ title: s, image: e, tags: m, callbackView: t }) => /* @__PURE__ */ r("section", { className: o.root, children: /* @__PURE__ */ i("div", { className: o.container, children: [
8
- /* @__PURE__ */ i("div", { className: o.content, children: [
9
- /* @__PURE__ */ r(
10
- n,
11
- {
12
- title: s,
13
- className: o.title,
14
- defaultVariant: "displaySm",
15
- mobileVariant: "headingXl"
16
- }
17
- ),
18
- /* @__PURE__ */ r(p, { tags: m }),
19
- t && /* @__PURE__ */ r("div", { className: o.callback, children: /* @__PURE__ */ r(
20
- a,
21
- {
22
- title: t.title,
23
- description: t.description ?? "",
24
- price: t.price ?? "",
25
- image: t.image,
26
- button: {
27
- href: t.signupUrl ?? "",
28
- as: "a"
29
- },
30
- size: "sm",
31
- shape: t.shape
32
- }
33
- ) })
34
- ] }),
35
- /* @__PURE__ */ r("img", { src: e, alt: "Your Protocol", className: l(o.image, o.desktop), width: 481 })
36
- ] }) });
7
+ import { EAnalyticsEventType as c, EAnalyticsEvent as h } from "../../types/analytics/analytics.es.js";
8
+ const P = ({ title: i, image: s, tags: n, callbackView: t }) => {
9
+ const m = {
10
+ event: h.ctaClicked,
11
+ type: c.interaction,
12
+ component: "YourProtocol",
13
+ element: "Callback",
14
+ payload: {
15
+ ctaLink: (t == null ? void 0 : t.signupUrl) ?? ""
16
+ }
17
+ };
18
+ return /* @__PURE__ */ r("section", { className: o.root, children: /* @__PURE__ */ e("div", { className: o.container, children: [
19
+ /* @__PURE__ */ e("div", { className: o.content, children: [
20
+ /* @__PURE__ */ r(
21
+ p,
22
+ {
23
+ title: i,
24
+ className: o.title,
25
+ defaultVariant: "displaySm",
26
+ mobileVariant: "headingXl"
27
+ }
28
+ ),
29
+ /* @__PURE__ */ r(l, { tags: n }),
30
+ t && /* @__PURE__ */ r("div", { className: o.callback, children: /* @__PURE__ */ r(
31
+ a,
32
+ {
33
+ title: t.title,
34
+ description: t.description ?? "",
35
+ price: t.price ?? "",
36
+ image: t.image,
37
+ button: {
38
+ href: t.signupUrl ?? "",
39
+ as: "a",
40
+ analyticsProps: m
41
+ },
42
+ size: "sm",
43
+ shape: t.shape
44
+ }
45
+ ) })
46
+ ] }),
47
+ /* @__PURE__ */ r("img", { src: s, alt: "Your Protocol", className: d(o.image, o.desktop), width: 481 })
48
+ ] }) });
49
+ };
37
50
  export {
38
- N as YourProtocol
51
+ P as YourProtocol
39
52
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),t=require("../../components/Typography/Typography.cjs.js"),i=require("../../components/Button/Button.cjs.js"),n=require("./components/MiddleCarousel/MiddleCarousel.cjs.js"),o=require("../../utils/cn/cn.cjs.js"),a=require("./homepageHero.module.css.cjs.js");function s(){return e.jsxs("section",{className:a.default.root,"data-type":"hero",children:[e.jsx("div",{className:a.default.carouselArea,children:e.jsx(n.MiddleCarousel,{})}),e.jsxs("div",{className:a.default.contentContainer,children:[e.jsx("div",{className:a.default.headline,children:e.jsx(r.HighlightedTitle,{colorScheme:"dark",title:e.jsx(t.Typography,{as:"div",defaultVariant:"displayXs",mobileVariant:"headingLg",children:e.jsxs("p",{children:[e.jsx("b",{children:"Transform your quality of living"})," through the science of aging."]})})})}),e.jsxs("div",{className:a.default.callAction,children:[e.jsx(t.Typography,{as:"p",defaultVariant:"bodyLg",mobileVariant:"bodySm",className:a.default.text,children:"Defy your age with advanced longevity protocols tailored to you by clinical experts and optimized over time through ongoing labs, performance coaching, and results tracking."}),e.jsx("div",{className:o.cn(a.default.buttonWrapper,a.default.desktop),children:e.jsx(i.Button,{as:"a",href:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",variant:"secondary",size:"lg",children:"Join Healthspan"})}),e.jsx("div",{className:o.cn(a.default.buttonWrapper,a.default.mobile),children:e.jsx(i.Button,{as:"a",href:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",variant:"secondary",size:"md",children:"Join Healthspan"})})]})]})]})}exports.HomepageHero=s;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),i=require("../../components/Typography/Typography.cjs.js"),o=require("../../components/Button/Button.cjs.js"),c=require("./components/MiddleCarousel/MiddleCarousel.cjs.js"),s=require("../../utils/cn/cn.cjs.js"),a=require("./homepageHero.module.css.cjs.js"),r=require("../../types/analytics/analytics.cjs.js");function d(){const t="https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",n={event:r.EAnalyticsEvent.ctaClicked,type:r.EAnalyticsEventType.interaction,component:"HomepageHero",payload:{ctaLink:t}};return e.jsxs("section",{className:a.default.root,"data-type":"hero",children:[e.jsx("div",{className:a.default.carouselArea,children:e.jsx(c.MiddleCarousel,{})}),e.jsxs("div",{className:a.default.contentContainer,children:[e.jsx("div",{className:a.default.headline,children:e.jsx(l.HighlightedTitle,{colorScheme:"dark",title:e.jsx(i.Typography,{as:"div",defaultVariant:"displayXs",mobileVariant:"headingLg",children:e.jsxs("p",{children:[e.jsx("b",{children:"Transform your quality of living"})," through the science of aging."]})})})}),e.jsxs("div",{className:a.default.callAction,children:[e.jsx(i.Typography,{as:"p",defaultVariant:"bodyLg",mobileVariant:"bodySm",className:a.default.text,children:"Defy your age with advanced longevity protocols tailored to you by clinical experts and optimized over time through ongoing labs, performance coaching, and results tracking."}),e.jsx("div",{className:s.cn(a.default.buttonWrapper,a.default.desktop),children:e.jsx(o.Button,{as:"a",href:t,variant:"secondary",size:"lg",analyticsProps:n,children:"Join Healthspan"})}),e.jsx("div",{className:s.cn(a.default.buttonWrapper,a.default.mobile),children:e.jsx(o.Button,{as:"a",href:t,variant:"secondary",size:"md",analyticsProps:n,children:"Join Healthspan"})})]})]})]})}exports.HomepageHero=d;
@@ -1,16 +1,25 @@
1
1
  import { jsxs as i, jsx as e } from "react/jsx-runtime";
2
- import { HighlightedTitle as n } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
2
+ import { HighlightedTitle as c } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
3
3
  import { Typography as r } from "../../components/Typography/Typography.es.js";
4
- import { Button as o } from "../../components/Button/Button.es.js";
5
- import { MiddleCarousel as l } from "./components/MiddleCarousel/MiddleCarousel.es.js";
6
- import { cn as t } from "../../utils/cn/cn.es.js";
4
+ import { Button as n } from "../../components/Button/Button.es.js";
5
+ import { MiddleCarousel as s } from "./components/MiddleCarousel/MiddleCarousel.es.js";
6
+ import { cn as l } from "../../utils/cn/cn.es.js";
7
7
  import a from "./homepageHero.module.css.es.js";
8
- function u() {
8
+ import { EAnalyticsEventType as d, EAnalyticsEvent as p } from "../../types/analytics/analytics.es.js";
9
+ function N() {
10
+ const t = "https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948", o = {
11
+ event: p.ctaClicked,
12
+ type: d.interaction,
13
+ component: "HomepageHero",
14
+ payload: {
15
+ ctaLink: t
16
+ }
17
+ };
9
18
  return /* @__PURE__ */ i("section", { className: a.root, "data-type": "hero", children: [
10
- /* @__PURE__ */ e("div", { className: a.carouselArea, children: /* @__PURE__ */ e(l, {}) }),
19
+ /* @__PURE__ */ e("div", { className: a.carouselArea, children: /* @__PURE__ */ e(s, {}) }),
11
20
  /* @__PURE__ */ i("div", { className: a.contentContainer, children: [
12
21
  /* @__PURE__ */ e("div", { className: a.headline, children: /* @__PURE__ */ e(
13
- n,
22
+ c,
14
23
  {
15
24
  colorScheme: "dark",
16
25
  title: /* @__PURE__ */ e(r, { as: "div", defaultVariant: "displayXs", mobileVariant: "headingLg", children: /* @__PURE__ */ i("p", { children: [
@@ -21,30 +30,12 @@ function u() {
21
30
  ) }),
22
31
  /* @__PURE__ */ i("div", { className: a.callAction, children: [
23
32
  /* @__PURE__ */ e(r, { as: "p", defaultVariant: "bodyLg", mobileVariant: "bodySm", className: a.text, children: "Defy your age with advanced longevity protocols tailored to you by clinical experts and optimized over time through ongoing labs, performance coaching, and results tracking." }),
24
- /* @__PURE__ */ e("div", { className: t(a.buttonWrapper, a.desktop), children: /* @__PURE__ */ e(
25
- o,
26
- {
27
- as: "a",
28
- href: "https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",
29
- variant: "secondary",
30
- size: "lg",
31
- children: "Join Healthspan"
32
- }
33
- ) }),
34
- /* @__PURE__ */ e("div", { className: t(a.buttonWrapper, a.mobile), children: /* @__PURE__ */ e(
35
- o,
36
- {
37
- as: "a",
38
- href: "https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",
39
- variant: "secondary",
40
- size: "md",
41
- children: "Join Healthspan"
42
- }
43
- ) })
33
+ /* @__PURE__ */ e("div", { className: l(a.buttonWrapper, a.desktop), children: /* @__PURE__ */ e(n, { as: "a", href: t, variant: "secondary", size: "lg", analyticsProps: o, children: "Join Healthspan" }) }),
34
+ /* @__PURE__ */ e("div", { className: l(a.buttonWrapper, a.mobile), children: /* @__PURE__ */ e(n, { as: "a", href: t, variant: "secondary", size: "md", analyticsProps: o, children: "Join Healthspan" }) })
44
35
  ] })
45
36
  ] })
46
37
  ] });
47
38
  }
48
39
  export {
49
- u as HomepageHero
40
+ N as HomepageHero
50
41
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../utils/cn/cn.cjs.js"),r=require("../../components/Typography/Typography.cjs.js"),i=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),l=require("../../components/Button/Button.cjs.js"),n=require("./assets/icon1.png.cjs.js"),c=require("./assets/icon2.png.cjs.js"),o=require("./assets/icon3.png.cjs.js"),d=require("./assets/img1.png.cjs.js"),u=require("./assets/img2.png.cjs.js"),m=require("./assets/img3.png.cjs.js"),g=require("./assets/svg1.svg.cjs.js"),f=require("./assets/svg2.svg.cjs.js"),h=require("./assets/svg3.svg.cjs.js"),a=require("./labsHero.module.css.cjs.js"),p=({link:s})=>e.jsx("section",{className:a.default.root,"data-type":"hero",children:e.jsxs("div",{className:a.default.container,children:[e.jsxs("div",{className:a.default.headlineContainer,children:[e.jsx("div",{className:a.default.title,children:e.jsx(i.HighlightedTitle,{as:"p",colorScheme:"dark",defaultVariant:"displayMd",mobileVariant:"displayXs",title:e.jsxs(e.Fragment,{children:["To see results, you need to ",e.jsx("b",{children:"see your results"})]})})}),e.jsx(r.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",className:a.default.description,children:"Healthspan's advanced lab panels provide precise data on 100+ biomarkers. Your dedicated clinical care team analyzes and explains the results in plain terms, helping you personalize and optimize your longevity protocol."}),e.jsx("div",{className:t.cn(a.default.buttonWrap,a.default.mobile),children:e.jsx(l.Button,{as:"a",href:s,variant:"secondary",size:"md",children:"Get Started"})}),e.jsx("div",{className:t.cn(a.default.buttonWrap,a.default.desktop),children:e.jsx(l.Button,{as:"a",href:s,variant:"secondary",size:"lg",children:"Get Started"})})]}),e.jsxs("div",{className:a.default.animationContainer,children:[e.jsx("img",{src:n.default,className:a.default.set1Icon,alt:"Image Icon"}),e.jsx("img",{src:d.default,className:a.default.set1Image,alt:"Product Image"}),e.jsx(g.default,{className:a.default.set1Svg}),e.jsx("img",{src:c.default,className:a.default.set2Icon,alt:"Image Icon"}),e.jsx("img",{src:u.default,className:a.default.set2Image,alt:"Product Image"}),e.jsx(f.default,{className:a.default.set2Svg}),e.jsx("img",{src:o.default,className:a.default.set3Icon,alt:"Image Icon"}),e.jsx("img",{src:m.default,className:a.default.set3Image,alt:"Product Image"}),e.jsx(h.default,{className:a.default.set3Svg})]})]})});exports.LabsHero=p;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../utils/cn/cn.cjs.js"),n=require("../../components/Typography/Typography.cjs.js"),c=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),r=require("../../components/Button/Button.cjs.js"),o=require("./assets/icon1.png.cjs.js"),d=require("./assets/icon2.png.cjs.js"),u=require("./assets/icon3.png.cjs.js"),m=require("./assets/img1.png.cjs.js"),g=require("./assets/img2.png.cjs.js"),p=require("./assets/img3.png.cjs.js"),f=require("./assets/svg1.svg.cjs.js"),y=require("./assets/svg2.svg.cjs.js"),h=require("./assets/svg3.svg.cjs.js"),a=require("./labsHero.module.css.cjs.js"),i=require("../../types/analytics/analytics.cjs.js"),j=({link:t})=>{const s={event:i.EAnalyticsEvent.ctaClicked,type:i.EAnalyticsEventType.interaction,component:"LabsHero",payload:{ctaLink:t}};return e.jsx("section",{className:a.default.root,"data-type":"hero",children:e.jsxs("div",{className:a.default.container,children:[e.jsxs("div",{className:a.default.headlineContainer,children:[e.jsx("div",{className:a.default.title,children:e.jsx(c.HighlightedTitle,{as:"p",colorScheme:"dark",defaultVariant:"displayMd",mobileVariant:"displayXs",title:e.jsxs(e.Fragment,{children:["To see results, you need to ",e.jsx("b",{children:"see your results"})]})})}),e.jsx(n.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",className:a.default.description,children:"Healthspan's advanced lab panels provide precise data on 100+ biomarkers. Your dedicated clinical care team analyzes and explains the results in plain terms, helping you personalize and optimize your longevity protocol."}),e.jsx("div",{className:l.cn(a.default.buttonWrap,a.default.mobile),children:e.jsx(r.Button,{as:"a",href:t,variant:"secondary",size:"md",analyticsProps:s,children:"Get Started"})}),e.jsx("div",{className:l.cn(a.default.buttonWrap,a.default.desktop),children:e.jsx(r.Button,{as:"a",href:t,variant:"secondary",size:"lg",analyticsProps:s,children:"Get Started"})})]}),e.jsxs("div",{className:a.default.animationContainer,children:[e.jsx("img",{src:o.default,className:a.default.set1Icon,alt:"Image Icon"}),e.jsx("img",{src:m.default,className:a.default.set1Image,alt:"Product Image"}),e.jsx(f.default,{className:a.default.set1Svg}),e.jsx("img",{src:d.default,className:a.default.set2Icon,alt:"Image Icon"}),e.jsx("img",{src:g.default,className:a.default.set2Image,alt:"Product Image"}),e.jsx(y.default,{className:a.default.set2Svg}),e.jsx("img",{src:u.default,className:a.default.set3Icon,alt:"Image Icon"}),e.jsx("img",{src:p.default,className:a.default.set3Image,alt:"Product Image"}),e.jsx(h.default,{className:a.default.set3Svg})]})]})})};exports.LabsHero=j;
@@ -1,49 +1,60 @@
1
- import { jsx as a, jsxs as r, Fragment as o } from "react/jsx-runtime";
2
- import { cn as t } from "../../utils/cn/cn.es.js";
3
- import { Typography as m } from "../../components/Typography/Typography.es.js";
4
- import { HighlightedTitle as l } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
1
+ import { jsx as a, jsxs as t, Fragment as m } from "react/jsx-runtime";
2
+ import { cn as o } from "../../utils/cn/cn.es.js";
3
+ import { Typography as c } from "../../components/Typography/Typography.es.js";
4
+ import { HighlightedTitle as n } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
5
5
  import { Button as i } from "../../components/Button/Button.es.js";
6
- import c from "./assets/icon1.png.es.js";
7
- import n from "./assets/icon2.png.es.js";
8
- import d from "./assets/icon3.png.es.js";
9
- import p from "./assets/img1.png.es.js";
10
- import g from "./assets/img2.png.es.js";
6
+ import l from "./assets/icon1.png.es.js";
7
+ import d from "./assets/icon2.png.es.js";
8
+ import p from "./assets/icon3.png.es.js";
9
+ import g from "./assets/img1.png.es.js";
10
+ import v from "./assets/img2.png.es.js";
11
11
  import h from "./assets/img3.png.es.js";
12
- import v from "./assets/svg1.svg.es.js";
12
+ import y from "./assets/svg1.svg.es.js";
13
13
  import f from "./assets/svg2.svg.es.js";
14
- import N from "./assets/svg3.svg.es.js";
14
+ import u from "./assets/svg3.svg.es.js";
15
15
  import e from "./labsHero.module.css.es.js";
16
- const M = ({ link: s }) => /* @__PURE__ */ a("section", { className: e.root, "data-type": "hero", children: /* @__PURE__ */ r("div", { className: e.container, children: [
17
- /* @__PURE__ */ r("div", { className: e.headlineContainer, children: [
18
- /* @__PURE__ */ a("div", { className: e.title, children: /* @__PURE__ */ a(
19
- l,
20
- {
21
- as: "p",
22
- colorScheme: "dark",
23
- defaultVariant: "displayMd",
24
- mobileVariant: "displayXs",
25
- title: /* @__PURE__ */ r(o, { children: [
26
- "To see results, you need to ",
27
- /* @__PURE__ */ a("b", { children: "see your results" })
28
- ] })
29
- }
30
- ) }),
31
- /* @__PURE__ */ a(m, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", className: e.description, children: "Healthspan's advanced lab panels provide precise data on 100+ biomarkers. Your dedicated clinical care team analyzes and explains the results in plain terms, helping you personalize and optimize your longevity protocol." }),
32
- /* @__PURE__ */ a("div", { className: t(e.buttonWrap, e.mobile), children: /* @__PURE__ */ a(i, { as: "a", href: s, variant: "secondary", size: "md", children: "Get Started" }) }),
33
- /* @__PURE__ */ a("div", { className: t(e.buttonWrap, e.desktop), children: /* @__PURE__ */ a(i, { as: "a", href: s, variant: "secondary", size: "lg", children: "Get Started" }) })
34
- ] }),
35
- /* @__PURE__ */ r("div", { className: e.animationContainer, children: [
36
- /* @__PURE__ */ a("img", { src: c, className: e.set1Icon, alt: "Image Icon" }),
37
- /* @__PURE__ */ a("img", { src: p, className: e.set1Image, alt: "Product Image" }),
38
- /* @__PURE__ */ a(v, { className: e.set1Svg }),
39
- /* @__PURE__ */ a("img", { src: n, className: e.set2Icon, alt: "Image Icon" }),
40
- /* @__PURE__ */ a("img", { src: g, className: e.set2Image, alt: "Product Image" }),
41
- /* @__PURE__ */ a(f, { className: e.set2Svg }),
42
- /* @__PURE__ */ a("img", { src: d, className: e.set3Icon, alt: "Image Icon" }),
43
- /* @__PURE__ */ a("img", { src: h, className: e.set3Image, alt: "Product Image" }),
44
- /* @__PURE__ */ a(N, { className: e.set3Svg })
45
- ] })
46
- ] }) });
16
+ import { EAnalyticsEventType as N, EAnalyticsEvent as I } from "../../types/analytics/analytics.es.js";
17
+ const W = ({ link: r }) => {
18
+ const s = {
19
+ event: I.ctaClicked,
20
+ type: N.interaction,
21
+ component: "LabsHero",
22
+ payload: {
23
+ ctaLink: r
24
+ }
25
+ };
26
+ return /* @__PURE__ */ a("section", { className: e.root, "data-type": "hero", children: /* @__PURE__ */ t("div", { className: e.container, children: [
27
+ /* @__PURE__ */ t("div", { className: e.headlineContainer, children: [
28
+ /* @__PURE__ */ a("div", { className: e.title, children: /* @__PURE__ */ a(
29
+ n,
30
+ {
31
+ as: "p",
32
+ colorScheme: "dark",
33
+ defaultVariant: "displayMd",
34
+ mobileVariant: "displayXs",
35
+ title: /* @__PURE__ */ t(m, { children: [
36
+ "To see results, you need to ",
37
+ /* @__PURE__ */ a("b", { children: "see your results" })
38
+ ] })
39
+ }
40
+ ) }),
41
+ /* @__PURE__ */ a(c, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", className: e.description, children: "Healthspan's advanced lab panels provide precise data on 100+ biomarkers. Your dedicated clinical care team analyzes and explains the results in plain terms, helping you personalize and optimize your longevity protocol." }),
42
+ /* @__PURE__ */ a("div", { className: o(e.buttonWrap, e.mobile), children: /* @__PURE__ */ a(i, { as: "a", href: r, variant: "secondary", size: "md", analyticsProps: s, children: "Get Started" }) }),
43
+ /* @__PURE__ */ a("div", { className: o(e.buttonWrap, e.desktop), children: /* @__PURE__ */ a(i, { as: "a", href: r, variant: "secondary", size: "lg", analyticsProps: s, children: "Get Started" }) })
44
+ ] }),
45
+ /* @__PURE__ */ t("div", { className: e.animationContainer, children: [
46
+ /* @__PURE__ */ a("img", { src: l, className: e.set1Icon, alt: "Image Icon" }),
47
+ /* @__PURE__ */ a("img", { src: g, className: e.set1Image, alt: "Product Image" }),
48
+ /* @__PURE__ */ a(y, { className: e.set1Svg }),
49
+ /* @__PURE__ */ a("img", { src: d, className: e.set2Icon, alt: "Image Icon" }),
50
+ /* @__PURE__ */ a("img", { src: v, className: e.set2Image, alt: "Product Image" }),
51
+ /* @__PURE__ */ a(f, { className: e.set2Svg }),
52
+ /* @__PURE__ */ a("img", { src: p, className: e.set3Icon, alt: "Image Icon" }),
53
+ /* @__PURE__ */ a("img", { src: h, className: e.set3Image, alt: "Product Image" }),
54
+ /* @__PURE__ */ a(u, { className: e.set3Svg })
55
+ ] })
56
+ ] }) });
57
+ };
47
58
  export {
48
- M as LabsHero
59
+ W as LabsHero
49
60
  };
@@ -1 +1 @@
1
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("react"),m=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),l=require("../../components/Typography/Typography.cjs.js"),p=require("../../components/Button/Button.cjs.js"),t=require("../../utils/cn/cn.cjs.js"),x=require("./assets/prod1.png.cjs.js"),v=require("./assets/prod2.png.cjs.js"),y=require("./assets/prod3.png.cjs.js"),N=require("./assets/pill1.jpg.cjs.js"),j=require("./assets/pill2.jpg.cjs.js"),b=require("./assets/pill3.jpg.cjs.js"),T=require("./assets/graph1.svg.cjs.js"),V=require("./assets/graph2.svg.cjs.js"),I=require("./assets/graph3.svg.cjs.js"),e=require("./personalizedProtocolHero.module.css.cjs.js"),n=[{pill:N.default,product:x.default,protocol:"ENERGY",dosage:{text:"Oxytocin Nasal Spray",value:"3MG"},goal:"REDUCE STRESS",svg:T.default},{pill:j.default,product:v.default,protocol:"METABOLISM",dosage:{text:"Metformin",value:"3MG"},goal:"AUTOPHAGY INDUCTION",svg:V.default},{pill:b.default,product:y.default,protocol:"SENESCENCE",dosage:{text:"Rapamycin",value:"3MG"},goal:"LONGEVITY",svg:I.default}],q=()=>{const[i,f]=r.useState(0),[h,g]=r.useState(0),[s,u]=r.useState(!1);r.useEffect(()=>{const c=setInterval(()=>{const o=(i+1)%n.length;f(o),setTimeout(()=>{u(!0),setTimeout(()=>{g(o),u(!1)},200)},200)},2500);return()=>clearInterval(c)},[i]);const d=n[h];return a.jsx("section",{className:e.default.root,"data-type":"hero",children:a.jsxs("div",{className:e.default.container,children:[a.jsxs("div",{className:e.default.leftContent,children:[a.jsx("div",{className:e.default.title,children:a.jsx(m.HighlightedTitle,{as:"p",colorScheme:"dark",defaultVariant:"displayMd",mobileVariant:"displayXs",title:a.jsxs(a.Fragment,{children:["A longevity protocol that's ",a.jsx("b",{children:"all you"})]})})}),a.jsx(l.Typography,{className:e.default.description,as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",children:"There's nothing more personal than your health, which is why your Healthspan care team works closely with you — using lab testing, data, and coaching — to design and optimize a protocol to fit your unique goals."}),a.jsx("div",{className:t.cn(e.default.buttonWrap,e.default.mobile),children:a.jsx(p.Button,{as:"a",href:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",variant:"secondary",size:"md",children:"Join Healthspan"})}),a.jsx("div",{className:t.cn(e.default.buttonWrap,e.default.desktop),children:a.jsx(p.Button,{as:"a",href:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",variant:"secondary",size:"lg",children:"Join Healthspan"})})]}),a.jsx("div",{className:e.default.pillContainer,children:n.map((c,o)=>a.jsx("img",{src:c.pill,className:t.cn(e.default.pillImage,o===i&&e.default.active,o===(i-1+n.length)%n.length&&e.default.exiting),alt:"Pill"},o))}),a.jsxs("div",{className:e.default.textContainer,children:[a.jsxs("div",{className:e.default.protocolContainer,children:[a.jsx(l.Typography,{className:e.default.protocolText,as:"p",defaultVariant:"labelMd",mobileVariant:"labelXs",children:"Protocol"}),a.jsx("div",{className:t.cn(e.default.protocolFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.protocolValue,as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,children:d.protocol})})]}),a.jsxs("div",{className:e.default.dosageContainer,children:[a.jsx("div",{className:t.cn(e.default.dosageImageFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx("img",{src:d.product,className:e.default.dosageItem,alt:"Product"})}),a.jsxs("div",{className:e.default.dosageTextBlock,children:[a.jsx("div",{className:t.cn(e.default.dosageTextFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.dosageText,as:"p",defaultVariant:"labelMd",mobileVariant:"labelXs",children:d.dosage.text})}),a.jsx("div",{className:t.cn(e.default.dosageValueFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.dosageValue,as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,children:d.dosage.value})})]})]}),a.jsxs("div",{className:e.default.goalContainer,children:[a.jsx(l.Typography,{className:e.default.goalText,as:"p",defaultVariant:"labelMd",mobileVariant:"labelXs",children:"Goal"}),a.jsx("div",{className:t.cn(e.default.goalFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.goalValue,as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,children:d.goal})})]}),a.jsx("div",{className:e.default.svgContainer,children:a.jsx("div",{className:t.cn(e.default.svgFade,s?e.default.fadeOut:e.default.fadeIn),children:r.createElement(d.svg,{className:e.default.svg})})})]})]})})};exports.PersonalizedProtocolHero=q;
1
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("react"),y=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),l=require("../../components/Typography/Typography.cjs.js"),f=require("../../components/Button/Button.cjs.js"),t=require("../../utils/cn/cn.cjs.js"),v=require("./assets/prod1.png.cjs.js"),N=require("./assets/prod2.png.cjs.js"),j=require("./assets/prod3.png.cjs.js"),b=require("./assets/pill1.jpg.cjs.js"),T=require("./assets/pill2.jpg.cjs.js"),V=require("./assets/pill3.jpg.cjs.js"),I=require("./assets/graph1.svg.cjs.js"),q=require("./assets/graph2.svg.cjs.js"),C=require("./assets/graph3.svg.cjs.js"),e=require("./personalizedProtocolHero.module.css.cjs.js"),h=require("../../types/analytics/analytics.cjs.js"),i=[{pill:b.default,product:v.default,protocol:"ENERGY",dosage:{text:"Oxytocin Nasal Spray",value:"3MG"},goal:"REDUCE STRESS",svg:I.default},{pill:T.default,product:N.default,protocol:"METABOLISM",dosage:{text:"Metformin",value:"3MG"},goal:"AUTOPHAGY INDUCTION",svg:q.default},{pill:V.default,product:j.default,protocol:"SENESCENCE",dosage:{text:"Rapamycin",value:"3MG"},goal:"LONGEVITY",svg:C.default}],E=()=>{const[c,m]=r.useState(0),[g,x]=r.useState(0),[s,u]=r.useState(!1);r.useEffect(()=>{const d=setInterval(()=>{const n=(c+1)%i.length;m(n),setTimeout(()=>{u(!0),setTimeout(()=>{x(n),u(!1)},200)},200)},2500);return()=>clearInterval(d)},[c]);const o=i[g],p=()=>{var d;(d=window.eventBus)==null||d.emit("analytics",{event:h.EAnalyticsEvent.ctaClicked,type:h.EAnalyticsEventType.interaction,component:"PersonalizedProtocolHero",payload:{link:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948"}})};return a.jsx("section",{className:e.default.root,"data-type":"hero",children:a.jsxs("div",{className:e.default.container,children:[a.jsxs("div",{className:e.default.leftContent,children:[a.jsx("div",{className:e.default.title,children:a.jsx(y.HighlightedTitle,{as:"p",colorScheme:"dark",defaultVariant:"displayMd",mobileVariant:"displayXs",title:a.jsxs(a.Fragment,{children:["A longevity protocol that's ",a.jsx("b",{children:"all you"})]})})}),a.jsx(l.Typography,{className:e.default.description,as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",children:"There's nothing more personal than your health, which is why your Healthspan care team works closely with you — using lab testing, data, and coaching — to design and optimize a protocol to fit your unique goals."}),a.jsx("div",{className:t.cn(e.default.buttonWrap,e.default.mobile),children:a.jsx(f.Button,{as:"a",href:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",variant:"secondary",size:"md",onClick:p,children:"Join Healthspan"})}),a.jsx("div",{className:t.cn(e.default.buttonWrap,e.default.desktop),children:a.jsx(f.Button,{as:"a",href:"https://app.gethealthspan.com/#/product/signup/6896e50bc0af7d4d26738948",variant:"secondary",size:"lg",onClick:p,children:"Join Healthspan"})})]}),a.jsx("div",{className:e.default.pillContainer,children:i.map((d,n)=>a.jsx("img",{src:d.pill,className:t.cn(e.default.pillImage,n===c&&e.default.active,n===(c-1+i.length)%i.length&&e.default.exiting),alt:"Pill"},n))}),a.jsxs("div",{className:e.default.textContainer,children:[a.jsxs("div",{className:e.default.protocolContainer,children:[a.jsx(l.Typography,{className:e.default.protocolText,as:"p",defaultVariant:"labelMd",mobileVariant:"labelXs",children:"Protocol"}),a.jsx("div",{className:t.cn(e.default.protocolFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.protocolValue,as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,children:o.protocol})})]}),a.jsxs("div",{className:e.default.dosageContainer,children:[a.jsx("div",{className:t.cn(e.default.dosageImageFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx("img",{src:o.product,className:e.default.dosageItem,alt:"Product"})}),a.jsxs("div",{className:e.default.dosageTextBlock,children:[a.jsx("div",{className:t.cn(e.default.dosageTextFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.dosageText,as:"p",defaultVariant:"labelMd",mobileVariant:"labelXs",children:o.dosage.text})}),a.jsx("div",{className:t.cn(e.default.dosageValueFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.dosageValue,as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,children:o.dosage.value})})]})]}),a.jsxs("div",{className:e.default.goalContainer,children:[a.jsx(l.Typography,{className:e.default.goalText,as:"p",defaultVariant:"labelMd",mobileVariant:"labelXs",children:"Goal"}),a.jsx("div",{className:t.cn(e.default.goalFade,s?e.default.fadeOut:e.default.fadeIn),children:a.jsx(l.Typography,{className:e.default.goalValue,as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,children:o.goal})})]}),a.jsx("div",{className:e.default.svgContainer,children:a.jsx("div",{className:t.cn(e.default.svgFade,s?e.default.fadeOut:e.default.fadeIn),children:r.createElement(o.svg,{className:e.default.svg})})})]})]})})};exports.PersonalizedProtocolHero=E;