@slotted/react 0.1.0-beta.2 → 0.1.0-beta.3

package/dist/datetime-picker-0F0kDW-8.js

@@ -1,629 +0,0 @@
-import { t as e } from "./react-dom-DzrKNxo6.js";
-import { n as t, t as n } from "./icon-T9Yt4tnm.js";
-import { n as r, r as i } from "./i18n-DpW8lqJ1.js";
-import { t as ee } from "./calendar-B3mio8iQ.js";
-import { b as te } from "./field-BJh5HI7w.js";
-import { t as ne } from "./datetime-field-T1gNdJ7t.js";
-import { tabbables as re } from "@slotted/core/focus";
-import { createControllable as ie } from "@slotted/core/state";
-import { createContext as ae, useCallback as a, useContext as oe, useEffect as o, useId as se, useImperativeHandle as ce, useMemo as s, useRef as c, useState as l } from "react";
-import { Fragment as le, jsx as u, jsxs as d } from "react/jsx-runtime";
-import { createPresence as ue } from "@slotted/core/presence";
-import { createPortalRoot as de } from "@slotted/core/portal";
-import { createDismissableLayer as fe } from "@slotted/core/dismissable-layer";
-import { createPositioner as pe } from "@slotted/core/positioner";
-import { createTypeahead as me, isPrintable as he } from "@slotted/core/typeahead";
-import { datetimePickerMessages as ge } from "@slotted/core/i18n";
-import { createDateTimeFormat as _e, dateBoundsOf as ve, dayWindow as ye, hourJump as be, isDateTimeInRange as xe, isSameDate as Se, isSameDateTime as Ce, isSameTime as f, isTruncated as we, nearestIndex as Te, nowDateTimeIn as Ee, timeList as De, toISOTime as Oe } from "@slotted/core/date";
-//#region src/datetime-picker/datetime-picker-defaults.tsx
-var ke = e(), Ae = 1440, je = ae({
-	calendar: "gregory",
-	closeOnSelect: "auto",
-	granularity: "minute",
-	hourCycle: void 0,
-	maxOptions: Ae,
-	openTo: "date",
-	placement: "bottom-start",
-	size: "md",
-	step: 900,
-	timeZone: void 0,
-	unavailableOptions: "disable",
-	variant: "outline"
-});
-function Me() {
-	return oe(je);
-}
-function Ne({ children: e, ...t }) {
-	let n = Me();
-	return /* @__PURE__ */ u(je.Provider, {
-		value: {
-			calendar: t.calendar ?? n.calendar,
-			closeOnSelect: t.closeOnSelect ?? n.closeOnSelect,
-			granularity: t.granularity ?? n.granularity,
-			hourCycle: t.hourCycle ?? n.hourCycle,
-			maxOptions: t.maxOptions ?? n.maxOptions,
-			openTo: t.openTo ?? n.openTo,
-			placement: t.placement ?? n.placement,
-			size: t.size ?? n.size,
-			step: t.step ?? n.step,
-			timeZone: t.timeZone ?? n.timeZone,
-			unavailableOptions: t.unavailableOptions ?? n.unavailableOptions,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/datetime-picker/datetime-picker.tsx
-var Pe = "(max-width: 480px) and (pointer: coarse)", Fe = {
-	date: {
-		year: 2e3,
-		month: 1,
-		day: 1
-	},
-	time: {
-		hour: 12,
-		minute: 0,
-		second: 0
-	}
-};
-function Ie({ calendar: e, className: ae, clearable: oe = !1, closeOnSelect: Ae, defaultHighlighted: je, defaultOpen: Ne = !1, defaultValue: Ie, disabled: Re, firstDayOfWeek: p, footer: ze, granularity: Be, highlighted: Ve, hourCycle: He, invalid: Ue, isDateUnavailable: m, isTimeUnavailable: h, locale: We, max: g, messages: Ge, maxOptions: Ke, maxTime: qe, min: _, minTime: Je, months: Ye, name: Xe, onHighlightedChange: Ze, onKeyDown: Qe, onOpenChange: $e, onValueChange: et, open: tt, openTo: nt, options: rt, placement: it, presets: at, readOnly: ot, ref: st, referenceDateTime: v, relative: ct, render: lt, renderOption: ut, required: dt, size: ft, step: pt, style: mt, timeZone: ht, unavailableOptions: gt, value: _t, variant: vt, weekNumbers: yt, ...bt }) {
-	let y = te(), b = Me(), xt = r(), x = i(ge, Ge), S = c(null), St = c(null), Ct = c(null), C = c(null), wt = c(null), Tt = c(null), Et = se(), Dt = `${Et}-time`, [w, Ot] = l(null), [T, kt] = l(null), [At, jt] = l("unmounted"), [Mt, Nt] = l(!1), [Pt, Ft] = l(!1), [It, Lt] = l("day"), [Rt, zt] = l(Ne), Bt = c(!1), E = tt ?? Rt, [Vt, Ht] = l(Ie ?? null), D = _t ?? Vt, [O, k] = l(null), [A, j] = l(null), M = c(null), N = We ?? xt, P = ht ?? b.timeZone, F = Be ?? b.granularity, I = He ?? b.hourCycle, Ut = e ?? b.calendar, Wt = ft ?? y?.size ?? b.size, Gt = vt ?? b.variant, Kt = it ?? b.placement, qt = nt ?? b.openTo, Jt = Ae ?? b.closeOnSelect, Yt = pt ?? b.step, Xt = Ke ?? b.maxOptions, Zt = gt ?? b.unavailableOptions, Qt = Re ?? y?.disabled, L = ot ?? y?.readOnly, $t = dt ?? y?.required, R = Qt !== !0 && L !== !0, z = s(() => _e({
-		granularity: F,
-		hourCycle: I,
-		locale: N,
-		...p === void 0 ? {} : { firstDayOfWeek: p }
-	}), [
-		p,
-		F,
-		I,
-		N
-	]), [en, tn] = l(() => Fe);
-	o(() => tn(Ee(P)), [P]);
-	let B = v ?? en, V = s(() => ({
-		max: g,
-		maxTime: qe,
-		min: _,
-		minTime: Je
-	}), [
-		g,
-		qe,
-		_,
-		Je
-	]), nn = D === null ? null : ye(D.date, V), rn = D !== null && (!xe(D, _, g) || nn === null || m?.(D.date) === !0 || h?.(D.time, D.date) === !0), an = Ue ?? (rn ? !0 : y?.invalid), [on, sn] = l(() => je ?? {
-		date: (Ie ?? v ?? Fe).date,
-		time: null
-	}), H = Ve ?? on, cn = c(!1), U = D?.date ?? O ?? H.date, W = a((e, t, n) => {
-		let r = ie({
-			controlled: Ve,
-			initial: H,
-			equals: (e, t) => Se(e.date, t.date) && f(e.time ?? null, t.time ?? null),
-			onRequest: (e) => Ze?.(e.value, e)
-		});
-		t !== "programmatic" && (cn.current = !0), r.request(e, t, n) && sn(e);
-	}, [
-		H,
-		Ve,
-		Ze
-	]);
-	o(() => {
-		if (cn.current || Ve !== void 0) return;
-		let e = D?.date ?? B.date;
-		Se(e, H.date) || W({
-			date: e,
-			time: H.time
-		}, "programmatic", void 0);
-	}, [B, D]);
-	let G = s(() => ye(U, V), [V, U]), ln = s(() => ({
-		isTimeUnavailable: h === void 0 ? void 0 : (e) => h(e, U),
-		max: G?.latest,
-		maxOptions: Xt,
-		min: G?.earliest,
-		options: rt,
-		step: Yt
-	}), [
-		h,
-		U,
-		rt,
-		Xt,
-		Yt,
-		G
-	]), K = s(() => {
-		if (G === null || m?.(U) === !0) return [];
-		let e = De(ln);
-		return Zt === "hide" ? e.filter((e) => !e.unavailable) : e;
-	}, [
-		m,
-		U,
-		ln,
-		Zt,
-		G
-	]), un = s(() => we(ln), [ln]), dn = s(() => K.map((e) => z.time.format(e.time)), [z, K]), fn = a(() => {
-		if (K.length === 0) return -1;
-		let e = D?.time ?? B.time, t = Te(K, e);
-		if (t >= 0 && K[t]?.unavailable !== !0) return t;
-		let n = K.findIndex((e) => !e.unavailable);
-		return n >= 0 ? n : 0;
-	}, [
-		B,
-		D,
-		K
-	]), q = s(() => H.time === null ? -1 : K.findIndex((e) => f(e.time, H.time)), [H, K]), J = a((e, t) => {
-		let n = K[Math.max(0, Math.min(K.length - 1, e))];
-		n !== void 0 && W({
-			date: U,
-			time: n.time
-		}, "keyboard", t);
-	}, [
-		K,
-		U,
-		W
-	]), Y = a((e, t, n, r = !0) => {
-		ie({
-			controlled: tt,
-			initial: E,
-			onRequest: (e) => {
-				$e?.(e.value, e), Bt.current = r && e.value && !e.cancelled;
-			}
-		}).request(e, t, n) && zt(e);
-	}, [
-		E,
-		$e,
-		tt
-	]), X = a((e, t) => {
-		ie({
-			controlled: _t,
-			initial: D,
-			equals: Ce,
-			onRequest: (e) => et?.(e.value, e)
-		}).request(e, t.reason, t.source) && Ht(e);
-	}, [
-		D,
-		et,
-		_t
-	]), [pn] = l(() => Ie ?? null);
-	o(() => {
-		let e = S.current?.closest("form");
-		if (e == null) return;
-		let t = (e) => {
-			k(null), j(null), X(pn, {
-				reason: "programmatic",
-				source: e
-			});
-		};
-		return e.addEventListener("reset", t), () => e.removeEventListener("reset", t);
-	}, [pn, X]);
-	let mn = c(null);
-	o(() => {
-		let e = ue({
-			present: E,
-			onStatusChange: jt
-		});
-		return mn.current = e, jt(e.status), () => {
-			e.destroy(), mn.current = null;
-		};
-	}, []), o(() => mn.current?.sync(E), [E]), o(() => mn.current?.setNode(w), [w]);
-	let hn = At !== "unmounted";
-	o(() => {
-		if (!hn) {
-			kt(null);
-			return;
-		}
-		let e = de({
-			origin: C.current,
-			disabled: !1
-		});
-		return kt(e.container), () => e.release();
-	}, [hn]), o(() => {
-		if (G === void 0 || typeof globalThis.matchMedia != "function") return;
-		let e = globalThis.matchMedia(Pe), t = () => Ft(e.matches);
-		return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
-	}, []), o(() => {
-		if (w === null || S.current === null || Pt) return;
-		let e = !0, t = S.current.querySelector("[data-part=\"control\"]") ?? S.current, [n, r = "center"] = Kt.split("-"), i = pe(t, w, {
-			align: r,
-			side: n
-		});
-		return i.update().then(() => {
-			e && Nt(!0);
-		}), () => {
-			e = !1, i.destroy(), Nt(!1);
-		};
-	}, [
-		w,
-		Kt,
-		Pt
-	]);
-	let gn = c(It);
-	gn.current = It, o(() => {
-		if (w === null || !E) return;
-		let e = C.current === null ? [] : [C.current], t = fe(w, {
-			branches: e,
-			escape: !0,
-			focusOutside: !1,
-			modal: !1,
-			outsidePress: !0,
-			scrollLock: !1,
-			onDismiss: (e) => {
-				if (e.reason === "escape" && gn.current !== "day") {
-					Lt(gn.current === "year" ? "month" : "day");
-					return;
-				}
-				Y(!1, e.reason === "escape" ? "escape" : "outsidePress", e.source), e.reason === "escape" && C.current?.focus({ preventScroll: !0 });
-			}
-		});
-		return () => t.destroy();
-	}, [
-		E,
-		w,
-		Y
-	]), o(() => {
-		if (!E) return;
-		let e = fn(), t = e < 0 ? null : K[e]?.time ?? null;
-		f(t, H.time ?? null) || W({
-			date: H.date,
-			time: t
-		}, "programmatic", void 0);
-	}, [E, K]);
-	let _n = a((e) => {
-		if (e === null) return;
-		let t = () => e.scrollIntoView?.({ block: "nearest" });
-		if (t(), typeof ResizeObserver != "function") return;
-		let n = new ResizeObserver(t);
-		return n.observe(e.parentElement ?? e), () => n.disconnect();
-	}, []), vn = c(me({ locale: () => N }));
-	o(() => {
-		let e = vn.current;
-		return () => e.destroy();
-	}, []), ce(st, () => ({
-		focus: () => St.current?.focus(),
-		open: () => Y(!0, "keyboard", void 0),
-		close: () => Y(!1, "keyboard", void 0)
-	}), [Y]);
-	let yn = D === null ? x("choose") : x("change", { date: z.describe(D) }), Z = a((e) => {
-		wt.current?.querySelectorAll("[data-part=\"option\"]")[e]?.focus();
-	}, []), bn = a((e) => {
-		let t = q >= 0 ? q : fn();
-		t < 0 || (J(t, e), requestAnimationFrame(() => Z(t)));
-	}, [
-		Z,
-		q,
-		J,
-		fn
-	]), xn = a(() => {
-		requestAnimationFrame(() => {
-			let e = Tt.current?.querySelector("[data-part=\"day\"][tabindex=\"0\"]");
-			e == null ? Ct.current?.focus() : e.focus();
-		});
-	}, []), Q = a((e, t) => {
-		e === "time" ? bn(t) : xn();
-	}, [xn, bn]);
-	o(() => {
-		let e = M.current;
-		e !== null && (M.current = null, Q(e, void 0));
-	}), o(() => {
-		E || (k(null), j(null));
-	}, [E]), o(() => {
-		w !== null && T !== null && E && Bt.current && T.contains(w) && (Bt.current = !1, Q(qt, void 0));
-	}, [
-		T,
-		E,
-		w
-	]);
-	let $ = a((e, t, n, r) => {
-		let i = e !== null;
-		if (i && !t && Jt !== "never") {
-			Y(!1, "select", r), C.current?.focus({ preventScroll: !0 });
-			return;
-		}
-		if (i && t && Jt === "always") {
-			Y(!1, "select", r), C.current?.focus({ preventScroll: !0 });
-			return;
-		}
-		i || Q(n === "date" ? "time" : "date", r);
-	}, [
-		Q,
-		Jt,
-		Y
-	]), Sn = a((e, t) => {
-		if (!R) return;
-		let n = D !== null, r = D?.time ?? A;
-		if (r === null) {
-			k(e), W({
-				date: e,
-				time: null
-			}, "pointer", t), M.current = "time";
-			return;
-		}
-		let i = {
-			date: e,
-			time: r
-		};
-		k(null), j(null), X(i, {
-			reason: "select",
-			source: t
-		}), W({
-			date: e,
-			time: H.time
-		}, "pointer", t), $(i, n, "date", t);
-	}, [
-		$,
-		R,
-		D,
-		H,
-		A,
-		W,
-		X
-	]), Cn = a((e, t) => {
-		if (e.unavailable || !R) return;
-		let n = D !== null, r = D?.date ?? O;
-		if (W({
-			date: U,
-			time: e.time
-		}, "pointer", t), r === null) {
-			j(e.time), M.current = "date";
-			return;
-		}
-		let i = {
-			date: r,
-			time: e.time
-		};
-		k(null), j(null), X(i, {
-			reason: "select",
-			source: t
-		}), $(i, n, "time", t);
-	}, [
-		$,
-		R,
-		D,
-		U,
-		O,
-		W,
-		X
-	]), wn = (e) => {
-		Qe?.(e), !e.defaultPrevented && R && (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), E ? Q(qt, e) : Y(!0, "keyboard", e));
-	}, Tn = (e) => {
-		if (Qe?.(e), e.defaultPrevented) return;
-		let t = q >= 0 ? q : 0;
-		switch (e.key) {
-			case "ArrowDown":
-				e.preventDefault(), J(t + 1, e), Z(Math.min(K.length - 1, t + 1));
-				return;
-			case "ArrowUp":
-				e.preventDefault(), J(t - 1, e), Z(Math.max(0, t - 1));
-				return;
-			case "Home":
-				e.preventDefault(), J(0, e), Z(0);
-				return;
-			case "End":
-				e.preventDefault(), J(K.length - 1, e), Z(K.length - 1);
-				return;
-			case "PageDown": {
-				e.preventDefault();
-				let n = be(K, t, 1);
-				J(n, e), Z(n);
-				return;
-			}
-			case "PageUp": {
-				e.preventDefault();
-				let n = be(K, t, -1);
-				J(n, e), Z(n);
-				return;
-			}
-			case "Enter":
-			case " ": {
-				e.preventDefault();
-				let n = K[t];
-				n !== void 0 && Cn(n, e);
-				return;
-			}
-		}
-		if (he(e.key, vn.current.query.length > 0)) {
-			let n = vn.current.match(e.key, dn, t);
-			if (n < 0) return;
-			e.preventDefault(), J(n, e), Z(n);
-		}
-	}, En = (e) => {
-		Qe?.(e), !e.defaultPrevented && R && e.altKey && e.key === "ArrowDown" && (e.preventDefault(), Y(!0, "keyboard", e, !1));
-	}, Dn = (e) => {
-		if (e.key !== "Tab" || e.altKey || e.ctrlKey || e.metaKey) return;
-		let t = re(e.currentTarget), n = t[0], r = t[t.length - 1];
-		if (n === void 0 || r === void 0) return;
-		let i = e.currentTarget.ownerDocument.activeElement;
-		e.shiftKey && i === n ? (e.preventDefault(), r.focus()) : !e.shiftKey && i === r && (e.preventDefault(), n.focus());
-	}, On = D === null ? /* @__PURE__ */ d(le, { children: [
-		z.describeDate(O ?? H.date),
-		", ",
-		A === null ? /* @__PURE__ */ u("span", {
-			"data-placeholder": "",
-			children: Le(z.granularity)
-		}) : z.time.format(A)
-	] }) : z.describe(D), kn = hn ? /* @__PURE__ */ u("div", {
-		"data-part": "positioner",
-		"data-presentation": Pt ? "sheet" : "popover",
-		"data-ui": "datetime-picker",
-		ref: Ot,
-		...E ? { "data-open": "" } : {},
-		...Mt ? { "data-positioned": "" } : {},
-		children: /* @__PURE__ */ d("div", {
-			"aria-label": yn,
-			"data-granularity": F,
-			"data-open-to": qt,
-			"data-part": "content",
-			id: Et,
-			onKeyDown: Dn,
-			role: "dialog",
-			...un ? { "aria-description": x("truncated") } : {},
-			children: [
-				/* @__PURE__ */ d("div", {
-					"data-part": "head",
-					children: [
-						/* @__PURE__ */ u("span", {
-							"data-part": "head-value",
-							children: On
-						}),
-						at === void 0 ? null : /* @__PURE__ */ u("div", {
-							"data-part": "presets",
-							children: at
-						}),
-						/* @__PURE__ */ d("button", {
-							"data-part": "now",
-							onClick: (e) => {
-								let t = Ee(P), n = D !== null;
-								k(null), j(null), X(t, {
-									reason: "select",
-									source: e
-								}), W({
-									date: t.date,
-									time: t.time
-								}, "pointer", e), $(t, n, "time", e);
-							},
-							type: "button",
-							children: [/* @__PURE__ */ u(n, {
-								size: "sm",
-								children: /* @__PURE__ */ u(t, { name: "clock" })
-							}), x("now")]
-						})
-					]
-				}),
-				/* @__PURE__ */ d("div", {
-					"data-part": "panels",
-					children: [/* @__PURE__ */ u("div", {
-						"data-part": "date-panel",
-						ref: Tt,
-						children: /* @__PURE__ */ u(ee, {
-							focusedDate: H.date,
-							isDateUnavailable: m,
-							locale: N,
-							months: Ye,
-							onFocusedDateChange: (e, t) => W({
-								date: e,
-								time: H.time
-							}, t.reason === "pointer" ? "pointer" : "keyboard", t.source),
-							onValueChange: (e, t) => {
-								let n = Array.isArray(e) ? e[0] : e;
-								n != null && !Array.isArray(n) && Sn(n, t.source);
-							},
-							onViewChange: Lt,
-							readOnly: L,
-							selectionMode: "single",
-							timeZone: P,
-							value: D?.date ?? O,
-							view: It,
-							weekNumbers: yt,
-							...ve(V),
-							...p === void 0 ? {} : { firstDayOfWeek: p },
-							ref: Ct
-						})
-					}), /* @__PURE__ */ u("div", {
-						"data-part": "time-panel",
-						children: K.length === 0 ? /* @__PURE__ */ u("div", {
-							"data-part": "empty",
-							children: x("empty")
-						}) : /* @__PURE__ */ u("div", {
-							"aria-label": z.describeDate(U, "short"),
-							"data-part": "list",
-							id: Dt,
-							onKeyDown: Tn,
-							ref: wt,
-							role: "listbox",
-							...un ? { "data-truncated": "" } : {},
-							children: K.map((e, t) => {
-								let n = dn[t] ?? "", r = D === null ? f(e.time, A) : Se(D.date, U) && f(e.time, D.time), i = t === q;
-								return /* @__PURE__ */ u("div", {
-									"aria-disabled": e.unavailable ? !0 : void 0,
-									"aria-selected": r,
-									"data-part": "option",
-									onClick: (t) => Cn(e, t),
-									ref: i ? _n : void 0,
-									role: "option",
-									tabIndex: i ? 0 : -1,
-									...e.unavailable ? { "data-disabled": "" } : {},
-									...r ? { "data-selected": "" } : {},
-									...i ? { "data-current": "" } : {},
-									children: ut === void 0 ? n : ut({
-										current: i,
-										date: U,
-										label: n,
-										selected: r,
-										time: e.time,
-										unavailable: e.unavailable
-									})
-								}, Oe(e.time));
-							})
-						})
-					})]
-				}),
-				ze === void 0 ? null : /* @__PURE__ */ u("div", {
-					"data-part": "footer",
-					children: ze
-				})
-			]
-		})
-	}) : null, An = /* @__PURE__ */ d(le, { children: [/* @__PURE__ */ u("div", {
-		"data-part": "control",
-		onKeyDown: En,
-		children: /* @__PURE__ */ u(ne, {
-			calendar: Ut,
-			clearable: oe,
-			disabled: Qt,
-			end: /* @__PURE__ */ u("button", {
-				"aria-controls": E ? Et : void 0,
-				"aria-expanded": E,
-				"aria-haspopup": "dialog",
-				"aria-label": yn,
-				"data-part": "trigger",
-				disabled: !R,
-				onClick: (e) => Y(!E, "pointer", e),
-				onKeyDown: wn,
-				ref: C,
-				type: "button",
-				children: /* @__PURE__ */ u(n, { children: /* @__PURE__ */ u(t, { name: "calendar" }) })
-			}),
-			granularity: F,
-			invalid: an,
-			isDateUnavailable: m,
-			isTimeUnavailable: h,
-			locale: N,
-			max: g,
-			maxTime: qe,
-			min: _,
-			minTime: Je,
-			name: Xe,
-			onValueChange: (e, t) => X(e, t),
-			readOnly: L,
-			ref: St,
-			required: $t,
-			size: Wt,
-			timeZone: P,
-			value: D,
-			variant: Gt,
-			...p === void 0 ? {} : { firstDayOfWeek: p },
-			...I === void 0 ? {} : { hourCycle: I },
-			...v === void 0 ? {} : { referenceDateTime: v },
-			...ct === void 0 ? {} : { relative: ct }
-		})
-	}), T === null ? kn : null] }), jn = {
-		...bt,
-		children: An,
-		className: ae,
-		style: mt,
-		...Qt === !0 ? { "data-disabled": "" } : {},
-		...an === !0 ? { "data-invalid": "" } : {},
-		...L === !0 ? { "data-readonly": "" } : {},
-		...$t === !0 ? { "data-required": "" } : {},
-		...E ? { "data-open": "" } : {},
-		"data-granularity": F,
-		"data-part": "root",
-		"data-size": Wt,
-		"data-ui": "datetime-picker",
-		"data-variant": Gt,
-		ref: S
-	};
-	return /* @__PURE__ */ d(le, { children: [lt === void 0 ? /* @__PURE__ */ u("div", { ...jn }) : lt(jn), T === null ? null : (0, ke.createPortal)(kn, T)] });
-}
-function Le(e) {
-	return e === "hour" ? "--" : e === "second" ? "--:--:--" : "--:--";
-}
-//#endregion
-export { Me as i, Ae as n, Ne as r, Ie as t };