@jfrader/ui 0.5.1 → 0.7.0

package/dist/calendar-BzJdv_SZ.js

@@ -1,449 +0,0 @@
-'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./focus-ring-BK5W5_NY.js";
-import { n as r, r as i } from "./media-8yrN85VT.js";
-import { t as a } from "./use-latest-callback-cj1OOQL6.js";
-import { t as o } from "./use-controlled-state-DpeVQZNR.js";
-import { createContext as s, useContext as c, useEffect as l, useId as u, useImperativeHandle as d, useLayoutEffect as f, useMemo as p, useRef as m, useState as h } from "react";
-import { vars as g } from "@jfrader/tokens/vars";
-import { Fragment as _, jsx as v, jsxs as y } from "@emotion/react/jsx-runtime";
-//#region src/components/calendar/calendar.styles.ts
-var b = e({
-	display: "inline-flex",
-	flexDirection: "column",
-	gap: g.space[2],
-	fontFamily: g.font.sans,
-	color: g.color.text
-}), x = e({
-	display: "flex",
-	alignItems: "center",
-	gap: g.space[2]
-}), S = e({
-	flex: 1,
-	textAlign: "center",
-	fontSize: g.textSize.sm,
-	fontWeight: g.fontWeight.semibold
-}), C = {
-	transitionDuration: g.motion.duration.fast,
-	transitionTimingFunction: g.motion.easeStandard,
-	[i]: { transitionDuration: "0s" }
-}, w = e({
-	appearance: "none",
-	display: "inline-flex",
-	alignItems: "center",
-	justifyContent: "center",
-	inlineSize: "32px",
-	blockSize: "32px",
-	padding: 0,
-	border: `1px solid ${g.color.borderControl}`,
-	borderRadius: g.radius.sm,
-	backgroundColor: "transparent",
-	font: "inherit",
-	fontSize: g.textSize.lg,
-	lineHeight: 1,
-	color: g.color.text,
-	cursor: "pointer",
-	transitionProperty: "background-color",
-	...C,
-	"&:hover:not([aria-disabled=\"true\"])": { backgroundColor: g.color.surfaceHover },
-	"&[aria-disabled=\"true\"]": {
-		opacity: .55,
-		cursor: "not-allowed"
-	},
-	"&:focus-visible": { ...n }
-}), T = e({
-	display: "inline-block",
-	"&:dir(rtl)": { transform: "scaleX(-1)" }
-}), ee = e({
-	borderCollapse: "separate",
-	borderSpacing: g.space[1],
-	marginInline: `calc(-1 * ${g.space[1]})`
-}), E = e({
-	paddingBlock: g.space[1],
-	fontSize: g.textSize.xs,
-	fontWeight: g.fontWeight.medium,
-	color: g.color.textMuted,
-	textAlign: "center"
-}), te = e({ padding: 0 }), ne = e({
-	appearance: "none",
-	display: "inline-flex",
-	alignItems: "center",
-	justifyContent: "center",
-	inlineSize: "36px",
-	blockSize: "36px",
-	padding: 0,
-	border: "1px solid transparent",
-	borderRadius: g.radius.sm,
-	backgroundColor: "transparent",
-	font: "inherit",
-	fontSize: g.textSize.sm,
-	fontVariantNumeric: "tabular-nums",
-	color: g.color.text,
-	cursor: "pointer",
-	transitionProperty: "background-color, border-color, color",
-	...C,
-	"&:hover:not(:disabled):not([data-selected]):not([data-in-range])": { backgroundColor: g.color.surfaceHover },
-	"&[data-today]": {
-		borderColor: g.color.borderControl,
-		fontWeight: g.fontWeight.semibold,
-		textDecoration: "underline"
-	},
-	"&[data-selected]": {
-		backgroundColor: g.color.accent,
-		borderColor: g.color.accent,
-		color: g.color.accentContrast,
-		fontWeight: g.fontWeight.semibold
-	},
-	"&[data-selected]:hover": { backgroundColor: g.color.accentHover },
-	"&[data-in-range]": {
-		backgroundColor: g.color.accentSoft,
-		borderColor: g.color.accentBorder
-	},
-	"&[data-preview]:not([data-in-range])": {
-		borderStyle: "dashed",
-		borderColor: g.color.accentText
-	},
-	"&[data-range-start], &[data-range-end]": {
-		backgroundColor: g.color.accent,
-		borderColor: g.color.accent,
-		color: g.color.accentContrast,
-		fontWeight: g.fontWeight.semibold
-	},
-	"&[data-range-start]:hover, &[data-range-end]:hover": { backgroundColor: g.color.accentHover },
-	"&:disabled": {
-		opacity: .55,
-		cursor: "not-allowed",
-		textDecoration: "line-through"
-	},
-	"&[data-today]:disabled": { textDecoration: "underline line-through" },
-	"&:focus-visible": { ...n },
-	[r]: {
-		"&[data-in-range], &[data-preview]": { borderColor: "CanvasText" },
-		"&[data-selected], &[data-range-start], &[data-range-end]": {
-			forcedColorAdjust: "none",
-			backgroundColor: "Highlight",
-			borderColor: "Highlight",
-			color: "HighlightText"
-		}
-	}
-}), D = /^\d{4}-\d{2}-\d{2}$/, O = /^\d{4}-\d{2}$/, k = 12, A = 0, re = "2026-01-04", j = (e, t) => String(e).padStart(t, "0");
-function M(e, t, n) {
-	let r = new Date(Date.UTC(0, 0, 1));
-	return r.setUTCFullYear(e, t, n), r;
-}
-function N(e) {
-	let [t = NaN, n = NaN, r = 1] = e.split("-").map(Number);
-	return M(t, n - 1, r);
-}
-var P = (e) => `${j(e.getUTCFullYear(), 4)}-${j(e.getUTCMonth() + 1, 2)}-${j(e.getUTCDate(), 2)}`, F = (e) => e !== void 0 && D.test(e) && P(N(e)) === e, ie = (e) => e !== void 0 && O.test(e) && F(`${e}-01`), I = (e) => e.slice(0, 7), L = (e) => `${e}-01`;
-function R(e, t) {
-	let n = N(e);
-	return P(M(n.getUTCFullYear(), n.getUTCMonth(), n.getUTCDate() + t));
-}
-function z(e, t) {
-	let n = N(e), r = M(n.getUTCFullYear(), n.getUTCMonth() + t, 1), i = M(r.getUTCFullYear(), r.getUTCMonth() + 1, 0).getUTCDate();
-	return P(M(r.getUTCFullYear(), r.getUTCMonth(), Math.min(n.getUTCDate(), i)));
-}
-var B = (e, t) => I(z(L(e), t)), V = (e) => R(L(B(e, 1)), -1), H = (e, t, n) => (t === void 0 || e >= t) && (n === void 0 || e <= n);
-function U(e, t, n) {
-	return t !== void 0 && e < t ? t : n !== void 0 && e > n ? n : e;
-}
-var W = (e, t) => (N(e).getUTCDay() - t + 7) % 7;
-function ae(e) {
-	let t = new Intl.Locale(e), n = t.getWeekInfo?.() ?? t.weekInfo;
-	return n ? n.firstDay % 7 : A;
-}
-var G = {
-	calendar: "gregory",
-	timeZone: "UTC"
-};
-function oe(e) {
-	return {
-		month: new Intl.DateTimeFormat(e, {
-			...G,
-			month: "long",
-			year: "numeric"
-		}),
-		day: new Intl.DateTimeFormat(e, {
-			...G,
-			day: "numeric"
-		}),
-		date: new Intl.DateTimeFormat(e, {
-			...G,
-			dateStyle: "long"
-		}),
-		weekdayShort: new Intl.DateTimeFormat(e, {
-			...G,
-			weekday: "short"
-		}),
-		weekdayLong: new Intl.DateTimeFormat(e, {
-			...G,
-			weekday: "long"
-		})
-	};
-}
-var K = () => typeof navigator > "u" ? void 0 : navigator.language, q = (e) => (t) => R(t, e), J = (e) => (t, { shiftKey: n }) => z(t, n ? e * k : e), Y = {
-	ArrowDown: q(7),
-	ArrowUp: q(-7),
-	Home: (e, { firstDayOfWeek: t }) => R(e, -W(e, t)),
-	End: (e, { firstDayOfWeek: t }) => R(e, 6 - W(e, t)),
-	PageUp: J(-1),
-	PageDown: J(1)
-}, X = {
-	ltr: {
-		...Y,
-		ArrowRight: q(1),
-		ArrowLeft: q(-1)
-	},
-	rtl: {
-		...Y,
-		ArrowRight: q(-1),
-		ArrowLeft: q(1)
-	}
-}, se = s(null);
-function Z(e) {
-	let t = c(se);
-	if (!t) throw Error(`Calendar.${e} must be rendered inside <Calendar>.`);
-	return t;
-}
-var Q = (e, t) => t != null && e >= t.start && e <= t.end, ce = "‹", le = "›";
-function ue({ ref: e, value: n, defaultValue: r, onValueChange: i, visibleMonth: s, defaultVisibleMonth: c, onVisibleMonthChange: l, min: d, max: f, locale: m, firstDayOfWeek: g, today: x, selectionRange: S, previewRange: C, tabStopDate: w, onDayActivate: T, onFocusedDateChange: ee, rangeLabels: E, className: te, sx: ne, children: D, ...O }) {
-	let k = u(), A = `${k}-label`, re = E !== void 0, j = p(() => re ? {
-		start: `${k}-range-start`,
-		end: `${k}-range-end`
-	} : void 0, [k, re]), N = a(T), L = a(ee), R = /* @__PURE__ */ new Date(), z = F(x) ? x : P(M(R.getFullYear(), R.getMonth(), R.getDate())), B = p(() => new Intl.DateTimeFormat(m ?? K(), G).resolvedOptions().locale, [m]), V = p(() => oe(B), [B]), H = p(() => ae(B), [B]), U = g ?? H, [W, q] = o(n, r, i), J = n ?? r, [Y, X] = o(s, c ?? I(F(J) ? J : z), l), Z = ie(Y) ? Y : I(z), Q = F(d) ? d : void 0, ce = F(f) ? f : void 0, [le, ue] = h(null), [$, de] = h(!1), fe = p(() => ({
-		value: W,
-		selectionRange: S,
-		previewRange: C,
-		tabStopDate: w,
-		onDayActivate: N,
-		onFocusedDateChange: L,
-		rangeLabelIds: j,
-		visibleMonth: Z,
-		today: z,
-		min: Q,
-		max: ce,
-		firstDayOfWeek: U,
-		formatters: V,
-		focus: le,
-		setFocus: ue,
-		requestValue: q,
-		requestVisibleMonth: X,
-		labelId: A,
-		hasHeader: $,
-		setHasHeader: de
-	}), [
-		W,
-		S,
-		C,
-		w,
-		N,
-		L,
-		j,
-		Z,
-		z,
-		Q,
-		ce,
-		U,
-		V,
-		le,
-		q,
-		X,
-		A,
-		$
-	]);
-	return /* @__PURE__ */ v(se.Provider, {
-		value: fe,
-		children: /* @__PURE__ */ v(t, {
-			className: te,
-			styles: b,
-			sx: ne,
-			children: (t) => /* @__PURE__ */ y("div", {
-				...O,
-				ref: e,
-				"data-ui": "calendar",
-				className: t,
-				children: [D, E && j && /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v("span", {
-					id: j.start,
-					hidden: !0,
-					children: E.start
-				}), /* @__PURE__ */ v("span", {
-					id: j.end,
-					hidden: !0,
-					children: E.end
-				})] })]
-			})
-		})
-	});
-}
-ue.displayName = "Calendar";
-function $({ ref: e, className: n, sx: r, ...i }) {
-	let { visibleMonth: a, min: o, max: s, formatters: c, requestVisibleMonth: l, labelId: u, setHasHeader: d } = Z("Header");
-	f(() => (d(!0), () => d(!1)), [d]);
-	let p = B(a, -1), m = B(a, 1), h = o !== void 0 && V(p) < o, g = s !== void 0 && L(m) > s, _ = (e) => c.month.format(N(L(e)));
-	return /* @__PURE__ */ v(t, {
-		className: n,
-		styles: x,
-		sx: r,
-		children: (t) => /* @__PURE__ */ y("div", {
-			...i,
-			ref: e,
-			"data-ui": "calendar-header",
-			className: t,
-			children: [
-				/* @__PURE__ */ v("button", {
-					type: "button",
-					"data-ui": "calendar-previous",
-					"aria-label": _(p),
-					"aria-disabled": h || void 0,
-					onClick: () => {
-						h || l(p);
-					},
-					css: w,
-					children: /* @__PURE__ */ v("span", {
-						"aria-hidden": "true",
-						css: T,
-						children: ce
-					})
-				}),
-				/* @__PURE__ */ v("span", {
-					id: u,
-					"aria-live": "polite",
-					"aria-atomic": "true",
-					"data-ui": "calendar-label",
-					css: S,
-					children: _(a)
-				}),
-				/* @__PURE__ */ v("button", {
-					type: "button",
-					"data-ui": "calendar-next",
-					"aria-label": _(m),
-					"aria-disabled": g || void 0,
-					onClick: () => {
-						g || l(m);
-					},
-					css: w,
-					children: /* @__PURE__ */ v("span", {
-						"aria-hidden": "true",
-						css: T,
-						children: le
-					})
-				})
-			]
-		})
-	});
-}
-$.displayName = "Calendar.Header";
-function de({ date: e, isTabStop: t }) {
-	let { value: n, selectionRange: r, previewRange: i, rangeLabelIds: a, today: o, min: s, max: c, formatters: l, setFocus: u, requestValue: d, onDayActivate: f, onFocusedDateChange: p } = Z("Grid"), m = r !== void 0, h = H(e, s, c), g = m ? Q(e, r) : n === e, _ = r?.start === e, y = r?.end === e, b = o === e, x = N(e), S = [_ ? a?.start : void 0, y ? a?.end : void 0].filter(Boolean).join(" ") || void 0;
-	return /* @__PURE__ */ v("td", {
-		role: "gridcell",
-		"aria-selected": g ? !0 : m && h ? !1 : void 0,
-		css: te,
-		children: /* @__PURE__ */ v("button", {
-			type: "button",
-			"data-ui": "calendar-day",
-			"data-date": e,
-			"data-today": b || void 0,
-			"data-selected": !m && g || void 0,
-			"data-in-range": m && g || void 0,
-			"data-range-start": _ || void 0,
-			"data-range-end": y || void 0,
-			"data-preview": Q(e, i) || void 0,
-			"data-preview-start": i?.start === e || void 0,
-			"data-preview-end": i?.end === e || void 0,
-			"aria-current": b ? "date" : void 0,
-			"aria-label": l.date.format(x),
-			"aria-describedby": S,
-			tabIndex: t ? 0 : -1,
-			disabled: !h,
-			onFocus: () => {
-				u({
-					date: e,
-					fallback: e
-				}), p(e);
-			},
-			onClick: () => {
-				u({
-					date: e,
-					fallback: e
-				}), m || d(e), f(e);
-			},
-			css: ne,
-			children: l.day.format(x)
-		})
-	});
-}
-function fe({ ref: e, onKeyDown: n, "aria-labelledby": r, "aria-label": i, className: a, sx: o, ...s }) {
-	let { value: c, selectionRange: u, tabStopDate: f, visibleMonth: p, today: h, min: g, max: _, firstDayOfWeek: b, formatters: x, focus: S, setFocus: C, requestVisibleMonth: w, onFocusedDateChange: T, labelId: ne, hasHeader: D } = Z("Grid"), O = m(null);
-	d(e, () => O.current, []);
-	let k = m(!1), A = L(p), j = N(V(p)).getUTCDate(), M = Array.from({ length: j }, (e, t) => R(A, t)), P = (e) => e != null && M.includes(e) && H(e, g, _), F = f !== void 0, ie = F ? P(f) ? f : void 0 : [
-		S?.date,
-		S?.fallback,
-		u === void 0 ? c : u?.start,
-		h
-	].find(P) ?? M.find((e) => H(e, g, _)), z = [...Array(W(A, b)).fill(null), ...M], B = Array.from({ length: Math.ceil(z.length / 7) }, (e, t) => Array.from({ length: 7 }, (e, n) => z[t * 7 + n] ?? null)), ae = Array.from({ length: 7 }, (e, t) => N(R(re, (b + t) % 7)));
-	l(() => {
-		k.current && (k.current = !1, O.current?.querySelector(`[data-date="${ie}"]`)?.focus());
-	});
-	let G = (e) => {
-		n?.(e);
-		let t = O.current;
-		if (e.defaultPrevented || !t) return;
-		let r = e.target.dataset.date;
-		if (!P(r)) return;
-		let i = X[getComputedStyle(t).direction === "rtl" ? "rtl" : "ltr"][e.key];
-		if (!i) return;
-		e.preventDefault();
-		let a = U(i(r, {
-			firstDayOfWeek: b,
-			shiftKey: e.shiftKey
-		}), g, _);
-		F ? T(a) : a !== r && (C({
-			date: a,
-			fallback: r
-		}), k.current = !0, I(a) !== p && w(I(a)));
-	}, oe = [r, D ? ne : void 0].filter(Boolean).join(" ") || void 0, K = x.month.format(N(A));
-	return /* @__PURE__ */ v(t, {
-		className: a,
-		styles: ee,
-		sx: o,
-		children: (e) => /* @__PURE__ */ y("table", {
-			...s,
-			ref: O,
-			role: "grid",
-			"aria-multiselectable": u !== void 0 || void 0,
-			"aria-labelledby": oe,
-			"aria-label": oe === void 0 ? i ?? K : i,
-			"data-ui": "calendar-grid",
-			onKeyDown: G,
-			className: e,
-			children: [/* @__PURE__ */ v("thead", { children: /* @__PURE__ */ v("tr", {
-				role: "row",
-				children: ae.map((e) => /* @__PURE__ */ v("th", {
-					role: "columnheader",
-					scope: "col",
-					abbr: x.weekdayLong.format(e),
-					css: E,
-					children: x.weekdayShort.format(e)
-				}, e.getUTCDay()))
-			}) }), /* @__PURE__ */ v("tbody", { children: B.map((e, t) => /* @__PURE__ */ v("tr", {
-				role: "row",
-				children: e.map((e, t) => e === null ? /* @__PURE__ */ v("td", {
-					role: "gridcell",
-					css: te
-				}, `empty-${t}`) : /* @__PURE__ */ v(de, {
-					date: e,
-					isTabStop: e === ie
-				}, e))
-			}, t)) })]
-		})
-	});
-}
-fe.displayName = "Calendar.Grid";
-var pe = Object.assign(ue, {
-	Header: $,
-	Grid: fe
-});
-//#endregion
-export { M as a, F as c, I as d, B as f, N as i, H as l, G as n, K as o, U as r, L as s, pe as t, P as u };

package/dist/card-Ca4KQKYQ.js

@@ -1,154 +0,0 @@
-'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./surface-DZ4d-2aL.js";
-import { createContext as r, useContext as i } from "react";
-import { vars as a } from "@jfrader/tokens/vars";
-import { jsx as o } from "@emotion/react/jsx-runtime";
-//#region src/components/card/card.tsx
-var s = r(void 0);
-function c(...e) {
-	return e.filter(Boolean).join(" ") || void 0;
-}
-var l = e({
-	...n,
-	minInlineSize: 0,
-	borderRadius: a.radius.lg,
-	paddingBlock: a.space[4],
-	paddingInline: a.space[5]
-}), u = {
-	flat: e({ boxShadow: "none" }),
-	raised: e({ boxShadow: a.shadow.raised })
-}, d = e({
-	display: "grid",
-	gap: a.space[1],
-	marginBlockEnd: a.space[4]
-}), f = e({
-	margin: 0,
-	fontSize: a.textSize.md,
-	fontWeight: a.fontWeight.semibold,
-	lineHeight: a.lineHeight.tight,
-	color: a.color.text
-}), p = e({
-	margin: 0,
-	fontSize: a.textSize.sm,
-	color: a.color.textMuted
-}), m = e({
-	fontSize: a.textSize.sm,
-	color: a.color.text
-}), h = e({
-	display: "flex",
-	flexWrap: "wrap",
-	alignItems: "center",
-	justifyContent: "space-between",
-	gap: a.space[2],
-	marginBlockStart: a.space[4],
-	paddingBlockStart: a.space[4],
-	borderBlockStart: `1px solid ${a.color.borderSubtle}`,
-	"& > :only-child": { marginInlineStart: "auto" }
-});
-function g({ ref: e, variant: n = "raised", slotProps: r, className: i, sx: a, ...d }) {
-	return /* @__PURE__ */ o(s.Provider, {
-		value: r,
-		children: /* @__PURE__ */ o(t, {
-			className: c(r?.root?.className, i),
-			styles: [
-				l,
-				u[n],
-				r?.root?.css
-			],
-			sx: a,
-			children: (t) => /* @__PURE__ */ o("div", {
-				...d,
-				ref: e,
-				"data-ui": "card",
-				"data-variant": n,
-				className: t
-			})
-		})
-	});
-}
-g.displayName = "Card";
-function _({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.header;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [d, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("div", {
-			...a,
-			ref: e,
-			"data-ui": "card-header",
-			className: t
-		})
-	});
-}
-_.displayName = "Card.Header";
-function v({ ref: e, level: n = 3, className: r, sx: a, ...l }) {
-	let u = i(s)?.title, d = `h${n}`;
-	return /* @__PURE__ */ o(t, {
-		className: c(u?.className, r),
-		styles: [f, u?.css],
-		sx: a,
-		children: (t) => /* @__PURE__ */ o(d, {
-			...l,
-			ref: e,
-			"data-ui": "card-title",
-			className: t
-		})
-	});
-}
-v.displayName = "Card.Title";
-function y({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.description;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [p, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("p", {
-			...a,
-			ref: e,
-			"data-ui": "card-description",
-			className: t
-		})
-	});
-}
-y.displayName = "Card.Description";
-function b({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.content;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [m, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("div", {
-			...a,
-			ref: e,
-			"data-ui": "card-content",
-			className: t
-		})
-	});
-}
-b.displayName = "Card.Content";
-function x({ ref: e, className: n, sx: r, ...a }) {
-	let l = i(s)?.footer;
-	return /* @__PURE__ */ o(t, {
-		className: c(l?.className, n),
-		styles: [h, l?.css],
-		sx: r,
-		children: (t) => /* @__PURE__ */ o("div", {
-			...a,
-			ref: e,
-			"data-ui": "card-footer",
-			className: t
-		})
-	});
-}
-x.displayName = "Card.Footer";
-var S = Object.assign(g, {
-	Header: _,
-	Title: v,
-	Description: y,
-	Content: b,
-	Footer: x
-});
-//#endregion
-export { S as t };