@zenpatient-org/healthspan-marketing-ui 0.1.153 → 0.1.155

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

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../utils/cn/cn.cjs.js"),v=require("../../ProgressButton/ProgressButton.cjs.js"),u=require("../../Typography/Typography.cjs.js"),b=require("../useComplexImageCarousel.cjs.js"),r=require("./complexImageCarousel.module.css.cjs.js"),I=({images:a})=>{const{MOBILE_BREAKPOINT:n,containerRef:m,carouselRef:f,imageRefs:p,descriptionRef:g,descriptionItemRef:h,progressButtonContainerRef:C,visible:s,cardSizes:o,handleCustomPrevClick:x,handleCustomNextClick:y,current:j,mobileCardIndex:l,xLargeCardIndex:d}=b.useComplexImageCarousel({images:a});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((N,t)=>e.jsx("div",{className:i.cn(r.default.slideContainer,r.default[`size-${o[t]}`]),ref:c=>{c&&(p.current[t]=c)},"data-flip-id":`slide-${(j+t)%a.length}`,"data-size":o[t],children:e.jsx("img",{src:N.image,alt:`Slide ${t+1}`,className:r.default.image})},t+1))}),e.jsx("div",{ref:g,className:r.default.description,children:e.jsxs("div",{ref:h,className:i.cn("description-item",r.default.descriptionItem),children:[e.jsx(u.Typography,{as:"h3",defaultVariant:"headingLg",mobileVariant:"headingSm",children:typeof window<"u"&&window.innerWidth<=n?s[l].title:s[d].title}),e.jsx(u.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",className:r.default.text,children:typeof window<"u"&&window.innerWidth<=n?s[l].description:s[d].description})]})}),e.jsx("div",{ref:C,className:r.default.progressButtonContainer,children:e.jsx(v.ProgressButton,{left:{onClick:x},right:{onClick:y},className:i.cn("progress-buttons",r.default.progressButton)})})]})})};exports.ComplexCarousel=I;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../utils/cn/cn.cjs.js"),v=require("../../ProgressButton/ProgressButton.cjs.js"),u=require("../../Typography/Typography.cjs.js"),b=require("../useComplexImageCarousel.cjs.js"),r=require("./complexImageCarousel.module.css.cjs.js"),I=({images:a})=>{const{MOBILE_BREAKPOINT:n,containerRef:m,carouselRef:f,imageRefs:p,descriptionRef:g,descriptionItemRef:h,progressButtonContainerRef:C,visible:s,cardSizes:o,handleCustomPrevClick:x,handleCustomNextClick:y,current:j,mobileCardIndex:l,xLargeCardIndex:d}=b.useComplexImageCarousel({images:a});return e.jsxs("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((N,t)=>e.jsx("div",{className:i.cn(r.default.slideContainer,r.default[`size-${o[t]}`]),ref:c=>{c&&(p.current[t]=c)},"data-flip-id":`slide-${(j+t)%a.length}`,"data-size":o[t],children:e.jsx("img",{src:N.image,alt:`Slide ${t+1}`,className:r.default.image})},t+1))}),e.jsx("div",{ref:g,className:r.default.description,children:e.jsxs("div",{ref:h,className:i.cn("description-item",r.default.descriptionItem),children:[e.jsx(u.Typography,{as:"h3",defaultVariant:"headingLg",mobileVariant:"headingSm",children:typeof window<"u"&&window.innerWidth<=n?s[l].title:s[d].title}),e.jsx(u.Typography,{as:"p",defaultVariant:"bodyMd",mobileVariant:"bodySm",className:r.default.text,children:typeof window<"u"&&window.innerWidth<=n?s[l].description:s[d].description})]})})]}),e.jsx("div",{ref:C,className:r.default.progressButtonContainer,children:e.jsx(v.ProgressButton,{left:{onClick:x},right:{onClick:y},className:i.cn("progress-buttons",r.default.progressButton)})})]})};exports.ComplexCarousel=I;

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

@@ -1,13 +1,13 @@
 "use client";
-import { jsx as i, jsxs as m } from "react/jsx-runtime";
-import { cn as s } from "../../../utils/cn/cn.es.js";
+import { jsxs as s, jsx as i } from "react/jsx-runtime";
+import { cn as o } from "../../../utils/cn/cn.es.js";
 import { ProgressButton as I } from "../../ProgressButton/ProgressButton.es.js";
 import { Typography as f } from "../../Typography/Typography.es.js";
 import { useComplexImageCarousel as R } from "../useComplexImageCarousel.es.js";
 import e from "./complexImageCarousel.module.css.es.js";
-const L = ({ images: o }) => {
+const L = ({ images: a }) => {
   const {
-    MOBILE_BREAKPOINT: a,
+    MOBILE_BREAKPOINT: n,
     containerRef: p,
     carouselRef: h,
     imageRefs: u,
@@ -15,31 +15,33 @@ const L = ({ images: o }) => {
     descriptionItemRef: C,
     progressButtonContainerRef: N,
     visible: r,
-    cardSizes: n,
+    cardSizes: d,
     handleCustomPrevClick: v,
     handleCustomNextClick: w,
     current: b,
-    mobileCardIndex: d,
-    xLargeCardIndex: l
-  } = R({ images: o });
-  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((y, t) => /* @__PURE__ */ i(
-      "div",
-      {
-        className: s(e.slideContainer, e[`size-${n[t]}`]),
-        ref: (c) => {
-          c && (u.current[t] = c);
+    mobileCardIndex: l,
+    xLargeCardIndex: c
+  } = R({ images: a });
+  return /* @__PURE__ */ s("div", { className: e.root, children: [
+    /* @__PURE__ */ s("div", { ref: p, className: e.container, children: [
+      /* @__PURE__ */ i("div", { ref: h, className: e.carouselArea, children: r.length > 0 && r.map((y, t) => /* @__PURE__ */ i(
+        "div",
+        {
+          className: o(e.slideContainer, e[`size-${d[t]}`]),
+          ref: (m) => {
+            m && (u.current[t] = m);
+          },
+          "data-flip-id": `slide-${(b + t) % a.length}`,
+          "data-size": d[t],
+          children: /* @__PURE__ */ i("img", { src: y.image, alt: `Slide ${t + 1}`, className: e.image })
         },
-        "data-flip-id": `slide-${(b + t) % o.length}`,
-        "data-size": n[t],
-        children: /* @__PURE__ */ i("img", { src: y.image, alt: `Slide ${t + 1}`, className: e.image })
-      },
-      t + 1
-    )) }),
-    /* @__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: "headingSm", children: typeof window < "u" && window.innerWidth <= a ? r[d].title : r[l].title }),
-      /* @__PURE__ */ i(f, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", className: e.text, children: typeof window < "u" && window.innerWidth <= a ? r[d].description : r[l].description })
-    ] }) }),
+        t + 1
+      )) }),
+      /* @__PURE__ */ i("div", { ref: g, className: e.description, children: /* @__PURE__ */ s("div", { ref: C, className: o("description-item", e.descriptionItem), children: [
+        /* @__PURE__ */ i(f, { as: "h3", defaultVariant: "headingLg", mobileVariant: "headingSm", children: typeof window < "u" && window.innerWidth <= n ? r[l].title : r[c].title }),
+        /* @__PURE__ */ i(f, { as: "p", defaultVariant: "bodyMd", mobileVariant: "bodySm", className: e.text, children: typeof window < "u" && window.innerWidth <= n ? r[l].description : r[c].description })
+      ] }) })
+    ] }),
     /* @__PURE__ */ i("div", { ref: N, className: e.progressButtonContainer, children: /* @__PURE__ */ i(
       I,
       {
@@ -49,10 +51,10 @@ const L = ({ images: o }) => {
         right: {
           onClick: w
         },
-        className: s("progress-buttons", e.progressButton)
+        className: o("progress-buttons", e.progressButton)
       }
     ) })
-  ] }) });
+  ] });
 };
 export {
   L as ComplexCarousel

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="complexImageCarousel-module__container___kVKDY",o="complexImageCarousel-module__carouselArea___FSZ0C",s="complexImageCarousel-module__slideContainer___qYXXM",r="complexImageCarousel-module__description___QRpoA",_="complexImageCarousel-module__descriptionItem___X0E-4",l="complexImageCarousel-module__progressButtonContainer___XSlwf",t="complexImageCarousel-module__progressButton___G93Bn",a={container:e,carouselArea:o,slideContainer:s,"size-atom":"complexImageCarousel-module__size-atom___8IEXO","size-small":"complexImageCarousel-module__size-small___8Sjr3","size-medium":"complexImageCarousel-module__size-medium___Fi4B0","size-large":"complexImageCarousel-module__size-large___Kz59p","size-x-large":"complexImageCarousel-module__size-x-large___IGMf2",description:r,descriptionItem:_,progressButtonContainer:l,progressButton:t};exports.carouselArea=o;exports.container=e;exports.default=a;exports.description=r;exports.descriptionItem=_;exports.progressButton=t;exports.progressButtonContainer=l;exports.slideContainer=s;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="complexImageCarousel-module__root___3G7Bu",o="complexImageCarousel-module__container___kVKDY",s="complexImageCarousel-module__carouselArea___FSZ0C",r="complexImageCarousel-module__slideContainer___qYXXM",_="complexImageCarousel-module__description___QRpoA",t="complexImageCarousel-module__descriptionItem___X0E-4",l="complexImageCarousel-module__progressButtonContainer___XSlwf",a="complexImageCarousel-module__progressButton___G93Bn",m={root:e,container:o,carouselArea:s,slideContainer:r,"size-atom":"complexImageCarousel-module__size-atom___8IEXO","size-small":"complexImageCarousel-module__size-small___8Sjr3","size-medium":"complexImageCarousel-module__size-medium___Fi4B0","size-large":"complexImageCarousel-module__size-large___Kz59p","size-x-large":"complexImageCarousel-module__size-x-large___IGMf2",description:_,descriptionItem:t,progressButtonContainer:l,progressButton:a};exports.carouselArea=s;exports.container=o;exports.default=m;exports.description=_;exports.descriptionItem=t;exports.progressButton=a;exports.progressButtonContainer=l;exports.root=e;exports.slideContainer=r;

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

@@ -1,24 +1,26 @@
-const e = "complexImageCarousel-module__container___kVKDY", o = "complexImageCarousel-module__carouselArea___FSZ0C", _ = "complexImageCarousel-module__slideContainer___qYXXM", s = "complexImageCarousel-module__description___QRpoA", l = "complexImageCarousel-module__descriptionItem___X0E-4", r = "complexImageCarousel-module__progressButtonContainer___XSlwf", a = "complexImageCarousel-module__progressButton___G93Bn", m = {
-  container: e,
-  carouselArea: o,
-  slideContainer: _,
+const e = "complexImageCarousel-module__root___3G7Bu", o = "complexImageCarousel-module__container___kVKDY", _ = "complexImageCarousel-module__carouselArea___FSZ0C", s = "complexImageCarousel-module__slideContainer___qYXXM", l = "complexImageCarousel-module__description___QRpoA", r = "complexImageCarousel-module__descriptionItem___X0E-4", a = "complexImageCarousel-module__progressButtonContainer___XSlwf", m = "complexImageCarousel-module__progressButton___G93Bn", t = {
+  root: e,
+  container: o,
+  carouselArea: _,
+  slideContainer: s,
   "size-atom": "complexImageCarousel-module__size-atom___8IEXO",
   "size-small": "complexImageCarousel-module__size-small___8Sjr3",
   "size-medium": "complexImageCarousel-module__size-medium___Fi4B0",
   "size-large": "complexImageCarousel-module__size-large___Kz59p",
   "size-x-large": "complexImageCarousel-module__size-x-large___IGMf2",
-  description: s,
-  descriptionItem: l,
-  progressButtonContainer: r,
-  progressButton: a
+  description: l,
+  descriptionItem: r,
+  progressButtonContainer: a,
+  progressButton: m
 };
 export {
-  o as carouselArea,
-  e as container,
-  m as default,
-  s as description,
-  l as descriptionItem,
-  a as progressButton,
-  r as progressButtonContainer,
-  _ as slideContainer
+  _ as carouselArea,
+  o as container,
+  t as default,
+  l as description,
+  r as descriptionItem,
+  m as progressButton,
+  a as progressButtonContainer,
+  e as root,
+  s as slideContainer
 };

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

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const re=require("../../node_modules/@gsap/react/src/index.cjs.js"),r=require("../../node_modules/gsap/index.cjs.js"),P=require("../../node_modules/gsap/Flip.cjs.js"),U=require("../../node_modules/gsap/Draggable.cjs.js"),c=require("react");r.gsap.registerPlugin(P.Flip);r.gsap.registerPlugin(U.Draggable);const F=12,ne=({images:i})=>{if(i.length>0&&i.length<F){const s=[...i];for(;i.length<F;)i.push(...s)}const[a,q]=c.useState(0),x=c.useRef(a);x.current=a;const[C,T]=c.useState(!1),j=c.useRef(null),t=c.useRef(null),R=c.useRef([]),I=c.useRef(null),N=c.useRef(null),S=c.useRef(null),L=c.useRef(null),u=["atom","small","medium","large","medium","small","atom"],_=["atom","small","medium","large","x-large","large","medium","small","atom"],[$,O]=c.useState(0),[g,G]=c.useState(typeof window<"u"&&window.innerWidth<=930?u:_),V=u.indexOf("large"),J=g.indexOf("x-large"),H=r.gsap.matchMedia(),h=c.useCallback(s=>{var p,K,v,D;if(!t.current)return;let o=0;if(window.innerWidth<=930){const l=t.current.querySelector('[data-size="large"]');o=l?l.offsetHeight:0}else{const l=t.current.querySelector('[data-size="x-large"]');o=l?l.offsetHeight:0,r.gsap.set(t.current,{x:0})}if(o>0&&(O(o),r.gsap.set(t.current,{height:o})),r.gsap.set((p=t.current)==null?void 0:p.querySelectorAll("[data-size]"),{y:0}),!R.current.length)return;const n=(K=t.current)==null?void 0:K.querySelector('[data-size="x-large"]'),e=n==null?void 0:n.getBoundingClientRect(),m=(v=t.current)==null?void 0:v.querySelector('[data-size="large"]'),d=m==null?void 0:m.getBoundingClientRect();H.add({isMobile:"(max-width: 930px)",isDesktop:"(min-width: 931px)"},l=>{var k,W;const{isDesktop:z,isMobile:ee}=l.conditions||{};if(O(((k=t.current)==null?void 0:k.offsetHeight)||0),r.gsap.set(t.current,{height:$||((W=t.current)==null?void 0:W.offsetHeight)||"auto"}),ee){if(!d)return;const f=window.innerWidth/2,E=d.right-d.width/2,M=f-E;if(r.gsap.set(t.current,{x:`+=${M}`}),!S.current)return;const A=S.current.querySelector(".progress-buttons");if(A){const w=A.getBoundingClientRect(),B=w.left+w.width/2,b=f-B;r.gsap.set(A,{x:`+=${b}`})}const te=f-d.width/2;r.gsap.set(I.current,{width:d.width,marginLeft:te}),R.current.forEach((w,B)=>{w&&B<u.length&&(u.forEach(b=>{w.classList.remove(`size-${b}`)}),w.classList.add(`size-${u[B]}`))})}z&&(r.gsap.set(I.current,{width:e?e.width:"auto",marginLeft:e?e.left:0}),R.current.forEach((f,E)=>{f&&E<g.length&&(g.forEach(M=>{f.classList.remove(`size-${M}`)}),f.classList.add(`size-${g[E]}`))}))}),(((D=I.current)==null?void 0:D.querySelectorAll(".description-item"))||[]).forEach((l,z)=>{l.style.zIndex=`${i.length-z}`}),T(!0),L.current=P.Flip.getState(R.current,{simple:!0}),q(s),r.gsap.delayedCall(0,()=>{P.Flip.from(L.current,{duration:.3,ease:"power3.out",absolute:!0,onComplete:()=>{T(!1)}}),r.gsap.fromTo(N.current,{opacity:0,y:20},{opacity:1,y:0,duration:.5,ease:"power3.out",onComplete:()=>{L.current=null}})})},[g,u,i.length,$]),Q=()=>{if(C)return;const s=(a-1+i.length)%i.length;h(s)},X=()=>{if(C)return;const s=(a+1)%i.length;h(s)};function Y(s,o){const n=[];if(typeof window<"u"&&window.innerWidth<=930)for(let e=0;e<u.length;e++)n.push(s[(o+e)%s.length]);else for(let e=0;e<g.length;e++)n.push(s[(o+e)%s.length]);return n}const Z=Y(i,a);return re.useGSAP(()=>{h(a);const s=()=>{G(window.innerWidth<=930?u:_),r.gsap.matchMediaRefresh(),q(0),r.gsap.delayedCall(0,()=>{if(!t.current)return;let n=0;if(window.innerWidth<=930){const e=t.current.querySelector('[data-size="large"]');n=e?e.offsetHeight:0}else{const e=t.current.querySelector('[data-size="x-large"]');n=e?e.offsetHeight:0,r.gsap.set(t.current,{x:0})}n>0&&(O(n),r.gsap.set(t.current,{height:n})),h(a)})};window.addEventListener("resize",s);const o=t.current;if(o)return H.add("(max-width: 930px)",()=>{const n={x:0},e=U.Draggable.create(o,{type:"x",onDragStart:()=>{C||(n.x=o.scrollLeft+o.getBoundingClientRect().left)},onDragEnd:()=>{const d=o.scrollLeft+o.getBoundingClientRect().left-n.x,y=20;if(d>y){if(C)return;const p=(x.current-1+i.length)%i.length;h(p)}else if(d<-y){if(C)return;const p=(x.current+1)%i.length;h(p)}}});return()=>{e[0]&&e[0].kill()}}),()=>{window.removeEventListener("resize",s)}},[]),{MOBILE_BREAKPOINT:930,containerRef:j,carouselRef:t,imageRefs:R,descriptionRef:I,descriptionItemRef:N,progressButtonContainerRef:S,visible:Z,cardSizes:g,handleCustomPrevClick:Q,handleCustomNextClick:X,current:a,mobileCardIndex:V,xLargeCardIndex:J}};exports.useComplexImageCarousel=ne;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const ne=require("../../node_modules/@gsap/react/src/index.cjs.js"),o=require("../../node_modules/gsap/index.cjs.js"),y=require("../../node_modules/gsap/Flip.cjs.js"),F=require("../../node_modules/gsap/Draggable.cjs.js"),s=require("react");o.gsap.registerPlugin(y.Flip);o.gsap.registerPlugin(F.Draggable);const v=12,re=({images:n})=>{if(n.length>0&&n.length<v){const e=[...n];for(;n.length<v;)n.push(...e)}const[d,W]=s.useState(0),E=s.useRef(d);E.current=d;const[p,M]=s.useState(!1),U=s.useRef(null),t=s.useRef(null),C=s.useRef([]),R=s.useRef(null),b=s.useRef(null),j=s.useRef(null),x=s.useRef(null),a=["atom","small","medium","large","medium","small","atom"],z=["atom","small","medium","large","x-large","large","medium","small","atom"],[S,A]=s.useState(0),[g,P]=s.useState(typeof window<"u"&&window.innerWidth<=930?a:z),G=a.indexOf("large"),V=g.indexOf("x-large"),T=o.gsap.matchMedia(),I=s.useCallback(e=>{var q,N,_,$;if(!t.current)return;let i=0;if(window.innerWidth<=930){const l=t.current.querySelector('[data-size="large"]');i=l?l.offsetHeight:0}else{const l=t.current.querySelector('[data-size="x-large"]');i=l?l.offsetHeight:0,o.gsap.set(t.current,{x:0})}if(i>0&&(A(i),o.gsap.set(t.current,{height:i})),o.gsap.set((q=t.current)==null?void 0:q.querySelectorAll("[data-size]"),{y:0}),!C.current.length)return;const c=(N=t.current)==null?void 0:N.querySelector('[data-size="x-large"]'),r=c==null?void 0:c.getBoundingClientRect(),f=(_=t.current)==null?void 0:_.querySelector('[data-size="large"]'),u=f==null?void 0:f.getBoundingClientRect();T.add({isMobile:"(max-width: 930px)",isDesktop:"(min-width: 931px)"},l=>{var D,H,K;const{isDesktop:B,isMobile:Z}=l.conditions||{};if(A(((D=t.current)==null?void 0:D.offsetHeight)||0),Z){if(P(a),o.gsap.set(t.current,{height:S||((H=t.current)==null?void 0:H.offsetHeight)||"auto"}),!u)return;const h=window.innerWidth/2,w=u.right-u.width/2,L=h-w;o.gsap.set(t.current,{x:`+=${L}`});const ee=h-u.width/2;o.gsap.set(R.current,{width:u.width,marginLeft:ee}),C.current.forEach((O,k)=>{O&&k<a.length&&(a.forEach(te=>{O.classList.remove(`size-${te}`)}),O.classList.add(`size-${a[k]}`))})}B&&(P(z),o.gsap.set(t.current,{height:S||((K=t.current)==null?void 0:K.offsetHeight)||"auto"}),o.gsap.set(R.current,{width:r?r.width:"auto",marginLeft:r?r.left:0}),C.current.forEach((h,w)=>{h&&w<g.length&&(g.forEach(L=>{h.classList.remove(`size-${L}`)}),h.classList.add(`size-${g[w]}`))}))}),((($=R.current)==null?void 0:$.querySelectorAll(".description-item"))||[]).forEach((l,B)=>{l.style.zIndex=`${n.length-B}`}),M(!0),x.current=y.Flip.getState(C.current,{simple:!0}),W(e),o.gsap.delayedCall(0,()=>{y.Flip.from(x.current,{duration:.3,ease:"power3.out",absolute:!0,onComplete:()=>{M(!1)}}),o.gsap.fromTo(b.current,{opacity:0,y:20},{opacity:1,y:0,duration:.5,ease:"power3.out",onComplete:()=>{x.current=null}})})},[g,a,n.length,S]),J=()=>{if(p)return;const e=(d-1+n.length)%n.length;I(e)},Q=()=>{if(p)return;const e=(d+1)%n.length;I(e)};function X(e,i){const c=[];if(typeof window<"u"&&window.innerWidth<=930)for(let r=0;r<a.length;r++)c.push(e[(i+r)%e.length]);else for(let r=0;r<g.length;r++)c.push(e[(i+r)%e.length]);return c}const Y=X(n,d);return ne.useGSAP(()=>{I(d);const e=t.current;e&&T.add("(max-width: 930px)",()=>{const i={x:0},c=F.Draggable.create(e,{type:"x",onDragStart:()=>{p||(i.x=e.scrollLeft+e.getBoundingClientRect().left)},onDragEnd:()=>{const f=e.scrollLeft+e.getBoundingClientRect().left-i.x,u=20;if(f>u){if(p)return;const m=(E.current-1+n.length)%n.length;I(m)}else if(f<-u){if(p)return;const m=(E.current+1)%n.length;I(m)}}});return()=>{c[0]&&c[0].kill()}})},[]),{MOBILE_BREAKPOINT:930,containerRef:U,carouselRef:t,imageRefs:C,descriptionRef:R,descriptionItemRef:b,progressButtonContainerRef:j,visible:Y,cardSizes:g,handleCustomPrevClick:J,handleCustomNextClick:Q,current:d,mobileCardIndex:G,xLargeCardIndex:V}};exports.useComplexImageCarousel=re;

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

@@ -1,99 +1,92 @@
 "use client";
-import { useGSAP as ne } from "../../node_modules/@gsap/react/src/index.es.js";
-import { gsap as r } from "../../node_modules/gsap/index.es.js";
-import { Flip as N } from "../../node_modules/gsap/Flip.es.js";
-import { Draggable as G } from "../../node_modules/gsap/Draggable.es.js";
-import { useState as x, useRef as d, useCallback as se } from "react";
-r.registerPlugin(N);
-r.registerPlugin(G);
-const F = 12, de = ({ images: i }) => {
-  if (i.length > 0 && i.length < F) {
-    const s = [...i];
-    for (; i.length < F; )
-      i.push(...s);
+import { useGSAP as nt } from "../../node_modules/@gsap/react/src/index.es.js";
+import { gsap as o } from "../../node_modules/gsap/index.es.js";
+import { Flip as M } from "../../node_modules/gsap/Flip.es.js";
+import { Draggable as U } from "../../node_modules/gsap/Draggable.es.js";
+import { useState as x, useRef as a, useCallback as ot } from "react";
+o.registerPlugin(M);
+o.registerPlugin(U);
+const v = 12, dt = ({ images: r }) => {
+  if (r.length > 0 && r.length < v) {
+    const t = [...r];
+    for (; r.length < v; )
+      r.push(...t);
   }
-  const [l, _] = x(0), L = d(l);
-  L.current = l;
-  const [w, b] = x(!1), V = d(null), t = d(null), C = d([]), I = d(null), H = d(null), O = d(null), S = d(null), u = ["atom", "small", "medium", "large", "medium", "small", "atom"], K = ["atom", "small", "medium", "large", "x-large", "large", "medium", "small", "atom"], [$, y] = x(0), [f, j] = x(
-    typeof window < "u" && window.innerWidth <= 930 ? u : K
-  ), J = u.indexOf("large"), Q = f.indexOf("x-large"), q = r.matchMedia(), h = se(
-    (s) => {
-      var p, k, v, W;
-      if (!t.current) return;
-      let o = 0;
+  const [d, F] = x(0), R = a(d);
+  R.current = d;
+  const [m, z] = x(!1), G = a(null), e = a(null), p = a([]), I = a(null), A = a(null), V = a(null), B = a(null), l = ["atom", "small", "medium", "large", "medium", "small", "atom"], P = ["atom", "small", "medium", "large", "x-large", "large", "medium", "small", "atom"], [L, T] = x(0), [f, b] = x(
+    typeof window < "u" && window.innerWidth <= 930 ? l : P
+  ), j = l.indexOf("large"), J = f.indexOf("x-large"), N = o.matchMedia(), C = ot(
+    (t) => {
+      var _, $, H, K;
+      if (!e.current) return;
+      let s = 0;
       if (window.innerWidth <= 930) {
-        const c = t.current.querySelector('[data-size="large"]');
-        o = c ? c.offsetHeight : 0;
+        const c = e.current.querySelector('[data-size="large"]');
+        s = c ? c.offsetHeight : 0;
       } else {
-        const c = t.current.querySelector('[data-size="x-large"]');
-        o = c ? c.offsetHeight : 0, r.set(t.current, {
+        const c = e.current.querySelector('[data-size="x-large"]');
+        s = c ? c.offsetHeight : 0, o.set(e.current, {
           x: 0
         });
       }
-      if (o > 0 && (y(o), r.set(t.current, {
-        height: o
-      })), r.set((p = t.current) == null ? void 0 : p.querySelectorAll("[data-size]"), {
+      if (s > 0 && (T(s), o.set(e.current, {
+        height: s
+      })), o.set((_ = e.current) == null ? void 0 : _.querySelectorAll("[data-size]"), {
         y: 0
-      }), !C.current.length) return;
-      const n = (k = t.current) == null ? void 0 : k.querySelector('[data-size="x-large"]'), e = n == null ? void 0 : n.getBoundingClientRect(), E = (v = t.current) == null ? void 0 : v.querySelector('[data-size="large"]'), a = E == null ? void 0 : E.getBoundingClientRect();
-      q.add(
+      }), !p.current.length) return;
+      const i = ($ = e.current) == null ? void 0 : $.querySelector('[data-size="x-large"]'), n = i == null ? void 0 : i.getBoundingClientRect(), g = (H = e.current) == null ? void 0 : H.querySelector('[data-size="large"]'), u = g == null ? void 0 : g.getBoundingClientRect();
+      N.add(
         {
           isMobile: "(max-width: 930px)",
           isDesktop: "(min-width: 931px)"
         },
         (c) => {
-          var D, U;
-          const { isDesktop: M, isMobile: te } = c.conditions || {};
-          if (y(((D = t.current) == null ? void 0 : D.offsetHeight) || 0), r.set(t.current, {
-            height: $ || ((U = t.current) == null ? void 0 : U.offsetHeight) || "auto"
-          }), te) {
-            if (!a) return;
-            const g = window.innerWidth / 2, B = a.right - a.width / 2, A = g - B;
-            if (r.set(t.current, {
-              x: `+=${A}`
-            }), !O.current) return;
-            const P = O.current.querySelector(
-              ".progress-buttons"
-            );
-            if (P) {
-              const m = P.getBoundingClientRect(), R = m.left + m.width / 2, T = g - R;
-              r.set(P, {
-                x: `+=${T}`
-              });
-            }
-            const re = g - a.width / 2;
-            r.set(I.current, {
-              width: a.width,
-              marginLeft: re
-            }), C.current.forEach((m, R) => {
-              m && R < u.length && (u.forEach((T) => {
-                m.classList.remove(`size-${T}`);
-              }), m.classList.add(`size-${u[R]}`));
+          var k, q, D;
+          const { isDesktop: S, isMobile: tt } = c.conditions || {};
+          if (T(((k = e.current) == null ? void 0 : k.offsetHeight) || 0), tt) {
+            if (b(l), o.set(e.current, {
+              height: L || ((q = e.current) == null ? void 0 : q.offsetHeight) || "auto"
+            }), !u) return;
+            const h = window.innerWidth / 2, E = u.right - u.width / 2, O = h - E;
+            o.set(e.current, {
+              x: `+=${O}`
+            });
+            const et = h - u.width / 2;
+            o.set(I.current, {
+              width: u.width,
+              marginLeft: et
+            }), p.current.forEach((y, W) => {
+              y && W < l.length && (l.forEach((rt) => {
+                y.classList.remove(`size-${rt}`);
+              }), y.classList.add(`size-${l[W]}`));
             });
           }
-          M && (r.set(I.current, {
-            width: e ? e.width : "auto",
-            marginLeft: e ? e.left : 0
-          }), C.current.forEach((g, B) => {
-            g && B < f.length && (f.forEach((A) => {
-              g.classList.remove(`size-${A}`);
-            }), g.classList.add(`size-${f[B]}`));
+          S && (b(P), o.set(e.current, {
+            height: L || ((D = e.current) == null ? void 0 : D.offsetHeight) || "auto"
+          }), o.set(I.current, {
+            width: n ? n.width : "auto",
+            marginLeft: n ? n.left : 0
+          }), p.current.forEach((h, E) => {
+            h && E < f.length && (f.forEach((O) => {
+              h.classList.remove(`size-${O}`);
+            }), h.classList.add(`size-${f[E]}`));
           }));
         }
-      ), (((W = I.current) == null ? void 0 : W.querySelectorAll(".description-item")) || []).forEach((c, M) => {
-        c.style.zIndex = `${i.length - M}`;
-      }), b(!0), S.current = N.getState(C.current, {
+      ), (((K = I.current) == null ? void 0 : K.querySelectorAll(".description-item")) || []).forEach((c, S) => {
+        c.style.zIndex = `${r.length - S}`;
+      }), z(!0), B.current = M.getState(p.current, {
         simple: !0
-      }), _(s), r.delayedCall(0, () => {
-        N.from(S.current, {
+      }), F(t), o.delayedCall(0, () => {
+        M.from(B.current, {
           duration: 0.3,
           ease: "power3.out",
           absolute: !0,
           onComplete: () => {
-            b(!1);
+            z(!1);
           }
-        }), r.fromTo(
-          H.current,
+        }), o.fromTo(
+          A.current,
           {
             opacity: 0,
             y: 20
@@ -104,98 +97,76 @@ const F = 12, de = ({ images: i }) => {
             duration: 0.5,
             ease: "power3.out",
             onComplete: () => {
-              S.current = null;
+              B.current = null;
             }
           }
         );
       });
     },
-    [f, u, i.length, $]
-  ), X = () => {
-    if (w) return;
-    const s = (l - 1 + i.length) % i.length;
-    h(s);
-  }, Y = () => {
-    if (w) return;
-    const s = (l + 1) % i.length;
-    h(s);
+    [f, l, r.length, L]
+  ), Q = () => {
+    if (m) return;
+    const t = (d - 1 + r.length) % r.length;
+    C(t);
+  }, X = () => {
+    if (m) return;
+    const t = (d + 1) % r.length;
+    C(t);
   };
-  function Z(s, o) {
-    const n = [];
+  function Y(t, s) {
+    const i = [];
     if (typeof window < "u" && window.innerWidth <= 930)
-      for (let e = 0; e < u.length; e++)
-        n.push(s[(o + e) % s.length]);
+      for (let n = 0; n < l.length; n++)
+        i.push(t[(s + n) % t.length]);
     else
-      for (let e = 0; e < f.length; e++)
-        n.push(s[(o + e) % s.length]);
-    return n;
+      for (let n = 0; n < f.length; n++)
+        i.push(t[(s + n) % t.length]);
+    return i;
   }
-  const ee = Z(i, l);
-  return ne(() => {
-    h(l);
-    const s = () => {
-      j(window.innerWidth <= 930 ? u : K), r.matchMediaRefresh(), _(0), r.delayedCall(0, () => {
-        if (!t.current) return;
-        let n = 0;
-        if (window.innerWidth <= 930) {
-          const e = t.current.querySelector('[data-size="large"]');
-          n = e ? e.offsetHeight : 0;
-        } else {
-          const e = t.current.querySelector('[data-size="x-large"]');
-          n = e ? e.offsetHeight : 0, r.set(t.current, {
-            x: 0
-          });
+  const Z = Y(r, d);
+  return nt(() => {
+    C(d);
+    const t = e.current;
+    t && N.add("(max-width: 930px)", () => {
+      const s = { x: 0 }, i = U.create(t, {
+        type: "x",
+        onDragStart: () => {
+          m || (s.x = t.scrollLeft + t.getBoundingClientRect().left);
+        },
+        onDragEnd: () => {
+          const g = t.scrollLeft + t.getBoundingClientRect().left - s.x, u = 20;
+          if (g > u) {
+            if (m) return;
+            const w = (R.current - 1 + r.length) % r.length;
+            C(w);
+          } else if (g < -u) {
+            if (m) return;
+            const w = (R.current + 1) % r.length;
+            C(w);
+          }
         }
-        n > 0 && (y(n), r.set(t.current, {
-          height: n
-        })), h(l);
       });
-    };
-    window.addEventListener("resize", s);
-    const o = t.current;
-    if (o)
-      return q.add("(max-width: 930px)", () => {
-        const n = { x: 0 }, e = G.create(o, {
-          type: "x",
-          onDragStart: () => {
-            w || (n.x = o.scrollLeft + o.getBoundingClientRect().left);
-          },
-          onDragEnd: () => {
-            const a = o.scrollLeft + o.getBoundingClientRect().left - n.x, z = 20;
-            if (a > z) {
-              if (w) return;
-              const p = (L.current - 1 + i.length) % i.length;
-              h(p);
-            } else if (a < -z) {
-              if (w) return;
-              const p = (L.current + 1) % i.length;
-              h(p);
-            }
-          }
-        });
-        return () => {
-          e[0] && e[0].kill();
-        };
-      }), () => {
-        window.removeEventListener("resize", s);
+      return () => {
+        i[0] && i[0].kill();
       };
+    });
   }, []), {
     MOBILE_BREAKPOINT: 930,
-    containerRef: V,
-    carouselRef: t,
-    imageRefs: C,
+    containerRef: G,
+    carouselRef: e,
+    imageRefs: p,
     descriptionRef: I,
-    descriptionItemRef: H,
-    progressButtonContainerRef: O,
-    visible: ee,
+    descriptionItemRef: A,
+    progressButtonContainerRef: V,
+    visible: Z,
     cardSizes: f,
-    handleCustomPrevClick: X,
-    handleCustomNextClick: Y,
-    current: l,
-    mobileCardIndex: J,
-    xLargeCardIndex: Q
+    handleCustomPrevClick: Q,
+    handleCustomNextClick: X,
+    current: d,
+    mobileCardIndex: j,
+    xLargeCardIndex: J
   };
 };
 export {
-  de as useComplexImageCarousel
+  dt as useComplexImageCarousel
 };

package/dist/components/ProductGalleryCard/ProductGalleryCard.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Button/Button.cjs.js"),s=require("../Typography/Typography.cjs.js"),c=require("../../utils/cn/cn.cjs.js"),a=require("./productGalleryCard.module.css.cjs.js"),m=({name:i,price:u,image:d,link:p,buttons:t,isHoverable:n=!0})=>e.jsxs("a",{href:p,target:"_blank",rel:"noopener noreferrer",className:a.default.root,children:[e.jsxs("div",{className:a.default.productInfo,children:[e.jsx(s.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:a.default.title,children:i}),e.jsx(s.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:a.default.price,children:u})]}),e.jsx("img",{src:d,alt:"product image",className:a.default.productImage}),e.jsx("div",{className:c.cn(a.default.buttonContainerDesktop,n&&a.default.hoverableButtons),children:t.map((r,l)=>e.jsx(o.Button,{size:"sm",...r,children:r.label},l))}),e.jsx("div",{className:c.cn(a.default.buttonContainerMobile,n&&a.default.hoverableButtons),children:t.map((r,l)=>e.jsx(o.Button,{size:"xs",...r,children:r.label},l))})]});exports.ProductGalleryCard=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Button/Button.cjs.js"),s=require("../Typography/Typography.cjs.js"),c=require("../../utils/cn/cn.cjs.js"),a=require("./productGalleryCard.module.css.cjs.js"),m=({name:i,price:u,image:d,link:p,buttons:t,isHoverable:n=!0})=>e.jsxs("a",{href:p,rel:"noopener noreferrer",className:a.default.root,children:[e.jsxs("div",{className:a.default.productInfo,children:[e.jsx(s.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:a.default.title,children:i}),e.jsx(s.Typography,{defaultVariant:"labelXl",mobileVariant:"labelLg",className:a.default.price,children:u})]}),e.jsx("img",{src:d,alt:"product image",className:a.default.productImage}),e.jsx("div",{className:c.cn(a.default.buttonContainerDesktop,n&&a.default.hoverableButtons),children:t.map((r,l)=>e.jsx(o.Button,{size:"sm",...r,children:r.label},l))}),e.jsx("div",{className:c.cn(a.default.buttonContainerMobile,n&&a.default.hoverableButtons),children:t.map((r,l)=>e.jsx(o.Button,{size:"xs",...r,children:r.label},l))})]});exports.ProductGalleryCard=m;

package/dist/components/ProductGalleryCard/ProductGalleryCard.es.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsxs as i, jsx as r } from "react/jsx-runtime";
-import { Button as n } from "../Button/Button.es.js";
-import { Typography as s } from "../Typography/Typography.es.js";
+import { Button as s } from "../Button/Button.es.js";
+import { Typography as n } from "../Typography/Typography.es.js";
 import { cn as m } from "../../utils/cn/cn.es.js";
 import e from "./productGalleryCard.module.css.es.js";
 const v = ({
@@ -9,16 +9,16 @@ const v = ({
   price: d,
   image: p,
   link: h,
-  buttons: t,
-  isHoverable: o = !0
-}) => /* @__PURE__ */ i("a", { href: h, target: "_blank", rel: "noopener noreferrer", className: e.root, children: [
+  buttons: o,
+  isHoverable: t = !0
+}) => /* @__PURE__ */ i("a", { href: h, rel: "noopener noreferrer", className: e.root, children: [
   /* @__PURE__ */ i("div", { className: e.productInfo, children: [
-    /* @__PURE__ */ r(s, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: e.title, children: c }),
-    /* @__PURE__ */ r(s, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: e.price, children: d })
+    /* @__PURE__ */ r(n, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: e.title, children: c }),
+    /* @__PURE__ */ r(n, { defaultVariant: "labelXl", mobileVariant: "labelLg", className: e.price, children: d })
   ] }),
   /* @__PURE__ */ r("img", { src: p, alt: "product image", className: e.productImage }),
-  /* @__PURE__ */ r("div", { className: m(e.buttonContainerDesktop, o && e.hoverableButtons), children: t.map((a, l) => /* @__PURE__ */ r(n, { size: "sm", ...a, children: a.label }, l)) }),
-  /* @__PURE__ */ r("div", { className: m(e.buttonContainerMobile, o && e.hoverableButtons), children: t.map((a, l) => /* @__PURE__ */ r(n, { size: "xs", ...a, children: a.label }, l)) })
+  /* @__PURE__ */ r("div", { className: m(e.buttonContainerDesktop, t && e.hoverableButtons), children: o.map((a, l) => /* @__PURE__ */ r(s, { size: "sm", ...a, children: a.label }, l)) }),
+  /* @__PURE__ */ r("div", { className: m(e.buttonContainerMobile, t && e.hoverableButtons), children: o.map((a, l) => /* @__PURE__ */ r(s, { size: "xs", ...a, children: a.label }, l)) })
 ] });
 export {
   v as ProductGalleryCard