@zenpatient-org/healthspan-marketing-ui 0.2.10 → 0.2.11
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.
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../../types/analytics/analytics.cjs.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../../types/analytics/analytics.cjs.js"),l=require("../../utils/cn/cn.cjs.js"),a=require("../../src/modules/IndividualProductCardV2/individualProductCardV2.module.css"),g=require("../../components/ImageGallery/ImageGallery.cjs.js"),d=require("../../components/RatingPreview/RatingPreview.cjs.js"),v=require("../../components/Quote/Quote.cjs.js"),n=require("../../components/Typography/Typography.cjs.js"),_=require("../IndividualProductCard/components/Features/Features.cjs.js"),P=require("../../components/PlainFeaturesGroup/PlainFeaturesGroup.cjs.js"),b=require("../../components/PriceDisplay/PriceDisplay.cjs.js"),q=require("../../components/Button/Button.cjs.js"),T=({zenpatientId:u,signupUrl:s,name:y,description:p,label:m,images:h,features:j,quote:t,priceDisplay:i,featuresGroup:r,ratingPreview:c})=>{const x={event:o.EAnalyticsEvent.ctaClicked,type:o.EAnalyticsEventType.interaction,component:"Pricing",payload:{ctaLabel:"GET STARTED",ctaLink:s,productId:u}};return e.jsx("section",{className:a.root,children:e.jsxs("div",{className:a.mainContainer,children:[e.jsxs("div",{className:a.leftColumn,children:[e.jsx(g.ImageGallery,{images:h,label:m}),e.jsx("div",{className:l.cn(a.ratingContainer,a.mobileOnly),children:e.jsx(d.RatingPreview,{...c})}),t&&e.jsx(v.Quote,{...t})]}),e.jsxs("div",{className:a.rightColumn,children:[e.jsxs("div",{className:a.header,children:[e.jsx(n.Typography,{as:"h1",defaultVariant:"displayXs",mobileVariant:"headingLg",children:y}),e.jsx(n.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",className:a.description,children:p})]}),e.jsx(_.Features,{features:j}),r&&e.jsx(P.PlainFeaturesGroup,{...r}),i&&e.jsx(b.PriceDisplay,{items:i}),e.jsx("div",{className:l.cn(a.ratingContainer,a.desktopOnly),children:e.jsx(d.RatingPreview,{...c})}),e.jsxs("div",{className:a.actions,children:[e.jsx(q.Button,{variant:"primary",size:"lg",href:s,analyticsProps:x,children:"Get started"}),e.jsx(n.Typography,{as:"p",defaultVariant:"labelMd",className:a.hsaFsaText,children:"HSA/FSA Eligible"})]})]})]})})};exports.IndividualProductCardV2=T;
|
|
@@ -1,70 +1,69 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { EAnalyticsEventType as
|
|
1
|
+
import { jsx as a, jsxs as r } from "react/jsx-runtime";
|
|
2
|
+
import { EAnalyticsEventType as N, EAnalyticsEvent as b } from "../../types/analytics/analytics.es.js";
|
|
3
3
|
import { cn as m } from "../../utils/cn/cn.es.js";
|
|
4
|
-
import
|
|
5
|
-
import { ImageGallery as
|
|
6
|
-
import { RatingPreview as
|
|
4
|
+
import i from "../../modules/IndividualProductCardV2/individualProductCardV2.module.css";
|
|
5
|
+
import { ImageGallery as g } from "../../components/ImageGallery/ImageGallery.es.js";
|
|
6
|
+
import { RatingPreview as c } from "../../components/RatingPreview/RatingPreview.es.js";
|
|
7
7
|
import { Quote as E } from "../../components/Quote/Quote.es.js";
|
|
8
|
-
import { Typography as
|
|
8
|
+
import { Typography as t } from "../../components/Typography/Typography.es.js";
|
|
9
9
|
import { Features as C } from "../IndividualProductCard/components/Features/Features.es.js";
|
|
10
10
|
import { PlainFeaturesGroup as A } from "../../components/PlainFeaturesGroup/PlainFeaturesGroup.es.js";
|
|
11
11
|
import { PriceDisplay as T } from "../../components/PriceDisplay/PriceDisplay.es.js";
|
|
12
|
-
import { Button as
|
|
13
|
-
|
|
14
|
-
const H = ({
|
|
12
|
+
import { Button as V } from "../../components/Button/Button.es.js";
|
|
13
|
+
const z = ({
|
|
15
14
|
zenpatientId: d,
|
|
16
|
-
signupUrl:
|
|
15
|
+
signupUrl: e,
|
|
17
16
|
name: p,
|
|
18
17
|
description: h,
|
|
19
18
|
label: y,
|
|
20
19
|
images: f,
|
|
21
20
|
features: v,
|
|
22
|
-
quote:
|
|
23
|
-
priceDisplay:
|
|
24
|
-
featuresGroup:
|
|
25
|
-
ratingPreview:
|
|
21
|
+
quote: n,
|
|
22
|
+
priceDisplay: o,
|
|
23
|
+
featuresGroup: l,
|
|
24
|
+
ratingPreview: s
|
|
26
25
|
}) => {
|
|
27
26
|
const u = {
|
|
28
|
-
event:
|
|
29
|
-
type:
|
|
27
|
+
event: b.ctaClicked,
|
|
28
|
+
type: N.interaction,
|
|
30
29
|
component: "Pricing",
|
|
31
30
|
payload: {
|
|
32
31
|
ctaLabel: "GET STARTED",
|
|
33
|
-
ctaLink:
|
|
32
|
+
ctaLink: e,
|
|
34
33
|
productId: d
|
|
35
34
|
}
|
|
36
35
|
};
|
|
37
|
-
return /* @__PURE__ */
|
|
38
|
-
/* @__PURE__ */
|
|
39
|
-
/* @__PURE__ */
|
|
40
|
-
/* @__PURE__ */
|
|
41
|
-
|
|
36
|
+
return /* @__PURE__ */ a("section", { className: i.root, children: /* @__PURE__ */ r("div", { className: i.mainContainer, children: [
|
|
37
|
+
/* @__PURE__ */ r("div", { className: i.leftColumn, children: [
|
|
38
|
+
/* @__PURE__ */ a(g, { images: f, label: y }),
|
|
39
|
+
/* @__PURE__ */ a("div", { className: m(i.ratingContainer, i.mobileOnly), children: /* @__PURE__ */ a(c, { ...s }) }),
|
|
40
|
+
n && /* @__PURE__ */ a(E, { ...n })
|
|
42
41
|
] }),
|
|
43
|
-
/* @__PURE__ */
|
|
44
|
-
/* @__PURE__ */
|
|
45
|
-
/* @__PURE__ */
|
|
46
|
-
/* @__PURE__ */
|
|
47
|
-
|
|
42
|
+
/* @__PURE__ */ r("div", { className: i.rightColumn, children: [
|
|
43
|
+
/* @__PURE__ */ r("div", { className: i.header, children: [
|
|
44
|
+
/* @__PURE__ */ a(t, { as: "h1", defaultVariant: "displayXs", mobileVariant: "headingLg", children: p }),
|
|
45
|
+
/* @__PURE__ */ a(
|
|
46
|
+
t,
|
|
48
47
|
{
|
|
49
48
|
as: "p",
|
|
50
49
|
defaultVariant: "bodyMd",
|
|
51
50
|
mobileVariant: "bodySm",
|
|
52
|
-
className:
|
|
51
|
+
className: i.description,
|
|
53
52
|
children: h
|
|
54
53
|
}
|
|
55
54
|
)
|
|
56
55
|
] }),
|
|
57
|
-
/* @__PURE__ */
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
/* @__PURE__ */
|
|
61
|
-
/* @__PURE__ */
|
|
62
|
-
/* @__PURE__ */
|
|
63
|
-
/* @__PURE__ */
|
|
56
|
+
/* @__PURE__ */ a(C, { features: v }),
|
|
57
|
+
l && /* @__PURE__ */ a(A, { ...l }),
|
|
58
|
+
o && /* @__PURE__ */ a(T, { items: o }),
|
|
59
|
+
/* @__PURE__ */ a("div", { className: m(i.ratingContainer, i.desktopOnly), children: /* @__PURE__ */ a(c, { ...s }) }),
|
|
60
|
+
/* @__PURE__ */ r("div", { className: i.actions, children: [
|
|
61
|
+
/* @__PURE__ */ a(V, { variant: "primary", size: "lg", href: e, analyticsProps: u, children: "Get started" }),
|
|
62
|
+
/* @__PURE__ */ a(t, { as: "p", defaultVariant: "labelMd", className: i.hsaFsaText, children: "HSA/FSA Eligible" })
|
|
64
63
|
] })
|
|
65
64
|
] })
|
|
66
65
|
] }) });
|
|
67
66
|
};
|
|
68
67
|
export {
|
|
69
|
-
|
|
68
|
+
z as IndividualProductCardV2
|
|
70
69
|
};
|
|
@@ -63,6 +63,14 @@
|
|
|
63
63
|
display: block;
|
|
64
64
|
}
|
|
65
65
|
|
|
66
|
+
.hsaFsaText {
|
|
67
|
+
background-color: var(--color-bg-neutral-light);
|
|
68
|
+
text-align: center;
|
|
69
|
+
padding: 1rem;
|
|
70
|
+
width: 100%;
|
|
71
|
+
border-radius: var(--border-radius-md);
|
|
72
|
+
}
|
|
73
|
+
|
|
66
74
|
@media (width <= 1024px) {
|
|
67
75
|
.mainContainer {
|
|
68
76
|
padding: 2rem 1rem;
|