@slotted/react 0.1.0-beta.7 → 0.1.0-beta.9

package/dist/timeline-DH_02ysz.js

@@ -1,421 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { n, r } from "./i18n-DpW8lqJ1.js";
-/* empty css                 */
-/* empty css                         */
-import { tabbables as i } from "@slotted/core/focus";
-import { createControllable as a } from "@slotted/core/state";
-import { Children as o, createContext as s, isValidElement as c, useContext as l, useEffect as u, useId as d, useLayoutEffect as f, useRef as p, useState as m } from "react";
-import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { timelineMessages as v } from "@slotted/core/i18n";
-import { getLiveAnnouncer as y } from "@slotted/core/live-announcer";
-import { connectorOf as b, feedFocusTarget as x, formatTimestamp as S, isComplete as C, revealFocusIndex as w, setSizeOf as T, sideOf as E } from "@slotted/core/timeline";
-//#region src/timeline/timeline-defaults.tsx
-var D = s({});
-function O() {
-	return l(D);
-}
-function k({ children: e, ...t }) {
-	let n = O();
-	return /* @__PURE__ */ g(D.Provider, {
-		value: {
-			growing: t.growing ?? n.growing,
-			level: t.level ?? n.level,
-			mode: t.mode ?? n.mode,
-			now: t.now ?? n.now,
-			order: t.order ?? n.order,
-			orientation: t.orientation ?? n.orientation,
-			placement: t.placement ?? n.placement,
-			size: t.size ?? n.size,
-			timeFormat: t.timeFormat ?? n.timeFormat,
-			timeZone: t.timeZone ?? n.timeZone,
-			tone: t.tone ?? n.tone,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/timeline/timeline-context.ts
-var A = s(void 0), j = s({
-	currentIndex: -1,
-	loaded: 0
-}), M = s(void 0);
-function N() {
-	let e = l(A);
-	if (e === void 0) throw Error("Timeline parts must be rendered inside a Timeline.");
-	return e;
-}
-function P() {
-	return l(j);
-}
-function F() {
-	return l(M);
-}
-//#endregion
-//#region src/timeline/timeline-parts.tsx
-var I = s(0);
-function L(e) {
-	return o.toArray(e).filter((e) => c(e));
-}
-function R(e) {
-	let t = 0, n = -1;
-	for (let r of L(e)) if (r.type === V) r.props.current === !0 && n === -1 && (n = t), t += 1;
-	else if (r.type === B) {
-		let e = R(r.props.children);
-		e.currentIndex !== -1 && n === -1 && (n = t + e.currentIndex), t += e.count;
-	}
-	return {
-		count: t,
-		currentIndex: n
-	};
-}
-function z(e, t) {
-	let n = L(e), r = n.reduce((e, t, n) => t.type === V ? n : e, -1), i = R(e), a = t, o = n.map((e, t) => {
-		if (e.type === V) {
-			let n = a;
-			return a += 1, /* @__PURE__ */ g(M.Provider, {
-				value: {
-					index: n,
-					last: t === r
-				},
-				children: e
-			}, e.key ?? n);
-		}
-		if (e.type === B) {
-			let n = a;
-			return a += R(e.props.children).count, /* @__PURE__ */ g(I.Provider, {
-				value: n,
-				children: e
-			}, e.key ?? t);
-		}
-		return e;
-	});
-	return {
-		count: i.count,
-		currentIndex: i.currentIndex === -1 ? -1 : t + i.currentIndex,
-		nodes: o
-	};
-}
-function B({ children: n, collapsible: r = !1, defaultOpen: i, label: o, level: s, onOpenChange: c, open: u, ref: d, render: f, ...p }) {
-	let v = N(), y = l(I), [b, x] = m(i ?? !0), S = r ? u ?? b : !0, C = `${v.ids.list}-group-${y}`, w = `h${s ?? v.level}`, T = z(n, y), E = (e, t, n) => {
-		a({
-			controlled: u,
-			initial: S,
-			onRequest: (e) => c?.(e.value, e)
-		}).request(e, t, n) && x(e);
-	}, D = /* @__PURE__ */ g(w, {
-		"data-part": "group-label",
-		children: r ? /* @__PURE__ */ _("button", {
-			"aria-controls": C,
-			"aria-expanded": S,
-			"data-part": "group-trigger",
-			onClick: (e) => E(!S, e.detail === 0 ? "keyboard" : "pointer", e),
-			type: "button",
-			children: [
-				/* @__PURE__ */ g("span", {
-					"aria-hidden": "true",
-					"data-part": "group-indicator",
-					children: /* @__PURE__ */ g(t, { children: /* @__PURE__ */ g(e, { name: "chevron-down" }) })
-				}),
-				o,
-				/* @__PURE__ */ g("span", {
-					"data-ui": "visually-hidden",
-					children: S ? v.t("collapse") : v.t("expand")
-				})
-			]
-		}) : o
-	}), O = v.mode === "feed", k = g(O ? "div" : "ol", {
-		"data-part": "group-list",
-		hidden: !S,
-		id: C,
-		children: T.nodes
-	}), A = {
-		...p,
-		children: /* @__PURE__ */ _(h, { children: [D, k] }),
-		"data-open": S ? "" : void 0,
-		"data-part": "group"
-	};
-	return f === void 0 ? g(O ? "div" : "li", {
-		...A,
-		ref: d
-	}) : f({
-		...A,
-		ref: d
-	});
-}
-function V({ actions: n, actor: r, children: i, complete: a, connector: o, current: s = !1, description: c, loading: l = !1, marker: d, opposite: f, ref: p, render: m, side: v, time: y, timeLabel: x, title: S, tone: w, variant: D, ...O }) {
-	let k = N(), A = P(), j = F(), M = j?.index ?? 0, I = j?.last ?? !0, L = k.mode === "feed", R = C({
-		autoComplete: k.autoComplete,
-		complete: a,
-		currentIndex: A.currentIndex,
-		index: M,
-		order: k.order
-	}), z = b({
-		autoComplete: k.autoComplete,
-		connector: o,
-		currentIndex: A.currentIndex,
-		index: M,
-		order: k.order
-	}), B = k.placement === "alternate" || v !== void 0 ? E(k.placement, M, v) : void 0, V = (e) => k.ids.item(M, e), U = [
-		S === void 0 ? null : V("title"),
-		r === void 0 ? null : V("actor"),
-		y === void 0 ? null : V("time")
-	].filter((e) => e !== null);
-	u(() => {}, [L, U.length]);
-	let ee = R && !s ? /* @__PURE__ */ g(t, {
-		"data-check": "",
-		children: /* @__PURE__ */ g(e, { name: "check" })
-	}) : null, te = /* @__PURE__ */ _("div", {
-		"data-part": "content",
-		children: [
-			S === void 0 ? null : /* @__PURE__ */ _("div", {
-				"data-part": "title",
-				id: V("title"),
-				children: [S, s ? /* @__PURE__ */ g("span", {
-					"data-ui": "visually-hidden",
-					children: k.t("current")
-				}) : null]
-			}),
-			y === void 0 ? null : /* @__PURE__ */ g(H, {
-				id: V("time"),
-				value: y,
-				children: x
-			}),
-			r === void 0 ? null : /* @__PURE__ */ g("div", {
-				"data-part": "actor",
-				id: V("actor"),
-				children: r
-			}),
-			c === void 0 ? null : /* @__PURE__ */ g("div", {
-				"data-part": "description",
-				id: V("description"),
-				children: c
-			}),
-			i,
-			n === void 0 ? null : /* @__PURE__ */ g("div", {
-				"data-part": "actions",
-				children: n
-			})
-		]
-	}), W = {
-		...O,
-		...s ? { "aria-current": !0 } : {},
-		...L ? {
-			"aria-describedby": c === void 0 ? void 0 : V("description"),
-			"aria-labelledby": U.length === 0 ? void 0 : U.join(" "),
-			"aria-posinset": M + 1,
-			"aria-setsize": T({
-				count: k.count,
-				growing: k.growing,
-				loaded: A.loaded
-			}),
-			role: "article",
-			tabIndex: O.tabIndex ?? 0
-		} : {},
-		...l ? { "aria-busy": !0 } : {},
-		children: /* @__PURE__ */ _(h, { children: [
-			f === void 0 ? null : /* @__PURE__ */ g("div", {
-				"data-part": "opposite",
-				children: f
-			}),
-			/* @__PURE__ */ _("div", {
-				"data-part": "rail",
-				children: [/* @__PURE__ */ g("span", {
-					"data-part": "marker",
-					children: l ? /* @__PURE__ */ g("span", {
-						"aria-hidden": "true",
-						"data-part": "root",
-						"data-ui": "spinner"
-					}) : d ?? ee
-				}), I ? null : /* @__PURE__ */ g("span", {
-					"aria-hidden": "true",
-					"data-part": "connector"
-				})]
-			}),
-			te
-		] }),
-		"data-complete": R && !s ? "" : void 0,
-		"data-connector": z === "solid" ? void 0 : z,
-		"data-current": s ? "" : void 0,
-		"data-loading": l ? "" : void 0,
-		"data-part": "item",
-		"data-side": B,
-		"data-tone": w ?? k.tone,
-		"data-variant": D ?? k.variant
-	};
-	return m === void 0 ? g(L ? "article" : "li", {
-		...W,
-		ref: p
-	}) : m({
-		...W,
-		ref: p
-	});
-}
-function H({ children: e, format: t, locale: r, now: i, ref: a, timeZone: o, value: s, ...c }) {
-	let u = l(A), d = n(), f = S(s, {
-		format: t ?? u?.timeFormat,
-		locale: r ?? u?.locale ?? d,
-		now: i ?? u?.now,
-		timeZone: o ?? u?.timeZone
-	});
-	return /* @__PURE__ */ g("time", {
-		...f.title === null ? {} : { title: f.title },
-		...c,
-		"data-part": "time",
-		dateTime: f.dateTime,
-		ref: a,
-		children: e ?? f.text
-	});
-}
-//#endregion
-//#region src/timeline/timeline.tsx
-function U({ autoComplete: e = !1, children: t, count: a, empty: o, freshCount: s = 0, growing: c, label: l, labelledBy: h, level: b, loading: S = !1, locale: C, messages: T, mode: E, now: D, onKeyDown: k, onLoadMore: M, onReveal: N, order: P, orientation: F, placement: I, reflow: L = !0, render: R, size: B, timeFormat: V, timeZone: H, tone: U, variant: ee, ...te }) {
-	let W = O(), ne = n(), G = r(v, T), K = `slotted-timeline-${d()}`, q = p(null), J = p(null), re = p(null), [Y, ie] = m(s);
-	s > 0 && s !== Y && ie(s);
-	let ae = p(s), oe = E ?? W.mode ?? "list", X = c ?? W.growing ?? "none", se = oe === "feed", Z = z(t, 0), Q = () => [...q.current?.querySelectorAll("[data-part=\"item\"]") ?? []].filter((e) => e.closest("[data-part=\"group-list\"][hidden]") === null), $ = {
-		autoComplete: e,
-		count: a,
-		focusItem: (e) => {
-			Q()[e]?.focus();
-		},
-		growing: X,
-		ids: {
-			item: (e, t) => `${K}-${e}-${t}`,
-			list: K
-		},
-		level: b ?? W.level ?? 3,
-		loading: S,
-		locale: C ?? ne,
-		mode: oe,
-		now: D ?? W.now,
-		order: P ?? W.order ?? "oldest-first",
-		orientation: F ?? W.orientation ?? "vertical",
-		placement: I ?? W.placement ?? "end",
-		size: B ?? W.size ?? "md",
-		t: G,
-		timeFormat: V ?? W.timeFormat ?? "absolute",
-		timeZone: H ?? W.timeZone,
-		tone: U ?? W.tone ?? "secondary",
-		variant: ee ?? W.variant ?? "subtle"
-	}, ce = (e) => {
-		if (k?.(e), e.defaultPrevented || !se) return;
-		let t = Q(), n = t.findIndex((t) => t.contains(e.target)), r = x({
-			count: t.length,
-			ctrlKey: e.ctrlKey,
-			from: n,
-			key: e.key,
-			metaKey: e.metaKey
-		});
-		if (r === null) return;
-		if (e.preventDefault(), typeof r == "number") {
-			t[r]?.focus();
-			return;
-		}
-		let a = q.current;
-		if (a === null) return;
-		let o = i(a.ownerDocument.body), s = a.compareDocumentPosition.bind(a);
-		(r === "after" ? o.find((e) => s(e) & Node.DOCUMENT_POSITION_FOLLOWING && !a.contains(e)) : [...o].reverse().find((e) => s(e) & Node.DOCUMENT_POSITION_PRECEDING && !a.contains(e)))?.focus();
-	};
-	u(() => {
-		s <= 0 || y().announce(G("freshItems", { count: s }));
-	}, [s]), f(() => {
-		let e = ae.current;
-		ae.current = s;
-		let t = re.current;
-		if (s > 0 || e <= 0 || t === null || !t.contains(t.ownerDocument.activeElement)) return;
-		let n = Q(), r = w({
-			loaded: n.length,
-			revealed: e,
-			order: $.order
-		}), a = r === null ? void 0 : n[r];
-		a !== void 0 && (a.hasAttribute("tabindex") ? a : i(a)[0])?.focus();
-	}, [s]), u(() => {
-		let e = J.current;
-		if (X !== "scroll" || e === null || S || typeof IntersectionObserver > "u") return;
-		let t = new IntersectionObserver((e) => {
-			e.some((e) => e.isIntersecting) && M?.("scroll");
-		});
-		return t.observe(e), () => t.disconnect();
-	}, [
-		X,
-		S,
-		M
-	]);
-	let le = {
-		"aria-label": h === void 0 ? l : void 0,
-		"aria-labelledby": h,
-		"data-part": "list",
-		id: K,
-		onKeyDown: ce
-	}, ue = se ? /* @__PURE__ */ g("div", {
-		...le,
-		"aria-busy": S ? !0 : void 0,
-		ref: q,
-		role: "feed",
-		children: Z.nodes
-	}) : /* @__PURE__ */ g("ol", {
-		...le,
-		ref: q,
-		children: Z.nodes
-	}), de = X === "none" ? null : S ? /* @__PURE__ */ _("div", {
-		"aria-live": "polite",
-		"data-part": "more",
-		ref: J,
-		children: [/* @__PURE__ */ g("span", {
-			"aria-hidden": "true",
-			"data-part": "root",
-			"data-ui": "spinner"
-		}), G("loading")]
-	}) : X === "button" ? /* @__PURE__ */ g("button", {
-		"data-part": "more",
-		onClick: (e) => M?.(e.detail === 0 ? "keyboard" : "pointer", e),
-		ref: J,
-		type: "button",
-		children: G("loadMore")
-	}) : /* @__PURE__ */ g("div", {
-		"data-part": "more",
-		ref: J
-	}), fe = {
-		...te,
-		children: /* @__PURE__ */ g(A.Provider, {
-			value: $,
-			children: /* @__PURE__ */ _(j.Provider, {
-				value: {
-					currentIndex: Z.currentIndex,
-					loaded: Z.count
-				},
-				children: [
-					Y > 0 ? /* @__PURE__ */ g("button", {
-						"data-part": "fresh",
-						hidden: s <= 0,
-						onClick: (e) => N?.(e.detail === 0 ? "keyboard" : "pointer", e),
-						ref: re,
-						type: "button",
-						children: G("freshItems", { count: Y })
-					}) : null,
-					ue,
-					de,
-					Z.count === 0 && !S ? /* @__PURE__ */ g("div", {
-						"data-part": "empty",
-						children: o ?? G("empty")
-					}) : null
-				]
-			})
-		}),
-		"data-growing": $.growing,
-		"data-loading": S ? "" : void 0,
-		"data-mode": $.mode,
-		"data-order": $.order,
-		"data-orientation": $.orientation,
-		"data-part": "root",
-		"data-placement": $.placement,
-		"data-reflow": L ? void 0 : "false",
-		"data-size": $.size,
-		"data-tone": $.tone,
-		"data-ui": "timeline",
-		"data-variant": $.variant
-	};
-	return R === void 0 ? /* @__PURE__ */ g("div", { ...fe }) : R(fe);
-}
-//#endregion
-export { N as a, k as c, H as i, O as l, B as n, F as o, V as r, P as s, U as t };