@box-kite/react 0.0.1 → 1.0.0

package/a11y.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./behavior.cjs");exports.useControllableState=e.a,exports.useDismiss=e.i,exports.useFocusReturn=e.r,exports.useIdentifier=e.n,exports.useRovingFocus=e.t;

package/a11y.d.ts

@@ -0,0 +1,15 @@
+/**
+ * `@box-kite/react/a11y` — the behaviour primitives the accessible components are built from. Every
+ * APG pattern needs the same four mechanics (return focus, move through a list, dismiss, hold a value the
+ * consumer may own), none of them visible in the markup, so they live here once and are published because
+ * this library will never cover every pattern. Client hooks: the entry carries a `'use client'` banner.
+ */
+export { default as useControllableState } from './react/a11y/useControllableState';
+export type { ChangeDetails, ChangeHandler, ControllableStateOptions, SetControllableState } from './react/a11y/useControllableState';
+export { default as useDismiss } from './react/a11y/useDismiss';
+export type { DismissOptions, DismissReason, ElementLike } from './react/a11y/useDismiss';
+export { default as useFocusReturn } from './react/a11y/useFocusReturn';
+export type { FocusReturnOptions } from './react/a11y/useFocusReturn';
+export { default as useIdentifier } from './react/a11y/useIdentifier';
+export { default as useRovingFocus } from './react/a11y/useRovingFocus';
+export type { RovingFocus, RovingFocusItemProps, RovingFocusOptions, RovingFocusReason, RovingOrientation, } from './react/a11y/useRovingFocus';

package/a11y.mjs

@@ -0,0 +1,3 @@
+"use client";
+import { a as e, i as t, n, r, t as i } from "./behavior.mjs";
+export { e as useControllableState, t as useDismiss, r as useFocusReturn, n as useIdentifier, i as useRovingFocus };

package/behavior.cjs

@@ -0,0 +1 @@
+const e=require("./rolldown-runtime.cjs"),t=require("./platform.cjs"),n=require("./effects.cjs");let r=require("react");r=e.t(r,1);function i(e){let t=(0,r.useRef)(e);return n.n(()=>{t.current=e}),t}function a(e){let t=i(e);return(0,r.useCallback)((...e)=>t.current?.(...e),[t])}function o(e){let{value:t,defaultValue:n,onChange:o}=e,s=t!==void 0,[c,l]=(0,r.useState)(n),u=s?t:c,d=i(u),f=a(o);return[u,(0,r.useCallback)((e,t)=>{let n=typeof e==`function`?e(d.current):e;Object.is(n,d.current)||(l(n),f(n,t))},[f,d])]}var s=[];function c(e,t){let n=t.elements();return e.elements().some(e=>n.some(t=>e!==t&&e.contains(t)))}function l(){let e=s.filter(e=>!s.some(t=>t!==e&&c(e,t)));return e[e.length-1]}function u(e){let{enabled:r=!0,onDismiss:o,inside:c,escapeKey:u=!0,outsidePointer:d=!0}=e,f=i(c),p=a(o);n.n(()=>{if(!r)return;let e={elements:()=>(f.current??[]).map(e=>t.r(e)).filter(e=>e!==null)};s.push(e);let n=new AbortController,i=(e,t)=>document.addEventListener(e,t,{signal:n.signal});return u&&i(`keydown`,t=>{t.key!==`Escape`||t.defaultPrevented||l()===e&&p(`escape`,t)}),d&&i(`pointerdown`,e=>{t.a(e,f.current??[])||p(`outside-pointer`,e)}),()=>{n.abort();let t=s.indexOf(e);t!==-1&&s.splice(t,1)}},[r,u,d,p,f])}function d(){let e=t.t()?.activeElement;return e&&e!==document.body?e:null}function f(e={}){let{enabled:n=!0,returnTo:i,preventScroll:o}=e,[s,c]=(0,r.useState)(null),[l,u]=(0,r.useState)(!1);n!==l&&(u(n),n&&c(d()));let f=a(()=>{(t.i(i)??s)?.focus({preventScroll:o})});return(0,r.useEffect)(()=>{if(n)return()=>{let e=document.activeElement;(!e||e===document.body||!document.contains(e))&&f()}},[n,f]),{returnFocus:f}}var p=r.default.useId??(()=>void 0),m=0;function h(e){return e.replace(/[^\w-]/g,``)}function g(e=`box`){let t=p(),[n]=(0,r.useState)(()=>`${++m}`);return`${e}-${t?h(t):n}`}var _=1e3,v=10;function y(e,t){return t<0?-1:Math.max(0,Math.min(e,t))}function b(e,t,n,r,i){if(n===0)return-1;let a=e;for(let e=0;e<n;e++){if(a+=t,a<0||a>=n){if(!r)return-1;a=(a%n+n)%n}if(!i?.(a))return a}return-1}function x(e,t,n){return b(e===1?-1:t,e,t,!1,n)}function S(e,t,n,r,i){if(n===0)return-1;let a=[...e],o=a.every(e=>e===a[0]),s=(o?a[0]:e).toLowerCase(),c=o?t+1:t;for(let e=0;e<n;e++){let t=((c+e)%n+n)%n;if(!i?.(t)&&r(t).trim().toLowerCase().startsWith(s))return t}return-1}function C(e){return e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey}function w(e){let{count:n,columns:a,columnIndexOf:s,pageSize:c=v,defaultActiveColumn:l=0,onActiveCellChange:u,orientation:d=`vertical`,loop:f=!0,activeIndex:p,defaultActiveIndex:m=0,onActiveIndexChange:h,isDisabled:g,textOf:w,focusItems:T=!0,onSelect:E}=e,[D,O]=o({value:p,defaultValue:m,onChange:h}),k=Math.min(D,n-1),A=a!==void 0,j=(0,r.useCallback)(e=>typeof a==`function`?a(e):a??0,[a]),M=(0,r.useCallback)((e,t)=>{let n=j(e);if(!s)return y(t,n-1);if(n<=0)return-1;let r=0;for(;r+1<n&&s(e,r+1)<=t;)r++;return r},[s,j]),[N,P]=(0,r.useState)(l),F=A&&k>=0?M(k,N):-1,I=(0,r.useRef)([]),L=(0,r.useRef)(new Map),R=(0,r.useRef)(new Map),z=(0,r.useRef)(new Map),B=(0,r.useRef)({query:``,at:0}),V=(0,r.useCallback)(e=>{I.current[e]?.focus()},[]),H=(0,r.useRef)(!1),U=(0,r.useCallback)((e,t)=>{H.current=!0,R.current.get(`${e}:${t}`)?.focus(),H.current=!1},[]),W=(0,r.useCallback)(()=>A?R.current.get(`${k}:${F}`)??null:I.current[k]??null,[F,k,A]),G=i({row:k,column:F}),K=i(N),q=i(u),J=i(j),Y=i(M),X=i(s),Z=(0,r.useCallback)((e,t,r)=>{let i=y(e,n-1),a=Math.max(0,t),o=i<0?-1:Y.current(i,a),s=G.current;return i===s.row&&o===s.column?s:(O(i,r),P(a),q.current?.({row:i,column:o},r),{row:i,column:o})},[G,Y,q,n,O]),Q=(0,r.useCallback)((e,t,r)=>{let i=y(e,n-1),a=i<0?-1:y(Math.max(0,t),J.current(i)-1);return Z(i,a<0?0:X.current?.(i,a)??a,r)},[X,n,Z,J]),ee=(0,r.useCallback)((e,t)=>{let n=`${e}:${t}`;return z.current.has(n)||z.current.set(n,e=>{e?R.current.set(n,e):(R.current.delete(n),z.current.delete(n))}),{ref:z.current.get(n),tabIndex:e===k&&t===F?0:-1,onFocus:()=>{H.current||Q(e,t,{reason:`focus`})}}},[F,k,Q]),te=(0,r.useCallback)(e=>(L.current.has(e)||L.current.set(e,t=>{I.current[e]=t}),{ref:L.current.get(e),tabIndex:T?e===k?0:-1:void 0,onFocus:T?()=>O(e,{reason:`focus`}):void 0}),[k,T,O]),$=(0,r.useCallback)(e=>{let{row:r,column:i}=G.current,a=(t,n)=>{e.preventDefault();let r=Q(t,n,{reason:`keyboard`,event:e});T&&U(r.row,r.column)},o=t=>{e.preventDefault();let n=Z(t,K.current,{reason:`keyboard`,event:e});T&&U(n.row,n.column)},s=2**53-1,l=()=>t.o(e.currentTarget)?-1:1;switch(e.key){case`ArrowRight`:return a(r,i+l());case`ArrowLeft`:return a(r,i-l());case`ArrowDown`:return o(r+1);case`ArrowUp`:return o(r-1);case`Home`:return e.ctrlKey||e.metaKey?a(0,0):a(r,0);case`End`:return e.ctrlKey||e.metaKey?a(n-1,s):a(r,s);case`PageDown`:return o(r+c);case`PageUp`:return o(r-c)}},[G,n,K,U,T,c,Z,Q]);return{activeIndex:k,activeColumn:F,setActiveIndex:O,setActiveCell:Q,onKeyDown:(0,r.useCallback)(e=>{if(e.defaultPrevented)return;if(A){$(e);return}let r=d!==`horizontal`,i=d!==`vertical`,a=B.current,o=a.query!==``&&e.timeStamp-a.at<_,s=(t,n)=>{t!==-1&&t!==k&&(e.preventDefault(),O(t,{reason:n,event:e}),T&&V(t))};if(i&&(e.key===`ArrowRight`||e.key===`ArrowLeft`)){let r=e.key===`ArrowRight`!==t.o(e.currentTarget);s(b(k,r?1:-1,n,f,g),`keyboard`);return}if(e.key===`ArrowDown`&&r){s(b(k,1,n,f,g),`keyboard`);return}if(e.key===`ArrowUp`&&r){s(b(k,-1,n,f,g),`keyboard`);return}if(e.key===`Home`){s(x(1,n,g),`keyboard`);return}if(e.key===`End`){s(x(-1,n,g),`keyboard`);return}if(e.key===`Enter`||e.key===` `&&!(o&&w)){if(!E||k===-1)return;e.preventDefault(),E(k,e);return}w&&C(e)&&(a.query=o?a.query+e.key:e.key,a.at=e.timeStamp,s(S(a.query,k,n,w,g),`typeahead`))},[k,n,V,T,g,A,f,$,E,d,O,w]),itemProps:te,cellProps:ee,activeItem:W}}Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return o}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return g}}),Object.defineProperty(exports,"o",{enumerable:!0,get:function(){return a}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return w}});

package/behavior.mjs

@@ -0,0 +1,295 @@
+import { a as e, i as t, o as n, r, t as i } from "./platform.mjs";
+import { n as a } from "./effects.mjs";
+import o, { useCallback as s, useEffect as c, useRef as l, useState as u } from "react";
+//#region src/react/a11y/callbacks.ts
+function d(e) {
+	let t = l(e);
+	return a(() => {
+		t.current = e;
+	}), t;
+}
+function f(e) {
+	let t = d(e);
+	return s((...e) => t.current?.(...e), [t]);
+}
+//#endregion
+//#region src/react/a11y/useControllableState.ts
+function p(e) {
+	let { value: t, defaultValue: n, onChange: r } = e, i = t !== void 0, [a, o] = u(n), c = i ? t : a, l = d(c), p = f(r);
+	return [c, s((e, t) => {
+		let n = typeof e == "function" ? e(l.current) : e;
+		Object.is(n, l.current) || (o(n), p(n, t));
+	}, [p, l])];
+}
+//#endregion
+//#region src/react/a11y/useDismiss.ts
+var m = [];
+function h(e, t) {
+	let n = t.elements();
+	return e.elements().some((e) => n.some((t) => e !== t && e.contains(t)));
+}
+function g() {
+	let e = m.filter((e) => !m.some((t) => t !== e && h(e, t)));
+	return e[e.length - 1];
+}
+function _(t) {
+	let { enabled: n = !0, onDismiss: i, inside: o, escapeKey: s = !0, outsidePointer: c = !0 } = t, l = d(o), u = f(i);
+	a(() => {
+		if (!n) return;
+		let t = { elements: () => (l.current ?? []).map((e) => r(e)).filter((e) => e !== null) };
+		m.push(t);
+		let i = new AbortController(), a = (e, t) => document.addEventListener(e, t, { signal: i.signal });
+		return s && a("keydown", (e) => {
+			e.key !== "Escape" || e.defaultPrevented || g() === t && u("escape", e);
+		}), c && a("pointerdown", (t) => {
+			e(t, l.current ?? []) || u("outside-pointer", t);
+		}), () => {
+			i.abort();
+			let e = m.indexOf(t);
+			e !== -1 && m.splice(e, 1);
+		};
+	}, [
+		n,
+		s,
+		c,
+		u,
+		l
+	]);
+}
+//#endregion
+//#region src/react/a11y/useFocusReturn.ts
+function v() {
+	let e = i()?.activeElement;
+	return e && e !== document.body ? e : null;
+}
+function y(e = {}) {
+	let { enabled: n = !0, returnTo: r, preventScroll: i } = e, [a, o] = u(null), [s, l] = u(!1);
+	n !== s && (l(n), n && o(v()));
+	let d = f(() => {
+		(t(r) ?? a)?.focus({ preventScroll: i });
+	});
+	return c(() => {
+		if (n) return () => {
+			let e = document.activeElement;
+			(!e || e === document.body || !document.contains(e)) && d();
+		};
+	}, [n, d]), { returnFocus: d };
+}
+//#endregion
+//#region src/react/a11y/useIdentifier.ts
+var b = o.useId ?? (() => void 0), x = 0;
+function S(e) {
+	return e.replace(/[^\w-]/g, "");
+}
+function C(e = "box") {
+	let t = b(), [n] = u(() => `${++x}`);
+	return `${e}-${t ? S(t) : n}`;
+}
+//#endregion
+//#region src/react/a11y/useRovingFocus.ts
+var ee = 1e3, w = 10;
+function T(e, t) {
+	return t < 0 ? -1 : Math.max(0, Math.min(e, t));
+}
+function E(e, t, n, r, i) {
+	if (n === 0) return -1;
+	let a = e;
+	for (let e = 0; e < n; e++) {
+		if (a += t, a < 0 || a >= n) {
+			if (!r) return -1;
+			a = (a % n + n) % n;
+		}
+		if (!i?.(a)) return a;
+	}
+	return -1;
+}
+function D(e, t, n) {
+	return E(e === 1 ? -1 : t, e, t, !1, n);
+}
+function O(e, t, n, r, i) {
+	if (n === 0) return -1;
+	let a = [...e], o = a.every((e) => e === a[0]), s = (o ? a[0] : e).toLowerCase(), c = o ? t + 1 : t;
+	for (let e = 0; e < n; e++) {
+		let t = ((c + e) % n + n) % n;
+		if (!i?.(t) && r(t).trim().toLowerCase().startsWith(s)) return t;
+	}
+	return -1;
+}
+function k(e) {
+	return e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey;
+}
+function A(e) {
+	let { count: t, columns: r, columnIndexOf: i, pageSize: a = w, defaultActiveColumn: o = 0, onActiveCellChange: c, orientation: f = "vertical", loop: m = !0, activeIndex: h, defaultActiveIndex: g = 0, onActiveIndexChange: _, isDisabled: v, textOf: y, focusItems: b = !0, onSelect: x } = e, [S, C] = p({
+		value: h,
+		defaultValue: g,
+		onChange: _
+	}), A = Math.min(S, t - 1), j = r !== void 0, M = s((e) => typeof r == "function" ? r(e) : r ?? 0, [r]), N = s((e, t) => {
+		let n = M(e);
+		if (!i) return T(t, n - 1);
+		if (n <= 0) return -1;
+		let r = 0;
+		for (; r + 1 < n && i(e, r + 1) <= t;) r++;
+		return r;
+	}, [i, M]), [P, F] = u(o), I = j && A >= 0 ? N(A, P) : -1, L = l([]), R = l(/* @__PURE__ */ new Map()), z = l(/* @__PURE__ */ new Map()), B = l(/* @__PURE__ */ new Map()), V = l({
+		query: "",
+		at: 0
+	}), H = s((e) => {
+		L.current[e]?.focus();
+	}, []), U = l(!1), W = s((e, t) => {
+		U.current = !0, z.current.get(`${e}:${t}`)?.focus(), U.current = !1;
+	}, []), te = s(() => j ? z.current.get(`${A}:${I}`) ?? null : L.current[A] ?? null, [
+		I,
+		A,
+		j
+	]), G = d({
+		row: A,
+		column: I
+	}), K = d(P), q = d(c), J = d(M), Y = d(N), X = d(i), Z = s((e, n, r) => {
+		let i = T(e, t - 1), a = Math.max(0, n), o = i < 0 ? -1 : Y.current(i, a), s = G.current;
+		return i === s.row && o === s.column ? s : (C(i, r), F(a), q.current?.({
+			row: i,
+			column: o
+		}, r), {
+			row: i,
+			column: o
+		});
+	}, [
+		G,
+		Y,
+		q,
+		t,
+		C
+	]), Q = s((e, n, r) => {
+		let i = T(e, t - 1), a = i < 0 ? -1 : T(Math.max(0, n), J.current(i) - 1);
+		return Z(i, a < 0 ? 0 : X.current?.(i, a) ?? a, r);
+	}, [
+		X,
+		t,
+		Z,
+		J
+	]), ne = s((e, t) => {
+		let n = `${e}:${t}`;
+		return B.current.has(n) || B.current.set(n, (e) => {
+			e ? z.current.set(n, e) : (z.current.delete(n), B.current.delete(n));
+		}), {
+			ref: B.current.get(n),
+			tabIndex: e === A && t === I ? 0 : -1,
+			onFocus: () => {
+				U.current || Q(e, t, { reason: "focus" });
+			}
+		};
+	}, [
+		I,
+		A,
+		Q
+	]), re = s((e) => (R.current.has(e) || R.current.set(e, (t) => {
+		L.current[e] = t;
+	}), {
+		ref: R.current.get(e),
+		tabIndex: b ? e === A ? 0 : -1 : void 0,
+		onFocus: b ? () => C(e, { reason: "focus" }) : void 0
+	}), [
+		A,
+		b,
+		C
+	]), $ = s((e) => {
+		let { row: r, column: i } = G.current, o = (t, n) => {
+			e.preventDefault();
+			let r = Q(t, n, {
+				reason: "keyboard",
+				event: e
+			});
+			b && W(r.row, r.column);
+		}, s = (t) => {
+			e.preventDefault();
+			let n = Z(t, K.current, {
+				reason: "keyboard",
+				event: e
+			});
+			b && W(n.row, n.column);
+		}, c = 2 ** 53 - 1, l = () => n(e.currentTarget) ? -1 : 1;
+		switch (e.key) {
+			case "ArrowRight": return o(r, i + l());
+			case "ArrowLeft": return o(r, i - l());
+			case "ArrowDown": return s(r + 1);
+			case "ArrowUp": return s(r - 1);
+			case "Home": return e.ctrlKey || e.metaKey ? o(0, 0) : o(r, 0);
+			case "End": return e.ctrlKey || e.metaKey ? o(t - 1, c) : o(r, c);
+			case "PageDown": return s(r + a);
+			case "PageUp": return s(r - a);
+		}
+	}, [
+		G,
+		t,
+		K,
+		W,
+		b,
+		a,
+		Z,
+		Q
+	]);
+	return {
+		activeIndex: A,
+		activeColumn: I,
+		setActiveIndex: C,
+		setActiveCell: Q,
+		onKeyDown: s((e) => {
+			if (e.defaultPrevented) return;
+			if (j) {
+				$(e);
+				return;
+			}
+			let r = f !== "horizontal", i = f !== "vertical", a = V.current, o = a.query !== "" && e.timeStamp - a.at < ee, s = (t, n) => {
+				t !== -1 && t !== A && (e.preventDefault(), C(t, {
+					reason: n,
+					event: e
+				}), b && H(t));
+			};
+			if (i && (e.key === "ArrowRight" || e.key === "ArrowLeft")) {
+				let r = e.key === "ArrowRight" !== n(e.currentTarget);
+				s(E(A, r ? 1 : -1, t, m, v), "keyboard");
+				return;
+			}
+			if (e.key === "ArrowDown" && r) {
+				s(E(A, 1, t, m, v), "keyboard");
+				return;
+			}
+			if (e.key === "ArrowUp" && r) {
+				s(E(A, -1, t, m, v), "keyboard");
+				return;
+			}
+			if (e.key === "Home") {
+				s(D(1, t, v), "keyboard");
+				return;
+			}
+			if (e.key === "End") {
+				s(D(-1, t, v), "keyboard");
+				return;
+			}
+			if (e.key === "Enter" || e.key === " " && !(o && y)) {
+				if (!x || A === -1) return;
+				e.preventDefault(), x(A, e);
+				return;
+			}
+			y && k(e) && (a.query = o ? a.query + e.key : e.key, a.at = e.timeStamp, s(O(a.query, A, t, y, v), "typeahead"));
+		}, [
+			A,
+			t,
+			H,
+			b,
+			v,
+			j,
+			m,
+			$,
+			x,
+			f,
+			C,
+			y
+		]),
+		itemProps: re,
+		cellProps: ne,
+		activeItem: te
+	};
+}
+//#endregion
+export { p as a, _ as i, C as n, f as o, y as r, A as t };

package/box.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./rolldown-runtime.cjs"),t=require("./react-shared.cjs"),n=require("./client.cjs");let r=require("react");r=e.t(r,1);let i=require("@box-kite/core");function a(e,i){let{tag:a=`div`,children:o}=e,{classNames:s,styleElements:c}=n.i(e,a===`svg`),l=(0,r.useMemo)(()=>{let n=t.c(e,s);return i&&(n.ref=i),n},[e]),[u,d]=(0,r.useState)(!1),f=typeof o==`function`,p=f?{...l,onMouseEnter:()=>d(!0),onMouseLeave:()=>d(!1)}:l,m=r.default.createElement(a,p,f?o({isHover:u}):o);return c?r.default.createElement(r.default.Fragment,null,c,m):m}var o=(0,r.memo)((0,r.forwardRef)(a));o.displayName=`Box`,o.extend=i.BoxExtends.extend,o.components=i.BoxExtends.components,o.keyframes=i.BoxExtends.keyframes,o.spring=i.Springs.spring,o.Theme=n.n,o.useTheme=n.n.useTheme,o.getVariableValue=e=>(0,i.getDefaultEngine)().getVariableValue(e),o.configure=n.r.configure;function s(e,r){return t.l(n.i(e,r?.svg===!0),e.className)}exports.default=o,exports.useClassNames=s,exports.useVisibility=n.a;

package/box.d.ts

@@ -0,0 +1,46 @@
+import { default as React, RefAttributes } from 'react';
+import { BoxExtends, Springs } from '@box-kite/core';
+import { BoxClassNames } from './react/boxClassNames';
+import { BoxClassNameProps, BoxCoreProps } from './react/boxProps';
+import { default as useVisibility } from './react/hooks/useVisibility';
+import { ExtractElementFromTag } from './react/reactTypes';
+import { default as Theme } from './react/theme/theme';
+import { StylesContext } from './react/useStyles';
+import { ComponentsAndVariants } from '@box-kite/core/types';
+interface BoxType {
+    <TTag extends keyof React.JSX.IntrinsicElements = 'div', TKey extends keyof ComponentsAndVariants = never>(props: BoxCoreProps<TTag, TKey> & RefAttributes<ExtractElementFromTag<TTag>>): React.ReactNode;
+    extend: typeof BoxExtends.extend;
+    components: typeof BoxExtends.components;
+    keyframes: typeof BoxExtends.keyframes;
+    /** A spring of your own, sampled into `{ easing, duration }` — the two halves the timing and duration props take. */
+    spring: typeof Springs.spring;
+    Theme: typeof Theme;
+    useTheme: typeof Theme.useTheme;
+    getVariableValue: (name: string) => string;
+    /** Explicit engine configuration (class-name hashing, style sink). Call once, before the first render. */
+    configure: typeof StylesContext.configure;
+}
+declare const Box: BoxType;
+export default Box;
+export type BoxProps<TTag extends keyof React.JSX.IntrinsicElements = 'div', TKey extends keyof ComponentsAndVariants = never> = React.ComponentProps<typeof Box<TTag, TKey>>;
+export type BoxTagProps<TTag extends keyof React.JSX.IntrinsicElements = 'div', TKey extends keyof ComponentsAndVariants = never> = Required<BoxProps<TTag, TKey>>['props'];
+/**
+ * Box props as a class attribute, for an element Box cannot render: an icon from `lucide-react`, a
+ * `motion.div`, a router's `NavLink`. They take a `className` and nothing else, and `style` is what this
+ * library exists not to write.
+ *
+ * ```tsx
+ * const { className, styles } = useClassNames({ color: 'sky-500', hover: { color: 'sky-300' } });
+ *
+ * return <>{styles}<NavLink className={className} to="/" /></>;
+ * ```
+ *
+ * `styles` is defined in element mode only, where the CSS travels as `<style href precedence>` elements;
+ * elsewhere it is undefined and rendering it costs nothing, so that line is what to write either way.
+ * `{ svg: true }` picks the SVG reset — `Icon` is this hook plus that flag.
+ */
+export declare function useClassNames<TKey extends keyof ComponentsAndVariants = never>(props: BoxClassNameProps<TKey>, options?: {
+    svg?: boolean;
+}): BoxClassNames;
+export { useVisibility };
+export type { BoxClassNames, BoxClassNameProps };

package/box.mjs

@@ -0,0 +1,23 @@
+import { c as e, l as t } from "./react-shared.mjs";
+import { a as n, i as r, n as i, r as a } from "./client.mjs";
+import o, { forwardRef as s, memo as c, useMemo as l, useState as u } from "react";
+import { BoxExtends as d, Springs as f, getDefaultEngine as p } from "@box-kite/core";
+//#region src/box.ts
+function m(t, n) {
+	let { tag: i = "div", children: a } = t, { classNames: s, styleElements: c } = r(t, i === "svg"), d = l(() => {
+		let r = e(t, s);
+		return n && (r.ref = n), r;
+	}, [t]), [f, p] = u(!1), m = typeof a == "function", h = m ? {
+		...d,
+		onMouseEnter: () => p(!0),
+		onMouseLeave: () => p(!1)
+	} : d, g = o.createElement(i, h, m ? a({ isHover: f }) : a);
+	return c ? o.createElement(o.Fragment, null, c, g) : g;
+}
+var h = c(s(m));
+h.displayName = "Box", h.extend = d.extend, h.components = d.components, h.keyframes = d.keyframes, h.spring = f.spring, h.Theme = i, h.useTheme = i.useTheme, h.getVariableValue = (e) => p().getVariableValue(e), h.configure = a.configure;
+function g(e, n) {
+	return t(r(e, n?.svg === !0), e.className);
+}
+//#endregion
+export { h as default, g as useClassNames, n as useVisibility };

package/client.cjs

@@ -0,0 +1 @@
+const e=require("./rolldown-runtime.cjs"),t=require("./react-shared.cjs"),n=require("./platform.cjs"),r=require("./effects.cjs"),i=require("./box.cjs");let a=require("react");a=e.t(a,1);let o=require("@box-kite/core"),s=require("react/jsx-runtime");function c(e){let{node:t=null,event:r=`click`,hideOnScroll:i=!1,hideOnResize:o=!1,hideOnEscape:s=!0}=e??{},[c,l]=(0,a.useState)(!1),u=(0,a.useRef)(null);return(0,a.useEffect)(()=>{function e(e){let r=t??u.current;r&&!n.a(e,[r])&&l(!1)}function a(){l(!1)}function d(e){e.key===`Escape`&&l(!1)}let f=new AbortController;return c&&(window.addEventListener(r,e,f),s&&window.addEventListener(`keydown`,d,f),o&&window.addEventListener(`resize`,a,f),i&&window.addEventListener(`scroll`,e,{signal:f.signal,capture:!0})),()=>{f.abort()}},[t,c,r,s,o,i]),[c,l,u]}var l=r.t;function u(e,n){let{classNames:r,signature:i,styleElements:a}=t.o(e,n);return l(()=>{(0,o.getDefaultEngine)().flushSync()},[i??e]),{classNames:r,styleElements:a}}function d(e,n){let r=e?(0,o.getDefaultEngine)().addGlobalStyles(e,n):void 0;return l(()=>{(0,o.getDefaultEngine)().flushSync()},[e,n]),t.s(r)}var f;(function(e){function t(){(0,o.getDefaultEngine)().flushSync()}e.flushSync=t;function n(){(0,o.getDefaultEngine)().clear()}e.clear=n;function r(){return(0,o.getDefaultEngine)().getStyles()}e.getStyles=r;function i(){return(0,o.getDefaultEngine)().styleElementId}e.styleElementId=i;function a(e){(0,o.getDefaultEngine)().configure(e)}e.configure=a})(f||={});var p=`[box-kite] The client build was loaded into a React Server Component graph, where React has no createContext. Import '@box-kite/react' by its package name — the react-server condition resolves it to a Box that renders on the server — and import the components that hold state (Dropdown, Tooltip, DataGrid, Checkbox, Select, Form) from a 'use client' module. See https://github.com/box-kite/box-kite#react-server-components-react-19`;function m(e){if(typeof e.createContext!=`function`)throw Error(p)}m(a.default);var h=a.default.createContext({theme:``,setTheme:()=>{}});function g(e){let{children:t,theme:n,use:r=`local`,storageKey:c,globalStyles:l}=e,u=d(r===`global`?l:void 0,`html`),[f,p]=(0,a.useState)(n??o.defaultThemeName),[m,g]=(0,a.useState)(n!==void 0),_=(0,a.useRef)(null),v=(0,a.useCallback)(e=>{e===null?(c&&(0,o.clearStoredTheme)(c),g(!1)):(c&&(0,o.writeStoredTheme)(c,e),p(e),g(!0))},[c]),[y,b]=(0,a.useState)(n);return n!==y&&(b(n),n===void 0?g(!1):(p(n),g(!0))),(0,a.useLayoutEffect)(()=>{if(m)return;let e=c?(0,o.readStoredTheme)(c):null;if(e){p(e),g(!0);return}return p((0,o.getSystemTheme)()),(0,o.watchSystemTheme)(p)},[m,c]),(0,a.useLayoutEffect)(()=>{if(r===`local`)return;let e=(0,o.documentRoot)();if(e)return(0,o.applyThemeToElement)(e,f)},[f,r]),(0,a.useLayoutEffect)(()=>{r!==`local`||!_.current||(0,o.setThemeAttribute)(_.current,f)},[f,r]),r===`local`?(0,s.jsxs)(h.Provider,{value:{theme:f,setTheme:v},children:[u,(0,s.jsx)(i.default,{ref:_,className:f,children:t})]}):(0,s.jsxs)(h.Provider,{value:{theme:f,setTheme:v},children:[u,t]})}(function(e){function t(){let{theme:e,setTheme:t}=(0,a.useContext)(h);return[e,t]}e.useTheme=t})(g||={});var _=g,v=new WeakMap;function y(e){let t=v.get(e);return t||(t=new Map,v.set(e,t)),t}function b(){let[e]=_.useTheme(),t=(0,a.useMemo)(()=>{let e=n.t();if(!e)return null;let t=`box-kite-portal`,r=e.getElementById(t);return r||(r=document.createElement(`div`),r.id=t,document.body.appendChild(r)),r},[]);return(0,a.useLayoutEffect)(()=>{if(!e||!t)return;let n=y(t),r=n.get(e)??0;return n.set(e,r+1),r===0&&t.classList.add(e),()=>{let r=(n.get(e)??1)-1;r<=0?(n.delete(e),t.classList.remove(e)):n.set(e,r)}},[t,e]),t}Object.defineProperty(exports,"a",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"i",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,"r",{enumerable:!0,get:function(){return f}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return b}});

package/client.mjs

@@ -0,0 +1,163 @@
+import { o as e, s as t } from "./react-shared.mjs";
+import { a as n, t as r } from "./platform.mjs";
+import { t as i } from "./effects.mjs";
+import a from "./box.mjs";
+import o, { useCallback as s, useContext as c, useEffect as l, useLayoutEffect as u, useMemo as d, useRef as f, useState as p } from "react";
+import { applyThemeToElement as m, clearStoredTheme as h, defaultThemeName as g, documentRoot as _, getDefaultEngine as v, getSystemTheme as y, readStoredTheme as b, setThemeAttribute as x, watchSystemTheme as S, writeStoredTheme as C } from "@box-kite/core";
+import { jsx as w, jsxs as T } from "react/jsx-runtime";
+//#region src/react/hooks/useVisibility.ts
+function E(e) {
+	let { node: t = null, event: r = "click", hideOnScroll: i = !1, hideOnResize: a = !1, hideOnEscape: o = !0 } = e ?? {}, [s, c] = p(!1), u = f(null);
+	return l(() => {
+		function e(e) {
+			let r = t ?? u.current;
+			r && !n(e, [r]) && c(!1);
+		}
+		function l() {
+			c(!1);
+		}
+		function d(e) {
+			e.key === "Escape" && c(!1);
+		}
+		let f = new AbortController();
+		return s && (window.addEventListener(r, e, f), o && window.addEventListener("keydown", d, f), a && window.addEventListener("resize", l, f), i && window.addEventListener("scroll", e, {
+			signal: f.signal,
+			capture: !0
+		})), () => {
+			f.abort();
+		};
+	}, [
+		t,
+		s,
+		r,
+		o,
+		a,
+		i
+	]), [
+		s,
+		c,
+		u
+	];
+}
+//#endregion
+//#region src/react/useStyles.ts
+var D = i;
+function O(t, n) {
+	let { classNames: r, signature: i, styleElements: a } = e(t, n);
+	return D(() => {
+		v().flushSync();
+	}, [i ?? t]), {
+		classNames: r,
+		styleElements: a
+	};
+}
+function k(e, n) {
+	let r = e ? v().addGlobalStyles(e, n) : void 0;
+	return D(() => {
+		v().flushSync();
+	}, [e, n]), t(r);
+}
+var A;
+(function(e) {
+	function t() {
+		v().flushSync();
+	}
+	e.flushSync = t;
+	function n() {
+		v().clear();
+	}
+	e.clear = n;
+	function r() {
+		return v().getStyles();
+	}
+	e.getStyles = r;
+	function i() {
+		return v().styleElementId;
+	}
+	e.styleElementId = i;
+	function a(e) {
+		v().configure(e);
+	}
+	e.configure = a;
+})(A ||= {});
+//#endregion
+//#region src/react/clientRuntime.ts
+var j = "[box-kite] The client build was loaded into a React Server Component graph, where React has no createContext. Import '@box-kite/react' by its package name — the react-server condition resolves it to a Box that renders on the server — and import the components that hold state (Dropdown, Tooltip, DataGrid, Checkbox, Select, Form) from a 'use client' module. See https://github.com/box-kite/box-kite#react-server-components-react-19";
+function M(e) {
+	if (typeof e.createContext != "function") throw Error(j);
+}
+//#endregion
+//#region src/react/theme/themeContext.ts
+M(o);
+var N = o.createContext({
+	theme: "",
+	setTheme: () => {}
+});
+//#endregion
+//#region src/react/theme/theme.tsx
+function P(e) {
+	let { children: t, theme: n, use: r = "local", storageKey: i, globalStyles: o } = e, c = k(r === "global" ? o : void 0, "html"), [l, d] = p(n ?? g), [v, E] = p(n !== void 0), D = f(null), O = s((e) => {
+		e === null ? (i && h(i), E(!1)) : (i && C(i, e), d(e), E(!0));
+	}, [i]), [A, j] = p(n);
+	return n !== A && (j(n), n === void 0 ? E(!1) : (d(n), E(!0))), u(() => {
+		if (v) return;
+		let e = i ? b(i) : null;
+		if (e) {
+			d(e), E(!0);
+			return;
+		}
+		return d(y()), S(d);
+	}, [v, i]), u(() => {
+		if (r === "local") return;
+		let e = _();
+		if (e) return m(e, l);
+	}, [l, r]), u(() => {
+		r !== "local" || !D.current || x(D.current, l);
+	}, [l, r]), r === "local" ? /* @__PURE__ */ T(N.Provider, {
+		value: {
+			theme: l,
+			setTheme: O
+		},
+		children: [c, /* @__PURE__ */ w(a, {
+			ref: D,
+			className: l,
+			children: t
+		})]
+	}) : /* @__PURE__ */ T(N.Provider, {
+		value: {
+			theme: l,
+			setTheme: O
+		},
+		children: [c, t]
+	});
+}
+(function(e) {
+	function t() {
+		let { theme: e, setTheme: t } = c(N);
+		return [e, t];
+	}
+	e.useTheme = t;
+})(P ||= {});
+var F = P, I = /* @__PURE__ */ new WeakMap();
+function L(e) {
+	let t = I.get(e);
+	return t || (t = /* @__PURE__ */ new Map(), I.set(e, t)), t;
+}
+function R() {
+	let [e] = F.useTheme(), t = d(() => {
+		let e = r();
+		if (!e) return null;
+		let t = "box-kite-portal", n = e.getElementById(t);
+		return n || (n = document.createElement("div"), n.id = t, document.body.appendChild(n)), n;
+	}, []);
+	return u(() => {
+		if (!e || !t) return;
+		let n = L(t), r = n.get(e) ?? 0;
+		return n.set(e, r + 1), r === 0 && t.classList.add(e), () => {
+			let r = (n.get(e) ?? 1) - 1;
+			r <= 0 ? (n.delete(e), t.classList.remove(e)) : n.set(e, r);
+		};
+	}, [t, e]), t;
+}
+//#endregion
+export { E as a, O as i, F as n, A as r, R as t };

package/components/baseSvg.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("./svg.cjs");let t=require("react"),n=require("react/jsx-runtime");function r(t,r){let{viewBox:i=`0 0 24 24`,width:a=`1.5rem`,props:o,...s}=t;return(0,n.jsx)(e.Svg,{ref:r,viewBox:i,width:a,props:{...o,fill:`none`},...s})}var i=(0,t.forwardRef)(r);i.displayName=`BaseSvg`,exports.default=i;

package/components/baseSvg.d.ts

@@ -0,0 +1,5 @@
+import { SvgProps } from './svg';
+type Props = Omit<SvgProps, 'ref'>;
+declare const BaseSvg: import('react').ForwardRefExoticComponent<Props & import('react').RefAttributes<SVGSVGElement>>;
+export default BaseSvg;
+export type BaseSvgProps = React.ComponentProps<typeof BaseSvg>;

package/components/baseSvg.mjs

@@ -0,0 +1,21 @@
+import { Svg as e } from "./svg.mjs";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/baseSvg.tsx
+function r(t, r) {
+	let { viewBox: i = "0 0 24 24", width: a = "1.5rem", props: o, ...s } = t;
+	return /* @__PURE__ */ n(e, {
+		ref: r,
+		viewBox: i,
+		width: a,
+		props: {
+			...o,
+			fill: "none"
+		},
+		...s
+	});
+}
+var i = t(r);
+i.displayName = "BaseSvg";
+//#endregion
+export { i as default };

package/components/button.cjs

@@ -0,0 +1 @@
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../rolldown-runtime.cjs"),t=require("../react-shared.cjs");let n=require("react"),r=require("react/jsx-runtime"),i=require("@box-kite/react");i=e.t(i,1);var a=[`type`,`onClick`];function o(e,n){let o=t.t.buildProps(e,a);return(0,r.jsx)(i.default,{ref:n,tag:`button`,component:`button`,...o})}var s=(0,n.forwardRef)(o);s.displayName=`Button`,exports.default=s;

package/components/button.d.ts

@@ -0,0 +1,16 @@
+import { RefAttributes } from 'react';
+import { BoxProps, BoxTagProps } from '../box';
+import { OmitTagProps } from '../react/boxProps';
+import { ComponentsAndVariants } from '@box-kite/core/types';
+declare const tagProps: readonly ["type", "onClick"];
+type TagPropsType = (typeof tagProps)[number];
+type ButtonProps<TKey extends keyof ComponentsAndVariants> = Omit<BoxProps<'button', TKey>, 'tag' | 'props'>;
+type ButtonTagProps = OmitTagProps<BoxTagProps<'button'>, TagPropsType>;
+type ButtonType = Required<React.ComponentProps<'button'>>['type'];
+interface Props<TKey extends keyof ComponentsAndVariants> extends ButtonProps<TKey> {
+    props?: ButtonTagProps;
+    type?: ButtonType;
+    onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}
+declare const _default: <TKey extends keyof ComponentsAndVariants = "button">(props: Props<TKey> & RefAttributes<HTMLButtonElement>) => React.ReactNode;
+export default _default;

package/components/button.mjs

@@ -0,0 +1,19 @@
+import { t as e } from "../react-shared.mjs";
+import { forwardRef as t } from "react";
+import { jsx as n } from "react/jsx-runtime";
+import r from "@box-kite/react";
+//#region src/components/button.tsx
+var i = ["type", "onClick"];
+function a(t, a) {
+	let o = e.buildProps(t, i);
+	return /* @__PURE__ */ n(r, {
+		ref: a,
+		tag: "button",
+		component: "button",
+		...o
+	});
+}
+var o = t(a);
+o.displayName = "Button";
+//#endregion
+export { o as default };

package/components/chart.cjs

@@ -0,0 +1 @@
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../rolldown-runtime.cjs"),t=require("./svg.cjs");let n=require("react"),r=require("@box-kite/core"),i=require("react/jsx-runtime"),a=require("@box-kite/react");a=e.t(a,1);var o;(function(e){let t=e.VIEW=100,n=e.CENTRE=t/2,r=e.FRACTION_STEP=.005;function i(e){return Math.round(e*100)/100}function a(e){return Math.round(Math.min(Math.max(e,0),1)/r)*r}e.fraction=a;function o(e,r={}){if(e.length===0)return[];let a=r.min??Math.min(...e),o=(r.max??Math.max(...e))-a,s=e=>i(o===0?n:t-(e-a)/o*t);if(e.length===1)return[{x:0,y:s(e[0])},{x:t,y:s(e[0])}];let c=t/(e.length-1);return e.map((e,t)=>({x:i(t*c),y:s(e)}))}e.points=o;function s(e){return e.length===0?``:e.map((e,t)=>`${t===0?`M`:`L`}${e.x} ${e.y}`).join(``)}e.linePath=s;function c(e){if(e.length===0)return``;let n=e[e.length-1];return`${s(e)}L${n.x} ${t}L${e[0].x} ${t}Z`}e.areaPath=c;function l(e,n={},r=.25){if(e.length===0)return``;let a=t/e.length,s=i(a*(1-r)),c=i((a-s)/2);return o(e,n).map((e,n)=>{let r=Math.min(e.y,t-1);return`M${i(n*a+c)} ${r}h${s}v${i(t-r)}h${-s}Z`}).join(``)}e.barsPath=l;function u(e){return i(n-e/2)}e.radius=u;function d(e){return i(2*Math.PI*e)}e.circumference=d;function f(e,t){return{strokeDasharray:i(e),strokeDashoffset:i(e*(1-a(t)))}}e.dash=f;function p(e,t){let r=(t-90)*Math.PI/180;return{x:i(n+e*Math.cos(r)),y:i(n+e*Math.sin(r))}}function m(e,t){return i(d(e)*(Math.min(Math.abs(t),360)/360))}e.arcLength=m;function h(e,t,n){if(Math.abs(n)>=360){let n=p(e,t),r=p(e,t+180);return`M${n.x} ${n.y}A${e} ${e} 0 0 1 ${r.x} ${r.y}A${e} ${e} 0 0 1 ${n.x} ${n.y}`}let r=p(e,t),i=p(e,t+n),a=+(Math.abs(n)>180),o=n<0?0:1;return`M${r.x} ${r.y}A${e} ${e} 0 ${a} ${o} ${i.x} ${i.y}`}e.arcPath=h;function g(e,t){let n=e.reduce((e,t)=>e+Math.max(t,0),0);if(n<=0)return[];let r=0;return e.map((e,o)=>{let s=a(Math.max(e,0)/n),c=i(t*s),l=i(r*360);return r+=s,{strokeDasharray:`${c} ${i(t-c)}`,rotate:l,value:e,index:o}})}e.donutSegments=g;let _=e.PALETTE=[`sky-500`,`emerald-500`,`amber-500`,`violet-500`,`rose-500`,`cyan-500`];e.DARK_PALETTE=[`sky-400`,`emerald-400`,`amber-400`,`violet-400`,`rose-400`,`cyan-400`];function v(e){return e.reduce((e,t,n)=>(e[`chart-${n+1}`]=t,e),{})}e.paletteVariables=v;function y(e,t=_.length){return(Array.isArray(e)?e.map((e,n)=>[e,`var(--chart-${n%t+1})`]):Object.entries(e)).reduce((e,[t,n])=>(e[`color-${t}`]=n,e),{})}e.seriesVariables=y})(o||={});var s=o,c=`0 0 ${s.VIEW} ${s.VIEW}`,l=s.PALETTE;function u(e,n){let{data:r,variant:a=`line`,min:o,max:l,children:u,...d}=e,f={min:o,max:l},p=s.points(r,f);return(0,i.jsxs)(t.Svg,{viewBox:c,preserveAspectRatio:`none`,vectorEffect:`non-scaling-stroke`,width:`100%`,height:`1.5rem`,overflow:`visible`,stroke:`currentColor`,fill:`currentColor`,strokeWidth:1.5,strokeLinecap:`round`,strokeLinejoin:`round`,ref:n,...d,children:[a===`bar`?(0,i.jsx)(t.Path,{d:s.barsPath(r,f),stroke:`none`}):(0,i.jsxs)(i.Fragment,{children:[a===`area`&&(0,i.jsx)(t.Path,{d:s.areaPath(p),stroke:`none`,fillOpacity:.2}),(0,i.jsx)(t.Path,{d:s.linePath(p),fill:`none`})]}),u]})}var d=(0,n.forwardRef)(u);d.displayName=`Sparkline`;function f(e,n){let{value:r,thickness:a=10,trackOpacity:o=.2,children:l,...u}=e,d=s.radius(a),f=s.circumference(d);return(0,i.jsxs)(t.Svg,{viewBox:c,width:`3rem`,height:`3rem`,stroke:`currentColor`,fill:`none`,strokeWidth:a,strokeLinecap:`round`,ref:n,...u,children:[(0,i.jsx)(t.Circle,{cx:s.CENTRE,cy:s.CENTRE,r:d,strokeOpacity:o}),(0,i.jsx)(t.Circle,{cx:s.CENTRE,cy:s.CENTRE,r:d,transform:`rotate(-90 ${s.CENTRE} ${s.CENTRE})`,...s.dash(f,r)}),l]})}var p=(0,n.forwardRef)(f);p.displayName=`ProgressRing`;function m(e,n){let{value:r,thickness:a=10,trackOpacity:o=.2,sweep:l=270,start:u=225,children:d,...f}=e,p=s.radius(a),m=s.arcLength(p,l),h=s.arcPath(p,u,l);return(0,i.jsxs)(t.Svg,{viewBox:c,width:`4rem`,height:`4rem`,stroke:`currentColor`,fill:`none`,strokeWidth:a,strokeLinecap:`round`,ref:n,...f,children:[(0,i.jsx)(t.Path,{d:h,strokeOpacity:o}),(0,i.jsx)(t.Path,{d:h,...s.dash(m,r)}),d]})}var h=(0,n.forwardRef)(m);h.displayName=`Gauge`;function g(e,n){let{data:r,colors:a=l,thickness:o=20,children:u,...d}=e,f=s.radius(o),p=s.circumference(f);return(0,i.jsxs)(t.Svg,{viewBox:c,width:`3rem`,height:`3rem`,fill:`none`,strokeWidth:o,ref:n,...d,children:[s.donutSegments(r,p).map(e=>(0,i.jsx)(t.Circle,{cx:s.CENTRE,cy:s.CENTRE,r:f,stroke:a[e.index%a.length],strokeDasharray:e.strokeDasharray,transform:`rotate(${e.rotate-90} ${s.CENTRE} ${s.CENTRE})`},e.index)),u]})}var _=(0,n.forwardRef)(g);_.displayName=`MiniDonut`;function v(e,t){let{series:n,vars:o,theme:c,...l}=e,u={...s.paletteVariables(s.PALETTE),...n?s.seriesVariables(n):{},...o},d=(0,r.mergeDeep)({dark:{vars:s.paletteVariables(s.DARK_PALETTE)}},c??{});return(0,i.jsx)(a.default,{ref:t,vars:u,theme:d,...l})}var y=(0,n.forwardRef)(v);y.displayName=`ChartContainer`;var b=y;exports.ChartContainer=b,exports.Gauge=h,exports.MiniDonut=_,exports.ProgressRing=p,exports.Sparkline=d;