@box-kite/react 2.2.3 → 2.2.5

package/components/swipeItem.mjs

@@ -0,0 +1,321 @@
+"use client";
+import { f as e } from "../react-shared.mjs";
+import { d as t, s as n, t as r, u as i } from "../platform.mjs";
+import { n as a } from "../effects.mjs";
+import { useBoxElement as o } from "../box.mjs";
+import { a as s, i as c, o as l } from "../behavior.mjs";
+import { n as u } from "../motion.mjs";
+import d, { i as f, n as p, r as m, t as h } from "./list.mjs";
+import { createContext as g, useCallback as ee, useContext as _, useEffect as v, useRef as y, useState as b } from "react";
+import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
+//#region src/utils/swipe/swipeUtils.ts
+var w;
+(function(e) {
+	let t = e.SLOP = 8, n = e.FLICK = .4, r = e.FULL_RATIO = .6;
+	function i(e, n) {
+		return Math.max(Math.abs(e), Math.abs(n)) < t ? null : Math.abs(e) > Math.abs(n) ? "swipe" : "scroll";
+	}
+	e.intent = i;
+	function a(e, t) {
+		return (1 - 1 / (e * .55 / t + 1)) * t;
+	}
+	function o(e, t, n, r, i) {
+		let o = e + t, s = o < 0 ? -1 : 1, c = o < 0 ? n.end : n.start, l = Math.abs(o);
+		return c === 0 ? 0 : l <= c ? o : i ? s * Math.min(l, r) : s * (c + a(l - c, Math.max(r, 1)));
+	}
+	e.offsetFor = o;
+	function s(e, n, i, a) {
+		if (!a || e === 0) return null;
+		let o = e > 0 ? "start" : "end", s = n[o];
+		return s === 0 ? null : Math.abs(e) >= Math.max(s + t * 4, i * r) ? o : null;
+	}
+	e.armed = s;
+	function c(e, t, r, i, a) {
+		let o = s(e, r, i, a);
+		if (o) return {
+			open: null,
+			full: o
+		};
+		if (e === 0) return {
+			open: null,
+			full: null
+		};
+		let c = e > 0 ? "start" : "end", l = r[c];
+		return l === 0 ? {
+			open: null,
+			full: null
+		} : Math.abs(t) >= n ? {
+			open: Math.sign(t) === Math.sign(e) ? c : null,
+			full: null
+		} : {
+			open: Math.abs(e) >= l / 2 ? c : null,
+			full: null
+		};
+	}
+	e.settle = c;
+	let l = e.VELOCITY_WINDOW = 100;
+	function u(e, t) {
+		return [...e.filter((e) => t.t - e.t <= l), t];
+	}
+	e.track = u;
+	function d(e) {
+		let t = e[0], n = e[e.length - 1];
+		return !t || !n || n.t - t.t < 16 ? 0 : (n.x - t.x) / (n.t - t.t);
+	}
+	e.velocity = d;
+	function f(e, t) {
+		return e === "start" ? t.start : e === "end" ? -t.end : 0;
+	}
+	e.restOffset = f;
+})(w ||= {});
+var T = w, E = g(null), te = {
+	start: 0,
+	end: 0
+};
+function D(e, p) {
+	let { size: m = "md", wrap: g = !1, selected: _ = !1, chevron: w = !1, startActions: D, endActions: O, fullSwipe: k = !1, open: A, defaultOpen: ie = null, onOpenChange: ae, variant: oe, children: se, props: ce, ...le } = e, j = y(null), M = y(null), N = y(null), P = y(null), F = y(!1), [I, L] = c({
+		value: A,
+		defaultValue: ie,
+		onChange: ae
+	}), [R, z] = b(null), [B, V] = b(null), [H, U] = b({
+		trays: te,
+		width: 0,
+		rtl: !1
+	}), W = l(H), ue = ee((e) => {
+		j.current = e, typeof p == "function" ? p(e) : p && (p.current = e);
+	}, [p]), G = s(() => {
+		let e = (e) => e?.firstElementChild?.offsetWidth ?? 0, n = {
+			trays: {
+				start: D ? e(M.current) : 0,
+				end: O ? e(N.current) : 0
+			},
+			width: j.current?.offsetWidth ?? 0,
+			rtl: t(j.current)
+		}, r = W.current;
+		return (r.trays.start !== n.trays.start || r.trays.end !== n.trays.end || r.width !== n.width || r.rtl !== n.rtl) && U(n), n;
+	});
+	a(() => {
+		I && G();
+	}, [I, G]);
+	let K = s((e) => L(null, e));
+	v(() => {
+		let e = r();
+		if (!I || !e) return;
+		let t = (e) => {
+			i(e, [j]) || K({
+				reason: "outside-pointer",
+				event: e
+			});
+		};
+		return e.addEventListener("pointerdown", t, !0), () => e.removeEventListener("pointerdown", t, !0);
+	}, [I, K]), v(() => {
+		if (!B) return;
+		let e = (B === "start" ? M : N).current, t = j.current?.firstElementChild, n = t && typeof getComputedStyle == "function" ? u.activeDuration(getComputedStyle(t)) : 0, r = setTimeout(() => {
+			V(null), e?.querySelector("[data-swipe-action]")?.click();
+		}, n + u.SETTLE_FRAME);
+		return () => clearTimeout(r);
+	}, [B]);
+	let de = s((e) => {
+		if (F.current = !1, e.button !== 0 || B || !D && !O) return;
+		let { trays: t } = G();
+		P.current = {
+			pointerId: e.pointerId,
+			x: e.clientX,
+			y: e.clientY,
+			rest: T.restOffset(I, t),
+			intent: null,
+			samples: [{
+				t: e.timeStamp,
+				x: e.clientX
+			}]
+		};
+	}), fe = s((e) => {
+		let t = P.current;
+		if (!t || t.pointerId !== e.pointerId || t.intent === "scroll") return;
+		let r = e.clientX - t.x;
+		if (!t.intent) {
+			if (t.intent = T.intent(r, e.clientY - t.y), t.intent !== "swipe") return;
+			e.currentTarget.setPointerCapture?.(e.pointerId), n(e.currentTarget);
+		}
+		let { trays: i, width: a, rtl: o } = W.current;
+		t.samples = T.track(t.samples, {
+			t: e.timeStamp,
+			x: e.clientX
+		}), z(T.offsetFor(t.rest, o ? -r : r, i, a, k));
+	}), q = s((e) => {
+		let t = P.current;
+		if (!t || t.pointerId !== e.pointerId || (P.current = null, t.intent !== "swipe" || R === null)) return;
+		e.currentTarget.releasePointerCapture?.(e.pointerId), F.current = !0;
+		let { trays: n, width: r, rtl: i } = W.current, a = T.velocity(t.samples) * (i ? -1 : 1), o = e.type === "pointercancel" ? {
+			open: I,
+			full: null
+		} : T.settle(R, a, n, r, k);
+		z(null), o.full ? (V(o.full), L(null, {
+			reason: "swipe",
+			event: e
+		})) : L(o.open, {
+			reason: "swipe",
+			event: e
+		});
+	}), pe = s((e) => {
+		if (F.current) {
+			F.current = !1, e.preventDefault(), e.stopPropagation();
+			return;
+		}
+		I && (e.preventDefault(), e.stopPropagation(), K({
+			reason: "outside-pointer",
+			event: e
+		}));
+	}), me = s((e) => {
+		let t = M.current?.contains(e.target) ? "start" : N.current?.contains(e.target) ? "end" : null;
+		t && t !== I && (G(), L(t, {
+			reason: "focus",
+			event: e
+		}));
+	}), he = s((e) => {
+		let t = e.relatedTarget;
+		I && (!t || !j.current?.contains(t)) && K({
+			reason: "focus",
+			event: e
+		});
+	}), ge = s((e) => {
+		e.key !== "Escape" || !I || e.defaultPrevented || (e.preventDefault(), K({
+			reason: "escape",
+			event: e
+		}), j.current?.querySelector("[data-list-action]")?.focus());
+	}), { trays: J, width: Y, rtl: X } = H, Z = R ?? (B ? B === "start" ? Y : -Y : T.restOffset(I, J)), _e = R === null ? B : T.armed(R, J, Y, k), Q = R !== null, $ = (e, t) => /* @__PURE__ */ S(re, {
+		side: e,
+		trayRef: e === "start" ? M : N,
+		width: e === "start" ? Math.max(0, Z) : Math.max(0, -Z),
+		dragging: Q,
+		children: /* @__PURE__ */ S(E.Provider, {
+			value: {
+				side: e,
+				armed: _e === e,
+				close: K
+			},
+			children: t
+		})
+	});
+	return o({
+		tag: "li",
+		component: "list.item",
+		...f({
+			...h,
+			css: {
+				...h.css,
+				overflow: "clip"
+			}
+		}, le),
+		variant: [oe, { selected: _ }],
+		props: {
+			...ce,
+			onFocus: me,
+			onBlur: he,
+			onKeyDown: ge
+		},
+		children: /* @__PURE__ */ C(x, { children: [
+			/* @__PURE__ */ C(ne, {
+				size: m,
+				wrap: g,
+				dragging: Q,
+				translate: Z === 0 ? void 0 : `${Math.round(X ? -Z : Z)}px`,
+				handlers: {
+					onPointerDown: de,
+					onPointerMove: fe,
+					onPointerUp: q,
+					onPointerCancel: q,
+					onClickCapture: pe,
+					onDragStart: (e) => e.preventDefault()
+				},
+				children: [se, w && /* @__PURE__ */ S(d.Chevron, {})]
+			}),
+			D ? $("start", D) : null,
+			O ? $("end", O) : null
+		] })
+	}, ue);
+}
+function ne({ size: e, wrap: t, dragging: n, translate: r, handlers: i, children: a }) {
+	return o({
+		component: "swipeItem.row",
+		...p,
+		...m[e],
+		...t ? { flexWrap: "wrap" } : {},
+		position: "relative",
+		css: { touchAction: "pan-y" },
+		variant: { dragging: n },
+		style: r ? { translate: r } : void 0,
+		props: i,
+		children: a
+	});
+}
+function re({ side: e, trayRef: t, width: n, dragging: r, children: i }) {
+	let a = o({
+		display: "flex",
+		d: e === "end" ? "row-reverse" : "row",
+		position: "absolute",
+		top: 0,
+		bottom: 0,
+		...e === "start" ? { insetStart: 0 } : { insetEnd: 0 },
+		minWidth: "fit",
+		css: { width: "max-content" },
+		children: i
+	});
+	return o({
+		component: "swipeItem.tray",
+		position: "absolute",
+		top: 0,
+		bottom: 0,
+		...e === "start" ? { insetStart: 0 } : { insetEnd: 0 },
+		overflow: "hidden",
+		variant: { dragging: r },
+		style: { width: `${Math.round(n)}px` },
+		children: a
+	}, t);
+}
+function O(e, t) {
+	let { icon: n, onClick: r, closeOnSelect: i = !0, variant: a, children: s, props: c, ...l } = e, u = _(E), d = (e) => {
+		r?.(e), i && !e.defaultPrevented && u?.close({
+			reason: "action",
+			event: e
+		});
+	};
+	return o({
+		tag: "button",
+		component: "swipeItem.action",
+		display: "flex",
+		d: "column",
+		ai: "center",
+		jc: "center",
+		gap: 1,
+		px: 4,
+		minWidth: 18,
+		flexGrow: 1,
+		flexShrink: 0,
+		fontSize: 14,
+		lineHeight: 18,
+		fontWeight: 500,
+		cursor: "pointer",
+		...l,
+		variant: [a, { armed: u?.armed ?? !1 }],
+		props: {
+			type: "button",
+			"data-swipe-action": "",
+			...c,
+			onClick: d
+		},
+		children: n ? /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(k, { children: n }), s] }) : s
+	}, t);
+}
+function k({ children: e }) {
+	return o({
+		tag: "span",
+		display: "flex",
+		props: { "aria-hidden": !0 },
+		children: e
+	});
+}
+var A = e(D, "SwipeItem");
+A.Action = e(O, "SwipeItem.Action");
+//#endregion
+export { T as SwipeUtils, A as default };

package/components/tabs.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../platform.cjs"),t=require("../effects.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../identity.cjs"),a=require("../motion.cjs");let o=require("react"),s=require("react/jsx-runtime");var c;(function(e){let t=e.TAB_SELECTOR=`[role="tab"]`,n=e.LIST_SELECTOR=`[role="tablist"]`,r=e.PANEL_SELECTOR=`[role="tabpanel"]`;function i(e,t){return t instanceof Element&&t.closest(n)===e}e.owns=i;function a(e){return e?[...e.querySelectorAll(t)].filter(t=>i(e,t)):[]}e.tabs=a;function o(e){return e.hasAttribute(`disabled`)||e.getAttribute(`aria-disabled`)===`true`}e.isDisabled=o;function s(e){return e.dataset.value}e.valueOf=s;function c(e){return e.replace(/[^A-Za-z0-9-]/g,e=>`_${e.codePointAt(0).toString(36)}_`)}e.token=c;function l(e,t,n,r){let i=e.length;if(i===0)return;let a=t<0||t>=i?n>0?-1:i:t;for(let t=0;t<i;t++){if(a+=n,a<0||a>=i){if(!r)return;a=(a%i+i)%i}if(!o(e[a]))return e[a]}}e.step=l;function u(e,t){return l(e,t===1?-1:e.length,t,!1)}e.edge=u;function d(e,t){return t instanceof HTMLElement?e.indexOf(t):-1}e.indexOf=d;function f(e,t,n=!1){if(e===`Home`)return{kind:`edge`,delta:1};if(e===`End`)return{kind:`edge`,delta:-1};let r=t===`vertical`,i=r?`ArrowDown`:n?`ArrowLeft`:`ArrowRight`,a=r?`ArrowUp`:n?`ArrowRight`:`ArrowLeft`;if(e===i)return{kind:`step`,delta:1};if(e===a)return{kind:`step`,delta:-1}}e.moveFor=f;function p(e,t,n,r){return n.kind===`edge`?u(e,n.delta):l(e,t,n.delta,r)}e.target=p;function m(e){if(e)return a(e).find(e=>e.getAttribute(`aria-selected`)===`true`)}e.selectedTab=m;function h(e,t,n){let r=e.getBoundingClientRect(),i=t.getBoundingClientRect();return n===`vertical`?{start:i.top-r.top+e.scrollTop,size:i.height}:{start:i.left-r.left+e.scrollLeft,size:i.width}}e.bounds=h;function g(e,t){return!e||!t?e===t:e.start===t.start&&e.size===t.size}e.sameBounds=g;function _(e){if(e)return[...e.querySelectorAll(r)].find(e=>!e.hasAttribute(`hidden`))}e.visiblePanel=_})(c||={});var l=c,u=(0,o.createContext)(null);function d(e){let t=(0,o.useContext)(u);if(!t)throw Error(`<${e}> has to be rendered inside a <Tabs>.`);return t}function f(e){let{children:a,value:c,defaultValue:d,onValueChange:f,orientation:p=`horizontal`,activation:m=`automatic`,loop:h=!0,keepMounted:g=!1,indicator:_=`static`,props:v,...y}=e,b=i.t(`tabs`),[x,S]=r.i({value:c,defaultValue:d,onChange:f}),[C,w]=(0,o.useState)(),[T,E]=(0,o.useState)(!1);t.n(()=>{x!==void 0&&w(x)},[x]);let D=(0,o.useMemo)(()=>({identifier:b,value:x,orientation:p,activation:m,loop:h,keepMounted:g,indicator:_,indicatorLive:T,setIndicatorLive:E,tabStop:C??x,setTabStop:w,select:S,tabId:e=>`${b}-tab-${l.token(e)}`,panelId:e=>`${b}-panel-${l.token(e)}`}),[b,x,p,m,h,g,_,T,C,S]);return(0,s.jsx)(u.Provider,{value:D,children:(0,s.jsx)(n.default,{component:`tabs`,...y,variant:[y.variant,{vertical:p===`vertical`}],props:v,children:a})})}function p(i){let{children:a,label:c,labelledBy:u,props:f,...p}=i,{value:m,orientation:h,activation:g,loop:_,indicator:v,tabStop:y,setTabStop:b,setIndicatorLive:x,select:S}=d(`Tabs.List`),C=(0,o.useRef)(null),[w,T]=(0,o.useState)(),E=v===`sliding`;t.n(()=>{let e=C.current;if(!E||!e)return;let t=()=>{let t=l.selectedTab(e),n=t&&l.bounds(e,t,h);T(e=>l.sameBounds(e,n)?e:n)};if(t(),typeof ResizeObserver>`u`)return;let n=new ResizeObserver(t);n.observe(e);for(let t of l.tabs(e))n.observe(t);return()=>n.disconnect()},[E,h,m]);let D=E&&w&&w.size>0?w:void 0;t.n(()=>{x(D!==void 0)},[D,x]),t.n(()=>{if(y!==void 0)return;let e=l.edge(l.tabs(C.current),1),t=e&&l.valueOf(e);t!==void 0&&b(t)},[y,b]);let O=r.a(t=>{let n=C.current;if(!n||t.defaultPrevented||!l.owns(n,t.target))return;let r=l.tabs(n),i=l.indexOf(r,t.target);if(i===-1)return;if(g===`manual`&&(t.key===`Enter`||t.key===` `)){let e=l.valueOf(r[i]);if(e===void 0)return;t.preventDefault(),S(e,{reason:`keyboard`,event:t});return}let a=l.moveFor(t.key,h,e.u(n));if(!a)return;let o=l.target(r,i,a,_);if(!o)return;t.preventDefault(),o.focus();let s=l.valueOf(o);g===`automatic`&&s!==void 0&&S(s,{reason:`keyboard`,event:t})});return(0,s.jsxs)(n.default,{ref:C,component:`tabs.list`,...p,variant:[p.variant,{vertical:h===`vertical`,sliding:E}],props:{role:`tablist`,"aria-label":c,"aria-labelledby":u,"aria-orientation":h,...f,onKeyDown:O},children:[a,D&&(0,s.jsx)(n.default,{tag:`span`,component:`tabs.indicator`,variant:{vertical:h===`vertical`},style:h===`vertical`?{top:`${D.start}px`,height:`${D.size}px`}:{left:`${D.start}px`,width:`${D.size}px`},props:{"aria-hidden":!0}})]})}p.displayName=`Tabs.List`;function m(e){let{value:t,children:i,disabled:a,props:o,...c}=e,{value:l,orientation:u,keepMounted:f,indicatorLive:p,tabStop:m,setTabStop:h,select:g,tabId:_,panelId:v}=d(`Tabs.Tab`),y=l===t,b=r.a(e=>g(t,{reason:`click`,event:e})),x=r.a(()=>h(t));return(0,s.jsx)(n.default,{tag:`button`,component:`tabs.tab`,...c,variant:[c.variant,{vertical:u===`vertical`,underline:!p}],disabled:a,id:_(t),props:{type:`button`,role:`tab`,"aria-selected":y,"aria-controls":y||f?v(t):void 0,tabIndex:m===t?0:-1,"data-value":t,...o,onClick:b,onFocus:x},children:i})}m.displayName=`Tabs.Tab`;function h(e){let{children:i,props:c,...u}=e,{value:f}=d(`Tabs.Panels`),p=(0,o.useRef)(null),[m,h]=(0,o.useState)(),[g,_]=(0,o.useState)(!1),v=r.a(()=>{let e=p.current;if(!e)return;let t=l.visiblePanel(e)?.offsetHeight;t!==m&&(m!==void 0&&t!==void 0&&_(!0),h(t))});return t.n(()=>{let e=p.current;if(!e||(v(),typeof ResizeObserver>`u`))return;let t=l.visiblePanel(e);if(!t)return;let n=new ResizeObserver(v);return n.observe(t),()=>n.disconnect()},[f,v]),t.n(()=>{let e=p.current;if(!e||!g)return;let t=setTimeout(()=>_(!1),a.n.activeDuration(getComputedStyle(e))+a.n.SETTLE_FRAME);return()=>clearTimeout(t)},[g,m]),(0,s.jsx)(n.default,{ref:p,component:`tabs.panels`,...u,variant:[u.variant,{resizing:g}],style:{height:m===void 0?void 0:`${m}px`,...u.style},props:c,children:i})}h.displayName=`Tabs.Panels`;function g(e){let{value:t,children:r,props:i,...a}=e,{value:o,keepMounted:c,tabId:l,panelId:u}=d(`Tabs.Panel`),f=o===t;return!f&&!c?null:(0,s.jsx)(n.default,{component:`tabs.panel`,...a,variant:[a.variant,{hidden:!f}],id:u(t),props:{role:`tabpanel`,"aria-labelledby":l(t),hidden:!f||void 0,tabIndex:0,...i},children:r})}g.displayName=`Tabs.Panel`;var _=f;_.List=p,_.Tab=m,_.Panels=h,_.Panel=g,_.displayName=`Tabs`,exports.default=_;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../platform.cjs"),t=require("../effects.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../identity.cjs"),a=require("../motion.cjs");let o=require("react"),s=require("react/jsx-runtime");var c;(function(e){let t=e.TAB_SELECTOR=`[role="tab"]`,n=e.LIST_SELECTOR=`[role="tablist"]`,r=e.PANEL_SELECTOR=`[role="tabpanel"]`;function i(e,t){return t instanceof Element&&t.closest(n)===e}e.owns=i;function a(e){return e?[...e.querySelectorAll(t)].filter(t=>i(e,t)):[]}e.tabs=a;function o(e){return e.hasAttribute(`disabled`)||e.getAttribute(`aria-disabled`)===`true`}e.isDisabled=o;function s(e){return e.dataset.value}e.valueOf=s;function c(e){return e.replace(/[^A-Za-z0-9-]/g,e=>`_${e.codePointAt(0).toString(36)}_`)}e.token=c;function l(e,t,n,r){let i=e.length;if(i===0)return;let a=t<0||t>=i?n>0?-1:i:t;for(let t=0;t<i;t++){if(a+=n,a<0||a>=i){if(!r)return;a=(a%i+i)%i}if(!o(e[a]))return e[a]}}e.step=l;function u(e,t){return l(e,t===1?-1:e.length,t,!1)}e.edge=u;function d(e,t){return t instanceof HTMLElement?e.indexOf(t):-1}e.indexOf=d;function f(e,t,n=!1){if(e===`Home`)return{kind:`edge`,delta:1};if(e===`End`)return{kind:`edge`,delta:-1};let r=t===`vertical`,i=r?`ArrowDown`:n?`ArrowLeft`:`ArrowRight`,a=r?`ArrowUp`:n?`ArrowRight`:`ArrowLeft`;if(e===i)return{kind:`step`,delta:1};if(e===a)return{kind:`step`,delta:-1}}e.moveFor=f;function p(e,t,n,r){return n.kind===`edge`?u(e,n.delta):l(e,t,n.delta,r)}e.target=p;function m(e){if(e)return a(e).find(e=>e.getAttribute(`aria-selected`)===`true`)}e.selectedTab=m;function h(e,t,n){let r=e.getBoundingClientRect(),i=t.getBoundingClientRect();return n===`vertical`?{start:i.top-r.top+e.scrollTop,size:i.height}:{start:i.left-r.left+e.scrollLeft,size:i.width}}e.bounds=h;function g(e,t){return!e||!t?e===t:e.start===t.start&&e.size===t.size}e.sameBounds=g;function _(e){if(e)return[...e.querySelectorAll(r)].find(e=>!e.hasAttribute(`hidden`))}e.visiblePanel=_})(c||={});var l=c,u=(0,o.createContext)(null);function d(e){let t=(0,o.useContext)(u);if(!t)throw Error(`<${e}> has to be rendered inside a <Tabs>.`);return t}function f(e){let{children:a,value:c,defaultValue:d,onValueChange:f,orientation:p=`horizontal`,activation:m=`automatic`,loop:h=!0,keepMounted:g=!1,indicator:_=`static`,props:v,...y}=e,b=i.t(`tabs`),[x,S]=r.i({value:c,defaultValue:d,onChange:f}),[C,w]=(0,o.useState)(),[T,E]=(0,o.useState)(!1);t.n(()=>{x!==void 0&&w(x)},[x]);let D=(0,o.useMemo)(()=>({identifier:b,value:x,orientation:p,activation:m,loop:h,keepMounted:g,indicator:_,indicatorLive:T,setIndicatorLive:E,tabStop:C??x,setTabStop:w,select:S,tabId:e=>`${b}-tab-${l.token(e)}`,panelId:e=>`${b}-panel-${l.token(e)}`}),[b,x,p,m,h,g,_,T,C,S]);return(0,s.jsx)(u.Provider,{value:D,children:(0,s.jsx)(n.default,{component:`tabs`,...y,variant:[y.variant,{vertical:p===`vertical`}],props:v,children:a})})}function p(i){let{children:a,label:c,labelledBy:u,props:f,...p}=i,{value:m,orientation:h,activation:g,loop:_,indicator:v,tabStop:y,setTabStop:b,setIndicatorLive:x,select:S}=d(`Tabs.List`),C=(0,o.useRef)(null),[w,T]=(0,o.useState)(),E=v===`sliding`;t.n(()=>{let e=C.current;if(!E||!e)return;let t=()=>{let t=l.selectedTab(e),n=t&&l.bounds(e,t,h);T(e=>l.sameBounds(e,n)?e:n)};if(t(),typeof ResizeObserver>`u`)return;let n=new ResizeObserver(t);n.observe(e);for(let t of l.tabs(e))n.observe(t);return()=>n.disconnect()},[E,h,m]);let D=E&&w&&w.size>0?w:void 0;t.n(()=>{x(D!==void 0)},[D,x]),t.n(()=>{if(y!==void 0)return;let e=l.edge(l.tabs(C.current),1),t=e&&l.valueOf(e);t!==void 0&&b(t)},[y,b]);let O=r.a(t=>{let n=C.current;if(!n||t.defaultPrevented||!l.owns(n,t.target))return;let r=l.tabs(n),i=l.indexOf(r,t.target);if(i===-1)return;if(g===`manual`&&(t.key===`Enter`||t.key===` `)){let e=l.valueOf(r[i]);if(e===void 0)return;t.preventDefault(),S(e,{reason:`keyboard`,event:t});return}let a=l.moveFor(t.key,h,e.d(n));if(!a)return;let o=l.target(r,i,a,_);if(!o)return;t.preventDefault(),o.focus();let s=l.valueOf(o);g===`automatic`&&s!==void 0&&S(s,{reason:`keyboard`,event:t})});return(0,s.jsxs)(n.default,{ref:C,component:`tabs.list`,...p,variant:[p.variant,{vertical:h===`vertical`,sliding:E}],props:{role:`tablist`,"aria-label":c,"aria-labelledby":u,"aria-orientation":h,...f,onKeyDown:O},children:[a,D&&(0,s.jsx)(n.default,{tag:`span`,component:`tabs.indicator`,variant:{vertical:h===`vertical`},style:h===`vertical`?{top:`${D.start}px`,height:`${D.size}px`}:{left:`${D.start}px`,width:`${D.size}px`},props:{"aria-hidden":!0}})]})}p.displayName=`Tabs.List`;function m(e){let{value:t,children:i,disabled:a,props:o,...c}=e,{value:l,orientation:u,keepMounted:f,indicatorLive:p,tabStop:m,setTabStop:h,select:g,tabId:_,panelId:v}=d(`Tabs.Tab`),y=l===t,b=r.a(e=>g(t,{reason:`click`,event:e})),x=r.a(()=>h(t));return(0,s.jsx)(n.default,{tag:`button`,component:`tabs.tab`,...c,variant:[c.variant,{vertical:u===`vertical`,underline:!p}],disabled:a,id:_(t),props:{type:`button`,role:`tab`,"aria-selected":y,"aria-controls":y||f?v(t):void 0,tabIndex:m===t?0:-1,"data-value":t,...o,onClick:b,onFocus:x},children:i})}m.displayName=`Tabs.Tab`;function h(e){let{children:i,props:c,...u}=e,{value:f}=d(`Tabs.Panels`),p=(0,o.useRef)(null),[m,h]=(0,o.useState)(),[g,_]=(0,o.useState)(!1),v=r.a(()=>{let e=p.current;if(!e)return;let t=l.visiblePanel(e)?.offsetHeight;t!==m&&(m!==void 0&&t!==void 0&&_(!0),h(t))});return t.n(()=>{let e=p.current;if(!e||(v(),typeof ResizeObserver>`u`))return;let t=l.visiblePanel(e);if(!t)return;let n=new ResizeObserver(v);return n.observe(t),()=>n.disconnect()},[f,v]),t.n(()=>{let e=p.current;if(!e||!g)return;let t=setTimeout(()=>_(!1),a.n.activeDuration(getComputedStyle(e))+a.n.SETTLE_FRAME);return()=>clearTimeout(t)},[g,m]),(0,s.jsx)(n.default,{ref:p,component:`tabs.panels`,...u,variant:[u.variant,{resizing:g}],style:{height:m===void 0?void 0:`${m}px`,...u.style},props:c,children:i})}h.displayName=`Tabs.Panels`;function g(e){let{value:t,children:r,props:i,...a}=e,{value:o,keepMounted:c,tabId:l,panelId:u}=d(`Tabs.Panel`),f=o===t;return!f&&!c?null:(0,s.jsx)(n.default,{component:`tabs.panel`,...a,variant:[a.variant,{hidden:!f}],id:u(t),props:{role:`tabpanel`,"aria-labelledby":l(t),hidden:!f||void 0,tabIndex:0,...i},children:r})}g.displayName=`Tabs.Panel`;var _=f;_.List=p,_.Tab=m,_.Panels=h,_.Panel=g,_.displayName=`Tabs`,exports.default=_;

package/components/tabs.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { u as e } from "../platform.mjs";
+import { d as e } from "../platform.mjs";
 import { n as t } from "../effects.mjs";
 import n from "../box.mjs";
 import { a as r, i } from "../behavior.mjs";

package/components/toaster.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../platform.cjs"),t=require("../client.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../layer.cjs"),a=require("../motion.cjs");let o=require("react"),s=require("react-dom"),c=require("react/jsx-runtime"),l=require("use-sync-external-store/shim");var u={toasts:[],overflow:0},d=0;function f(){return d+=1,`toast-${d}`}function p(e){let t=[],n=u,r=e?.limit??3,i=e?.duration??5e3,a=!1,o=new Set,s=new Map,c=e=>{let t=s.get(e);t?.handle&&clearTimeout(t.handle),s.delete(e)},l=()=>{let e=0;t=t.map(t=>{let n=!t.open||e++<r;return t.visible===n?t:{...t,visible:n}}),n={toasts:t,overflow:Math.max(0,e-r)},d(),o.forEach(e=>e())};function d(){let e=new Set;for(let n of t){if(!n.open||!n.visible||!Number.isFinite(n.duration))continue;e.add(n.id);let t=s.get(n.id)??{handle:null,remaining:n.duration,startedAt:0};s.set(n.id,t),!(a||t.handle)&&(t.startedAt=Date.now(),t.handle=setTimeout(()=>{s.delete(n.id),m(n.id,`timeout`)},t.remaining))}for(let t of[...s.keys()])e.has(t)||c(t)}let p=(e,t)=>t??(e===`loading`?1/0:i);function m(e,n=`imperative`){let r=[];t=t.map(t=>!t.open||e!==void 0&&t.id!==e?t:(r.push(t),c(t.id),{...t,open:!1})),r.length&&(l(),r.forEach(e=>e.onDismiss?.(n)))}function h(e,n,r){let i=!1;t=t.map(t=>{if(t.id!==e)return t;i=!0,c(e);let a=r?.kind??t.kind;return{...t,...r,id:e,message:n,kind:a,duration:r?.duration??(r?.kind?p(a):t.duration),open:!0}}),i&&l()}function g(e,n){let r=n?.id??f();if(n?.id&&t.some(e=>e.id===r))return h(r,e,n),r;let i=n?.kind??`default`;return t=[...t,{id:r,kind:i,message:e,description:n?.description,duration:p(i,n?.duration),action:n?.action,dismissible:n?.dismissible??!0,onDismiss:n?.onDismiss,open:!0,visible:!1}],l(),r}return{subscribe(e){return o.add(e),()=>o.delete(e)},getSnapshot:()=>n,getServerSnapshot:()=>u,add:g,update:h,dismiss:m,remove(e){let n=t.filter(t=>t.id!==e);n.length!==t.length&&(c(e),t=n,l())},setLimit(e){e!==r&&(r=e,l())},setDefaultDuration(e){i=e},pause(){if(!a){a=!0;for(let e of s.values())e.handle&&(clearTimeout(e.handle),e.handle=null,e.remaining=Math.max(0,e.remaining-(Date.now()-e.startedAt)))}},resume(){a&&(a=!1,d())},reset(){for(let e of[...s.keys()])c(e);t=[],n=u,o.forEach(e=>e())}}}var m=p(),h=e=>(t,n)=>m.add(t,{...n,kind:e}),g=Object.assign((e,t)=>m.add(e,t),{success:h(`success`),error:h(`error`),warning:h(`warning`),info:h(`info`),loading:h(`loading`),update:(e,t,n)=>m.update(e,t,n),dismiss:e=>m.dismiss(e,`imperative`),promise(e,t,n){let r=m.add(t.loading,{...n,id:n?.id,kind:`loading`}),i=(e,t)=>typeof e==`function`?e(t):e;return e.then(e=>m.update(r,i(t.success,e),{kind:`success`}),e=>m.update(r,i(t.error,e),{kind:`error`})),e}}),_={"top-start":`topStart`,"top-center":`topCenter`,"top-end":`topEnd`,"bottom-start":`bottomStart`,"bottom-center":`bottomCenter`,"bottom-end":`bottomEnd`};function v(e,t){let n=t.toLowerCase().split(`+`),r=n[n.length-1],i=new Set(n.slice(0,-1));return e.key.toLowerCase()===r&&e.altKey===i.has(`alt`)&&e.ctrlKey===i.has(`ctrl`)&&e.shiftKey===i.has(`shift`)&&e.metaKey===i.has(`meta`)}function y(e){let{toast:t,store:i,fromTop:o,closeLabel:s}=e,{mounted:l,ref:u,props:d}=a.t({present:t.open});if(n.n(()=>{l||i.remove(t.id)},[l,i,t.id]),!l)return null;let f=t.action,p=()=>{f?.onClick(),f?.closeOnClick!==!1&&i.dismiss(t.id,`action`)};return(0,c.jsxs)(r.default,{ref:u,component:`toaster.toast`,variant:{[t.kind]:t.kind!=="default",fromTop:o},props:{...t.kind===`error`?{role:`alert`}:{},"data-toast-id":t.id,...d},children:[(0,c.jsx)(r.default,{component:`toaster.message`,children:t.message}),t.description!==void 0&&(0,c.jsx)(r.default,{component:`toaster.description`,children:t.description}),f&&(0,c.jsx)(r.default,{tag:`button`,component:`toaster.action`,props:{type:`button`,onClick:p},children:f.label}),t.dismissible&&(0,c.jsx)(r.default,{tag:`button`,component:`toaster.close`,props:{type:`button`,"aria-label":s,onClick:()=>i.dismiss(t.id,`close`)}})]})}function b(a){let{position:u=`bottom-end`,limit:d=3,duration:f=5e3,label:p=`Notifications`,closeLabel:h=`Close`,overflowLabel:g=e=>`+${e} more`,hotkey:b=`F6`,store:x=m,props:S,...C}=a,w=(0,l.useSyncExternalStore)(x.subscribe,x.getSnapshot,x.getServerSnapshot),T=i.n(),E=t.t(!T),D=(0,o.useRef)(null),O=(0,o.useRef)(null),k=(0,o.useRef)({hovered:!1,focused:!1,hidden:!1}),A=(0,o.useCallback)(()=>{let{hovered:e,focused:t,hidden:n}=k.current;e||t||n?x.pause():x.resume()},[x]);n.n(()=>x.setLimit(d),[x,d]),n.n(()=>x.setDefaultDuration(f),[x,f]),n.n(()=>{let t=D.current;!T||!e.a()||!t||!t.isConnected||t.matches(`:popover-open`)||t.showPopover()}),n.n(()=>{let t=e.t();if(!t)return;let n=new AbortController;return t.addEventListener(`visibilitychange`,()=>{k.current.hidden=t.hidden,A()},{signal:n.signal}),()=>n.abort()},[A]),n.n(()=>{let t=e.t();if(!b||!t)return;let n=new AbortController;return t.addEventListener(`keydown`,e=>{!v(e,b)||!D.current||(e.preventDefault(),O.current=t.activeElement,D.current.focus())},{signal:n.signal}),()=>n.abort()},[b]);let j=e=>!!e&&!!D.current?.contains(e),M=()=>{k.current.hovered=!0,A()},N=e=>{j(e.relatedTarget)||(k.current.hovered=!1,A())},P=e=>{k.current.focused=!0,A(),j(e.relatedTarget)||(O.current=e.relatedTarget)},F=e=>{j(e.relatedTarget)||(k.current.focused=!1,A())},I=e=>{if(e.key!==`Escape`)return;let t=(e.target.closest?.(`[data-toast-id]`))?.getAttribute(`data-toast-id`);t&&x.dismiss(t,`close`),x.getSnapshot().toasts.some(e=>e.open)?D.current?.focus():O.current?.focus()},L=u.startsWith(`top`),R=w.toasts.filter(e=>e.visible),z=L?[...R].reverse():R,B=w.overflow>0&&(0,c.jsx)(r.default,{component:`toaster.overflow`,children:g(w.overflow)}),V=(0,c.jsxs)(r.default,{tag:`section`,ref:D,component:`toaster`,...C,variant:[C.variant,{[_[u]]:!0}],props:{...T?{popover:`manual`}:{},"aria-live":`polite`,"aria-atomic":`false`,"aria-relevant":`additions text`,"aria-label":p,tabIndex:-1,...S,onPointerOver:M,onPointerOut:N,onFocus:P,onBlur:F,onKeyDown:I},children:[!L&&B,z.map(e=>(0,c.jsx)(y,{toast:e,store:x,fromTop:L,closeLabel:h},e.id)),L&&B]});return T?V:E?(0,s.createPortal)(V,E):null}var x=b;x.displayName=`Toaster`,exports.createToastStore=p,exports.default=x,exports.defaultToastStore=m,exports.toast=g;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../client.cjs"),t=require("../platform.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../layer.cjs"),a=require("../motion.cjs");let o=require("react"),s=require("react/jsx-runtime"),c=require("react-dom"),l=require("use-sync-external-store/shim");var u={toasts:[],overflow:0},d=0;function f(){return d+=1,`toast-${d}`}function p(e){let t=[],n=u,r=e?.limit??3,i=e?.duration??5e3,a=!1,o=new Set,s=new Map,c=e=>{let t=s.get(e);t?.handle&&clearTimeout(t.handle),s.delete(e)},l=()=>{let e=0;t=t.map(t=>{let n=!t.open||e++<r;return t.visible===n?t:{...t,visible:n}}),n={toasts:t,overflow:Math.max(0,e-r)},d(),o.forEach(e=>e())};function d(){let e=new Set;for(let n of t){if(!n.open||!n.visible||!Number.isFinite(n.duration))continue;e.add(n.id);let t=s.get(n.id)??{handle:null,remaining:n.duration,startedAt:0};s.set(n.id,t),!(a||t.handle)&&(t.startedAt=Date.now(),t.handle=setTimeout(()=>{s.delete(n.id),m(n.id,`timeout`)},t.remaining))}for(let t of[...s.keys()])e.has(t)||c(t)}let p=(e,t)=>t??(e===`loading`?1/0:i);function m(e,n=`imperative`){let r=[];t=t.map(t=>!t.open||e!==void 0&&t.id!==e?t:(r.push(t),c(t.id),{...t,open:!1})),r.length&&(l(),r.forEach(e=>e.onDismiss?.(n)))}function h(e,n,r){let i=!1;t=t.map(t=>{if(t.id!==e)return t;i=!0,c(e);let a=r?.kind??t.kind;return{...t,...r,id:e,message:n,kind:a,duration:r?.duration??(r?.kind?p(a):t.duration),open:!0}}),i&&l()}function g(e,n){let r=n?.id??f();if(n?.id&&t.some(e=>e.id===r))return h(r,e,n),r;let i=n?.kind??`default`;return t=[...t,{id:r,kind:i,message:e,description:n?.description,duration:p(i,n?.duration),action:n?.action,dismissible:n?.dismissible??!0,onDismiss:n?.onDismiss,open:!0,visible:!1}],l(),r}return{subscribe(e){return o.add(e),()=>o.delete(e)},getSnapshot:()=>n,getServerSnapshot:()=>u,add:g,update:h,dismiss:m,remove(e){let n=t.filter(t=>t.id!==e);n.length!==t.length&&(c(e),t=n,l())},setLimit(e){e!==r&&(r=e,l())},setDefaultDuration(e){i=e},pause(){if(!a){a=!0;for(let e of s.values())e.handle&&(clearTimeout(e.handle),e.handle=null,e.remaining=Math.max(0,e.remaining-(Date.now()-e.startedAt)))}},resume(){a&&(a=!1,d())},reset(){for(let e of[...s.keys()])c(e);t=[],n=u,o.forEach(e=>e())}}}var m=p(),h=e=>(t,n)=>m.add(t,{...n,kind:e}),g=Object.assign((e,t)=>m.add(e,t),{success:h(`success`),error:h(`error`),warning:h(`warning`),info:h(`info`),loading:h(`loading`),update:(e,t,n)=>m.update(e,t,n),dismiss:e=>m.dismiss(e,`imperative`),promise(e,t,n){let r=m.add(t.loading,{...n,id:n?.id,kind:`loading`}),i=(e,t)=>typeof e==`function`?e(t):e;return e.then(e=>m.update(r,i(t.success,e),{kind:`success`}),e=>m.update(r,i(t.error,e),{kind:`error`})),e}}),_={"top-start":`topStart`,"top-center":`topCenter`,"top-end":`topEnd`,"bottom-start":`bottomStart`,"bottom-center":`bottomCenter`,"bottom-end":`bottomEnd`};function v(e,t){let n=t.toLowerCase().split(`+`),r=n[n.length-1],i=new Set(n.slice(0,-1));return e.key.toLowerCase()===r&&e.altKey===i.has(`alt`)&&e.ctrlKey===i.has(`ctrl`)&&e.shiftKey===i.has(`shift`)&&e.metaKey===i.has(`meta`)}function y(e){let{toast:t,store:i,fromTop:o,closeLabel:c}=e,{mounted:l,ref:u,props:d}=a.t({present:t.open});if(n.n(()=>{l||i.remove(t.id)},[l,i,t.id]),!l)return null;let f=t.action,p=()=>{f?.onClick(),f?.closeOnClick!==!1&&i.dismiss(t.id,`action`)};return(0,s.jsxs)(r.default,{ref:u,component:`toaster.toast`,variant:{[t.kind]:t.kind!=="default",fromTop:o},props:{...t.kind===`error`?{role:`alert`}:{},"data-toast-id":t.id,...d},children:[(0,s.jsx)(r.default,{component:`toaster.message`,children:t.message}),t.description!==void 0&&(0,s.jsx)(r.default,{component:`toaster.description`,children:t.description}),f&&(0,s.jsx)(r.default,{tag:`button`,component:`toaster.action`,props:{type:`button`,onClick:p},children:f.label}),t.dismissible&&(0,s.jsx)(r.default,{tag:`button`,component:`toaster.close`,props:{type:`button`,"aria-label":c,onClick:()=>i.dismiss(t.id,`close`)}})]})}function b(a){let{position:u=`bottom-end`,limit:d=3,duration:f=5e3,label:p=`Notifications`,closeLabel:h=`Close`,overflowLabel:g=e=>`+${e} more`,hotkey:b=`F6`,store:x=m,props:S,...C}=a,w=(0,l.useSyncExternalStore)(x.subscribe,x.getSnapshot,x.getServerSnapshot),T=i.n(),E=e.n(!T),D=(0,o.useRef)(null),O=(0,o.useRef)(null),k=(0,o.useRef)({hovered:!1,focused:!1,hidden:!1}),A=(0,o.useCallback)(()=>{let{hovered:e,focused:t,hidden:n}=k.current;e||t||n?x.pause():x.resume()},[x]);n.n(()=>x.setLimit(d),[x,d]),n.n(()=>x.setDefaultDuration(f),[x,f]),n.n(()=>{let e=D.current;!T||!t.o()||!e||!e.isConnected||e.matches(`:popover-open`)||e.showPopover()}),n.n(()=>{let e=t.t();if(!e)return;let n=new AbortController;return e.addEventListener(`visibilitychange`,()=>{k.current.hidden=e.hidden,A()},{signal:n.signal}),()=>n.abort()},[A]),n.n(()=>{let e=t.t();if(!b||!e)return;let n=new AbortController;return e.addEventListener(`keydown`,t=>{!v(t,b)||!D.current||(t.preventDefault(),O.current=e.activeElement,D.current.focus())},{signal:n.signal}),()=>n.abort()},[b]);let j=e=>!!e&&!!D.current?.contains(e),M=()=>{k.current.hovered=!0,A()},N=e=>{j(e.relatedTarget)||(k.current.hovered=!1,A())},P=e=>{k.current.focused=!0,A(),j(e.relatedTarget)||(O.current=e.relatedTarget)},F=e=>{j(e.relatedTarget)||(k.current.focused=!1,A())},I=e=>{if(e.key!==`Escape`)return;let t=(e.target.closest?.(`[data-toast-id]`))?.getAttribute(`data-toast-id`);t&&x.dismiss(t,`close`),x.getSnapshot().toasts.some(e=>e.open)?D.current?.focus():O.current?.focus()},L=u.startsWith(`top`),R=w.toasts.filter(e=>e.visible),z=L?[...R].reverse():R,B=w.overflow>0&&(0,s.jsx)(r.default,{component:`toaster.overflow`,children:g(w.overflow)}),V=(0,s.jsxs)(r.default,{tag:`section`,ref:D,component:`toaster`,...C,variant:[C.variant,{[_[u]]:!0}],props:{...T?{popover:`manual`}:{},"aria-live":`polite`,"aria-atomic":`false`,"aria-relevant":`additions text`,"aria-label":p,tabIndex:-1,...S,onPointerOver:M,onPointerOut:N,onFocus:P,onBlur:F,onKeyDown:I},children:[!L&&B,z.map(e=>(0,s.jsx)(y,{toast:e,store:x,fromTop:L,closeLabel:h},e.id)),L&&B]});return T?V:E?(0,c.createPortal)(V,E):null}var x=b;x.displayName=`Toaster`,exports.createToastStore=p,exports.default=x,exports.defaultToastStore=m,exports.toast=g;

package/components/toaster.mjs

@@ -1,13 +1,13 @@
 "use client";
-import { a as e, t } from "../platform.mjs";
-import { t as n } from "../client.mjs";
+import { n as e } from "../client.mjs";
+import { o as t, t as n } from "../platform.mjs";
 import { n as r } from "../effects.mjs";
 import i from "../box.mjs";
 import { n as a } from "../layer.mjs";
 import { t as o } from "../motion.mjs";
 import { useCallback as s, useRef as c } from "react";
-import { createPortal as l } from "react-dom";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { createPortal as d } from "react-dom";
 import { useSyncExternalStore as f } from "use-sync-external-store/shim";
 //#region src/utils/toast/toastStore.ts
 var p = {
@@ -160,7 +160,7 @@ function x(e, t) {
 	return e.key.toLowerCase() === r && e.altKey === i.has("alt") && e.ctrlKey === i.has("ctrl") && e.shiftKey === i.has("shift") && e.metaKey === i.has("meta");
 }
 function S(e) {
-	let { toast: t, store: n, fromTop: a, closeLabel: s } = e, { mounted: c, ref: l, props: f } = o({ present: t.open });
+	let { toast: t, store: n, fromTop: a, closeLabel: s } = e, { mounted: c, ref: d, props: f } = o({ present: t.open });
 	if (r(() => {
 		c || n.remove(t.id);
 	}, [
@@ -171,8 +171,8 @@ function S(e) {
 	let p = t.action, m = () => {
 		p?.onClick(), p?.closeOnClick !== !1 && n.dismiss(t.id, "action");
 	};
-	return /* @__PURE__ */ d(i, {
-		ref: l,
+	return /* @__PURE__ */ u(i, {
+		ref: d,
 		component: "toaster.toast",
 		variant: {
 			[t.kind]: t.kind !== "default",
@@ -184,15 +184,15 @@ function S(e) {
 			...f
 		},
 		children: [
-			/* @__PURE__ */ u(i, {
+			/* @__PURE__ */ l(i, {
 				component: "toaster.message",
 				children: t.message
 			}),
-			t.description !== void 0 && /* @__PURE__ */ u(i, {
+			t.description !== void 0 && /* @__PURE__ */ l(i, {
 				component: "toaster.description",
 				children: t.description
 			}),
-			p && /* @__PURE__ */ u(i, {
+			p && /* @__PURE__ */ l(i, {
 				tag: "button",
 				component: "toaster.action",
 				props: {
@@ -201,7 +201,7 @@ function S(e) {
 				},
 				children: p.label
 			}),
-			t.dismissible && /* @__PURE__ */ u(i, {
+			t.dismissible && /* @__PURE__ */ l(i, {
 				tag: "button",
 				component: "toaster.close",
 				props: {
@@ -214,7 +214,7 @@ function S(e) {
 	});
 }
 function C(o) {
-	let { position: p = "bottom-end", limit: m = 3, duration: h = 5e3, label: g = "Notifications", closeLabel: v = "Close", overflowLabel: y = (e) => `+${e} more`, hotkey: C = "F6", store: w = _, props: T, ...E } = o, D = f(w.subscribe, w.getSnapshot, w.getServerSnapshot), O = a(), k = n(!O), A = c(null), j = c(null), M = c({
+	let { position: p = "bottom-end", limit: m = 3, duration: h = 5e3, label: g = "Notifications", closeLabel: v = "Close", overflowLabel: y = (e) => `+${e} more`, hotkey: C = "F6", store: w = _, props: T, ...E } = o, D = f(w.subscribe, w.getSnapshot, w.getServerSnapshot), O = a(), k = e(!O), A = c(null), j = c(null), M = c({
 		hovered: !1,
 		focused: !1,
 		hidden: !1
@@ -223,22 +223,22 @@ function C(o) {
 		e || t || n ? w.pause() : w.resume();
 	}, [w]);
 	r(() => w.setLimit(m), [w, m]), r(() => w.setDefaultDuration(h), [w, h]), r(() => {
-		let t = A.current;
-		!O || !e() || !t || !t.isConnected || t.matches(":popover-open") || t.showPopover();
+		let e = A.current;
+		!O || !t() || !e || !e.isConnected || e.matches(":popover-open") || e.showPopover();
 	}), r(() => {
-		let e = t();
+		let e = n();
 		if (!e) return;
-		let n = new AbortController();
+		let t = new AbortController();
 		return e.addEventListener("visibilitychange", () => {
 			M.current.hidden = e.hidden, N();
-		}, { signal: n.signal }), () => n.abort();
+		}, { signal: t.signal }), () => t.abort();
 	}, [N]), r(() => {
-		let e = t();
+		let e = n();
 		if (!C || !e) return;
-		let n = new AbortController();
+		let t = new AbortController();
 		return e.addEventListener("keydown", (t) => {
 			!x(t, C) || !A.current || (t.preventDefault(), j.current = e.activeElement, A.current.focus());
-		}, { signal: n.signal }), () => n.abort();
+		}, { signal: t.signal }), () => t.abort();
 	}, [C]);
 	let P = (e) => !!e && !!A.current?.contains(e), F = () => {
 		M.current.hovered = !0, N();
@@ -252,10 +252,10 @@ function C(o) {
 		if (e.key !== "Escape") return;
 		let t = (e.target.closest?.("[data-toast-id]"))?.getAttribute("data-toast-id");
 		t && w.dismiss(t, "close"), w.getSnapshot().toasts.some((e) => e.open) ? A.current?.focus() : j.current?.focus();
-	}, B = p.startsWith("top"), V = D.toasts.filter((e) => e.visible), H = B ? [...V].reverse() : V, U = D.overflow > 0 && /* @__PURE__ */ u(i, {
+	}, B = p.startsWith("top"), V = D.toasts.filter((e) => e.visible), H = B ? [...V].reverse() : V, U = D.overflow > 0 && /* @__PURE__ */ l(i, {
 		component: "toaster.overflow",
 		children: y(D.overflow)
-	}), W = /* @__PURE__ */ d(i, {
+	}), W = /* @__PURE__ */ u(i, {
 		tag: "section",
 		ref: A,
 		component: "toaster",
@@ -277,7 +277,7 @@ function C(o) {
 		},
 		children: [
 			!B && U,
-			H.map((e) => /* @__PURE__ */ u(S, {
+			H.map((e) => /* @__PURE__ */ l(S, {
 				toast: e,
 				store: w,
 				fromTop: B,
@@ -286,7 +286,7 @@ function C(o) {
 			B && U
 		]
 	});
-	return O ? W : k ? l(W, k) : null;
+	return O ? W : k ? d(W, k) : null;
 }
 var w = C;
 w.displayName = "Toaster";

package/components/virtualList.cjs

@@ -0,0 +1 @@
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../effects.cjs"),n=require("../behavior.cjs"),r=require("../scrolling.cjs"),i=require("./list.cjs");let a=require("react"),o=require("react/jsx-runtime");function s(e,t,n){return Math.min(Math.max(e,t),n)}var c;(function(e){let t=e.DEFAULT_OVERSCAN=4,n=e.PIN_REACH=50;function i(e){let t=Array(e.length+1);t[0]=0;for(let n=0;n<e.length;n++)t[n+1]=t[n]+e[n];return t}e.offsetsOf=i;function a(e,t){let n=0,r=0;for(let t of e)n+=t,r++;return r?n/r:t}e.typicalSize=a;function o(e){let{offsets:i,viewStart:a,viewEnd:o,overscan:c=t,pin:l=-1}=e,u=i.length-1,d=i[u]??0;if(u<=0)return{startIndex:0,endIndex:0,offsetY:0,totalHeight:0};let f=s(r.n(i,a,u)-c,0,u-1),p=s(r.n(i,o-.5,u)+1+c,f+1,u);return l>=0&&l<u&&(l<f&&f-l<=n?f=l:l>=p&&l-p<n&&(p=l+1)),{startIndex:f,endIndex:p,offsetY:i[f],totalHeight:d}}e.measuredWindow=o})(c||={});var l=c;function u(e,t){for(let n of Array.from(e.children)){let e=n.getBoundingClientRect();if(e.bottom>t)return{element:n,top:e.top}}return null}var d=150;function f(e,s){let{items:c,itemKey:f,children:p,estimateSize:m=57,overscan:h=6,initialCount:g=20,onRangeChange:_,scrollerRef:v,vars:y,css:b,props:x,...S}=e,C=(0,a.useRef)(null),[w,T]=(0,a.useState)(()=>new Map),[,E]=(0,a.useState)(0),[D,O]=(0,a.useState)({startIndex:0,endIndex:Math.min(g,c.length)}),[k,A]=(0,a.useState)(-1),j=n.a(_),M=(0,a.useCallback)(e=>{C.current=e,typeof s==`function`?s(e):s&&(s.current=e)},[s]),[N,P]=(0,a.useState)(null),F=(0,a.useMemo)(()=>c.map((e,t)=>f(e,t)),[c,f]),I=(0,a.useMemo)(()=>l.typicalSize(w.values(),m),[w,m]),L=N?.count===c.length?N:null,R=L?L.estimate:I,z=(0,a.useMemo)(()=>l.offsetsOf(F.map(e=>w.get(e)??R)),[F,w,R]),B=z[c.length],V=n.o({offsets:z,pin:k,overscan:h,count:c.length,total:B,estimate:R}),H=(0,a.useRef)(null),U=Math.min(D.startIndex,Math.max(0,c.length-1)),W=Math.min(Math.max(D.endIndex,U),c.length),G=n.a(()=>{let e=C.current,{offsets:t,pin:n,overscan:i,count:a}=V.current;if(!e||a===0)return;let o=v?.current??r.t(e),s=e.ownerDocument.defaultView,c=o?o.getBoundingClientRect().top+o.clientTop:0,u=o?o.clientHeight:s?.innerHeight??0,d=e.getBoundingClientRect().top+e.clientTop,f=l.measuredWindow({offsets:t,viewStart:c-d,viewEnd:c-d+u,overscan:i,pin:n});O(e=>e.startIndex===f.startIndex&&e.endIndex===f.endIndex?e:{startIndex:f.startIndex,endIndex:f.endIndex})});t.n(()=>{let e=C.current;if(!e)return;let t=null,n=0,i=v?.current??r.t(e),a=i?i.getBoundingClientRect().top:0,o=parseFloat(getComputedStyle(e).rowGap)||0,s=H.current;if(H.current=null,s?.element.isConnected&&(n+=s.element.getBoundingClientRect().top-s.top),Array.from(e.children).forEach((e,r)=>{let i=U+r,s=F[i];if(s===void 0)return;e.setAttribute(`aria-setsize`,String(c.length)),e.setAttribute(`aria-posinset`,String(i+1));let l=e.getBoundingClientRect(),u=l.height+o,d=w.get(s)??R;l.height>0&&w.get(s)!==u&&(t??=new Map(w),t.set(s,u),l.bottom<=a&&(n+=u-d))}),n!==0){let t=i??e.ownerDocument.defaultView,r=i?i.scrollTop:t?.scrollY??0;t?.scrollTo({top:r+n,behavior:`instant`})}t?(H.current=u(e,a),T(t)):G()}),(0,a.useEffect)(()=>{let e=C.current;if(!e||typeof ResizeObserver>`u`)return;let t=new ResizeObserver(()=>E(e=>e+1));return Array.from(e.children).forEach(e=>t.observe(e)),()=>t.disconnect()},[D,F]),(0,a.useEffect)(()=>{let e=C.current,t=e?.ownerDocument.defaultView;if(!e||!t)return;let n=v?.current??r.t(e),i=n??t,a=0,o=!1,s=0,c=()=>{a||=requestAnimationFrame(()=>(a=0,G()))},l=()=>{let{count:r,total:i,estimate:a}=V.current;P(e=>e??{count:r,total:i,estimate:a}),clearTimeout(s),s=t.setTimeout(()=>{o||(H.current=u(e,n?n.getBoundingClientRect().top:0),P(null))},d)},f=()=>{l(),c()},p=()=>{o=!0,l()},m=()=>{o&&(o=!1,l())};i.addEventListener(`scroll`,f,{passive:!0}),i.addEventListener(`pointerdown`,p,{capture:!0,passive:!0}),t.addEventListener(`pointerup`,m,!0),t.addEventListener(`pointercancel`,m,!0),t.addEventListener(`resize`,c);let h=typeof ResizeObserver>`u`?null:new ResizeObserver(c);return n&&h?.observe(n),()=>{cancelAnimationFrame(a),clearTimeout(s),i.removeEventListener(`scroll`,f),i.removeEventListener(`pointerdown`,p,!0),t.removeEventListener(`pointerup`,m,!0),t.removeEventListener(`pointercancel`,m,!0),t.removeEventListener(`resize`,c),h?.disconnect()}},[v,G,V]),(0,a.useEffect)(()=>{j({startIndex:D.startIndex,endIndex:D.endIndex})},[D,j]);let K=e=>{let t=C.current,n=Array.from(t?.children??[]).findIndex(t=>t.contains(e.target));n>=0&&A(U+n)},q=e=>{C.current?.contains(e.relatedTarget)||A(-1)},J=[];for(let e=U;e<W;e++)J.push((0,o.jsx)(a.Fragment,{children:p(c[e],e)},F[e]));return(0,o.jsx)(i.default,{ref:M,...S,vars:U>0?{...y,"list-first-divider":`block`}:y,css:{...b,overflowAnchor:`none`},transition:`none`,style:{paddingBlockStart:`${z[U]}px`,paddingBlockEnd:`${Math.max(0,(L&&W<c.length?L.total:B)-z[W])}px`},props:{...x,onFocus:K,onBlur:q},children:J})}var p=e.f(f,`VirtualList`);exports.default=p;

package/components/virtualList.d.ts

@@ -0,0 +1,32 @@
+import { Key, RefAttributes } from 'react';
+import { ComponentsAndVariants } from '@box-kite/core/types';
+import { ListProps } from './list';
+export interface VirtualListRange {
+    /** The first item rendered. */
+    startIndex: number;
+    /** One past the last item rendered. */
+    endIndex: number;
+}
+export interface VirtualListProps<TItem, TKey extends keyof ComponentsAndVariants = 'list'> extends Omit<ListProps<TKey>, 'children'> {
+    /** Every item, however many — only the ones near the screen are rendered. */
+    items: readonly TItem[];
+    /** Who an item is: stable across renders, since an item's measured height is kept under it. */
+    itemKey: (item: TItem, index: number) => Key;
+    /** Draws one item: a `List.Item`, a `SwipeItem` — one `<li>` per item, and nothing around it. */
+    children: (item: TItem, index: number) => React.ReactNode;
+    /** What an item counts as until one has been drawn, in px — then the mean of those drawn. Default 57, a `md` item. */
+    estimateSize?: number;
+    /** Items kept either side of what is on screen, so a fast scroll has something to show. Default 6. */
+    overscan?: number;
+    /** How many items render before anything is measured — on a server, and in the first frame. Default 20. */
+    initialCount?: number;
+    /** Fires when the rendered range moves. The way to fetch more: load the next page when `endIndex` nears the end. */
+    onRangeChange?: (range: VirtualListRange) => void;
+    /** What scrolls the list, when it is not the nearest scrolling ancestor — or, with none, the page. */
+    scrollerRef?: React.RefObject<HTMLElement | null>;
+}
+type VirtualListType = (<TItem, TKey extends keyof ComponentsAndVariants = 'list'>(props: VirtualListProps<TItem, TKey> & RefAttributes<HTMLUListElement>) => React.ReactNode) & {
+    displayName?: string;
+};
+declare const VirtualList: VirtualListType;
+export default VirtualList;