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

package/dist/modules/Testimonial/components/TextCard/TextCard.es.js

@@ -1,30 +1,30 @@
 import { jsxs as r, jsx as t } from "react/jsx-runtime";
-import { Typography as n } from "../../../../components/Typography/Typography.es.js";
+import n from "../../../../modules/Testimonial/components/TextCard/textCard.module.css";
 import { RatingStars as d } from "../../../../components/RatingStars/RatingStars.es.js";
+import { Typography as s } from "../../../../components/Typography/Typography.es.js";
 import { Product as h } from "../Product/Product.es.js";
-import s from "./textCard.module.css.es.js";
 const b = ({ background: o, review: a, product: l }) => {
   var m, i;
-  return /* @__PURE__ */ r("div", { className: s.root, style: { backgroundImage: `url(${o.url})` }, children: [
+  return /* @__PURE__ */ r("div", { className: n.root, style: { backgroundImage: `url(${o.url})` }, children: [
     /* @__PURE__ */ t("div", { children: !!a.stars && /* @__PURE__ */ t(d, { rating: a.stars, size: "lg" }) }),
-    /* @__PURE__ */ r("div", { className: s.reviewContainer, children: [
-      (a == null ? void 0 : a.title) && /* @__PURE__ */ t(n, { as: "h3", defaultVariant: "headingSm", mobileVariant: "headingXs", weight: "regular", children: a.title }),
-      (a == null ? void 0 : a.description) && /* @__PURE__ */ t(n, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", weight: "regular", children: a.description }),
+    /* @__PURE__ */ r("div", { className: n.reviewContainer, children: [
+      (a == null ? void 0 : a.title) && /* @__PURE__ */ t(s, { as: "h3", defaultVariant: "headingSm", mobileVariant: "headingXs", weight: "regular", children: a.title }),
+      (a == null ? void 0 : a.description) && /* @__PURE__ */ t(s, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", weight: "regular", children: a.description }),
       ((m = a == null ? void 0 : a.author) == null ? void 0 : m.name) && /* @__PURE__ */ t(
-        n,
+        s,
         {
           as: "p",
           defaultVariant: "labelSm",
           mobileVariant: "labelXs",
           weight: "regular",
           emphasis: !0,
-          className: s.reviewAuthor,
+          className: n.reviewAuthor,
           children: a.author.name
         }
       )
     ] }),
-    /* @__PURE__ */ r("div", { className: s.infoContainer, children: [
-      ((i = a == null ? void 0 : a.author) == null ? void 0 : i.username) && /* @__PURE__ */ t(n, { as: "p", defaultVariant: "labelSm", mobileVariant: "labelXs", emphasis: !0, weight: "regular", children: a.author.username }),
+    /* @__PURE__ */ r("div", { className: n.infoContainer, children: [
+      ((i = a == null ? void 0 : a.author) == null ? void 0 : i.username) && /* @__PURE__ */ t(s, { as: "p", defaultVariant: "labelSm", mobileVariant: "labelXs", emphasis: !0, weight: "regular", children: a.author.username }),
       l && /* @__PURE__ */ t(h, { image: l.image, name: l.name, link: l.link })
     ] })
   ] });

package/dist/modules/Testimonial/components/TextCard/textCard.module.css

@@ -0,0 +1,45 @@
+.root {
+    position: relative;
+    width: 360px;
+    height: 640px;
+    flex-shrink: 0;
+    border-radius: var(--border-radius-sm);
+    aspect-ratio: 9/16;
+    overflow: hidden;
+    color: var(--color-text-primary-inverted);
+    padding: var(--spacing-24);
+    background-color: var(--color-bg-fill-alpha-black-10);
+    background-position: 50% 50%;
+    background-size: cover;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: flex-start;
+}
+
+.reviewContainer {
+    display: flex;
+    width: 100%;
+    flex-direction: column;
+    gap: var(--spacing-16);
+}
+
+.reviewAuthor {
+    margin-top: var(--spacing-8);
+}
+
+.infoContainer {
+    display: flex;
+    width: 100%;
+    flex-direction: column;
+    gap: 8px;
+    z-index: 1;
+}
+
+@media screen and (width <= 768px) {
+    .root {
+        width: 278px;
+        height: 494px;
+        padding: var(--spacing-16);
+    }
+}

package/dist/modules/Testimonial/components/VideoCard/VideoCard.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("react"),y=require("../../../../components/Typography/Typography.cjs.js"),p=require("../../../../components/PlayButton/PlayButton.cjs.js"),g=require("../../../../utils/cn/cn.cjs.js"),h=require("../Product/Product.cjs.js"),n=require("./videoCard.module.css.cjs.js"),j=({product:l,review:i,background:d,isActive:f})=>{var m;const[r,t]=s.useState(!1),a=s.useRef(null),c=s.useRef(null);return s.useEffect(()=>{const o=new IntersectionObserver(([u])=>{!u.isIntersecting&&r&&t(!1)},{threshold:.2});return c.current&&o.observe(c.current),()=>o.disconnect()},[r]),s.useEffect(()=>{f||t(!1)},[f]),s.useEffect(()=>{!r&&a.current&&(a.current.pause(),a.current.currentTime=0)},[r]),e.jsxs("div",{className:n.default.root,ref:c,onClick:()=>r?t(!1):void 0,style:{backgroundImage:`url(${d.preview})`},children:[e.jsxs("div",{className:n.default.mediaContainer,children:[e.jsx("video",{ref:a,src:d.url,playsInline:!0,controls:!1,muted:!1,onEnded:()=>t(!1),className:g.cn(n.default.media,!r&&n.default.mediaHidden)}),!r&&e.jsx("div",{className:n.default.playButton,children:e.jsx(p.PlayButton,{onClick:o=>{var u;o.stopPropagation(),(u=a.current)==null||u.play(),t(!0)}})})]}),e.jsxs("div",{className:n.default.infoContainer,children:[((m=i==null?void 0:i.author)==null?void 0:m.username)&&e.jsx(y.Typography,{as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:i.author.username}),l&&e.jsx(h.Product,{image:l.image,name:l.name,link:l.link})]})]})};exports.VideoCard=j;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),y=require("../../../../utils/cn/cn.cjs.js"),r=require("../../../../src/modules/Testimonial/components/VideoCard/videoCard.module.css"),p=require("../../../../components/PlayButton/PlayButton.cjs.js"),g=require("../../../../components/Typography/Typography.cjs.js"),h=require("../Product/Product.cjs.js"),j=({product:i,review:l,background:d,isActive:f})=>{var m;const[s,t]=n.useState(!1),a=n.useRef(null),u=n.useRef(null);return n.useEffect(()=>{const o=new IntersectionObserver(([c])=>{!c.isIntersecting&&s&&t(!1)},{threshold:.2});return u.current&&o.observe(u.current),()=>o.disconnect()},[s]),n.useEffect(()=>{f||t(!1)},[f]),n.useEffect(()=>{!s&&a.current&&(a.current.pause(),a.current.currentTime=0)},[s]),e.jsxs("div",{className:r.root,ref:u,onClick:()=>s?t(!1):void 0,style:{backgroundImage:`url(${d.preview})`},children:[e.jsxs("div",{className:r.mediaContainer,children:[e.jsx("video",{ref:a,src:d.url,playsInline:!0,controls:!1,muted:!1,onEnded:()=>t(!1),className:y.cn(r.media,!s&&r.mediaHidden)}),!s&&e.jsx("div",{className:r.playButton,children:e.jsx(p.PlayButton,{onClick:o=>{var c;o.stopPropagation(),(c=a.current)==null||c.play(),t(!0)}})})]}),e.jsxs("div",{className:r.infoContainer,children:[((m=l==null?void 0:l.author)==null?void 0:m.username)&&e.jsx(g.Typography,{as:"p",defaultVariant:"labelSm",mobileVariant:"labelXs",emphasis:!0,weight:"regular",children:l.author.username}),i&&e.jsx(h.Product,{image:i.image,name:i.name,link:i.link})]})]})};exports.VideoCard=j;

package/dist/modules/Testimonial/components/VideoCard/VideoCard.es.js

@@ -1,11 +1,11 @@
 "use client";
 import { jsxs as c, jsx as s } from "react/jsx-runtime";
 import { useState as g, useRef as h, useEffect as u } from "react";
-import { Typography as y } from "../../../../components/Typography/Typography.es.js";
+import { cn as y } from "../../../../utils/cn/cn.es.js";
+import r from "../../../../modules/Testimonial/components/VideoCard/videoCard.module.css";
 import { PlayButton as b } from "../../../../components/PlayButton/PlayButton.es.js";
-import { cn as v } from "../../../../utils/cn/cn.es.js";
+import { Typography as v } from "../../../../components/Typography/Typography.es.js";
 import { Product as C } from "../Product/Product.es.js";
-import r from "./videoCard.module.css.es.js";
 const j = ({ product: t, review: i, background: f, isActive: d }) => {
   var p;
   const [e, n] = g(!1), a = h(null), m = h(null);
@@ -39,7 +39,7 @@ const j = ({ product: t, review: i, background: f, isActive: d }) => {
               controls: !1,
               muted: !1,
               onEnded: () => n(!1),
-              className: v(r.media, !e && r.mediaHidden)
+              className: y(r.media, !e && r.mediaHidden)
             }
           ),
           !e && /* @__PURE__ */ s("div", { className: r.playButton, children: /* @__PURE__ */ s(
@@ -53,7 +53,7 @@ const j = ({ product: t, review: i, background: f, isActive: d }) => {
           ) })
         ] }),
         /* @__PURE__ */ c("div", { className: r.infoContainer, children: [
-          ((p = i == null ? void 0 : i.author) == null ? void 0 : p.username) && /* @__PURE__ */ s(y, { as: "p", defaultVariant: "labelSm", mobileVariant: "labelXs", emphasis: !0, weight: "regular", children: i.author.username }),
+          ((p = i == null ? void 0 : i.author) == null ? void 0 : p.username) && /* @__PURE__ */ s(v, { as: "p", defaultVariant: "labelSm", mobileVariant: "labelXs", emphasis: !0, weight: "regular", children: i.author.username }),
           t && /* @__PURE__ */ s(C, { image: t.image, name: t.name, link: t.link })
         ] })
       ]

package/dist/modules/Testimonial/components/VideoCard/videoCard.module.css

@@ -0,0 +1,62 @@
+.root {
+    position: relative;
+    width: 360px;
+    height: 640px;
+    flex-shrink: 0;
+    border-radius: var(--border-radius-sm);
+    aspect-ratio: 9/16;
+    overflow: hidden;
+    color: var(--color-text-primary-inverted);
+    padding: var(--spacing-24);
+    background-color: var(--color-bg-fill-alpha-black-10);
+    background-position: 50% 50%;
+    background-size: cover;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+}
+
+.mediaContainer {
+    position: absolute;
+    left: 0;
+    top: 0;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    align-items: center;
+    justify-content: center;
+    border-radius: inherit;
+    overflow: hidden;
+}
+
+.media {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    cursor: pointer;
+}
+
+.mediaHidden {
+    display: none;
+}
+
+.playButton {
+    position: absolute;
+    cursor: pointer;
+}
+
+.infoContainer {
+    display: flex;
+    width: 100%;
+    flex-direction: column;
+    gap: 8px;
+    z-index: 1;
+}
+
+@media screen and (width <= 768px) {
+    .root {
+        width: 278px;
+        height: 494px;
+        padding: var(--spacing-16);
+    }
+}

package/dist/modules/Testimonial/testimonial.module.css

@@ -0,0 +1,108 @@
+.root {
+    width: 100%;
+    padding: var(--spacing-120) 0;
+    gap: var(--spacing-64);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+}
+
+.headerContainer {
+    display: flex;
+    width: 100%;
+    max-width: var(--content-max-width);
+    align-items: flex-start;
+    flex-direction: column;
+    padding: 0 var(--spacing-120);
+    gap: var(--spacing-12);
+}
+
+.headerRow {
+    display: flex;
+    width: 100%;
+    align-items: flex-end;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    gap: var(--spacing-24);
+}
+
+.ratingContainer {
+    display: flex;
+    width: 100%;
+    align-items: center;
+    justify-content: flex-start;
+    gap: var(--spacing-12);
+}
+
+.content {
+    max-width: 100%;
+    overflow: hidden;
+}
+
+.swiper {
+    width: 100%;
+}
+
+.swiperSlide {
+    width: auto;
+    flex-shrink: 0;
+    position: relative;
+    padding: 0 12px;
+}
+
+.swiperSlide:first-child {
+    padding-left: var(--spacing-120);
+}
+
+.swiperSlide:last-child {
+    padding-right: var(--spacing-120);
+}
+
+.mobile,
+.mobileNavigation {
+    display: none;
+}
+
+@media screen and (width <= 768px) {
+    .root {
+        padding: var(--spacing-64) 0;
+        gap: var(--spacing-40);
+    }
+
+    .headerContainer {
+        padding: 0 var(--spacing-20);
+    }
+
+    .ratingContainer {
+        gap: var(--spacing-8);
+    }
+
+    .swiperWrapper {
+        gap: var(--spacing-8);
+    }
+
+    .swiperSlide:first-child {
+        padding-left: var(--spacing-20);
+    }
+
+    .swiperSlide:last-child {
+        padding-right: var(--spacing-20);
+    }
+
+    .mobileNavigation {
+        display: inline-flex;
+        width: 100%;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .mobile {
+        display: inline-flex;
+    }
+
+    .desktop,
+    .desktopNavigation {
+        display: none;
+    }
+}

package/dist/modules/TextBlockAnimated/TextBlockAnimated.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("./textBlockAnimated.module.css.cjs.js"),i=require("../../node_modules/gsap/index.cjs.js"),l=require("../../node_modules/gsap/SplitText.cjs.js"),u=require("../../node_modules/gsap/ScrollTrigger.cjs.js"),d=require("../../node_modules/@gsap/react/src/index.cjs.js"),p=require("react"),s=require("../../components/Typography/Typography.cjs.js"),g=require("../../utils/cn/cn.cjs.js");i.gsap.registerPlugin(l.SplitText,u.ScrollTrigger);function m({label:a,body:n,colorScheme:c}){const t=p.useRef(null);return d.useGSAP(()=>{l.SplitText.create(t.current,{type:"words chars",className:e.default.bodyText,autoSplit:!0,onSplit:o=>i.gsap.from(o.chars,{stagger:2,opacity:.3,duration:1,scrollTrigger:{trigger:t.current,start:"top 70%",end:"top 30%",scrub:!0,markers:!1}})})},{scope:t}),r.jsx("div",{className:g.cn(e.default.root,e.default[c]),children:r.jsxs("div",{className:e.default.container,children:[a&&r.jsx(s.Typography,{as:"p",defaultVariant:"labelMd",mobileVariant:"labelSm",emphasis:!0,className:e.default.label,children:a}),r.jsxs(s.Typography,{as:"div",defaultVariant:"displayMd",mobileVariant:"headingMd",className:e.default.body,children:[a&&r.jsx("span",{className:e.default.spacer,children:" "}),r.jsx("p",{className:e.default.bodyText,ref:t,children:n})]})]})})}exports.TextBlockAnimated=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("../../src/modules/TextBlockAnimated/textBlockAnimated.module.css"),i=require("gsap"),c=require("../../node_modules/gsap/SplitText.cjs.js"),u=require("../../node_modules/gsap/ScrollTrigger.cjs.js"),p=require("@gsap/react"),d=require("react"),g=require("../../utils/cn/cn.cjs.js"),a=require("../../components/Typography/Typography.cjs.js");i.registerPlugin(c.SplitText,u.ScrollTrigger);function m({label:s,body:n,colorScheme:o}){const t=d.useRef(null);return p.useGSAP(()=>{c.SplitText.create(t.current,{type:"words chars",className:e.bodyText,autoSplit:!0,onSplit:l=>i.from(l.chars,{stagger:2,opacity:.3,duration:1,scrollTrigger:{trigger:t.current,start:"top 70%",end:"top 30%",scrub:!0,markers:!1}})})},{scope:t}),r.jsx("div",{className:g.cn(e.root,e[o]),children:r.jsxs("div",{className:e.container,children:[s&&r.jsx(a.Typography,{as:"p",defaultVariant:"labelMd",mobileVariant:"labelSm",emphasis:!0,className:e.label,children:s}),r.jsxs(a.Typography,{as:"div",defaultVariant:"displayMd",mobileVariant:"headingMd",className:e.body,children:[s&&r.jsx("span",{className:e.spacer,children:" "}),r.jsx("p",{className:e.bodyText,ref:t,children:n})]})]})})}exports.TextBlockAnimated=m;

package/dist/modules/TextBlockAnimated/TextBlockAnimated.es.js

@@ -1,14 +1,14 @@
 "use client";
-import { jsx as t, jsxs as s } from "react/jsx-runtime";
-import r from "./textBlockAnimated.module.css.es.js";
-import { gsap as o } from "../../node_modules/gsap/index.es.js";
+import { jsx as t, jsxs as o } from "react/jsx-runtime";
+import r from "../../modules/TextBlockAnimated/textBlockAnimated.module.css";
+import s from "gsap";
 import { SplitText as l } from "../../node_modules/gsap/SplitText.es.js";
 import { ScrollTrigger as p } from "../../node_modules/gsap/ScrollTrigger.es.js";
-import { useGSAP as d } from "../../node_modules/@gsap/react/src/index.es.js";
+import { useGSAP as d } from "@gsap/react";
 import { useRef as u } from "react";
-import { Typography as i } from "../../components/Typography/Typography.es.js";
 import { cn as f } from "../../utils/cn/cn.es.js";
-o.registerPlugin(l, p);
+import { Typography as i } from "../../components/Typography/Typography.es.js";
+s.registerPlugin(l, p);
 function v({ label: a, body: m, colorScheme: c }) {
   const e = u(null);
   return d(
@@ -17,7 +17,7 @@ function v({ label: a, body: m, colorScheme: c }) {
         type: "words chars",
         className: r.bodyText,
         autoSplit: !0,
-        onSplit: (n) => o.from(n.chars, {
+        onSplit: (n) => s.from(n.chars, {
           stagger: 2,
           opacity: 0.3,
           duration: 1,
@@ -32,7 +32,7 @@ function v({ label: a, body: m, colorScheme: c }) {
       });
     },
     { scope: e }
-  ), /* @__PURE__ */ t("div", { className: f(r.root, r[c]), children: /* @__PURE__ */ s("div", { className: r.container, children: [
+  ), /* @__PURE__ */ t("div", { className: f(r.root, r[c]), children: /* @__PURE__ */ o("div", { className: r.container, children: [
     a && /* @__PURE__ */ t(
       i,
       {
@@ -44,7 +44,7 @@ function v({ label: a, body: m, colorScheme: c }) {
         children: a
       }
     ),
-    /* @__PURE__ */ s(i, { as: "div", defaultVariant: "displayMd", mobileVariant: "headingMd", className: r.body, children: [
+    /* @__PURE__ */ o(i, { as: "div", defaultVariant: "displayMd", mobileVariant: "headingMd", className: r.body, children: [
       a && /* @__PURE__ */ t("span", { className: r.spacer, children: " " }),
       /* @__PURE__ */ t("p", { className: r.bodyText, ref: e, children: m })
     ] })

package/dist/modules/TextBlockAnimated/textBlockAnimated.module.css

@@ -0,0 +1,62 @@
+.root {
+    display: flex;
+    position: relative;
+    padding: var(--spacing-120);
+
+    @media (max-width: 768px) {
+        flex-direction: column;
+        gap: 20px;
+        padding: var(--spacing-80) var(--spacing-20);
+    }
+}
+
+.container {
+    max-width: 1200px;
+    margin: 0 auto;
+    position: relative;
+}
+
+.label {
+    display: flex;
+    flex-direction: row;
+    position: absolute;
+    top: 0;
+    left: 0;
+    align-items: center;
+    justify-content: flex-start;
+    padding-top: var(--spacing-4);
+    padding-bottom: var(--spacing-4);
+
+    @media (max-width: 768px) {
+        display: flex;
+        position: relative;
+    }
+}
+
+.dark {
+    background: var(--color-bg-base-dark, #000);
+    color: var(--color-text-primary-inverted, #FFF);
+}
+
+.light {
+    background: var(--color-bg-base-light, #FFF);
+    color: var(--color-text-primary, #000);
+}
+
+.bodyText {
+    display: inline;
+}
+
+.body {
+    display: inline-block;
+    position: relative;
+}
+
+.spacer {
+    display: inline-block;
+    width: 200px;
+
+    @media (max-width: 768px) {
+        display: none;
+    }
+}

package/dist/modules/TextTwoImages/TextTwoImages.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../components/Typography/Typography.cjs.js"),s=require("../../utils/cn/cn.cjs.js"),a=require("./textTwoImages.module.css.cjs.js"),n=({label:r,title:t,bigImage:i,smallImage:d,description:c})=>e.jsx("div",{className:a.default.root,children:e.jsxs("div",{className:a.default.container,children:[e.jsxs("div",{className:a.default.leftBlock,children:[e.jsx(l.Typography,{defaultVariant:"labelMd",mobileVariant:"labelMd",emphasis:!0,children:r}),e.jsx(l.Typography,{defaultVariant:"displayXs",mobileVariant:"headingLg",className:a.default.label,children:t}),e.jsx(l.Typography,{as:"div",defaultVariant:"labelLg",className:a.default.description,children:c})]}),e.jsx("div",{className:a.default.rightBlock,children:e.jsxs("div",{className:a.default.galleryImageOverlay,children:[e.jsx("div",{className:s.cn(a.default.galleryItem,a.default.galleryImageBig),children:e.jsx("img",{src:i,alt:"big"})}),e.jsx("div",{className:s.cn(a.default.galleryItem,a.default.galleryImageSmall),children:e.jsx("img",{src:d,alt:"small"})})]})})]})});exports.TextTwoImages=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../utils/cn/cn.cjs.js"),a=require("../../src/modules/TextTwoImages/textTwoImages.module.css"),l=require("../../components/Typography/Typography.cjs.js"),d=({label:i,title:r,bigImage:c,smallImage:t,description:n})=>e.jsx("div",{className:a.root,children:e.jsxs("div",{className:a.container,children:[e.jsxs("div",{className:a.leftBlock,children:[e.jsx(l.Typography,{defaultVariant:"labelMd",mobileVariant:"labelMd",emphasis:!0,children:i}),e.jsx(l.Typography,{defaultVariant:"displayXs",mobileVariant:"headingLg",className:a.label,children:r}),e.jsx(l.Typography,{as:"div",defaultVariant:"labelLg",className:a.description,children:n})]}),e.jsx("div",{className:a.rightBlock,children:e.jsxs("div",{className:a.galleryImageOverlay,children:[e.jsx("div",{className:s.cn(a.galleryItem,a.galleryImageBig),children:e.jsx("img",{src:c,alt:"big"})}),e.jsx("div",{className:s.cn(a.galleryItem,a.galleryImageSmall),children:e.jsx("img",{src:t,alt:"small"})})]})})]})});exports.TextTwoImages=d;

package/dist/modules/TextTwoImages/TextTwoImages.es.js

@@ -1,7 +1,7 @@
 import { jsx as l, jsxs as e } from "react/jsx-runtime";
-import { Typography as i } from "../../components/Typography/Typography.es.js";
 import { cn as r } from "../../utils/cn/cn.es.js";
-import a from "./textTwoImages.module.css.es.js";
+import a from "../../modules/TextTwoImages/textTwoImages.module.css";
+import { Typography as i } from "../../components/Typography/Typography.es.js";
 const p = ({ label: s, title: m, bigImage: c, smallImage: d, description: t }) => /* @__PURE__ */ l("div", { className: a.root, children: /* @__PURE__ */ e("div", { className: a.container, children: [
   /* @__PURE__ */ e("div", { className: a.leftBlock, children: [
     /* @__PURE__ */ l(i, { defaultVariant: "labelMd", mobileVariant: "labelMd", emphasis: !0, children: s }),

package/dist/modules/TextTwoImages/textTwoImages.module.css

@@ -0,0 +1,141 @@
+.root {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.container {
+    width: 100%;
+    min-width: 0;
+    max-width: var(--content-max-width);
+    display: flex;
+    margin: 0 auto;
+    gap: 120px;
+    padding: 120px;
+}
+
+.leftBlock {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+    width: 540px;
+}
+
+.description {
+    line-height: var(--line-height-lg);
+    letter-spacing: var(--letter-spacing-negative-md);
+
+    > p:not(:first-child){
+        margin-top: 16px;
+    }
+}
+
+.rightBlock{
+    width: 540px;
+    height: 674px;
+}
+
+.galleryImageOverlay{
+    position: relative;
+}
+
+.galleryItem{
+    border-radius: 24px;
+    overflow: hidden;
+}
+
+.galleryImageBig{
+    width: 480px;
+    height: 576px;
+    aspect-ratio: 5/6;
+
+}
+.galleryImageSmall{
+    position: absolute;
+    right: 0px;
+    bottom: -98px;
+    width: 256px;
+    height: 320px;
+    aspect-ratio: 4/5;
+}
+
+.galleryImageBig img,
+.galleryImageSmall img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    display: block;
+}
+
+@media (width <= 1440px) {
+    .container{
+        align-items: center;
+        padding: 64px 20px;
+        gap: 40px;
+        max-width: 1080px;
+    }
+
+    .galleryItem{
+        border-radius: 12px;
+    }
+
+    .leftBlock{
+        width: 100%;
+    }
+
+    .label{
+        font-size: var(--font-size-heading-xl);
+    }
+
+    .rightBlock{
+        width: 100%;
+    }
+
+    .galleryImageBig{
+        width: 440px;
+        height: 536px;
+    }
+
+    .galleryImageSmall{
+        width: 216px;
+        height: 280px;
+    }
+}
+
+@media (width <= 1080px) {
+    .container{
+        max-width: 768px;
+    }
+
+    .rightBlock{
+        height: 418px;
+    }
+
+    .galleryImageBig{
+        width: 300px;
+        height: 340px;
+    }
+
+    .galleryImageSmall{
+        width: 160px;
+        height: 200px;
+        bottom: -58px;
+    }
+}
+
+@media (width <= 768px) {
+    .container{
+        flex-direction: column-reverse;
+        width: 100%;
+    }
+
+    .rightBlock{
+        width: 375px;
+    }
+
+    .galleryImageBig{
+        height: 360px;
+    }
+
+}

package/dist/modules/ThreeCardsWithHero/ThreeCardsWithHero.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../components/Typography/Typography.cjs.js"),c=require("./components/TransparentCard/TransparentCard.cjs.js"),a=require("./threeCardsWithHero.module.css.cjs.js"),m=({label:r,title:l,cards:d,desktopImage:s,mobileImage:n})=>e.jsxs("section",{className:a.default.bgWrapper,children:[e.jsx("div",{className:a.default.root,children:e.jsx("div",{className:a.default.topContainer,children:e.jsx("div",{className:a.default.imageContainer,style:{"--desktop-image":`url(${s})`,"--mobile-image":`url(${n||s})`},children:e.jsxs("div",{className:a.default.imageTextContainer,children:[r&&e.jsx(t.Typography,{className:a.default.imageLabel,emphasis:!0,defaultVariant:"labelMd",children:r}),e.jsx("div",{className:a.default.imageTitle,children:e.jsx(t.Typography,{className:a.default.imageTitle,as:"div",defaultVariant:"displayXl",mobileVariant:"displayXs",children:l})})]})})})}),e.jsx("div",{className:a.default.bottomContainer,children:e.jsx("div",{className:a.default.root,children:e.jsx("div",{className:a.default.cardsContainer,children:d.slice(0,3).map((i,o)=>e.jsx(c.TransparentCard,{title:i.title,description:i.description,number:o+1},i.title))})})})]});exports.ThreeCardsWithHero=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../src/modules/ThreeCardsWithHero/threeCardsWithHero.module.css"),t=require("../../components/Typography/Typography.cjs.js"),d=require("./components/TransparentCard/TransparentCard.cjs.js"),m=({label:i,title:l,cards:n,desktopImage:r,mobileImage:o})=>e.jsxs("section",{className:s.bgWrapper,children:[e.jsx("div",{className:s.root,children:e.jsx("div",{className:s.topContainer,children:e.jsx("div",{className:s.imageContainer,style:{"--desktop-image":`url(${r})`,"--mobile-image":`url(${o||r})`},children:e.jsxs("div",{className:s.imageTextContainer,children:[i&&e.jsx(t.Typography,{className:s.imageLabel,emphasis:!0,defaultVariant:"labelMd",children:i}),e.jsx("div",{className:s.imageTitle,children:e.jsx(t.Typography,{className:s.imageTitle,as:"div",defaultVariant:"displayXl",mobileVariant:"displayXs",children:l})})]})})})}),e.jsx("div",{className:s.bottomContainer,children:e.jsx("div",{className:s.root,children:e.jsx("div",{className:s.cardsContainer,children:n.slice(0,3).map((a,c)=>e.jsx(d.TransparentCard,{title:a.title,description:a.description,number:c+1},a.title))})})})]});exports.ThreeCardsWithHero=m;

package/dist/modules/ThreeCardsWithHero/ThreeCardsWithHero.es.js

@@ -1,7 +1,7 @@
 import { jsxs as l, jsx as i } from "react/jsx-runtime";
+import e from "../../modules/ThreeCardsWithHero/threeCardsWithHero.module.css";
 import { Typography as t } from "../../components/Typography/Typography.es.js";
 import { TransparentCard as c } from "./components/TransparentCard/TransparentCard.es.js";
-import e from "./threeCardsWithHero.module.css.es.js";
 const g = ({ label: r, title: m, cards: n, desktopImage: s, mobileImage: o }) => /* @__PURE__ */ l("section", { className: e.bgWrapper, children: [
   /* @__PURE__ */ i("div", { className: e.root, children: /* @__PURE__ */ i("div", { className: e.topContainer, children: /* @__PURE__ */ i(
     "div",

package/dist/modules/ThreeCardsWithHero/components/TransparentCard/TransparentCard.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../../components/Typography/Typography.cjs.js"),a=require("./transparentCard.module.css.cjs.js"),d=({title:t,description:n,number:s})=>e.jsx("div",{className:a.default.root,children:e.jsxs("div",{className:a.default.contentContainer,children:[e.jsxs("div",{className:a.default.topContainer,children:[e.jsx(r.Typography,{defaultVariant:"headingSm",children:t}),e.jsx(r.Typography,{className:a.default.number,defaultVariant:"headingXxs",children:`(0${s})`})]}),e.jsx("div",{className:a.default.bottomContainer,children:e.jsx(r.Typography,{className:a.default.description,defaultVariant:"bodyLg",mobileVariant:"bodyMd",children:n})})]})});exports.TransparentCard=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../../../src/modules/ThreeCardsWithHero/components/TransparentCard/transparentCard.module.css"),r=require("../../../../components/Typography/Typography.cjs.js"),i=({title:n,description:s,number:t})=>e.jsx("div",{className:a.root,children:e.jsxs("div",{className:a.contentContainer,children:[e.jsxs("div",{className:a.topContainer,children:[e.jsx(r.Typography,{defaultVariant:"headingSm",children:n}),e.jsx(r.Typography,{className:a.number,defaultVariant:"headingXxs",children:`(0${t})`})]}),e.jsx("div",{className:a.bottomContainer,children:e.jsx(r.Typography,{className:a.description,defaultVariant:"bodyLg",mobileVariant:"bodyMd",children:s})})]})});exports.TransparentCard=i;

package/dist/modules/ThreeCardsWithHero/components/TransparentCard/TransparentCard.es.js

@@ -1,6 +1,6 @@
 import { jsx as e, jsxs as i } from "react/jsx-runtime";
+import a from "../../../../modules/ThreeCardsWithHero/components/TransparentCard/transparentCard.module.css";
 import { Typography as r } from "../../../../components/Typography/Typography.es.js";
-import a from "./transparentCard.module.css.es.js";
 const c = ({ title: n, description: t, number: o }) => /* @__PURE__ */ e("div", { className: a.root, children: /* @__PURE__ */ i("div", { className: a.contentContainer, children: [
   /* @__PURE__ */ i("div", { className: a.topContainer, children: [
     /* @__PURE__ */ e(r, { defaultVariant: "headingSm", children: n }),