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

package/dist/{time-picker-DuT1tf5-.js → time-picker-CRQsMJbQ.js}

@@ -1,20 +1,20 @@
-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 { b as ee } from "./field-BJh5HI7w.js";
-import { t as te } from "./time-field-DCG_VtGO.js";
+import { n as e, t } from "./icon-T9Yt4tnm.js";
+import { n, r } from "./i18n-DpW8lqJ1.js";
+import { b as i } from "./field-NJaCxl2h.js";
+import { t as ee } from "./time-field-DrhiCtUl.js";
 import { createControllable as a } from "@slotted/core/state";
-import { createContext as ne, useCallback as o, useContext as re, useEffect as s, useId as ie, useImperativeHandle as ae, useMemo as c, useRef as l, useState as u } from "react";
-import { Fragment as oe, jsx as d, jsxs as f } from "react/jsx-runtime";
-import { createPresence as se } from "@slotted/core/presence";
-import { createPortalRoot as ce } from "@slotted/core/portal";
-import { createDismissableLayer as le } from "@slotted/core/dismissable-layer";
-import { createPositioner as ue } from "@slotted/core/positioner";
-import { createTypeahead as de, isPrintable as fe } from "@slotted/core/typeahead";
+import { createContext as te, useCallback as o, useContext as ne, useEffect as s, useId as re, useImperativeHandle as ie, useMemo as c, useRef as l, useState as u } from "react";
+import { Fragment as ae, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { createPresence as oe } from "@slotted/core/presence";
+import { createPortalRoot as se } from "@slotted/core/portal";
+import { createDismissableLayer as ce } from "@slotted/core/dismissable-layer";
+import { createPositioner as le } from "@slotted/core/positioner";
+import { createTypeahead as ue, isPrintable as de } from "@slotted/core/typeahead";
+import { createPortal as fe } from "react-dom";
 import { timePickerMessages as pe } from "@slotted/core/i18n";
 import { createTimeFormat as me, hourJump as he, isSameTime as p, isTimeInRange as ge, isTruncated as _e, nearestIndex as ve, nowIn as ye, timeList as be, toISOTime as xe } from "@slotted/core/date";
 //#region src/time-picker/time-picker-defaults.tsx
-var Se = e(), Ce = 900, m = 1440, we = ne({
+var Se = 900, m = 1440, h = te({
 	closeOnSelect: "auto",
 	granularity: "minute",
 	hourCycle: void 0,
@@ -26,12 +26,12 @@ var Se = e(), Ce = 900, m = 1440, we = ne({
 	unavailableOptions: "disable",
 	variant: "outline"
 });
-function h() {
-	return re(we);
+function g() {
+	return ne(h);
 }
-function Te({ children: e, ...t }) {
-	let n = h();
-	return /* @__PURE__ */ d(we.Provider, {
+function Ce({ children: e, ...t }) {
+	let n = g();
+	return /* @__PURE__ */ d(h.Provider, {
 		value: {
 			closeOnSelect: t.closeOnSelect ?? n.closeOnSelect,
 			granularity: t.granularity ?? n.granularity,
@@ -49,50 +49,50 @@ function Te({ children: e, ...t }) {
 }
 //#endregion
 //#region src/time-picker/time-picker.tsx
-var Ee = "(max-width: 480px) and (pointer: coarse)", De = {
+var we = "(max-width: 480px) and (pointer: coarse)", Te = {
 	hour: 12,
 	minute: 0,
 	second: 0
 };
-function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlightedValue: Ce, defaultOpen: m = !1, defaultValue: we, disabled: Te, footer: g, granularity: Oe, highlightedValue: _, hourCycle: ke, invalid: Ae, isTimeUnavailable: v, locale: je, max: y, maxOptions: Me, messages: Ne, min: b, name: Pe, onHighlightedValueChange: Fe, onKeyDown: x, onOpenChange: Ie, onValueChange: Le, open: S, options: Re, placement: ze, presets: Be, readOnly: Ve, ref: He, referenceTime: C, relative: Ue, render: We, renderOption: Ge, required: Ke, size: qe, step: Je, style: Ye, timeZone: Xe, unavailableOptions: Ze, value: w, variant: Qe, ...$e }) {
-	let T = ee(), E = h(), et = r(), D = i(pe, Ne), O = l(null), tt = l(null), k = l(null), A = l(null), nt = ie(), [j, rt] = u(null), [M, it] = u(null), [at, ot] = u("unmounted"), [st, ct] = u(!1), [N, lt] = u(!1), [ut, dt] = u(m), P = S ?? ut, [ft, pt] = u(we ?? null), F = w ?? ft, I = je ?? et, L = Xe ?? E.timeZone, R = Oe ?? E.granularity, z = ke ?? E.hourCycle, mt = qe ?? T?.size ?? E.size, ht = Qe ?? E.variant, gt = ze ?? E.placement, _t = re ?? E.closeOnSelect, vt = Je ?? E.step, yt = Me ?? E.maxOptions, bt = Ze ?? E.unavailableOptions, B = Te ?? T?.disabled, V = Ve ?? T?.readOnly, xt = Ke ?? T?.required, H = B !== !0 && V !== !0, U = c(() => me({
-		granularity: R,
-		hourCycle: z,
-		locale: I
+function Ee({ className: te, clearable: ne = !1, closeOnSelect: Se, defaultHighlightedValue: m, defaultOpen: h = !1, defaultValue: Ce, disabled: Ee, footer: De, granularity: Oe, highlightedValue: _, hourCycle: ke, invalid: Ae, isTimeUnavailable: v, locale: je, max: y, maxOptions: Me, messages: Ne, min: b, name: Pe, onHighlightedValueChange: Fe, onKeyDown: x, onOpenChange: Ie, onValueChange: Le, open: S, options: Re, placement: ze, presets: Be, readOnly: Ve, ref: He, referenceTime: C, relative: Ue, render: We, renderOption: Ge, required: Ke, size: qe, step: Je, style: Ye, timeZone: Xe, unavailableOptions: Ze, value: w, variant: Qe, ...$e }) {
+	let T = i(), E = g(), et = n(), D = r(pe, Ne), O = l(null), tt = l(null), k = l(null), A = l(null), nt = re(), [j, rt] = u(null), [M, it] = u(null), [at, ot] = u("unmounted"), [st, ct] = u(!1), [lt, ut] = u(!1), [dt, ft] = u(h), N = S ?? dt, [pt, mt] = u(Ce ?? null), P = w ?? pt, F = je ?? et, I = Xe ?? E.timeZone, L = Oe ?? E.granularity, R = ke ?? E.hourCycle, ht = qe ?? T?.size ?? E.size, gt = Qe ?? E.variant, _t = ze ?? E.placement, vt = Se ?? E.closeOnSelect, yt = Je ?? E.step, bt = Me ?? E.maxOptions, xt = Ze ?? E.unavailableOptions, z = Ee ?? T?.disabled, B = Ve ?? T?.readOnly, St = Ke ?? T?.required, V = z !== !0 && B !== !0, H = c(() => me({
+		granularity: L,
+		hourCycle: R,
+		locale: F
 	}), [
+		L,
 		R,
-		z,
-		I
-	]), [St, Ct] = u(() => De);
-	s(() => Ct(ye(L)), [L]);
-	let wt = C ?? St, Tt = F !== null && (!ge(F, b, y) || v?.(F) === !0), Et = Ae ?? (Tt ? !0 : T?.invalid), W = c(() => ({
+		F
+	]), [Ct, wt] = u(() => Te);
+	s(() => wt(ye(I)), [I]);
+	let U = C ?? Ct, Tt = P !== null && (!ge(P, b, y) || v?.(P) === !0), Et = Ae ?? (Tt ? !0 : T?.invalid), W = c(() => ({
 		isTimeUnavailable: v,
 		max: y,
-		maxOptions: yt,
+		maxOptions: bt,
 		min: b,
 		options: Re,
-		step: vt
+		step: yt
 	}), [
 		v,
 		y,
 		b,
 		Re,
-		yt,
-		vt
+		bt,
+		yt
 	]), G = c(() => {
 		let e = be(W);
-		return bt === "hide" ? e.filter((e) => !e.unavailable) : e;
-	}, [W, bt]), Dt = c(() => _e(W), [W]), Ot = c(() => G.map((e) => U.format(e.time)), [U, G]), kt = o(() => {
+		return xt === "hide" ? e.filter((e) => !e.unavailable) : e;
+	}, [W, xt]), Dt = c(() => _e(W), [W]), Ot = c(() => G.map((e) => H.format(e.time)), [H, G]), kt = o(() => {
 		if (G.length === 0) return -1;
-		let e = ve(G, F ?? wt);
+		let e = ve(G, P ?? U);
 		if (e >= 0 && G[e]?.unavailable !== !0) return e;
 		let t = G.findIndex((e) => !e.unavailable);
 		return t >= 0 ? t : 0;
 	}, [
-		wt,
-		F,
+		U,
+		P,
 		G
-	]), [At, jt] = u(Ce ?? null), K = _ ?? At, q = c(() => K === null ? -1 : G.findIndex((e) => p(e.time, K)), [K, G]), J = o((e, t, n) => {
+	]), [At, jt] = u(m ?? null), K = _ ?? At, q = c(() => K === null ? -1 : G.findIndex((e) => p(e.time, K)), [K, G]), J = o((e, t, n) => {
 		a({
 			controlled: _,
 			initial: K,
@@ -109,52 +109,52 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 	}, [G, J]), X = o((e, t, n) => {
 		a({
 			controlled: S,
-			initial: P,
+			initial: N,
 			onRequest: (e) => Ie?.(e.value, e)
-		}).request(e, t, n) && dt(e);
+		}).request(e, t, n) && ft(e);
 	}, [
-		P,
+		N,
 		Ie,
 		S
 	]), Z = o((e, t) => {
 		a({
 			controlled: w,
-			initial: F,
+			initial: P,
 			equals: p,
 			onRequest: (e) => Le?.(e.value, e)
-		}).request(e, t.reason, t.source) && pt(e);
+		}).request(e, t.reason, t.source) && mt(e);
 	}, [
-		F,
+		P,
 		Le,
 		w
 	]), Q = l(null);
 	s(() => {
-		let e = se({
-			present: P,
+		let e = oe({
+			present: N,
 			onStatusChange: ot
 		});
 		return Q.current = e, ot(e.status), () => {
 			e.destroy(), Q.current = null;
 		};
-	}, []), s(() => Q.current?.sync(P), [P]), s(() => Q.current?.setNode(j), [j]);
+	}, []), s(() => Q.current?.sync(N), [N]), s(() => Q.current?.setNode(j), [j]);
 	let Mt = at !== "unmounted";
 	s(() => {
 		if (!Mt) {
 			it(null);
 			return;
 		}
-		let e = ce({
+		let e = se({
 			origin: k.current,
 			disabled: !1
 		});
 		return it(e.container), () => e.release();
 	}, [Mt]), s(() => {
 		if (typeof window > "u" || typeof window.matchMedia != "function") return;
-		let e = window.matchMedia(Ee), t = () => lt(e.matches);
+		let e = window.matchMedia(we), t = () => ut(e.matches);
 		return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
 	}, []), s(() => {
-		if (j === null || O.current === null || N) return;
-		let e = !0, t = O.current.querySelector("[data-part=\"control\"]") ?? O.current, [n, r = "center"] = gt.split("-"), i = ue(t, j, {
+		if (j === null || O.current === null || lt) return;
+		let e = !0, t = O.current.querySelector("[data-part=\"control\"]") ?? O.current, [n, r = "center"] = _t.split("-"), i = le(t, j, {
 			align: r,
 			side: n
 		});
@@ -165,11 +165,11 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 		};
 	}, [
 		j,
-		gt,
-		N
+		_t,
+		lt
 	]), s(() => {
-		if (j === null || !P) return;
-		let e = k.current === null ? [] : [k.current], t = le(j, {
+		if (j === null || !N) return;
+		let e = k.current === null ? [] : [k.current], t = ce(j, {
 			branches: e,
 			escape: !0,
 			focusOutside: !1,
@@ -182,33 +182,33 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 		});
 		return () => t.destroy();
 	}, [
-		P,
+		N,
 		j,
 		X
 	]), s(() => {
-		if (!P) return;
+		if (!N) return;
 		let e = kt();
 		e < 0 || J(G[e]?.time ?? null, "programmatic", void 0);
-	}, [P, G]), s(() => {
-		!P || q < 0 || (A.current?.querySelectorAll("[data-part=\"option\"]")[q])?.scrollIntoView?.({ block: "nearest" });
-	}, [q, P]);
-	let Nt = l(de({ locale: () => I }));
+	}, [N, G]), s(() => {
+		!N || q < 0 || (A.current?.querySelectorAll("[data-part=\"option\"]")[q])?.scrollIntoView?.({ block: "nearest" });
+	}, [q, N]);
+	let Nt = l(ue({ locale: () => F }));
 	s(() => {
 		let e = Nt.current;
 		return () => e.destroy();
-	}, []), ae(He, () => ({
+	}, []), ie(He, () => ({
 		focus: () => tt.current?.focus(),
 		open: () => X(!0, "keyboard", void 0),
 		close: () => X(!1, "keyboard", void 0)
 	}), [X]);
-	let Pt = F === null ? D("choose") : D("change", { time: U.describe(F) }), Ft = _t !== "never", It = o((e, t) => {
-		!e.unavailable && H && (Z(e.time, {
+	let Pt = P === null ? D("choose") : D("change", { time: H.describe(P) }), Ft = vt !== "never", It = o((e, t) => {
+		!e.unavailable && V && (Z(e.time, {
 			reason: "select",
 			source: t
 		}), J(e.time, "pointer", t), Ft && (X(!1, "select", t), k.current?.focus({ preventScroll: !0 })));
 	}, [
 		Ft,
-		H,
+		V,
 		J,
 		Z,
 		X
@@ -223,7 +223,7 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 		Y,
 		kt
 	]), Rt = (e) => {
-		x?.(e), !e.defaultPrevented && H && (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), P || X(!0, "keyboard", e), Lt(e));
+		x?.(e), !e.defaultPrevented && V && (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), N || X(!0, "keyboard", e), Lt(e));
 	}, zt = (e) => {
 		if (x?.(e), e.defaultPrevented) return;
 		let t = q >= 0 ? q : 0;
@@ -260,19 +260,19 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 				return;
 			}
 		}
-		if (fe(e.key, Nt.current.query.length > 0)) {
+		if (de(e.key, Nt.current.query.length > 0)) {
 			let n = Nt.current.match(e.key, Ot, t);
 			if (n < 0) return;
 			e.preventDefault(), Y(n, e), $(n);
 		}
 	}, Bt = (e) => {
-		x?.(e), !e.defaultPrevented && H && e.altKey && e.key === "ArrowDown" && (e.preventDefault(), X(!0, "keyboard", e));
+		x?.(e), !e.defaultPrevented && V && e.altKey && e.key === "ArrowDown" && (e.preventDefault(), X(!0, "keyboard", e));
 	}, Vt = Mt ? /* @__PURE__ */ d("div", {
 		"data-part": "positioner",
-		"data-presentation": N ? "sheet" : "popover",
+		"data-presentation": lt ? "sheet" : "popover",
 		"data-ui": "time-picker",
 		ref: rt,
-		...P ? { "data-open": "" } : {},
+		...N ? { "data-open": "" } : {},
 		...st ? { "data-positioned": "" } : {},
 		children: /* @__PURE__ */ f("div", {
 			"aria-label": Pt,
@@ -289,7 +289,7 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 					"data-part": "head",
 					children: /* @__PURE__ */ d("button", {
 						"data-part": "now",
-						onClick: (e) => Z(wt, {
+						onClick: (e) => Z(U, {
 							reason: "select",
 							source: e
 						}),
@@ -306,7 +306,7 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 					ref: A,
 					...Dt ? { "data-truncated": "" } : {},
 					children: G.map((e, t) => {
-						let n = Ot[t] ?? "", r = p(e.time, F), i = t === q;
+						let n = Ot[t] ?? "", r = p(e.time, P), i = t === q;
 						return /* @__PURE__ */ d("div", {
 							"aria-disabled": e.unavailable ? !0 : void 0,
 							"aria-selected": r,
@@ -327,70 +327,70 @@ function g({ className: e, clearable: ne = !1, closeOnSelect: re, defaultHighlig
 						}, xe(e.time));
 					})
 				}),
-				g === void 0 ? null : /* @__PURE__ */ d("div", {
+				De === void 0 ? null : /* @__PURE__ */ d("div", {
 					"data-part": "footer",
-					children: g
+					children: De
 				})
 			]
 		})
-	}) : null, Ht = /* @__PURE__ */ f(oe, { children: [/* @__PURE__ */ d("div", {
+	}) : null, Ht = /* @__PURE__ */ f(ae, { children: [/* @__PURE__ */ d("div", {
 		"data-part": "control",
 		onKeyDown: Bt,
-		children: /* @__PURE__ */ d(te, {
+		children: /* @__PURE__ */ d(ee, {
 			clearable: ne,
-			disabled: B,
+			disabled: z,
 			end: /* @__PURE__ */ d("button", {
-				"aria-controls": P ? nt : void 0,
-				"aria-expanded": P,
+				"aria-controls": N ? nt : void 0,
+				"aria-expanded": N,
 				"aria-haspopup": "listbox",
 				"aria-label": Pt,
 				"data-part": "trigger",
-				disabled: !H,
+				disabled: !V,
 				onClick: (e) => {
-					X(!P, "pointer", e), P || Lt(e);
+					X(!N, "pointer", e), N || Lt(e);
 				},
 				onKeyDown: Rt,
 				ref: k,
 				type: "button",
-				children: /* @__PURE__ */ d(n, { children: /* @__PURE__ */ d(t, { name: "clock" }) })
+				children: /* @__PURE__ */ d(t, { children: /* @__PURE__ */ d(e, { name: "clock" }) })
 			}),
-			granularity: R,
+			granularity: L,
 			invalid: Et,
 			isTimeUnavailable: v,
-			locale: I,
+			locale: F,
 			max: y,
 			min: b,
 			name: Pe,
 			onValueChange: (e, t) => Z(e, t),
-			readOnly: V,
+			readOnly: B,
 			ref: tt,
-			required: xt,
-			size: mt,
-			timeZone: L,
-			value: F,
-			variant: ht,
-			...z === void 0 ? {} : { hourCycle: z },
+			required: St,
+			size: ht,
+			timeZone: I,
+			value: P,
+			variant: gt,
+			...R === void 0 ? {} : { hourCycle: R },
 			...C === void 0 ? {} : { referenceTime: C },
 			...Ue === void 0 ? {} : { relative: Ue }
 		})
 	}), M === null ? Vt : null] }), Ut = {
 		...$e,
 		children: Ht,
-		className: e,
+		className: te,
 		style: Ye,
-		...B === !0 ? { "data-disabled": "" } : {},
+		...z === !0 ? { "data-disabled": "" } : {},
 		...Et === !0 ? { "data-invalid": "" } : {},
-		...V === !0 ? { "data-readonly": "" } : {},
-		...xt === !0 ? { "data-required": "" } : {},
-		...P ? { "data-open": "" } : {},
-		"data-granularity": R,
+		...B === !0 ? { "data-readonly": "" } : {},
+		...St === !0 ? { "data-required": "" } : {},
+		...N ? { "data-open": "" } : {},
+		"data-granularity": L,
 		"data-part": "root",
-		"data-size": mt,
+		"data-size": ht,
 		"data-ui": "time-picker",
-		"data-variant": ht,
+		"data-variant": gt,
 		ref: O
 	};
-	return /* @__PURE__ */ f(oe, { children: [We === void 0 ? /* @__PURE__ */ d("div", { ...Ut }) : We(Ut), M === null ? null : (0, Se.createPortal)(Vt, M)] });
+	return /* @__PURE__ */ f(ae, { children: [We === void 0 ? /* @__PURE__ */ d("div", { ...Ut }) : We(Ut), M === null ? null : fe(Vt, M)] });
 }
 //#endregion
-export { h as a, Te as i, m as n, Ce as r, g as t };
+export { g as a, Ce as i, m as n, Se as r, Ee as t };

package/dist/time-picker.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, r, t as i } from "./time-picker-DuT1tf5-.js";
+import { a as e, i as t, n, r, t as i } from "./time-picker-CRQsMJbQ.js";
 export { n as TIME_PICKER_MAX_OPTIONS, r as TIME_PICKER_STEP, i as TimePicker, t as TimePickerDefaultsProvider, e as useTimePickerDefaults };