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

package/dist/combobox.js

@@ -1,2 +1,2 @@
-import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c, u as l } from "./combobox-BVMI9lg8.js";
+import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c, u as l } from "./combobox-C1D5doWM.js";
 export { t as COMBOBOX_FALLBACK, a as Combobox, n as ComboboxContent, r as ComboboxDefaultsProvider, c as ComboboxGroup, e as ComboboxInput, i as ComboboxItem, o as ComboboxSeparator, s as useCombobox, l as useComboboxDefaults };

package/dist/{context-menu-BuST6W94.js → context-menu-B00UIBVC.js}

@@ -1,4 +1,4 @@
-import { _ as e, b as t } from "./menu-parts-W58pVNUt.js";
+import { _ as e, b as t } from "./menu-parts-D6v_mz6O.js";
 import { createContext as n, useCallback as r, useContext as i, useEffect as a, useImperativeHandle as o, useRef as s, useState as c } from "react";
 import { jsx as l } from "react/jsx-runtime";
 //#region src/context-menu/context-menu-defaults.tsx

package/dist/context-menu.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, t as a } from "./context-menu-BuST6W94.js";
+import { a as e, i as t, n, o as r, r as i, t as a } from "./context-menu-B00UIBVC.js";
 export { t as CONTEXT_MENU_FALLBACK, a as ContextMenu, e as ContextMenuDefaultsProvider, n as ContextMenuTrigger, i as useContextMenu, r as useContextMenuDefaults };

package/dist/{currency-field-DD9A5U3D.js → currency-field-Dti9JFu0.js}

@@ -1,6 +1,6 @@
 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 { b as i } from "./field-BxQFpOXS.js";
 import { createControllable as a } from "@slotted/core/state";
 import { createContext as o, useCallback as s, useContext as ee, useEffect as c, useImperativeHandle as te, useLayoutEffect as l, useMemo as u, useRef as d, useState as f } from "react";
 import { jsx as p, jsxs as ne } from "react/jsx-runtime";

package/dist/currency-field.js

@@ -1,2 +1,2 @@
-import { i as e, n as t, r as n, t as r } from "./currency-field-DD9A5U3D.js";
+import { i as e, n as t, r as n, t as r } from "./currency-field-Dti9JFu0.js";
 export { r as CurrencyField, n as CurrencyFieldDefaultsProvider, t as CurrencyFieldScrub, e as useCurrencyFieldDefaults };

package/dist/{dashboard-grid-CBMP_-JV.js → dashboard-grid-CoLKLvYL.js}

@@ -1,5 +1,5 @@
 import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { _ as n, c as r, d as i, g as a, n as o, p as s, t as c } from "./menu-parts-W58pVNUt.js";
+import { _ as n, c as r, d as i, g as a, n as o, p as s, t as c } from "./menu-parts-D6v_mz6O.js";
 import { r as l } from "./i18n-DpW8lqJ1.js";
 /* empty css                         */
 import { n as u, t as d } from "./icon-button-CCWkCDMs.js";

package/dist/dashboard-grid.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, t as a } from "./dashboard-grid-CBMP_-JV.js";
+import { a as e, i as t, n, o as r, r as i, t as a } from "./dashboard-grid-CoLKLvYL.js";
 export { t as DASHBOARD_GRID_FALLBACK, i as DashboardGrid, e as DashboardGridDefaultsProvider, n as DashboardWidget, r as useDashboardGridDefaults, a as usePersistedDashboardLayout };

package/dist/{data-grid-Eb-a4jg3.js → data-grid-DX95Y7mY.js}

@@ -1,27 +1,27 @@
 import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { _ as n, c as r, g as i, n as a, t as o } from "./menu-parts-W58pVNUt.js";
+import { _ as n, c as r, g as i, n as a, t as o } from "./menu-parts-D6v_mz6O.js";
 import { n as s, r as c } from "./i18n-DpW8lqJ1.js";
 import { n as l } from "./icon-button-CCWkCDMs.js";
-import { a as u, i as d, n as f, r as p } from "./tooltip-DbKTPe_i.js";
-import { t as m } from "./checkbox-DfxFHZaU.js";
+import { a as u, i as d, n as f, r as p } from "./tooltip-CgjIROUy.js";
+import { t as m } from "./checkbox-B4Sb1eXj.js";
 import { i as h } from "./skeleton-2LSpg84Z.js";
-import { t as g } from "./text-field-DLfIZ0fk.js";
-import { a as _, d as ee, f as te, l as ne, r as re, t as ie } from "./popover-Be7JWbGJ.js";
+import { t as g } from "./text-field-CbQ6UCAP.js";
+import { a as _, d as ee, f as te, l as ne, r as re, t as ie } from "./popover-DEp8Bf3e.js";
 import { t as v } from "./visually-hidden-CE6u5JLW.js";
 import { i as ae, n as oe, o as se, r as ce, t as le } from "./result-state-CZsQfdN4.js";
-import { t as ue } from "./date-picker-D3-y2Jxw.js";
-import { t as de } from "./date-field-Hr-OCU-H.js";
-import { t as fe } from "./date-range-picker-y3b82Wmf.js";
-import { t as pe } from "./datetime-picker-CIRHVLQp.js";
-import { t as me } from "./datetime-field-B8TrmsDK.js";
-import { t as he } from "./datetime-range-picker-DM-1m98z.js";
-import { a as ge, i as _e, n as ve, s as ye } from "./multi-select-DQ5ds0fX.js";
-import { t as be } from "./number-field-BFIAmv-z.js";
-import { a as xe, t as Se } from "./segmented-control-DmuOGiu6.js";
-import { c as Ce, i as we, n as Te, o as Ee, s as De } from "./select-M7Io4UL9.js";
-import { t as Oe } from "./time-picker-CRQsMJbQ.js";
-import { t as ke } from "./time-field-DrhiCtUl.js";
-import { t as Ae } from "./time-range-picker-DlZJsj1e.js";
+import { t as ue } from "./date-picker-DRk9SZp1.js";
+import { t as de } from "./date-field-BxEpqAPg.js";
+import { t as fe } from "./date-range-picker-6Yz7avTS.js";
+import { t as pe } from "./datetime-picker-STqSWMkH.js";
+import { t as me } from "./datetime-field-D2f9u6im.js";
+import { t as he } from "./datetime-range-picker-DQNQwr3K.js";
+import { a as ge, i as _e, n as ve, s as ye } from "./multi-select-B8z6ApgW.js";
+import { t as be } from "./number-field-DXk1TAXA.js";
+import { a as xe, t as Se } from "./segmented-control-C-PzkTtg.js";
+import { c as Ce, i as we, n as Te, o as Ee, s as De } from "./select-BUylPwpb.js";
+import { t as Oe } from "./time-picker-D6SlQWNF.js";
+import { t as ke } from "./time-field-BI9n607q.js";
+import { t as Ae } from "./time-range-picker-CcV3_45h.js";
 import { createControllable as je } from "@slotted/core/state";
 import { createContext as Me, createElement as Ne, memo as Pe, useCallback as y, useContext as Fe, useEffect as b, useId as Ie, useImperativeHandle as Le, useLayoutEffect as Re, useMemo as x, useRef as S, useState as C } from "react";
 import { Fragment as ze, jsx as w, jsxs as T } from "react/jsx-runtime";

package/dist/data-grid.js

@@ -1,2 +1,2 @@
-import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./data-grid-Eb-a4jg3.js";
+import { a as e, i as t, n, o as r, r as i, s as a, t as o } from "./data-grid-DX95Y7mY.js";
 export { e as DRAG_COLUMN, n as DataGrid, i as DataGridDefaultsProvider, r as EXPANDER_COLUMN, a as SELECTION_COLUMN, t as useDataGridDefaults, o as usePersistedGridView };

package/dist/{data-list-oICmxGkA.js → data-list-CWYTPNm-.js}

@@ -1,8 +1,8 @@
 import { n as e, t } from "./icon-T9Yt4tnm.js";
-import { _ as n, g as r, h as i, m as a, n as o, o as s, t as c } from "./menu-parts-W58pVNUt.js";
+import { _ as n, g as r, h as i, m as a, n as o, o as s, t as c } from "./menu-parts-D6v_mz6O.js";
 import { n as ee, r as te } from "./i18n-DpW8lqJ1.js";
 import { n as l } from "./icon-button-CCWkCDMs.js";
-import { t as ne } from "./checkbox-DfxFHZaU.js";
+import { t as ne } from "./checkbox-B4Sb1eXj.js";
 import { i as u, n as d } from "./skeleton-2LSpg84Z.js";
 import { t as f } from "./visually-hidden-CE6u5JLW.js";
 import { n as p, o as re, r as m, t as ie } from "./result-state-CZsQfdN4.js";

package/dist/data-list.js

@@ -1,2 +1,2 @@
-import { n as e, r as t, t as n } from "./data-list-oICmxGkA.js";
+import { n as e, r as t, t as n } from "./data-list-CWYTPNm-.js";
 export { n as DataList, e as DataListDefaultsProvider, t as useDataListDefaults };

package/dist/{date-field-Hr-OCU-H.js → date-field-BxEpqAPg.js}

@@ -1,6 +1,6 @@
 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 { b as i } from "./field-BxQFpOXS.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";

package/dist/date-field.js

@@ -1,2 +1,2 @@
-import { i as e, n as t, r as n, t as r } from "./date-field-Hr-OCU-H.js";
+import { i as e, n as t, r as n, t as r } from "./date-field-BxEpqAPg.js";
 export { t as DATE_FIELD_YEAR_PIVOT, r as DateField, n as DateFieldDefaultsProvider, e as useDateFieldDefaults };

package/dist/date-picker-DRk9SZp1.js

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

package/dist/date-picker.js

@@ -1,2 +1,2 @@
-import { n as e, r as t, t as n } from "./date-picker-D3-y2Jxw.js";
+import { n as e, r as t, t as n } from "./date-picker-DRk9SZp1.js";
 export { n as DatePicker, e as DatePickerDefaultsProvider, t as useDatePickerDefaults };