@rinzai/zen 0.6.0 → 0.7.0

package/dist/select/index.js

@@ -1,150 +1,144 @@
 "use client";
 import { cx as e } from "../utils/cx.js";
-import { useAnchoredPopup as t } from "../utils/useAnchoredPopup.js";
-import { POPUP as n, TRIGGER as r } from "../utils/styles.js";
-import { CheckIcon as i } from "../utils/status-icons.js";
-import { useFieldProps as a } from "../field/index.js";
-import { FieldChevron as o } from "../utils/field-chevron.js";
-import { Children as s, Fragment as c, createContext as l, isValidElement as u, useCallback as d, useContext as f, useEffect as p, useId as m, useLayoutEffect as h, useRef as g, useState as _ } from "react";
-import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
+import { useTypeahead as t } from "../utils/typeahead.js";
+import { useAnchoredPopup as n } from "../utils/useAnchoredPopup.js";
+import { POPUP as r, TRIGGER as i } from "../utils/styles.js";
+import { CheckIcon as a } from "../utils/status-icons.js";
+import { useFieldProps as o } from "../field/index.js";
+import { FieldChevron as s } from "../utils/field-chevron.js";
+import { Children as c, Fragment as l, createContext as u, isValidElement as d, useCallback as f, useContext as p, useEffect as m, useId as h, useLayoutEffect as g, useRef as _, useState as v } from "react";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
 //#region packages/select/index.tsx
-var x = l(null);
-function S({ value: i, onChange: s, placeholder: c = "Select…", disabled: l = !1, name: u, id: f, className: h, listClassName: S, children: w, style: T, onKeyDown: E, ...D }) {
-	let O = g(null), k = m(), A = f ?? k, j = a({
-		...D,
-		id: f
-	}), [M, N] = _(null), P = g({
-		text: "",
-		at: 0
-	}), [F, I] = _(/* @__PURE__ */ new Map()), L = () => Array.from(O.current?.querySelectorAll("[role=\"option\"]") ?? []).map((e) => ({
+var S = u(null);
+function C({ value: a, onChange: c, placeholder: l = "Select…", disabled: u = !1, name: d, id: p, className: g, listClassName: C, children: T, style: E, onKeyDown: D, ...O }) {
+	let k = _(null), A = h(), j = p ?? A, M = o({
+		...O,
+		id: p
+	}), [N, P] = v(null), F = t(), [I, L] = v(/* @__PURE__ */ new Map()), R = () => Array.from(k.current?.querySelectorAll("[role=\"option\"]") ?? []).map((e) => ({
 		value: e.dataset.value,
 		label: e.dataset.label ?? "",
 		disabled: e.getAttribute("aria-disabled") === "true"
-	})), R = t({
+	})), z = n({
 		matchWidth: !0,
 		onOpenChange: (e) => {
 			if (!e) return;
-			let t = L();
-			N(t.find((e) => e.value === i)?.value ?? t.find((e) => !e.disabled)?.value ?? null);
+			let t = R();
+			P(t.find((e) => e.value === a)?.value ?? t.find((e) => !e.disabled)?.value ?? null);
 		}
 	});
-	p(() => {
-		R.open && O.current?.focus();
-	}, [R.open]);
-	let z = (e) => {
-		L().find((t) => t.value === e)?.disabled || (s(e), R.setOpen(!1));
-	}, B = d((e, t) => (I((n) => n.get(e) === t ? n : new Map(n).set(e, t)), () => I((t) => {
+	m(() => {
+		z.open && k.current?.focus();
+	}, [z.open]);
+	let B = (e) => {
+		R().find((t) => t.value === e)?.disabled || (c(e), z.setOpen(!1));
+	}, V = f((e, t) => (L((n) => n.get(e) === t ? n : new Map(n).set(e, t)), () => L((t) => {
 		let n = new Map(t);
 		return n.delete(e), n;
-	})), []), V = new Map(F);
-	C(w, V);
-	let H = i === null ? void 0 : V.get(i), U = (e, t, n = L()) => {
+	})), []), H = new Map(I);
+	w(T, H);
+	let U = a === null ? void 0 : H.get(a), W = (e, t, n = R()) => {
 		let r = e === null ? t === 1 ? -1 : n.length : n.findIndex((t) => t.value === e);
 		for (let e = 1; e <= n.length; e++) {
 			let i = (r + t * e + n.length * 2) % n.length;
 			if (!n[i].disabled) return n[i].value;
 		}
 		return e;
-	}, W = (e) => {
+	}, G = (e) => {
 		let t = {
-			ArrowDown: () => N((e) => U(e, 1)),
-			ArrowUp: () => N((e) => U(e, -1)),
-			Home: () => N(U(null, 1)),
-			End: () => N(U(null, -1)),
-			Enter: () => M !== null && z(M),
-			" ": () => M !== null && z(M),
-			Tab: () => R.setOpen(!1)
+			ArrowDown: () => P((e) => W(e, 1)),
+			ArrowUp: () => P((e) => W(e, -1)),
+			Home: () => P(W(null, 1)),
+			End: () => P(W(null, -1)),
+			Enter: () => N !== null && B(N),
+			" ": () => N !== null && B(N),
+			Tab: () => z.setOpen(!1)
 		};
 		if (t[e.key]) {
 			e.key !== "Tab" && e.preventDefault(), t[e.key]();
 			return;
 		}
-		if (e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey) {
-			let t = Date.now(), n = (t - P.current.at < 700 ? P.current.text : "") + e.key.toLowerCase();
-			P.current = {
-				text: n,
-				at: t
-			};
-			let r = L().find((e) => !e.disabled && e.label.toLowerCase().startsWith(n));
-			r && N(r.value);
+		let n = F(e);
+		if (n) {
+			let e = R().find((e) => !e.disabled && e.label.toLowerCase().startsWith(n));
+			e && P(e.value);
 		}
-	}, G = (e) => `${R.id}-option-${e}`;
-	return /* @__PURE__ */ b(v, { children: [
-		/* @__PURE__ */ b("button", {
+	}, K = (e) => `${z.id}-option-${e}`;
+	return /* @__PURE__ */ x(y, { children: [
+		/* @__PURE__ */ x("button", {
 			type: "button",
-			...D,
-			...j,
-			id: A,
-			disabled: l,
+			...O,
+			...M,
+			id: j,
+			disabled: u,
 			"aria-haspopup": "listbox",
-			...R.triggerProps,
+			...z.triggerProps,
 			style: {
-				...R.triggerProps.style,
-				...T
+				...z.triggerProps.style,
+				...E
 			},
 			onKeyDown: (e) => {
-				E?.(e), ["ArrowDown", "ArrowUp"].includes(e.key) && !R.open && (e.preventDefault(), R.setOpen(!0));
+				D?.(e), ["ArrowDown", "ArrowUp"].includes(e.key) && !z.open && (e.preventDefault(), z.setOpen(!0));
 			},
-			className: e("zen__select group", r, "w-full", R.open && "border-glow/60 [--glow-border-color:transparent] shadow-[0_0_0_3px_oklch(var(--glow)/0.16),0_0_24px_-6px_oklch(var(--glow)/0.6)]", h),
-			children: [/* @__PURE__ */ y("span", {
-				className: e("truncate", H === void 0 && "text-muted-foreground"),
-				children: H ?? c
-			}), /* @__PURE__ */ y(o, { open: R.open })]
+			className: e("zen__select group", i, "w-full", z.open && "border-glow/60 [--glow-border-color:transparent] shadow-[0_0_0_3px_oklch(var(--glow)/0.16),0_0_24px_-6px_oklch(var(--glow)/0.6)]", g),
+			children: [/* @__PURE__ */ b("span", {
+				className: e("truncate", U === void 0 && "text-muted-foreground"),
+				children: U ?? l
+			}), /* @__PURE__ */ b(s, { open: z.open })]
 		}),
-		u && /* @__PURE__ */ y("input", {
+		d && /* @__PURE__ */ b("input", {
 			type: "hidden",
-			name: u,
-			value: i ?? ""
+			name: d,
+			value: a ?? ""
 		}),
-		/* @__PURE__ */ y("div", {
-			...R.popupProps,
-			className: e("zen__popover", n, "overflow-visible py-1", S),
-			children: /* @__PURE__ */ y("div", {
-				ref: O,
+		/* @__PURE__ */ b("div", {
+			...z.popupProps,
+			className: e("zen__popover", r, "overflow-visible py-1", C),
+			children: /* @__PURE__ */ b("div", {
+				ref: k,
 				role: "listbox",
 				tabIndex: -1,
-				"aria-label": D["aria-label"],
-				"aria-labelledby": D["aria-label"] ? void 0 : A,
-				"aria-activedescendant": M === null ? void 0 : G(M),
-				onKeyDown: W,
+				"aria-label": O["aria-label"],
+				"aria-labelledby": O["aria-label"] ? void 0 : j,
+				"aria-activedescendant": N === null ? void 0 : K(N),
+				onKeyDown: G,
 				className: "max-h-72 overflow-y-auto outline-hidden",
-				children: /* @__PURE__ */ y(x.Provider, {
+				children: /* @__PURE__ */ b(S.Provider, {
 					value: {
-						value: i,
-						active: M,
-						setActive: N,
-						choose: z,
-						optionId: G,
-						register: B
+						value: a,
+						active: N,
+						setActive: P,
+						choose: B,
+						optionId: K,
+						register: V
 					},
-					children: w
+					children: T
 				})
 			})
 		})
 	] });
 }
-function C(e, t) {
-	s.forEach(e, (e) => {
-		if (!u(e)) return;
+function w(e, t) {
+	c.forEach(e, (e) => {
+		if (!d(e)) return;
 		let n = e;
-		if (n.type === T && n.props.value !== void 0) {
-			let e = n.props.label ?? w(n.props.children);
+		if (n.type === E && n.props.value !== void 0) {
+			let e = n.props.label ?? T(n.props.children);
 			e && t.set(n.props.value, e);
-		} else (n.type === E || n.type === c) && C(n.props.children, t);
+		} else (n.type === D || n.type === l) && w(n.props.children, t);
 	});
 }
-var w = (e) => typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(w).join("") : "";
-function T({ value: t, label: n, disabled: r, className: a, children: o }) {
-	let s = f(x);
+var T = (e) => typeof e == "string" || typeof e == "number" ? String(e) : Array.isArray(e) ? e.map(T).join("") : "";
+function E({ value: t, label: n, disabled: r, className: i, children: o }) {
+	let s = p(S);
 	if (!s) throw Error("SelectItem must be inside a Select");
-	let c = g(null), l = n ?? w(o), u = s.register;
-	h(() => u(t, l || c.current?.textContent?.trim() || ""), [
+	let c = _(null), l = n ?? T(o), u = s.register;
+	g(() => u(t, l || c.current?.textContent?.trim() || ""), [
 		u,
 		t,
 		l
 	]);
 	let d = s.value === t;
-	return /* @__PURE__ */ b("div", {
+	return /* @__PURE__ */ x("div", {
 		ref: c,
 		id: s.optionId(t),
 		role: "option",
@@ -155,33 +149,33 @@ function T({ value: t, label: n, disabled: r, className: a, children: o }) {
 		"data-highlighted": s.active === t || void 0,
 		onMouseMove: () => !r && s.setActive(t),
 		onClick: () => s.choose(t),
-		className: e("grid cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 px-3 py-2 text-sm outline-hidden select-none", "data-highlighted:bg-muted aria-disabled:cursor-not-allowed aria-disabled:opacity-50", a),
-		children: [/* @__PURE__ */ y("span", {
+		className: e("grid cursor-pointer grid-cols-[1rem_1fr] items-center gap-2 px-3 py-2 text-sm outline-hidden select-none", "data-highlighted:bg-muted aria-disabled:cursor-not-allowed aria-disabled:opacity-50", i),
+		children: [/* @__PURE__ */ b("span", {
 			className: "text-primary col-start-1",
 			"aria-hidden": !0,
-			children: d && /* @__PURE__ */ y(i, {})
-		}), /* @__PURE__ */ y("span", {
+			children: d && /* @__PURE__ */ b(a, {})
+		}), /* @__PURE__ */ b("span", {
 			className: "col-start-2 truncate",
 			children: o
 		})]
 	});
 }
-function E({ label: e, children: t }) {
-	return /* @__PURE__ */ b("div", {
+function D({ label: e, children: t }) {
+	return /* @__PURE__ */ x("div", {
 		role: "group",
 		"aria-label": typeof e == "string" ? e : void 0,
-		children: [/* @__PURE__ */ y("div", {
+		children: [/* @__PURE__ */ b("div", {
 			"aria-hidden": !0,
 			className: "text-muted-foreground px-3 pt-2 pb-1 text-xs font-medium",
 			children: e
 		}), t]
 	});
 }
-function D() {
-	return /* @__PURE__ */ y("div", {
+function O() {
+	return /* @__PURE__ */ b("div", {
 		role: "separator",
 		className: "bg-tint/[0.07] mx-2 my-1 h-px"
 	});
 }
 //#endregion
-export { E as SelectGroup, T as SelectItem, D as SelectSeparator, S as default };
+export { D as SelectGroup, E as SelectItem, O as SelectSeparator, C as default };

package/dist/slider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/slider/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAoC,MAAM,OAAO,CAAC;AAEzE;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC3B,KAAK,EACL,GAAO,EACP,GAAS,EACT,IAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,UAAU,EACV,SAAS,EACT,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACV,EAAE,WAAW,+BAiDb;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CACrC,cAAc,CAAC,OAAO,CAAC,EACvB,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,UAAU,GAAG,cAAc,CAC1E;IACG,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iDAAiD;IACjD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oDAAoD;IACpD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACzC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/slider/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAoC,MAAM,OAAO,CAAC;AAEzE;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC3B,KAAK,EACL,GAAO,EACP,GAAS,EACT,IAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,UAAU,EACV,SAAS,EACT,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACV,EAAE,WAAW,+BAkDb;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CACrC,cAAc,CAAC,OAAO,CAAC,EACvB,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,UAAU,GAAG,cAAc,CAC1E;IACG,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iDAAiD;IACjD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,oDAAoD;IACpD,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACzC"}

package/dist/slider/index.js

@@ -26,7 +26,7 @@ function i({ value: i, min: a = 0, max: o = 100, step: s = 1, onValueChange: c,
 			"--zen-track": y,
 			"--zen-thumb": d ?? "oklch(var(--primary))"
 		},
-		className: e("zen__slider h-5 w-full cursor-pointer appearance-none bg-transparent outline-hidden disabled:cursor-not-allowed disabled:opacity-50", "[&::-webkit-slider-runnable-track]:h-2.5 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:[background:var(--zen-track)]", "[&::-moz-range-track]:h-2.5 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:[background:var(--zen-track)]", "[&::-webkit-slider-thumb]:-mt-[5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2 [&::-webkit-slider-thumb]:border-white [&::-webkit-slider-thumb]:shadow-[0_0_0_1px_oklch(0_0_0/0.3),0_0_16px_oklch(var(--glow)/0.8)] [&::-webkit-slider-thumb]:[background:var(--zen-thumb)]", "[&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-white [&::-moz-range-thumb]:shadow-[0_0_0_1px_oklch(0_0_0/0.3),0_0_16px_oklch(var(--glow)/0.8)] [&::-moz-range-thumb]:[background:var(--zen-thumb)]", "focus-visible:[&::-webkit-slider-thumb]:ring-ring/40 focus-visible:[&::-webkit-slider-thumb]:ring-4", p),
+		className: e("zen__slider h-5 w-full cursor-pointer appearance-none bg-transparent outline-hidden disabled:cursor-not-allowed disabled:opacity-50", "[&::-webkit-slider-runnable-track]:h-2.5 [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:[background:var(--zen-track)]", "[&::-moz-range-track]:h-2.5 [&::-moz-range-track]:rounded-full [&::-moz-range-track]:[background:var(--zen-track)]", "[&::-webkit-slider-thumb]:-mt-[5px] [&::-webkit-slider-thumb]:size-5 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:border-2 [&::-webkit-slider-thumb]:border-white [&::-webkit-slider-thumb]:shadow-[0_0_0_1px_oklch(0_0_0/0.3),0_0_16px_oklch(var(--glow)/0.8)] [&::-webkit-slider-thumb]:[background:var(--zen-thumb)]", "[&::-moz-range-thumb]:size-5 [&::-moz-range-thumb]:rounded-full [&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-white [&::-moz-range-thumb]:shadow-[0_0_0_1px_oklch(0_0_0/0.3),0_0_16px_oklch(var(--glow)/0.8)] [&::-moz-range-thumb]:[background:var(--zen-thumb)]", "focus-visible:[&::-webkit-slider-thumb]:ring-ring/40 focus-visible:[&::-webkit-slider-thumb]:ring-4", "focus-visible:[&::-moz-range-thumb]:ring-ring/40 focus-visible:[&::-moz-range-thumb]:ring-4", p),
 		...h
 	});
 }

package/dist/status-pill/index.d.ts

@@ -0,0 +1,18 @@
+import { ComponentProps } from 'react';
+/**
+ * A small rounded status that changes in place, e.g. an app's "Saving…",
+ * "Saved", "Not saved · Retry": an icon (a Spinner, a Check) and a few words.
+ * `quiet` fades it back once the news is old (a save a few seconds ago).
+ * Changes are read out politely (role="status"). For an action inside it,
+ * such as Retry, use StatusPillAction. For a fixed label or count, use Badge.
+ */
+export default function StatusPill({ tone, quiet, className, ...rest }: StatusPillProps): import('react').JSX.Element;
+/** A text button inside a StatusPill, e.g. Retry, in the pill's colour. */
+export declare function StatusPillAction({ className, type, ...rest }: ComponentProps<'button'>): import('react').JSX.Element;
+export interface StatusPillProps extends ComponentProps<'span'> {
+    /** `positive` in the accent colour (done), `negative` in red (failed); `default` is muted (in progress). */
+    tone?: 'default' | 'positive' | 'negative';
+    /** Faded back into the page: the news is old. */
+    quiet?: boolean;
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/status-pill/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/status-pill/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAQvC;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EAAE,IAAgB,EAAE,KAAa,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAa1G;AAED,2EAA2E;AAC3E,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,IAAe,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,QAAQ,CAAC,+BAWjG;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc,CAAC,MAAM,CAAC;IAC3D,4GAA4G;IAC5G,IAAI,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;IAC3C,iDAAiD;IACjD,KAAK,CAAC,EAAE,OAAO,CAAC;CACnB"}

package/dist/status-pill/index.js

@@ -0,0 +1,25 @@
+"use client";
+import { cx as e } from "../utils/cx.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region packages/status-pill/index.tsx
+var n = {
+	default: "border-tint/10 bg-tint/[0.05] text-muted-foreground",
+	positive: "border-primary/35 bg-primary/12 text-primary",
+	negative: "border-destructive/40 bg-destructive/15 text-destructive"
+};
+function r({ tone: r = "default", quiet: i = !1, className: a, ...o }) {
+	return /* @__PURE__ */ t("span", {
+		role: "status",
+		...o,
+		className: e("zen__status-pill inline-flex items-center gap-1.5 rounded-full border px-2.5 py-1 text-xs font-medium whitespace-nowrap [&_svg]:size-3.5 [&_svg]:shrink-0", "transition-[color,background-color,border-color,opacity] duration-300", i ? "text-muted-foreground border-transparent bg-transparent opacity-80" : n[r], a)
+	});
+}
+function i({ className: n, type: r = "button", ...i }) {
+	return /* @__PURE__ */ t("button", {
+		type: r,
+		...i,
+		className: e("ml-0.5 cursor-pointer rounded-full underline underline-offset-2 outline-hidden focus-visible:ring-2 focus-visible:ring-current/50", n)
+	});
+}
+//#endregion
+export { i as StatusPillAction, r as default };

package/dist/tab-bar/index.js

@@ -15,7 +15,7 @@ function a({ hideFrom: t = "md", className: i, children: a, ...o }) {
 		})
 	});
 }
-var o = e("flex flex-col items-center gap-1 py-2.5 text-[0.7rem] outline-hidden transition-colors duration-200 focus-visible:bg-tint/5", "text-muted-foreground aria-[current=page]:text-primary [&_svg]:size-5 aria-[current=page]:[&_svg]:drop-shadow-[0_0_8px_oklch(var(--glow)/0.8)]");
+var o = e("flex flex-col items-center gap-1 py-2.5 text-[0.7rem] outline-hidden transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-ring/60 focus-visible:ring-inset", "text-muted-foreground aria-[current=page]:text-primary [&_svg]:size-5 aria-[current=page]:[&_svg]:drop-shadow-[0_0_8px_oklch(var(--glow)/0.8)]");
 function s({ icon: n, active: a, asChild: s, className: c, children: l, ...u }) {
 	let d = {
 		...u,

package/dist/table/index.js

@@ -71,7 +71,7 @@ function g({ numeric: r, sticky: i, sortDirection: a, onSort: o, scope: s = "col
 		children: o ? /* @__PURE__ */ l("button", {
 			type: "button",
 			onClick: o,
-			className: e("hover:text-foreground inline-flex items-center gap-1 align-middle leading-5 tracking-wider uppercase", r && "flex-row-reverse"),
+			className: e("hover:text-foreground inline-flex cursor-pointer items-center gap-1 align-middle leading-5 tracking-wider uppercase", r && "flex-row-reverse"),
 			children: [d, /* @__PURE__ */ c("span", {
 				"aria-hidden": !0,
 				className: "inline-flex w-3",

package/dist/tabs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/tabs/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAqE,MAAM,OAAO,CAAC;AAgB1G,6GAA6G;AAC7G,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,KAAK,EAAE,YAAiB,EAAE,aAAa,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,+BAetG;AAID;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EAAE,OAAqB,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,YAAY,+BAiC5F;AA4BD,wBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,QAAQ,+BA0BnE;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,sCAapE;AAED,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,cAAc,CAAC;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAED,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,OAAO,CAAC;AAEnD,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,KAAK,CAAC;IACvD,OAAO,CAAC,EAAE,cAAc,CAAC;CAC5B;AAED,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACrE,KAAK,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,KAAK,CAAC;IACxD,KAAK,EAAE,MAAM,CAAC;CACjB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/tabs/index.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,cAAc,EAAqE,MAAM,OAAO,CAAC;AAgB1G,6GAA6G;AAC7G,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,KAAK,EAAE,YAAiB,EAAE,aAAa,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,+BAetG;AAID;;;;GAIG;AACH,wBAAgB,OAAO,CAAC,EAAE,OAAqB,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,YAAY,+BAiC5F;AAiCD,wBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,QAAQ,+BA0BnE;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,sCAgBpE;AAED,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,cAAc,CAAC;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAED,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,OAAO,CAAC;AAEnD,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,KAAK,CAAC;IACvD,OAAO,CAAC,EAAE,cAAc,CAAC;CAC5B;AAED,MAAM,WAAW,QAAS,SAAQ,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACrE,KAAK,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,KAAK,CAAC;IACxD,KAAK,EAAE,MAAM,CAAC;CACjB"}

package/dist/tabs/index.js

@@ -72,14 +72,18 @@ function _({ ref: t, className: r, children: i, ...a }) {
 		},
 		className: e("border-border relative flex gap-1 border-b", r),
 		...a,
-		children: [i, s && /* @__PURE__ */ u("span", {
+		children: [i, s ? /* @__PURE__ */ u("span", {
 			"aria-hidden": !0,
-			className: "bg-primary absolute bottom-[-1px] left-0 h-0.5 transition-[translate,width] duration-150 ease-in-out",
+			className: "zen__tab-bar bg-primary absolute bottom-[-1px] left-0 h-0.5 transition-[translate,width] duration-150 ease-in-out",
 			style: {
 				width: s.w,
 				translate: `${s.x}px 0`
 			}
-		})]
+		}, "measured") : /* @__PURE__ */ u("span", {
+			"aria-hidden": !0,
+			"data-pending": !0,
+			className: "zen__tab-bar hidden"
+		}, "pending")]
 	});
 }
 function v({ value: n, className: r, onClick: i, ...a }) {
@@ -95,7 +99,7 @@ function v({ value: n, className: r, onClick: i, ...a }) {
 		onClick: (e) => {
 			c(n), i?.(e);
 		},
-		className: e(d === "pills" ? t : "focus-visible:ring-ring text-muted-foreground hover:text-foreground data-active:text-foreground px-3 py-2 text-sm whitespace-nowrap outline-hidden select-none focus-visible:ring-1", r),
+		className: e(d === "pills" ? t : "focus-visible:ring-ring text-muted-foreground hover:text-foreground data-active:text-foreground cursor-pointer px-3 py-2 text-sm whitespace-nowrap outline-hidden select-none focus-visible:ring-1 disabled:cursor-not-allowed", r),
 		...a
 	});
 }
@@ -106,7 +110,7 @@ function y({ value: t, className: n, ...r }) {
 		id: a("panel", t),
 		"aria-labelledby": a("tab", t),
 		tabIndex: 0,
-		className: e("outline-hidden", n),
+		className: e("focus-visible:outline-ring/50 outline-hidden focus-visible:outline-2 focus-visible:outline-offset-4", n),
 		...r
 	}) : null;
 }

package/dist/theme-toggle/index.d.ts

@@ -9,7 +9,8 @@ export declare function ThemeScript({ storageKey }: {
 }): import('react').JSX.Element;
 /**
  * Switches <html> between the dark and light themes and remembers the choice
- * (localStorage). Add ThemeScript to <head> to apply it on the next visit.
+ * (localStorage); the new theme spreads from the button like a drop of water (themeWave).
+ * Add ThemeScript to <head> to apply it on the next visit.
  */
 export default function ThemeToggle({ storageKey, className }: ThemeToggleProps): import('react').JSX.Element;
 export interface ThemeToggleProps {

package/dist/theme-toggle/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/theme-toggle/index.tsx"],"names":[],"mappings":"AAKA,qFAAqF;AACrF,eAAO,MAAM,WAAW,GAAI,mBAAoB,WAC4I,CAAC;AAE7L;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAAE,UAAoB,EAAE,EAAE;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,+BAE5E;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,UAAoB,EAAE,SAAS,EAAE,EAAE,gBAAgB,+BA6CxF;AAED,MAAM,WAAW,gBAAgB;IAC7B,wEAAwE;IACxE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/theme-toggle/index.tsx"],"names":[],"mappings":"AASA,qFAAqF;AACrF,eAAO,MAAM,WAAW,GAAI,mBAAoB,WAC4I,CAAC;AAE7L;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAAE,UAAoB,EAAE,EAAE;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,+BAE5E;AAiBD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,UAAoB,EAAE,SAAS,EAAE,EAAE,gBAAgB,+BAgCxF;AAED,MAAM,WAAW,gBAAgB;IAC7B,wEAAwE;IACxE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB"}

package/dist/theme-toggle/index.js

@@ -1,43 +1,46 @@
 "use client";
 import { cx as e } from "../utils/cx.js";
-import { useEffect as t, useState as n } from "react";
-import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+import t from "../icons/micro/moon.js";
+import n from "../icons/micro/sun.js";
+import { prepareThemeWave as r, themeWave as i } from "../utils/theme-wave.js";
+import { useSyncExternalStore as a } from "react";
+import { jsx as o } from "react/jsx-runtime";
+import { flushSync as s } from "react-dom";
 //#region packages/theme-toggle/index.tsx
-var o = (e = "theme") => `try{var t=localStorage.getItem(${JSON.stringify(e)}),r=document.documentElement;if(t==='light'||t==='dark'){r.classList.remove('light','dark');r.classList.add(t)}}catch(e){}`;
-function s({ storageKey: e = "theme" }) {
-	return /* @__PURE__ */ i("script", { dangerouslySetInnerHTML: { __html: o(e) } });
+var c = (e = "theme") => `try{var t=localStorage.getItem(${JSON.stringify(e)}),r=document.documentElement;if(t==='light'||t==='dark'){r.classList.remove('light','dark');r.classList.add(t)}}catch(e){}`;
+function l({ storageKey: e = "theme" }) {
+	return /* @__PURE__ */ o("script", { dangerouslySetInnerHTML: { __html: c(e) } });
 }
-function c({ storageKey: o = "theme", className: s }) {
-	let [c, l] = n("dark");
-	t(() => l(document.documentElement.classList.contains("light") ? "light" : "dark"), []);
-	let u = c === "dark" ? "light" : "dark";
-	return /* @__PURE__ */ i("button", {
+var u = /* @__PURE__ */ new Set();
+function d(e) {
+	u.add(e);
+	let t = new MutationObserver(e);
+	return t.observe(document.documentElement, {
+		attributes: !0,
+		attributeFilter: ["class"]
+	}), () => {
+		u.delete(e), t.disconnect();
+	};
+}
+var f = () => document.documentElement.classList.contains("light") ? "light" : "dark";
+function p({ storageKey: c = "theme", className: l }) {
+	let p = a(d, f, () => "dark"), m = p === "dark" ? "light" : "dark";
+	return /* @__PURE__ */ o("button", {
 		type: "button",
-		"aria-label": `Switch to ${u} theme`,
-		onClick: () => {
+		"aria-label": `Switch to ${m} theme`,
+		onPointerEnter: r,
+		onFocus: r,
+		onClick: (e) => i(() => {
 			let e = document.documentElement;
-			e.classList.remove("dark", "light"), e.classList.add(u);
+			e.classList.remove("dark", "light"), e.classList.add(m);
 			try {
-				localStorage.setItem(o, u);
+				localStorage.setItem(c, m);
 			} catch {}
-			l(u);
-		},
-		className: e("zen__theme-toggle text-muted-foreground hover:bg-tint/[0.06] hover:text-foreground focus-visible:ring-ring/50 grid size-9 place-items-center rounded-lg outline-hidden focus-visible:ring-2", s),
-		children: /* @__PURE__ */ i("svg", {
-			viewBox: "0 0 16 16",
-			fill: "none",
-			stroke: "currentColor",
-			strokeWidth: "1.5",
-			strokeLinecap: "round",
-			className: "size-4",
-			"aria-hidden": !0,
-			children: c === "dark" ? /* @__PURE__ */ i("path", { d: "M13.5 9.5A5.5 5.5 0 0 1 6.5 2.5a5.5 5.5 0 1 0 7 7Z" }) : /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("circle", {
-				cx: "8",
-				cy: "8",
-				r: "3"
-			}), /* @__PURE__ */ i("path", { d: "M8 1v1.5M8 13.5V15M1 8h1.5M13.5 8H15M3.05 3.05l1.06 1.06M11.89 11.89l1.06 1.06M3.05 12.95l1.06-1.06M11.89 4.11l1.06-1.06" })] })
-		})
+			s(() => u.forEach((e) => e()));
+		}, e.currentTarget),
+		className: e("zen__theme-toggle text-muted-foreground hover:bg-tint/[0.06] hover:text-foreground focus-visible:ring-ring/50 grid size-9 cursor-pointer place-items-center rounded-lg outline-hidden focus-visible:ring-2", l),
+		children: o(p === "dark" ? t : n, { className: "size-4" })
 	});
 }
 //#endregion
-export { s as ThemeScript, c as default, o as themeScript };
+export { l as ThemeScript, p as default, c as themeScript };