@box-kite/react 2.2.7 → 2.2.9

package/components/dialog.cjs

@@ -1 +1 @@
-"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("../behavior.cjs"),a=require("../identity.cjs"),o=require("./semantics.cjs");let s=require("react"),c=require("react/jsx-runtime");var l=0;function u(r){let{classNames:i,styleElements:a}=e.i({overflow:`hidden`},!1),o=i.slice(1).join(` `);return n.n(()=>{let e=t.n();if(!(!r||!e||!o))return l+=1,e.classList.add(o),()=>{--l,l===0&&e.classList.remove(o)}},[r,o]),a}var d=(0,s.createContext)(null);function f(e){let t=(0,s.useContext)(d);if(!t)throw Error(`<${e}> must be rendered inside a <Dialog>.`);return t}function p(e){return(0,c.jsx)(h,{role:`dialog`,...e})}function m(e){return(0,c.jsx)(h,{role:`alertdialog`,...e,modal:!0,dismissible:!1})}function h(e){let{role:o,trigger:l,children:f,open:p,defaultOpen:m=!1,onOpenChange:h,label:_,labelledBy:v,describedBy:y,modal:b=!0,dismissible:x=!0,lockScroll:S=b,initialFocus:C,props:w,...T}=e,E=a.t(`dialog`),D=T.id??E,[O,k]=i.i({value:p,defaultValue:m,onChange:h}),[A,j]=(0,s.useState)(null),[M,N]=(0,s.useState)(null),[P,F]=(0,s.useState)(!1),[I,L]=(0,s.useState)({title:0,description:0}),R=u(O&&S);i.n({enabled:O,returnTo:M});let z=(0,s.useCallback)(e=>(L(t=>({...t,[e]:t[e]+1})),()=>L(t=>({...t,[e]:t[e]-1}))),[]),B=(0,s.useMemo)(()=>({titleId:`${D}-title`,descriptionId:`${D}-description`,register:z}),[D,z]);g({dialog:A,isOpen:O,domOpen:P,setDomOpen:F,setOpen:k,modal:b,dismissible:x,triggerElement:M}),n.n(()=>{let e=t.l(C);!O||!e||e.focus()},[O,C]);let V=i.a(e=>{k(e=>!e,{reason:`trigger`,event:e})}),H=(0,s.useMemo)(()=>({ref:N,props:{"aria-expanded":O,"aria-haspopup":`dialog`,"aria-controls":O?D:void 0,onClick:V}}),[D,V,O]),U=T;return(0,c.jsxs)(c.Fragment,{children:[R,l?.(H),(0,c.jsx)(d.Provider,{value:B,children:(0,c.jsx)(r.default,{ref:j,tag:`dialog`,component:`dialog`,...U,id:D,props:{role:o,"aria-label":I.title||v?void 0:_,"aria-labelledby":v??(I.title?B.titleId:void 0),"aria-describedby":y??(I.description?B.descriptionId:void 0),...w},children:f})})]})}function g(e){let{dialog:r,isOpen:a,domOpen:o,setDomOpen:c,setOpen:l,modal:u,dismissible:d,triggerElement:f}=e,p=(0,s.useRef)(`imperative`),m=t.a(),h=d?`any`:`closerequest`;n.n(()=>{!r||a===o||(c(a),a?u?r.showModal():r.show():r.close())},[r,a,o,u,c]),n.n(()=>{if(!r)return;let e=new AbortController;return r.addEventListener(`close`,e=>{c(!1),l(!1,{reason:p.current,event:e}),p.current=`imperative`},{signal:e.signal}),()=>e.abort()},[r,c,l]),n.n(()=>{if(!(!r||!m))return r.setAttribute(`closedby`,h),()=>r.removeAttribute(`closedby`)},[r,m,h]),n.n(()=>{if(!a||!r)return;let e=new AbortController,n=(t,n)=>document.addEventListener(t,n,{signal:e.signal,capture:!0});return n(`keydown`,e=>{e.key===`Escape`&&(p.current=`escape`)}),n(`pointerdown`,e=>{t.u(e,[f])?p.current=`trigger`:!t.u(e,[r])||_(r,e)?p.current=`outside-pointer`:p.current=`imperative`}),()=>e.abort()},[a,r,f]),i.r({enabled:a&&!u&&!m,inside:[r],escapeKey:!0,outsidePointer:!1,onDismiss:(e,t)=>l(!1,{reason:`escape`,event:t})}),n.n(()=>{if(!r||!a||!d||m)return;let e=new AbortController;return document.addEventListener(`pointerdown`,e=>{t.u(e,[f])||t.u(e,[r])&&!_(r,e)||l(!1,{reason:`outside-pointer`,event:e})},{signal:e.signal,capture:!0}),()=>e.abort()},[r,a,d,m,f,l])}function _(e,t){let n=e.getBoundingClientRect();return t.clientX<n.left||t.clientX>n.right||t.clientY<n.top||t.clientY>n.bottom}function v(e){let t=f(`Dialog.Title`);return n.n(()=>t.register(`title`),[t]),(0,c.jsx)(o.H2,{id:t.titleId,component:`dialog.title`,...e})}function y(e){let t=f(`Dialog.Description`);return n.n(()=>t.register(`description`),[t]),(0,c.jsx)(o.P,{id:t.descriptionId,component:`dialog.description`,...e})}v.displayName=`Dialog.Title`,y.displayName=`Dialog.Description`;var b={Title:v,Description:y},x=Object.assign(p,b),S=Object.assign(m,b);p.displayName=`Dialog`,m.displayName=`AlertDialog`,exports.AlertDialog=S,exports.default=x;
+"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("../behavior.cjs"),a=require("../identity.cjs"),o=require("../reporting.cjs"),s=require("./semantics.cjs");let c=require("react"),l=require("react/jsx-runtime");var u=0;function d(r){let{classNames:i,styleElements:a}=t.i({overflow:`hidden`},!1),o=i.slice(1).join(` `);return n.n(()=>{let t=e.n();if(!(!r||!t||!o))return u+=1,t.classList.add(o),()=>{--u,u===0&&t.classList.remove(o)}},[r,o]),a}var f=(0,c.createContext)(null);function p(e){let t=(0,c.useContext)(f);if(!t)throw Error(`<${e}> must be rendered inside a <Dialog>.`);return t}function m(e){return(0,l.jsx)(g,{role:`dialog`,...e})}function h(e){return(0,l.jsx)(g,{role:`alertdialog`,...e,modal:!0,dismissible:!1})}function g(t){let{role:s,trigger:u,children:p,open:m,defaultOpen:h=!1,onOpenChange:g,label:v,labelledBy:y,describedBy:b,modal:x=!0,dismissible:S=!0,lockScroll:C=x,initialFocus:w,props:T,...E}=t,D=a.t(`dialog`),O=E.id??D,[k,A]=o.a({value:m,defaultValue:h,onChange:g,interaction:{component:s===`alertdialog`?`alertDialog`:`dialog`,type:`openChange`}}),[j,M]=(0,c.useState)(null),[N,P]=(0,c.useState)(null),[F,I]=(0,c.useState)(!1),[L,R]=(0,c.useState)({title:0,description:0}),z=d(k&&C);i.n({enabled:k,returnTo:N});let B=(0,c.useCallback)(e=>(R(t=>({...t,[e]:t[e]+1})),()=>R(t=>({...t,[e]:t[e]-1}))),[]),V=(0,c.useMemo)(()=>({titleId:`${O}-title`,descriptionId:`${O}-description`,register:B}),[O,B]);_({dialog:j,isOpen:k,domOpen:F,setDomOpen:I,setOpen:A,modal:x,dismissible:S,triggerElement:N}),n.n(()=>{let t=e.d(w);!k||!t||t.focus()},[k,w]);let H=i.a(e=>{A(e=>!e,{reason:`trigger`,event:e})}),U=(0,c.useMemo)(()=>({ref:P,props:{"aria-expanded":k,"aria-haspopup":`dialog`,"aria-controls":k?O:void 0,onClick:H}}),[O,H,k]),W=E;return(0,l.jsxs)(l.Fragment,{children:[z,u?.(U),(0,l.jsx)(f.Provider,{value:V,children:(0,l.jsx)(r.default,{ref:M,tag:`dialog`,component:`dialog`,...W,id:O,props:{role:s,"aria-label":L.title||y?void 0:v,"aria-labelledby":y??(L.title?V.titleId:void 0),"aria-describedby":b??(L.description?V.descriptionId:void 0),...T},children:p})})]})}function _(t){let{dialog:r,isOpen:a,domOpen:o,setDomOpen:s,setOpen:l,modal:u,dismissible:d,triggerElement:f}=t,p=(0,c.useRef)(`imperative`),m=e.s(),h=d?`any`:`closerequest`;n.n(()=>{!r||a===o||(s(a),a?u?r.showModal():r.show():r.close())},[r,a,o,u,s]),n.n(()=>{if(!r)return;let e=new AbortController;return r.addEventListener(`close`,e=>{s(!1),l(!1,{reason:p.current,event:e}),p.current=`imperative`},{signal:e.signal}),()=>e.abort()},[r,s,l]),n.n(()=>{if(!(!r||!m))return r.setAttribute(`closedby`,h),()=>r.removeAttribute(`closedby`)},[r,m,h]),n.n(()=>{if(!a||!r)return;let t=new AbortController,n=(e,n)=>document.addEventListener(e,n,{signal:t.signal,capture:!0});return n(`keydown`,e=>{e.key===`Escape`&&(p.current=`escape`)}),n(`pointerdown`,t=>{e.f(t,[f])?p.current=`trigger`:!e.f(t,[r])||v(r,t)?p.current=`outside-pointer`:p.current=`imperative`}),()=>t.abort()},[a,r,f]),i.r({enabled:a&&!u&&!m,inside:[r],escapeKey:!0,outsidePointer:!1,onDismiss:(e,t)=>l(!1,{reason:`escape`,event:t})}),n.n(()=>{if(!r||!a||!d||m)return;let t=new AbortController;return document.addEventListener(`pointerdown`,t=>{e.f(t,[f])||e.f(t,[r])&&!v(r,t)||l(!1,{reason:`outside-pointer`,event:t})},{signal:t.signal,capture:!0}),()=>t.abort()},[r,a,d,m,f,l])}function v(e,t){let n=e.getBoundingClientRect();return t.clientX<n.left||t.clientX>n.right||t.clientY<n.top||t.clientY>n.bottom}function y(e){let t=p(`Dialog.Title`);return n.n(()=>t.register(`title`),[t]),(0,l.jsx)(s.H2,{id:t.titleId,component:`dialog.title`,...e})}function b(e){let t=p(`Dialog.Description`);return n.n(()=>t.register(`description`),[t]),(0,l.jsx)(s.P,{id:t.descriptionId,component:`dialog.description`,...e})}y.displayName=`Dialog.Title`,b.displayName=`Dialog.Description`;var x={Title:y,Description:b},S=Object.assign(m,x),C=Object.assign(h,x);m.displayName=`Dialog`,h.displayName=`AlertDialog`,exports.AlertDialog=C,exports.default=S;

package/components/dialog.mjs

@@ -1,23 +1,24 @@
 "use client";
-import { i as e } from "../client.mjs";
-import { a as t, l as n, n as r, u as i } from "../platform.mjs";
+import { d as e, f as t, n, s as r } from "../platform.mjs";
+import { i } from "../client.mjs";
 import { n as a } from "../effects.mjs";
 import o from "../box.mjs";
-import { a as s, i as c, n as l, r as u } from "../behavior.mjs";
-import { t as d } from "../identity.mjs";
+import { a as s, n as c, r as l } from "../behavior.mjs";
+import { t as u } from "../identity.mjs";
+import { a as d } from "../reporting.mjs";
 import { H2 as f, P as p } from "./semantics.mjs";
 import { createContext as m, useCallback as h, useContext as g, useMemo as _, useRef as v, useState as y } from "react";
 import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
 //#region src/react/dialog/useScrollLock.ts
 var C = 0;
-function w(t) {
-	let { classNames: n, styleElements: i } = e({ overflow: "hidden" }, !1), o = n.slice(1).join(" ");
+function w(e) {
+	let { classNames: t, styleElements: r } = i({ overflow: "hidden" }, !1), o = t.slice(1).join(" ");
 	return a(() => {
-		let e = r();
-		if (!(!t || !e || !o)) return C += 1, e.classList.add(o), () => {
-			--C, C === 0 && e.classList.remove(o);
+		let t = n();
+		if (!(!e || !t || !o)) return C += 1, t.classList.add(o), () => {
+			--C, C === 0 && t.classList.remove(o);
 		};
-	}, [t, o]), i;
+	}, [e, o]), r;
 }
 //#endregion
 //#region src/components/dialog.tsx
@@ -41,16 +42,20 @@ function O(e) {
 		dismissible: !1
 	});
 }
-function k(e) {
-	let { role: t, trigger: r, children: i, open: u, defaultOpen: f = !1, onOpenChange: p, label: m, labelledBy: g, describedBy: v, modal: C = !0, dismissible: E = !0, lockScroll: D = C, initialFocus: O, props: k, ...j } = e, M = d("dialog"), N = j.id ?? M, [P, F] = c({
-		value: u,
+function k(t) {
+	let { role: n, trigger: r, children: i, open: l, defaultOpen: f = !1, onOpenChange: p, label: m, labelledBy: g, describedBy: v, modal: C = !0, dismissible: E = !0, lockScroll: D = C, initialFocus: O, props: k, ...j } = t, M = u("dialog"), N = j.id ?? M, [P, F] = d({
+		value: l,
 		defaultValue: f,
-		onChange: p
+		onChange: p,
+		interaction: {
+			component: n === "alertdialog" ? "alertDialog" : "dialog",
+			type: "openChange"
+		}
 	}), [I, L] = y(null), [R, z] = y(null), [B, V] = y(!1), [H, U] = y({
 		title: 0,
 		description: 0
 	}), W = w(P && D);
-	l({
+	c({
 		enabled: P,
 		returnTo: R
 	});
@@ -75,8 +80,8 @@ function k(e) {
 		dismissible: E,
 		triggerElement: R
 	}), a(() => {
-		let e = n(O);
-		!P || !e || e.focus();
+		let t = e(O);
+		!P || !t || t.focus();
 	}, [P, O]);
 	let q = s((e) => {
 		F((e) => !e, {
@@ -108,7 +113,7 @@ function k(e) {
 				...Y,
 				id: N,
 				props: {
-					role: t,
+					role: n,
 					"aria-label": H.title || g ? void 0 : m,
 					"aria-labelledby": g ?? (H.title ? K.titleId : void 0),
 					"aria-describedby": v ?? (H.description ? K.descriptionId : void 0),
@@ -120,14 +125,14 @@ function k(e) {
 	] });
 }
 function A(e) {
-	let { dialog: n, isOpen: r, domOpen: o, setDomOpen: s, setOpen: c, modal: l, dismissible: d, triggerElement: f } = e, p = v("imperative"), m = t(), h = d ? "any" : "closerequest";
+	let { dialog: n, isOpen: i, domOpen: o, setDomOpen: s, setOpen: c, modal: u, dismissible: d, triggerElement: f } = e, p = v("imperative"), m = r(), h = d ? "any" : "closerequest";
 	a(() => {
-		!n || r === o || (s(r), r ? l ? n.showModal() : n.show() : n.close());
+		!n || i === o || (s(i), i ? u ? n.showModal() : n.show() : n.close());
 	}, [
 		n,
-		r,
+		i,
 		o,
-		l,
+		u,
 		s
 	]), a(() => {
 		if (!n) return;
@@ -149,22 +154,22 @@ function A(e) {
 		m,
 		h
 	]), a(() => {
-		if (!r || !n) return;
-		let e = new AbortController(), t = (t, n) => document.addEventListener(t, n, {
+		if (!i || !n) return;
+		let e = new AbortController(), r = (t, n) => document.addEventListener(t, n, {
 			signal: e.signal,
 			capture: !0
 		});
-		return t("keydown", (e) => {
+		return r("keydown", (e) => {
 			e.key === "Escape" && (p.current = "escape");
-		}), t("pointerdown", (e) => {
-			i(e, [f]) ? p.current = "trigger" : !i(e, [n]) || j(n, e) ? p.current = "outside-pointer" : p.current = "imperative";
+		}), r("pointerdown", (e) => {
+			t(e, [f]) ? p.current = "trigger" : !t(e, [n]) || j(n, e) ? p.current = "outside-pointer" : p.current = "imperative";
 		}), () => e.abort();
 	}, [
-		r,
+		i,
 		n,
 		f
-	]), u({
-		enabled: r && !l && !m,
+	]), l({
+		enabled: i && !u && !m,
 		inside: [n],
 		escapeKey: !0,
 		outsidePointer: !1,
@@ -173,10 +178,10 @@ function A(e) {
 			event: t
 		})
 	}), a(() => {
-		if (!n || !r || !d || m) return;
+		if (!n || !i || !d || m) return;
 		let e = new AbortController();
 		return document.addEventListener("pointerdown", (e) => {
-			i(e, [f]) || i(e, [n]) && !j(n, e) || c(!1, {
+			t(e, [f]) || t(e, [n]) && !j(n, e) || c(!1, {
 				reason: "outside-pointer",
 				event: e
 			});
@@ -186,7 +191,7 @@ function A(e) {
 		}), () => e.abort();
 	}, [
 		n,
-		r,
+		i,
 		d,
 		m,
 		f,

package/components/dropdown.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../effects.cjs"),t=require("../box.cjs"),n=require("../behavior.cjs"),r=require("../identity.cjs"),i=require("./baseSvg.cjs"),a=require("./button.cjs"),o=require("./flex.cjs"),s=require("./checkbox.cjs"),c=require("./overlay.cjs"),l=require("./presence.cjs"),u=require("./textbox.cjs");let d=require("react"),f=require("react/jsx-runtime");var p=(0,d.createContext)(null);function m(){let e=(0,d.useContext)(p);if(!e)throw Error(`Dropdown sub-components must be used within Dropdown`);return e}var h={item:`dropdown.item`,unselect:`dropdown.unselect`,selectAll:`dropdown.selectAll`};function g({row:e,index:n}){let{valueToUse:r,multiple:i,variant:a,showCheckbox:o,selectRow:c,optionId:l,activeIndex:u,rowRef:d,isRowDisabled:p}=m(),g=e.kind===`item`,_=p(n),v=g?r.includes(e.element.props.value):e.kind===`unselect`&&r.length===0,{value:ee,onClick:y,children:b,...x}=e.element.props,S=o&&i&&g;return(0,f.jsx)(t.default,{ref:d(n),component:h[e.kind],variant:[a,g?{multiple:i,highlighted:n===u}:{highlighted:n===u}],selected:v,...x,id:l(n),children:S?(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(s.default,{readOnly:!0,checked:v,me:2,props:{tabIndex:-1,"aria-hidden":!0}}),b]}):b,props:{role:`option`,..._?{"aria-disabled":!0}:{},...x.props,onClick:_?void 0:e=>{y?.(e),c(n,e)}}})}var _=(0,d.memo)(g,(e,t)=>e.row.element===t.row.element&&e.index===t.index);function v(e,t,n){return e?{role:`listbox`,"aria-labelledby":n,...t?{"aria-multiselectable":!0}:{}}:{role:`status`}}function ee(e){let{presence:n,rows:r,emptyItem:i,triggerRef:a,popupRef:o,listboxId:s,labelledBy:l,itemsProps:u}=e,{present:p,ref:h,props:g}=n,{multiple:ee,variant:b}=m(),[x,S]=(0,d.useState)(!1),te=(0,d.useCallback)(e=>S(e===`top`),[]);return(0,f.jsx)(c.default,{ref:o,anchor:a,side:`bottom`,align:`start`,offset:.5,onSideChange:te,children:(0,f.jsxs)(t.default,{ref:h,component:`dropdown.items`,...u,variant:[b,{closed:!p&&!x,closedUp:!p&&x}],id:s,props:{...v(r.length>0,ee,l),...g},children:[r.map((e,t)=>(0,f.jsx)(_,{row:e,index:t},y(e,t))),r.length===0&&i&&(0,f.jsx)(t.default,{component:`dropdown.emptyItem`,variant:b,...i.props})]})})}function y(e,t){return e.kind===`item`?e.element.props.value:`${e.kind}-${t}`}ee.displayName=`DropdownItems`;function b({id:e,value:t,onValueChange:n,placeholder:r,inputRef:i,comboboxProps:a,onOpen:s}){let c=(0,d.useCallback)(e=>n(e.target.value),[n]),l=(0,d.useCallback)(e=>{e.stopPropagation(),s(e)},[s]);return(0,f.jsx)(o.default,{ai:`center`,position:`absolute`,inset:0,p:3,children:(0,f.jsx)(u.default,{clean:!0,id:e,value:t,placeholder:r,onChange:c,ref:i,color:`currentColor`,width:`fit`,props:{role:`combobox`,"aria-autocomplete":`list`,autoComplete:`off`,spellCheck:!1,...a,onClick:l}})})}function x(e){if(e==null)return``;if(typeof e==`object`){let t=e.props?.children;return t==null?``:typeof t==`object`?(Array.isArray(t)?t:[t]).map(e=>x(e)).join(``):t.toString()}return e.toString()}function S(e){return e==null?[]:Array.isArray(e)?e:[e]}function te(e){let t=e?.props?.disabled;return(Array.isArray(t)?t[0]:t)===!0}function ne(e){return e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey}var re=new Set([` `,`Home`,`End`,`ArrowLeft`,`ArrowRight`]);function ie(s,c){let{name:m,defaultValue:h,value:g,defaultOpen:_,multiple:v=!1,isSearchable:y,searchPlaceholder:ie,children:C,hideIcon:w,showCheckbox:ae=!1,label:oe,labelProps:se,itemsProps:ce,iconProps:le,onValueChange:ue,onChange:de,props:fe,...T}=s,E=(0,d.useRef)(void 0),pe=n.a((e,t)=>{ue?.(v?e:e[0],t),de?.(E.current,e)}),me=`value`in s,he=(0,d.useMemo)(()=>me?S(g):void 0,[me,g]),[D,O]=n.i({value:he,defaultValue:()=>S(h),onChange:pe}),[ge,_e]=(0,d.useState)(null),[k,A]=(0,d.useState)(!!_),j=(0,d.useRef)(null),ve=(0,d.useCallback)(e=>{j.current=e},[]),ye=(0,d.useRef)(null),M=(0,d.useRef)(null),N=r.t(`dropdown`),P=T.id??`${N}-trigger`,be=`${N}-listbox`,F=`${N}-label`,I=oe!=null&&oe!==!1,xe=(0,d.useCallback)(e=>`${N}-option-${e}`,[N]),L=n.a((e=!1)=>{A(!1),e||_e(null)}),R=(0,d.useMemo)(()=>(Array.isArray(C)?C:[C]).flatMap(e=>e).filter(Boolean),[C]),z=(0,d.useMemo)(()=>R.filter(e=>e.type?.displayName===`DropdownItem`),[R]),Se=(0,d.useMemo)(()=>{let e=new Map;for(let t of z)e.set(t,x(t));return e},[z]),B=(0,d.useCallback)(e=>Se.get(e)??x(e),[Se]),Ce=y?ge??``:``,V=(0,d.useMemo)(()=>Ce?z.filter(e=>B(e).toLowerCase().includes(Ce.toLowerCase())):z,[Ce,z,B]),H=(0,d.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownUnselect`),[R]),U=(0,d.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownSelectAll`),[R]),we=(0,d.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownEmptyItem`),[R]),W=(0,d.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownDisplay`),[R]),G=(0,d.useMemo)(()=>!y||W?``:z.filter(e=>D.includes(e.props.value)).map(e=>B(e)).join(`, `),[y,W,z,D,B]),Te=!!(U&&v&&V.length>D.length),Ee=!!(H&&V.length>0&&!Te),K=(0,d.useMemo)(()=>{let e=[];Ee&&H&&e.push({kind:`unselect`,element:H}),Te&&U&&e.push({kind:`selectAll`,element:U});for(let t of V)e.push({kind:`item`,element:t});return e},[Ee,H,Te,U,V]),q=(0,d.useCallback)(e=>te(K[e]?.element),[K]),De=(0,d.useCallback)(e=>{let t=K[e];return t?B(t.element):``},[K,B]),Oe=(0,d.useMemo)(()=>{if(y&&(k||G!==``))return null;if(W)return typeof W.props.children==`function`?W.props.children(D,k):W.props.children;let e=V.filter(e=>D.includes(e.props.value));if(v&&e.length>1)return e.map(e=>B(e)).join(`, `);let t=e.at(0);return t?.props.children??t?.props.value??(v?null:H?.props.children)},[v,V,D,H,k,y,G,W,B]),ke=(0,d.useCallback)((e,...t)=>{if(t.length===0)E.current=void 0,O([],{reason:`clear`,event:e});else if(v&&t.length>1)E.current=void 0,O(t.map(e=>e.props.value),{reason:`select-all`,event:e});else if(t.length===1){let n=t[0];if(E.current=n.props.value,v){let t=D.filter(e=>e!==n.props.value),r=t.length!==D.length;r||t.push(n.props.value),O(t,{reason:r?`deselect`:`select`,event:e})}else O([n.props.value],{reason:`select`,event:e})}e.stopPropagation(),v?y&&setTimeout(()=>M.current?.focus(),0):L()},[v,y,D,O,L]),J=n.a((e,t)=>{let n=K[e];!n||q(e)||(n.kind===`unselect`?ke(t):n.kind===`selectAll`?ke(t,...z):ke(t,n.element))}),Ae=e=>{let t=e===`first`?1:-1;for(let n=e===`first`?0:K.length-1;n>=0&&n<K.length;n+=t)if(!q(n))return n;return-1},Y=e=>{let t=K.findIndex(e=>e.kind===`item`&&D.includes(e.element.props.value));return t!==-1&&!q(t)?t:e===`none`?-1:Ae(e)},X=n.t({count:K.length,focusItems:!1,defaultActiveIndex:_?Y(`none`):-1,isDisabled:q,textOf:y?void 0:De,onSelect:J}),je=X.setActiveIndex,Me=(0,d.useCallback)(e=>je(-1,{reason:`programmatic`,event:e}),[je]);n.r({enabled:k,inside:[j,ye],onDismiss:e=>L(e===`escape`)}),n.n({enabled:k,returnTo:y?M:j}),(0,d.useEffect)(()=>{k&&M.current?.focus()},[k]);let Z=X.activeIndex,Ne=X.activeItem;e.n(()=>{!k||Z===-1||Ne()?.scrollIntoView?.({block:`nearest`})},[k,Z,Ne]);let Q=(e,t)=>{A(!0),X.setActiveIndex(e,{reason:`programmatic`,event:t})},Pe=n.a(e=>{k?L():Q(Y(`none`),e)}),Fe=n.a(e=>{k||Q(Y(`none`),e)}),Ie=n.a(e=>{_e(e),k||A(!0),Me()}),Le=e=>{let{key:t}=e;if(y){if(t===`ArrowDown`||t===`ArrowUp`){e.preventDefault(),Q(Y(t===`ArrowUp`?`last`:e.altKey?`none`:`first`),e);return}t===`Escape`&&_e(``);return}if(t===`ArrowDown`||t===`Enter`||t===` `){e.preventDefault(),Q(Y(e.altKey?`none`:`first`),e);return}if(t===`ArrowUp`){e.preventDefault(),Q(Y(`last`),e);return}if(t===`Home`||t===`End`){e.preventDefault(),Q(Ae(t===`Home`?`first`:`last`),e);return}ne(e)&&(A(!0),X.onKeyDown(e))},Re=n.a(e=>{if(fe?.onKeyDown?.(e),!e.defaultPrevented){if(!k){Le(e);return}if(e.key===`Tab`){!v&&X.activeIndex!==-1&&J(X.activeIndex,e),L();return}if(e.altKey&&e.key===`ArrowUp`){e.preventDefault(),X.activeIndex!==-1&&J(X.activeIndex,e),L();return}if(y&&re.has(e.key)){Me(e);return}X.onKeyDown(e)}}),$=K.length>0||!!we,ze=k&&Z!==-1&&$?xe(Z):void 0,Be=X.itemProps,Ve=(0,d.useMemo)(()=>({valueToUse:D,multiple:v,variant:T.variant,showCheckbox:ae,selectRow:J,optionId:xe,activeIndex:Z,rowRef:e=>Be(e).ref,isRowDisabled:q}),[D,v,T.variant,ae,J,xe,Z,Be,q]),He={"aria-expanded":k,"aria-controls":k&&$?be:void 0,"aria-activedescendant":ze,"aria-labelledby":I?F:void 0,...fe,onKeyDown:Re},Ue=D.map(e=>{let t=JSON.stringify(e);return(0,f.jsx)(u.default,{ref:c,name:m,type:`hidden`,value:t??``},t)}),We=!w&&(0,f.jsx)(o.default,{component:`dropdown.icon`,...le,children:(0,f.jsx)(i.default,{viewBox:`0 0 10 6`,width:`0.6rem`,rotate:k?180:0,children:(0,f.jsx)(`path`,{stroke:`currentColor`,strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:`2`,d:`m1 1 4 4 4-4`})})}),Ge=$&&(0,f.jsx)(l.default,{present:k,children:e=>(0,f.jsx)(ee,{presence:e,rows:K,emptyItem:we,triggerRef:j,popupRef:ye,listboxId:be,labelledBy:I?F:P,itemsProps:ce})}),Ke=y?(0,f.jsxs)(t.default,{ref:ve,component:`dropdown`,props:{onClick:Pe},position:`relative`,pe:w?void 0:6,minWidth:k?36:void 0,width:`fit-content`,...T,id:void 0,children:[Ue,(0,f.jsx)(b,{id:P,value:ge??G,onValueChange:Ie,placeholder:k?ie:void 0,inputRef:M,comboboxProps:He,onOpen:Fe}),Oe??(0,f.jsx)(t.default,{tag:`span`,visibility:`hidden`,children:G||`\xA0`}),We]}):(0,f.jsxs)(a.default,{ref:ve,onClick:Pe,component:`dropdown`,type:`button`,props:{tabIndex:0,role:`combobox`,...He},position:`relative`,pe:w?void 0:6,width:`fit-content`,...T,id:P,children:[Ue,Oe??`\xA0`,We]});return(0,f.jsx)(p.Provider,{value:Ve,children:I?(0,f.jsxs)(o.default,{d:`column`,gap:1,width:`fit-content`,...se,children:[(0,f.jsx)(t.default,{tag:`span`,id:F,children:oe}),Ke,Ge]}):(0,f.jsxs)(f.Fragment,{children:[Ke,Ge]})})}function C(e){let t=e=>null;return t.displayName=e,t}var w=(0,d.forwardRef)(ie);w.Item=C(`DropdownItem`),w.Unselect=C(`DropdownUnselect`),w.SelectAll=C(`DropdownSelectAll`),w.EmptyItem=C(`DropdownEmptyItem`),w.Display=C(`DropdownDisplay`),w.displayName=`Dropdown`,exports.default=w;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../effects.cjs"),t=require("../box.cjs"),n=require("../behavior.cjs"),r=require("../identity.cjs"),i=require("../reporting.cjs"),a=require("./baseSvg.cjs"),o=require("./button.cjs"),s=require("./flex.cjs"),c=require("./checkbox.cjs"),l=require("./overlay.cjs"),u=require("./presence.cjs"),d=require("./textbox.cjs");let f=require("react"),p=require("react/jsx-runtime");var m=(0,f.createContext)(null);function h(){let e=(0,f.useContext)(m);if(!e)throw Error(`Dropdown sub-components must be used within Dropdown`);return e}var ee={item:`dropdown.item`,unselect:`dropdown.unselect`,selectAll:`dropdown.selectAll`};function g({row:e,index:n}){let{valueToUse:r,multiple:i,variant:a,showCheckbox:o,selectRow:s,optionId:l,activeIndex:u,rowRef:d,isRowDisabled:f}=h(),m=e.kind===`item`,g=f(n),_=m?r.includes(e.element.props.value):e.kind===`unselect`&&r.length===0,{value:v,onClick:y,children:b,...x}=e.element.props,S=o&&i&&m;return(0,p.jsx)(t.default,{ref:d(n),component:ee[e.kind],variant:[a,m?{multiple:i,highlighted:n===u}:{highlighted:n===u}],selected:_,...x,id:l(n),children:S?(0,p.jsxs)(p.Fragment,{children:[(0,p.jsx)(c.default,{readOnly:!0,checked:_,me:2,props:{tabIndex:-1,"aria-hidden":!0}}),b]}):b,props:{role:`option`,...g?{"aria-disabled":!0}:{},...x.props,onClick:g?void 0:e=>{y?.(e),s(n,e)}}})}var _=(0,f.memo)(g,(e,t)=>e.row.element===t.row.element&&e.index===t.index);function v(e,t,n){return e?{role:`listbox`,"aria-labelledby":n,...t?{"aria-multiselectable":!0}:{}}:{role:`status`}}function y(e){let{presence:n,rows:r,emptyItem:i,triggerRef:a,popupRef:o,listboxId:s,labelledBy:c,itemsProps:u}=e,{present:d,ref:m,props:ee}=n,{multiple:g,variant:y}=h(),[x,S]=(0,f.useState)(!1),te=(0,f.useCallback)(e=>S(e===`top`),[]);return(0,p.jsx)(l.default,{ref:o,anchor:a,side:`bottom`,align:`start`,offset:.5,onSideChange:te,children:(0,p.jsxs)(t.default,{ref:m,component:`dropdown.items`,...u,variant:[y,{closed:!d&&!x,closedUp:!d&&x}],id:s,props:{...v(r.length>0,g,c),...ee},children:[r.map((e,t)=>(0,p.jsx)(_,{row:e,index:t},b(e,t))),r.length===0&&i&&(0,p.jsx)(t.default,{component:`dropdown.emptyItem`,variant:y,...i.props})]})})}function b(e,t){return e.kind===`item`?e.element.props.value:`${e.kind}-${t}`}y.displayName=`DropdownItems`;function x({id:e,value:t,onValueChange:n,placeholder:r,inputRef:i,comboboxProps:a,onOpen:o}){let c=(0,f.useCallback)(e=>n(e.target.value),[n]),l=(0,f.useCallback)(e=>{e.stopPropagation(),o(e)},[o]);return(0,p.jsx)(s.default,{ai:`center`,position:`absolute`,inset:0,p:3,children:(0,p.jsx)(d.default,{clean:!0,id:e,value:t,placeholder:r,onChange:c,ref:i,color:`currentColor`,width:`fit`,props:{role:`combobox`,"aria-autocomplete":`list`,autoComplete:`off`,spellCheck:!1,...a,onClick:l}})})}function S(e){if(e==null)return``;if(typeof e==`object`){let t=e.props?.children;return t==null?``:typeof t==`object`?(Array.isArray(t)?t:[t]).map(e=>S(e)).join(``):t.toString()}return e.toString()}function te(e){return e==null?[]:Array.isArray(e)?e:[e]}function ne(e){let t=e?.props?.disabled;return(Array.isArray(t)?t[0]:t)===!0}function re(e){return e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey}var ie=new Set([` `,`Home`,`End`,`ArrowLeft`,`ArrowRight`]);function ae(c,l){let{name:h,defaultValue:ee,value:g,defaultOpen:_,multiple:v=!1,isSearchable:b,searchPlaceholder:ae,children:C,hideIcon:w,showCheckbox:oe=!1,label:T,labelProps:se,itemsProps:ce,iconProps:le,onValueChange:ue,onChange:de,props:fe,...E}=c,D=(0,f.useRef)(void 0),pe=n.a((e,t)=>{ue?.(v?e:e[0],t),de?.(D.current,e)}),me=`value`in c,he=(0,f.useMemo)(()=>me?te(g):void 0,[me,g]),[O,k]=i.a({value:he,defaultValue:()=>te(ee),onChange:pe,interaction:{component:`dropdown`,type:`valueChange`}}),[ge,_e]=(0,f.useState)(null),[A,ve]=i.a({defaultValue:!!_,interaction:{component:`dropdown`,type:`openChange`}}),j=(0,f.useRef)(null),ye=(0,f.useCallback)(e=>{j.current=e},[]),be=(0,f.useRef)(null),M=(0,f.useRef)(null),N=r.t(`dropdown`),P=E.id??`${N}-trigger`,xe=`${N}-listbox`,F=`${N}-label`,Se=T!=null&&T!==!1,Ce=(0,f.useCallback)(e=>`${N}-option-${e}`,[N]),I=n.a((e,t,n)=>ve(e,{reason:t,event:n})),L=n.a((e,t,n=!1)=>{I(!1,e,t),n||_e(null)}),R=(0,f.useMemo)(()=>(Array.isArray(C)?C:[C]).flatMap(e=>e).filter(Boolean),[C]),z=(0,f.useMemo)(()=>R.filter(e=>e.type?.displayName===`DropdownItem`),[R]),we=(0,f.useMemo)(()=>{let e=new Map;for(let t of z)e.set(t,S(t));return e},[z]),B=(0,f.useCallback)(e=>we.get(e)??S(e),[we]),Te=b?ge??``:``,V=(0,f.useMemo)(()=>Te?z.filter(e=>B(e).toLowerCase().includes(Te.toLowerCase())):z,[Te,z,B]),H=(0,f.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownUnselect`),[R]),U=(0,f.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownSelectAll`),[R]),Ee=(0,f.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownEmptyItem`),[R]),W=(0,f.useMemo)(()=>R.find(e=>e.type?.displayName===`DropdownDisplay`),[R]),G=(0,f.useMemo)(()=>!b||W?``:z.filter(e=>O.includes(e.props.value)).map(e=>B(e)).join(`, `),[b,W,z,O,B]),De=!!(U&&v&&V.length>O.length),Oe=!!(H&&V.length>0&&!De),K=(0,f.useMemo)(()=>{let e=[];Oe&&H&&e.push({kind:`unselect`,element:H}),De&&U&&e.push({kind:`selectAll`,element:U});for(let t of V)e.push({kind:`item`,element:t});return e},[Oe,H,De,U,V]),q=(0,f.useCallback)(e=>ne(K[e]?.element),[K]),ke=(0,f.useCallback)(e=>{let t=K[e];return t?B(t.element):``},[K,B]),Ae=(0,f.useMemo)(()=>{if(b&&(A||G!==``))return null;if(W)return typeof W.props.children==`function`?W.props.children(O,A):W.props.children;let e=V.filter(e=>O.includes(e.props.value));if(v&&e.length>1)return e.map(e=>B(e)).join(`, `);let t=e.at(0);return t?.props.children??t?.props.value??(v?null:H?.props.children)},[v,V,O,H,A,b,G,W,B]),je=(0,f.useCallback)((e,...t)=>{if(t.length===0)D.current=void 0,k([],{reason:`clear`,event:e});else if(v&&t.length>1)D.current=void 0,k(t.map(e=>e.props.value),{reason:`select-all`,event:e});else if(t.length===1){let n=t[0];if(D.current=n.props.value,v){let t=O.filter(e=>e!==n.props.value),r=t.length!==O.length;r||t.push(n.props.value),k(t,{reason:r?`deselect`:`select`,event:e})}else k([n.props.value],{reason:`select`,event:e})}e.stopPropagation(),v?b&&setTimeout(()=>M.current?.focus(),0):L(`select`,e)},[v,b,O,k,L]),J=n.a((e,t)=>{let n=K[e];!n||q(e)||(n.kind===`unselect`?je(t):n.kind===`selectAll`?je(t,...z):je(t,n.element))}),Me=e=>{let t=e===`first`?1:-1;for(let n=e===`first`?0:K.length-1;n>=0&&n<K.length;n+=t)if(!q(n))return n;return-1},Y=e=>{let t=K.findIndex(e=>e.kind===`item`&&O.includes(e.element.props.value));return t!==-1&&!q(t)?t:e===`none`?-1:Me(e)},X=n.t({count:K.length,focusItems:!1,defaultActiveIndex:_?Y(`none`):-1,isDisabled:q,textOf:b?void 0:ke,onSelect:J}),Ne=X.setActiveIndex,Pe=(0,f.useCallback)(e=>Ne(-1,{reason:`programmatic`,event:e}),[Ne]);n.r({enabled:A,inside:[j,be],onDismiss:(e,t)=>L(e,t,e===`escape`)}),n.n({enabled:A,returnTo:b?M:j}),(0,f.useEffect)(()=>{A&&M.current?.focus()},[A]);let Z=X.activeIndex,Fe=X.activeItem;e.n(()=>{!A||Z===-1||Fe()?.scrollIntoView?.({block:`nearest`})},[A,Z,Fe]);let Q=(e,t)=>{I(!0,t.type===`keydown`?`keyboard`:`trigger`,t),X.setActiveIndex(e,{reason:`programmatic`,event:t})},Ie=n.a(e=>{A?L(`trigger`,e):Q(Y(`none`),e)}),Le=n.a(e=>{A||Q(Y(`none`),e)}),Re=n.a(e=>{_e(e),A||I(!0,`input`),Pe()}),ze=e=>{let{key:t}=e;if(b){if(t===`ArrowDown`||t===`ArrowUp`){e.preventDefault(),Q(Y(t===`ArrowUp`?`last`:e.altKey?`none`:`first`),e);return}t===`Escape`&&_e(``);return}if(t===`ArrowDown`||t===`Enter`||t===` `){e.preventDefault(),Q(Y(e.altKey?`none`:`first`),e);return}if(t===`ArrowUp`){e.preventDefault(),Q(Y(`last`),e);return}if(t===`Home`||t===`End`){e.preventDefault(),Q(Me(t===`Home`?`first`:`last`),e);return}re(e)&&(I(!0,`input`,e),X.onKeyDown(e))},Be=n.a(e=>{if(fe?.onKeyDown?.(e),!e.defaultPrevented){if(!A){ze(e);return}if(e.key===`Tab`){!v&&X.activeIndex!==-1&&J(X.activeIndex,e),L(`tab`,e);return}if(e.altKey&&e.key===`ArrowUp`){e.preventDefault(),X.activeIndex!==-1&&J(X.activeIndex,e),L(`keyboard`,e);return}if(b&&ie.has(e.key)){Pe(e);return}X.onKeyDown(e)}}),$=K.length>0||!!Ee,Ve=A&&Z!==-1&&$?Ce(Z):void 0,He=X.itemProps,Ue=(0,f.useMemo)(()=>({valueToUse:O,multiple:v,variant:E.variant,showCheckbox:oe,selectRow:J,optionId:Ce,activeIndex:Z,rowRef:e=>He(e).ref,isRowDisabled:q}),[O,v,E.variant,oe,J,Ce,Z,He,q]),We={"aria-expanded":A,"aria-controls":A&&$?xe:void 0,"aria-activedescendant":Ve,"aria-labelledby":Se?F:void 0,...fe,onKeyDown:Be},Ge=O.map(e=>{let t=JSON.stringify(e);return(0,p.jsx)(d.default,{ref:l,name:h,type:`hidden`,value:t??``},t)}),Ke=!w&&(0,p.jsx)(s.default,{component:`dropdown.icon`,...le,children:(0,p.jsx)(a.default,{viewBox:`0 0 10 6`,width:`0.6rem`,rotate:A?180:0,children:(0,p.jsx)(`path`,{stroke:`currentColor`,strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:`2`,d:`m1 1 4 4 4-4`})})}),qe=$&&(0,p.jsx)(u.default,{present:A,children:e=>(0,p.jsx)(y,{presence:e,rows:K,emptyItem:Ee,triggerRef:j,popupRef:be,listboxId:xe,labelledBy:Se?F:P,itemsProps:ce})}),Je=b?(0,p.jsxs)(t.default,{ref:ye,component:`dropdown`,props:{onClick:Ie},position:`relative`,pe:w?void 0:6,minWidth:A?36:void 0,width:`fit-content`,...E,id:void 0,children:[Ge,(0,p.jsx)(x,{id:P,value:ge??G,onValueChange:Re,placeholder:A?ae:void 0,inputRef:M,comboboxProps:We,onOpen:Le}),Ae??(0,p.jsx)(t.default,{tag:`span`,visibility:`hidden`,children:G||`\xA0`}),Ke]}):(0,p.jsxs)(o.default,{ref:ye,onClick:Ie,component:`dropdown`,type:`button`,props:{tabIndex:0,role:`combobox`,...We},position:`relative`,pe:w?void 0:6,width:`fit-content`,...E,id:P,children:[Ge,Ae??`\xA0`,Ke]});return(0,p.jsx)(m.Provider,{value:Ue,children:Se?(0,p.jsxs)(s.default,{d:`column`,gap:1,width:`fit-content`,...se,children:[(0,p.jsx)(t.default,{tag:`span`,id:F,children:T}),Je,qe]}):(0,p.jsxs)(p.Fragment,{children:[Je,qe]})})}function C(e){let t=e=>null;return t.displayName=e,t}var w=(0,f.forwardRef)(ae);w.Item=C(`DropdownItem`),w.Unselect=C(`DropdownUnselect`),w.SelectAll=C(`DropdownSelectAll`),w.EmptyItem=C(`DropdownEmptyItem`),w.Display=C(`DropdownDisplay`),w.displayName=`Dropdown`,exports.default=w;

package/components/dropdown.mjs

@@ -1,8 +1,9 @@
 "use client";
 import { n as e } from "../effects.mjs";
 import t from "../box.mjs";
-import { a as n, i as r, n as i, r as a, t as o } from "../behavior.mjs";
-import { t as s } from "../identity.mjs";
+import { a as n, n as r, r as i, t as a } from "../behavior.mjs";
+import { t as o } from "../identity.mjs";
+import { a as s } from "../reporting.mjs";
 import c from "./baseSvg.mjs";
 import ee from "./button.mjs";
 import l from "./flex.mjs";
@@ -167,34 +168,47 @@ var me = /* @__PURE__ */ new Set([
 function E(u, te) {
 	let { name: p, defaultValue: m, value: h, defaultOpen: _, multiple: S = !1, isSearchable: C, searchPlaceholder: oe, children: w, hideIcon: T, showCheckbox: ce = !1, label: E, labelProps: D, itemsProps: O, iconProps: he, onValueChange: ge, onChange: _e, props: ve, ...k } = u, A = y(void 0), ye = n((e, t) => {
 		ge?.(S ? e : e[0], t), _e?.(A.current, e);
-	}), be = "value" in u, xe = v(() => be ? de(h) : void 0, [be, h]), [j, M] = r({
+	}), be = "value" in u, xe = v(() => be ? de(h) : void 0, [be, h]), [j, M] = s({
 		value: xe,
 		defaultValue: () => de(m),
-		onChange: ye
-	}), [Se, Ce] = re(null), [N, P] = re(!!_), F = y(null), we = g((e) => {
-		F.current = e;
-	}, []), Te = y(null), I = y(null), L = s("dropdown"), Ee = k.id ?? `${L}-trigger`, De = `${L}-listbox`, Oe = `${L}-label`, ke = E != null && E !== !1, Ae = g((e) => `${L}-option-${e}`, [L]), R = n((e = !1) => {
-		P(!1), e || Ce(null);
-	}), z = v(() => (Array.isArray(w) ? w : [w]).flatMap((e) => e).filter(Boolean), [w]), B = v(() => z.filter((e) => e.type?.displayName === "DropdownItem"), [z]), je = v(() => {
+		onChange: ye,
+		interaction: {
+			component: "dropdown",
+			type: "valueChange"
+		}
+	}), [Se, Ce] = re(null), [N, we] = s({
+		defaultValue: !!_,
+		interaction: {
+			component: "dropdown",
+			type: "openChange"
+		}
+	}), P = y(null), Te = g((e) => {
+		P.current = e;
+	}, []), Ee = y(null), F = y(null), I = o("dropdown"), De = k.id ?? `${I}-trigger`, Oe = `${I}-listbox`, ke = `${I}-label`, Ae = E != null && E !== !1, je = g((e) => `${I}-option-${e}`, [I]), L = n((e, t, n) => we(e, {
+		reason: t,
+		event: n
+	})), R = n((e, t, n = !1) => {
+		L(!1, e, t), n || Ce(null);
+	}), z = v(() => (Array.isArray(w) ? w : [w]).flatMap((e) => e).filter(Boolean), [w]), B = v(() => z.filter((e) => e.type?.displayName === "DropdownItem"), [z]), Me = v(() => {
 		let e = /* @__PURE__ */ new Map();
 		for (let t of B) e.set(t, ue(t));
 		return e;
-	}, [B]), V = g((e) => je.get(e) ?? ue(e), [je]), Me = C ? Se ?? "" : "", H = v(() => Me ? B.filter((e) => V(e).toLowerCase().includes(Me.toLowerCase())) : B, [
-		Me,
+	}, [B]), V = g((e) => Me.get(e) ?? ue(e), [Me]), Ne = C ? Se ?? "" : "", H = v(() => Ne ? B.filter((e) => V(e).toLowerCase().includes(Ne.toLowerCase())) : B, [
+		Ne,
 		B,
 		V
-	]), U = v(() => z.find((e) => e.type?.displayName === "DropdownUnselect"), [z]), W = v(() => z.find((e) => e.type?.displayName === "DropdownSelectAll"), [z]), Ne = v(() => z.find((e) => e.type?.displayName === "DropdownEmptyItem"), [z]), G = v(() => z.find((e) => e.type?.displayName === "DropdownDisplay"), [z]), K = v(() => !C || G ? "" : B.filter((e) => j.includes(e.props.value)).map((e) => V(e)).join(", "), [
+	]), U = v(() => z.find((e) => e.type?.displayName === "DropdownUnselect"), [z]), W = v(() => z.find((e) => e.type?.displayName === "DropdownSelectAll"), [z]), Pe = v(() => z.find((e) => e.type?.displayName === "DropdownEmptyItem"), [z]), G = v(() => z.find((e) => e.type?.displayName === "DropdownDisplay"), [z]), K = v(() => !C || G ? "" : B.filter((e) => j.includes(e.props.value)).map((e) => V(e)).join(", "), [
 		C,
 		G,
 		B,
 		j,
 		V
-	]), Pe = !!(W && S && H.length > j.length), Fe = !!(U && H.length > 0 && !Pe), q = v(() => {
+	]), Fe = !!(W && S && H.length > j.length), Ie = !!(U && H.length > 0 && !Fe), q = v(() => {
 		let e = [];
-		Fe && U && e.push({
+		Ie && U && e.push({
 			kind: "unselect",
 			element: U
-		}), Pe && W && e.push({
+		}), Fe && W && e.push({
 			kind: "selectAll",
 			element: W
 		});
@@ -204,15 +218,15 @@ function E(u, te) {
 		});
 		return e;
 	}, [
-		Fe,
+		Ie,
 		U,
-		Pe,
+		Fe,
 		W,
 		H
-	]), J = g((e) => fe(q[e]?.element), [q]), Ie = g((e) => {
+	]), J = g((e) => fe(q[e]?.element), [q]), Le = g((e) => {
 		let t = q[e];
 		return t ? V(t.element) : "";
-	}, [q, V]), Le = v(() => {
+	}, [q, V]), Re = v(() => {
 		if (C && (N || K !== "")) return null;
 		if (G) return typeof G.props.children == "function" ? G.props.children(j, N) : G.props.children;
 		let e = H.filter((e) => j.includes(e.props.value));
@@ -229,7 +243,7 @@ function E(u, te) {
 		K,
 		G,
 		V
-	]), Re = g((e, ...t) => {
+	]), ze = g((e, ...t) => {
 		if (t.length === 0) A.current = void 0, M([], {
 			reason: "clear",
 			event: e
@@ -251,7 +265,7 @@ function E(u, te) {
 				event: e
 			});
 		}
-		e.stopPropagation(), S ? C && setTimeout(() => I.current?.focus(), 0) : R();
+		e.stopPropagation(), S ? C && setTimeout(() => F.current?.focus(), 0) : R("select", e);
 	}, [
 		S,
 		C,
@@ -260,55 +274,55 @@ function E(u, te) {
 		R
 	]), Y = n((e, t) => {
 		let n = q[e];
-		!n || J(e) || (n.kind === "unselect" ? Re(t) : n.kind === "selectAll" ? Re(t, ...B) : Re(t, n.element));
-	}), ze = (e) => {
+		!n || J(e) || (n.kind === "unselect" ? ze(t) : n.kind === "selectAll" ? ze(t, ...B) : ze(t, n.element));
+	}), Be = (e) => {
 		let t = e === "first" ? 1 : -1;
 		for (let n = e === "first" ? 0 : q.length - 1; n >= 0 && n < q.length; n += t) if (!J(n)) return n;
 		return -1;
 	}, X = (e) => {
 		let t = q.findIndex((e) => e.kind === "item" && j.includes(e.element.props.value));
-		return t !== -1 && !J(t) ? t : e === "none" ? -1 : ze(e);
-	}, Z = o({
+		return t !== -1 && !J(t) ? t : e === "none" ? -1 : Be(e);
+	}, Z = a({
 		count: q.length,
 		focusItems: !1,
 		defaultActiveIndex: _ ? X("none") : -1,
 		isDisabled: J,
-		textOf: C ? void 0 : Ie,
+		textOf: C ? void 0 : Le,
 		onSelect: Y
-	}), Be = Z.setActiveIndex, Ve = g((e) => Be(-1, {
+	}), Ve = Z.setActiveIndex, He = g((e) => Ve(-1, {
 		reason: "programmatic",
 		event: e
-	}), [Be]);
-	a({
+	}), [Ve]);
+	i({
 		enabled: N,
-		inside: [F, Te],
-		onDismiss: (e) => R(e === "escape")
-	}), i({
+		inside: [P, Ee],
+		onDismiss: (e, t) => R(e, t, e === "escape")
+	}), r({
 		enabled: N,
-		returnTo: C ? I : F
+		returnTo: C ? F : P
 	}), ne(() => {
-		N && I.current?.focus();
+		N && F.current?.focus();
 	}, [N]);
-	let Q = Z.activeIndex, He = Z.activeItem;
+	let Q = Z.activeIndex, Ue = Z.activeItem;
 	e(() => {
-		!N || Q === -1 || He()?.scrollIntoView?.({ block: "nearest" });
+		!N || Q === -1 || Ue()?.scrollIntoView?.({ block: "nearest" });
 	}, [
 		N,
 		Q,
-		He
+		Ue
 	]);
 	let $ = (e, t) => {
-		P(!0), Z.setActiveIndex(e, {
+		L(!0, t.type === "keydown" ? "keyboard" : "trigger", t), Z.setActiveIndex(e, {
 			reason: "programmatic",
 			event: t
 		});
-	}, Ue = n((e) => {
-		N ? R() : $(X("none"), e);
-	}), We = n((e) => {
-		N || $(X("none"), e);
+	}, We = n((e) => {
+		N ? R("trigger", e) : $(X("none"), e);
 	}), Ge = n((e) => {
-		Ce(e), N || P(!0), Ve();
-	}), Ke = (e) => {
+		N || $(X("none"), e);
+	}), Ke = n((e) => {
+		Ce(e), N || L(!0, "input"), He();
+	}), qe = (e) => {
 		let { key: t } = e;
 		if (C) {
 			if (t === "ArrowDown" || t === "ArrowUp") {
@@ -327,39 +341,39 @@ function E(u, te) {
 			return;
 		}
 		if (t === "Home" || t === "End") {
-			e.preventDefault(), $(ze(t === "Home" ? "first" : "last"), e);
+			e.preventDefault(), $(Be(t === "Home" ? "first" : "last"), e);
 			return;
 		}
-		pe(e) && (P(!0), Z.onKeyDown(e));
-	}, qe = n((e) => {
+		pe(e) && (L(!0, "input", e), Z.onKeyDown(e));
+	}, Je = n((e) => {
 		if (ve?.onKeyDown?.(e), !e.defaultPrevented) {
 			if (!N) {
-				Ke(e);
+				qe(e);
 				return;
 			}
 			if (e.key === "Tab") {
-				!S && Z.activeIndex !== -1 && Y(Z.activeIndex, e), R();
+				!S && Z.activeIndex !== -1 && Y(Z.activeIndex, e), R("tab", e);
 				return;
 			}
 			if (e.altKey && e.key === "ArrowUp") {
-				e.preventDefault(), Z.activeIndex !== -1 && Y(Z.activeIndex, e), R();
+				e.preventDefault(), Z.activeIndex !== -1 && Y(Z.activeIndex, e), R("keyboard", e);
 				return;
 			}
 			if (C && me.has(e.key)) {
-				Ve(e);
+				He(e);
 				return;
 			}
 			Z.onKeyDown(e);
 		}
-	}), Je = q.length > 0 || !!Ne, Ye = N && Q !== -1 && Je ? Ae(Q) : void 0, Xe = Z.itemProps, Ze = v(() => ({
+	}), Ye = q.length > 0 || !!Pe, Xe = N && Q !== -1 && Ye ? je(Q) : void 0, Ze = Z.itemProps, Qe = v(() => ({
 		valueToUse: j,
 		multiple: S,
 		variant: k.variant,
 		showCheckbox: ce,
 		selectRow: Y,
-		optionId: Ae,
+		optionId: je,
 		activeIndex: Q,
-		rowRef: (e) => Xe(e).ref,
+		rowRef: (e) => Ze(e).ref,
 		isRowDisabled: J
 	}), [
 		j,
@@ -367,18 +381,18 @@ function E(u, te) {
 		k.variant,
 		ce,
 		Y,
-		Ae,
+		je,
 		Q,
-		Xe,
+		Ze,
 		J
-	]), Qe = {
+	]), $e = {
 		"aria-expanded": N,
-		"aria-controls": N && Je ? De : void 0,
-		"aria-activedescendant": Ye,
-		"aria-labelledby": ke ? Oe : void 0,
+		"aria-controls": N && Ye ? Oe : void 0,
+		"aria-activedescendant": Xe,
+		"aria-labelledby": Ae ? ke : void 0,
 		...ve,
-		onKeyDown: qe
-	}, $e = j.map((e) => {
+		onKeyDown: Je
+	}, et = j.map((e) => {
 		let t = JSON.stringify(e);
 		return /* @__PURE__ */ b(f, {
 			ref: te,
@@ -386,7 +400,7 @@ function E(u, te) {
 			type: "hidden",
 			value: t ?? ""
 		}, t);
-	}), et = !T && /* @__PURE__ */ b(l, {
+	}), tt = !T && /* @__PURE__ */ b(l, {
 		component: "dropdown.icon",
 		...he,
 		children: /* @__PURE__ */ b(c, {
@@ -401,22 +415,22 @@ function E(u, te) {
 				d: "m1 1 4 4 4-4"
 			})
 		})
-	}), tt = Je && /* @__PURE__ */ b(d, {
+	}), nt = Ye && /* @__PURE__ */ b(d, {
 		present: N,
 		children: (e) => /* @__PURE__ */ b(se, {
 			presence: e,
 			rows: q,
-			emptyItem: Ne,
-			triggerRef: F,
-			popupRef: Te,
-			listboxId: De,
-			labelledBy: ke ? Oe : Ee,
+			emptyItem: Pe,
+			triggerRef: P,
+			popupRef: Ee,
+			listboxId: Oe,
+			labelledBy: Ae ? ke : De,
 			itemsProps: O
 		})
-	}), nt = C ? /* @__PURE__ */ x(t, {
-		ref: we,
+	}), rt = C ? /* @__PURE__ */ x(t, {
+		ref: Te,
 		component: "dropdown",
-		props: { onClick: Ue },
+		props: { onClick: We },
 		position: "relative",
 		pe: T ? void 0 : 6,
 		minWidth: N ? 36 : void 0,
@@ -424,47 +438,47 @@ function E(u, te) {
 		...k,
 		id: void 0,
 		children: [
-			$e,
+			et,
 			/* @__PURE__ */ b(le, {
-				id: Ee,
+				id: De,
 				value: Se ?? K,
-				onValueChange: Ge,
+				onValueChange: Ke,
 				placeholder: N ? oe : void 0,
-				inputRef: I,
-				comboboxProps: Qe,
-				onOpen: We
+				inputRef: F,
+				comboboxProps: $e,
+				onOpen: Ge
 			}),
-			Le ?? /* @__PURE__ */ b(t, {
+			Re ?? /* @__PURE__ */ b(t, {
 				tag: "span",
 				visibility: "hidden",
 				children: K || "\xA0"
 			}),
-			et
+			tt
 		]
 	}) : /* @__PURE__ */ x(ee, {
-		ref: we,
-		onClick: Ue,
+		ref: Te,
+		onClick: We,
 		component: "dropdown",
 		type: "button",
 		props: {
 			tabIndex: 0,
 			role: "combobox",
-			...Qe
+			...$e
 		},
 		position: "relative",
 		pe: T ? void 0 : 6,
 		width: "fit-content",
 		...k,
-		id: Ee,
+		id: De,
 		children: [
-			$e,
-			Le ?? "\xA0",
-			et
+			et,
+			Re ?? "\xA0",
+			tt
 		]
 	});
 	return /* @__PURE__ */ b(ae.Provider, {
-		value: Ze,
-		children: ke ? /* @__PURE__ */ x(l, {
+		value: Qe,
+		children: Ae ? /* @__PURE__ */ x(l, {
 			d: "column",
 			gap: 1,
 			width: "fit-content",
@@ -472,13 +486,13 @@ function E(u, te) {
 			children: [
 				/* @__PURE__ */ b(t, {
 					tag: "span",
-					id: Oe,
+					id: ke,
 					children: E
 				}),
-				nt,
-				tt
+				rt,
+				nt
 			]
-		}) : /* @__PURE__ */ x(ie, { children: [nt, tt] })
+		}) : /* @__PURE__ */ x(ie, { children: [rt, nt] })
 	});
 }
 function D(e) {

package/components/form.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../box.cjs");let t=require("react"),n=require("react/jsx-runtime");var r;(function(e){function t(e){let t=Array.from(e.elements).reduce((e,t)=>{let n=t.name;return n?(e[n]||(e[n]=[]),e[n].push(t),e):e},{});return Object.entries(t).reduce((e,[t,r])=>{if(r.length===1){let i=r[0];n(e,t,i.type===`checkbox`||i.type===`radio`?i.checked:i.value)}else n(e,t,r.reduce((e,t)=>(t.type===`checkbox`||t.type===`radio`?t.checked&&e.push(t.value):e.push(t.value),e),[]));return e},{})}e.getFormEntries=t;function n(e,t,n){if(t.includes(`.`)){let r=t.split(`.`),i=e;r.forEach((e,t)=>{if(r.length>t+1){let t=e.match(/^(.+)\[(\d)\]$/);if(t){let[,e,n]=t;i[e]=i[e]||[],i[e][n]=i[e][n]||{},i=i[e][n]}else i[e]=i[e]||{},i=i[e]}else i[e]=n})}else e[t]=n}})(r||={});var i=r;function a(r){let{onSubmit:a,props:o,...s}=r,c=(0,t.useRef)(null),l=(0,t.useCallback)(e=>{e.preventDefault();let t=i.getFormEntries(c.current);a(t,e)},[a]),u={...o,onSubmit:l,ref:c};return(0,n.jsx)(e.default,{tag:`form`,...s,props:u})}a.displayName=`Form`,exports.default=a;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../box.cjs"),t=require("../reporting.cjs");let n=require("react"),r=require("react/jsx-runtime");var i;(function(e){function t(e){let t=Array.from(e.elements).reduce((e,t)=>{let n=t.name;return n?(e[n]||(e[n]=[]),e[n].push(t),e):e},{});return Object.entries(t).reduce((e,[t,r])=>{if(r.length===1){let i=r[0];n(e,t,i.type===`checkbox`||i.type===`radio`?i.checked:i.value)}else n(e,t,r.reduce((e,t)=>(t.type===`checkbox`||t.type===`radio`?t.checked&&e.push(t.value):e.push(t.value),e),[]));return e},{})}e.getFormEntries=t;function n(e,t,n){if(t.includes(`.`)){let r=t.split(`.`),i=e;r.forEach((e,t)=>{if(r.length>t+1){let t=e.match(/^(.+)\[(\d)\]$/);if(t){let[,e,n]=t;i[e]=i[e]||[],i[e][n]=i[e][n]||{},i=i[e][n]}else i[e]=i[e]||{},i=i[e]}else i[e]=n})}else e[t]=n}})(i||={});var a=i;function o(i){let{onSubmit:o,props:s,...c}=i,l=(0,n.useRef)(null),u=t.i(`form`),d=(0,n.useCallback)(e=>{e.preventDefault();let t=a.getFormEntries(l.current);o(t,e),u(`submit`,Object.keys(t),{reason:`submit`,event:e})},[o,u]),f={...s,onSubmit:d,ref:l};return(0,r.jsx)(e.default,{tag:`form`,...c,props:f})}o.displayName=`Form`,exports.default=o;