@zenpatient-org/healthspan-marketing-ui 0.1.125 → 0.1.127

package/dist/modules/ScienceHero/ScienceHero.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../components/Typography/Typography.cjs.js"),u=require("./ScienceHeroCursor.cjs.js"),a=require("./scienceHero.module.css.cjs.js"),m=({firstLineTitle:n,optionalLineTitle:r,highlightedLineTitle:i,label:t,backgroundImage:l,badges:o,cursorLink:d})=>e.jsx(u.ScienceHeroCursor,{backgroundImage:l,cursorLink:d,children:e.jsxs("section",{className:a.default.root,"data-type":"hero",children:[e.jsx("div",{className:a.default.blurredBackground,style:{backgroundImage:`url(${l})`}}),e.jsxs("div",{className:a.default.container,children:[e.jsx("div",{className:a.default.leftColumn}),e.jsxs("div",{className:a.default.mainColumn,children:[e.jsx("div",{className:a.default.verticalBorder}),e.jsx("div",{className:a.default.circleVector}),e.jsx("a",{className:a.default.circleVectorMobile,href:d,style:{backgroundImage:`url(${l}`}}),e.jsxs("div",{className:a.default.content,children:[t&&e.jsx(s.Typography,{defaultVariant:"labelXs",emphasis:!0,className:a.default.label,children:t}),e.jsxs("div",{className:a.default.title,children:[e.jsx(s.Typography,{as:"h2",defaultVariant:"displayXl",mobileVariant:"displayXs",className:a.default.firstLineTitle,children:n}),r&&e.jsx(s.Typography,{defaultVariant:"displayXl",mobileVariant:"displayXs",className:a.default.optionalLineTitle,children:r}),i&&e.jsx(s.Typography,{defaultVariant:"displayXl",mobileVariant:"displayXs",className:a.default.highlightedLineTitle,children:i})]}),e.jsx("div",{className:a.default.badgesRow,children:o.map(c=>e.jsx(s.Typography,{as:"p",defaultVariant:"labelXs",emphasis:!0,className:a.default.badge,children:c},c))})]}),e.jsx("div",{className:a.default.verticalBorder})]}),e.jsx("div",{className:a.default.rightColumn})]})]})});exports.ScienceHero=m;

package/dist/modules/ScienceHero/ScienceHero.d.ts

@@ -0,0 +1,10 @@
+export type ScienceHeroProps = {
+    firstLineTitle: string;
+    optionalLineTitle?: string;
+    highlightedLineTitle?: string;
+    label?: string;
+    backgroundImage: string;
+    cursorLink: string;
+    badges: Array<string>;
+};
+export declare const ScienceHero: ({ firstLineTitle, optionalLineTitle, highlightedLineTitle, label, backgroundImage, badges, cursorLink, }: ScienceHeroProps) => import("react/jsx-runtime").JSX.Element;

package/dist/modules/ScienceHero/ScienceHero.es.js

@@ -0,0 +1,79 @@
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { Typography as s } from "../../components/Typography/Typography.es.js";
+import { ScienceHeroCursor as h } from "./ScienceHeroCursor.es.js";
+import a from "./scienceHero.module.css.es.js";
+const f = ({
+  firstLineTitle: n,
+  optionalLineTitle: r,
+  highlightedLineTitle: c,
+  label: t,
+  backgroundImage: i,
+  badges: o,
+  cursorLink: d
+}) => /* @__PURE__ */ e(h, { backgroundImage: i, cursorLink: d, children: /* @__PURE__ */ l("section", { className: a.root, "data-type": "hero", children: [
+  /* @__PURE__ */ e("div", { className: a.blurredBackground, style: { backgroundImage: `url(${i})` } }),
+  /* @__PURE__ */ l("div", { className: a.container, children: [
+    /* @__PURE__ */ e("div", { className: a.leftColumn }),
+    /* @__PURE__ */ l("div", { className: a.mainColumn, children: [
+      /* @__PURE__ */ e("div", { className: a.verticalBorder }),
+      /* @__PURE__ */ e("div", { className: a.circleVector }),
+      /* @__PURE__ */ e(
+        "a",
+        {
+          className: a.circleVectorMobile,
+          href: d,
+          style: { backgroundImage: `url(${i}` }
+        }
+      ),
+      /* @__PURE__ */ l("div", { className: a.content, children: [
+        t && /* @__PURE__ */ e(s, { defaultVariant: "labelXs", emphasis: !0, className: a.label, children: t }),
+        /* @__PURE__ */ l("div", { className: a.title, children: [
+          /* @__PURE__ */ e(
+            s,
+            {
+              as: "h2",
+              defaultVariant: "displayXl",
+              mobileVariant: "displayXs",
+              className: a.firstLineTitle,
+              children: n
+            }
+          ),
+          r && /* @__PURE__ */ e(
+            s,
+            {
+              defaultVariant: "displayXl",
+              mobileVariant: "displayXs",
+              className: a.optionalLineTitle,
+              children: r
+            }
+          ),
+          c && /* @__PURE__ */ e(
+            s,
+            {
+              defaultVariant: "displayXl",
+              mobileVariant: "displayXs",
+              className: a.highlightedLineTitle,
+              children: c
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e("div", { className: a.badgesRow, children: o.map((m) => /* @__PURE__ */ e(
+          s,
+          {
+            as: "p",
+            defaultVariant: "labelXs",
+            emphasis: !0,
+            className: a.badge,
+            children: m
+          },
+          m
+        )) })
+      ] }),
+      /* @__PURE__ */ e("div", { className: a.verticalBorder })
+    ] }),
+    /* @__PURE__ */ e("div", { className: a.rightColumn })
+  ] })
+] }) });
+export {
+  f as ScienceHero
+};

package/dist/modules/ScienceHero/ScienceHeroCursor.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("react"),C=require("react-dom"),w=require("./scienceHero.module.css.cjs.js");function L({children:r,backgroundImage:p,cursorLink:v}){const[i,x]=t.useState({x:0,y:0}),[h,m]=t.useState(0),[$,c]=t.useState(!1),[b,l]=t.useState(!1),[o,g]=t.useState(null),[s,M]=t.useState(!1);t.useEffect(()=>{l(!0);const e=()=>M(window.innerWidth<=768);return e(),window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e),l(!1)}},[]),t.useEffect(()=>{if(s)return;const e=f=>{x({x:f.clientX,y:f.clientY})},d=()=>{m(window.scrollY)};return window.addEventListener("mousemove",e),window.addEventListener("scroll",d),()=>{window.removeEventListener("mousemove",e),window.removeEventListener("scroll",d)}},[s]);const S=e=>{s||(g(e.currentTarget.getBoundingClientRect()),c(!0))},y=()=>{s||c(!1)},E=()=>{window.location.href=v};if(typeof window>"u")return r;if(s)return n.jsx("div",{children:r});const u=`circle(270px at ${i.x}px ${i.y}px)`,a=$&&o&&n.jsx("div",{className:w.default.cursorContainer,style:{position:"fixed",top:`${o.top}px`,left:`${o.left}px`,width:`${o.width}px`,height:`${o.height}px`,overflow:"hidden",cursor:"pointer"},children:n.jsx("div",{className:w.default.normalBackground,style:{position:"absolute",top:`${-o.top}px`,left:`${-o.left}px`,backgroundImage:`url(${p})`,clipPath:u,WebkitClipPath:u,backgroundPosition:`center ${-h}px`}})});return n.jsxs(n.Fragment,{children:[n.jsx("div",{onMouseEnter:S,onMouseLeave:y,onClick:E,style:{cursor:"pointer"},children:r}),b&&a&&C.createPortal(a,document.body)]})}exports.ScienceHeroCursor=L;

package/dist/modules/ScienceHero/ScienceHeroCursor.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+
+type ScienceHeroCursorProps = {
+    children: React.ReactNode;
+    backgroundImage: string;
+    cursorLink: string;
+};
+export declare function ScienceHeroCursor({ children, backgroundImage, cursorLink }: ScienceHeroCursorProps): string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+export {};

package/dist/modules/ScienceHero/ScienceHeroCursor.es.js

@@ -0,0 +1,84 @@
+"use client";
+import { jsx as r, jsxs as k, Fragment as P } from "react/jsx-runtime";
+import { useState as o, useEffect as p } from "react";
+import { createPortal as R } from "react-dom";
+import w from "./scienceHero.module.css.es.js";
+function z({ children: s, backgroundImage: m, cursorLink: v }) {
+  const [i, h] = o({ x: 0, y: 0 }), [x, M] = o(0), [b, l] = o(!1), [g, c] = o(!1), [t, $] = o(null), [n, y] = o(!1);
+  p(() => {
+    c(!0);
+    const e = () => y(window.innerWidth <= 768);
+    return e(), window.addEventListener("resize", e), () => {
+      window.removeEventListener("resize", e), c(!1);
+    };
+  }, []), p(() => {
+    if (n) return;
+    const e = (f) => {
+      h({
+        x: f.clientX,
+        y: f.clientY
+      });
+    }, a = () => {
+      M(window.scrollY);
+    };
+    return window.addEventListener("mousemove", e), window.addEventListener("scroll", a), () => {
+      window.removeEventListener("mousemove", e), window.removeEventListener("scroll", a);
+    };
+  }, [n]);
+  const E = (e) => {
+    n || ($(e.currentTarget.getBoundingClientRect()), l(!0));
+  }, C = () => {
+    n || l(!1);
+  }, L = () => {
+    window.location.href = v;
+  };
+  if (typeof window > "u") return s;
+  if (n)
+    return /* @__PURE__ */ r("div", { children: s });
+  const d = `circle(270px at ${i.x}px ${i.y}px)`, u = b && t && /* @__PURE__ */ r(
+    "div",
+    {
+      className: w.cursorContainer,
+      style: {
+        position: "fixed",
+        top: `${t.top}px`,
+        left: `${t.left}px`,
+        width: `${t.width}px`,
+        height: `${t.height}px`,
+        overflow: "hidden",
+        cursor: "pointer"
+      },
+      children: /* @__PURE__ */ r(
+        "div",
+        {
+          className: w.normalBackground,
+          style: {
+            position: "absolute",
+            top: `${-t.top}px`,
+            left: `${-t.left}px`,
+            backgroundImage: `url(${m})`,
+            clipPath: d,
+            WebkitClipPath: d,
+            backgroundPosition: `center ${-x}px`
+          }
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ k(P, { children: [
+    /* @__PURE__ */ r(
+      "div",
+      {
+        onMouseEnter: E,
+        onMouseLeave: C,
+        onClick: L,
+        style: { cursor: "pointer" },
+        children: s
+      }
+    ),
+    g && u && R(u, document.body)
+  ] });
+}
+export {
+  z as ScienceHeroCursor
+};

package/dist/modules/ScienceHero/index.d.ts

@@ -0,0 +1 @@
+export { ScienceHero } from './ScienceHero';

package/dist/modules/ScienceHero/scienceHero.module.css.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="scienceHero-module__root___1mxBF",o="scienceHero-module__blurredBackground___1nHn-",n="scienceHero-module__normalBackground___Nmff2",c="scienceHero-module__container___nARrv",l="scienceHero-module__circleVector___YRvlO",t="scienceHero-module__mainColumn___6FXPp",i="scienceHero-module__leftColumn___btXP-",_="scienceHero-module__rightColumn___NmO1h",r="scienceHero-module__verticalBorder___Yp2-F",s="scienceHero-module__content___-ns5L",d="scienceHero-module__label___uJCET",u="scienceHero-module__title___vVz4E",a="scienceHero-module__firstLineTitle___h1FKx",m="scienceHero-module__optionalLineTitle___erKDO",g="scienceHero-module__highlightedLineTitle___mmHaK",b="scienceHero-module__badgesRow___N0x9v",H="scienceHero-module__badge___oG08P",h="scienceHero-module__circleVectorMobile___QoQiY",T={root:e,blurredBackground:o,normalBackground:n,container:c,circleVector:l,mainColumn:t,leftColumn:i,rightColumn:_,verticalBorder:r,content:s,label:d,title:u,firstLineTitle:a,optionalLineTitle:m,highlightedLineTitle:g,badgesRow:b,badge:H,circleVectorMobile:h};exports.badge=H;exports.badgesRow=b;exports.blurredBackground=o;exports.circleVector=l;exports.circleVectorMobile=h;exports.container=c;exports.content=s;exports.default=T;exports.firstLineTitle=a;exports.highlightedLineTitle=g;exports.label=d;exports.leftColumn=i;exports.mainColumn=t;exports.normalBackground=n;exports.optionalLineTitle=m;exports.rightColumn=_;exports.root=e;exports.title=u;exports.verticalBorder=r;

package/dist/modules/ScienceHero/scienceHero.module.css.es.js

@@ -0,0 +1,41 @@
+const e = "scienceHero-module__root___1mxBF", o = "scienceHero-module__blurredBackground___1nHn-", _ = "scienceHero-module__normalBackground___Nmff2", c = "scienceHero-module__container___nARrv", n = "scienceHero-module__circleVector___YRvlO", l = "scienceHero-module__mainColumn___6FXPp", t = "scienceHero-module__leftColumn___btXP-", i = "scienceHero-module__rightColumn___NmO1h", r = "scienceHero-module__verticalBorder___Yp2-F", s = "scienceHero-module__content___-ns5L", d = "scienceHero-module__label___uJCET", m = "scienceHero-module__title___vVz4E", u = "scienceHero-module__firstLineTitle___h1FKx", a = "scienceHero-module__optionalLineTitle___erKDO", g = "scienceHero-module__highlightedLineTitle___mmHaK", H = "scienceHero-module__badgesRow___N0x9v", b = "scienceHero-module__badge___oG08P", h = "scienceHero-module__circleVectorMobile___QoQiY", B = {
+  root: e,
+  blurredBackground: o,
+  normalBackground: _,
+  container: c,
+  circleVector: n,
+  mainColumn: l,
+  leftColumn: t,
+  rightColumn: i,
+  verticalBorder: r,
+  content: s,
+  label: d,
+  title: m,
+  firstLineTitle: u,
+  optionalLineTitle: a,
+  highlightedLineTitle: g,
+  badgesRow: H,
+  badge: b,
+  circleVectorMobile: h
+};
+export {
+  b as badge,
+  H as badgesRow,
+  o as blurredBackground,
+  n as circleVector,
+  h as circleVectorMobile,
+  c as container,
+  s as content,
+  B as default,
+  u as firstLineTitle,
+  g as highlightedLineTitle,
+  d as label,
+  t as leftColumn,
+  l as mainColumn,
+  _ as normalBackground,
+  a as optionalLineTitle,
+  i as rightColumn,
+  e as root,
+  m as title,
+  r as verticalBorder
+};

package/dist/modules/TrackProgress/components/TimelineContent/TimelineContent.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("react"),o=require("../../../../components/Typography/Typography.cjs.js"),b=require("../../../../utils/cn/cn.cjs.js"),l=require("./timelineContent.module.css.cjs.js");function T(r){const t=r.slice();for(let n=t.length-1;n>0;n--){const i=Math.floor(Math.random()*(n+1));[t[n],t[i]]=[t[i],t[n]]}return t}const j=[{key:"optimal",label:"Optimal"},{key:"inRange",label:"In Range"},{key:"outOfRange",label:"Out of Range"}],x=({tabs:r})=>{const[t,n]=u.useState(0),i=u.useRef(null),{optimal:h,inRange:m,outOfRange:f}=r[t],g=u.useMemo(()=>T([...Array(h).fill("optimal"),...Array(m).fill("inRange"),...Array(f).fill("outOfRange")]),[h,m,f]),p=u.useCallback(a=>{i.current=a.touches[0].clientX},[]),y=u.useCallback(a=>{if(i.current===null)return;const d=a.changedTouches[0].clientX-i.current;Math.abs(d)>50&&n(c=>d<0&&c<r.length-1?c+1:d>0&&c>0?c-1:c),i.current=null},[r.length]);return e.jsx("div",{className:l.default.root,children:e.jsxs("div",{className:l.default.container,children:[e.jsxs("div",{className:l.default.content,onTouchStart:p,onTouchEnd:y,children:[e.jsx("div",{className:l.default.metricsContainer,children:j.map((a,s)=>e.jsxs("div",{className:l.default.metric,children:[e.jsx(o.Typography,{defaultVariant:"displayLg",mobileVariant:"displaySm",weight:"regular",children:r[t][a.key]}),e.jsxs("div",{className:l.default.metricTitle,children:[e.jsx(o.Typography,{as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:"("}),e.jsx(o.Typography,{as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:a.label}),e.jsx("div",{className:l.default.circle,"data-value":a.key}),e.jsx(o.Typography,{as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:")"})]})]},`${a.key}_${s}`))}),e.jsx("div",{className:l.default.canvas,children:g.map((a,s)=>e.jsx("div",{className:l.default.circle,"data-value":a},s))})]}),e.jsx("div",{className:l.default.tabsContainer,children:r.map((a,s)=>e.jsx("button",{className:b.cn(l.default.tab,t===s&&l.default.tabActive),onClick:()=>n(s),children:e.jsx(o.Typography,{defaultVariant:"labelMd",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:a.label})},a.label))})]})})};exports.TimelineContent=x;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),d=require("../../../../node_modules/swiper/swiper-react.cjs.js");;/* empty css                                              */const t=require("../../../../components/Typography/Typography.cjs.js"),y=require("../../../../utils/cn/cn.cjs.js"),f=require("../../../../utils/useSwiper/useSwiper.cjs.js"),b=require("./utils.cjs.js"),a=require("./timelineContent.module.css.cjs.js"),v=[{key:"optimal",label:"Optimal"},{key:"inRange",label:"In Range"},{key:"outOfRange",label:"Out of Range"}],S=({tabs:s})=>{const{activeIndex:c,onSwiperInit:o,handleSlideTo:u,handleSlideChange:p,handleSwiperResize:m}=f.useSwiper(),h=g.useMemo(()=>s.map(l=>b.distributePoints(l.optimal,l.inRange,l.outOfRange)),[s]);return e.jsx("div",{className:a.default.root,children:e.jsxs("div",{className:a.default.container,children:[e.jsx(d.Swiper,{onSwiper:o,onResize:m,onSlideChange:p,slidesPerView:1,allowTouchMove:s.length>1,spaceBetween:0,initialSlide:0,className:a.default.swiper,children:s.map((l,n)=>e.jsx(d.SwiperSlide,{children:e.jsxs("div",{className:a.default.content,children:[e.jsx("div",{className:a.default.metricsContainer,children:v.map((i,r)=>e.jsxs("div",{className:a.default.metric,children:[e.jsx(t.Typography,{defaultVariant:"displayLg",mobileVariant:"displaySm",weight:"regular",children:l[i.key]}),e.jsxs("div",{className:a.default.metricTitle,children:[e.jsx(t.Typography,{as:"div",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:"("}),e.jsx(t.Typography,{as:"div",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:i.label}),e.jsx("div",{className:a.default.circle,"data-value":i.key}),e.jsx(t.Typography,{as:"div",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:")"})]})]},`${i.key}_${r}`))}),e.jsx("div",{className:a.default.canvas,children:h[n].map((i,r)=>e.jsx("div",{className:a.default.circle,"data-value":i},r))})]})},l.label))}),e.jsx("div",{className:a.default.tabsContainer,children:s.map((l,n)=>e.jsx("button",{className:y.cn(a.default.tab,c===n&&a.default.tabActive),onClick:()=>u(n),children:e.jsx(t.Typography,{defaultVariant:"labelMd",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:l.label})},l.label))})]})})};exports.TimelineContent=S;

package/dist/modules/TrackProgress/components/TimelineContent/TimelineContent.es.js

@@ -1,99 +1,97 @@
 "use client";
-import { jsx as a, jsxs as u } from "react/jsx-runtime";
-import { useState as v, useRef as N, useMemo as T, useCallback as g } from "react";
-import { Typography as o } from "../../../../components/Typography/Typography.es.js";
-import { cn as R } from "../../../../utils/cn/cn.es.js";
-import l from "./timelineContent.module.css.es.js";
-function V(i) {
-  const n = i.slice();
-  for (let t = n.length - 1; t > 0; t--) {
-    const r = Math.floor(Math.random() * (t + 1));
-    [n[t], n[r]] = [n[r], n[t]];
-  }
-  return n;
-}
-const X = [
-  {
-    key: "optimal",
-    label: "Optimal"
-  },
-  {
-    key: "inRange",
-    label: "In Range"
-  },
-  {
-    key: "outOfRange",
-    label: "Out of Range"
-  }
-], E = ({ tabs: i }) => {
-  const [n, t] = v(0), r = N(null), { optimal: h, inRange: d, outOfRange: f } = i[n], b = T(() => V([
-    ...Array(h).fill("optimal"),
-    ...Array(d).fill("inRange"),
-    ...Array(f).fill("outOfRange")
-  ]), [h, d, f]), p = g((e) => {
-    r.current = e.touches[0].clientX;
-  }, []), y = g(
-    (e) => {
-      if (r.current === null) return;
-      const m = e.changedTouches[0].clientX - r.current;
-      Math.abs(m) > 50 && t((s) => m < 0 && s < i.length - 1 ? s + 1 : m > 0 && s > 0 ? s - 1 : s), r.current = null;
-    },
-    [i.length]
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+import { useMemo as g } from "react";
+import { Swiper as v, SwiperSlide as b } from "../../../../node_modules/swiper/swiper-react.es.js";
+/* empty css                                            */
+import { Typography as n } from "../../../../components/Typography/Typography.es.js";
+import { cn as f } from "../../../../utils/cn/cn.es.js";
+import { useSwiper as S } from "../../../../utils/useSwiper/useSwiper.es.js";
+import { distributePoints as w } from "./utils.es.js";
+import a from "./timelineContent.module.css.es.js";
+const y = [
+  { key: "optimal", label: "Optimal" },
+  { key: "inRange", label: "In Range" },
+  { key: "outOfRange", label: "Out of Range" }
+], X = ({ tabs: r }) => {
+  const { activeIndex: m, onSwiperInit: d, handleSlideTo: c, handleSlideChange: p, handleSwiperResize: h } = S(), u = g(
+    () => r.map((i) => w(i.optimal, i.inRange, i.outOfRange)),
+    [r]
   );
-  return /* @__PURE__ */ a("div", { className: l.root, children: /* @__PURE__ */ u("div", { className: l.container, children: [
-    /* @__PURE__ */ u("div", { className: l.content, onTouchStart: p, onTouchEnd: y, children: [
-      /* @__PURE__ */ a("div", { className: l.metricsContainer, children: X.map((e, c) => /* @__PURE__ */ u("div", { className: l.metric, children: [
-        /* @__PURE__ */ a(o, { defaultVariant: "displayLg", mobileVariant: "displaySm", weight: "regular", children: i[n][e.key] }),
-        /* @__PURE__ */ u("div", { className: l.metricTitle, children: [
-          /* @__PURE__ */ a(
-            o,
-            {
-              as: "p",
-              defaultVariant: "labelSm",
-              mobileVariant: "labelXs",
-              emphasis: !0,
-              weight: "regular",
-              children: "("
-            }
-          ),
-          /* @__PURE__ */ a(
-            o,
-            {
-              as: "p",
-              defaultVariant: "labelSm",
-              mobileVariant: "labelXs",
-              emphasis: !0,
-              weight: "regular",
-              children: e.label
-            }
-          ),
-          /* @__PURE__ */ a("div", { className: l.circle, "data-value": e.key }),
-          /* @__PURE__ */ a(
-            o,
-            {
-              as: "p",
-              defaultVariant: "labelSm",
-              mobileVariant: "labelXs",
-              emphasis: !0,
-              weight: "regular",
-              children: ")"
-            }
-          )
-        ] })
-      ] }, `${e.key}_${c}`)) }),
-      /* @__PURE__ */ a("div", { className: l.canvas, children: b.map((e, c) => /* @__PURE__ */ a("div", { className: l.circle, "data-value": e }, c)) })
-    ] }),
-    /* @__PURE__ */ a("div", { className: l.tabsContainer, children: i.map((e, c) => /* @__PURE__ */ a(
+  return /* @__PURE__ */ e("div", { className: a.root, children: /* @__PURE__ */ s("div", { className: a.container, children: [
+    /* @__PURE__ */ e(
+      v,
+      {
+        onSwiper: d,
+        onResize: h,
+        onSlideChange: p,
+        slidesPerView: 1,
+        allowTouchMove: r.length > 1,
+        spaceBetween: 0,
+        initialSlide: 0,
+        className: a.swiper,
+        children: r.map((i, t) => /* @__PURE__ */ e(b, { children: /* @__PURE__ */ s("div", { className: a.content, children: [
+          /* @__PURE__ */ e("div", { className: a.metricsContainer, children: y.map((l, o) => /* @__PURE__ */ s("div", { className: a.metric, children: [
+            /* @__PURE__ */ e(
+              n,
+              {
+                defaultVariant: "displayLg",
+                mobileVariant: "displaySm",
+                weight: "regular",
+                children: i[l.key]
+              }
+            ),
+            /* @__PURE__ */ s("div", { className: a.metricTitle, children: [
+              /* @__PURE__ */ e(
+                n,
+                {
+                  as: "div",
+                  defaultVariant: "labelSm",
+                  mobileVariant: "labelXs",
+                  emphasis: !0,
+                  weight: "regular",
+                  children: "("
+                }
+              ),
+              /* @__PURE__ */ e(
+                n,
+                {
+                  as: "div",
+                  defaultVariant: "labelSm",
+                  mobileVariant: "labelXs",
+                  emphasis: !0,
+                  weight: "regular",
+                  children: l.label
+                }
+              ),
+              /* @__PURE__ */ e("div", { className: a.circle, "data-value": l.key }),
+              /* @__PURE__ */ e(
+                n,
+                {
+                  as: "div",
+                  defaultVariant: "labelSm",
+                  mobileVariant: "labelXs",
+                  emphasis: !0,
+                  weight: "regular",
+                  children: ")"
+                }
+              )
+            ] })
+          ] }, `${l.key}_${o}`)) }),
+          /* @__PURE__ */ e("div", { className: a.canvas, children: u[t].map((l, o) => /* @__PURE__ */ e("div", { className: a.circle, "data-value": l }, o)) })
+        ] }) }, i.label))
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: a.tabsContainer, children: r.map((i, t) => /* @__PURE__ */ e(
       "button",
       {
-        className: R(l.tab, n === c && l.tabActive),
-        onClick: () => t(c),
-        children: /* @__PURE__ */ a(o, { defaultVariant: "labelMd", mobileVariant: "labelXs", emphasis: !0, weight: "regular", children: e.label })
+        className: f(a.tab, m === t && a.tabActive),
+        onClick: () => c(t),
+        children: /* @__PURE__ */ e(n, { defaultVariant: "labelMd", mobileVariant: "labelXs", emphasis: !0, weight: "regular", children: i.label })
       },
-      e.label
+      i.label
     )) })
   ] }) });
 };
 export {
-  E as TimelineContent
+  X as TimelineContent
 };

package/dist/modules/TrackProgress/components/TimelineContent/timelineContent.module.css.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="timelineContent-module__root___5V2gz",e="timelineContent-module__container___DSrBq",n="timelineContent-module__content___HS3bJ",o="timelineContent-module__metricsContainer___Bl9Mq",i="timelineContent-module__metric___QgjTy",_="timelineContent-module__metricTitle___NgmIf",c="timelineContent-module__canvas___nyUmZ",r="timelineContent-module__circle___FOAjD",l="timelineContent-module__tabsContainer___drNVG",a="timelineContent-module__tab___sCTOs",m="timelineContent-module__tabActive___Oa023",s={root:t,container:e,content:n,metricsContainer:o,metric:i,metricTitle:_,canvas:c,circle:r,tabsContainer:l,tab:a,tabActive:m};exports.canvas=c;exports.circle=r;exports.container=e;exports.content=n;exports.default=s;exports.metric=i;exports.metricTitle=_;exports.metricsContainer=o;exports.root=t;exports.tab=a;exports.tabActive=m;exports.tabsContainer=l;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="timelineContent-module__root___5V2gz",e="timelineContent-module__container___DSrBq",n="timelineContent-module__swiper___Pm56z",i="timelineContent-module__content___HS3bJ",o="timelineContent-module__metricsContainer___Bl9Mq",_="timelineContent-module__metric___QgjTy",c="timelineContent-module__metricTitle___NgmIf",r="timelineContent-module__canvas___nyUmZ",l="timelineContent-module__circle___FOAjD",m="timelineContent-module__tabsContainer___drNVG",a="timelineContent-module__tab___sCTOs",s="timelineContent-module__tabActive___Oa023",C={root:t,container:e,swiper:n,content:i,metricsContainer:o,metric:_,metricTitle:c,canvas:r,circle:l,tabsContainer:m,tab:a,tabActive:s};exports.canvas=r;exports.circle=l;exports.container=e;exports.content=i;exports.default=C;exports.metric=_;exports.metricTitle=c;exports.metricsContainer=o;exports.root=t;exports.swiper=n;exports.tab=a;exports.tabActive=s;exports.tabsContainer=m;

package/dist/modules/TrackProgress/components/TimelineContent/timelineContent.module.css.es.js

@@ -1,27 +1,29 @@
-const t = "timelineContent-module__root___5V2gz", e = "timelineContent-module__container___DSrBq", n = "timelineContent-module__content___HS3bJ", _ = "timelineContent-module__metricsContainer___Bl9Mq", o = "timelineContent-module__metric___QgjTy", i = "timelineContent-module__metricTitle___NgmIf", c = "timelineContent-module__canvas___nyUmZ", m = "timelineContent-module__circle___FOAjD", l = "timelineContent-module__tabsContainer___drNVG", a = "timelineContent-module__tab___sCTOs", r = "timelineContent-module__tabActive___Oa023", s = {
+const t = "timelineContent-module__root___5V2gz", e = "timelineContent-module__container___DSrBq", n = "timelineContent-module__swiper___Pm56z", _ = "timelineContent-module__content___HS3bJ", o = "timelineContent-module__metricsContainer___Bl9Mq", i = "timelineContent-module__metric___QgjTy", c = "timelineContent-module__metricTitle___NgmIf", m = "timelineContent-module__canvas___nyUmZ", l = "timelineContent-module__circle___FOAjD", r = "timelineContent-module__tabsContainer___drNVG", s = "timelineContent-module__tab___sCTOs", a = "timelineContent-module__tabActive___Oa023", C = {
   root: t,
   container: e,
-  content: n,
-  metricsContainer: _,
-  metric: o,
-  metricTitle: i,
-  canvas: c,
-  circle: m,
-  tabsContainer: l,
-  tab: a,
-  tabActive: r
+  swiper: n,
+  content: _,
+  metricsContainer: o,
+  metric: i,
+  metricTitle: c,
+  canvas: m,
+  circle: l,
+  tabsContainer: r,
+  tab: s,
+  tabActive: a
 };
 export {
-  c as canvas,
-  m as circle,
+  m as canvas,
+  l as circle,
   e as container,
-  n as content,
-  s as default,
-  o as metric,
-  i as metricTitle,
-  _ as metricsContainer,
+  _ as content,
+  C as default,
+  i as metric,
+  c as metricTitle,
+  o as metricsContainer,
   t as root,
-  a as tab,
-  r as tabActive,
-  l as tabsContainer
+  n as swiper,
+  s as tab,
+  a as tabActive,
+  r as tabsContainer
 };

package/dist/modules/TrackProgress/components/TimelineContent/utils.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function p(e){for(let t=e.length-1;t>0;t--){const n=Math.floor(Math.random()*(t+1));[e[t],e[n]]=[e[n],e[t]]}}function r(e,t){const n=[];for(let i=0;i<e.length;i++)e[i]===t&&n.push(i);return n}function c(e,t,n,i){p(t);for(let o=0;o<i&&o<t.length;o++)e[t[o]]=n}function a(e,t,n){const i=e+t+n,o=new Array(i).fill("optimal");let u=0,f=1,l=0;for(;Math.round(u)<i&&l<n;){const s=Math.round(u);o[s]==="optimal"&&(o[s]="outOfRange",l++),u+=f,f+=.3}if(l<n){const s=r(o,"optimal");c(o,s,"outOfRange",n-l)}const d=r(o,"optimal");return c(o,d,"inRange",t),o}exports.distributePoints=a;

package/dist/modules/TrackProgress/components/TimelineContent/utils.d.ts

@@ -0,0 +1,3 @@
+type PointType = 'optimal' | 'inRange' | 'outOfRange';
+export declare function distributePoints(optimal: number, inRange: number, outOfRange: number): PointType[];
+export {};

package/dist/modules/TrackProgress/components/TimelineContent/utils.es.js

@@ -0,0 +1,34 @@
+function d(n) {
+  for (let t = n.length - 1; t > 0; t--) {
+    const o = Math.floor(Math.random() * (t + 1));
+    [n[t], n[o]] = [n[o], n[t]];
+  }
+}
+function u(n, t) {
+  const o = [];
+  for (let l = 0; l < n.length; l++)
+    n[l] === t && o.push(l);
+  return o;
+}
+function r(n, t, o, l) {
+  d(t);
+  for (let e = 0; e < l && e < t.length; e++)
+    n[t[e]] = o;
+}
+function h(n, t, o) {
+  const l = n + t + o, e = new Array(l).fill("optimal");
+  let c = 0, s = 1, i = 0;
+  for (; Math.round(c) < l && i < o; ) {
+    const f = Math.round(c);
+    e[f] === "optimal" && (e[f] = "outOfRange", i++), c += s, s += 0.3;
+  }
+  if (i < o) {
+    const f = u(e, "optimal");
+    r(e, f, "outOfRange", o - i);
+  }
+  const p = u(e, "optimal");
+  return r(e, p, "inRange", t), e;
+}
+export {
+  h as distributePoints
+};

package/dist/pageComponents/StillHaveQuestions/StillHaveQuestions.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../components/Button/Button.cjs.js"),c=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),d=require("../../components/Typography/Typography.cjs.js"),n=require("../../utils/cn/cn.cjs.js"),t=require("./stillHaveQuestions.module.css.cjs.js"),m=require("./assets/stillHaveQuestions.jpg.cjs.js"),h=require("./assets/joinOurTeam.jpg.cjs.js"),g=({variant:i="StillHaveQuestions"})=>{const s={StillHaveQuestions:{title:e.jsxs(e.Fragment,{children:["Still Have ",e.jsx("b",{children:"questions?"})]}),buttonText:"Contact Us",buttonLink:"/contact-us",image:m.default},JoinOurTeam:{title:e.jsxs(e.Fragment,{children:["Have a passion for ",e.jsx("b",{children:"longevity science?"})]}),buttonText:"Join Our Team",buttonLink:"https://careers.gethealthspan.com/",image:h.default}},{title:o,buttonText:a,buttonLink:l,image:r}=s[i];return e.jsx("section",{className:t.default.root,children:e.jsx("div",{className:n.cn(t.default.imageWrapper,{[t.default.joinOurTeam]:i==="JoinOurTeam"}),style:{backgroundImage:`url(${r})`},children:e.jsxs("div",{className:n.cn(t.default.contentBox,{[t.default.joinOurTeam]:i==="JoinOurTeam"}),children:[e.jsx(c.HighlightedTitle,{colorScheme:"dark",title:e.jsx(d.Typography,{as:"p",defaultVariant:"displayMd",mobileVariant:"displayXs",children:o})}),e.jsx("div",{className:t.default.actions,children:e.jsx(u.Button,{as:"a",href:l,variant:"secondary",size:"lg",children:a})})]})})})};exports.StillHaveQuestions=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../components/Button/Button.cjs.js"),c=require("../../components/HighlightedTitle/HighlightedTitle.cjs.js"),d=require("../../components/Typography/Typography.cjs.js"),n=require("../../utils/cn/cn.cjs.js"),t=require("./stillHaveQuestions.module.css.cjs.js"),m=require("./assets/stillHaveQuestions.jpg.cjs.js"),h=require("./assets/joinOurTeam.jpg.cjs.js"),g=({variant:i="StillHaveQuestions"})=>{const s={StillHaveQuestions:{title:e.jsxs(e.Fragment,{children:["Still have ",e.jsx("b",{children:"questions?"})]}),buttonText:"Contact Us",buttonLink:"/contact-us",image:m.default},JoinOurTeam:{title:e.jsxs(e.Fragment,{children:["Have a passion for ",e.jsx("b",{children:"longevity science?"})]}),buttonText:"Join Our Team",buttonLink:"https://careers.gethealthspan.com/",image:h.default}},{title:o,buttonText:a,buttonLink:l,image:r}=s[i];return e.jsx("section",{className:t.default.root,children:e.jsx("div",{className:n.cn(t.default.imageWrapper,{[t.default.joinOurTeam]:i==="JoinOurTeam"}),style:{backgroundImage:`url(${r})`},children:e.jsxs("div",{className:n.cn(t.default.contentBox,{[t.default.joinOurTeam]:i==="JoinOurTeam"}),children:[e.jsx(c.HighlightedTitle,{colorScheme:"dark",title:e.jsx(d.Typography,{as:"p",defaultVariant:"displayMd",mobileVariant:"displayXs",children:o})}),e.jsx("div",{className:t.default.actions,children:e.jsx(u.Button,{as:"a",href:l,variant:"secondary",size:"lg",children:a})})]})})})};exports.StillHaveQuestions=g;

package/dist/pageComponents/StillHaveQuestions/StillHaveQuestions.es.js

@@ -1,21 +1,21 @@
 import { jsxs as o, jsx as t, Fragment as n } from "react/jsx-runtime";
 import { Button as u } from "../../components/Button/Button.es.js";
 import { HighlightedTitle as d } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
-import { Typography as p } from "../../components/Typography/Typography.es.js";
+import { Typography as h } from "../../components/Typography/Typography.es.js";
 import { cn as r } from "../../utils/cn/cn.es.js";
 import e from "./stillHaveQuestions.module.css.es.js";
-import h from "./assets/stillHaveQuestions.jpg.es.js";
+import p from "./assets/stillHaveQuestions.jpg.es.js";
 import g from "./assets/joinOurTeam.jpg.es.js";
-const O = ({ variant: i = "StillHaveQuestions" }) => {
+const H = ({ variant: i = "StillHaveQuestions" }) => {
   const a = {
     StillHaveQuestions: {
       title: /* @__PURE__ */ o(n, { children: [
-        "Still Have ",
+        "Still have ",
         /* @__PURE__ */ t("b", { children: "questions?" })
       ] }),
       buttonText: "Contact Us",
       buttonLink: "/contact-us",
-      image: h
+      image: p
     },
     JoinOurTeam: {
       title: /* @__PURE__ */ o(n, { children: [
@@ -39,7 +39,7 @@ const O = ({ variant: i = "StillHaveQuestions" }) => {
           d,
           {
             colorScheme: "dark",
-            title: /* @__PURE__ */ t(p, { as: "p", defaultVariant: "displayMd", mobileVariant: "displayXs", children: s })
+            title: /* @__PURE__ */ t(h, { as: "p", defaultVariant: "displayMd", mobileVariant: "displayXs", children: s })
           }
         ),
         /* @__PURE__ */ t("div", { className: e.actions, children: /* @__PURE__ */ t(u, { as: "a", href: m, variant: "secondary", size: "lg", children: l }) })
@@ -48,5 +48,5 @@ const O = ({ variant: i = "StillHaveQuestions" }) => {
   ) });
 };
 export {
-  O as StillHaveQuestions
+  H as StillHaveQuestions
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@zenpatient-org/healthspan-marketing-ui",
-    "version": "0.1.125",
+    "version": "0.1.127",
     "description": "Design system",
     "main": "dist/index.cjs.js",
     "module": "dist/index.es.js",
@@ -551,6 +551,11 @@
             "import": "./dist/modules/HSModal/HSModal.es.js",
             "require": "./dist/modules/HSModal/HSModal.cjs.js"
         },
+        "./ScienceHero": {
+            "types": "./dist/modules/ScienceHero/ScienceHero.d.ts",
+            "import": "./dist/modules/ScienceHero/ScienceHero.es.js",
+            "require": "./dist/modules/ScienceHero/ScienceHero.cjs.js"
+        },
         "./Bubbles": {
             "types": "./dist/pageComponents/Bubbles/Bubbles.d.ts",
             "import": "./dist/pageComponents/Bubbles/Bubbles.es.js",