@zenpatient-org/healthspan-marketing-ui 0.1.39 → 0.1.40

package/dist/components/ComplexImageCarousel/ComplexImageCarousel.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),C=require("react"),v=require("../../node_modules/swiper/swiper-react.cjs.js"),_=require("../../node_modules/swiper/modules/navigation.cjs.js"),E=require("../ProgressButton/ProgressButton.cjs.js"),b=require("../../utils/cn/cn.cjs.js"),k=require("../../utils/useSwiper/useSwiper.cjs.js");;/* empty css                                        */;/* empty css                                                    */;/* empty css                                                    */const i=require("./complexImageCarousel.module.css.cjs.js"),A=[_.default],M=({view:$,images:f})=>{const{handleSlideChange:S,onSwiperInit:w,swiper:e,activeIndex:s}=k.useSwiper(),[o,r]=C.useState(!1);C.useEffect(()=>{e!=null&&e.el&&(o?e.el.classList.add("is-dragging"):e.el.classList.remove("is-dragging"))},[o,e]);const a=(l=!0)=>{if(!e)return;const t=e.el.closest(`.${i.default.carouselArea}`);if(!t)return;const c=t.getBoundingClientRect(),g=c.left+c.width/2;let u=0,p=1/0;e.slides.forEach((B,T)=>{const h=B.getBoundingClientRect(),j=h.left+h.width/2,m=Math.abs(j-g);m<p&&(p=m,u=T)}),e.activeIndex=u,S(e),l&&(e.updateProgress(),e.updateSlidesClasses())},d=l=>{!e||o||(e.allowSlideNext=!0,e.allowSlidePrev=!0,e.activeIndex=l,e.updateProgress(),e.updateSlidesClasses(),S(e),setTimeout(()=>{if(o)return;const t=e.slides[l];if(t){const c=e.el.closest(`.${i.default.carouselArea}`);if(c){const g=t.getBoundingClientRect(),u=c.getBoundingClientRect();(g.left<u.left||g.right>u.right)&&t.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}}},10))},x=()=>{if(!e||s<=0)return d(f.length-1);d(s-1)},I=()=>{if(!e||s>=f.length-1)return d(0);d(s+1)},P=s-1,R=s+1,q=s-2,N=s+2;return n.jsxs("div",{className:i.default.root,children:[n.jsx("div",{className:i.default.header,children:n.jsx(E.ProgressButton,{left:{onClick:x},right:{onClick:I},className:i.default.progressButtonContainer})}),n.jsx("div",{className:i.default.carouselArea,children:n.jsx(v.Swiper,{onSwiper:w,onSlideChange:S,modules:A,slidesPerView:5,speed:300,centeredSlides:!1,className:i.default.swiper,watchSlidesProgress:!0,initialSlide:0,spaceBetween:30,threshold:100,onTouchEnd:()=>{setTimeout(()=>{r(!1),a(!0)},200)},onTouchMove:()=>{r(!0),setTimeout(()=>{o&&a(!1)},10)},onSliderMove:()=>{r(!0)},onReachBeginning:()=>{r(!1),a(!0)},onReachEnd:()=>{r(!1),a(!0)},onTransitionStart:()=>{r(!0)},onTransitionEnd:()=>{setTimeout(()=>{r(!1),a(!0)},200),e&&(e.updateSize(),e.updateSlides(),e.updateProgress(),e.updateSlidesClasses())},children:f.map((l,t)=>n.jsx(v.SwiperSlide,{className:b.cn(i.default.swiperSlide,{activeSlide:t===s,prevSlide:t===P,nextSlide:t===R,prevPrevSlide:t===q,nextNextSlide:t===N}),children:n.jsx("div",{className:i.default.swiperSlideInner,style:{backgroundImage:`url(${l.image})`}})},t))})})]})};exports.ComplexImageCarousel=M;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../utils/cn/cn.cjs.js"),N=require("../ProgressButton/ProgressButton.cjs.js"),u=require("../Typography/Typography.cjs.js"),r=require("./complexImageCarousel.module.css.cjs.js"),v=require("./useComplexImageCarousel.cjs.js"),b=({images:i})=>{const{containerRef:m,carouselRef:f,imageRefs:p,descriptionRef:g,descriptionItemRef:h,progressButtonContainerRef:C,visible:s,cardSizes:n,handleCustomPrevClick:x,handleCustomNextClick:y,current:j,mobileCardIndex:o,xLargeCardIndex:l}=v.useComplexImageCarousel({images:i});return e.jsx("div",{className:r.default.root,children:e.jsxs("div",{ref:m,className:r.default.container,children:[e.jsx("div",{ref:f,className:r.default.carouselArea,children:s.length>0&&s.map((d,t)=>e.jsx("div",{className:a.cn(r.default.slideContainer,r.default[`size-${n[t]}`]),ref:c=>{c&&(p.current[t]=c)},"data-flip-id":`slide-${(j+t)%i.length}`,"data-size":n[t],children:e.jsx("img",{src:d.image,alt:`Slide ${t+1}`,className:r.default.image})},d.name))}),e.jsx("div",{ref:g,className:r.default.description,children:e.jsxs("div",{ref:h,className:a.cn("description-item",r.default.descriptionItem),children:[e.jsx(u.Typography,{as:"h3",defaultVariant:"headingLg",mobileVariant:"headingXxs",children:typeof window<"u"&&window.innerWidth<=768?s[o].title:s[l].title}),e.jsx(u.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",className:r.default.text,children:typeof window<"u"&&window.innerWidth<=768?s[o].description:s[l].description})]})}),e.jsx("div",{ref:C,className:r.default.progressButtonContainer,children:e.jsx(N.ProgressButton,{left:{onClick:x},right:{onClick:y},className:a.cn("progress-buttons",r.default.progressButton)})})]})})};exports.ComplexImageCarousel=b;

package/dist/components/ComplexImageCarousel/ComplexImageCarousel.d.ts

@@ -1,3 +1,3 @@
 import { TComplexImageCarouselView } from './types';
 
-export declare const ComplexImageCarousel: ({ view, images }: TComplexImageCarouselView) => import("react/jsx-runtime").JSX.Element;
+export declare const ComplexImageCarousel: ({ images }: TComplexImageCarouselView) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ComplexImageCarousel/ComplexImageCarousel.es.js

@@ -1,135 +1,58 @@
 "use client";
-import { jsxs as E, jsx as o } from "react/jsx-runtime";
-import { useState as k, useEffect as A } from "react";
-import { Swiper as b, SwiperSlide as D } from "../../node_modules/swiper/swiper-react.es.js";
-import M from "../../node_modules/swiper/modules/navigation.es.js";
-import { ProgressButton as y } from "../ProgressButton/ProgressButton.es.js";
-import { cn as L } from "../../utils/cn/cn.es.js";
-import { useSwiper as $ } from "../../utils/useSwiper/useSwiper.es.js";
-/* empty css                                      */
-/* empty css                                                  */
-/* empty css                                                  */
-import i from "./complexImageCarousel.module.css.es.js";
-const j = [M], Q = ({ view: V, images: g }) => {
-  const { handleSlideChange: m, onSwiperInit: v, swiper: e, activeIndex: s } = $(), [l, r] = k(!1);
-  A(() => {
-    e != null && e.el && (l ? e.el.classList.add("is-dragging") : e.el.classList.remove("is-dragging"));
-  }, [l, e]);
-  const a = (n = !0) => {
-    if (!e) return;
-    const t = e.el.closest(`.${i.carouselArea}`);
-    if (!t) return;
-    const c = t.getBoundingClientRect(), f = c.left + c.width / 2;
-    let d = 0, S = 1 / 0;
-    e.slides.forEach((R, T) => {
-      const p = R.getBoundingClientRect(), B = p.left + p.width / 2, h = Math.abs(B - f);
-      h < S && (S = h, d = T);
-    }), e.activeIndex = d, m(e), n && (e.updateProgress(), e.updateSlidesClasses());
-  }, u = (n) => {
-    !e || l || (e.allowSlideNext = !0, e.allowSlidePrev = !0, e.activeIndex = n, e.updateProgress(), e.updateSlidesClasses(), m(e), setTimeout(() => {
-      if (l) return;
-      const t = e.slides[n];
-      if (t) {
-        const c = e.el.closest(`.${i.carouselArea}`);
-        if (c) {
-          const f = t.getBoundingClientRect(), d = c.getBoundingClientRect();
-          (f.left < d.left || f.right > d.right) && t.scrollIntoView({
-            behavior: "smooth",
-            block: "nearest",
-            inline: "center"
-          });
-        }
-      }
-    }, 10));
-  }, C = () => {
-    if (!e || s <= 0)
-      return u(g.length - 1);
-    u(s - 1);
-  }, w = () => {
-    if (!e || s >= g.length - 1)
-      return u(0);
-    u(s + 1);
-  }, I = s - 1, N = s + 1, x = s - 2, P = s + 2;
-  return /* @__PURE__ */ E("div", { className: i.root, children: [
-    /* @__PURE__ */ o("div", { className: i.header, children: /* @__PURE__ */ o(
-      y,
+import { jsx as i, jsxs as m } from "react/jsx-runtime";
+import { cn as s } from "../../utils/cn/cn.es.js";
+import { ProgressButton as x } from "../ProgressButton/ProgressButton.es.js";
+import { Typography as f } from "../Typography/Typography.es.js";
+import e from "./complexImageCarousel.module.css.es.js";
+import { useComplexImageCarousel as y } from "./useComplexImageCarousel.es.js";
+const S = ({ images: a }) => {
+  const {
+    containerRef: p,
+    carouselRef: h,
+    imageRefs: u,
+    descriptionRef: g,
+    descriptionItemRef: C,
+    progressButtonContainerRef: N,
+    visible: r,
+    cardSizes: n,
+    handleCustomPrevClick: v,
+    handleCustomNextClick: w,
+    current: b,
+    mobileCardIndex: o,
+    xLargeCardIndex: d
+  } = y({ images: a });
+  return /* @__PURE__ */ i("div", { className: e.root, children: /* @__PURE__ */ m("div", { ref: p, className: e.container, children: [
+    /* @__PURE__ */ i("div", { ref: h, className: e.carouselArea, children: r.length > 0 && r.map((l, t) => /* @__PURE__ */ i(
+      "div",
+      {
+        className: s(e.slideContainer, e[`size-${n[t]}`]),
+        ref: (c) => {
+          c && (u.current[t] = c);
+        },
+        "data-flip-id": `slide-${(b + t) % a.length}`,
+        "data-size": n[t],
+        children: /* @__PURE__ */ i("img", { src: l.image, alt: `Slide ${t + 1}`, className: e.image })
+      },
+      l.name
+    )) }),
+    /* @__PURE__ */ i("div", { ref: g, className: e.description, children: /* @__PURE__ */ m("div", { ref: C, className: s("description-item", e.descriptionItem), children: [
+      /* @__PURE__ */ i(f, { as: "h3", defaultVariant: "headingLg", mobileVariant: "headingXxs", children: typeof window < "u" && window.innerWidth <= 768 ? r[o].title : r[d].title }),
+      /* @__PURE__ */ i(f, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", className: e.text, children: typeof window < "u" && window.innerWidth <= 768 ? r[o].description : r[d].description })
+    ] }) }),
+    /* @__PURE__ */ i("div", { ref: N, className: e.progressButtonContainer, children: /* @__PURE__ */ i(
+      x,
       {
         left: {
-          onClick: C
+          onClick: v
         },
         right: {
           onClick: w
         },
-        className: i.progressButtonContainer
-      }
-    ) }),
-    /* @__PURE__ */ o("div", { className: i.carouselArea, children: /* @__PURE__ */ o(
-      b,
-      {
-        onSwiper: v,
-        onSlideChange: m,
-        modules: j,
-        slidesPerView: 5,
-        speed: 300,
-        centeredSlides: !1,
-        className: i.swiper,
-        watchSlidesProgress: !0,
-        initialSlide: 0,
-        spaceBetween: 30,
-        threshold: 100,
-        onTouchEnd: () => {
-          setTimeout(() => {
-            r(!1), a(!0);
-          }, 200);
-        },
-        onTouchMove: () => {
-          r(!0), setTimeout(() => {
-            l && a(!1);
-          }, 10);
-        },
-        onSliderMove: () => {
-          r(!0);
-        },
-        onReachBeginning: () => {
-          r(!1), a(!0);
-        },
-        onReachEnd: () => {
-          r(!1), a(!0);
-        },
-        onTransitionStart: () => {
-          r(!0);
-        },
-        onTransitionEnd: () => {
-          setTimeout(() => {
-            r(!1), a(!0);
-          }, 200), e && (e.updateSize(), e.updateSlides(), e.updateProgress(), e.updateSlidesClasses());
-        },
-        children: g.map((n, t) => /* @__PURE__ */ o(
-          D,
-          {
-            className: L(i.swiperSlide, {
-              activeSlide: t === s,
-              prevSlide: t === I,
-              nextSlide: t === N,
-              prevPrevSlide: t === x,
-              nextNextSlide: t === P
-            }),
-            children: /* @__PURE__ */ o(
-              "div",
-              {
-                className: i.swiperSlideInner,
-                style: {
-                  backgroundImage: `url(${n.image})`
-                }
-              }
-            )
-          },
-          t
-        ))
+        className: s("progress-buttons", e.progressButton)
       }
     ) })
-  ] });
+  ] }) });
 };
 export {
-  Q as ComplexImageCarousel
+  S as ComplexImageCarousel
 };

package/dist/components/ComplexImageCarousel/complexImageCarousel.module.css.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="complexImageCarousel-module__root___p3Kd-",o="complexImageCarousel-module__header___sxByG",r="complexImageCarousel-module__progressButtonContainer___l3Qih",s="complexImageCarousel-module__carouselArea___dqNWo",l="complexImageCarousel-module__swiper___W-TcF",_="complexImageCarousel-module__swiperSlide___PjBf9",a="complexImageCarousel-module__swiperSlideInner___J2B0U",t={root:e,header:o,progressButtonContainer:r,carouselArea:s,swiper:l,swiperSlide:_,swiperSlideInner:a};exports.carouselArea=s;exports.default=t;exports.header=o;exports.progressButtonContainer=r;exports.root=e;exports.swiper=l;exports.swiperSlide=_;exports.swiperSlideInner=a;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="complexImageCarousel-module__container___uoYKj",o="complexImageCarousel-module__carouselArea___dqNWo",s="complexImageCarousel-module__slideContainer___H-r26",r="complexImageCarousel-module__description___R8XsG",t="complexImageCarousel-module__descriptionItem___SAPt8",_="complexImageCarousel-module__progressButtonContainer___l3Qih",l="complexImageCarousel-module__progressButton___b78tE",a={container:e,carouselArea:o,slideContainer:s,"size-atom":"complexImageCarousel-module__size-atom___t7PmI","size-small":"complexImageCarousel-module__size-small___mjSZM","size-medium":"complexImageCarousel-module__size-medium___M-0BQ","size-large":"complexImageCarousel-module__size-large___GITeg","size-x-large":"complexImageCarousel-module__size-x-large___e-BOY",description:r,descriptionItem:t,progressButtonContainer:_,progressButton:l};exports.carouselArea=o;exports.container=e;exports.default=a;exports.description=r;exports.descriptionItem=t;exports.progressButton=l;exports.progressButtonContainer=_;exports.slideContainer=s;

package/dist/components/ComplexImageCarousel/complexImageCarousel.module.css.es.js

@@ -1,19 +1,24 @@
-const e = "complexImageCarousel-module__root___p3Kd-", o = "complexImageCarousel-module__header___sxByG", r = "complexImageCarousel-module__progressButtonContainer___l3Qih", s = "complexImageCarousel-module__carouselArea___dqNWo", _ = "complexImageCarousel-module__swiper___W-TcF", l = "complexImageCarousel-module__swiperSlide___PjBf9", a = "complexImageCarousel-module__swiperSlideInner___J2B0U", n = {
-  root: e,
-  header: o,
+const e = "complexImageCarousel-module__container___uoYKj", o = "complexImageCarousel-module__carouselArea___dqNWo", s = "complexImageCarousel-module__slideContainer___H-r26", _ = "complexImageCarousel-module__description___R8XsG", l = "complexImageCarousel-module__descriptionItem___SAPt8", r = "complexImageCarousel-module__progressButtonContainer___l3Qih", a = "complexImageCarousel-module__progressButton___b78tE", m = {
+  container: e,
+  carouselArea: o,
+  slideContainer: s,
+  "size-atom": "complexImageCarousel-module__size-atom___t7PmI",
+  "size-small": "complexImageCarousel-module__size-small___mjSZM",
+  "size-medium": "complexImageCarousel-module__size-medium___M-0BQ",
+  "size-large": "complexImageCarousel-module__size-large___GITeg",
+  "size-x-large": "complexImageCarousel-module__size-x-large___e-BOY",
+  description: _,
+  descriptionItem: l,
   progressButtonContainer: r,
-  carouselArea: s,
-  swiper: _,
-  swiperSlide: l,
-  swiperSlideInner: a
+  progressButton: a
 };
 export {
-  s as carouselArea,
-  n as default,
-  o as header,
+  o as carouselArea,
+  e as container,
+  m as default,
+  _ as description,
+  l as descriptionItem,
+  a as progressButton,
   r as progressButtonContainer,
-  e as root,
-  _ as swiper,
-  l as swiperSlide,
-  a as swiperSlideInner
+  s as slideContainer
 };

package/dist/components/ComplexImageCarousel/useComplexImageCarousel.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("../../node_modules/@gsap/react/src/index.cjs.js"),c=require("../../node_modules/gsap/index.cjs.js"),x=require("../../node_modules/gsap/Flip.cjs.js"),r=require("react"),V=require("../../utils/debounce.cjs.js");c.gsap.registerPlugin(x.Flip);const D=({images:a})=>{const[d,E]=r.useState(0),[z,y]=r.useState(!1),W=r.useRef(null),o=r.useRef(null),f=r.useRef([]),m=r.useRef(null),q=r.useRef(null),C=r.useRef(null),R=r.useRef(null),u=["atom","small","medium","small","atom"],I=["atom","small","medium","large","x-large","large","medium","small","atom"],[l,A]=r.useState(typeof window<"u"&&window.innerWidth<=768?u:I),F=u.indexOf("medium"),P=l.indexOf("x-large"),w=r.useCallback(e=>{var L,b,v,B;if(!f.current.length)return;c.gsap.set(o.current,{height:((L=o.current)==null?void 0:L.offsetHeight)||"auto"});const g=(b=o.current)==null?void 0:b.querySelector('[data-size="x-large"]'),s=g==null?void 0:g.getBoundingClientRect(),n=(v=o.current)==null?void 0:v.querySelector('[data-size="medium"]'),h=n==null?void 0:n.getBoundingClientRect();if(window.innerWidth<=768){if(!h||!C.current)return;const t=window.innerWidth/2,i=h.left+h.width/2,p=t-i;c.gsap.set(o.current,{x:`+=${p}`});const S=C.current.querySelector(".progress-buttons");if(S){const $=S.getBoundingClientRect(),H=$.left+$.width/2,M=t-H;c.gsap.set(S,{x:`+=${M}`})}const G=t-h.width/2;c.gsap.set(m.current,{width:h.width,height:h.height/2,marginLeft:G})}else c.gsap.set(m.current,{width:s?s.width:"auto",height:s?s.height:"auto",marginLeft:s?s.left:0});(((B=m.current)==null?void 0:B.querySelectorAll(".description-item"))||[]).forEach((t,i)=>{t.style.zIndex=`${a.length-i}`}),y(!0),R.current=x.Flip.getState(f.current,{props:"width,height",simple:!0}),E(e),window.innerWidth<=768?f.current.forEach((t,i)=>{t&&i<u.length&&(u.forEach(p=>{t.classList.remove(`size-${p}`)}),t.classList.add(`size-${u[i]}`))}):f.current.forEach((t,i)=>{t&&i<l.length&&(l.forEach(p=>{t.classList.remove(`size-${p}`)}),t.classList.add(`size-${l[i]}`))}),requestAnimationFrame(()=>{x.Flip.from(R.current,{duration:.5,ease:"power3.out",targets:f.current,scale:!1,nested:!0,onComplete:()=>{y(!1)}}),c.gsap.fromTo(q.current,{opacity:0,y:20},{opacity:1,y:0,duration:.5,ease:"power3.out",onComplete:()=>{R.current=null}})})},[l,u,a.length]),k=()=>{if(z)return;const e=(d-1+a.length)%a.length;w(e)},O=()=>{if(z)return;const e=(d+1)%a.length;w(e)};function T(e,g){const s=[];if(typeof window<"u"&&window.innerWidth<=768)for(let n=0;n<u.length;n++)s.push(e[(g+n)%e.length]);else for(let n=0;n<l.length;n++)s.push(e[(g+n)%e.length]);return s}const j=T(a,d);return N.useGSAP(()=>{w(d),o.current&&c.gsap.set(o.current,{clearProps:"all"});const e=V.default(()=>{A(window.innerWidth<=768?u:I),w(d)},600);return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}},[]),{containerRef:W,carouselRef:o,imageRefs:f,descriptionRef:m,descriptionItemRef:q,progressButtonContainerRef:C,visible:j,cardSizes:l,handleCustomPrevClick:k,handleCustomNextClick:O,current:d,mobileCardIndex:F,xLargeCardIndex:P}};exports.useComplexImageCarousel=D;

package/dist/components/ComplexImageCarousel/useComplexImageCarousel.d.ts

@@ -0,0 +1,19 @@
+import { TAdvancedImageView } from './types';
+
+export declare const useComplexImageCarousel: ({ images }: {
+    images: TAdvancedImageView[];
+}) => {
+    containerRef: import('react').RefObject<HTMLDivElement>;
+    carouselRef: import('react').RefObject<HTMLDivElement>;
+    imageRefs: import('react').MutableRefObject<HTMLDivElement[]>;
+    descriptionRef: import('react').RefObject<HTMLDivElement>;
+    descriptionItemRef: import('react').RefObject<HTMLDivElement>;
+    progressButtonContainerRef: import('react').RefObject<HTMLDivElement>;
+    visible: TAdvancedImageView[];
+    cardSizes: string[];
+    handleCustomPrevClick: () => void;
+    handleCustomNextClick: () => void;
+    current: number;
+    mobileCardIndex: number;
+    xLargeCardIndex: number;
+};

package/dist/components/ComplexImageCarousel/useComplexImageCarousel.es.js

@@ -0,0 +1,133 @@
+import { useGSAP as D } from "../../node_modules/@gsap/react/src/index.es.js";
+import { gsap as c } from "../../node_modules/gsap/index.es.js";
+import { Flip as x } from "../../node_modules/gsap/Flip.es.js";
+import { useState as S, useRef as l, useCallback as J } from "react";
+import K from "../../utils/debounce.es.js";
+c.registerPlugin(x);
+const _ = ({ images: a }) => {
+  const [d, q] = S(0), [y, L] = S(!1), A = l(null), o = l(null), f = l([]), p = l(null), I = l(null), C = l(null), z = l(null), i = ["atom", "small", "medium", "small", "atom"], B = ["atom", "small", "medium", "large", "x-large", "large", "medium", "small", "atom"], [u, k] = S(
+    typeof window < "u" && window.innerWidth <= 768 ? i : B
+  ), P = i.indexOf("medium"), O = u.indexOf("x-large"), w = J(
+    (e) => {
+      var b, v, E, W;
+      if (!f.current.length) return;
+      c.set(o.current, {
+        height: ((b = o.current) == null ? void 0 : b.offsetHeight) || "auto"
+      });
+      const h = (v = o.current) == null ? void 0 : v.querySelector('[data-size="x-large"]'), r = h == null ? void 0 : h.getBoundingClientRect(), n = (E = o.current) == null ? void 0 : E.querySelector('[data-size="medium"]'), m = n == null ? void 0 : n.getBoundingClientRect();
+      if (window.innerWidth <= 768) {
+        if (!m || !C.current) return;
+        const t = window.innerWidth / 2, s = m.left + m.width / 2, g = t - s;
+        c.set(o.current, {
+          x: `+=${g}`
+        });
+        const R = C.current.querySelector(
+          ".progress-buttons"
+        );
+        if (R) {
+          const $ = R.getBoundingClientRect(), V = $.left + $.width / 2, j = t - V;
+          c.set(R, {
+            x: `+=${j}`
+          });
+        }
+        const N = t - m.width / 2;
+        c.set(p.current, {
+          width: m.width,
+          height: m.height / 2,
+          marginLeft: N
+        });
+      } else
+        c.set(p.current, {
+          width: r ? r.width : "auto",
+          height: r ? r.height : "auto",
+          marginLeft: r ? r.left : 0
+        });
+      (((W = p.current) == null ? void 0 : W.querySelectorAll(".description-item")) || []).forEach((t, s) => {
+        t.style.zIndex = `${a.length - s}`;
+      }), L(!0), z.current = x.getState(f.current, {
+        props: "width,height",
+        simple: !0
+      }), q(e), window.innerWidth <= 768 ? f.current.forEach((t, s) => {
+        t && s < i.length && (i.forEach((g) => {
+          t.classList.remove(`size-${g}`);
+        }), t.classList.add(`size-${i[s]}`));
+      }) : f.current.forEach((t, s) => {
+        t && s < u.length && (u.forEach((g) => {
+          t.classList.remove(`size-${g}`);
+        }), t.classList.add(`size-${u[s]}`));
+      }), requestAnimationFrame(() => {
+        x.from(z.current, {
+          duration: 0.5,
+          ease: "power3.out",
+          targets: f.current,
+          scale: !1,
+          nested: !0,
+          onComplete: () => {
+            L(!1);
+          }
+        }), c.fromTo(
+          I.current,
+          {
+            opacity: 0,
+            y: 20
+          },
+          {
+            opacity: 1,
+            y: 0,
+            duration: 0.5,
+            ease: "power3.out",
+            onComplete: () => {
+              z.current = null;
+            }
+          }
+        );
+      });
+    },
+    [u, i, a.length]
+  ), F = () => {
+    if (y) return;
+    const e = (d - 1 + a.length) % a.length;
+    w(e);
+  }, T = () => {
+    if (y) return;
+    const e = (d + 1) % a.length;
+    w(e);
+  };
+  function G(e, h) {
+    const r = [];
+    if (typeof window < "u" && window.innerWidth <= 768)
+      for (let n = 0; n < i.length; n++)
+        r.push(e[(h + n) % e.length]);
+    else
+      for (let n = 0; n < u.length; n++)
+        r.push(e[(h + n) % e.length]);
+    return r;
+  }
+  const H = G(a, d);
+  return D(() => {
+    w(d), o.current && c.set(o.current, { clearProps: "all" });
+    const e = K(() => {
+      k(window.innerWidth <= 768 ? i : B), w(d);
+    }, 600);
+    return window.addEventListener("resize", e), () => {
+      window.removeEventListener("resize", e);
+    };
+  }, []), {
+    containerRef: A,
+    carouselRef: o,
+    imageRefs: f,
+    descriptionRef: p,
+    descriptionItemRef: I,
+    progressButtonContainerRef: C,
+    visible: H,
+    cardSizes: u,
+    handleCustomPrevClick: F,
+    handleCustomNextClick: T,
+    current: d,
+    mobileCardIndex: P,
+    xLargeCardIndex: O
+  };
+};
+export {
+  _ as useComplexImageCarousel
+};

package/dist/components/FAQComponent/components/FAQComponentItem/FAQComponentItem.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../Typography/Typography.cjs.js"),t=require("../../../Icon/Icon.cjs.js"),a=require("../../../Icon/constants.cjs.js"),s=require("../../../../utils/cn/cn.cjs.js"),n=require("./faqComponentItem.module.css.cjs.js"),u=({title:r,content:d,isOpen:o,index:i,onClick:l})=>e.jsxs("div",{className:n.default.root,children:[e.jsxs("div",{onClick:()=>l(i??0),className:s.cn(n.default.header,{[n.default.headerSticky]:o}),children:[e.jsx(c.Typography,{defaultVariant:"headingMd",mobileVariant:"headingXxs",children:r}),e.jsxs("div",{className:n.default.closeButtonWrapper,children:[e.jsx(t.Icon,{name:a.EIconName.BRACKET_LEFT}),e.jsx("div",{className:s.cn(n.default.closeButton,{[n.default.closeButtonActive]:o}),children:e.jsx(t.Icon,{name:a.EIconName.PLUS})}),e.jsx(t.Icon,{name:a.EIconName.BRACKET_RIGHT})]})]}),e.jsx("div",{className:s.cn(n.default.description,{[n.default.descriptionShow]:o}),children:e.jsx(c.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodyXs",children:d})}),e.jsx("div",{className:n.default.leftBorder}),e.jsx("div",{className:n.default.rightBorder})]});exports.FAQComponentItem=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../Typography/Typography.cjs.js"),o=require("../../../Icon/Icon.cjs.js"),t=require("../../../Icon/constants.cjs.js"),s=require("../../../../utils/cn/cn.cjs.js"),n=require("./faqComponentItem.module.css.cjs.js"),u=({title:r,content:d,isOpen:a,index:i,onClick:l})=>e.jsxs("div",{className:n.default.root,children:[e.jsxs("div",{onClick:()=>l(i??0),className:s.cn(n.default.header,{[n.default.headerSticky]:a}),children:[e.jsx(c.Typography,{defaultVariant:"headingMd",mobileVariant:"headingXxs",children:r}),e.jsxs("div",{className:n.default.closeButtonWrapper,children:[e.jsx(o.Icon,{name:t.EIconName.BRACKET_LEFT}),e.jsx("div",{className:s.cn(n.default.closeButton,{[n.default.closeButtonActive]:a}),children:e.jsx(o.Icon,{name:t.EIconName.PLUS_BOLD})}),e.jsx(o.Icon,{name:t.EIconName.BRACKET_RIGHT})]})]}),e.jsx("div",{className:s.cn(n.default.description,{[n.default.descriptionShow]:a}),children:e.jsx("div",{className:n.default.descriptionInner,children:e.jsx(c.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodyXs",children:d})})}),e.jsx("div",{className:n.default.leftBorder}),e.jsx("div",{className:n.default.rightBorder})]});exports.FAQComponentItem=u;

package/dist/components/FAQComponent/components/FAQComponentItem/FAQComponentItem.es.js

@@ -1,27 +1,27 @@
-import { jsxs as a, jsx as r } from "react/jsx-runtime";
-import { Typography as m } from "../../../Typography/Typography.es.js";
-import { Icon as i } from "../../../Icon/Icon.es.js";
+import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import { Typography as n } from "../../../Typography/Typography.es.js";
+import { Icon as a } from "../../../Icon/Icon.es.js";
 import { EIconName as t } from "../../../Icon/constants.es.js";
 import { cn as d } from "../../../../utils/cn/cn.es.js";
 import e from "./faqComponentItem.module.css.es.js";
-const u = ({ title: n, content: c, isOpen: o, index: s, onClick: l }) => /* @__PURE__ */ a("div", { className: e.root, children: [
-  /* @__PURE__ */ a("div", { onClick: () => l(s ?? 0), className: d(e.header, { [e.headerSticky]: o }), children: [
-    /* @__PURE__ */ r(m, { defaultVariant: "headingMd", mobileVariant: "headingXxs", children: n }),
-    /* @__PURE__ */ a("div", { className: e.closeButtonWrapper, children: [
-      /* @__PURE__ */ r(i, { name: t.BRACKET_LEFT }),
+const u = ({ title: c, content: s, isOpen: i, index: m, onClick: l }) => /* @__PURE__ */ o("div", { className: e.root, children: [
+  /* @__PURE__ */ o("div", { onClick: () => l(m ?? 0), className: d(e.header, { [e.headerSticky]: i }), children: [
+    /* @__PURE__ */ r(n, { defaultVariant: "headingMd", mobileVariant: "headingXxs", children: c }),
+    /* @__PURE__ */ o("div", { className: e.closeButtonWrapper, children: [
+      /* @__PURE__ */ r(a, { name: t.BRACKET_LEFT }),
       /* @__PURE__ */ r(
         "div",
         {
           className: d(e.closeButton, {
-            [e.closeButtonActive]: o
+            [e.closeButtonActive]: i
           }),
-          children: /* @__PURE__ */ r(i, { name: t.PLUS })
+          children: /* @__PURE__ */ r(a, { name: t.PLUS_BOLD })
         }
       ),
-      /* @__PURE__ */ r(i, { name: t.BRACKET_RIGHT })
+      /* @__PURE__ */ r(a, { name: t.BRACKET_RIGHT })
     ] })
   ] }),
-  /* @__PURE__ */ r("div", { className: d(e.description, { [e.descriptionShow]: o }), children: /* @__PURE__ */ r(m, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodyXs", children: c }) }),
+  /* @__PURE__ */ r("div", { className: d(e.description, { [e.descriptionShow]: i }), children: /* @__PURE__ */ r("div", { className: e.descriptionInner, children: /* @__PURE__ */ r(n, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodyXs", children: s }) }) }),
   /* @__PURE__ */ r("div", { className: e.leftBorder }),
   /* @__PURE__ */ r("div", { className: e.rightBorder })
 ] });

package/dist/components/FAQComponent/components/FAQComponentItem/faqComponentItem.module.css.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="faqComponentItem-module__root___zTwix",o="faqComponentItem-module__header___LxS2t",t="faqComponentItem-module__closeButtonWrapper___FMjQq",n="faqComponentItem-module__closeButton___yWXnz",r="faqComponentItem-module__closeButtonActive___eqfRz",_="faqComponentItem-module__description___UQs0o",c="faqComponentItem-module__descriptionShow___DZNFQ",d="faqComponentItem-module__leftBorder___7tMoB",s="faqComponentItem-module__rightBorder___xiCjz",i="faqComponentItem-module__headerSticky___nPXFL",l={root:e,header:o,closeButtonWrapper:t,closeButton:n,closeButtonActive:r,description:_,descriptionShow:c,leftBorder:d,rightBorder:s,headerSticky:i};exports.closeButton=n;exports.closeButtonActive=r;exports.closeButtonWrapper=t;exports.default=l;exports.description=_;exports.descriptionShow=c;exports.header=o;exports.headerSticky=i;exports.leftBorder=d;exports.rightBorder=s;exports.root=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="faqComponentItem-module__root___zTwix",o="faqComponentItem-module__header___LxS2t",t="faqComponentItem-module__closeButtonWrapper___FMjQq",n="faqComponentItem-module__closeButton___yWXnz",r="faqComponentItem-module__closeButtonActive___eqfRz",_="faqComponentItem-module__description___UQs0o",c="faqComponentItem-module__descriptionInner___aC4CL",d="faqComponentItem-module__descriptionShow___DZNFQ",s="faqComponentItem-module__leftBorder___7tMoB",i="faqComponentItem-module__rightBorder___xiCjz",l="faqComponentItem-module__headerSticky___nPXFL",m={root:e,header:o,closeButtonWrapper:t,closeButton:n,closeButtonActive:r,description:_,descriptionInner:c,descriptionShow:d,leftBorder:s,rightBorder:i,headerSticky:l};exports.closeButton=n;exports.closeButtonActive=r;exports.closeButtonWrapper=t;exports.default=m;exports.description=_;exports.descriptionInner=c;exports.descriptionShow=d;exports.header=o;exports.headerSticky=l;exports.leftBorder=s;exports.rightBorder=i;exports.root=e;

package/dist/components/FAQComponent/components/FAQComponentItem/faqComponentItem.module.css.es.js

@@ -1,25 +1,27 @@
-const o = "faqComponentItem-module__root___zTwix", e = "faqComponentItem-module__header___LxS2t", t = "faqComponentItem-module__closeButtonWrapper___FMjQq", _ = "faqComponentItem-module__closeButton___yWXnz", n = "faqComponentItem-module__closeButtonActive___eqfRz", r = "faqComponentItem-module__description___UQs0o", c = "faqComponentItem-module__descriptionShow___DZNFQ", m = "faqComponentItem-module__leftBorder___7tMoB", s = "faqComponentItem-module__rightBorder___xiCjz", d = "faqComponentItem-module__headerSticky___nPXFL", l = {
+const o = "faqComponentItem-module__root___zTwix", e = "faqComponentItem-module__header___LxS2t", t = "faqComponentItem-module__closeButtonWrapper___FMjQq", n = "faqComponentItem-module__closeButton___yWXnz", _ = "faqComponentItem-module__closeButtonActive___eqfRz", r = "faqComponentItem-module__description___UQs0o", c = "faqComponentItem-module__descriptionInner___aC4CL", s = "faqComponentItem-module__descriptionShow___DZNFQ", d = "faqComponentItem-module__leftBorder___7tMoB", m = "faqComponentItem-module__rightBorder___xiCjz", i = "faqComponentItem-module__headerSticky___nPXFL", p = {
   root: o,
   header: e,
   closeButtonWrapper: t,
-  closeButton: _,
-  closeButtonActive: n,
+  closeButton: n,
+  closeButtonActive: _,
   description: r,
-  descriptionShow: c,
-  leftBorder: m,
-  rightBorder: s,
-  headerSticky: d
+  descriptionInner: c,
+  descriptionShow: s,
+  leftBorder: d,
+  rightBorder: m,
+  headerSticky: i
 };
 export {
-  _ as closeButton,
-  n as closeButtonActive,
+  n as closeButton,
+  _ as closeButtonActive,
   t as closeButtonWrapper,
-  l as default,
+  p as default,
   r as description,
-  c as descriptionShow,
+  c as descriptionInner,
+  s as descriptionShow,
   e as header,
-  d as headerSticky,
-  m as leftBorder,
-  s as rightBorder,
+  i as headerSticky,
+  d as leftBorder,
+  m as rightBorder,
   o as root
 };

package/dist/components/FilterMenu/FilterMenu.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),y=require("react"),t=require("../../utils/cn/cn.cjs.js"),b=require("../Icon/Icon.cjs.js"),i=require("../Icon/constants.cjs.js"),c=require("../Typography/Typography.cjs.js"),e=require("./filterMenu.module.css.cjs.js");function j({label:o,open:d=!1,options:u,selectedValue:m,onSelect:p}){const[r,f]=y.useState(d),h=()=>f(l=>!l);return a.jsxs("div",{className:e.default.root,children:[a.jsxs("button",{className:e.default.toggleButton,onClick:h,children:[a.jsx(c.Typography,{defaultVariant:"labelLg",emphasis:!0,children:o}),a.jsx(b.Icon,{name:r?i.EIconName.REMOVE:i.EIconName.PLUS,className:e.default.toggleIcon})]}),a.jsx("div",{className:t.cn(e.default.menu,r&&e.default.isOpen),role:"menu",children:u.map((l,s)=>a.jsxs("ul",{className:e.default.subOptions,children:[l.label&&a.jsx("li",{className:t.cn(e.default.divider,s!==0&&e.default.dividerLine),children:a.jsx(c.Typography,{as:"div",defaultVariant:"bodyMd",weight:"medium",className:e.default.dividerLabel,children:l.label})},s),l.values.map(({value:n,label:g})=>a.jsx("li",{className:e.default.option,onClick:()=>p(n,l),children:a.jsx(c.Typography,{as:"div",defaultVariant:"bodyMd",className:t.cn(e.default.optionLabel,n===m&&e.default.selected),children:g})},n))]},`${l.label}_${s}`))})]})}exports.FilterMenu=j;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),j=require("react"),c=require("../../utils/cn/cn.cjs.js"),N=require("../Icon/Icon.cjs.js"),d=require("../Icon/constants.cjs.js"),i=require("../Typography/Typography.cjs.js"),e=require("./filterMenu.module.css.cjs.js");function _({label:u,open:m=!1,multiple:f,options:p,selectedValue:a,headerNode:r,onSelect:h}){const[o,g]=j.useState(m),y=()=>g(s=>!s);return n.jsxs("div",{className:e.default.root,children:[n.jsxs("button",{className:e.default.toggleButton,onClick:y,children:[n.jsx(i.Typography,{defaultVariant:"labelLg",emphasis:!0,children:u}),n.jsx(N.Icon,{name:o?d.EIconName.REMOVE:d.EIconName.PLUS,className:e.default.toggleIcon})]}),n.jsx("div",{className:c.cn(e.default.menu,o&&e.default.isOpen),role:"menu",children:n.jsxs("div",{className:e.default.menuContent,children:[r,p.map((s,t)=>n.jsxs("ul",{className:e.default.subOptions,children:[s.label&&n.jsx("li",{className:c.cn(e.default.divider,{[e.default.dividerLine]:!!(r||t!==0)}),children:n.jsx(i.Typography,{as:"div",defaultVariant:"bodyMd",weight:"medium",className:e.default.dividerLabel,children:s.label})},t),s.values.map(({value:l,label:b})=>n.jsx("li",{className:e.default.option,onClick:()=>h(l,s),children:n.jsx(i.Typography,{as:"div",defaultVariant:"bodyMd",className:c.cn(e.default.optionLabel,{[e.default.selected]:f?a==null?void 0:a.includes(l):l===a}),children:b})},l))]},`${s.label}_${t}`))]})})]})}exports.FilterMenu=_;

package/dist/components/FilterMenu/FilterMenu.d.ts

@@ -1,3 +1,5 @@
+import { default as React } from 'react';
+
 type TOption<T extends string | number> = {
     label: string;
     value: T;
@@ -8,10 +10,17 @@ export type TOptionGroup<T extends string | number> = {
 };
 type FilterMenuProps<T extends string | number> = {
     label: string;
-    selectedValue?: T;
     open?: boolean;
+    multiple?: boolean;
     options: ReadonlyArray<TOptionGroup<T>>;
+    headerNode?: React.ReactNode;
     onSelect: (value: T, optionGroup: TOptionGroup<T>) => void;
-};
-export declare function FilterMenu<T extends string | number>({ label, open, options, selectedValue, onSelect, }: FilterMenuProps<T>): import("react/jsx-runtime").JSX.Element;
+} & ({
+    multiple: true;
+    selectedValue: Array<T>;
+} | {
+    multiple?: false;
+    selectedValue?: T;
+});
+export declare function FilterMenu<T extends string | number>({ label, open, multiple, options, selectedValue, headerNode, onSelect, }: FilterMenuProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};