@slotted/react 0.1.0-beta.1 → 0.1.0-beta.10

package/dist/carousel-BPi-Y5yF.js

@@ -1,498 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { n, r } from "./i18n-DpW8lqJ1.js";
-import { createRovingTabindex as i } from "@slotted/core/focus";
-import { createControllable as a } from "@slotted/core/state";
-import { createContext as o, useCallback as s, useContext as c, useEffect as l, useId as u, useImperativeHandle as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
-import { jsx as h } from "react/jsx-runtime";
-import { carouselMessages as ee } from "@slotted/core/i18n";
-import { getLiveAnnouncer as te } from "@slotted/core/live-announcer";
-import { DEFAULT_AUTOPLAY_DELAY as g, EMPTY_PAGES as ne, canStep as _, carouselKeyIntent as re, createCarouselEngine as ie, createCarouselRotation as ae, indicatorDistance as v, intentPage as oe, revealInStrip as se, stepPage as y } from "@slotted/core/carousel";
-//#region src/carousel/carousel-defaults.tsx
-var b = o({
-	align: "start",
-	arrows: "inset",
-	autoplayDelay: g,
-	draggable: !0,
-	loop: !1,
-	orientation: "horizontal",
-	size: "md",
-	transition: "slide"
-});
-function x() {
-	return c(b);
-}
-function S({ children: e, ...t }) {
-	let n = x();
-	return /* @__PURE__ */ h(b.Provider, {
-		value: {
-			align: t.align ?? n.align,
-			arrows: t.arrows ?? n.arrows,
-			autoplayDelay: t.autoplayDelay ?? n.autoplayDelay,
-			draggable: t.draggable ?? n.draggable,
-			loop: t.loop ?? n.loop,
-			orientation: t.orientation ?? n.orientation,
-			size: t.size ?? n.size,
-			transition: t.transition ?? n.transition
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/carousel/carousel.tsx
-var ce = typeof document > "u" ? l : f, le = o(void 0);
-function C() {
-	let e = c(le);
-	if (e === void 0) throw Error("Carousel parts must be rendered inside Carousel.");
-	return e;
-}
-function ue(e) {
-	if (!(e instanceof Element)) return !1;
-	try {
-		return e.matches(":focus-visible");
-	} catch {
-		return !0;
-	}
-}
-function de(e) {
-	return e === "pointer" || e === "keyboard" || e === "scroll";
-}
-var fe = /* @__PURE__ */ new Set([
-	"pointer",
-	"keyboard",
-	"scroll"
-]);
-function pe({ align: e, arrows: t, autoplay: i, children: o, defaultPage: s, defaultPlaying: c, draggable: f, handleRef: g, loop: re, messages: v, onFocus: oe, onPageChange: se, onPlayingChange: b, onPointerEnter: S, onPointerLeave: C, orientation: pe, page: w, playing: T, ref: me, render: E, size: D, slidesPerMove: he, slidesPerView: O, style: ge, transition: _e, ...ve }) {
-	let k = x(), A = u(), j = e ?? k.align, ye = t ?? k.arrows, M = f ?? k.draggable, N = re ?? k.loop, P = pe ?? k.orientation, be = D ?? k.size, F = _e ?? k.transition, I = r(ee, v), xe = n(), L = he ?? "page", R = i !== void 0 && i !== !1, z = typeof i == "number" ? i : k.autoplayDelay, [Se, Ce] = m(s ?? 0), B = w ?? Se, [we, Te] = m(null), [Ee, De] = m(R && c !== !1), V = R && (T ?? Ee), [H, Oe] = m(ne), [ke, Ae] = m([]), [je, Me] = m(!1), [Ne, Pe] = m(!1), [Fe, Ie] = m(!1), [Le, Re] = m(0), [U, ze] = m(null), W = p(null), G = p(null), K = p({
-		animate: !1,
-		announce: !1
-	}), Be = p(z);
-	Be.current = z;
-	let Ve = p(null), q = H.positions.length, J = q === 0 ? B : Math.min(Math.max(B, 0), q - 1), He = we ?? J;
-	function Y(e, t, n) {
-		R && e !== V && a({
-			controlled: T,
-			initial: V,
-			onRequest: (e) => b?.(e.value, e)
-		}).request(e, t, n) && De(e);
-	}
-	function X(e, t, n, r = {}) {
-		q === 0 || e < 0 || e >= q || (de(t) && V && Y(!1, t, n), Te(null), Re((e) => e + 1), e !== J && (K.current = {
-			animate: r.instant !== !0,
-			announce: fe.has(t)
-		}, a({
-			controlled: w,
-			initial: J,
-			onRequest: (e) => se?.(e.value, e)
-		}).request(e, t, n) && Ce(e)));
-	}
-	function Ue(e, t, n) {
-		_(J, e, q, N) && X(y(J, e, q, N), t, n);
-	}
-	let Z = p({
-		current: J,
-		go: X,
-		setPlayingState: Y,
-		pageCount: q,
-		loop: N,
-		isPlaying: V
-	});
-	l(() => {
-		Z.current = {
-			current: J,
-			go: X,
-			setPlayingState: Y,
-			pageCount: q,
-			loop: N,
-			isPlaying: V
-		};
-	});
-	let Q = p({
-		orientation: P,
-		align: j,
-		slidesPerMove: L,
-		transition: F,
-		draggable: M,
-		t: I
-	});
-	Q.current = {
-		orientation: P,
-		align: j,
-		slidesPerMove: L,
-		transition: F,
-		draggable: M,
-		t: I
-	}, ce(() => {
-		if (U === null) return;
-		let e = ie(U, {
-			orientation: () => Q.current.orientation,
-			align: () => Q.current.align,
-			slidesPerMove: () => Q.current.slidesPerMove,
-			transition: () => Q.current.transition,
-			draggable: () => Q.current.draggable,
-			page: () => Z.current.current,
-			idPrefix: `${A}slide-`,
-			slideLabel: (e, t) => Q.current.t("slide", {
-				index: e + 1,
-				count: t
-			}),
-			onPages: (e, t) => {
-				Oe(e), Ae(t), Me(!0);
-			},
-			onVisualPage: Te,
-			onSettle: (e, t, n) => Z.current.go(e, t, n, { instant: !0 }),
-			onDraggingChange: Pe,
-			onSwipe: (e, t) => {
-				let { current: n, pageCount: r, loop: i } = Z.current;
-				_(n, e, r, i) && Z.current.go(y(n, e, r, i), "pointer", t);
-			},
-			onPeekPress: (t, n) => {
-				let r = e.pages().pageOfSlide[t];
-				r !== void 0 && Z.current.go(r, "pointer", n);
-			}
-		});
-		return W.current = e, e.setCurrent(Z.current.current), e.scrollToPage(Z.current.current, { animate: !1 }), () => {
-			e.destroy(), W.current = null;
-		};
-	}, [
-		U,
-		P,
-		F,
-		j,
-		L,
-		A
-	]), ce(() => {
-		let e = W.current;
-		if (e === null) return;
-		let t = Ve.current !== J;
-		Ve.current = J, e.setCurrent(J), e.scrollToPage(J, { animate: !t || K.current.animate }), t && K.current.announce && q > 0 && te(U?.ownerDocument).announce(I("announce", {
-			page: J + 1,
-			count: q
-		})), K.current = {
-			animate: !1,
-			announce: !1
-		}, G.current?.restart();
-	}, [
-		J,
-		Le,
-		H
-	]), l(() => {
-		q > 0 && B > q - 1 && X(q - 1, "resize", void 0, { instant: !0 });
-	}, [q]), l(() => {
-		R && T === void 0 && c !== !0 && U?.ownerDocument.defaultView?.matchMedia?.("(prefers-reduced-motion: reduce)")?.matches === !0 && De(!1);
-	}, [U]), l(() => {
-		if (!R || U === null) return;
-		let e = ae({
-			delay: () => Be.current,
-			document: U.ownerDocument,
-			onHeldChange: Ie,
-			onTick: () => {
-				let { current: e, pageCount: t, loop: n } = Z.current;
-				if (!(t <= 1)) {
-					if (e >= t - 1 && !n) {
-						Z.current.setPlayingState(!1, "timeout", void 0);
-						return;
-					}
-					Z.current.go(y(e, 1, t, !0), "timeout", void 0);
-				}
-			}
-		});
-		return G.current = e, Ie(e.held()), () => {
-			e.destroy(), G.current = null;
-		};
-	}, [R, U]), l(() => {
-		V && q > 1 ? G.current?.start() : G.current?.stop();
-	}, [V, q]), d(g, () => ({
-		scrollTo: (e) => Z.current.go(e, "programmatic", void 0),
-		scrollToSlide: (e) => {
-			let t = W.current?.pages().pageOfSlide[e];
-			t !== void 0 && Z.current.go(t, "programmatic", void 0);
-		},
-		refresh: () => {
-			W.current?.measure();
-		}
-	}), []);
-	function We(e) {
-		oe?.(e), V && ue(e.target) && Y(!1, "keyboard", e);
-	}
-	function Ge(e) {
-		S?.(e), e.pointerType === "mouse" && G.current?.hold("hover");
-	}
-	function Ke(e) {
-		C?.(e), G.current?.release("hover");
-	}
-	let qe = {
-		attachViewport: ze,
-		viewportId: `${A}viewport`,
-		orientation: P,
-		transition: F,
-		size: be,
-		loop: N,
-		t: I,
-		locale: xe,
-		page: He,
-		pageCount: q,
-		pages: H,
-		slideIds: ke,
-		playing: V,
-		autoplay: R,
-		canPrevious: _(J, -1, q, N),
-		canNext: _(J, 1, q, N),
-		go: X,
-		step: Ue,
-		setPlaying: Y
-	}, $ = {};
-	O !== void 0 && ($["--slotted-carousel-slides-per-view"] = String(O)), R && ($["--slotted-carousel-autoplay-delay"] = `${z}ms`);
-	let Je = {
-		...ve,
-		"aria-roledescription": I("roleDescription"),
-		children: o,
-		"data-align": j,
-		"data-arrows": ye,
-		...M ? { "data-draggable": "" } : {},
-		...Ne ? { "data-dragging": "" } : {},
-		...je ? { "data-measured": "" } : {},
-		"data-orientation": P,
-		"data-part": "root",
-		...V ? { "data-playing": "" } : {},
-		...V && Fe ? { "data-paused": "" } : {},
-		"data-size": be,
-		"data-transition": F,
-		"data-ui": "carousel",
-		onFocus: We,
-		onPointerEnter: Ge,
-		onPointerLeave: Ke,
-		style: {
-			...$,
-			...ge
-		}
-	};
-	return /* @__PURE__ */ h(le.Provider, {
-		value: qe,
-		children: E === void 0 ? /* @__PURE__ */ h("section", {
-			...Je,
-			ref: me
-		}) : E(Je)
-	});
-}
-//#endregion
-//#region src/carousel/carousel-parts.tsx
-function w(e) {
-	return e.detail === 0 ? "keyboard" : "pointer";
-}
-function T(e, t) {
-	return s((n) => {
-		if (e(n), typeof t == "function") return t(n);
-		t && (t.current = n);
-	}, [e, t]);
-}
-function me({ children: e, onKeyDown: t, ref: n, render: r, ...i }) {
-	let a = C(), o = T(a.attachViewport, n);
-	function s(e) {
-		if (t?.(e), e.defaultPrevented || e.target !== e.currentTarget) return;
-		let n = getComputedStyle(e.currentTarget).direction === "rtl" ? "rtl" : "ltr", r = re(e.key, a.orientation, n);
-		if (r === null) return;
-		let i = oe(r, a.page, a.pageCount, a.loop);
-		i !== -1 && (e.preventDefault(), a.go(i, "keyboard", e, { instant: e.repeat }));
-	}
-	let c = {
-		"aria-label": a.t("viewport"),
-		role: "group",
-		tabIndex: 0,
-		...i,
-		children: e,
-		"data-part": "viewport",
-		id: a.viewportId,
-		onKeyDown: s
-	};
-	return r === void 0 ? /* @__PURE__ */ h("div", {
-		...c,
-		ref: o
-	}) : r({
-		...c,
-		ref: o
-	});
-}
-function E({ children: e, ref: t, render: n, ...r }) {
-	let i = {
-		role: "group",
-		"aria-roledescription": C().t("slideRoleDescription"),
-		...r,
-		children: e,
-		"data-part": "slide"
-	};
-	return n === void 0 ? /* @__PURE__ */ h("div", {
-		...i,
-		ref: t
-	}) : n({
-		...i,
-		ref: t
-	});
-}
-function D({ children: n, delta: r, onClick: i, ref: a, render: o, ...s }) {
-	let c = C(), l = r === 1 ? c.canNext : c.canPrevious;
-	function u(e) {
-		i?.(e), !e.defaultPrevented && l && c.step(r, w(e), e);
-	}
-	let d = {
-		"aria-controls": c.viewportId,
-		"aria-label": c.t(r === 1 ? "next" : "previous"),
-		...s,
-		...l ? {} : {
-			"aria-disabled": "true",
-			"data-disabled": ""
-		},
-		children: n ?? /* @__PURE__ */ h(t, {
-			directional: c.orientation === "horizontal",
-			children: /* @__PURE__ */ h(e, { name: "chevron-right" })
-		}),
-		"data-part": r === 1 ? "next" : "previous",
-		onClick: u,
-		type: "button"
-	};
-	return o === void 0 ? /* @__PURE__ */ h("button", {
-		...d,
-		ref: a
-	}) : o({
-		...d,
-		ref: a
-	});
-}
-function he(e) {
-	return /* @__PURE__ */ h(D, {
-		...e,
-		delta: -1
-	});
-}
-function O(e) {
-	return /* @__PURE__ */ h(D, {
-		...e,
-		delta: 1
-	});
-}
-function ge({ children: n, onClick: r, ref: i, render: a, ...o }) {
-	let s = C();
-	if (!s.autoplay) return null;
-	function c(e) {
-		r?.(e), !e.defaultPrevented && s.setPlaying(!s.playing, w(e), e);
-	}
-	let l = {
-		"aria-controls": s.viewportId,
-		"aria-label": s.t(s.playing ? "stop" : "start"),
-		...o,
-		children: n ?? /* @__PURE__ */ h(t, { children: /* @__PURE__ */ h(e, { name: s.playing ? "pause" : "play" }) }),
-		"data-part": "autoplay",
-		onClick: c,
-		type: "button"
-	};
-	return a === void 0 ? /* @__PURE__ */ h("button", {
-		...l,
-		ref: i
-	}) : a({
-		...l,
-		ref: i
-	});
-}
-function _e({ children: e, placement: t = "below", ref: n, render: r, ...i }) {
-	let a = {
-		...i,
-		children: e,
-		"data-part": "controls",
-		"data-placement": t
-	};
-	return r === void 0 ? /* @__PURE__ */ h("div", {
-		...a,
-		ref: n
-	}) : r({
-		...a,
-		ref: n
-	});
-}
-function ve({ children: e, ref: t, render: n, variant: r = "dots", ...a }) {
-	let o = C(), [s, c] = m(null), u = p(null), d = p(o);
-	d.current = o;
-	let f = T(c, t);
-	l(() => {
-		if (s === null) return;
-		let e = i(s, {
-			itemSelector: "[data-part=\"indicator\"]",
-			loop: !1,
-			orientation: () => "horizontal",
-			onMove: (e) => d.current.go(e, "keyboard", void 0)
-		});
-		return u.current = e, () => {
-			e.destroy(), u.current = null;
-		};
-	}, [s]), l(() => {
-		if (u.current?.refresh(), u.current?.setActive(o.page), r !== "thumbnails" || s === null) return;
-		let e = s.querySelectorAll("[data-part=\"indicator\"]")[o.page];
-		e !== void 0 && se(s, e);
-	}, [
-		o.page,
-		o.pageCount,
-		s,
-		r
-	]);
-	let ee = r === "dots" && v(0, 0, o.pageCount) !== null, te = Array.from({ length: o.pageCount }, (e, t) => t), g = {
-		"aria-label": o.t("indicators"),
-		...a,
-		children: te.map((t) => e === void 0 ? /* @__PURE__ */ h(k, { page: t }, t) : e(t)),
-		"data-part": "indicators",
-		"data-variant": r,
-		...ee ? { "data-adaptive": "" } : {},
-		role: "tablist"
-	};
-	return n === void 0 ? /* @__PURE__ */ h("div", {
-		...g,
-		ref: f
-	}) : n({
-		...g,
-		ref: f
-	});
-}
-function k({ children: e, onClick: t, page: n, ref: r, render: i, ...a }) {
-	let o = C(), s = o.page === n, c = v(n, o.page, o.pageCount), l = o.pages.starts[n], u = l === void 0 ? void 0 : o.slideIds[l];
-	function d(e) {
-		t?.(e), !e.defaultPrevented && o.go(n, w(e), e);
-	}
-	let f = {
-		...e === void 0 ? { "aria-label": o.t("indicator", {
-			page: n + 1,
-			count: o.pageCount
-		}) } : {},
-		...a,
-		"aria-controls": u,
-		"aria-selected": s,
-		children: e,
-		...s ? { "data-current": "" } : {},
-		...c === null ? {} : { "data-distance": c },
-		"data-part": "indicator",
-		onClick: d,
-		role: "tab",
-		tabIndex: s ? 0 : -1,
-		type: "button"
-	};
-	return i === void 0 ? /* @__PURE__ */ h("button", {
-		...f,
-		ref: r
-	}) : i({
-		...f,
-		ref: r
-	});
-}
-function A({ children: e, ref: t, render: n, ...r }) {
-	let i = C(), a = i.pageCount === 0 ? 0 : i.page + 1, o = new Intl.NumberFormat(i.locale), s = {
-		"aria-hidden": !0,
-		...r,
-		children: e === void 0 ? `${o.format(a)} / ${o.format(i.pageCount)}` : e(a, i.pageCount),
-		"data-part": "counter"
-	};
-	return n === void 0 ? /* @__PURE__ */ h("span", {
-		...s,
-		ref: t
-	}) : n({
-		...s,
-		ref: t
-	});
-}
-//#endregion
-export { ve as a, E as c, C as d, S as f, k as i, me as l, _e as n, O as o, x as p, A as r, he as s, ge as t, pe as u };