@zenpatient-org/healthspan-marketing-ui 0.1.78 → 0.1.79
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.
- package/dist/healthspan-marketing-ui.css +1 -1
- package/dist/modules/Grid/Grid.cjs.js +1 -0
- package/dist/modules/Grid/Grid.d.ts +20 -0
- package/dist/modules/Grid/Grid.es.js +90 -0
- package/dist/modules/Grid/grid.module.css.cjs.js +1 -0
- package/dist/modules/Grid/grid.module.css.es.js +47 -0
- package/dist/modules/Grid/index.d.ts +1 -0
- package/package.json +6 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),s=require("../../components/Typography/Typography.cjs.js"),e=require("./grid.module.css.cjs.js"),r=({image:t,title:i,description:l})=>a.jsxs("div",{className:e.default.mobileContent,children:[a.jsx("div",{className:e.default.leftBorder}),a.jsxs("div",{className:e.default.mobileColumn,children:[a.jsx("img",{className:e.default.image,src:t}),a.jsxs("div",{className:e.default.mobileText,children:[a.jsx(s.Typography,{as:"p",defaultVariant:"headingSm",mobileVariant:"headingSm",children:i}),a.jsx(s.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodyMd",children:l})]})]}),a.jsx("div",{className:e.default.rightBorder})]}),n=({headline:t,topRow:i,middleRow:l,bottomRow:d,backgroundGradient:c})=>a.jsx("section",{className:e.default.root,"data-background":c,children:a.jsxs("div",{className:e.default.container,children:[a.jsx(s.Typography,{className:e.default.headline,as:"h2",defaultVariant:"displayXs",mobileVariant:"headingXl",children:t}),a.jsxs("div",{className:e.default.desktopGrid,children:[a.jsxs("div",{className:e.default.leftColumn,children:[a.jsxs("div",{className:e.default.halfVector,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsx("div",{className:e.default.horizontalVector})]}),a.jsxs("div",{className:e.default.row,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsxs("div",{className:e.default.leftText,children:[a.jsx(s.Typography,{as:"p",defaultVariant:"headingSm",mobileVariant:"headingSm",children:l.title}),a.jsx(s.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodyMd",children:l.description})]}),a.jsx("div",{className:e.default.horizontalVector})]}),a.jsxs("div",{className:e.default.halfVector,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsx("div",{className:e.default.horizontalVector})]})]}),a.jsxs("div",{className:e.default.midColumn,children:[a.jsx("img",{className:e.default.image,src:i.image}),a.jsx("img",{className:e.default.image,src:l.image}),a.jsx("img",{className:e.default.image,src:d.image})]}),a.jsxs("div",{className:e.default.rightColumn,children:[a.jsxs("div",{className:e.default.halfVector,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsx("div",{className:e.default.horizontalVector})]}),a.jsxs("div",{className:e.default.row,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsxs("div",{className:e.default.rightTopText,children:[a.jsx(s.Typography,{as:"p",defaultVariant:"headingSm",mobileVariant:"headingSm",children:i.title}),a.jsx(s.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodyMd",children:i.description})]}),a.jsx("div",{className:e.default.horizontalVector})]}),a.jsx("div",{className:e.default.rightVector}),a.jsxs("div",{className:e.default.row,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsxs("div",{className:e.default.rightBotText,children:[a.jsx(s.Typography,{as:"p",defaultVariant:"headingSm",mobileVariant:"headingSm",children:d.title}),a.jsx(s.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodyMd",children:d.description})]}),a.jsx("div",{className:e.default.horizontalVector})]}),a.jsxs("div",{className:e.default.halfVector,children:[a.jsx("div",{className:e.default.horizontalVector}),a.jsx("div",{className:e.default.horizontalVector})]})]})]}),a.jsxs("div",{className:e.default.mobileGrid,children:[a.jsx(r,{image:i.image,title:i.title,description:i.description}),a.jsx(r,{image:l.image,title:l.title,description:l.description}),a.jsx(r,{image:d.image,title:d.title,description:d.description})]})]})});exports.Grid=n;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export type GridProps = {
|
|
2
|
+
headline: string;
|
|
3
|
+
topRow: {
|
|
4
|
+
image: string;
|
|
5
|
+
title: string;
|
|
6
|
+
description: string;
|
|
7
|
+
};
|
|
8
|
+
middleRow: {
|
|
9
|
+
image: string;
|
|
10
|
+
title: string;
|
|
11
|
+
description: string;
|
|
12
|
+
};
|
|
13
|
+
bottomRow: {
|
|
14
|
+
image: string;
|
|
15
|
+
title: string;
|
|
16
|
+
description: string;
|
|
17
|
+
};
|
|
18
|
+
backgroundGradient: 'blue' | 'yellow' | 'grey';
|
|
19
|
+
};
|
|
20
|
+
export declare const Grid: ({ headline, topRow, middleRow, bottomRow, backgroundGradient }: GridProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
import { jsx as i, jsxs as e } from "react/jsx-runtime";
|
|
2
|
+
import { Typography as l } from "../../components/Typography/Typography.es.js";
|
|
3
|
+
import a from "./grid.module.css.es.js";
|
|
4
|
+
const t = ({ image: c, title: r, description: s }) => /* @__PURE__ */ e("div", { className: a.mobileContent, children: [
|
|
5
|
+
/* @__PURE__ */ i("div", { className: a.leftBorder }),
|
|
6
|
+
/* @__PURE__ */ e("div", { className: a.mobileColumn, children: [
|
|
7
|
+
/* @__PURE__ */ i("img", { className: a.image, src: c }),
|
|
8
|
+
/* @__PURE__ */ e("div", { className: a.mobileText, children: [
|
|
9
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "headingSm", mobileVariant: "headingSm", children: r }),
|
|
10
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodyMd", children: s })
|
|
11
|
+
] })
|
|
12
|
+
] }),
|
|
13
|
+
/* @__PURE__ */ i("div", { className: a.rightBorder })
|
|
14
|
+
] }), N = ({ headline: c, topRow: r, middleRow: s, bottomRow: d, backgroundGradient: n }) => /* @__PURE__ */ i("section", { className: a.root, "data-background": n, children: /* @__PURE__ */ e("div", { className: a.container, children: [
|
|
15
|
+
/* @__PURE__ */ i(l, { className: a.headline, as: "h2", defaultVariant: "displayXs", mobileVariant: "headingXl", children: c }),
|
|
16
|
+
/* @__PURE__ */ e("div", { className: a.desktopGrid, children: [
|
|
17
|
+
/* @__PURE__ */ e("div", { className: a.leftColumn, children: [
|
|
18
|
+
/* @__PURE__ */ e("div", { className: a.halfVector, children: [
|
|
19
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
20
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
21
|
+
] }),
|
|
22
|
+
/* @__PURE__ */ e("div", { className: a.row, children: [
|
|
23
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
24
|
+
/* @__PURE__ */ e("div", { className: a.leftText, children: [
|
|
25
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "headingSm", mobileVariant: "headingSm", children: s.title }),
|
|
26
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodyMd", children: s.description })
|
|
27
|
+
] }),
|
|
28
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
29
|
+
] }),
|
|
30
|
+
/* @__PURE__ */ e("div", { className: a.halfVector, children: [
|
|
31
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
32
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
33
|
+
] })
|
|
34
|
+
] }),
|
|
35
|
+
/* @__PURE__ */ e("div", { className: a.midColumn, children: [
|
|
36
|
+
/* @__PURE__ */ i("img", { className: a.image, src: r.image }),
|
|
37
|
+
/* @__PURE__ */ i("img", { className: a.image, src: s.image }),
|
|
38
|
+
/* @__PURE__ */ i("img", { className: a.image, src: d.image })
|
|
39
|
+
] }),
|
|
40
|
+
/* @__PURE__ */ e("div", { className: a.rightColumn, children: [
|
|
41
|
+
/* @__PURE__ */ e("div", { className: a.halfVector, children: [
|
|
42
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
43
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
44
|
+
] }),
|
|
45
|
+
/* @__PURE__ */ e("div", { className: a.row, children: [
|
|
46
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
47
|
+
/* @__PURE__ */ e("div", { className: a.rightTopText, children: [
|
|
48
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "headingSm", mobileVariant: "headingSm", children: r.title }),
|
|
49
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodyMd", children: r.description })
|
|
50
|
+
] }),
|
|
51
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
52
|
+
] }),
|
|
53
|
+
/* @__PURE__ */ i("div", { className: a.rightVector }),
|
|
54
|
+
/* @__PURE__ */ e("div", { className: a.row, children: [
|
|
55
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
56
|
+
/* @__PURE__ */ e("div", { className: a.rightBotText, children: [
|
|
57
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "headingSm", mobileVariant: "headingSm", children: d.title }),
|
|
58
|
+
/* @__PURE__ */ i(l, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodyMd", children: d.description })
|
|
59
|
+
] }),
|
|
60
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
61
|
+
] }),
|
|
62
|
+
/* @__PURE__ */ e("div", { className: a.halfVector, children: [
|
|
63
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector }),
|
|
64
|
+
/* @__PURE__ */ i("div", { className: a.horizontalVector })
|
|
65
|
+
] })
|
|
66
|
+
] })
|
|
67
|
+
] }),
|
|
68
|
+
/* @__PURE__ */ e("div", { className: a.mobileGrid, children: [
|
|
69
|
+
/* @__PURE__ */ i(t, { image: r.image, title: r.title, description: r.description }),
|
|
70
|
+
/* @__PURE__ */ i(
|
|
71
|
+
t,
|
|
72
|
+
{
|
|
73
|
+
image: s.image,
|
|
74
|
+
title: s.title,
|
|
75
|
+
description: s.description
|
|
76
|
+
}
|
|
77
|
+
),
|
|
78
|
+
/* @__PURE__ */ i(
|
|
79
|
+
t,
|
|
80
|
+
{
|
|
81
|
+
image: d.image,
|
|
82
|
+
title: d.title,
|
|
83
|
+
description: d.description
|
|
84
|
+
}
|
|
85
|
+
)
|
|
86
|
+
] })
|
|
87
|
+
] }) });
|
|
88
|
+
export {
|
|
89
|
+
N as Grid
|
|
90
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o="grid-module__root___ENM5W",e="grid-module__container___npDAJ",t="grid-module__headline___cpLmE",_="grid-module__desktopGrid___xqK2R",r="grid-module__halfVector___K4N6M",i="grid-module__leftColumn___tsd-g",l="grid-module__rightColumn___ql0JS",d="grid-module__midColumn___pEZBo",n="grid-module__row___Uiqg0",m="grid-module__horizontalVector___rpCfN",g="grid-module__leftText___f7WFx",u="grid-module__rightTopText___9zVt1",c="grid-module__rightBotText___FdPY1",s="grid-module__image___vodyp",h="grid-module__rightVector___9dOwd",a="grid-module__mobileGrid___by4fK",C="grid-module__mobileColumn___bg2lL",f="grid-module__mobileText___a4VLJ",T="grid-module__mobileContent___C6dxe",b="grid-module__leftBorder___qmeje",x="grid-module__rightBorder___ady0d",p={root:o,container:e,headline:t,desktopGrid:_,halfVector:r,leftColumn:i,rightColumn:l,midColumn:d,row:n,horizontalVector:m,leftText:g,rightTopText:u,rightBotText:c,image:s,rightVector:h,mobileGrid:a,mobileColumn:C,mobileText:f,mobileContent:T,leftBorder:b,rightBorder:x};exports.container=e;exports.default=p;exports.desktopGrid=_;exports.halfVector=r;exports.headline=t;exports.horizontalVector=m;exports.image=s;exports.leftBorder=b;exports.leftColumn=i;exports.leftText=g;exports.midColumn=d;exports.mobileColumn=C;exports.mobileContent=T;exports.mobileGrid=a;exports.mobileText=f;exports.rightBorder=x;exports.rightBotText=c;exports.rightColumn=l;exports.rightTopText=u;exports.rightVector=h;exports.root=o;exports.row=n;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
const o = "grid-module__root___ENM5W", _ = "grid-module__container___npDAJ", e = "grid-module__headline___cpLmE", t = "grid-module__desktopGrid___xqK2R", r = "grid-module__halfVector___K4N6M", d = "grid-module__leftColumn___tsd-g", i = "grid-module__rightColumn___ql0JS", l = "grid-module__midColumn___pEZBo", m = "grid-module__row___Uiqg0", n = "grid-module__horizontalVector___rpCfN", g = "grid-module__leftText___f7WFx", c = "grid-module__rightTopText___9zVt1", u = "grid-module__rightBotText___FdPY1", s = "grid-module__image___vodyp", h = "grid-module__rightVector___9dOwd", a = "grid-module__mobileGrid___by4fK", C = "grid-module__mobileColumn___bg2lL", f = "grid-module__mobileText___a4VLJ", x = "grid-module__mobileContent___C6dxe", T = "grid-module__leftBorder___qmeje", b = "grid-module__rightBorder___ady0d", p = {
|
|
2
|
+
root: o,
|
|
3
|
+
container: _,
|
|
4
|
+
headline: e,
|
|
5
|
+
desktopGrid: t,
|
|
6
|
+
halfVector: r,
|
|
7
|
+
leftColumn: d,
|
|
8
|
+
rightColumn: i,
|
|
9
|
+
midColumn: l,
|
|
10
|
+
row: m,
|
|
11
|
+
horizontalVector: n,
|
|
12
|
+
leftText: g,
|
|
13
|
+
rightTopText: c,
|
|
14
|
+
rightBotText: u,
|
|
15
|
+
image: s,
|
|
16
|
+
rightVector: h,
|
|
17
|
+
mobileGrid: a,
|
|
18
|
+
mobileColumn: C,
|
|
19
|
+
mobileText: f,
|
|
20
|
+
mobileContent: x,
|
|
21
|
+
leftBorder: T,
|
|
22
|
+
rightBorder: b
|
|
23
|
+
};
|
|
24
|
+
export {
|
|
25
|
+
_ as container,
|
|
26
|
+
p as default,
|
|
27
|
+
t as desktopGrid,
|
|
28
|
+
r as halfVector,
|
|
29
|
+
e as headline,
|
|
30
|
+
n as horizontalVector,
|
|
31
|
+
s as image,
|
|
32
|
+
T as leftBorder,
|
|
33
|
+
d as leftColumn,
|
|
34
|
+
g as leftText,
|
|
35
|
+
l as midColumn,
|
|
36
|
+
C as mobileColumn,
|
|
37
|
+
x as mobileContent,
|
|
38
|
+
a as mobileGrid,
|
|
39
|
+
f as mobileText,
|
|
40
|
+
b as rightBorder,
|
|
41
|
+
u as rightBotText,
|
|
42
|
+
i as rightColumn,
|
|
43
|
+
c as rightTopText,
|
|
44
|
+
h as rightVector,
|
|
45
|
+
o as root,
|
|
46
|
+
m as row
|
|
47
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Grid } from './Grid';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zenpatient-org/healthspan-marketing-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.79",
|
|
4
4
|
"description": "Design system",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"module": "dist/index.es.js",
|
|
@@ -601,6 +601,11 @@
|
|
|
601
601
|
"import": "./dist/pageComponents/CallToActionDefault/CallToActionDefault.es.js",
|
|
602
602
|
"require": "./dist/pageComponents/CallToActionDefault/CallToActionDefault.cjs.js"
|
|
603
603
|
},
|
|
604
|
+
"./Grid": {
|
|
605
|
+
"types": "./dist/modules/Grid/Grid.d.ts",
|
|
606
|
+
"import": "./dist/modules/Grid/Grid.es.js",
|
|
607
|
+
"require": "./dist/modules/Grid/Grid.cjs.js"
|
|
608
|
+
},
|
|
604
609
|
"./dist/*.css": "./dist/*.css"
|
|
605
610
|
}
|
|
606
611
|
}
|