@zenpatient-org/healthspan-marketing-ui 0.1.171 → 0.2.1

package/dist/components/FilterMenu/filterMenu.module.css

@@ -0,0 +1,106 @@
+.root {
+    position: relative;
+    width: 240px;
+    max-width: 100%;
+}
+
+.toggleButton {
+    width: 100%;
+    padding: var(--spacing-24) var(--spacing-16);
+    border: none;
+    background: none;
+    border-radius: var(--letter-spacing-null);
+    cursor: pointer;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: var(--spacing-8);
+    border-top: var(--border-width-sm) solid var(--border-color-light);
+    color: var(--color-text-primary);
+}
+
+.toggleIcon {
+    width: 20px;
+    min-width: 20px;
+    height: 20px;
+    min-height: 20px;
+}
+
+.menu {
+    display: grid;
+    grid-template-rows: 0fr;
+    overflow: hidden;
+    color: var(--color-text-primary);
+    transition: grid-template-rows 0.3s, padding-bottom 0.3s;
+}
+
+.subOptions {
+    display: flex;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    flex-direction: column;
+    list-style: none;
+    gap: 4px;
+}
+
+.option {
+    transition: background-color 0.3s linear;
+    border-radius: var(--border-radius-xs);
+    overflow: hidden;
+    cursor: pointer;
+}
+
+.option:hover {
+    outline: none;
+    background-color: var(--color-bg-neutral-light);
+}
+
+.option > .selected {
+    background-color: var(--color-bg-neutral-medium);
+}
+
+.divider {
+    cursor: default;
+    overflow: hidden;
+}
+
+.optionLabel {
+    width: 100%;
+    transition:
+        padding-top 0.3s linear,
+        padding-bottom 0.3s linear;
+    padding: var(--spacing-12) var(--spacing-28);
+}
+
+.dividerLabel {
+    width: 100%;
+    transition:
+        padding-top 0.3s linear,
+        padding-bottom 0.3s linear;
+    padding: var(--spacing-12) var(--spacing-16);
+}
+
+.dividerLine {
+    padding-top: var(--spacing-4);
+    border-top: var(--border-width-sm) solid var(--border-color-light);
+}
+
+.menu.isOpen {
+    gap: var(--spacing-4);
+    grid-template-rows: 1fr;
+}
+
+.menuContent {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    min-height: 0;
+}
+
+@media (width <= 768px) {
+    .root {
+        width: 100%;
+    }
+}

package/dist/components/GalleryPagination/GalleryPagination.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),n=require("../../utils/cn/cn.cjs.js"),e=require("./galleryPagination.module.css.cjs.js"),s=({count:i,activeIndex:l,onSelect:a})=>t.jsx("div",{className:e.default.root,children:Array.from({length:i}).map((u,r)=>t.jsx("button",{type:"button",className:e.default.lineWrap,onClick:()=>a==null?void 0:a(r),children:t.jsx("div",{className:n.cn(e.default.line,r===l&&e.default.active)})},r))});exports.GalleryPagination=s;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),a=require("../../utils/cn/cn.cjs.js"),e=require("../../src/components/GalleryPagination/galleryPagination.module.css"),l=({count:s,activeIndex:i,onSelect:r})=>n.jsx("div",{className:e.root,children:Array.from({length:s}).map((c,t)=>n.jsx("button",{type:"button",className:e.lineWrap,onClick:()=>r==null?void 0:r(t),children:n.jsx("div",{className:a.cn(e.line,t===i&&e.active)})},t))});exports.GalleryPagination=l;

package/dist/components/GalleryPagination/GalleryPagination.es.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as i } from "react/jsx-runtime";
 import { cn as s } from "../../utils/cn/cn.es.js";
-import r from "./galleryPagination.module.css.es.js";
+import r from "../../components/GalleryPagination/galleryPagination.module.css";
 const c = ({ count: m, activeIndex: o, onSelect: a }) => /* @__PURE__ */ i("div", { className: r.root, children: Array.from({ length: m }).map((n, t) => /* @__PURE__ */ i("button", { type: "button", className: r.lineWrap, onClick: () => a == null ? void 0 : a(t), children: /* @__PURE__ */ i("div", { className: s(r.line, t === o && r.active) }) }, t)) });
 export {
   c as GalleryPagination

package/dist/components/GalleryPagination/galleryPagination.module.css

@@ -0,0 +1,38 @@
+.root {
+    display: flex;
+    gap: 8px;
+    width: 100%;
+    max-width: 100%;
+    justify-content: center;
+    align-items: center;
+    flex-wrap: nowrap;
+}
+
+.lineWrap {
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+    padding: 0;
+    background: none;
+    border: none;
+}
+
+.line {
+    height: var(--border-width-sm);
+    width: 100%;
+    background-color: var(--color-bg-fill-brand-disabled);
+    border-radius: var(--border-radius-full);
+    transition: background-color 0.3s, height 0.3s, opacity 0.3s;
+}
+
+.lineWrap:hover > .line:not(.active) {
+    opacity: 0.8;
+}
+
+.active {
+    height: var(--border-width-md);
+    background-color: var(--color-bg-fill-primary);
+}

package/dist/components/HighlightedTitle/HighlightedTitle.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../Typography/Typography.cjs.js"),s=require("../../utils/cn/cn.cjs.js"),t=require("./highlightedTitle.module.css.cjs.js"),h=({title:i,label:r,className:l,defaultVariant:n="displayMd",as:d="h2",mobileVariant:o="headingLg",colorScheme:c="light"})=>e.jsxs("div",{"data-scheme":c,className:s.cn(t.default.root,l),children:[r&&e.jsx(a.Typography,{as:"p",defaultVariant:"labelSm",emphasis:!0,className:t.default.tag,children:r}),e.jsx(a.Typography,{as:d,defaultVariant:n,mobileVariant:o,className:s.cn(t.default.title,{[t.default.taggedTitle]:!!r}),children:typeof i=="string"?e.jsx("p",{children:i}):i})]});exports.HighlightedTitle=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../utils/cn/cn.cjs.js"),s=require("../../src/components/HighlightedTitle/highlightedTitle.module.css"),a=require("../Typography/Typography.cjs.js"),h=({title:t,label:i,className:n,defaultVariant:c="displayMd",as:o="h2",mobileVariant:l="headingLg",colorScheme:g="light"})=>e.jsxs("div",{"data-scheme":g,className:r.cn(s.root,n),children:[i&&e.jsx(a.Typography,{as:"p",defaultVariant:"labelSm",emphasis:!0,className:s.tag,children:i}),e.jsx(a.Typography,{as:o,defaultVariant:c,mobileVariant:l,className:r.cn(s.title,{[s.taggedTitle]:!!i}),children:typeof t=="string"?e.jsx("p",{children:t}):t})]});exports.HighlightedTitle=h;

package/dist/components/HighlightedTitle/HighlightedTitle.es.js

@@ -1,7 +1,7 @@
 import { jsxs as p, jsx as a } from "react/jsx-runtime";
-import { Typography as i } from "../Typography/Typography.es.js";
-import { cn as s } from "../../utils/cn/cn.es.js";
-import e from "./highlightedTitle.module.css.es.js";
+import { cn as i } from "../../utils/cn/cn.es.js";
+import e from "../../components/HighlightedTitle/highlightedTitle.module.css";
+import { Typography as s } from "../Typography/Typography.es.js";
 const y = ({
   title: r,
   label: t,
@@ -10,15 +10,15 @@ const y = ({
   as: d = "h2",
   mobileVariant: h = "headingLg",
   colorScheme: l = "light"
-}) => /* @__PURE__ */ p("div", { "data-scheme": l, className: s(e.root, o), children: [
-  t && /* @__PURE__ */ a(i, { as: "p", defaultVariant: "labelSm", emphasis: !0, className: e.tag, children: t }),
+}) => /* @__PURE__ */ p("div", { "data-scheme": l, className: i(e.root, o), children: [
+  t && /* @__PURE__ */ a(s, { as: "p", defaultVariant: "labelSm", emphasis: !0, className: e.tag, children: t }),
   /* @__PURE__ */ a(
-    i,
+    s,
     {
       as: d,
       defaultVariant: m,
       mobileVariant: h,
-      className: s(e.title, {
+      className: i(e.title, {
         [e.taggedTitle]: !!t
       }),
       children: typeof r == "string" ? /* @__PURE__ */ a("p", { children: r }) : r

package/dist/components/HighlightedTitle/highlightedTitle.module.css

@@ -0,0 +1,59 @@
+.root {
+    --local-color: var(--color-text-primary);
+    --local-highlight: var(--color-text-primary-brand-indigo);
+
+    position: relative;
+    display: flex;
+    color: var(--local-color);
+}
+
+.root[data-scheme='dark'] {
+    --local-color: var(--color-text-primary-inverted);
+    --local-highlight: var(--color-text-primary-brand-solar);
+}
+
+.root[data-scheme='custom'] {
+    --local-color: var(--highlight-color-custom);
+    --local-highlight: var(--highlight-emphasize-custom);
+}
+
+.title {
+    color: var(--local-color);
+
+    strong,
+    b {
+        color: var(--local-highlight);
+        font-weight: inherit;
+    }
+}
+
+.tag {
+    position: absolute;
+    top: 8px;
+    left: 0;
+}
+
+.taggedTitle {
+    text-indent: 200px;
+}
+
+@media screen and (width <= 768px) {
+    .root {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .root[data-scheme='custom'] {
+        --local-color: var(--highlight-color-custom-mobile);
+        --local-highlight: var(--highlight-emphasize-custom-mobile);
+    }
+
+    .tag {
+        position: unset;
+        margin-bottom: 20px;
+    }
+
+    .taggedTitle {
+        text-indent: 0;
+    }
+}

package/dist/components/Icon/Icon.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("react"),e=require("./iconsMap.cjs.js"),i=r.memo(function({name:n,className:c}){const o=e.ICON_COMPONENTS[n];return o?t.jsx(o,{className:c}):(console.warn(`Icon "${n}" not found. Available icons: ${Object.keys(e.ICON_COMPONENTS).join(", ")}`),null)});exports.Icon=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),r=require("react"),e=require("./iconsMap.cjs.js"),i=r.memo(function({name:n,className:t}){const o=e.ICON_COMPONENTS[n];return o?c.jsx(o,{className:t}):(console.warn(`Icon "${n}" not found. Available icons: ${Object.keys(e.ICON_COMPONENTS).join(", ")}`),null)});exports.Icon=i;

package/dist/components/IconBracket/IconBracket.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),a=require("../Icon/Icon.cjs.js"),c=require("../Icon/constants.cjs.js"),o=require("../../utils/cn/cn.cjs.js"),e=require("./iconBracket.module.css.cjs.js"),l={close:c.EIconName.CLOSE_BOLD,plus:c.EIconName.PLUS_BOLD,arrow:c.EIconName.ARROW_BOLD,dot:c.EIconName.DOT},u=({colorScheme:s="dark",size:t,variant:r})=>n.jsxs("div",{className:e.default.root,"data-scheme":s,"data-size":t,children:[n.jsx(a.Icon,{name:c.EIconName.BRACKET_LEFT,className:o.cn(e.default.bracket,e.default.bracketLeft)}),n.jsx("div",{className:e.default.contentIcon,children:n.jsx(a.Icon,{name:l[r],className:e.default[`icon-${t}`]})}),n.jsx(a.Icon,{name:c.EIconName.BRACKET_RIGHT,className:o.cn(e.default.bracket,e.default.bracketRight)})]});exports.IconBracket=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),t=require("../../utils/cn/cn.cjs.js"),e=require("../../src/components/IconBracket/iconBracket.module.css"),c=require("../Icon/constants.cjs.js"),o=require("../Icon/Icon.cjs.js"),m={close:c.EIconName.CLOSE_BOLD,plus:c.EIconName.PLUS_BOLD,arrow:c.EIconName.ARROW_BOLD,dot:c.EIconName.DOT},I=({colorScheme:a="dark",size:s,variant:r})=>n.jsxs("div",{className:e.root,"data-scheme":a,"data-size":s,children:[n.jsx(o.Icon,{name:c.EIconName.BRACKET_LEFT,className:t.cn(e.bracket,e.bracketLeft)}),n.jsx("div",{className:e.contentIcon,children:n.jsx(o.Icon,{name:m[r],className:e[`icon-${s}`]})}),n.jsx(o.Icon,{name:c.EIconName.BRACKET_RIGHT,className:t.cn(e.bracket,e.bracketRight)})]});exports.IconBracket=I;

package/dist/components/IconBracket/IconBracket.es.js

@@ -1,8 +1,8 @@
 import { jsxs as n, jsx as o } from "react/jsx-runtime";
-import { Icon as r } from "../Icon/Icon.es.js";
-import { EIconName as e } from "../Icon/constants.es.js";
 import { cn as t } from "../../utils/cn/cn.es.js";
-import a from "./iconBracket.module.css.es.js";
+import a from "../../components/IconBracket/iconBracket.module.css";
+import { EIconName as e } from "../Icon/constants.es.js";
+import { Icon as r } from "../Icon/Icon.es.js";
 const i = {
   close: e.CLOSE_BOLD,
   plus: e.PLUS_BOLD,

package/dist/components/IconBracket/iconBracket.module.css

@@ -0,0 +1,64 @@
+.root {
+    display: flex;
+    align-items: center;
+    color: var(--color-text-primary);
+}
+
+.root[data-scheme='light'] {
+    color: var(--color-text-primary-inverted);
+}
+
+.root[data-size='sm'] {
+    height: 10px;
+
+    .bracket {
+        width: 3px;
+    }
+
+    .contentIcon {
+        width: 16px;
+    }
+}
+
+.root[data-size='md'] {
+    height: 13px;
+
+    .bracket {
+        width: 4px;
+    }
+
+    .contentIcon {
+        width: 22px;
+    }
+}
+
+.root[data-size='lg'] {
+    height: 16px;
+
+    .bracket {
+        width: 5px;
+    }
+
+    .contentIcon {
+        width: 28px;
+    }
+}
+
+.contentIcon {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+}
+
+.bracket {
+    height: 100%;
+}
+
+.bracketLeft {
+    margin-right: 4px;
+}
+
+.bracketRight {
+    margin-left: 4px;
+}

package/dist/components/IconButton/IconButton.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),l=require("../../utils/cn/cn.cjs.js"),d=require("../Icon/Icon.cjs.js"),e=require("./iconButton.module.css.cjs.js"),m=({iconName:t,variant:s="emphasis",size:o="md",as:c="button",disabled:u=!1,...r})=>{const a=e.default[s]||"",i=e.default[o]||"";return n.jsx(c,{...r,className:l.cn(e.default.button,a,i),disabled:u,children:n.jsx("div",{className:e.default.iconWrap,children:n.jsx(d.Icon,{name:t})})})};exports.IconButton=m;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),l=require("../../utils/cn/cn.cjs.js"),n=require("../../src/components/IconButton/iconButton.module.css"),m=require("../Icon/Icon.cjs.js"),d=({iconName:e,variant:t="emphasis",size:c="md",as:o="button",disabled:r=!1,...i})=>{const a=n[t]||"",u=n[c]||"";return s.jsx(o,{...i,className:l.cn(n.button,a,u),disabled:r,children:s.jsx("div",{className:n.iconWrap,children:s.jsx(m.Icon,{name:e})})})};exports.IconButton=d;

package/dist/components/IconButton/IconButton.es.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx as o } from "react/jsx-runtime";
 import { cn as l } from "../../utils/cn/cn.es.js";
+import s from "../../components/IconButton/iconButton.module.css";
 import { Icon as p } from "../Icon/Icon.es.js";
-import s from "./iconButton.module.css.es.js";
 const b = ({
   iconName: t,
   variant: n = "emphasis",

package/dist/components/IconButton/iconButton.module.css

@@ -0,0 +1,119 @@
+.button {
+    display: inline-flex;
+    width: 100%;
+    align-items: center;
+    justify-content: center;
+    border-radius: var(--border-radius-full);
+    background: none;
+    border: none;
+    padding: 0;
+    margin: 0;
+    cursor: pointer;
+    transition:
+        background-color 0.3s ease,
+        opacity 0.3s ease,
+        color 0.3s ease;
+}
+
+.button:hover {
+    opacity: 0.85;
+}
+
+.emphasis {
+    background-color: var(--color-bg-fill-primary);
+    color: var(--color-text-primary-inverted);
+}
+
+.emphasis-invert {
+    background-color: var(--color-bg-fill-brand-inverse);
+    color: var(--color-text-primary);
+}
+
+.muted {
+    background-color: var(--color-bg-fill-alpha-black-10);
+    color: var(--color-text-primary);
+}
+
+.muted-invert {
+    background-color: var(--color-bg-fill-alpha-white-20);
+    color: var(--color-text-primary-inverted);
+}
+
+.ghost {
+    background-color: transparent;
+    color: var(--color-text-primary);
+}
+
+.xs {
+    max-width: 24px;
+    min-width: 24px;
+    min-height: 24px;
+}
+
+.sm {
+    max-width: 32px;
+    min-width: 32px;
+    min-height: 32px;
+}
+
+.md {
+    max-width: 40px;
+    min-width: 40px;
+    min-height: 40px;
+}
+
+.lg {
+    max-width: 48px;
+    min-width: 48px;
+    min-height: 48px;
+}
+
+.button:disabled {
+    text-decoration: none;
+    cursor: not-allowed;
+    opacity: 0.5;
+}
+
+.iconWrap {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+
+    & > * {
+        width: 100%;
+        height: 100%;
+    }
+}
+
+.lg .iconWrap {
+    width: 24px;
+    min-width: 24px;
+    max-width: 24px;
+    height: 24px;
+    max-height: 24px;
+}
+
+.md .iconWrap {
+    width: 20px;
+    min-width: 20px;
+    max-width: 20px;
+    height: 20px;
+    max-height: 20px;
+}
+
+.sm .iconWrap {
+    width: 16px;
+    min-width: 16px;
+    max-width: 16px;
+    height: 16px;
+    max-height: 16px;
+}
+
+.xs .iconWrap {
+    width: 14px;
+    min-width: 14px;
+    max-width: 14px;
+    height: 14px;
+    max-height: 14px;
+}

package/dist/components/ImageGallery/ImageGallery.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("../../node_modules/swiper/modules/navigation.cjs.js"),c=require("../../node_modules/swiper/swiper-react.cjs.js"),g=require("react"),q=require("../../utils/useSwiper/useSwiper.cjs.js"),w=require("../../utils/cn/cn.cjs.js"),_=require("../Label/Label.cjs.js"),j=require("../GalleryPagination/GalleryPagination.cjs.js");;/* empty css                                        */;/* empty css                                                    */;/* empty css                                                    */const i=require("./imageGallery.module.css.cjs.js"),y=[m.default],x=({images:n,label:l,className:o})=>{const{activeIndex:u,handleSlideTo:t,handleSlideChange:d,onSwiperInit:p,handleSwiperResize:S,handleUserInteraction:r}=q.useSwiperWithAutoPlay(3e3),h=g.useCallback(a=>{r(),t(a)},[r,t]);return e.jsxs("div",{className:w.cn(i.default.root,o),children:[l&&e.jsx("div",{className:i.default.labelWrap,children:e.jsx(_.Label,{color:"black",size:"sm",children:l})}),e.jsx(c.Swiper,{onSwiper:p,onResize:S,onSlideChange:d,onTouchStart:r,onTouchEnd:r,modules:y,spaceBetween:0,slidesPerView:1,className:i.default.swiper,children:n.map((a,s)=>e.jsx(c.SwiperSlide,{children:e.jsx("div",{className:i.default.imageWrapper,children:e.jsx("img",{src:a,alt:"product image",className:i.default.image,onClick:r},s)})},s))}),n.length>1&&e.jsx(j.GalleryPagination,{count:n.length,activeIndex:u,onSelect:h})]})};exports.ImageGallery=x;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("swiper/modules"),c=require("swiper/react"),g=require("react"),q=require("../../utils/useSwiper/useSwiper.cjs.js"),w=require("../../utils/cn/cn.cjs.js");;/* empty css                                        */;/* empty css                                                    */;/* empty css                                                    */const i=require("../../src/components/ImageGallery/imageGallery.module.css"),j=require("../Label/Label.cjs.js"),x=require("../GalleryPagination/GalleryPagination.cjs.js"),y=[m.Navigation],_=({images:r,label:a,className:o})=>{const{activeIndex:u,handleSlideTo:l,handleSlideChange:d,onSwiperInit:S,handleSwiperResize:h,handleUserInteraction:n}=q.useSwiperWithAutoPlay(3e3),p=g.useCallback(s=>{n(),l(s)},[n,l]);return e.jsxs("div",{className:w.cn(i.root,o),children:[a&&e.jsx("div",{className:i.labelWrap,children:e.jsx(j.Label,{color:"black",size:"sm",children:a})}),e.jsx(c.Swiper,{onSwiper:S,onResize:h,onSlideChange:d,onTouchStart:n,onTouchEnd:n,modules:y,spaceBetween:0,slidesPerView:1,className:i.swiper,children:r.map((s,t)=>e.jsx(c.SwiperSlide,{children:e.jsx("div",{className:i.imageWrapper,children:e.jsx("img",{src:s,alt:"product image",className:i.image,onClick:n},t)})},t))}),r.length>1&&e.jsx(x.GalleryPagination,{count:r.length,activeIndex:u,onSelect:p})]})};exports.ImageGallery=_;

package/dist/components/ImageGallery/ImageGallery.es.js

@@ -1,16 +1,16 @@
 "use client";
 import { jsxs as S, jsx as e } from "react/jsx-runtime";
-import g from "../../node_modules/swiper/modules/navigation.es.js";
-import { Swiper as u, SwiperSlide as f } from "../../node_modules/swiper/swiper-react.es.js";
+import { Navigation as g } from "swiper/modules";
+import { Swiper as u, SwiperSlide as f } from "swiper/react";
 import { useCallback as w } from "react";
 import { useSwiperWithAutoPlay as N } from "../../utils/useSwiper/useSwiper.es.js";
 import { cn as v } from "../../utils/cn/cn.es.js";
-import { Label as I } from "../Label/Label.es.js";
-import { GalleryPagination as P } from "../GalleryPagination/GalleryPagination.es.js";
 /* empty css                                      */
 /* empty css                                                  */
 /* empty css                                                  */
-import r from "./imageGallery.module.css.es.js";
+import r from "../../components/ImageGallery/imageGallery.module.css";
+import { Label as I } from "../Label/Label.es.js";
+import { GalleryPagination as P } from "../GalleryPagination/GalleryPagination.es.js";
 const y = [g], U = ({ images: o, label: a, className: m }) => {
   const { activeIndex: c, handleSlideTo: l, handleSlideChange: s, onSwiperInit: p, handleSwiperResize: d, handleUserInteraction: i } = N(3e3), h = w(
     (n) => {

package/dist/components/ImageGallery/imageGallery.module.css

@@ -0,0 +1,64 @@
+.root {
+    position: relative;
+    padding: 24px 0;
+    display: flex;
+    max-width: 100%;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-start;
+    overflow: hidden;
+    border-radius: var(--border-radius-md);
+    background-color: var(--color-bg-neutral-light);
+}
+
+.labelWrap {
+    width: 100%;
+    display: flex;
+    align-items: flex-start;
+    margin-bottom: 12px;
+    padding: 0 24px;
+}
+
+.swiper {
+    width: 100%;
+}
+
+.imageWrapper {
+    width: 100%;
+    height: 480px;
+}
+
+.image {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+}
+
+@media (width <= 1024px) {
+    .imageWrapper {
+        height: 480px;
+    }
+}
+
+@media (width <= 768px) {
+    .root {
+        padding: 16px 0;
+    }
+
+    .labelWrap {
+        padding: 0 16px;
+        margin-bottom: 14px;
+    }
+
+    .swiper {
+        margin-bottom: 14px;
+    }
+
+    .imageWrapper {
+        height: auto;
+    }
+
+    .image {
+        aspect-ratio: 1 / 1;
+    }
+}

package/dist/components/InfiniteScroll/InfiniteScroll.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const I=require("react/jsx-runtime"),o=require("react"),k=require("../../utils/cn/cn.cjs.js"),V=require("../../utils/useIsMobile.cjs.js"),A=require("./infiniteScroll.module.css.cjs.js");function Y({items:p,speed:R=50,direction:F="left",contentClassName:N,itemClassName:$,rootClassName:H,slowOnTouch:x=!1,enableManualScroll:b=!1,renderItem:O},U){const C=o.useRef(null),q=o.useRef(null),g=o.useRef(null),W=o.useRef(!1),w=o.useRef(performance.now()),[f,h]=o.useState(0),[c,B]=o.useState(0),[m,G]=o.useState(4),[D,j]=o.useState(!1),_=V.useIsMobile(),E=o.useCallback(e=>{if(c===0)return e;const t=c;let n=e;for(;n<=-t;)n+=t;for(;n>0;)n-=t;return n},[c]),T=o.useCallback(()=>{if(!q.current||!C.current||p.length===0)return;const e=q.current,t=e.children.length;if(t===0)return;let n=0;for(let s=0;s<Math.min(p.length,t);s++){const d=e.children[s];n+=d.offsetWidth}if(n===0&&(n=e.scrollWidth/m),n<=0)return;const l=C.current.offsetWidth,i=Math.ceil(l*2.5/n),a=Math.max(4,Math.min(20,i%2===0?i:i+1)),u=c,v=m;if(G(a),B(n),u>0&&v>0){const s=Math.floor(v/2),d=Math.floor(a/2),S=(f+u*s)/u,r=-n*d+S*n;h(r)}else{const s=Math.floor(a/2);h(-n*s)}},[p.length,m,c,f]);o.useEffect(()=>{T();const e=new ResizeObserver(()=>{T()});return C.current&&e.observe(C.current),()=>e.disconnect()},[T]);const y=o.useCallback(e=>{if(W.current||c===0){g.current=requestAnimationFrame(y);return}const t=e??performance.now(),n=t-w.current||16.67;w.current=t,h(l=>{const i=D?R*.5:R,a=F==="right"?-i:i;let u=l-a*(n/1e3);return E(u)}),g.current=requestAnimationFrame(y)},[F,R,c,D,E]);o.useEffect(()=>(w.current=performance.now(),g.current=requestAnimationFrame(y),()=>{g.current&&cancelAnimationFrame(g.current)}),[y]);const X=o.useCallback((e,t)=>{!(t==="mouse")&&!(t==="touch"&&_)||(e?x?j(!0):W.current=!0:(W.current=!1,j(!1),w.current=performance.now()))},[_,x]),J=o.useCallback(e=>{X(!0,e.pointerType)},[X]),K=o.useCallback(e=>{X(!1,e.pointerType)},[X]),z=o.useCallback((e,t=300)=>{const n=f,l=e-n,i=performance.now(),a=u=>{const v=u-i,s=Math.min(v/t,1),d=1-Math.pow(1-s,3);h(n+l*d),s<1&&requestAnimationFrame(a)};requestAnimationFrame(a)},[f]);return o.useEffect(()=>{if(!b)return;const e=C.current;if(!e)return;let t=null,n=!1,l=null;const i=r=>{if(r.deltaX!==0){r.preventDefault();const M=r.deltaX*2;h(L=>E(L-M))}},a=r=>{n=!0,l=r.clientX,r.preventDefault()},u=r=>{if(!n||l===null)return;const M=r.clientX,L=M-l;l=M,h(P=>E(P+L))},v=()=>{n=!1,l=null},s=r=>{t=r.touches[0].clientX},d=r=>{if(t===null)return;r.preventDefault();const L=r.touches[0].clientX,P=L-t;t=L,h(Q=>E(Q+P))},S=()=>{t=null};return e.addEventListener("wheel",i,{passive:!1}),e.addEventListener("mousedown",a,{passive:!1}),e.addEventListener("mousemove",u,{passive:!1}),e.addEventListener("touchstart",s),e.addEventListener("touchmove",d,{passive:!1}),e.addEventListener("touchend",S),document.addEventListener("mouseup",v),document.addEventListener("mousemove",u),()=>{e.removeEventListener("wheel",i),e.removeEventListener("mousedown",a),e.removeEventListener("mousemove",u),e.removeEventListener("touchstart",s),e.removeEventListener("touchmove",d),e.removeEventListener("touchend",S),document.removeEventListener("mouseup",v),document.removeEventListener("mousemove",u)}},[b,E]),o.useImperativeHandle(U,()=>({scrollLeft:()=>{const e=c*m,t=-c*Math.floor(m/2);let n=f-200;n<-e+t&&(n+=c),z(n)},scrollRight:()=>{const e=-c*Math.floor(m/2);let t=f+200;t>e&&(t-=c),z(t)}})),I.jsx("div",{className:k.cn(A.default.root,H),ref:C,"data-manual-scroll":b,onPointerEnter:J,onPointerLeave:K,children:I.jsx("div",{className:k.cn(A.default.content,N),ref:q,style:{transform:`translate3d(${f}px, 0, 0)`},children:Array.from({length:p.length*m},(e,t)=>I.jsx("div",{className:k.cn(A.default.item,$),children:O(p[t%p.length],t)},t))})})}const Z=o.forwardRef(Y);exports.InfiniteScroll=Z;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const I=require("react/jsx-runtime"),o=require("react"),k=require("../../utils/cn/cn.cjs.js"),V=require("../../utils/useIsMobile.cjs.js"),A=require("../../src/components/InfiniteScroll/infiniteScroll.module.css");function Y({items:p,speed:S=50,direction:x="left",contentClassName:_,itemClassName:H,rootClassName:O,slowOnTouch:F=!1,enableManualScroll:b=!1,renderItem:U},$){const C=o.useRef(null),W=o.useRef(null),g=o.useRef(null),q=o.useRef(!1),y=o.useRef(performance.now()),[f,h]=o.useState(0),[c,B]=o.useState(0),[m,G]=o.useState(4),[j,D]=o.useState(!1),z=V.useIsMobile(),E=o.useCallback(e=>{if(c===0)return e;const t=c;let n=e;for(;n<=-t;)n+=t;for(;n>0;)n-=t;return n},[c]),T=o.useCallback(()=>{if(!W.current||!C.current||p.length===0)return;const e=W.current,t=e.children.length;if(t===0)return;let n=0;for(let r=0;r<Math.min(p.length,t);r++){const d=e.children[r];n+=d.offsetWidth}if(n===0&&(n=e.scrollWidth/m),n<=0)return;const l=C.current.offsetWidth,u=Math.ceil(l*2.5/n),a=Math.max(4,Math.min(20,u%2===0?u:u+1)),i=c,v=m;if(G(a),B(n),i>0&&v>0){const r=Math.floor(v/2),d=Math.floor(a/2),R=(f+i*r)/i,s=-n*d+R*n;h(s)}else{const r=Math.floor(a/2);h(-n*r)}},[p.length,m,c,f]);o.useEffect(()=>{T();const e=new ResizeObserver(()=>{T()});return C.current&&e.observe(C.current),()=>e.disconnect()},[T]);const X=o.useCallback(e=>{if(q.current||c===0){g.current=requestAnimationFrame(X);return}const t=e!=null?e:performance.now(),n=t-y.current||16.67;y.current=t,h(l=>{const u=j?S*.5:S,a=x==="right"?-u:u;let i=l-a*(n/1e3);return E(i)}),g.current=requestAnimationFrame(X)},[x,S,c,j,E]);o.useEffect(()=>(y.current=performance.now(),g.current=requestAnimationFrame(X),()=>{g.current&&cancelAnimationFrame(g.current)}),[X]);const w=o.useCallback((e,t)=>{!(t==="mouse")&&!(t==="touch"&&z)||(e?F?D(!0):q.current=!0:(q.current=!1,D(!1),y.current=performance.now()))},[z,F]),J=o.useCallback(e=>{w(!0,e.pointerType)},[w]),K=o.useCallback(e=>{w(!1,e.pointerType)},[w]),N=o.useCallback((e,t=300)=>{const n=f,l=e-n,u=performance.now(),a=i=>{const v=i-u,r=Math.min(v/t,1),d=1-Math.pow(1-r,3);h(n+l*d),r<1&&requestAnimationFrame(a)};requestAnimationFrame(a)},[f]);return o.useEffect(()=>{if(!b)return;const e=C.current;if(!e)return;let t=null,n=!1,l=null;const u=s=>{if(s.deltaX!==0){s.preventDefault();const M=s.deltaX*2;h(L=>E(L-M))}},a=s=>{n=!0,l=s.clientX,s.preventDefault()},i=s=>{if(!n||l===null)return;const M=s.clientX,L=M-l;l=M,h(P=>E(P+L))},v=()=>{n=!1,l=null},r=s=>{t=s.touches[0].clientX},d=s=>{if(t===null)return;s.preventDefault();const L=s.touches[0].clientX,P=L-t;t=L,h(Q=>E(Q+P))},R=()=>{t=null};return e.addEventListener("wheel",u,{passive:!1}),e.addEventListener("mousedown",a,{passive:!1}),e.addEventListener("mousemove",i,{passive:!1}),e.addEventListener("touchstart",r),e.addEventListener("touchmove",d,{passive:!1}),e.addEventListener("touchend",R),document.addEventListener("mouseup",v),document.addEventListener("mousemove",i),()=>{e.removeEventListener("wheel",u),e.removeEventListener("mousedown",a),e.removeEventListener("mousemove",i),e.removeEventListener("touchstart",r),e.removeEventListener("touchmove",d),e.removeEventListener("touchend",R),document.removeEventListener("mouseup",v),document.removeEventListener("mousemove",i)}},[b,E]),o.useImperativeHandle($,()=>({scrollLeft:()=>{const e=c*m,t=-c*Math.floor(m/2);let n=f-200;n<-e+t&&(n+=c),N(n)},scrollRight:()=>{const e=-c*Math.floor(m/2);let t=f+200;t>e&&(t-=c),N(t)}})),I.jsx("div",{className:k.cn(A.root,O),ref:C,"data-manual-scroll":b,onPointerEnter:J,onPointerLeave:K,children:I.jsx("div",{className:k.cn(A.content,_),ref:W,style:{transform:`translate3d(${f}px, 0, 0)`},children:Array.from({length:p.length*m},(e,t)=>I.jsx("div",{className:k.cn(A.item,H),children:U(p[t%p.length],t)},t))})})}const Z=o.forwardRef(Y);exports.InfiniteScroll=Z;