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

package/dist/date-field-CYcN6diW.js

@@ -1,279 +0,0 @@
-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 { 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, useMemo as f, useRef as p, useState as m } from "react";
-import { Fragment as ee, jsx as h, jsxs as te } from "react/jsx-runtime";
-import { dateFieldMessages as ne } from "@slotted/core/i18n";
-import { EMPTY_SEGMENTS as re, boundSegment as ie, clearSegment as ae, commitTyping as oe, createDateFormat as se, dateOf as g, fieldRange as _, isDateInRange as ce, isSameDate as le, plainDate as ue, segmentsOf as v, stepSegment as y, toISODate as de, todayIn as fe, typeDigit as pe } from "@slotted/core/date";
-//#region src/date-field/date-field-defaults.tsx
-var b = 20, x = o({
-	calendar: "gregory",
-	firstDayOfWeek: void 0,
-	size: "md",
-	timeZone: void 0,
-	variant: "outline",
-	yearPivot: 20
-});
-function S() {
-	return c(x);
-}
-function me({ children: e, ...t }) {
-	let n = S();
-	return /* @__PURE__ */ h(x.Provider, {
-		value: {
-			calendar: t.calendar ?? n.calendar,
-			firstDayOfWeek: t.firstDayOfWeek ?? n.firstDayOfWeek,
-			size: t.size ?? n.size,
-			timeZone: t.timeZone ?? n.timeZone,
-			variant: t.variant ?? n.variant,
-			yearPivot: t.yearPivot ?? n.yearPivot
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/date-field/date-field.tsx
-var he = {
-	day: 5,
-	month: 5,
-	year: 10
-}, ge = ue(2e3, 1, 1);
-function _e({ "aria-describedby": o, "aria-label": c, "aria-labelledby": _, calendar: ue, className: b, clearable: x = !1, defaultValue: me, disabled: _e, end: C, firstDayOfWeek: ye, id: be, invalid: xe, isDateUnavailable: Se, locale: Ce, max: we, messages: Te, min: Ee, name: De, onKeyDown: Oe, onPaste: ke, onValueChange: w, readOnly: Ae, ref: je, render: T, required: Me, size: Ne, start: E, style: Pe, timeZone: Fe, value: D, variant: Ie, yearPivot: Le, ...Re }) {
-	let O = i(), k = O?.registerControl;
-	l(() => k?.(), [k]);
-	let A = S(), ze = n(), Be = r(ne, Te), j = p(null), Ve = u(), M = Ce ?? ze, N = ye ?? A.firstDayOfWeek, P = Le ?? A.yearPivot, F = Fe ?? A.timeZone, He = ue ?? A.calendar, Ue = Ne ?? O?.size ?? A.size, We = Ie ?? A.variant, I = _e ?? O?.disabled, L = Ae ?? O?.readOnly, Ge = xe ?? O?.invalid, R = Me ?? O?.required, z = f(() => se({
-		locale: M,
-		firstDayOfWeek: N,
-		yearPivot: P
-	}), [
-		N,
-		M,
-		P
-	]), [B, Ke] = m(() => ge);
-	l(() => Ke(fe(F)), [F]);
-	let [qe, Je] = m(() => v(D ?? me ?? null)), [V, H] = m(void 0), U = p(qe), W = () => U.current;
-	l(() => {
-		D !== void 0 && (le(g(U.current), D) || (U.current = v(D), Je(U.current)));
-	}, [D]);
-	let G = qe, K = g(G), q = f(() => z.pattern.filter((e) => e.type !== "literal").map((e) => e.type), [z]), J = s((e, t, n) => {
-		let r = g(U.current);
-		U.current = e, Je(e), e.typing === null && a({
-			controlled: D,
-			initial: r,
-			equals: le,
-			onRequest: (t) => {
-				w?.(t.value, {
-					...t,
-					segments: e
-				});
-			}
-		}).request(g(e), t, n);
-	}, [w, D]), Y = s((e) => {
-		H(e), j.current?.querySelector(`[data-part="segment"][data-field="${e}"]`)?.focus();
-	}, []), Ye = s(() => {
-		let e = W(), t = q.find((t) => e[t] === null) ?? q[0];
-		t !== void 0 && Y(t);
-	}, [q, Y]), X = s((e, t) => {
-		let n = q.indexOf(e) + t, r = q[n];
-		r !== void 0 && Y(r);
-	}, [q, Y]);
-	d(je, () => ({
-		focus: () => {
-			let e = q[0];
-			e !== void 0 && Y(e);
-		},
-		clear: () => J(re, "clear", void 0),
-		get activeField() {
-			return V;
-		}
-	}), [
-		V,
-		J,
-		q,
-		Y
-	]);
-	let Z = I !== !0 && L !== !0, Q = (e) => {
-		e.preventDefault(), e.stopPropagation();
-	}, Xe = (e) => (t) => {
-		if (Oe?.(t), t.defaultPrevented) return;
-		let n = j.current !== null && getComputedStyle(j.current).direction === "rtl", r = n ? "ArrowLeft" : "ArrowRight", i = n ? "ArrowRight" : "ArrowLeft";
-		if (t.key === r) {
-			Q(t), X(e, 1);
-			return;
-		}
-		if (t.key === i) {
-			Q(t), X(e, -1);
-			return;
-		}
-		if (Z && !t.altKey) {
-			switch (t.key) {
-				case "ArrowUp":
-					Q(t), J(y(W(), e, 1, B), "keyboard", t);
-					return;
-				case "ArrowDown":
-					Q(t), J(y(W(), e, -1, B), "keyboard", t);
-					return;
-				case "PageUp":
-					Q(t), J(y(W(), e, he[e], B), "keyboard", t);
-					return;
-				case "PageDown":
-					Q(t), J(y(W(), e, -he[e], B), "keyboard", t);
-					return;
-				case "Home":
-					Q(t), J(ie(W(), e, "min", B), "keyboard", t);
-					return;
-				case "Backspace":
-				case "Delete":
-					Q(t), J(ae(W(), e), "clear", t);
-					return;
-				case "End":
-					Q(t), J(ie(W(), e, "max", B), "keyboard", t);
-					return;
-			}
-			if (/^\d$/.test(t.key)) {
-				Q(t);
-				let n = pe(W(), e, Number(t.key), z, B);
-				J(n.segments, "keyboard", t), n.advance && X(e, 1);
-			}
-		}
-	}, Ze = (e) => {
-		if (ke?.(e), e.defaultPrevented || !Z) return;
-		let t = z.parse(e.clipboardData.getData("text/plain"));
-		t !== null && (e.preventDefault(), J(v(t), "keyboard", e));
-	}, Qe = () => {
-		H(void 0);
-		let e = W();
-		e.typing !== null && J(oe(e, z, B), "blur", void 0);
-	}, $e = (e) => {
-		e.target?.closest("[data-part=\"segment\"], button, a, input, select, textarea") ?? (e.preventDefault(), Ye());
-	}, et = (e) => {
-		J(re, "clear", e);
-		let t = q[0];
-		t !== void 0 && Y(t);
-	}, tt = `${Ve}-value`, nt = K === null ? void 0 : z.describe(K), rt = K !== null && Se?.(K) === !0, it = K !== null && !ce(K, Ee, we), at = Ge === !0 || rt || it, ot = G.year === null && G.month === null && G.day === null, st = x && !ot && Z, ct = /* @__PURE__ */ te(ee, { children: [
-		E === void 0 ? null : /* @__PURE__ */ h("span", {
-			"data-part": "start",
-			children: E
-		}),
-		/* @__PURE__ */ h("div", {
-			"aria-describedby": [o, O?.describedBy].filter(Boolean).join(" ") || void 0,
-			"aria-disabled": I === !0 || void 0,
-			"aria-invalid": at ? !0 : void 0,
-			"aria-label": c,
-			"aria-labelledby": c === void 0 ? [_ ?? O?.ids.label, tt].filter(Boolean).join(" ") : void 0,
-			"aria-readonly": L === !0 || void 0,
-			"aria-required": R === !0 || void 0,
-			"data-part": "segments",
-			id: be ?? O?.ids.control,
-			onPaste: Ze,
-			role: "group",
-			children: z.pattern.map((e, t) => {
-				if (e.type === "literal") return /* @__PURE__ */ h("span", {
-					"aria-hidden": "true",
-					"data-part": "literal",
-					children: e.value
-				}, `literal-${String(t)}`);
-				let n = e.type;
-				return /* @__PURE__ */ h(ve, {
-					disabled: I === !0,
-					field: n,
-					format: z,
-					onBlur: Qe,
-					onFocus: () => H(n),
-					onKeyDown: Xe(n),
-					placeholder: e.value,
-					readOnly: L === !0,
-					reference: B,
-					segments: G,
-					tabIndex: n === (V ?? q[0]) ? 0 : -1
-				}, n);
-			})
-		}),
-		/* @__PURE__ */ h("span", {
-			"data-part": "value-text",
-			hidden: !0,
-			id: tt,
-			children: nt
-		}),
-		st ? /* @__PURE__ */ h("button", {
-			"aria-label": Be("clear"),
-			"data-part": "clear",
-			onClick: et,
-			type: "button",
-			children: /* @__PURE__ */ h(t, { children: /* @__PURE__ */ h(e, { name: "x" }) })
-		}) : null,
-		C === void 0 ? null : /* @__PURE__ */ h("span", {
-			"data-part": "end",
-			children: C
-		}),
-		/* @__PURE__ */ h("input", {
-			"data-part": "hidden-input",
-			name: De,
-			readOnly: !0,
-			type: "hidden",
-			value: K === null ? "" : de(K)
-		})
-	] }), $ = {
-		...Re,
-		children: ct,
-		className: b,
-		style: Pe,
-		...I === !0 ? { "data-disabled": "" } : {},
-		...at ? { "data-invalid": "" } : {},
-		...L === !0 ? { "data-readonly": "" } : {},
-		...R === !0 ? { "data-required": "" } : {},
-		"data-calendar": He,
-		"data-part": "root",
-		"data-size": Ue,
-		"data-ui": "date-field",
-		"data-variant": We,
-		onMouseDown: $e,
-		ref: j
-	};
-	return T === void 0 ? /* @__PURE__ */ h("div", { ...$ }) : T($);
-}
-function C({ field: e, format: t, reference: n, segments: r }) {
-	let i = r[e];
-	if (i === null) return t.pattern.find((t) => t.type === e)?.value ?? "";
-	let a = r.typing;
-	return a !== null && a.field === e ? String(i).padStart(a.digits, "0") : t.formatField({
-		year: r.year ?? n.year,
-		month: r.month ?? n.month,
-		day: r.day ?? n.day
-	}, e);
-}
-function ve({ disabled: e, field: t, format: n, onBlur: r, onFocus: i, onKeyDown: a, placeholder: o, readOnly: s, reference: c, segments: l, tabIndex: u }) {
-	let d = l[t], f = _(t, {
-		year: l.year ?? c.year,
-		month: l.month ?? c.month
-	}), p = d === null ? void 0 : t === "month" ? n.monthNames("long")[d - 1] ?? String(d) : String(d);
-	return /* @__PURE__ */ h("div", {
-		"aria-disabled": e ? !0 : void 0,
-		"aria-label": o,
-		"aria-readonly": s ? !0 : void 0,
-		"aria-valuemax": f.max,
-		"aria-valuemin": f.min,
-		"aria-valuenow": d ?? void 0,
-		"aria-valuetext": p,
-		"data-field": t,
-		"data-part": "segment",
-		...d === null ? { "data-placeholder": "" } : {},
-		onBlur: r,
-		onFocus: i,
-		onKeyDown: a,
-		onMouseDown: (e) => {
-			e.preventDefault(), e.currentTarget.focus();
-		},
-		role: "spinbutton",
-		tabIndex: e ? -1 : u,
-		children: C({
-			field: t,
-			format: n,
-			reference: c,
-			segments: l
-		})
-	});
-}
-//#endregion
-export { S as i, b as n, me as r, _e as t };

package/dist/date-picker-4X-_2ltN.js

@@ -1,264 +0,0 @@
-import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { n, r } from "./i18n-DpW8lqJ1.js";
-import { n as i, r as ee, t as te } from "./calendar-B3mio8iQ.js";
-import { b as ne } from "./field-NJaCxl2h.js";
-import { t as re } from "./date-field-CYcN6diW.js";
-import { tabbables as ie } 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 ae, useImperativeHandle as oe, useMemo as se, useRef as u, useState as d } from "react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { createPresence as ce } from "@slotted/core/presence";
-import { createPortalRoot as le } from "@slotted/core/portal";
-import { createDismissableLayer as ue } from "@slotted/core/dismissable-layer";
-import { createPositioner as de } from "@slotted/core/positioner";
-import { createPortal as fe } from "react-dom";
-import { datePickerMessages as pe } from "@slotted/core/i18n";
-import { createDateFormat as me, isDateInRange as he } from "@slotted/core/date";
-//#region src/date-picker/date-picker-defaults.tsx
-var h = o({
-	calendar: "gregory",
-	closeOnSelect: "auto",
-	placement: "bottom-start",
-	size: "md",
-	timeZone: void 0,
-	variant: "outline"
-});
-function g() {
-	return c(h);
-}
-function _({ children: e, ...t }) {
-	let n = g();
-	return /* @__PURE__ */ p(h.Provider, {
-		value: {
-			calendar: t.calendar ?? n.calendar,
-			closeOnSelect: t.closeOnSelect ?? n.closeOnSelect,
-			placement: t.placement ?? n.placement,
-			size: t.size ?? n.size,
-			timeZone: t.timeZone ?? n.timeZone,
-			variant: t.variant ?? n.variant
-		},
-		children: e
-	});
-}
-//#endregion
-//#region src/date-picker/date-picker.tsx
-var ge = "(max-width: 480px) and (pointer: coarse)";
-function _e({ calendar: o, className: c, clearable: h = !1, closeOnSelect: _, defaultOpen: _e = !1, defaultValue: v, defaultView: ve, disabled: ye, firstDayOfWeek: y, fixedWeeks: be = !0, footer: xe, invalid: Se, isDateUnavailable: b, locale: Ce, max: x, messages: we, min: S, months: Te, name: Ee, onKeyDown: De, onOpenChange: C, onValueChange: Oe, open: w, placement: ke, presets: Ae, readOnly: je, ref: Me, render: Ne, required: Pe, selectionMode: Fe = "single", size: Ie, style: Le, timeZone: Re, value: T, variant: ze, weekNumbers: Be, yearPivot: E, ...Ve }) {
-	let D = ne(), O = g(), He = n(), k = r(pe, we), A = u(null), j = u(null), M = u(null), N = ae(), [P, Ue] = d(null), [F, I] = d(null), [We, L] = d("unmounted"), [Ge, R] = d(!1), [z, Ke] = d(!1), [qe, Je] = d(_e), B = u(!1), V = w ?? qe, [H, Ye] = d(v ?? null), U = T ?? H, [W, G] = d(ve ?? "day"), K = Ce ?? He, Xe = Re ?? O.timeZone, Ze = o ?? O.calendar, Qe = Ie ?? D?.size ?? O.size, $e = ze ?? O.variant, et = ke ?? O.placement, tt = _ ?? O.closeOnSelect, q = ye ?? D?.disabled, J = je ?? D?.readOnly, nt = Se ?? (i(T ?? H).some((e) => !he(e, S, x) || b?.(e) === !0) ? !0 : D?.invalid), rt = Pe ?? D?.required, it = q !== !0 && J !== !0, at = se(() => me({ locale: K }), [K]), Y = s((e, t, n) => {
-		a({
-			controlled: w,
-			initial: V,
-			onRequest: (e) => {
-				C?.(e.value, e), B.current = e.value && !e.cancelled;
-			}
-		}).request(e, t, n) && Je(e);
-	}, [
-		V,
-		C,
-		w
-	]), X = s((e, t) => {
-		a({
-			controlled: T,
-			initial: U,
-			equals: () => !1,
-			onRequest: (e) => Oe?.(e.value, e)
-		}).request(e, t.reason, t.source) && Ye(e);
-	}, [
-		U,
-		Oe,
-		T
-	]), [ot] = d(() => v ?? null);
-	l(() => {
-		let e = A.current?.closest("form");
-		if (e == null) return;
-		let t = (e) => X(ot, {
-			reason: "programmatic",
-			source: e
-		});
-		return e.addEventListener("reset", t), () => e.removeEventListener("reset", t);
-	}, [ot, X]);
-	let Z = u(null);
-	l(() => {
-		let e = ce({
-			present: V,
-			onStatusChange: L
-		});
-		return Z.current = e, L(e.status), () => {
-			e.destroy(), Z.current = null;
-		};
-	}, []), l(() => Z.current?.sync(V), [V]), l(() => Z.current?.setNode(P), [P]);
-	let Q = We !== "unmounted";
-	l(() => {
-		if (!Q) {
-			I(null);
-			return;
-		}
-		let e = le({
-			origin: M.current,
-			disabled: !1
-		});
-		return I(e.container), () => e.release();
-	}, [Q]), l(() => {
-		if (typeof window > "u" || typeof window.matchMedia != "function") return;
-		let e = window.matchMedia(ge), t = () => Ke(e.matches);
-		return t(), e.addEventListener("change", t), () => e.removeEventListener("change", t);
-	}, []), l(() => {
-		if (P === null || A.current === null || z) return;
-		let e = !0, t = A.current.querySelector("[data-part=\"control\"]") ?? A.current, [n, r = "center"] = et.split("-"), i = de(t, P, {
-			align: r === void 0 ? "center" : r,
-			side: n
-		});
-		return i.update().then(() => {
-			e && R(!0);
-		}), () => {
-			e = !1, i.destroy(), R(!1);
-		};
-	}, [
-		P,
-		et,
-		z
-	]);
-	let $ = u(W);
-	$.current = W, l(() => {
-		if (P === null || !V) return;
-		let e = M.current === null ? [] : [M.current], t = ue(P, {
-			branches: e,
-			escape: !0,
-			focusOutside: !1,
-			modal: !1,
-			outsidePress: !0,
-			scrollLock: !1,
-			onDismiss: (e) => {
-				if (e.reason === "escape" && $.current !== "day") {
-					G($.current === "year" ? "month" : "day");
-					return;
-				}
-				Y(!1, e.reason === "escape" ? "escape" : "outsidePress", e.source), e.reason === "escape" && M.current?.focus({ preventScroll: !0 });
-			}
-		});
-		return () => t.destroy();
-	}, [
-		V,
-		P,
-		Y
-	]), l(() => {
-		P !== null && F !== null && V && B.current && F.contains(P) && (B.current = !1, P.querySelector("[data-part=\"day\"][tabindex=\"0\"]")?.focus({ preventScroll: !0 }));
-	}, [
-		F,
-		V,
-		P
-	]);
-	let st = (e) => {
-		if (e.key !== "Tab" || e.altKey || e.ctrlKey || e.metaKey) return;
-		let t = ie(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());
-	};
-	oe(Me, () => ({
-		focus: () => j.current?.focus(),
-		open: () => Y(!0, "keyboard", void 0),
-		close: () => Y(!1, "keyboard", void 0)
-	}), [Y]);
-	let ct = i(U), lt = ct.length === 0 ? k("choose") : k("change", { date: ct.map((e) => at.describe(e)).join(" – ") }), ut = tt === "always" || tt === "auto" && Fe === "single", dt = (e) => {
-		De?.(e), !e.defaultPrevented && it && e.altKey && e.key === "ArrowDown" && (e.preventDefault(), Y(!0, "keyboard", e));
-	}, ft = ee(U) || Array.isArray(U) ? void 0 : U ?? null, pt = Q ? /* @__PURE__ */ p("div", {
-		"data-part": "positioner",
-		"data-presentation": z ? "sheet" : "popover",
-		"data-ui": "date-picker",
-		ref: Ue,
-		...V ? { "data-open": "" } : {},
-		...Ge ? { "data-positioned": "" } : {},
-		children: /* @__PURE__ */ m("div", {
-			"aria-label": lt,
-			"data-part": "content",
-			id: N,
-			onKeyDown: st,
-			role: "dialog",
-			children: [
-				Ae === void 0 ? null : /* @__PURE__ */ p("div", {
-					"data-part": "presets",
-					children: Ae
-				}),
-				/* @__PURE__ */ p(te, {
-					fixedWeeks: be,
-					isDateUnavailable: b,
-					locale: K,
-					max: x,
-					min: S,
-					months: Te,
-					onValueChange: (e, t) => {
-						X(e, t), ut && (Y(!1, "select", t.source), M.current?.focus({ preventScroll: !0 }));
-					},
-					onViewChange: G,
-					readOnly: J,
-					selectionMode: Fe,
-					timeZone: Xe,
-					value: U,
-					view: W,
-					weekNumbers: Be,
-					...y === void 0 ? {} : { firstDayOfWeek: y }
-				}),
-				xe === void 0 ? null : /* @__PURE__ */ p("div", {
-					"data-part": "footer",
-					children: xe
-				})
-			]
-		})
-	}) : null, mt = /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", {
-		"data-part": "control",
-		onKeyDown: dt,
-		children: /* @__PURE__ */ p(re, {
-			calendar: Ze,
-			clearable: h,
-			disabled: q,
-			end: /* @__PURE__ */ p("button", {
-				"aria-controls": V ? N : void 0,
-				"aria-expanded": V,
-				"aria-haspopup": "dialog",
-				"aria-label": lt,
-				"data-part": "trigger",
-				disabled: !it,
-				onClick: (e) => Y(!V, "pointer", e),
-				ref: M,
-				type: "button",
-				children: /* @__PURE__ */ p(t, { children: /* @__PURE__ */ p(e, { name: "calendar" }) })
-			}),
-			invalid: nt,
-			isDateUnavailable: b,
-			locale: K,
-			max: x,
-			min: S,
-			name: Ee,
-			onValueChange: (e, t) => X(e, t),
-			readOnly: J,
-			ref: j,
-			required: rt,
-			size: Qe,
-			timeZone: Xe,
-			variant: $e,
-			...y === void 0 ? {} : { firstDayOfWeek: y },
-			...E === void 0 ? {} : { yearPivot: E },
-			...ft === void 0 ? {} : { value: ft }
-		})
-	}), F === null ? pt : null] }), ht = {
-		...Ve,
-		children: mt,
-		className: c,
-		style: Le,
-		...q === !0 ? { "data-disabled": "" } : {},
-		...nt === !0 ? { "data-invalid": "" } : {},
-		...J === !0 ? { "data-readonly": "" } : {},
-		...rt === !0 ? { "data-required": "" } : {},
-		...V ? { "data-open": "" } : {},
-		"data-calendar": Ze,
-		"data-part": "root",
-		"data-size": Qe,
-		"data-ui": "date-picker",
-		"data-variant": $e,
-		ref: A
-	};
-	return /* @__PURE__ */ m(f, { children: [Ne === void 0 ? /* @__PURE__ */ p("div", { ...ht }) : Ne(ht), F === null ? null : fe(pt, F)] });
-}
-//#endregion
-export { _ as n, g as r, _e as t };