@jfrader/ui 0.1.1 → 0.2.0

package/dist/calendar-DcCAiN3b.js

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

package/dist/card-L-Z_1vZN.js

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

package/dist/checkbox-B7em7B-6.js

@@ -1,134 +0,0 @@
-import { t as e } from "./css-CW_HG55W.js";
-import { n as t } from "./media-8K3xDAxM.js";
-import { t as n } from "./renderable-DwPvt1I8.js";
-import { i as r, n as i, r as a, t as o } from "./choice-control-DCyQ_hVw.js";
-import { forwardRef as s, useEffect as c, useId as l, useImperativeHandle as u, useRef as d } from "react";
-import { vars as f } from "@jfrader/tokens/vars";
-import { jsx as p, jsxs as m } from "@emotion/react/jsx-runtime";
-//#region src/components/checkbox/checkbox.tsx
-var h = {
-	sm: "16px",
-	md: "20px"
-}, g = e({
-	"input:checked + span svg": { opacity: 1 },
-	"&[data-indeterminate] input + span": {
-		backgroundColor: f.color.accent,
-		borderColor: f.color.accent
-	},
-	"&[data-indeterminate] input + span svg": { opacity: 1 }
-}), _ = e({
-	display: "inline-flex",
-	alignItems: "center",
-	justifyContent: "center",
-	flexShrink: 0,
-	boxSizing: "border-box",
-	border: `1px solid ${f.color.borderControl}`,
-	borderRadius: f.radius.sm,
-	backgroundColor: f.color.surfaceRaised,
-	color: f.color.accentContrast,
-	transitionProperty: "background-color, border-color",
-	transitionDuration: f.motion.duration.fast,
-	transitionTimingFunction: f.motion.easeStandard,
-	"& svg": {
-		inlineSize: "75%",
-		blockSize: "75%",
-		opacity: 0
-	},
-	[t]: { transitionDuration: "0s" }
-}), v = {
-	sm: e({
-		inlineSize: h.sm,
-		blockSize: h.sm
-	}),
-	md: e({
-		inlineSize: h.md,
-		blockSize: h.md
-	})
-}, y = {
-	sm: e({ fontSize: f.textSize.sm }),
-	md: e({ fontSize: f.textSize.md })
-}, b = e({
-	fontSize: f.textSize.sm,
-	color: f.color.textMuted
-}), x = {
-	sm: e({ marginInlineStart: `calc(${h.sm} + ${f.space[2]})` }),
-	md: e({ marginInlineStart: `calc(${h.md} + ${f.space[2]})` })
-};
-function S({ indeterminate: e }) {
-	return /* @__PURE__ */ p("svg", {
-		viewBox: "0 0 16 16",
-		fill: "none",
-		stroke: "currentColor",
-		strokeWidth: "2",
-		strokeLinecap: "round",
-		strokeLinejoin: "round",
-		children: e ? /* @__PURE__ */ p("line", {
-			x1: "4",
-			y1: "8",
-			x2: "12",
-			y2: "8"
-		}) : /* @__PURE__ */ p("polyline", { points: "3.5 8.5 6.5 11.5 12.5 4.5" })
-	});
-}
-var C = s(function({ label: e, description: t, indeterminate: s = !1, size: f = "md", onChange: h, onCheckedChange: C, slotProps: w, className: T, "aria-labelledby": E, "aria-describedby": D, ...O }, k) {
-	let A = d(null);
-	u(k, () => A.current, []), c(() => {
-		A.current && (A.current.indeterminate = s);
-	}, [s]);
-	let j = l(), M = `${j}-label`, N = `${j}-description`, P = n(e), F = n(t), I = [E, P && M].filter(Boolean).join(" ") || void 0, L = [D, F && N].filter(Boolean).join(" ") || void 0, R = [T, w?.root?.className].filter(Boolean).join(" ") || void 0, z = (e) => {
-		s && (e.currentTarget.indeterminate = !0), h?.(e), C?.(e.currentTarget.checked);
-	};
-	return /* @__PURE__ */ m("label", {
-		"data-ui": "checkbox",
-		"data-indeterminate": s || void 0,
-		className: R,
-		css: [
-			a,
-			g,
-			i,
-			w?.root?.css
-		],
-		children: [/* @__PURE__ */ m("span", {
-			css: r,
-			children: [
-				/* @__PURE__ */ p("input", {
-					...O,
-					ref: A,
-					type: "checkbox",
-					"aria-labelledby": I,
-					"aria-describedby": L,
-					"aria-checked": s ? "mixed" : void 0,
-					onChange: z,
-					css: o
-				}),
-				/* @__PURE__ */ p("span", {
-					"aria-hidden": "true",
-					className: w?.control?.className,
-					css: [
-						_,
-						v[f],
-						w?.control?.css
-					],
-					children: /* @__PURE__ */ p(S, { indeterminate: s })
-				}),
-				P && /* @__PURE__ */ p("span", {
-					id: M,
-					className: w?.label?.className,
-					css: [y[f], w?.label?.css],
-					children: e
-				})
-			]
-		}), F && /* @__PURE__ */ p("span", {
-			id: N,
-			className: w?.description?.className,
-			css: [
-				b,
-				x[f],
-				w?.description?.css
-			],
-			children: t
-		})]
-	});
-});
-//#endregion
-export { C as t };