@jfrader/ui 0.5.0 → 0.6.0

package/dist/comment-thread.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as CommentThread } from "./comment-thread-BnUHxviq.js";

package/dist/{container-BOaSptJa.js → container-BxtwJSSD.js}

@@ -1,6 +1,7 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./layout-style-Cbd1Vilw.js";
+import { i as e } from "./css-BYJhdGh-.js";
+import { t } from "./sx-BJXJ2xJK.js";
+import { n } from "./layout-style-BE0gSqrH.js";
 import { jsx as r } from "@emotion/react/jsx-runtime";
 //#region src/components/container/container.tsx
 var i = {

package/dist/container.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Container } from "./container-BOaSptJa.js";
+export { t as Container } from "./container-BxtwJSSD.js";

package/dist/context-menu-I4i0LRpm.js

@@ -0,0 +1,371 @@
+'use client';
+import { a as e, i as t } from "./css-BYJhdGh-.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
+import { t as a } from "./use-latest-callback-cj1OOQL6.js";
+import { t as o } from "./use-controlled-state-DpeVQZNR.js";
+import { t as s } from "./renderable-DzcIj1Lo.js";
+import { t as c } from "./icon-wrapper-C-zMD0uL.js";
+import { t as l } from "./trigger-style-CtOrdPk4.js";
+import { s as u } from "./listbox-style-DNOxAulu.js";
+import { a as d, c as f, d as p, f as m, i as h, m as g, o as _, r as v, u as y } from "./menu-CVzpsyXn.js";
+import { createContext as b, useCallback as x, useContext as S, useEffect as C, useId as w, useLayoutEffect as T, useMemo as ee, useRef as E, useState as D } from "react";
+import { vars as O } from "@jfrader/tokens/vars";
+import { Fragment as te, jsx as k, jsxs as A } from "@emotion/react/jsx-runtime";
+import { useMergeRefs as j } from "@floating-ui/react";
+import { isEventTargetWithin as ne } from "@floating-ui/react/utils";
+//#region src/components/context-menu/context-menu.tsx
+var M = "ContextMenu", N = "13rem", P = "300px", re = 4, F = "--context-menu-origin", I = "--context-menu-available-inline", L = "--context-menu-available-block", R = b(null);
+function z(e) {
+	let t = S(R);
+	if (!t) throw Error(`${M}.${e} must be rendered inside <${M}>.`);
+	return t;
+}
+var B = (e) => {
+	let { x: t, y: n, width: r, height: i } = e.getBoundingClientRect();
+	return {
+		x: t,
+		y: n,
+		width: r,
+		height: i
+	};
+}, V = (e) => getComputedStyle(e).direction === "rtl", H = (e) => {
+	let t = B(e);
+	return {
+		...t,
+		x: V(e) ? t.x + t.width : t.x,
+		width: 0
+	};
+}, U = (e, t) => ({
+	x: e,
+	y: t,
+	width: 0,
+	height: 0
+}), ie = (e) => e.nativeEvent.pointerType === "" || e.clientX === 0 && e.clientY === 0, ae = (e) => e.key === "ContextMenu" || e.key === "F10" && e.shiftKey, oe = (e) => e.key === "Enter" || e.key === " ", se = (e) => Object.fromEntries(Object.entries(e).filter(([e]) => e.startsWith("aria-"))), ce = e({
+	from: {
+		opacity: 0,
+		scale: "0.98"
+	},
+	to: {
+		opacity: 1,
+		scale: "1"
+	}
+}), le = t({
+	label: "context-menu-target",
+	"&:focus-visible": {
+		outline: `2px solid ${O.color.focusRing}`,
+		outlineOffset: "2px"
+	}
+}), ue = t({
+	label: "context-menu",
+	borderColor: O.color.borderControl,
+	inlineSize: N,
+	minInlineSize: 0,
+	maxInlineSize: `var(${I}, ${N})`,
+	maxBlockSize: `min(${P}, var(${L}, ${P}))`,
+	overflowY: "auto",
+	overscrollBehavior: "contain",
+	fontSize: O.textSize.sm,
+	transformOrigin: `var(${F}, top left)`,
+	animation: `${ce} ${O.motion.duration.base} ${O.motion.easeStandard}`,
+	"&:focus-visible": {
+		outline: `2px solid ${O.color.focusRing}`,
+		outlineOffset: "2px"
+	},
+	[r]: { animation: "none" },
+	[n]: { borderColor: "ButtonText" }
+}), W = t({
+	gap: O.space[2],
+	lineHeight: O.lineHeight.base,
+	[n]: { "&[data-active]": {
+		outline: "2px solid Highlight",
+		outlineOffset: "-2px"
+	} }
+}), de = t({
+	flex: 1,
+	minInlineSize: 0,
+	overflowWrap: "anywhere"
+}), fe = t({
+	boxSizing: "border-box",
+	display: "inline-flex",
+	alignItems: "center",
+	justifyContent: "center",
+	flexShrink: 0,
+	inlineSize: "1rem",
+	blockSize: "1rem",
+	border: `1px solid ${O.color.borderControl}`,
+	borderRadius: O.radius.sm,
+	"& svg": {
+		inlineSize: "0.75rem",
+		blockSize: "0.75rem",
+		visibility: "hidden"
+	},
+	"&[data-state=\"checked\"] svg": { visibility: "visible" },
+	[n]: { borderColor: "ButtonText" }
+}), pe = /* @__PURE__ */ k("svg", {
+	viewBox: "0 0 16 16",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: "2",
+	strokeLinecap: "round",
+	strokeLinejoin: "round",
+	children: /* @__PURE__ */ k("path", { d: "M3.5 8.5l3 3 6-7" })
+});
+function me({ available: e, children: t }) {
+	let { open: n, refs: r, requestOpen: i, requestClose: o } = g(M, "Root"), s = E(null), c = E(null), l = E(!1), [u, d] = D(null), [f, p] = D(), [m, h] = D(), _ = a(() => o(!1)), v = x((e, t) => {
+		r.setReference(e), r.setPositionReference({
+			getBoundingClientRect: () => DOMRect.fromRect(t),
+			contextElement: e
+		}), d(t), l.current = !0, queueMicrotask(() => l.current = !1);
+	}, [r]);
+	T(() => {
+		if (!n) return;
+		let e = s.current;
+		e && (p(V(e) ? "rtl" : "ltr"), l.current || v(e, H(e)));
+	}, [n, v]), C(() => {
+		let e = r.domReference.current;
+		if (!n || !e) return;
+		let t = e.ownerDocument, i = t.defaultView, a = !1, o = (e) => {
+			a || e.type === "scroll" && ne(e, r.floating.current) || (a = !0, _());
+		};
+		return t.addEventListener("scroll", o, {
+			capture: !0,
+			passive: !0
+		}), i?.addEventListener("resize", o), () => {
+			t.removeEventListener("scroll", o, { capture: !0 }), i?.removeEventListener("resize", o);
+		};
+	}, [
+		n,
+		r,
+		_
+	]);
+	let y = ee(() => ({
+		targetRef: s,
+		triggerRef: c,
+		anchorTo: v,
+		invoke: (e, t) => {
+			v(e, t), i();
+		},
+		anchor: u,
+		available: e,
+		direction: f,
+		targetLabel: m,
+		setTargetLabel: h
+	}), [
+		v,
+		i,
+		u,
+		e,
+		f,
+		m
+	]);
+	return /* @__PURE__ */ k(R.Provider, {
+		value: y,
+		children: t
+	});
+}
+function G({ open: e, defaultOpen: t = !1, onOpenChange: n, children: r }) {
+	let [i, a] = D();
+	return /* @__PURE__ */ k(h, {
+		open: e,
+		defaultOpen: t,
+		onOpenChange: n,
+		placement: "bottom-start",
+		positioning: {
+			strategy: "fixed",
+			gap: re,
+			transform: !1,
+			onAvailableSize: (e) => a((t) => t?.width === e.width && t.height === e.height ? t : e)
+		},
+		children: /* @__PURE__ */ k(me, {
+			available: i,
+			children: r
+		})
+	});
+}
+G.displayName = "ContextMenu";
+function K({ ref: e, id: t, openOnClick: n = !1, disabled: r = !1, "aria-labelledby": a, className: o, sx: s, ...c }) {
+	let l = z("Target"), { open: u, refs: d, requestClose: p, getReferenceProps: m } = g(M, "Target"), h = w(), _ = t ?? h, v = j([l.targetRef, e]), { setTargetLabel: y, triggerRef: b } = l;
+	T(() => (y(a ?? _), () => y(void 0)), [
+		a,
+		_,
+		y
+	]);
+	let x = (e) => b.current?.contains(e.target) ?? !1, S = r ? {} : {
+		...se(m()),
+		onContextMenu: (e) => {
+			e.preventDefault();
+			let t = e.currentTarget;
+			l.invoke(t, ie(e) ? H(t) : U(e.clientX, e.clientY));
+		},
+		onKeyDown: (e) => {
+			let t = n && oe(e) && e.target === e.currentTarget;
+			(ae(e) || t) && (e.preventDefault(), l.invoke(e.currentTarget, H(e.currentTarget)));
+		},
+		onMouseDown: (e) => {
+			u && e.button === 2 && e.preventDefault();
+		},
+		onPointerDown: (e) => {
+			!u || n || e.button !== 0 || e.ctrlKey || d.domReference.current !== e.currentTarget || x(e) || p(!1);
+		},
+		onClick: n ? (e) => {
+			e.detail === 0 || x(e) || l.invoke(e.currentTarget, U(e.clientX, e.clientY));
+		} : void 0
+	};
+	return /* @__PURE__ */ k(i, {
+		className: o,
+		styles: le,
+		sx: s,
+		children: (e) => /* @__PURE__ */ k("div", {
+			role: "group",
+			tabIndex: 0,
+			...f(c, (e) => ({
+				...e,
+				...S
+			})),
+			ref: v,
+			id: _,
+			"aria-labelledby": a,
+			"data-ui": "context-menu-target",
+			"data-disabled": r || void 0,
+			className: e
+		})
+	});
+}
+K.displayName = "ContextMenu.Target";
+function q({ ref: e, id: t, className: n, sx: r, ...a }) {
+	let o = z("Trigger"), { open: s, getReferenceProps: c } = g(M, "Trigger"), u = w(), d = j([o.triggerRef, e]), p = (e) => (t) => {
+		s || o.anchorTo(t.currentTarget, B(t.currentTarget)), typeof e == "function" && e(t);
+	}, m = (e) => {
+		let t = c(e);
+		return {
+			...t,
+			onClick: p(t.onClick),
+			onKeyDown: p(t.onKeyDown)
+		};
+	};
+	return /* @__PURE__ */ k(i, {
+		className: n,
+		styles: l,
+		sx: r,
+		children: (e) => /* @__PURE__ */ k("button", {
+			type: "button",
+			...f(a, m),
+			ref: d,
+			id: t ?? u,
+			"data-ui": "context-menu-trigger",
+			className: e
+		})
+	});
+}
+q.displayName = "ContextMenu.Trigger";
+function J({ ref: e, style: t, dir: n, onKeyDown: r, ...i }) {
+	let { anchor: a, available: o, direction: s, targetLabel: c } = z("Content"), { floatingContext: l, refs: d } = g(M, "Content"), [f, p] = D(null), m = j([p, e]);
+	C(() => {
+		f && !f.querySelector("[role^=\"menuitem\"]:not([aria-disabled=\"true\"])") && f.focus({ preventScroll: !0 });
+	}, [f]);
+	let { x: h, y: _, placement: y } = l, b = n ?? s, x = a && `${(b === "rtl" ? a.x + a.width : a.x) - h}px ${(y.startsWith("top") ? a.y : a.y + a.height) - _}px`, S = {
+		[F]: x || void 0,
+		[I]: o ? `${o.width}px` : void 0,
+		[L]: o ? `${o.height}px` : void 0
+	};
+	return /* @__PURE__ */ k(v, {
+		...i,
+		ref: m,
+		dir: b,
+		style: {
+			...t,
+			...S
+		},
+		onKeyDown: (e) => {
+			r?.(e);
+			let t = d.domReference.current;
+			!e.defaultPrevented && e.key === "Tab" && e.shiftKey && t && (e.preventDefault(), t.focus());
+		},
+		defaultLabelledBy: c,
+		family: M,
+		marker: "context-menu",
+		styles: [u, ue]
+	});
+}
+J.displayName = "ContextMenu.Content";
+var Y = (e) => s(e) && e !== "";
+function X({ icon: e, children: t }) {
+	return /* @__PURE__ */ A(te, { children: [Y(e) && /* @__PURE__ */ k("span", {
+		css: c,
+		"aria-hidden": !0,
+		"data-ui": "context-menu-item-icon",
+		children: e
+	}), Y(t) && /* @__PURE__ */ k("span", {
+		css: de,
+		children: t
+	})] });
+}
+function Z({ tone: e = "neutral", icon: t, children: n, ...r }) {
+	return z("Item"), /* @__PURE__ */ k(d, {
+		...r,
+		part: "Item",
+		family: M,
+		marker: "context-menu-item",
+		styles: [
+			y,
+			W,
+			p[e]
+		],
+		children: /* @__PURE__ */ k(X, {
+			icon: t,
+			children: n
+		})
+	});
+}
+Z.displayName = "ContextMenu.Item";
+function Q({ value: e, defaultValue: t = !1, onValueChange: n, onSelect: r, closeOnSelect: i = !1, tone: a = "neutral", icon: s, children: c, ...l }) {
+	z("CheckboxItem");
+	let [u = !1, f] = o(e, t, n);
+	return /* @__PURE__ */ A(d, {
+		...l,
+		"aria-checked": u,
+		onSelect: () => {
+			f(!u), r?.();
+		},
+		itemRole: "menuitemcheckbox",
+		closeOnSelect: i,
+		part: "CheckboxItem",
+		family: M,
+		marker: "context-menu-checkbox-item",
+		styles: [
+			y,
+			W,
+			p[a]
+		],
+		children: [/* @__PURE__ */ k("span", {
+			css: fe,
+			"aria-hidden": !0,
+			"data-state": u ? "checked" : "unchecked",
+			"data-ui": "context-menu-check",
+			children: pe
+		}), /* @__PURE__ */ k(X, {
+			icon: s,
+			children: c
+		})]
+	});
+}
+Q.displayName = "ContextMenu.CheckboxItem";
+function $(e) {
+	return z("Separator"), /* @__PURE__ */ k(_, {
+		...e,
+		marker: "context-menu-separator",
+		styles: m
+	});
+}
+$.displayName = "ContextMenu.Separator";
+var he = Object.assign(G, {
+	Target: K,
+	Trigger: q,
+	Content: J,
+	Item: Z,
+	CheckboxItem: Q,
+	Separator: $
+});
+//#endregion
+export { he as t };

package/dist/context-menu.js

@@ -0,0 +1,2 @@
+'use client';
+export { t as ContextMenu } from "./context-menu-I4i0LRpm.js";

package/dist/{copy-button-ByiA6D3R.js → copy-button-C0p_qrgf.js}

@@ -1,11 +1,11 @@
 'use client';
-import { r as e } from "./sx-Dx9JUKp5.js";
+import { i as e } from "./css-BYJhdGh-.js";
 import { n as t, r as n } from "./media-8yrN85VT.js";
 import { t as r } from "./use-controlled-state-DpeVQZNR.js";
-import { t as i } from "./visually-hidden-BJdvqqvn.js";
+import { t as i } from "./visually-hidden-DgVO3NaB.js";
 import { t as a } from "./renderable-DzcIj1Lo.js";
-import { t as o } from "./loading-ring-B8-30Dl1.js";
-import { t as ee } from "./button-C92uYFJW.js";
+import { t as o } from "./loading-ring-D0lGrK8z.js";
+import { t as ee } from "./button-C6OV0C7J.js";
 import { useEffect as s, useRef as c, useState as l } from "react";
 import { vars as u } from "@jfrader/tokens/vars";
 import { Fragment as d, jsx as f, jsxs as p } from "@emotion/react/jsx-runtime";

package/dist/copy-button.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as CopyButton } from "./copy-button-ByiA6D3R.js";
+export { t as CopyButton } from "./copy-button-C0p_qrgf.js";

package/dist/{countdown-Dp_TD1VP.js → countdown-EcpV6rXy.js}

@@ -1,8 +1,9 @@
 'use client';
-import { i as e, r as t, t as n } from "./sx-Dx9JUKp5.js";
-import { n as r, r as i } from "./media-8yrN85VT.js";
+import { a as e, i as t } from "./css-BYJhdGh-.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
 import { t as a } from "./use-latest-callback-cj1OOQL6.js";
-import { t as o } from "./visually-hidden-BJdvqqvn.js";
+import { t as o } from "./visually-hidden-DgVO3NaB.js";
 import { t as s } from "./renderable-DzcIj1Lo.js";
 import { useEffect as c, useId as l, useRef as u, useState as d } from "react";
 import { vars as f } from "@jfrader/tokens/vars";
@@ -88,7 +89,7 @@ var w = e({
 	textAlign: "start",
 	lineHeight: f.lineHeight.base,
 	overflowWrap: "anywhere",
-	[r]: { color: "CanvasText" }
+	[n]: { color: "CanvasText" }
 }), E = t({
 	fontSize: f.textSize.sm,
 	color: f.color.textMuted
@@ -108,7 +109,7 @@ var w = e({
 	paddingBlock: f.space[1],
 	backgroundColor: f.color.surfaceRaised,
 	"& [data-ui=\"countdown-content\"]": { gap: f.space[2] },
-	[r]: {
+	[n]: {
 		borderColor: "CanvasText",
 		backgroundColor: "transparent"
 	}
@@ -125,7 +126,7 @@ var w = e({
 	lineHeight: f.lineHeight.tight
 }), k = t({ fontSize: `clamp(${f.textSize["2xl"]}, 8cqi, ${f.textSize["3xl"]})` }), A = t({ fontSize: f.textSize.sm }), j = t({
 	animation: `${w} ${f.motion.duration.base} ${f.motion.easeStandard}`,
-	[i]: { animation: "none" }
+	[r]: { animation: "none" }
 }), M = t({
 	display: "flex",
 	flexWrap: "wrap",
@@ -133,11 +134,11 @@ var w = e({
 	gap: f.space[2],
 	color: f.color.text,
 	animation: `${T} ${f.motion.duration.fast} ${f.motion.easeStandard}`,
-	[i]: { animation: "none" }
+	[r]: { animation: "none" }
 }), se = t({
 	display: "inline-flex",
 	color: f.color.success,
-	[r]: { color: "CanvasText" }
+	[n]: { color: "CanvasText" }
 });
 function ce({ value: e, variant: t, slot: n }) {
 	let r = u(e), i = r.current !== e;
@@ -155,8 +156,8 @@ function ce({ value: e, variant: t, slot: n }) {
 		children: e
 	}, e);
 }
-function N({ ref: e, target: t, variant: r = "display", units: i = v, label: s = "Time remaining", locale: f, unitDisplay: g = r === "display" ? "long" : "narrow", completeLabel: y = "Live now", completeText: w = "Complete", pendingLabel: T = "—", invalidLabel: O = "Unavailable", invalidText: k = "Unavailable", clock: A = te, initialNow: j, onComplete: N, announceCompletion: P = !1, completionIcon: F, slotProps: I, className: L, sx: le, "aria-labelledby": R, "aria-describedby": ue, "aria-label": de, ...fe }) {
-	let z = `${l()}-label`, B = `${l()}-description`, V = ne(t), H = v.filter((e) => i.includes(e)), U = H.length ? H : v, [W, pe] = d(j), [me, G] = d(null), K = a(N), q = u({
+function N({ ref: e, target: t, variant: n = "display", units: r = v, label: s = "Time remaining", locale: f, unitDisplay: g = n === "display" ? "long" : "narrow", completeLabel: y = "Live now", completeText: w = "Complete", pendingLabel: T = "—", invalidLabel: O = "Unavailable", invalidText: k = "Unavailable", clock: A = te, initialNow: j, onComplete: N, announceCompletion: P = !1, completionIcon: F, slotProps: I, className: L, sx: le, "aria-labelledby": R, "aria-describedby": ue, "aria-label": de, ...fe }) {
+	let z = `${l()}-label`, B = `${l()}-description`, V = ne(t), H = v.filter((e) => r.includes(e)), U = H.length ? H : v, [W, pe] = d(j), [me, G] = d(null), K = a(N), q = u({
 		epoch: V,
 		fired: !1
 	});
@@ -205,9 +206,9 @@ function N({ ref: e, target: t, variant: r = "display", units: i = v, label: s =
 			children: w
 		})
 	] });
-	return /* @__PURE__ */ m(n, {
+	return /* @__PURE__ */ m(i, {
 		className: L,
-		styles: [ie, r === "compact" && ae],
+		styles: [ie, n === "compact" && ae],
 		sx: le,
 		children: (t) => /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ h("div", {
 			...fe,
@@ -215,7 +216,7 @@ function N({ ref: e, target: t, variant: r = "display", units: i = v, label: s =
 			className: t,
 			"data-ui": "countdown",
 			"data-state": J,
-			"data-variant": r,
+			"data-variant": n,
 			role: "timer",
 			"aria-live": "off",
 			"aria-label": de ?? (!S(s) && !R ? "Time remaining" : void 0),
@@ -235,20 +236,20 @@ function N({ ref: e, target: t, variant: r = "display", units: i = v, label: s =
 					className: I?.content?.className,
 					css: [D, I?.content?.css],
 					children: C(Y, U).map(({ unit: e, value: t }) => {
-						let n = new Intl.NumberFormat(f, {
+						let r = new Intl.NumberFormat(f, {
 							style: "unit",
 							unit: b[e],
 							unitDisplay: g,
 							minimumIntegerDigits: 2,
 							useGrouping: !1
-						}), i = n.resolvedOptions();
+						}), i = r.resolvedOptions();
 						return /* @__PURE__ */ m("bdi", {
 							"data-ui": "countdown-unit",
 							className: I?.unit?.className,
 							css: [oe, I?.unit?.css],
-							children: n.formatToParts(t).map((e, t) => e.type === "integer" ? /* @__PURE__ */ m(ce, {
+							children: r.formatToParts(t).map((e, t) => e.type === "integer" ? /* @__PURE__ */ m(ce, {
 								value: e.value,
-								variant: r,
+								variant: n,
 								slot: I?.number
 							}, t) : /* @__PURE__ */ m("span", { children: e.value }, t))
 						}, `${e}-${i.locale}-${i.numberingSystem}`);

package/dist/countdown.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as Countdown } from "./countdown-Dp_TD1VP.js";
+export { t as Countdown } from "./countdown-EcpV6rXy.js";

package/dist/css-BYJhdGh-.js

@@ -0,0 +1,2 @@
+'use client';
+export { keyframes as a, css as i, ClassNames as n, useTheme as o, ThemeProvider as r, CacheProvider as t } from "@emotion/react";

package/dist/{date-picker-5zKSSuFF.js → date-picker-D-bn-iHs.js}

@@ -1,13 +1,14 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
+import { i as e } from "./css-BYJhdGh-.js";
+import { t } from "./sx-BJXJ2xJK.js";
 import { t as n } from "./use-controlled-state-DpeVQZNR.js";
 import { t as r } from "./renderable-DzcIj1Lo.js";
-import { n as i } from "./surface-DZ4d-2aL.js";
-import { t as a } from "./overlay-layer-SeUyyEPD.js";
-import { t as o } from "./calendar-B3Svu0X2.js";
-import { t as s } from "./overlay-portal-C4JZFq2M.js";
-import { t as c } from "./use-overlay-floating-DvJifLpF.js";
-import { t as l } from "./text-field-C8TWG-tY.js";
+import { n as i } from "./surface-C69kwSuk.js";
+import { t as a } from "./overlay-layer-qEbpEtb8.js";
+import { t as o } from "./overlay-portal-C9igMHnC.js";
+import { t as s } from "./use-overlay-floating-Bx2jBKAA.js";
+import { t as c } from "./calendar-Bg6D2sul.js";
+import { t as l } from "./text-field-D0VP7b4P.js";
 import { createContext as u, useContext as d, useEffect as f, useId as p, useLayoutEffect as m, useMemo as h, useRef as g, useState as _ } from "react";
 import { vars as v } from "@jfrader/tokens/vars";
 import { jsx as y, jsxs as b } from "@emotion/react/jsx-runtime";
@@ -55,8 +56,8 @@ var V = e({
 	boxShadow: v.shadow.overlay,
 	padding: v.space[3]
 });
-function U({ value: e, defaultValue: t, onValueChange: r, open: i, defaultOpen: a = !1, onOpenChange: o, min: s, max: l, locale: u, firstDayOfWeek: d, disabled: p = !1, name: m, placeholder: v, children: x }) {
-	let [T, O] = n(e, t, r), [k = !1, A] = n(i, a, o), [j, M] = _(!1), F = p || j, I = k && !F, [L, B] = _(null), V = g(null), H = g(!1), U = h(() => new Intl.DateTimeFormat(u ?? ne()).resolvedOptions().locale, [u]), W = h(() => new Intl.DateTimeFormat(U, N), [U]), G = h(() => re(W, U), [W, U]), K = R(T), q = K ? W.format(K) : "", J = z(s), Y = z(l), X = ee(z(T) ?? te(), J, Y).slice(0, 7), { refs: Z, floatingStyles: Q, context: $ } = c({
+function U({ value: e, defaultValue: t, onValueChange: r, open: i, defaultOpen: a = !1, onOpenChange: o, min: c, max: l, locale: u, firstDayOfWeek: d, disabled: p = !1, name: m, placeholder: v, children: x }) {
+	let [T, O] = n(e, t, r), [k = !1, A] = n(i, a, o), [j, M] = _(!1), F = p || j, I = k && !F, [L, B] = _(null), V = g(null), H = g(!1), U = h(() => new Intl.DateTimeFormat(u ?? ne()).resolvedOptions().locale, [u]), W = h(() => new Intl.DateTimeFormat(U, N), [U]), G = h(() => re(W, U), [W, U]), K = R(T), q = K ? W.format(K) : "", J = z(c), Y = z(l), X = ee(z(T) ?? te(), J, Y).slice(0, 7), { refs: Z, floatingStyles: Q, context: $ } = s({
 		open: I,
 		placement: D,
 		onOpenChange: (e, t, n) => {
@@ -196,10 +197,10 @@ function G({ ref: e, label: t, id: n, disabled: i, slotProps: a, onKeyDown: o, o
 }
 G.displayName = "DatePicker.Input";
 function K({ ref: e, style: n, className: r, sx: i, ...a }) {
-	let { open: c, value: l, initialMonth: u, min: d, max: f, locale: p, firstDayOfWeek: m, inputLabelling: h, gridRef: _, refs: v, floatingContext: S, floatingStyles: C, getFloatingProps: w, selectDate: E } = F("Popup"), D = T([v.setFloating, e]), O = g(null), k = T([(e) => {
+	let { open: s, value: l, initialMonth: u, min: d, max: f, locale: p, firstDayOfWeek: m, inputLabelling: h, gridRef: _, refs: v, floatingContext: S, floatingStyles: C, getFloatingProps: w, selectDate: E } = F("Popup"), D = T([v.setFloating, e]), O = g(null), k = T([(e) => {
 		_.current = e, O.current = B(e);
 	}]);
-	if (!c) return null;
+	if (!s) return null;
 	let A = a["aria-labelledby"] !== void 0 || a["aria-label"] !== void 0 ? {} : h?.labelledBy === void 0 ? { "aria-label": h?.label } : { "aria-labelledby": h.labelledBy }, M = (e) => {
 		let t = e.target.closest(j);
 		if (t?.disabled) return;
@@ -208,7 +209,7 @@ function K({ ref: e, style: n, className: r, sx: i, ...a }) {
 	}, N = (e) => {
 		e.target.closest(j)?.disabled && e.preventDefault();
 	};
-	return /* @__PURE__ */ y(s, { children: /* @__PURE__ */ y(x, {
+	return /* @__PURE__ */ y(o, { children: /* @__PURE__ */ y(x, {
 		context: S,
 		modal: !1,
 		initialFocus: O,
@@ -229,14 +230,14 @@ function K({ ref: e, style: n, className: r, sx: i, ...a }) {
 					...C
 				},
 				className: e,
-				children: /* @__PURE__ */ b(o, {
+				children: /* @__PURE__ */ b(c, {
 					value: l ?? "",
 					defaultVisibleMonth: u,
 					min: d,
 					max: f,
 					locale: p,
 					firstDayOfWeek: m,
-					children: [/* @__PURE__ */ y(o.Header, {}), /* @__PURE__ */ y(o.Grid, {
+					children: [/* @__PURE__ */ y(c.Header, {}), /* @__PURE__ */ y(c.Grid, {
 						ref: k,
 						onClick: M,
 						onPointerDownCapture: N

package/dist/date-picker.js

@@ -1,2 +1,2 @@
 'use client';
-export { t as DatePicker } from "./date-picker-5zKSSuFF.js";
+export { t as DatePicker } from "./date-picker-D-bn-iHs.js";