@box-kite/react 2.2.5 → 2.2.7

package/components/datePicker.mjs

@@ -0,0 +1,529 @@
+"use client";
+import { f as e } from "../react-shared.mjs";
+import t from "../box.mjs";
+import { a as n, i as r, t as i } from "../behavior.mjs";
+import { t as a } from "../placement.mjs";
+import { n as o, t as s } from "../dates.mjs";
+import { A as c, N as l, O as u, i as d, r as f, x as p } from "../date-math.mjs";
+import { l as m, s as h } from "../date-input.mjs";
+import { Path as g, Svg as _ } from "./svg.mjs";
+import { n as v } from "../date-environment.mjs";
+import ee from "./calendar.mjs";
+import { t as y } from "../layer.mjs";
+import b from "./overlay.mjs";
+import x from "./dateField.mjs";
+import { useCallback as S, useEffect as C, useMemo as w, useState as T } from "react";
+import { Fragment as E, jsx as D, jsxs as O } from "react/jsx-runtime";
+//#region src/components/datePicker.tsx
+function te() {
+	return /* @__PURE__ */ D(_, {
+		viewBox: "0 0 16 16",
+		width: "1rem",
+		height: "1rem",
+		props: { fill: "none" },
+		children: /* @__PURE__ */ D(g, {
+			d: "M3 3.5h10a1 1 0 0 1 1 1V13a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V4.5a1 1 0 0 1 1-1ZM2 7h12M5.5 2v3M10.5 2v3",
+			stroke: "currentColor",
+			strokeWidth: 1.5,
+			strokeLinecap: "round"
+		})
+	});
+}
+function ne() {
+	return /* @__PURE__ */ D(_, {
+		viewBox: "0 0 16 16",
+		width: "1rem",
+		height: "1rem",
+		props: { fill: "none" },
+		children: /* @__PURE__ */ D(g, {
+			d: "M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12ZM8 5v3l2 1.5",
+			stroke: "currentColor",
+			strokeWidth: 1.5,
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function re() {
+	return /* @__PURE__ */ D(_, {
+		viewBox: "0 0 16 16",
+		width: "0.875rem",
+		height: "0.875rem",
+		props: { fill: "none" },
+		children: /* @__PURE__ */ D(g, {
+			d: "m4.5 4.5 7 7m0-7-7 7",
+			stroke: "currentColor",
+			strokeWidth: 1.5,
+			strokeLinecap: "round"
+		})
+	});
+}
+function k(e, t) {
+	typeof e == "function" ? e(t) : e && (e.current = t);
+}
+function ie(e) {
+	let [r, i] = T(null), o = e.ref, s = S((e) => {
+		i(e), k(o, e);
+	}, [o]), c = (e) => {
+		if (!e || e.contains(document.activeElement) && document.activeElement !== e) return;
+		let t = [
+			"[data-date][tabindex=\"0\"]",
+			"[role=\"option\"][tabindex=\"0\"]",
+			"button:not([disabled])"
+		].map((t) => e.querySelector(t)).find(Boolean), n = e.querySelector("[role=\"listbox\"]"), r = n?.querySelector("[role=\"option\"][tabindex=\"0\"]");
+		n && r && (n.scrollTop = r.offsetTop - n.clientHeight / 2 + r.offsetHeight / 2), (t ?? e).focus({ preventScroll: !0 });
+	}, l = n((e) => c(e)), { platform: u, isOpen: d, id: f, setPanel: p, setOpen: m, trigger: h, triggerElement: g, panelElement: _ } = y({
+		haspopup: "dialog",
+		idPrefix: "date-picker",
+		open: e.open,
+		defaultOpen: e.defaultOpen,
+		onOpenChange: e.onOpenChange,
+		onOpened: l,
+		onClosing: (e, t) => {
+			e && t?.focus();
+		}
+	}), v = a({
+		side: e.side,
+		align: e.align,
+		offset: 1,
+		flip: !0,
+		anchor: r
+	});
+	return C(() => {
+		d && c(_);
+	}, [d, _]), {
+		attachTrigger: h.ref,
+		triggerAttributes: h.props,
+		closeOnChoice: (e) => {
+			g?.focus(), m(!1, {
+				reason: "select",
+				event: e
+			});
+		},
+		id: f,
+		attachField: s,
+		panel: (n) => {
+			let i = {
+				role: "dialog",
+				"aria-label": e.label,
+				tabIndex: -1
+			};
+			return u ? /* @__PURE__ */ D(t, {
+				ref: p,
+				component: "popover",
+				variant: { topLayer: !0 },
+				p: 3,
+				...v.layerProps,
+				id: f,
+				props: {
+					popover: "auto",
+					...i
+				},
+				children: d ? n : null
+			}) : d && /* @__PURE__ */ D(b, {
+				contentRef: p,
+				anchor: r,
+				side: e.side,
+				align: e.align,
+				offset: 1,
+				component: "popover",
+				p: 3,
+				id: f,
+				props: i,
+				children: n
+			});
+		}
+	};
+}
+function ae(e) {
+	let { value: n, step: r, locale: a, hourCycle: o, onSelect: c, label: l } = e, u = w(() => m(r), [r]), d = h(n, r), f = Math.max(0, d ? u.indexOf(d) : u.indexOf("09:00:00")), p = i({
+		count: u.length,
+		defaultActiveIndex: f,
+		loop: !1,
+		onSelect: (e, t) => c(u[e], t)
+	});
+	return /* @__PURE__ */ D(t, {
+		component: "datePicker.times",
+		position: "relative",
+		display: "flex",
+		d: "column",
+		gap: .5,
+		maxHeight: 72,
+		overflowY: "auto",
+		ps: 2,
+		bs: 1,
+		props: {
+			role: "listbox",
+			"aria-label": l,
+			onKeyDown: p.onKeyDown
+		},
+		children: u.map((e, n) => /* @__PURE__ */ D(t, {
+			component: "datePicker.time",
+			variant: { selected: e === d },
+			px: 3,
+			py: 1.5,
+			borderRadius: 2,
+			fontSize: 14,
+			textAlign: "start",
+			whiteSpace: "nowrap",
+			css: { fontVariantNumeric: "tabular-nums" },
+			props: {
+				role: "option",
+				"aria-selected": e === d,
+				...p.itemProps(n),
+				onClick: (t) => c(e, t)
+			},
+			children: s(e, {
+				locale: a,
+				hour: "numeric",
+				minute: "2-digit",
+				hourCycle: o === void 0 ? void 0 : o === 12 ? "h12" : "h23"
+			})
+		}, e))
+	});
+}
+function oe(e) {
+	return /* @__PURE__ */ D(t, {
+		component: "datePicker.presets",
+		display: "flex",
+		d: "column",
+		gap: .5,
+		pe: 2,
+		be: 1,
+		props: { role: "group" },
+		children: e.presets.map((n) => /* @__PURE__ */ D(t, {
+			tag: "button",
+			component: "datePicker.preset",
+			variant: { selected: e.isSelected(n.value) },
+			px: 3,
+			py: 1.5,
+			borderRadius: 2,
+			fontSize: 14,
+			textAlign: "start",
+			whiteSpace: "nowrap",
+			props: {
+				type: "button",
+				onClick: (t) => e.onSelect(n.value, t)
+			},
+			children: n.label
+		}, n.label))
+	});
+}
+function A(e, n) {
+	let { type: i = "date", value: a, defaultValue: o = null, onValueChange: m, zone: h, locale: g, hourCycle: _, granularity: y, disambiguation: b, min: S, max: C, isDateUnavailable: w, disabled: T = !1, readOnly: k = !1, required: A, invalid: j, name: M, label: N, labelledBy: se, describedBy: ce, open: le, defaultOpen: ue, onOpenChange: P, closeOnSelect: F = !0, firstDayOfWeek: I, weekNumbers: L, side: de = "bottom", align: R = "start", clearable: fe = !1, triggerLabel: z, clearLabel: pe = "Clear", tabIndex: B, step: V = 30, defaultTime: H = "00:00", presets: U, showZone: me, ...he } = e, W = v({
+		locale: g,
+		zone: h === "none" ? void 0 : h
+	}), { locale: G } = W, K = i === "datetime" && h !== "none" ? W.zone : null, q = K ?? W.zone, [J, Y] = r({
+		value: a,
+		defaultValue: o,
+		onChange: (e, t) => m?.(e, {
+			...t,
+			...p(e, q)
+		})
+	}), X = z ?? (i === "time" ? "Choose time" : "Choose date"), Z = typeof N == "string" ? N : X, { attachTrigger: Q, triggerAttributes: ge, closeOnChoice: _e, attachField: ve, panel: ye } = ie({
+		ref: n,
+		open: le,
+		defaultOpen: ue,
+		onOpenChange: P,
+		side: de,
+		align: R,
+		label: Z
+	}), be = J && i !== "time" ? u(J, { zone: q }) : null, xe = J && i !== "date" ? c(J, { zone: q }) : null, Se = J ? s(J, {
+		locale: G,
+		zone: q,
+		...i === "date" ? { dateStyle: "medium" } : i === "time" ? { timeStyle: "short" } : {
+			dateStyle: "medium",
+			timeStyle: "short"
+		}
+	}) : "", $ = _e, Ce = (e, t) => f(e, t, K ? {
+		zone: K,
+		disambiguation: b
+	} : {}), we = (e, t) => {
+		e && (i === "date" ? (Y(e, {
+			reason: "select",
+			event: t
+		}), F && $(t)) : Y(Ce(e, xe ?? H), {
+			reason: "select",
+			event: t
+		}));
+	}, Te = (e, t) => {
+		Y(i === "time" ? e : Ce(be ?? l(q), e), {
+			reason: "select",
+			event: t
+		}), F && $(t);
+	}, Ee = /* @__PURE__ */ D(t, {
+		tag: "button",
+		ref: Q,
+		component: "datePicker.trigger",
+		display: "inline-flex",
+		ai: "center",
+		jc: "center",
+		width: 7,
+		height: 7,
+		ms: 2,
+		me: -1.5,
+		borderRadius: 1.5,
+		disabled: T || k,
+		props: {
+			type: "button",
+			"aria-label": Se ? `${X}, ${Se}` : X,
+			tabIndex: B,
+			...ge
+		},
+		children: D(i === "time" ? ne : te, {})
+	}), De = fe && J && !T && !k && /* @__PURE__ */ D(t, {
+		tag: "button",
+		component: "datePicker.clear",
+		display: "inline-flex",
+		ai: "center",
+		jc: "center",
+		width: 6,
+		height: 6,
+		ms: 1,
+		borderRadius: 999,
+		props: {
+			type: "button",
+			"aria-label": pe,
+			tabIndex: B,
+			onClick: (e) => Y(null, {
+				reason: "clear",
+				event: e
+			})
+		},
+		children: /* @__PURE__ */ D(re, {})
+	});
+	return /* @__PURE__ */ O(E, { children: [/* @__PURE__ */ D(x, {
+		ref: ve,
+		...he,
+		type: i,
+		value: J,
+		onValueChange: (e, t) => Y(e, {
+			reason: t.reason,
+			event: t.event
+		}),
+		zone: h,
+		locale: g,
+		hourCycle: _,
+		granularity: y,
+		disambiguation: b,
+		min: S,
+		max: C,
+		isDateUnavailable: w,
+		disabled: T,
+		readOnly: k,
+		required: A,
+		invalid: j,
+		name: M,
+		label: N,
+		labelledBy: se,
+		describedBy: ce,
+		showZone: me,
+		tabIndex: B,
+		end: /* @__PURE__ */ O(E, { children: [De, Ee] })
+	}), ye(/* @__PURE__ */ O(t, {
+		display: "flex",
+		gap: 3,
+		ai: "stretch",
+		children: [
+			U && U.length > 0 && /* @__PURE__ */ D(oe, {
+				presets: U,
+				isSelected: (e) => J !== null && d(e, J, { zone: q }) === 0,
+				onSelect: (e, t) => {
+					Y(e, {
+						reason: "preset",
+						event: t
+					}), F && $(t);
+				}
+			}),
+			i !== "time" && /* @__PURE__ */ D(ee, {
+				value: be,
+				onValueChange: (e, t) => we(e, t.event),
+				min: S ? u(S, { zone: q }) : void 0,
+				max: C ? u(C, { zone: q }) : void 0,
+				isDateUnavailable: w,
+				locale: g,
+				zone: h === "none" ? void 0 : h,
+				firstDayOfWeek: I,
+				weekNumbers: L
+			}),
+			i !== "date" && /* @__PURE__ */ D(ae, {
+				value: xe,
+				step: V,
+				locale: G,
+				hourCycle: _,
+				label: i === "time" ? Z : "Time",
+				onSelect: Te
+			})
+		]
+	}))] });
+}
+function j(e, n) {
+	let { value: i, defaultValue: a = null, onValueChange: s, locale: c, min: l, max: u, isDateUnavailable: f, disabled: p = !1, readOnly: m = !1, required: h, invalid: g, startName: _, endName: y, label: b, labelledBy: S, describedBy: C, startLabel: w = "Start date", endLabel: ne = "End date", open: k, defaultOpen: ae, onOpenChange: A, closeOnSelect: j = !0, firstDayOfWeek: M, weekNumbers: N, months: se = 2, side: ce = "bottom", align: le = "start", clearable: ue = !1, triggerLabel: P = "Choose dates", clearLabel: F = "Clear", tabIndex: I, presets: L, props: de, ...R } = e, { locale: fe } = v({ locale: c }), [z, pe] = r({
+		value: i,
+		defaultValue: a,
+		onChange: s
+	}), [B, V] = T({
+		start: z?.start ?? null,
+		end: z?.end ?? null,
+		source: z
+	}), { start: H, end: U } = B;
+	B.source !== z && (H = z?.start ?? null, U = z?.end ?? null, V({
+		start: H,
+		end: U,
+		source: z
+	}));
+	let { attachTrigger: me, triggerAttributes: he, closeOnChoice: W, id: G, attachField: K, panel: q } = ie({
+		ref: n,
+		open: k,
+		defaultOpen: ae,
+		onOpenChange: A,
+		side: ce,
+		align: le,
+		label: typeof b == "string" ? b : P
+	}), J = z ? o(z.start, z.end, { locale: fe }) : "", Y = H !== null && U !== null && d(H, U) > 0, X = (e, t, n, r) => {
+		let i = e && t && d(e, t) <= 0 ? {
+			start: e,
+			end: t
+		} : null;
+		V({
+			start: e,
+			end: t,
+			source: i
+		}), pe(i, {
+			reason: n,
+			event: r
+		});
+	}, Z = W, Q = {
+		locale: c,
+		min: l,
+		max: u,
+		isDateUnavailable: f,
+		disabled: p,
+		readOnly: m,
+		required: h,
+		component: "datePicker.part",
+		px: 0,
+		py: 0,
+		tabIndex: I
+	};
+	return /* @__PURE__ */ O(E, { children: [
+		b !== void 0 && /* @__PURE__ */ D(t, {
+			component: "dateField.label",
+			display: "block",
+			mb: 1.5,
+			fontSize: 14,
+			id: `${G}-label`,
+			children: b
+		}),
+		/* @__PURE__ */ O(t, {
+			ref: K,
+			component: "dateField",
+			display: "inline-flex",
+			ai: "center",
+			gap: 2,
+			px: 3,
+			py: 2,
+			...R,
+			variant: [R.variant, {
+				disabled: p,
+				invalid: g ?? Y
+			}],
+			props: {
+				role: "group",
+				"aria-labelledby": [b === void 0 ? void 0 : `${G}-label`, S].filter(Boolean).join(" ") || void 0,
+				"aria-invalid": (g ?? Y) || void 0,
+				"aria-describedby": C,
+				...de
+			},
+			children: [
+				/* @__PURE__ */ D(x, {
+					...Q,
+					value: H,
+					onValueChange: (e, t) => X(e, U, t.reason, t.event),
+					name: _,
+					props: { "aria-label": w },
+					invalid: g ?? Y
+				}),
+				/* @__PURE__ */ D(t, {
+					component: "dateField.literal",
+					props: { "aria-hidden": !0 },
+					children: "–"
+				}),
+				/* @__PURE__ */ D(x, {
+					...Q,
+					value: U,
+					onValueChange: (e, t) => X(H, e, t.reason, t.event),
+					name: y,
+					props: { "aria-label": ne },
+					invalid: g ?? Y
+				}),
+				ue && z && !p && !m && /* @__PURE__ */ D(t, {
+					tag: "button",
+					component: "datePicker.clear",
+					display: "inline-flex",
+					ai: "center",
+					jc: "center",
+					width: 6,
+					height: 6,
+					borderRadius: 999,
+					props: {
+						type: "button",
+						"aria-label": F,
+						tabIndex: I,
+						onClick: (e) => X(null, null, "clear", e)
+					},
+					children: /* @__PURE__ */ D(re, {})
+				}),
+				/* @__PURE__ */ D(t, {
+					tag: "button",
+					ref: me,
+					component: "datePicker.trigger",
+					display: "inline-flex",
+					ai: "center",
+					jc: "center",
+					width: 7,
+					height: 7,
+					me: -1.5,
+					borderRadius: 1.5,
+					disabled: p || m,
+					props: {
+						type: "button",
+						"aria-label": J ? `${P}, ${J}` : P,
+						tabIndex: I,
+						...he
+					},
+					children: /* @__PURE__ */ D(te, {})
+				})
+			]
+		}),
+		q(/* @__PURE__ */ O(t, {
+			display: "flex",
+			gap: 3,
+			ai: "stretch",
+			children: [L && L.length > 0 && /* @__PURE__ */ D(oe, {
+				presets: L,
+				isSelected: (e) => z !== null && e.start === z.start && e.end === z.end,
+				onSelect: (e, t) => {
+					X(e.start, e.end, "preset", t), j && Z(t);
+				}
+			}), /* @__PURE__ */ D(ee, {
+				mode: "range",
+				months: se,
+				value: z,
+				defaultFocusedDate: H ?? void 0,
+				onValueChange: (e, t) => {
+					X(e?.start ?? null, e?.end ?? null, "select", t.event), j && e && t.event && Z(t.event);
+				},
+				min: l,
+				max: u,
+				isDateUnavailable: f,
+				locale: c,
+				firstDayOfWeek: M,
+				weekNumbers: N
+			})]
+		}))
+	] });
+}
+var M = e(A, "DatePicker"), N = e(j, "DateRangePicker");
+//#endregion
+export { N as DateRangePicker, M as default };

package/components/dateTime.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../box.cjs"),n=require("../dates.cjs"),r=require("../date-environment.cjs");function i(e,i){let{value:a,zone:o,locale:s,format:c,relative:l,props:u,...d}=e,f=r.n({locale:s,zone:o}),p=n.f(a),m=p&&n.E(p),h=m?l?n.r(m,{...l===!0?{}:l,locale:f.locale,zone:f.zone}):n.t(m,{...c,locale:f.locale,zone:f.zone}):``;return t.useBoxElement({tag:`time`,display:`inline`,...d,props:{dateTime:m??void 0,suppressHydrationWarning:l?!0:void 0,...u},children:h},i)}var a=e.f(i,`DateTime`);exports.DateProvider=r.t,exports.default=a;

package/components/dateTime.d.ts

@@ -0,0 +1,23 @@
+import { RefAttributes } from 'react';
+import { BoxProps } from '../box';
+import { DateProvider, DateProviderProps } from '../react/date/dateEnvironment';
+import { ComponentsAndVariants } from '@box-kite/core/types';
+import { FormatOptions, RelativeOptions } from '../utils/date/format';
+import { ZoneInput } from '../utils/date/zones';
+export { DateProvider };
+export type { DateProviderProps };
+type DateTimeBoxProps<TKey extends keyof ComponentsAndVariants> = Omit<BoxProps<'time', TKey>, 'tag' | 'children'>;
+export interface DateTimeProps<TKey extends keyof ComponentsAndVariants = never> extends DateTimeBoxProps<TKey> {
+    /** What to show: any ISO string, a `Date` or epoch milliseconds. Nothing is rendered for a non-value. */
+    value: string | number | Date | null | undefined;
+    /** Whose wall clock an instant is shown on. Default `'local'`, the reader's. A date or a time has no zone. */
+    zone?: ZoneInput;
+    /** The reader's language. Default the reader's own. */
+    locale?: string;
+    /** How to write it — `{ dateStyle: 'long' }`, `{ month: 'short', day: 'numeric' }`. Default by kind. */
+    format?: Omit<FormatOptions, 'locale' | 'zone'>;
+    /** `3 minutes ago`, `tomorrow` instead of the date. An object passes `now`, `numeric` and `style`. */
+    relative?: boolean | Omit<RelativeOptions, 'locale' | 'zone'>;
+}
+declare const _default: <TKey extends keyof ComponentsAndVariants = never>(props: DateTimeProps<TKey> & RefAttributes<HTMLTimeElement>) => React.ReactNode;
+export default _default;

package/components/dateTime.mjs

@@ -0,0 +1,34 @@
+"use client";
+import { f as e } from "../react-shared.mjs";
+import { useBoxElement as t } from "../box.mjs";
+import { E as n, f as r, r as i, t as a } from "../dates.mjs";
+import { n as o, t as s } from "../date-environment.mjs";
+//#region src/components/dateTime.tsx
+function c(e, s) {
+	let { value: c, zone: l, locale: u, format: d, relative: f, props: p, ...m } = e, h = o({
+		locale: u,
+		zone: l
+	}), g = r(c), _ = g && n(g), v = _ ? f ? i(_, {
+		...f === !0 ? {} : f,
+		locale: h.locale,
+		zone: h.zone
+	}) : a(_, {
+		...d,
+		locale: h.locale,
+		zone: h.zone
+	}) : "";
+	return t({
+		tag: "time",
+		display: "inline",
+		...m,
+		props: {
+			dateTime: _ ?? void 0,
+			suppressHydrationWarning: f ? !0 : void 0,
+			...p
+		},
+		children: v
+	}, s);
+}
+var l = e(c, "DateTime");
+//#endregion
+export { s as DateProvider, l as default };

package/components/dialog.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../client.cjs"),t=require("../platform.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../behavior.cjs"),a=require("../identity.cjs"),o=require("./semantics.cjs");let s=require("react"),c=require("react/jsx-runtime");var l=(0,s.createContext)(null);function u(e){let t=(0,s.useContext)(l);if(!t)throw Error(`<${e}> must be rendered inside a <Dialog>.`);return t}function d(e){return(0,c.jsx)(p,{role:`dialog`,...e})}function f(e){return(0,c.jsx)(p,{role:`alertdialog`,...e,modal:!0,dismissible:!1})}function p(o){let{role:u,trigger:d,children:f,open:p,defaultOpen:h=!1,onOpenChange:g,label:_,labelledBy:v,describedBy:y,modal:b=!0,dismissible:x=!0,lockScroll:S=b,initialFocus:C,props:w,...T}=o,E=a.t(`dialog`),D=T.id??E,[O,k]=i.i({value:p,defaultValue:h,onChange:g}),[A,j]=(0,s.useState)(null),[M,N]=(0,s.useState)(null),[P,F]=(0,s.useState)(!1),[I,L]=(0,s.useState)({title:0,description:0}),R=e.t(O&&S);i.n({enabled:O,returnTo:M});let z=(0,s.useCallback)(e=>(L(t=>({...t,[e]:t[e]+1})),()=>L(t=>({...t,[e]:t[e]-1}))),[]),B=(0,s.useMemo)(()=>({titleId:`${D}-title`,descriptionId:`${D}-description`,register:z}),[D,z]);m({dialog:A,isOpen:O,domOpen:P,setDomOpen:F,setOpen:k,modal:b,dismissible:x,triggerElement:M}),n.n(()=>{let e=t.l(C);!O||!e||e.focus()},[O,C]);let V=i.a(e=>{k(e=>!e,{reason:`trigger`,event:e})}),H=(0,s.useMemo)(()=>({ref:N,props:{"aria-expanded":O,"aria-haspopup":`dialog`,"aria-controls":O?D:void 0,onClick:V}}),[D,V,O]),U=T;return(0,c.jsxs)(c.Fragment,{children:[R,d?.(H),(0,c.jsx)(l.Provider,{value:B,children:(0,c.jsx)(r.default,{ref:j,tag:`dialog`,component:`dialog`,...U,id:D,props:{role:u,"aria-label":I.title||v?void 0:_,"aria-labelledby":v??(I.title?B.titleId:void 0),"aria-describedby":y??(I.description?B.descriptionId:void 0),...w},children:f})})]})}function m(e){let{dialog:r,isOpen:a,domOpen:o,setDomOpen:c,setOpen:l,modal:u,dismissible:d,triggerElement:f}=e,p=(0,s.useRef)(`imperative`),m=t.a(),g=d?`any`:`closerequest`;n.n(()=>{!r||a===o||(c(a),a?u?r.showModal():r.show():r.close())},[r,a,o,u,c]),n.n(()=>{if(!r)return;let e=new AbortController;return r.addEventListener(`close`,e=>{c(!1),l(!1,{reason:p.current,event:e}),p.current=`imperative`},{signal:e.signal}),()=>e.abort()},[r,c,l]),n.n(()=>{if(!(!r||!m))return r.setAttribute(`closedby`,g),()=>r.removeAttribute(`closedby`)},[r,m,g]),n.n(()=>{if(!a||!r)return;let e=new AbortController,n=(t,n)=>document.addEventListener(t,n,{signal:e.signal,capture:!0});return n(`keydown`,e=>{e.key===`Escape`&&(p.current=`escape`)}),n(`pointerdown`,e=>{t.u(e,[f])?p.current=`trigger`:!t.u(e,[r])||h(r,e)?p.current=`outside-pointer`:p.current=`imperative`}),()=>e.abort()},[a,r,f]),i.r({enabled:a&&!u&&!m,inside:[r],escapeKey:!0,outsidePointer:!1,onDismiss:(e,t)=>l(!1,{reason:`escape`,event:t})}),n.n(()=>{if(!r||!a||!d||m)return;let e=new AbortController;return document.addEventListener(`pointerdown`,e=>{t.u(e,[f])||t.u(e,[r])&&!h(r,e)||l(!1,{reason:`outside-pointer`,event:e})},{signal:e.signal,capture:!0}),()=>e.abort()},[r,a,d,m,f,l])}function h(e,t){let n=e.getBoundingClientRect();return t.clientX<n.left||t.clientX>n.right||t.clientY<n.top||t.clientY>n.bottom}function g(e){let t=u(`Dialog.Title`);return n.n(()=>t.register(`title`),[t]),(0,c.jsx)(o.H2,{id:t.titleId,component:`dialog.title`,...e})}function _(e){let t=u(`Dialog.Description`);return n.n(()=>t.register(`description`),[t]),(0,c.jsx)(o.P,{id:t.descriptionId,component:`dialog.description`,...e})}g.displayName=`Dialog.Title`,_.displayName=`Dialog.Description`;var v={Title:g,Description:_},y=Object.assign(d,v),b=Object.assign(f,v);d.displayName=`Dialog`,f.displayName=`AlertDialog`,exports.AlertDialog=b,exports.default=y;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../client.cjs"),t=require("../platform.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../behavior.cjs"),a=require("../identity.cjs"),o=require("./semantics.cjs");let s=require("react"),c=require("react/jsx-runtime");var l=0;function u(r){let{classNames:i,styleElements:a}=e.i({overflow:`hidden`},!1),o=i.slice(1).join(` `);return n.n(()=>{let e=t.n();if(!(!r||!e||!o))return l+=1,e.classList.add(o),()=>{--l,l===0&&e.classList.remove(o)}},[r,o]),a}var d=(0,s.createContext)(null);function f(e){let t=(0,s.useContext)(d);if(!t)throw Error(`<${e}> must be rendered inside a <Dialog>.`);return t}function p(e){return(0,c.jsx)(h,{role:`dialog`,...e})}function m(e){return(0,c.jsx)(h,{role:`alertdialog`,...e,modal:!0,dismissible:!1})}function h(e){let{role:o,trigger:l,children:f,open:p,defaultOpen:m=!1,onOpenChange:h,label:_,labelledBy:v,describedBy:y,modal:b=!0,dismissible:x=!0,lockScroll:S=b,initialFocus:C,props:w,...T}=e,E=a.t(`dialog`),D=T.id??E,[O,k]=i.i({value:p,defaultValue:m,onChange:h}),[A,j]=(0,s.useState)(null),[M,N]=(0,s.useState)(null),[P,F]=(0,s.useState)(!1),[I,L]=(0,s.useState)({title:0,description:0}),R=u(O&&S);i.n({enabled:O,returnTo:M});let z=(0,s.useCallback)(e=>(L(t=>({...t,[e]:t[e]+1})),()=>L(t=>({...t,[e]:t[e]-1}))),[]),B=(0,s.useMemo)(()=>({titleId:`${D}-title`,descriptionId:`${D}-description`,register:z}),[D,z]);g({dialog:A,isOpen:O,domOpen:P,setDomOpen:F,setOpen:k,modal:b,dismissible:x,triggerElement:M}),n.n(()=>{let e=t.l(C);!O||!e||e.focus()},[O,C]);let V=i.a(e=>{k(e=>!e,{reason:`trigger`,event:e})}),H=(0,s.useMemo)(()=>({ref:N,props:{"aria-expanded":O,"aria-haspopup":`dialog`,"aria-controls":O?D:void 0,onClick:V}}),[D,V,O]),U=T;return(0,c.jsxs)(c.Fragment,{children:[R,l?.(H),(0,c.jsx)(d.Provider,{value:B,children:(0,c.jsx)(r.default,{ref:j,tag:`dialog`,component:`dialog`,...U,id:D,props:{role:o,"aria-label":I.title||v?void 0:_,"aria-labelledby":v??(I.title?B.titleId:void 0),"aria-describedby":y??(I.description?B.descriptionId:void 0),...w},children:f})})]})}function g(e){let{dialog:r,isOpen:a,domOpen:o,setDomOpen:c,setOpen:l,modal:u,dismissible:d,triggerElement:f}=e,p=(0,s.useRef)(`imperative`),m=t.a(),h=d?`any`:`closerequest`;n.n(()=>{!r||a===o||(c(a),a?u?r.showModal():r.show():r.close())},[r,a,o,u,c]),n.n(()=>{if(!r)return;let e=new AbortController;return r.addEventListener(`close`,e=>{c(!1),l(!1,{reason:p.current,event:e}),p.current=`imperative`},{signal:e.signal}),()=>e.abort()},[r,c,l]),n.n(()=>{if(!(!r||!m))return r.setAttribute(`closedby`,h),()=>r.removeAttribute(`closedby`)},[r,m,h]),n.n(()=>{if(!a||!r)return;let e=new AbortController,n=(t,n)=>document.addEventListener(t,n,{signal:e.signal,capture:!0});return n(`keydown`,e=>{e.key===`Escape`&&(p.current=`escape`)}),n(`pointerdown`,e=>{t.u(e,[f])?p.current=`trigger`:!t.u(e,[r])||_(r,e)?p.current=`outside-pointer`:p.current=`imperative`}),()=>e.abort()},[a,r,f]),i.r({enabled:a&&!u&&!m,inside:[r],escapeKey:!0,outsidePointer:!1,onDismiss:(e,t)=>l(!1,{reason:`escape`,event:t})}),n.n(()=>{if(!r||!a||!d||m)return;let e=new AbortController;return document.addEventListener(`pointerdown`,e=>{t.u(e,[f])||t.u(e,[r])&&!_(r,e)||l(!1,{reason:`outside-pointer`,event:e})},{signal:e.signal,capture:!0}),()=>e.abort()},[r,a,d,m,f,l])}function _(e,t){let n=e.getBoundingClientRect();return t.clientX<n.left||t.clientX>n.right||t.clientY<n.top||t.clientY>n.bottom}function v(e){let t=f(`Dialog.Title`);return n.n(()=>t.register(`title`),[t]),(0,c.jsx)(o.H2,{id:t.titleId,component:`dialog.title`,...e})}function y(e){let t=f(`Dialog.Description`);return n.n(()=>t.register(`description`),[t]),(0,c.jsx)(o.P,{id:t.descriptionId,component:`dialog.description`,...e})}v.displayName=`Dialog.Title`,y.displayName=`Dialog.Description`;var b={Title:v,Description:y},x=Object.assign(p,b),S=Object.assign(m,b);p.displayName=`Dialog`,m.displayName=`AlertDialog`,exports.AlertDialog=S,exports.default=x;