@banzamel/mineralui 1.8.0 → 1.9.0

package/dist/media-IQ4iYTs-.js

@@ -0,0 +1,391 @@
+import { Fi as e, Pi as t } from "./icons-CfpYxnfg.js";
+import { t as n } from "./cn-YER3QsV1.js";
+import { t as r } from "./useInteractionEffect-DtpbVd77.js";
+import { t as i } from "./MButton-C1pnL4_j.js";
+import { i as a, n as o, r as s } from "./MSkeleton-CVofhuDp.js";
+import { a as c, c as l, i as u, n as d, o as f, r as p, s as m } from "./MAvatarStack-CrhkO_SO.js";
+import { Children as h, useCallback as g, useEffect as _, useMemo as v, useRef as y, useState as b } from "react";
+import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
+//#region src/components/media/MGallery/MGallery.tsx
+function w({ items: e, columns: t = 3, rounded: r = !0, preview: i = !1, hoverEffect: a = "zoom", clickEffect: o = "ripple", className: s, ...c }) {
+	let [u, d] = b(!1), [f, p] = b(0);
+	return /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S("div", {
+		className: n("gallery", `columns-${t}`, s),
+		...c,
+		children: e.map((e, t) => /* @__PURE__ */ S(T, {
+			item: e,
+			rounded: r,
+			preview: i,
+			hoverEffect: a,
+			clickEffect: o,
+			onOpen: () => {
+				p(t), d(!0);
+			}
+		}, t))
+	}), /* @__PURE__ */ S(l, {
+		open: u,
+		items: e,
+		activeIndex: f,
+		onActiveIndexChange: p,
+		onClose: () => d(!1)
+	})] });
+}
+function T({ item: e, rounded: t, preview: i, hoverEffect: a, clickEffect: o, onOpen: s }) {
+	let { effectClassName: l, effectLayer: d, handlePointerDown: f } = r({ effect: o });
+	return /* @__PURE__ */ S("figure", {
+		className: n("gallery-item", t && "rounded"),
+		children: i ? /* @__PURE__ */ C("button", {
+			type: "button",
+			className: n("gallery-trigger", t && "rounded", "gallery-button", c(a) && "effect-zoom", u(a) && "effect-dim", l),
+			onClick: s,
+			onPointerDown: f,
+			"aria-label": `Preview ${e.alt || "image"}`,
+			children: [
+				/* @__PURE__ */ S("img", {
+					className: "gallery-image",
+					src: e.thumbnail || e.src,
+					alt: e.alt || "",
+					loading: "lazy"
+				}),
+				e.caption && /* @__PURE__ */ S("span", {
+					className: "gallery-caption",
+					children: e.caption
+				}),
+				d
+			]
+		}) : /* @__PURE__ */ C("div", {
+			className: n("gallery-trigger", t && "rounded", c(a) && "effect-zoom", u(a) && "effect-dim", l),
+			onPointerDown: f,
+			children: [
+				/* @__PURE__ */ S("img", {
+					className: "gallery-image",
+					src: e.thumbnail || e.src,
+					alt: e.alt || "",
+					loading: "lazy"
+				}),
+				e.caption && /* @__PURE__ */ S("span", {
+					className: "gallery-caption",
+					children: e.caption
+				}),
+				d
+			]
+		})
+	});
+}
+//#endregion
+//#region src/components/media/MCarousel/MCarousel.tsx
+function E({ autoPlay: r = !1, interval: a = 5e3, showDots: o = !0, showArrows: s = !0, loop: c = !0, draggable: l = !0, transition: u = "slide", className: d, children: f, ...p }) {
+	let m = h.toArray(f), v = m.length, [w, T] = b(0), [E, D] = b(0), [O, k] = b(!1), A = y(0), j = y(null), M = g((e) => {
+		T(c ? (e + v) % v : Math.max(0, Math.min(e, v - 1)));
+	}, [v, c]), N = g(() => M(w - 1), [w, M]), P = g(() => M(w + 1), [w, M]);
+	_(() => {
+		if (!r || v <= 1 || O) return;
+		let e = setInterval(P, a);
+		return () => clearInterval(e);
+	}, [
+		r,
+		a,
+		P,
+		v,
+		O
+	]);
+	let F = (e) => {
+		l && (k(!0), A.current = e, D(0));
+	}, I = (e) => {
+		O && D(e - A.current);
+	}, L = () => {
+		O && (k(!1), E < -50 ? P() : E > 50 && N(), D(0));
+	}, R = (e) => {
+		l && (e.currentTarget.setPointerCapture(e.pointerId), F(e.clientX));
+	}, z = (e) => {
+		I(e.clientX);
+	}, B = () => {
+		L();
+	};
+	if (v === 0) return null;
+	let V = u === "fade", H = V ? void 0 : { transform: `translateX(calc(-${w * 100}% + ${O ? E : 0}px))` };
+	return /* @__PURE__ */ C("div", {
+		className: n("carousel", V && "fade", d),
+		...p,
+		children: [
+			/* @__PURE__ */ S("div", {
+				className: "carousel-viewport",
+				onPointerDown: R,
+				onPointerMove: z,
+				onPointerUp: B,
+				onPointerCancel: B,
+				style: {
+					touchAction: l ? "pan-y" : void 0,
+					cursor: l ? O ? "grabbing" : "grab" : void 0
+				},
+				children: /* @__PURE__ */ S("div", {
+					ref: j,
+					className: n("carousel-track", O && "dragging"),
+					style: H,
+					children: m.map((e, t) => /* @__PURE__ */ S("div", {
+						className: n("carousel-slide", V && t === w && "active", V && t !== w && "hidden"),
+						children: e
+					}, t))
+				})
+			}),
+			s && v > 1 && /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(i, {
+				variant: "ghost",
+				color: "primary",
+				iconOnly: !0,
+				shape: "circle",
+				onClick: N,
+				"aria-label": "Previous slide",
+				className: "carousel-arrow carousel-arrow-prev",
+				children: /* @__PURE__ */ S(e, {})
+			}), /* @__PURE__ */ S(i, {
+				variant: "ghost",
+				color: "primary",
+				iconOnly: !0,
+				shape: "circle",
+				onClick: P,
+				"aria-label": "Next slide",
+				className: "carousel-arrow carousel-arrow-next",
+				children: /* @__PURE__ */ S(t, {})
+			})] }),
+			o && v > 1 && /* @__PURE__ */ S("div", {
+				className: "carousel-dots",
+				children: m.map((e, t) => /* @__PURE__ */ S("button", {
+					className: n("carousel-dot", t === w && "active"),
+					onClick: () => M(t),
+					"aria-label": `Slide ${t + 1}`,
+					type: "button"
+				}, t))
+			})
+		]
+	});
+}
+//#endregion
+//#region src/components/media/MShowcaseCarouselItem/MShowcaseCarouselItem.tsx
+function D({ src: e, alt: t = "", media: r, mediaHeight: i, overlay: c, body: l, footer: u, interactive: h = !1, imageClickEffect: g = "ripple", ratio: _ = "16:9", fit: v = "cover", imgProps: y, children: b }) {
+	let x = l ?? b, w = f(g), T = i ? { "--media-height": typeof i == "number" ? `${i}px` : i } : void 0, E = !!(r || e);
+	return /* @__PURE__ */ C(o, {
+		interactive: h,
+		clickEffect: g === "none" ? void 0 : "none",
+		className: n("showcase card", h && "interactive"),
+		style: T,
+		children: [
+			E ? /* @__PURE__ */ C("div", {
+				className: n("showcase media", m(g) && "effect-zoom", p(g) && "effect-dim"),
+				children: [r ? /* @__PURE__ */ S("div", {
+					className: "showcase media-content",
+					children: r
+				}) : /* @__PURE__ */ S(d, {
+					...y,
+					src: e,
+					alt: t,
+					ratio: _,
+					fit: v,
+					rounded: !0,
+					shadow: !0,
+					clickEffect: w ? "ripple" : "none"
+				}), c ? /* @__PURE__ */ S("div", {
+					className: "showcase overlay",
+					children: c
+				}) : null]
+			}) : null,
+			x ? /* @__PURE__ */ S(s, {
+				className: "showcase body",
+				children: x
+			}) : null,
+			u ? /* @__PURE__ */ S(a, {
+				className: "showcase footer",
+				children: u
+			}) : null
+		]
+	});
+}
+//#endregion
+//#region src/components/media/MShowcaseCarousel/MShowcaseCarousel.tsx
+function O(e, t, n) {
+	return Math.min(Math.max(e, t), n);
+}
+function k(e) {
+	return e instanceof Element ? !!e.closest("button, a, input, select, textarea, label, summary, [role=\"button\"], [role=\"link\"], [data-carousel-ignore-drag=\"true\"]") : !1;
+}
+function A(e, t, n) {
+	return e && t ? e.map((e, n) => t(e, n)) : e ? e.map((e, t) => j(e) ? /* @__PURE__ */ S(M, { item: e }, t) : null).filter(Boolean) : h.toArray(n);
+}
+function j(e) {
+	let t = e;
+	return !!e && typeof e == "object" && "src" in e && typeof t.src == "string";
+}
+function M({ item: e }) {
+	return /* @__PURE__ */ S(D, {
+		src: e.src,
+		alt: e.alt || "",
+		overlay: e.overlay
+	});
+}
+function N({ items: r, renderItem: a, initialIndex: o, showButtons: s = !0, loop: c = !0, draggable: l = !0, wheel: u = !0, itemMinWidth: d = 220, itemMaxWidth: f = 520, itemWidthRatio: p = .56, className: m, children: h, style: x, ...w }) {
+	let T = v(() => A(r, a, h), [
+		h,
+		r,
+		a
+	]), E = T.length, [D, j] = b(0), [M, N] = b(0), [P, F] = b(!1), [I, L] = b(0), R = y(null), z = y(0), B = y(!1), V = O(I * (I < 640 ? Math.max(p, .78) : I < 960 ? Math.max(p, .66) : p) || d, d, f), H = O(I * .022 || 16, 10, 24);
+	_(() => {
+		let e = R.current;
+		if (!e) return;
+		let t = () => L(e.clientWidth);
+		t();
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, []), _(() => {
+		E && j(O(o ?? Math.floor((E - 1) / 2), 0, E - 1));
+	}, [E, o]);
+	let U = g((e) => {
+		if (!(E < 1)) {
+			if (c) {
+				j((e + E) % E);
+				return;
+			}
+			j(O(e, 0, E - 1));
+		}
+	}, [E, c]), W = g(() => U(D - 1), [D, U]), G = g(() => U(D + 1), [D, U]), K = (e) => {
+		!l || E <= 1 || k(e.target) || (e.currentTarget.setPointerCapture(e.pointerId), F(!0), z.current = e.clientX, N(0));
+	}, q = (e) => {
+		P && N(e.clientX - z.current);
+	}, J = () => {
+		if (!P) return;
+		let e = Math.max(56, V * .12);
+		M <= -e ? G() : M >= e && W(), F(!1), N(0);
+	};
+	if (_(() => {
+		let e = R.current;
+		if (!e) return;
+		let t = (e) => {
+			if (!u || E <= 1 || B.current) return;
+			let t = Math.abs(e.deltaX) > Math.abs(e.deltaY) ? e.deltaX : e.deltaY;
+			Math.abs(t) < 28 || (e.preventDefault(), e.stopPropagation(), B.current = !0, window.setTimeout(() => {
+				B.current = !1;
+			}, 260), t > 0 ? G() : W());
+		};
+		return e.addEventListener("wheel", t, { passive: !1 }), () => e.removeEventListener("wheel", t);
+	}, [
+		E,
+		G,
+		W,
+		u
+	]), !E) return null;
+	let Y = I / 2 - D * (V + H) - V / 2 + M;
+	return /* @__PURE__ */ C("div", {
+		className: n("showcase", m),
+		style: {
+			...x,
+			"--item-width": `${V}px`
+		},
+		...w,
+		children: [/* @__PURE__ */ S("div", {
+			ref: R,
+			className: "showcase-stage",
+			onPointerDown: K,
+			onPointerMove: q,
+			onPointerUp: J,
+			onPointerCancel: J,
+			onPointerLeave: J,
+			style: { cursor: l && E > 1 ? P ? "grabbing" : "grab" : void 0 },
+			children: /* @__PURE__ */ S("div", {
+				className: n("showcase-track", P && "dragging"),
+				style: {
+					transform: `translateX(${Y}px)`,
+					gap: `${H}px`
+				},
+				children: T.map((e, t) => {
+					let r = Math.abs(t - D);
+					return /* @__PURE__ */ S("div", {
+						className: n("showcase-item", t === D && "active", r === 1 && "near", r >= 2 && "far"),
+						style: { zIndex: Math.max(1, E - r) },
+						children: e
+					}, t);
+				})
+			})
+		}), s && E > 1 && /* @__PURE__ */ C("div", {
+			className: "showcase-actions",
+			children: [/* @__PURE__ */ S(i, {
+				type: "button",
+				variant: "secondary",
+				className: "showcase-btn",
+				startIcon: /* @__PURE__ */ S(e, {}),
+				onClick: W,
+				children: "Previous"
+			}), /* @__PURE__ */ S(i, {
+				type: "button",
+				className: "showcase-btn",
+				endIcon: /* @__PURE__ */ S(t, {}),
+				onClick: G,
+				children: "Next"
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/components/media/MMasonry/MMasonry.tsx
+function P(e, t, n) {
+	return e && t ? e.map((e, n) => t(e, n)) : h.toArray(n);
+}
+function F({ items: e, renderItem: t, columns: r = 3, className: i, children: a, style: o, ...s }) {
+	let c = P(e, t, a);
+	return c.length ? /* @__PURE__ */ S("div", {
+		className: n("masonry", i),
+		style: {
+			...o,
+			columnCount: r
+		},
+		...s,
+		children: c.map((e, t) => /* @__PURE__ */ S("div", {
+			className: "masonry item",
+			children: e
+		}, t))
+	}) : null;
+}
+//#endregion
+//#region src/components/media/MMasonryItem/MMasonryItem.tsx
+function I({ src: e, alt: t = "", height: i, overlay: c, body: l, footer: u, interactive: d = !1, imageClickEffect: h = "none", imgProps: g, children: _ }) {
+	let v = i ? {
+		...g?.style,
+		height: i
+	} : g?.style, y = l ?? _, { effectClassName: b, effectLayer: x, handlePointerDown: w } = r({ effect: f(h) ? "ripple" : "none" });
+	return /* @__PURE__ */ C(o, {
+		interactive: d,
+		clickEffect: h === "none" ? void 0 : "none",
+		className: n("masonry card", d && "interactive"),
+		children: [
+			/* @__PURE__ */ C("div", {
+				className: n("masonry media", b, m(h) && "effect-zoom", p(h) && "effect-dim"),
+				onPointerDown: (e) => {
+					e.target.closest(".masonry.overlay") || w(e);
+				},
+				children: [
+					/* @__PURE__ */ S("img", {
+						...g,
+						src: e,
+						alt: t,
+						className: "masonry img",
+						style: v
+					}),
+					c ? /* @__PURE__ */ S("div", {
+						className: "masonry overlay",
+						children: c
+					}) : null,
+					x
+				]
+			}),
+			y ? /* @__PURE__ */ S(s, {
+				className: "masonry body",
+				children: y
+			}) : null,
+			u ? /* @__PURE__ */ S(a, {
+				className: "masonry footer",
+				children: u
+			}) : null
+		]
+	});
+}
+//#endregion
+export { E as a, D as i, F as n, w as o, N as r, I as t };
+
+//# sourceMappingURL=media-IQ4iYTs-.js.map

package/dist/media-IQ4iYTs-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-IQ4iYTs-.js","names":[],"sources":["../src/components/media/MGallery/MGallery.tsx","../src/components/media/MCarousel/MCarousel.tsx","../src/components/media/MShowcaseCarouselItem/MShowcaseCarouselItem.tsx","../src/components/media/MShowcaseCarousel/MShowcaseCarousel.tsx","../src/components/media/MMasonry/MMasonry.tsx","../src/components/media/MMasonryItem/MMasonryItem.tsx"],"sourcesContent":["import type {MGalleryProps} from './MGallery.types'\nimport {useState} from 'react'\nimport {cn} from '../../../utils/cn'\nimport {useInteractionEffect} from '../../../utils/useInteractionEffect'\nimport {MMediaLightbox} from '../MMediaLightbox/MMediaLightbox'\nimport {usesHoverDim, usesHoverZoom} from '../mediaInteraction'\nimport './MGallery.css'\n\n// Render a responsive image grid gallery.\nexport function MGallery({\n    items,\n    columns = 3,\n    rounded = true,\n    preview = false,\n    hoverEffect = 'zoom',\n    clickEffect = 'ripple',\n    className,\n    ...rest\n}: MGalleryProps) {\n    const [previewOpen, setPreviewOpen] = useState(false)\n    const [previewIndex, setPreviewIndex] = useState(0)\n\n    return (\n        <>\n            <div className={cn('gallery', `columns-${columns}`, className)} {...rest}>\n                {items.map((item, i) => (\n                    <GalleryFigure\n                        key={i}\n                        item={item}\n                        rounded={rounded}\n                        preview={preview}\n                        hoverEffect={hoverEffect}\n                        clickEffect={clickEffect}\n                        onOpen={() => {\n                            setPreviewIndex(i)\n                            setPreviewOpen(true)\n                        }}\n                    />\n                ))}\n            </div>\n\n            <MMediaLightbox\n                open={previewOpen}\n                items={items}\n                activeIndex={previewIndex}\n                onActiveIndexChange={setPreviewIndex}\n                onClose={() => setPreviewOpen(false)}\n            />\n        </>\n    )\n}\n\nfunction GalleryFigure({\n    item,\n    rounded,\n    preview,\n    hoverEffect,\n    clickEffect,\n    onOpen,\n}: {\n    item: {src: string; thumbnail?: string; alt?: string; caption?: string}\n    rounded: boolean\n    preview: boolean\n    hoverEffect: 'none' | 'zoom' | 'dim' | 'zoom-dim'\n    clickEffect: 'none' | 'ripple'\n    onOpen: () => void\n}) {\n    const {effectClassName, effectLayer, handlePointerDown} = useInteractionEffect<HTMLElement>({\n        effect: clickEffect,\n    })\n    return (\n        <figure className={cn('gallery-item', rounded && 'rounded')}>\n            {preview ? (\n                <button\n                    type=\"button\"\n                    className={cn(\n                        'gallery-trigger',\n                        rounded && 'rounded',\n                        'gallery-button',\n                        usesHoverZoom(hoverEffect) && 'effect-zoom',\n                        usesHoverDim(hoverEffect) && 'effect-dim',\n                        effectClassName\n                    )}\n                    onClick={onOpen}\n                    onPointerDown={handlePointerDown}\n                    aria-label={`Preview ${item.alt || 'image'}`}\n                >\n                    <img\n                        className=\"gallery-image\"\n                        src={item.thumbnail || item.src}\n                        alt={item.alt || ''}\n                        loading=\"lazy\"\n                    />\n                    {item.caption && <span className=\"gallery-caption\">{item.caption}</span>}\n                    {effectLayer}\n                </button>\n            ) : (\n                <div\n                    className={cn(\n                        'gallery-trigger',\n                        rounded && 'rounded',\n                        usesHoverZoom(hoverEffect) && 'effect-zoom',\n                        usesHoverDim(hoverEffect) && 'effect-dim',\n                        effectClassName\n                    )}\n                    onPointerDown={handlePointerDown}\n                >\n                    <img\n                        className=\"gallery-image\"\n                        src={item.thumbnail || item.src}\n                        alt={item.alt || ''}\n                        loading=\"lazy\"\n                    />\n                    {item.caption && <span className=\"gallery-caption\">{item.caption}</span>}\n                    {effectLayer}\n                </div>\n            )}\n        </figure>\n    )\n}\n","import {useState, useEffect, useCallback, useRef, Children} from 'react'\nimport type * as React from 'react'\nimport type {MCarouselProps} from './MCarousel.types'\nimport {cn} from '../../../utils/cn'\nimport {MButton} from '../../controls'\nimport {MChevronLeftIcon, MChevronRightIcon} from '../../../icons'\nimport './MCarousel.css'\n\n// Render a swipeable content slider with arrows, dots and transition modes.\nexport function MCarousel({\n    autoPlay = false,\n    interval = 5000,\n    showDots = true,\n    showArrows = true,\n    loop = true,\n    draggable = true,\n    transition = 'slide',\n    className,\n    children,\n    ...rest\n}: MCarouselProps) {\n    const slides = Children.toArray(children)\n    const count = slides.length\n    const [active, setActive] = useState(0)\n    const [dragOffset, setDragOffset] = useState(0)\n    const [isDragging, setIsDragging] = useState(false)\n    const dragStartX = useRef(0)\n    const trackRef = useRef<HTMLDivElement>(null)\n\n    const goTo = useCallback(\n        (index: number) => {\n            if (loop) {\n                setActive((index + count) % count)\n            } else {\n                setActive(Math.max(0, Math.min(index, count - 1)))\n            }\n        },\n        [count, loop]\n    )\n\n    const prev = useCallback(() => goTo(active - 1), [active, goTo])\n    const next = useCallback(() => goTo(active + 1), [active, goTo])\n\n    useEffect(() => {\n        if (!autoPlay || count <= 1 || isDragging) return\n        const timer = setInterval(next, interval)\n        return () => clearInterval(timer)\n    }, [autoPlay, interval, next, count, isDragging])\n\n    const handleDragStart = (clientX: number) => {\n        if (!draggable) return\n        setIsDragging(true)\n        dragStartX.current = clientX\n        setDragOffset(0)\n    }\n\n    const handleDragMove = (clientX: number) => {\n        if (!isDragging) return\n        const diff = clientX - dragStartX.current\n        setDragOffset(diff)\n    }\n\n    const handleDragEnd = () => {\n        if (!isDragging) return\n        setIsDragging(false)\n        const threshold = 50\n        if (dragOffset < -threshold) {\n            next()\n        } else if (dragOffset > threshold) {\n            prev()\n        }\n        setDragOffset(0)\n    }\n\n    const onPointerDown = (e: React.PointerEvent) => {\n        if (!draggable) return\n        e.currentTarget.setPointerCapture(e.pointerId)\n        handleDragStart(e.clientX)\n    }\n\n    const onPointerMove = (e: React.PointerEvent) => {\n        handleDragMove(e.clientX)\n    }\n\n    const onPointerUp = () => {\n        handleDragEnd()\n    }\n\n    if (count === 0) return null\n\n    const isFade = transition === 'fade'\n    const trackStyle = !isFade\n        ? {transform: `translateX(calc(-${active * 100}% + ${isDragging ? dragOffset : 0}px))`}\n        : undefined\n\n    return (\n        <div className={cn('carousel', isFade && 'fade', className)} {...rest}>\n            <div\n                className=\"carousel-viewport\"\n                onPointerDown={onPointerDown}\n                onPointerMove={onPointerMove}\n                onPointerUp={onPointerUp}\n                onPointerCancel={onPointerUp}\n                style={{\n                    touchAction: draggable ? 'pan-y' : undefined,\n                    cursor: draggable ? (isDragging ? 'grabbing' : 'grab') : undefined,\n                }}\n            >\n                <div ref={trackRef} className={cn('carousel-track', isDragging && 'dragging')} style={trackStyle}>\n                    {slides.map((slide, i) => (\n                        <div\n                            key={i}\n                            className={cn(\n                                'carousel-slide',\n                                isFade && i === active && 'active',\n                                isFade && i !== active && 'hidden'\n                            )}\n                        >\n                            {slide}\n                        </div>\n                    ))}\n                </div>\n            </div>\n\n            {showArrows && count > 1 && (\n                <>\n                    <MButton\n                        variant=\"ghost\"\n                        color=\"primary\"\n                        iconOnly\n                        shape=\"circle\"\n                        onClick={prev}\n                        aria-label=\"Previous slide\"\n                        className=\"carousel-arrow carousel-arrow-prev\"\n                    >\n                        <MChevronLeftIcon />\n                    </MButton>\n                    <MButton\n                        variant=\"ghost\"\n                        color=\"primary\"\n                        iconOnly\n                        shape=\"circle\"\n                        onClick={next}\n                        aria-label=\"Next slide\"\n                        className=\"carousel-arrow carousel-arrow-next\"\n                    >\n                        <MChevronRightIcon />\n                    </MButton>\n                </>\n            )}\n\n            {showDots && count > 1 && (\n                <div className=\"carousel-dots\">\n                    {slides.map((_, i) => (\n                        <button\n                            key={i}\n                            className={cn('carousel-dot', i === active && 'active')}\n                            onClick={() => goTo(i)}\n                            aria-label={`Slide ${i + 1}`}\n                            type=\"button\"\n                        />\n                    ))}\n                </div>\n            )}\n        </div>\n    )\n}\n","import type {CSSProperties} from 'react'\nimport {MCard, MCardBody, MCardFooter} from '../../cards'\nimport {MImage} from '../MImage'\nimport {cn} from '../../../utils/cn'\nimport {usesDim, usesRipple, usesZoom} from '../mediaInteraction'\nimport type {MShowcaseCarouselItemProps} from './MShowcaseCarouselItem.types'\nimport './MShowcaseCarouselItem.css'\n\nexport function MShowcaseCarouselItem({\n    src,\n    alt = '',\n    media,\n    mediaHeight,\n    overlay,\n    body,\n    footer,\n    interactive = false,\n    imageClickEffect = 'ripple',\n    ratio = '16:9',\n    fit = 'cover',\n    imgProps,\n    children,\n}: MShowcaseCarouselItemProps) {\n    const content = body ?? children\n    const shouldRipple = usesRipple(imageClickEffect)\n    const cardStyle = mediaHeight\n        ? ({\n              '--media-height': typeof mediaHeight === 'number' ? `${mediaHeight}px` : mediaHeight,\n          } as CSSProperties)\n        : undefined\n    const hasMedia = Boolean(media || src)\n\n    return (\n        <MCard\n            interactive={interactive}\n            clickEffect={imageClickEffect !== 'none' ? 'none' : undefined}\n            className={cn('showcase card', interactive && 'interactive')}\n            style={cardStyle}\n        >\n            {hasMedia ? (\n                <div\n                    className={cn(\n                        'showcase media',\n                        usesZoom(imageClickEffect) && 'effect-zoom',\n                        usesDim(imageClickEffect) && 'effect-dim'\n                    )}\n                >\n                    {media ? (\n                        <div className=\"showcase media-content\">{media}</div>\n                    ) : (\n                        <MImage\n                            {...imgProps}\n                            src={src}\n                            alt={alt}\n                            ratio={ratio}\n                            fit={fit}\n                            rounded\n                            shadow\n                            clickEffect={shouldRipple ? 'ripple' : 'none'}\n                        />\n                    )}\n                    {overlay ? <div className=\"showcase overlay\">{overlay}</div> : null}\n                </div>\n            ) : null}\n            {content ? <MCardBody className=\"showcase body\">{content}</MCardBody> : null}\n            {footer ? <MCardFooter className=\"showcase footer\">{footer}</MCardFooter> : null}\n        </MCard>\n    )\n}\n","import {Children, useCallback, useEffect, useMemo, useRef, useState} from 'react'\nimport type {CSSProperties, PointerEvent as ReactPointerEvent, ReactNode} from 'react'\nimport {MButton} from '../../controls'\nimport {MShowcaseCarouselItem} from '../MShowcaseCarouselItem'\nimport {MChevronLeftIcon, MChevronRightIcon} from '../../../icons'\nimport {cn} from '../../../utils/cn'\nimport type {MShowcaseCarouselProps, MShowcaseCarouselSlide} from './MShowcaseCarousel.types'\nimport './MShowcaseCarousel.css'\n\nfunction clamp(value: number, min: number, max: number) {\n    return Math.min(Math.max(value, min), max)\n}\n\nfunction isInteractiveTarget(target: EventTarget | null) {\n    if (!(target instanceof Element)) {\n        return false\n    }\n\n    return !!target.closest(\n        'button, a, input, select, textarea, label, summary, [role=\"button\"], [role=\"link\"], [data-carousel-ignore-drag=\"true\"]'\n    )\n}\n\nfunction getSlides<T>(items?: T[], renderItem?: (item: T, index: number) => ReactNode, children?: ReactNode) {\n    if (items && renderItem) {\n        return items.map((item, index) => renderItem(item, index))\n    }\n\n    if (items) {\n        return items\n            .map((item, index) => {\n                if (!isShowcaseItem(item)) {\n                    return null\n                }\n\n                return <ShowcaseMediaSlide key={index} item={item} />\n            })\n            .filter(Boolean)\n    }\n\n    return Children.toArray(children)\n}\n\nfunction isShowcaseItem(value: unknown): value is MShowcaseCarouselSlide {\n    const slide = value as {src?: unknown}\n    return !!value && typeof value === 'object' && 'src' in value && typeof slide.src === 'string'\n}\n\nfunction ShowcaseMediaSlide({item}: {item: MShowcaseCarouselSlide}) {\n    return <MShowcaseCarouselItem src={item.src} alt={item.alt || ''} overlay={item.overlay} />\n}\n\n// Show a centered, mouse-driven carousel with partial side previews.\nexport function MShowcaseCarousel<T = unknown>({\n    items,\n    renderItem,\n    initialIndex,\n    showButtons = true,\n    loop = true,\n    draggable = true,\n    wheel = true,\n    itemMinWidth = 220,\n    itemMaxWidth = 520,\n    itemWidthRatio = 0.56,\n    className,\n    children,\n    style,\n    ...rest\n}: MShowcaseCarouselProps<T>) {\n    const slides = useMemo(() => getSlides(items, renderItem, children), [children, items, renderItem])\n    const count = slides.length\n    const [active, setActive] = useState(0)\n    const [drag, setDrag] = useState(0)\n    const [dragging, setDragging] = useState(false)\n    const [stageWidth, setStageWidth] = useState(0)\n    const stageRef = useRef<HTMLDivElement>(null)\n    const startX = useRef(0)\n    const wheelLock = useRef(false)\n\n    const widthRatio =\n        stageWidth < 640\n            ? Math.max(itemWidthRatio, 0.78)\n            : stageWidth < 960\n              ? Math.max(itemWidthRatio, 0.66)\n              : itemWidthRatio\n    const itemWidth = clamp(stageWidth * widthRatio || itemMinWidth, itemMinWidth, itemMaxWidth)\n    const itemGap = clamp(stageWidth * 0.022 || 16, 10, 24)\n\n    useEffect(() => {\n        const node = stageRef.current\n        if (!node) return\n\n        const update = () => setStageWidth(node.clientWidth)\n        update()\n\n        const observer = new ResizeObserver(update)\n        observer.observe(node)\n\n        return () => observer.disconnect()\n    }, [])\n\n    useEffect(() => {\n        if (!count) return\n\n        const defaultIndex = initialIndex ?? Math.floor((count - 1) / 2)\n        setActive(clamp(defaultIndex, 0, count - 1))\n    }, [count, initialIndex])\n\n    const goTo = useCallback(\n        (nextIndex: number) => {\n            if (count < 1) return\n\n            if (loop) {\n                setActive((nextIndex + count) % count)\n                return\n            }\n\n            setActive(clamp(nextIndex, 0, count - 1))\n        },\n        [count, loop]\n    )\n\n    const prev = useCallback(() => goTo(active - 1), [active, goTo])\n    const next = useCallback(() => goTo(active + 1), [active, goTo])\n\n    const onPointerDown = (event: ReactPointerEvent<HTMLDivElement>) => {\n        if (!draggable || count <= 1) return\n        if (isInteractiveTarget(event.target)) return\n        event.currentTarget.setPointerCapture(event.pointerId)\n        setDragging(true)\n        startX.current = event.clientX\n        setDrag(0)\n    }\n\n    const onPointerMove = (event: ReactPointerEvent<HTMLDivElement>) => {\n        if (!dragging) return\n        setDrag(event.clientX - startX.current)\n    }\n\n    const stopDrag = () => {\n        if (!dragging) return\n\n        const limit = Math.max(56, itemWidth * 0.12)\n\n        if (drag <= -limit) {\n            next()\n        } else if (drag >= limit) {\n            prev()\n        }\n\n        setDragging(false)\n        setDrag(0)\n    }\n\n    useEffect(() => {\n        const node = stageRef.current\n        if (!node) return\n\n        const handleWheel = (event: WheelEvent) => {\n            if (!wheel || count <= 1 || wheelLock.current) return\n\n            const axis = Math.abs(event.deltaX) > Math.abs(event.deltaY) ? event.deltaX : event.deltaY\n            if (Math.abs(axis) < 28) return\n\n            event.preventDefault()\n            event.stopPropagation()\n\n            wheelLock.current = true\n            window.setTimeout(() => {\n                wheelLock.current = false\n            }, 260)\n\n            if (axis > 0) {\n                next()\n            } else {\n                prev()\n            }\n        }\n\n        node.addEventListener('wheel', handleWheel, {passive: false})\n        return () => node.removeEventListener('wheel', handleWheel)\n    }, [count, next, prev, wheel])\n\n    if (!count) return null\n\n    const offset = stageWidth / 2 - active * (itemWidth + itemGap) - itemWidth / 2 + drag\n\n    return (\n        <div\n            className={cn('showcase', className)}\n            style={{...style, '--item-width': `${itemWidth}px`} as CSSProperties}\n            {...rest}\n        >\n            <div\n                ref={stageRef}\n                className=\"showcase-stage\"\n                onPointerDown={onPointerDown}\n                onPointerMove={onPointerMove}\n                onPointerUp={stopDrag}\n                onPointerCancel={stopDrag}\n                onPointerLeave={stopDrag}\n                style={{\n                    cursor: draggable && count > 1 ? (dragging ? 'grabbing' : 'grab') : undefined,\n                }}\n            >\n                <div\n                    className={cn('showcase-track', dragging && 'dragging')}\n                    style={{\n                        transform: `translateX(${offset}px)`,\n                        gap: `${itemGap}px`,\n                    }}\n                >\n                    {slides.map((slide, index) => {\n                        const dist = Math.abs(index - active)\n\n                        return (\n                            <div\n                                key={index}\n                                className={cn(\n                                    'showcase-item',\n                                    index === active && 'active',\n                                    dist === 1 && 'near',\n                                    dist >= 2 && 'far'\n                                )}\n                                style={{zIndex: Math.max(1, count - dist)}}\n                            >\n                                {slide}\n                            </div>\n                        )\n                    })}\n                </div>\n            </div>\n\n            {showButtons && count > 1 && (\n                <div className=\"showcase-actions\">\n                    <MButton\n                        type=\"button\"\n                        variant=\"secondary\"\n                        className=\"showcase-btn\"\n                        startIcon={<MChevronLeftIcon />}\n                        onClick={prev}\n                    >\n                        Previous\n                    </MButton>\n                    <MButton type=\"button\" className=\"showcase-btn\" endIcon={<MChevronRightIcon />} onClick={next}>\n                        Next\n                    </MButton>\n                </div>\n            )}\n        </div>\n    )\n}\n","import {Children} from 'react'\nimport type {ReactNode} from 'react'\nimport {cn} from '../../../utils/cn'\nimport type {MMasonryProps} from './MMasonry.types'\nimport './MMasonry.css'\n\nfunction getItems<T>(items?: T[], renderItem?: (item: T, index: number) => ReactNode, children?: ReactNode) {\n    if (items && renderItem) {\n        return items.map((item, index) => renderItem(item, index))\n    }\n\n    return Children.toArray(children)\n}\n\n// Render a responsive masonry wall for images, cards and uneven content.\nexport function MMasonry<T = unknown>({\n    items,\n    renderItem,\n    columns = 3,\n    className,\n    children,\n    style,\n    ...rest\n}: MMasonryProps<T>) {\n    const content = getItems(items, renderItem, children)\n\n    if (!content.length) return null\n\n    return (\n        <div className={cn('masonry', className)} style={{...style, columnCount: columns}} {...rest}>\n            {content.map((item, index) => (\n                <div key={index} className=\"masonry item\">\n                    {item}\n                </div>\n            ))}\n        </div>\n    )\n}\n","import {MCard, MCardBody, MCardFooter} from '../../cards'\nimport {cn} from '../../../utils/cn'\nimport {useInteractionEffect} from '../../../utils/useInteractionEffect'\nimport {usesDim, usesRipple, usesZoom} from '../mediaInteraction'\nimport './MMasonryItem.css'\nimport type {MMasonryItemProps} from './MMasonryItem.types'\n\nexport function MMasonryItem({\n    src,\n    alt = '',\n    height,\n    overlay,\n    body,\n    footer,\n    interactive = false,\n    imageClickEffect = 'none',\n    imgProps,\n    children,\n}: MMasonryItemProps) {\n    const imgStyle = height ? {...imgProps?.style, height} : imgProps?.style\n    const content = body ?? children\n    const shouldRipple = usesRipple(imageClickEffect)\n    const {effectClassName, effectLayer, handlePointerDown} = useInteractionEffect<HTMLDivElement>({\n        effect: shouldRipple ? 'ripple' : 'none',\n    })\n\n    return (\n        <MCard\n            interactive={interactive}\n            clickEffect={imageClickEffect !== 'none' ? 'none' : undefined}\n            className={cn('masonry card', interactive && 'interactive')}\n        >\n            <div\n                className={cn(\n                    'masonry media',\n                    effectClassName,\n                    usesZoom(imageClickEffect) && 'effect-zoom',\n                    usesDim(imageClickEffect) && 'effect-dim'\n                )}\n                onPointerDown={(event) => {\n                    const target = event.target as HTMLElement\n\n                    if (target.closest('.masonry.overlay')) {\n                        return\n                    }\n\n                    handlePointerDown(event)\n                }}\n            >\n                <img {...imgProps} src={src} alt={alt} className=\"masonry img\" style={imgStyle} />\n                {overlay ? <div className=\"masonry overlay\">{overlay}</div> : null}\n                {effectLayer}\n            </div>\n            {content ? <MCardBody className=\"masonry body\">{content}</MCardBody> : null}\n            {footer ? <MCardFooter className=\"masonry footer\">{footer}</MCardFooter> : null}\n        </MCard>\n    )\n}\n"],"mappings":"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"}

package/dist/media.cjs

@@ -1,3 +1,3 @@
 const {ensureStyles}=require('./style-runtime.cjs')
 ensureStyles()
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./MImage-BZ6SrSao.cjs`),t=require(`./media-DbToUupt.cjs`),n=require(`./MAvatar-BgevCYi3.cjs`);exports.MAvatar=n.t,exports.MAvatarStack=t.t,exports.MCarousel=t.o,exports.MGallery=t.s,exports.MImage=e.t,exports.MMasonry=t.r,exports.MMasonryItem=t.n,exports.MShowcaseCarousel=t.i,exports.MShowcaseCarouselItem=t.a;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`./MAvatarStack-DN79aJo1.cjs`),t=require(`./media-BySr5LGc.cjs`),n=require(`./MAvatar-DzZPRbot.cjs`);exports.MAvatar=n.t,exports.MAvatarStack=e.t,exports.MCarousel=t.a,exports.MGallery=t.o,exports.MImage=e.n,exports.MMasonry=t.n,exports.MMasonryItem=t.t,exports.MShowcaseCarousel=t.r,exports.MShowcaseCarouselItem=t.i;

package/dist/media.js

@@ -1,6 +1,6 @@
 import {ensureStyles} from './style-runtime.js'
 ensureStyles()
-import { t as e } from "./MImage-Btx_7g2Z.js";
-import { a as t, i as n, n as r, o as i, r as a, s as o, t as s } from "./media-DdChr0Cw.js";
-import { t as c } from "./MAvatar-BcayQCnp.js";
-export { c as MAvatar, s as MAvatarStack, i as MCarousel, o as MGallery, e as MImage, a as MMasonry, r as MMasonryItem, n as MShowcaseCarousel, t as MShowcaseCarouselItem };
+import { n as e, t } from "./MAvatarStack-CrhkO_SO.js";
+import { a as n, i as r, n as i, o as a, r as o, t as s } from "./media-IQ4iYTs-.js";
+import { t as c } from "./MAvatar-D_dVAPaR.js";
+export { c as MAvatar, t as MAvatarStack, n as MCarousel, a as MGallery, e as MImage, i as MMasonry, s as MMasonryItem, o as MShowcaseCarousel, r as MShowcaseCarouselItem };

package/dist/{overlays-B0khU6Wb.js → overlays-BabXGLEM.js}

@@ -3,13 +3,13 @@ import { t as r } from "./cn-YER3QsV1.js";
 import { t as i } from "./useKeyboardNav-iEXOdEMB.js";
 import { t as a } from "./MPortal-Ba2Sxset.js";
 import { t as o } from "./MPopover-Cqz5TsHg.js";
-import { n as s, t as c } from "./MStack-DFIc3S4_.js";
-import { t as l } from "./MText-DcB1GAt-.js";
-import { t as u } from "./MHeading-MPh8Qm9q.js";
+import { n as s, t as c } from "./MStack-C4Eocfb5.js";
+import { t as l } from "./MText-CL-LPcXi.js";
+import { t as u } from "./MHeading-B7KgSP4T.js";
 import { t as d } from "./MKbd-v6-tJ9sP.js";
-import { t as f } from "./MButton-DZLLrtQb.js";
-import { a as p, i as m, n as h, r as g, s as _ } from "./MSkeleton-BvXgnYs_.js";
-import { t as v } from "./MInputSearch-CmzHPnmC.js";
+import { t as f } from "./MButton-C1pnL4_j.js";
+import { a as p, i as m, n as h, r as g, s as _ } from "./MSkeleton-CVofhuDp.js";
+import { t as v } from "./MInputSearch-BBxUF5pw.js";
 import { t as y } from "./MTooltip-jSf4VBtB.js";
 import { t as b } from "./MSimpleGrid-Bojj4xKH.js";
 import { useCallback as x, useEffect as S, useId as ee, useMemo as C, useRef as w, useState as T } from "react";
@@ -389,4 +389,4 @@ function L({ title: e, description: t, onConfirm: n, onCancel: i, confirmText: a
 //#endregion
 export { I as n, j as r, L as t };
 
-//# sourceMappingURL=overlays-B0khU6Wb.js.map
+//# sourceMappingURL=overlays-BabXGLEM.js.map