@box-kite/react 2.2.17 → 2.3.0

package/components/dialog.mjs

@@ -1,44 +1,44 @@
 "use client";
 import { f as e } from "../react-shared.mjs";
-import { f as t, l as n, n as r, p as i, s as a } from "../platform.mjs";
-import { i as o } from "../client.mjs";
-import { n as s } from "../effects.mjs";
-import c from "../box.mjs";
-import { a as l, n as u, r as d } from "../behavior.mjs";
-import { t as f } from "../identity.mjs";
-import { a as p } from "../reporting.mjs";
-import { t as m } from "../motion.mjs";
-import { H2 as h, P as g } from "./semantics.mjs";
-import { createContext as _, useCallback as v, useContext as y, useMemo as b, useRef as x, useState as S } from "react";
-import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { d as t, g as n, h as r, n as i, s as a, u as o } from "../platform.mjs";
+import { i as s } from "../client.mjs";
+import { n as c } from "../effects.mjs";
+import l from "../box.mjs";
+import { a as u, n as d, r as f } from "../behavior.mjs";
+import { t as p } from "../identity.mjs";
+import { a as m } from "../reporting.mjs";
+import { t as h } from "../motion.mjs";
+import { H2 as g, P as _ } from "./semantics.mjs";
+import { createContext as v, useCallback as y, useContext as b, useMemo as x, useRef as S, useState as C } from "react";
+import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
 //#region src/react/dialog/useScrollLock.ts
-var E = 0;
-function D(e) {
-	let { classNames: t, styleElements: n } = o({ overflow: "hidden" }, !1), i = t.slice(1).join(" ");
-	return s(() => {
-		let t = r();
-		if (!(!e || !t || !i)) return E += 1, t.classList.add(i), () => {
-			--E, E === 0 && t.classList.remove(i);
+var D = 0;
+function O(e) {
+	let { classNames: t, styleElements: n } = s({ overflow: "hidden" }, !1), r = t.slice(1).join(" ");
+	return c(() => {
+		let t = i();
+		if (!(!e || !t || !r)) return D += 1, t.classList.add(r), () => {
+			--D, D === 0 && t.classList.remove(r);
 		};
-	}, [e, i]), n;
+	}, [e, r]), n;
 }
 //#endregion
 //#region src/components/dialog.tsx
-var O = _(null);
-function k(e) {
-	let t = y(O);
+var k = v(null);
+function A(e) {
+	let t = b(k);
 	if (!t) throw Error(`<${e}> must be rendered inside a <Dialog>.`);
 	return t;
 }
-function A(e, t) {
-	return /* @__PURE__ */ w(M, {
+function j(e, t) {
+	return /* @__PURE__ */ T(N, {
 		role: "dialog",
 		...e,
 		elementRef: t
 	});
 }
-function j(e, t) {
-	return /* @__PURE__ */ w(M, {
+function M(e, t) {
+	return /* @__PURE__ */ T(N, {
 		role: "alertdialog",
 		...e,
 		modal: !0,
@@ -46,55 +46,55 @@ function j(e, t) {
 		elementRef: t
 	});
 }
-function M(e) {
-	let { role: r, trigger: i, children: a, open: o, defaultOpen: d = !1, onOpenChange: h, label: g, labelledBy: _, describedBy: y, modal: x = !0, dismissible: E = !0, lockScroll: k = x, initialFocus: A, elementRef: j, props: M, ...P } = e, F = f("dialog"), I = P.id ?? F, [L, R] = p({
+function N(e) {
+	let { role: n, trigger: i, children: a, open: o, defaultOpen: s = !1, onOpenChange: f, label: g, labelledBy: _, describedBy: v, modal: b = !0, dismissible: S = !0, lockScroll: D = b, initialFocus: A, elementRef: j, props: M, ...N } = e, F = p("dialog"), I = N.id ?? F, [L, R] = m({
 		value: o,
-		defaultValue: d,
-		onChange: h,
+		defaultValue: s,
+		onChange: f,
 		interaction: {
-			component: r === "alertdialog" ? "alertDialog" : "dialog",
+			component: n === "alertdialog" ? "alertDialog" : "dialog",
 			type: "openChange"
 		}
-	}), [z, B] = S(null), V = v((e) => {
-		B(e), n(j, e);
-	}, [j]), [H, U] = S(null), [W, G] = S(!1), [K, q] = S({
+	}), [z, B] = C(null), V = y((e) => {
+		B(e), t(j, e);
+	}, [j]), [H, U] = C(null), [W, G] = C(!1), [K, q] = C({
 		title: 0,
 		description: 0
-	}), J = D(L && k);
-	u({
+	}), J = O(L && D);
+	d({
 		enabled: L,
 		returnTo: H
 	});
-	let Y = m(a, L, z), X = v((e) => (q((t) => ({
+	let Y = h(a, L, z), X = y((e) => (q((t) => ({
 		...t,
 		[e]: t[e] + 1
 	})), () => q((t) => ({
 		...t,
 		[e]: t[e] - 1
-	}))), []), Z = b(() => ({
+	}))), []), Z = x(() => ({
 		titleId: `${I}-title`,
 		descriptionId: `${I}-description`,
 		register: X
 	}), [I, X]);
-	N({
+	P({
 		dialog: z,
 		isOpen: L,
 		domOpen: W,
 		setDomOpen: G,
 		setOpen: R,
-		modal: x,
-		dismissible: E,
+		modal: b,
+		dismissible: S,
 		triggerElement: H
-	}), s(() => {
-		let e = t(A);
+	}), c(() => {
+		let e = r(A);
 		!L || !e || e.focus();
 	}, [L, A]);
-	let Q = l((e) => {
+	let Q = u((e) => {
 		R((e) => !e, {
 			reason: "trigger",
 			event: e
 		});
-	}), $ = b(() => ({
+	}), $ = x(() => ({
 		ref: U,
 		props: {
 			"aria-expanded": L,
@@ -106,23 +106,23 @@ function M(e) {
 		I,
 		Q,
 		L
-	]), ee = P;
-	return /* @__PURE__ */ T(C, { children: [
+	]), ee = N;
+	return /* @__PURE__ */ E(w, { children: [
 		J,
 		i?.($),
-		/* @__PURE__ */ w(O.Provider, {
+		/* @__PURE__ */ T(k.Provider, {
 			value: Z,
-			children: /* @__PURE__ */ w(c, {
+			children: /* @__PURE__ */ T(l, {
 				ref: V,
 				tag: "dialog",
 				component: "dialog",
 				...ee,
 				id: I,
 				props: {
-					role: r,
+					role: n,
 					"aria-label": K.title || _ ? void 0 : g,
 					"aria-labelledby": _ ?? (K.title ? Z.titleId : void 0),
-					"aria-describedby": y ?? (K.description ? Z.descriptionId : void 0),
+					"aria-describedby": v ?? (K.description ? Z.descriptionId : void 0),
 					...M
 				},
 				children: Y
@@ -130,64 +130,70 @@ function M(e) {
 		})
 	] });
 }
-function N(e) {
-	let { dialog: t, isOpen: n, domOpen: r, setDomOpen: o, setOpen: c, modal: l, dismissible: u, triggerElement: f } = e, p = x("imperative"), m = a(), h = u ? "any" : "closerequest";
-	s(() => {
-		!t || n === r || (o(n), n ? l ? t.showModal() : t.show() : t.close());
+function P(e) {
+	let { dialog: t, isOpen: r, domOpen: i, setDomOpen: s, setOpen: l, modal: u, dismissible: d, triggerElement: p } = e, m = S("imperative"), h = a(), g = d ? "any" : "closerequest";
+	c(() => {
+		!t || r === i || (s(r), r ? u ? t.showModal() : t.show() : t.close());
 	}, [
 		t,
-		n,
 		r,
-		l,
-		o
-	]), s(() => {
+		i,
+		u,
+		s
+	]), c(() => {
+		if (!(!t || !r || !u)) return o(t, !0), () => o(t, !1);
+	}, [
+		t,
+		r,
+		u
+	]), c(() => {
 		if (!t) return;
 		let e = new AbortController();
 		return t.addEventListener("close", (e) => {
-			o(!1), c(!1, {
-				reason: p.current,
+			s(!1), l(!1, {
+				reason: m.current,
 				event: e
-			}), p.current = "imperative";
+			}), m.current = "imperative";
 		}, { signal: e.signal }), () => e.abort();
 	}, [
 		t,
-		o,
-		c
-	]), s(() => {
-		if (!(!t || !m)) return t.setAttribute("closedby", h), () => t.removeAttribute("closedby");
+		s,
+		l
+	]), c(() => {
+		if (!(!t || !h)) return t.setAttribute("closedby", g), () => t.removeAttribute("closedby");
 	}, [
 		t,
-		m,
-		h
-	]), s(() => {
-		if (!n || !t) return;
-		let e = new AbortController(), r = (t, n) => document.addEventListener(t, n, {
+		h,
+		g
+	]), c(() => {
+		if (!r || !t) return;
+		let e = new AbortController(), i = (t, n) => document.addEventListener(t, n, {
 			signal: e.signal,
 			capture: !0
 		});
-		return r("keydown", (e) => {
-			e.key === "Escape" && (p.current = "escape");
-		}), r("pointerdown", (e) => {
-			i(e, [f]) ? p.current = "trigger" : !i(e, [t]) || P(t, e) ? p.current = "outside-pointer" : p.current = "imperative";
+		return i("keydown", (e) => {
+			e.key === "Escape" && (m.current = "escape");
+		}), i("pointerdown", (e) => {
+			n(e, [p]) ? m.current = "trigger" : !n(e, [t]) || F(t, e) ? m.current = "outside-pointer" : m.current = "imperative";
 		}), () => e.abort();
 	}, [
-		n,
+		r,
 		t,
-		f
-	]), d({
-		enabled: n && !l && !m,
+		p
+	]), f({
+		enabled: r && !u && !h,
 		inside: [t],
 		escapeKey: !0,
 		outsidePointer: !1,
-		onDismiss: (e, t) => c(!1, {
+		onDismiss: (e, t) => l(!1, {
 			reason: "escape",
 			event: t
 		})
-	}), s(() => {
-		if (!t || !n || !u || m) return;
+	}), c(() => {
+		if (!t || !r || !d || h) return;
 		let e = new AbortController();
 		return document.addEventListener("pointerdown", (e) => {
-			i(e, [f]) || i(e, [t]) && !P(t, e) || c(!1, {
+			n(e, [p]) || n(e, [t]) && !F(t, e) || l(!1, {
 				reason: "outside-pointer",
 				event: e
 			});
@@ -197,37 +203,38 @@ function N(e) {
 		}), () => e.abort();
 	}, [
 		t,
-		n,
-		u,
-		m,
-		f,
-		c
+		r,
+		d,
+		h,
+		p,
+		l
 	]);
 }
-function P(e, t) {
+function F(e, t) {
+	if (t.target !== e) return !1;
 	let n = e.getBoundingClientRect();
 	return t.clientX < n.left || t.clientX > n.right || t.clientY < n.top || t.clientY > n.bottom;
 }
-function F(e) {
-	let t = k("Dialog.Title");
-	return s(() => t.register("title"), [t]), /* @__PURE__ */ w(h, {
+function I(e) {
+	let t = A("Dialog.Title");
+	return c(() => t.register("title"), [t]), /* @__PURE__ */ T(g, {
 		id: t.titleId,
 		component: "dialog.title",
 		...e
 	});
 }
-function I(e) {
-	let t = k("Dialog.Description");
-	return s(() => t.register("description"), [t]), /* @__PURE__ */ w(g, {
+function L(e) {
+	let t = A("Dialog.Description");
+	return c(() => t.register("description"), [t]), /* @__PURE__ */ T(_, {
 		id: t.descriptionId,
 		component: "dialog.description",
 		...e
 	});
 }
-F.displayName = "Dialog.Title", I.displayName = "Dialog.Description";
-var L = {
-	Title: F,
-	Description: I
-}, R = Object.assign(e(A, "Dialog"), L), z = Object.assign(e(j, "AlertDialog"), L);
+I.displayName = "Dialog.Title", L.displayName = "Dialog.Description";
+var R = {
+	Title: I,
+	Description: L
+}, z = Object.assign(e(j, "Dialog"), R), B = Object.assign(e(M, "AlertDialog"), R);
 //#endregion
-export { z as AlertDialog, R as default };
+export { B as AlertDialog, z as default };

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("../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;
+"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`,display:`inline-flex`,ai:`center`,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}),(0,p.jsx)(t.default,{tag:`span`,overflow:`hidden`,textOverflow:`ellipsis`,minWidth:0,visibility:Ae==null?`hidden`:void 0,children:Ae??(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

@@ -432,6 +432,8 @@ function E(u, te) {
 		component: "dropdown",
 		props: { onClick: We },
 		position: "relative",
+		display: "inline-flex",
+		ai: "center",
 		pe: T ? void 0 : 6,
 		minWidth: N ? 36 : void 0,
 		width: "fit-content",
@@ -448,10 +450,13 @@ function E(u, te) {
 				comboboxProps: $e,
 				onOpen: Ge
 			}),
-			Re ?? /* @__PURE__ */ b(t, {
+			/* @__PURE__ */ b(t, {
 				tag: "span",
-				visibility: "hidden",
-				children: K || "\xA0"
+				overflow: "hidden",
+				textOverflow: "ellipsis",
+				minWidth: 0,
+				visibility: Re == null ? "hidden" : void 0,
+				children: Re ?? (K || "\xA0")
 			}),
 			tt
 		]

package/components/form.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../reporting.cjs");let i=require("react");var a;(function(e){function t(e){if(!e)throw Error(`[box-kite] <Form> read its entries with no <form> element: its ref never reached the element.`);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}})(a||={});var o=a;function s(e,a){let{onSubmit:s,props:c,...l}=e,u=(0,i.useRef)(null),d=r.i(`form`),{ref:f,...p}=c??{},m=(0,i.useCallback)(e=>{u.current=e,t.l(a,e),t.l(f,e)},[a,f]),h=(0,i.useCallback)(e=>{e.preventDefault();let t=o.getFormEntries(u.current??e.currentTarget);s(t,e),d(`submit`,Object.keys(t),{reason:`submit`,event:e})},[s,d]);return n.useBoxElement({tag:`form`,...l,props:{...p,onSubmit:h}},m)}var c=e.f(s,`Form`);exports.default=c;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../reporting.cjs");let i=require("react");var a;(function(e){function t(e){if(!e)throw Error(`[box-kite] <Form> read its entries with no <form> element: its ref never reached the element.`);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}})(a||={});var o=a;function s(e,a){let{onSubmit:s,props:c,...l}=e,u=(0,i.useRef)(null),d=r.i(`form`),{ref:f,...p}=c??{},m=(0,i.useCallback)(e=>{u.current=e,t.d(a,e),t.d(f,e)},[a,f]),h=(0,i.useCallback)(e=>{e.preventDefault();let t=o.getFormEntries(u.current??e.currentTarget);s(t,e),d(`submit`,Object.keys(t),{reason:`submit`,event:e})},[s,d]);return n.useBoxElement({tag:`form`,...l,props:{...p,onSubmit:h}},m)}var c=e.f(s,`Form`);exports.default=c;

package/components/form.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { f as e } from "../react-shared.mjs";
-import { l as t } from "../platform.mjs";
+import { d as t } from "../platform.mjs";
 import { useBoxElement as n } from "../box.mjs";
 import { i as r } from "../reporting.mjs";
 import { useCallback as i, useRef as a } from "react";

package/components/menu.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../behavior.cjs"),a=require("../identity.cjs"),o=require("../keyboard.cjs"),s=require("../placement.cjs"),c=require("../reporting.cjs"),l=require("../layer.cjs"),u=require("./overlay.cjs"),d=require("../motion.cjs");let f=require("react"),p=require("react/jsx-runtime");var m;(function(e){let t=e.ITEM_SELECTOR=`[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]`;function n(e,t){return t instanceof Element&&t.closest(`[role="menu"]`)===e}e.owns=n;function r(e){return[...e.querySelectorAll(t)].filter(t=>n(e,t))}e.items=r;function i(e){return e.getAttribute(`aria-disabled`)===`true`}e.isDisabled=i;function a(e){return e.getAttribute(`aria-haspopup`)===`menu`}e.isSubTrigger=a;function s(e,t,n){if(e.length!==0)return e[t<0?n>0?0:e.length-1:((t+n)%e.length+e.length)%e.length]}e.step=s;function c(e,t,n){let r=o.t.target(t,n,e.length,t=>e[t].textContent??``);return r<0?void 0:e[r]}e.typeaheadTarget=c})(m||={});var h=m,g=(0,f.createContext)(null);function _(e){let t=(0,f.useContext)(g);if(!t)throw Error(`<${e}> must be rendered inside a <Menu>.`);return t}function v(e){let[t,n]=(0,f.useState)([]);return{panels:t,registerLayer:(0,f.useCallback)(t=>{n(e=>[...e,t]);let r=e?.(t);return()=>{n(e=>e.filter(e=>e!==t)),r?.()}},[e])}}var y=(0,f.createContext)(null);function b(e,t){let{trigger:n,children:r,open:a,defaultOpen:o=!1,onOpenChange:s,label:c,labelledBy:u,side:d=`bottom`,align:m=`start`,offset:_=1,flip:y=!0,matchWidth:b=!1,props:S,...C}=e,w=(0,f.useRef)(`first`),T=i.a(e=>{let t=h.items(e),n=w.current===`last`?t[t.length-1]:t[0];w.current=`first`,(n??e).focus()}),{panels:E,registerLayer:D}=v(),O=l.t({haspopup:`menu`,idPrefix:`menu`,id:C.id,open:a,defaultOpen:o,onOpenChange:s,interaction:{component:`menu`,type:`openChange`},onOpened:T,inside:E}),k=i.a(e=>{(e.key===`ArrowDown`||e.key===`ArrowUp`)&&(e.preventDefault(),w.current=e.key===`ArrowUp`?`last`:`first`,O.isOpen&&O.panelElement?T(O.panelElement):O.setOpen(!0,{reason:`trigger`,event:e}))}),A=(0,f.useMemo)(()=>({ref:O.trigger.ref,props:{...O.trigger.props,onKeyDown:k}}),[k,O.trigger]),j=i.a(e=>O.setOpen(!1,e)),M=(0,f.useMemo)(()=>({open:O.isOpen,closeAll:j,registerLayer:D}),[j,O.isOpen,D]);return(0,p.jsxs)(p.Fragment,{children:[n(A),(0,p.jsx)(g.Provider,{value:M,children:(0,p.jsx)(x,{layer:O,side:d,align:m,offset:_,flip:y,matchWidth:b,label:c,labelledBy:u??(c?void 0:O.triggerId),contentProps:S,...C,elementRef:t,children:r})})]})}function x(e){let{layer:n,side:a,align:c,offset:l,flip:m,matchWidth:g,label:v,labelledBy:y,contentProps:b,closeSelf:x,elementRef:S,children:C,...w}=e,{platform:T,isOpen:E,id:D,triggerElement:O,setPanel:k}=n,A=(0,f.useCallback)(e=>{k(e),t.l(S,e)},[k,S]),j=_(`Menu`),M=(0,f.useRef)({query:``,at:0}),N=s.t({side:a,align:c,offset:l,flip:m,matchWidth:g,anchor:O}),P=d.t(C,E,n.panelElement),F={role:`menu`,"aria-label":v,"aria-labelledby":y,tabIndex:-1,onKeyDown:i.a(e=>{let n=e.currentTarget;if(!h.owns(n,e.target))return;let r=h.items(n),i=r.indexOf(document.activeElement),a=t=>{t&&(e.preventDefault(),t.focus())},s=t.m(n)?`ArrowRight`:`ArrowLeft`;switch(e.key){case`ArrowDown`:return a(h.step(r,i,1));case`ArrowUp`:return a(h.step(r,i,-1));case`Home`:return a(r[0]);case`End`:return a(r[r.length-1]);case`Tab`:return j.closeAll({reason:`tab`,event:e});case s:return x?(e.preventDefault(),x({reason:`trigger`,event:e})):void 0}if(o.t.isPrintable(e)){let t=o.t.push(M.current,e.key,e.timeStamp);a(h.typeaheadTarget(r,t,i))}}),onPointerOver:i.a(e=>{let t=e.currentTarget,n=e.target?.closest(h.ITEM_SELECTOR);!n||!h.owns(t,n)||n===document.activeElement||n.focus()}),...b};return T?(0,p.jsx)(r.default,{ref:A,component:`menu`,...w,variant:[w.variant,{topLayer:!0}],...N.layerProps,id:D,props:{popover:`auto`,...F},children:P}):E?(0,p.jsx)(u.default,{contentRef:A,anchor:O,side:a,align:c,offset:l,flip:m,matchWidth:g,component:`menu`,...w,id:D,props:F,children:C}):null}function S(e,o){let{label:s,children:u,disabled:d,side:m=`end`,align:y=`start`,offset:b=0,flip:S=!0,itemProps:w,props:T,...E}=e,D=_(`Menu.Sub`),O=a.t(`menu-sub`),k=i.a(e=>{(h.items(e)[0]??e).focus()}),A=i.a((e,t)=>{e&&t?.focus()}),{panels:j,registerLayer:M}=v(D.registerLayer),N=c.i(`menu.sub`),P=l.t({haspopup:`menu`,idPrefix:`menu-sub`,id:E.id,onOpened:k,onClosing:A,inside:j});n.n(()=>{if(!(!P.isOpen||!P.panelElement))return D.registerLayer(P.panelElement)},[P.isOpen,P.panelElement,D.registerLayer]),n.n(()=>{D.open||P.setOpen(!1,{reason:`imperative`})},[D.open,P.setOpen]),n.n(()=>{if(!P.isOpen)return;let e=new AbortController;return document.addEventListener(`focusin`,e=>{t.p(e,[P.panelElement,P.triggerElement])||P.setOpen(!1,{reason:`imperative`,event:e})},{signal:e.signal}),()=>e.abort()},[P.isOpen,P.panelElement,P.triggerElement,P.setOpen]);let F=i.a(e=>{let n=t.m(e.currentTarget)?`ArrowLeft`:`ArrowRight`;d||e.key!==n||(e.preventDefault(),P.setOpen(!0,{reason:`trigger`,event:e}),N(`openChange`,!0,{reason:`keyboard`,event:e,item:C(s)}))}),I=i.a(e=>{d||P.setOpen(!0,{reason:`trigger`,event:e})}),L=(0,f.useMemo)(()=>({open:P.isOpen,closeAll:D.closeAll,registerLayer:M}),[P.isOpen,D.closeAll,M]);return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsxs)(r.default,{tag:`button`,ref:d?void 0:P.trigger.ref,component:`menu.item`,variant:{sub:!0},id:O,props:{type:`button`,role:`menuitem`,tabIndex:-1,"aria-disabled":d||void 0,...P.trigger.props,...w,onKeyDown:F,onPointerEnter:I},children:[s,(0,p.jsx)(r.default,{component:`menu.arrow`})]}),!d&&(0,p.jsx)(g.Provider,{value:L,children:(0,p.jsx)(x,{layer:P,side:m,align:y,offset:b,flip:S,matchWidth:!1,labelledBy:O,contentProps:T,closeSelf:e=>P.setOpen(!1,e),...E,elementRef:o,children:u})})]})}var C=(e,t)=>t??(typeof e==`string`?e:void 0);function w(e){let{onSelect:t,disabled:n,closeOnSelect:a=!0,value:o,props:s,children:l,...u}=e,d=_(`Menu.Item`),f=c.i(`menu.item`),m=i.a(e=>{n||(t?.(e),f(`select`,C(l,o),{reason:`select`,event:e}),a&&d.closeAll({reason:`select`,event:e}))});return(0,p.jsx)(r.default,{tag:`button`,component:`menu.item`,...u,props:{type:`button`,role:`menuitem`,tabIndex:-1,"aria-disabled":n||void 0,...s,onClick:m},children:l})}function T(e){let{checked:t,defaultChecked:n=!1,onCheckedChange:a,disabled:o,closeOnSelect:s=!1,value:l,props:u,children:d,...f}=e,m=_(`Menu.CheckboxItem`),[h,g]=i.i({value:t,defaultValue:n,onChange:a}),v=c.i(`menu.checkboxItem`),y=i.a(e=>{o||(g(!h,{reason:`select`,event:e}),v(`checkedChange`,!h,{reason:`select`,event:e,item:C(d,l)}),s&&m.closeAll({reason:`select`,event:e}))});return(0,p.jsxs)(r.default,{tag:`button`,component:`menu.item`,...f,props:{type:`button`,role:`menuitemcheckbox`,tabIndex:-1,"aria-checked":h,"aria-disabled":o||void 0,...u,onClick:y},children:[(0,p.jsx)(r.default,{component:`menu.indicator`,children:h&&(0,p.jsx)(r.default,{component:`menu.check`})}),d]})}function E(e){let{label:t,value:n,defaultValue:r=``,onValueChange:a,children:o,...s}=e,[l,u]=c.a({value:n,defaultValue:r,onChange:a,interaction:{component:`menu.radioGroup`,type:`valueChange`}}),d=i.a((e,t)=>u(e,{reason:`select`,event:t})),m=(0,f.useMemo)(()=>({value:l,select:d}),[l,d]);return(0,p.jsx)(y.Provider,{value:m,children:(0,p.jsx)(O,{label:t,...s,children:o})})}function D(e){let{value:t,disabled:n,closeOnSelect:a=!1,props:o,children:s,...c}=e,l=_(`Menu.RadioItem`),u=(0,f.useContext)(y);if(!u)throw Error(`<Menu.RadioItem> must be rendered inside a <Menu.RadioGroup>.`);let d=u.value===t,m=i.a(e=>{n||(u.select(t,e),a&&l.closeAll({reason:`select`,event:e}))});return(0,p.jsxs)(r.default,{tag:`button`,component:`menu.item`,...c,props:{type:`button`,role:`menuitemradio`,tabIndex:-1,"aria-checked":d,"aria-disabled":n||void 0,...o,onClick:m},children:[(0,p.jsx)(r.default,{component:`menu.indicator`,children:d&&(0,p.jsx)(r.default,{component:`menu.dot`})}),s]})}function O(e){let{label:t,props:n,children:i,...o}=e,s=a.t(`menu-group`);return(0,p.jsxs)(r.default,{component:`menu.group`,...o,props:{role:`group`,"aria-labelledby":t?s:void 0,...n},children:[t&&(0,p.jsx)(r.default,{component:`menu.label`,id:s,props:{role:`presentation`},children:t}),i]})}function k(e){let{props:t,...n}=e;return(0,p.jsx)(r.default,{component:`menu.separator`,...n,props:{role:`separator`,...t}})}w.displayName=`Menu.Item`,T.displayName=`Menu.CheckboxItem`,E.displayName=`Menu.RadioGroup`,D.displayName=`Menu.RadioItem`,O.displayName=`Menu.Group`,k.displayName=`Menu.Separator`;var A=Object.assign(e.f(b,`Menu`),{Item:w,CheckboxItem:T,RadioGroup:E,RadioItem:D,Group:O,Separator:k,Sub:e.f(S,`Menu.Sub`)});exports.default=A;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../effects.cjs"),r=require("../box.cjs"),i=require("../behavior.cjs"),a=require("../identity.cjs"),o=require("../keyboard.cjs"),s=require("../placement.cjs"),c=require("../reporting.cjs"),l=require("../layer.cjs"),u=require("./overlay.cjs"),d=require("../motion.cjs");let f=require("react"),p=require("react/jsx-runtime");var m;(function(e){let t=e.ITEM_SELECTOR=`[role="menuitem"],[role="menuitemcheckbox"],[role="menuitemradio"]`;function n(e,t){return t instanceof Element&&t.closest(`[role="menu"]`)===e}e.owns=n;function r(e){return[...e.querySelectorAll(t)].filter(t=>n(e,t))}e.items=r;function i(e){return e.getAttribute(`aria-disabled`)===`true`}e.isDisabled=i;function a(e){return e.getAttribute(`aria-haspopup`)===`menu`}e.isSubTrigger=a;function s(e,t,n){if(e.length!==0)return e[t<0?n>0?0:e.length-1:((t+n)%e.length+e.length)%e.length]}e.step=s;function c(e,t,n){let r=o.t.target(t,n,e.length,t=>e[t].textContent??``);return r<0?void 0:e[r]}e.typeaheadTarget=c})(m||={});var h=m,g=(0,f.createContext)(null);function _(e){let t=(0,f.useContext)(g);if(!t)throw Error(`<${e}> must be rendered inside a <Menu>.`);return t}function v(e){let[t,n]=(0,f.useState)([]);return{panels:t,registerLayer:(0,f.useCallback)(t=>{n(e=>[...e,t]);let r=e?.(t);return()=>{n(e=>e.filter(e=>e!==t)),r?.()}},[e])}}var y=(0,f.createContext)(null);function b(e,t){let{trigger:n,children:r,open:a,defaultOpen:o=!1,onOpenChange:s,label:c,labelledBy:u,side:d=`bottom`,align:m=`start`,offset:_=1,flip:y=!0,matchWidth:b=!1,props:S,...C}=e,w=(0,f.useRef)(`first`),T=i.a(e=>{let t=h.items(e),n=w.current===`last`?t[t.length-1]:t[0];w.current=`first`,(n??e).focus()}),{panels:E,registerLayer:D}=v(),O=l.t({haspopup:`menu`,idPrefix:`menu`,id:C.id,open:a,defaultOpen:o,onOpenChange:s,interaction:{component:`menu`,type:`openChange`},onOpened:T,inside:E}),k=i.a(e=>{(e.key===`ArrowDown`||e.key===`ArrowUp`)&&(e.preventDefault(),w.current=e.key===`ArrowUp`?`last`:`first`,O.isOpen&&O.panelElement?T(O.panelElement):O.setOpen(!0,{reason:`trigger`,event:e}))}),A=(0,f.useMemo)(()=>({ref:O.trigger.ref,props:{...O.trigger.props,onKeyDown:k}}),[k,O.trigger]),j=i.a(e=>O.setOpen(!1,e)),M=(0,f.useMemo)(()=>({open:O.isOpen,closeAll:j,registerLayer:D}),[j,O.isOpen,D]);return(0,p.jsxs)(p.Fragment,{children:[n(A),(0,p.jsx)(g.Provider,{value:M,children:(0,p.jsx)(x,{layer:O,side:d,align:m,offset:_,flip:y,matchWidth:b,label:c,labelledBy:u??(c?void 0:O.triggerId),contentProps:S,...C,elementRef:t,children:r})})]})}function x(e){let{layer:n,side:a,align:c,offset:l,flip:m,matchWidth:g,label:v,labelledBy:y,contentProps:b,closeSelf:x,elementRef:S,children:C,...w}=e,{platform:T,isOpen:E,id:D,triggerElement:O,setPanel:k}=n,A=(0,f.useCallback)(e=>{k(e),t.d(S,e)},[k,S]),j=_(`Menu`),M=(0,f.useRef)({query:``,at:0}),N=s.t({side:a,align:c,offset:l,flip:m,matchWidth:g,anchor:O}),P=d.t(C,E,n.panelElement),F={role:`menu`,"aria-label":v,"aria-labelledby":y,tabIndex:-1,onKeyDown:i.a(e=>{let n=e.currentTarget;if(!h.owns(n,e.target))return;let r=h.items(n),i=r.indexOf(document.activeElement),a=t=>{t&&(e.preventDefault(),t.focus())},s=t._(n)?`ArrowRight`:`ArrowLeft`;switch(e.key){case`ArrowDown`:return a(h.step(r,i,1));case`ArrowUp`:return a(h.step(r,i,-1));case`Home`:return a(r[0]);case`End`:return a(r[r.length-1]);case`Tab`:return j.closeAll({reason:`tab`,event:e});case s:return x?(e.preventDefault(),x({reason:`trigger`,event:e})):void 0}if(o.t.isPrintable(e)){let t=o.t.push(M.current,e.key,e.timeStamp);a(h.typeaheadTarget(r,t,i))}}),onPointerOver:i.a(e=>{let t=e.currentTarget,n=e.target?.closest(h.ITEM_SELECTOR);!n||!h.owns(t,n)||n===document.activeElement||n.focus()}),...b};return T?(0,p.jsx)(r.default,{ref:A,component:`menu`,...w,variant:[w.variant,{topLayer:!0}],...N.layerProps,id:D,props:{popover:`auto`,...F},children:P}):E?(0,p.jsx)(u.default,{contentRef:A,anchor:O,side:a,align:c,offset:l,flip:m,matchWidth:g,component:`menu`,...w,id:D,props:F,children:C}):null}function S(e,o){let{label:s,children:u,disabled:d,side:m=`end`,align:y=`start`,offset:b=0,flip:S=!0,itemProps:w,props:T,...E}=e,D=_(`Menu.Sub`),O=a.t(`menu-sub`),k=i.a(e=>{(h.items(e)[0]??e).focus()}),A=i.a((e,t)=>{e&&t?.focus()}),{panels:j,registerLayer:M}=v(D.registerLayer),N=c.i(`menu.sub`),P=l.t({haspopup:`menu`,idPrefix:`menu-sub`,id:E.id,onOpened:k,onClosing:A,inside:j});n.n(()=>{if(!(!P.isOpen||!P.panelElement))return D.registerLayer(P.panelElement)},[P.isOpen,P.panelElement,D.registerLayer]),n.n(()=>{D.open||P.setOpen(!1,{reason:`imperative`})},[D.open,P.setOpen]),n.n(()=>{if(!P.isOpen)return;let e=new AbortController;return document.addEventListener(`focusin`,e=>{t.g(e,[P.panelElement,P.triggerElement])||P.setOpen(!1,{reason:`imperative`,event:e})},{signal:e.signal}),()=>e.abort()},[P.isOpen,P.panelElement,P.triggerElement,P.setOpen]);let F=i.a(e=>{let n=t._(e.currentTarget)?`ArrowLeft`:`ArrowRight`;d||e.key!==n||(e.preventDefault(),P.setOpen(!0,{reason:`trigger`,event:e}),N(`openChange`,!0,{reason:`keyboard`,event:e,item:C(s)}))}),I=i.a(e=>{d||P.setOpen(!0,{reason:`trigger`,event:e})}),L=(0,f.useMemo)(()=>({open:P.isOpen,closeAll:D.closeAll,registerLayer:M}),[P.isOpen,D.closeAll,M]);return(0,p.jsxs)(p.Fragment,{children:[(0,p.jsxs)(r.default,{tag:`button`,ref:d?void 0:P.trigger.ref,component:`menu.item`,variant:{sub:!0},id:O,props:{type:`button`,role:`menuitem`,tabIndex:-1,"aria-disabled":d||void 0,...P.trigger.props,...w,onKeyDown:F,onPointerEnter:I},children:[s,(0,p.jsx)(r.default,{component:`menu.arrow`})]}),!d&&(0,p.jsx)(g.Provider,{value:L,children:(0,p.jsx)(x,{layer:P,side:m,align:y,offset:b,flip:S,matchWidth:!1,labelledBy:O,contentProps:T,closeSelf:e=>P.setOpen(!1,e),...E,elementRef:o,children:u})})]})}var C=(e,t)=>t??(typeof e==`string`?e:void 0);function w(e){let{onSelect:t,disabled:n,closeOnSelect:a=!0,value:o,props:s,children:l,...u}=e,d=_(`Menu.Item`),f=c.i(`menu.item`),m=i.a(e=>{n||(t?.(e),f(`select`,C(l,o),{reason:`select`,event:e}),a&&d.closeAll({reason:`select`,event:e}))});return(0,p.jsx)(r.default,{tag:`button`,component:`menu.item`,...u,props:{type:`button`,role:`menuitem`,tabIndex:-1,"aria-disabled":n||void 0,...s,onClick:m},children:l})}function T(e){let{checked:t,defaultChecked:n=!1,onCheckedChange:a,disabled:o,closeOnSelect:s=!1,value:l,props:u,children:d,...f}=e,m=_(`Menu.CheckboxItem`),[h,g]=i.i({value:t,defaultValue:n,onChange:a}),v=c.i(`menu.checkboxItem`),y=i.a(e=>{o||(g(!h,{reason:`select`,event:e}),v(`checkedChange`,!h,{reason:`select`,event:e,item:C(d,l)}),s&&m.closeAll({reason:`select`,event:e}))});return(0,p.jsxs)(r.default,{tag:`button`,component:`menu.item`,...f,props:{type:`button`,role:`menuitemcheckbox`,tabIndex:-1,"aria-checked":h,"aria-disabled":o||void 0,...u,onClick:y},children:[(0,p.jsx)(r.default,{component:`menu.indicator`,children:h&&(0,p.jsx)(r.default,{component:`menu.check`})}),d]})}function E(e){let{label:t,value:n,defaultValue:r=``,onValueChange:a,children:o,...s}=e,[l,u]=c.a({value:n,defaultValue:r,onChange:a,interaction:{component:`menu.radioGroup`,type:`valueChange`}}),d=i.a((e,t)=>u(e,{reason:`select`,event:t})),m=(0,f.useMemo)(()=>({value:l,select:d}),[l,d]);return(0,p.jsx)(y.Provider,{value:m,children:(0,p.jsx)(O,{label:t,...s,children:o})})}function D(e){let{value:t,disabled:n,closeOnSelect:a=!1,props:o,children:s,...c}=e,l=_(`Menu.RadioItem`),u=(0,f.useContext)(y);if(!u)throw Error(`<Menu.RadioItem> must be rendered inside a <Menu.RadioGroup>.`);let d=u.value===t,m=i.a(e=>{n||(u.select(t,e),a&&l.closeAll({reason:`select`,event:e}))});return(0,p.jsxs)(r.default,{tag:`button`,component:`menu.item`,...c,props:{type:`button`,role:`menuitemradio`,tabIndex:-1,"aria-checked":d,"aria-disabled":n||void 0,...o,onClick:m},children:[(0,p.jsx)(r.default,{component:`menu.indicator`,children:d&&(0,p.jsx)(r.default,{component:`menu.dot`})}),s]})}function O(e){let{label:t,props:n,children:i,...o}=e,s=a.t(`menu-group`);return(0,p.jsxs)(r.default,{component:`menu.group`,...o,props:{role:`group`,"aria-labelledby":t?s:void 0,...n},children:[t&&(0,p.jsx)(r.default,{component:`menu.label`,id:s,props:{role:`presentation`},children:t}),i]})}function k(e){let{props:t,...n}=e;return(0,p.jsx)(r.default,{component:`menu.separator`,...n,props:{role:`separator`,...t}})}w.displayName=`Menu.Item`,T.displayName=`Menu.CheckboxItem`,E.displayName=`Menu.RadioGroup`,D.displayName=`Menu.RadioItem`,O.displayName=`Menu.Group`,k.displayName=`Menu.Separator`;var A=Object.assign(e.f(b,`Menu`),{Item:w,CheckboxItem:T,RadioGroup:E,RadioItem:D,Group:O,Separator:k,Sub:e.f(S,`Menu.Sub`)});exports.default=A;

package/components/menu.mjs

@@ -1,6 +1,6 @@
 "use client";
 import { f as e } from "../react-shared.mjs";
-import { l as t, m as n, p as r } from "../platform.mjs";
+import { _ as t, d as n, g as r } from "../platform.mjs";
 import { n as i } from "../effects.mjs";
 import a from "../box.mjs";
 import { a as o, i as s } from "../behavior.mjs";
@@ -120,7 +120,7 @@ function j(e, t) {
 }
 function M(e) {
 	let { layer: r, side: i, align: s, offset: c, flip: d, matchWidth: f, label: p, labelledBy: g, contentProps: v, closeSelf: y, elementRef: x, children: S, ...w } = e, { platform: T, isOpen: D, id: k, triggerElement: A, setPanel: j } = r, M = _((e) => {
-		j(e), t(x, e);
+		j(e), n(x, e);
 	}, [j, x]), N = O("Menu"), P = b({
 		query: "",
 		at: 0
@@ -137,11 +137,11 @@ function M(e) {
 		"aria-labelledby": g,
 		tabIndex: -1,
 		onKeyDown: o((e) => {
-			let t = e.currentTarget;
-			if (!E.owns(t, e.target)) return;
-			let r = E.items(t), i = r.indexOf(document.activeElement), a = (t) => {
+			let n = e.currentTarget;
+			if (!E.owns(n, e.target)) return;
+			let r = E.items(n), i = r.indexOf(document.activeElement), a = (t) => {
 				t && (e.preventDefault(), t.focus());
-			}, o = n(t) ? "ArrowRight" : "ArrowLeft";
+			}, o = t(n) ? "ArrowRight" : "ArrowLeft";
 			switch (e.key) {
 				case "ArrowDown": return a(E.step(r, i, 1));
 				case "ArrowUp": return a(E.step(r, i, -1));
@@ -194,7 +194,7 @@ function M(e) {
 		children: S
 	}) : null;
 }
-function N(e, t) {
+function N(e, n) {
 	let { label: s, children: l, disabled: u, side: d = "end", align: m = "start", offset: h = 0, flip: g = !0, itemProps: _, props: v, ...b } = e, x = O("Menu.Sub"), T = c("menu-sub"), A = o((e) => {
 		(E.items(e)[0] ?? e).focus();
 	}), j = o((e, t) => {
@@ -231,8 +231,8 @@ function N(e, t) {
 		L.setOpen
 	]);
 	let R = o((e) => {
-		let t = n(e.currentTarget) ? "ArrowLeft" : "ArrowRight";
-		u || e.key !== t || (e.preventDefault(), L.setOpen(!0, {
+		let n = t(e.currentTarget) ? "ArrowLeft" : "ArrowRight";
+		u || e.key !== n || (e.preventDefault(), L.setOpen(!0, {
 			reason: "trigger",
 			event: e
 		}), I("openChange", !0, {
@@ -284,7 +284,7 @@ function N(e, t) {
 			contentProps: v,
 			closeSelf: (e) => L.setOpen(!1, e),
 			...b,
-			elementRef: t,
+			elementRef: n,
 			children: l
 		})
 	})] });

package/components/overlay.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("../placement.cjs"),a=require("../layer.cjs");let o=require("react"),s=require("react/jsx-runtime"),c=require("react-dom");function l(l,u){let{side:d=`bottom`,align:f=`center`,offset:p=0,flip:m=!0,onSideChange:h,anchor:g,contentRef:_,matchWidth:v=!0,...y}=l,[b,x]=(0,o.useState)(null),[S,C]=(0,o.useState)(!1),w=(0,o.useRef)(null),T=a.n(),E=(0,o.useRef)(null),D=t.t(!T),O=i.t({side:d,align:f,offset:p,flip:m,matchWidth:v,anchor:g??b,trackSide:!!h});n.n(()=>{let t=E.current;!T||!e.c()||!t||!t.isConnected||t.matches(`:popover-open`)||t.showPopover()}),n.n(()=>{if(T)return;let t=e.f(g)??b;C(!!t&&e.m(t))},[g,b,T]),n.n(()=>{w.current!==O.side&&(w.current=O.side,h?.(O.side))});let k=O.layerProps.ref,A=(0,o.useCallback)(t=>{k?.(t),E.current=t,e.l(u,t)},[k,u]),j=(0,s.jsx)(r.default,{...O.layerProps,ref:A,transition:`none`,overflow:`visible`,props:T?{popover:`manual`}:{dir:S?`rtl`:`ltr`},children:(0,s.jsx)(r.default,{ref:_,...y})});return(0,s.jsxs)(s.Fragment,{children:[!g&&(0,s.jsx)(r.default,{ref:x}),T?j:D&&(0,c.createPortal)(j,D)]})}var u=(0,o.forwardRef)(l);u.displayName=`Overlay`,exports.default=u;
+"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("../placement.cjs"),a=require("../layer.cjs");let o=require("react"),s=require("react/jsx-runtime"),c=require("react-dom");function l(l,u){let{side:d=`bottom`,align:f=`center`,offset:p=0,flip:m=!0,onSideChange:h,anchor:g,contentRef:_,matchWidth:v=!0,...y}=l,[b,x]=(0,o.useState)(null),[S,C]=(0,o.useState)(!1),w=(0,o.useRef)(null),T=a.n(),E=(0,o.useRef)(null),D=t.t(!T),O=i.t({side:d,align:f,offset:p,flip:m,matchWidth:v,anchor:g??b,trackSide:!!h});n.n(()=>{let t=E.current;!T||!e.c()||!t||!t.isConnected||t.matches(`:popover-open`)||t.showPopover()}),n.n(()=>{if(T)return;let t=e.h(g)??b;C(!!t&&e._(t))},[g,b,T]),n.n(()=>{w.current!==O.side&&(w.current=O.side,h?.(O.side))});let k=O.layerProps.ref,A=(0,o.useCallback)(t=>{k?.(t),E.current=t,e.d(u,t)},[k,u]),j=(0,s.jsx)(r.default,{...O.layerProps,ref:A,transition:`none`,overflow:`visible`,props:T?{popover:`manual`}:{dir:S?`rtl`:`ltr`},children:(0,s.jsx)(r.default,{ref:_,...y})});return(0,s.jsxs)(s.Fragment,{children:[!g&&(0,s.jsx)(r.default,{ref:x}),T?j:D&&(0,c.createPortal)(j,D)]})}var u=(0,o.forwardRef)(l);u.displayName=`Overlay`,exports.default=u;

package/components/overlay.mjs

@@ -1,5 +1,5 @@
 "use client";
-import { c as e, f as t, l as n, m as r } from "../platform.mjs";
+import { _ as e, c as t, d as n, h as r } from "../platform.mjs";
 import { t as i } from "../client.mjs";
 import { n as a } from "../effects.mjs";
 import o from "../box.mjs";
@@ -20,12 +20,12 @@ function _(l, _) {
 		trackSide: !!S
 	});
 	a(() => {
-		let t = N.current;
-		!M || !e() || !t || !t.isConnected || t.matches(":popover-open") || t.showPopover();
+		let e = N.current;
+		!M || !t() || !e || !e.isConnected || e.matches(":popover-open") || e.showPopover();
 	}), a(() => {
 		if (M) return;
-		let e = t(C) ?? D;
-		A(!!e && r(e));
+		let t = r(C) ?? D;
+		A(!!t && e(t));
 	}, [
 		C,
 		D,

package/components/popover.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../placement.cjs"),a=require("../layer.cjs"),o=require("./overlay.cjs"),s=require("../motion.cjs");let c=require("react"),l=require("react/jsx-runtime");function u(e,u){let{trigger:d,children:f,open:p,defaultOpen:m=!1,onOpenChange:h,label:g,labelledBy:_,side:v=`bottom`,align:y=`center`,offset:b=2,flip:x=!0,matchWidth:S=!1,autoFocus:C=!0,props:w,...T}=e,E=r.a(e=>{!C||e.contains(document.activeElement)||e.focus()}),{platform:D,isOpen:O,id:k,trigger:A,triggerElement:j,setPanel:M,panelElement:N}=a.t({haspopup:`dialog`,idPrefix:`popover`,id:T.id,interaction:{component:`popover`,type:`openChange`},open:p,defaultOpen:m,onOpenChange:h,onOpened:E}),P=i.t({side:v,align:y,offset:b,flip:x,matchWidth:S,anchor:j}),F=s.t(f,O,N),I=(0,c.useCallback)(e=>{M(e),t.l(u,e)},[M,u]),L={"aria-label":g,"aria-labelledby":_},R=T;return D?(0,l.jsxs)(l.Fragment,{children:[d(A),(0,l.jsx)(n.default,{ref:I,component:`popover`,...R,variant:[R.variant,{topLayer:!0}],...P.layerProps,id:k,props:{popover:`auto`,role:`dialog`,...L,tabIndex:-1,...w},children:F})]}):(0,l.jsxs)(l.Fragment,{children:[d(A),O&&(0,l.jsx)(o.default,{contentRef:I,anchor:j,side:v,align:y,offset:b,flip:x,matchWidth:S,component:`popover`,...R,id:k,props:{role:`dialog`,...L,tabIndex:-1,...w},children:f})]})}var d=e.f(u,`Popover`);exports.default=d;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../placement.cjs"),a=require("../layer.cjs"),o=require("./overlay.cjs"),s=require("../motion.cjs");let c=require("react"),l=require("react/jsx-runtime");function u(e,u){let{trigger:d,children:f,open:p,defaultOpen:m=!1,onOpenChange:h,label:g,labelledBy:_,side:v=`bottom`,align:y=`center`,offset:b=2,flip:x=!0,matchWidth:S=!1,autoFocus:C=!0,initialFocus:w,props:T,...E}=e,D=r.a(e=>{if(!C)return;let n=t.h(w);if(n)return n.focus();e.contains(document.activeElement)||(t.m(e)??e).focus()}),{platform:O,isOpen:k,id:A,trigger:j,triggerElement:M,setPanel:N,panelElement:P}=a.t({haspopup:`dialog`,idPrefix:`popover`,id:E.id,interaction:{component:`popover`,type:`openChange`},open:p,defaultOpen:m,onOpenChange:h,onOpened:D}),F=i.t({side:v,align:y,offset:b,flip:x,matchWidth:S,anchor:M}),I=s.t(f,k,P),L=(0,c.useCallback)(e=>{N(e),t.d(u,e)},[N,u]),R={"aria-label":g,"aria-labelledby":_},z=E;return O?(0,l.jsxs)(l.Fragment,{children:[d(j),(0,l.jsx)(n.default,{ref:L,component:`popover`,...z,variant:[z.variant,{topLayer:!0}],...F.layerProps,id:A,props:{popover:`auto`,role:`dialog`,...R,tabIndex:-1,...T},children:I})]}):(0,l.jsxs)(l.Fragment,{children:[d(j),k&&(0,l.jsx)(o.default,{contentRef:L,anchor:M,side:v,align:y,offset:b,flip:x,matchWidth:S,component:`popover`,...z,id:A,props:{role:`dialog`,...R,tabIndex:-1,...T},children:f})]})}var d=e.f(u,`Popover`);exports.default=d;

package/components/popover.d.ts

@@ -3,6 +3,7 @@ import { ChangeHandler } from '../react/a11y/useControllableState';
 import { PopoverReason, PopoverTrigger as PopoverLayerTrigger, PopoverTriggerAttributes as PopoverLayerTriggerAttributes } from '../react/popover/usePopoverLayer';
 import { ComponentsAndVariants } from '@box-kite/core/types';
 import { AnchorAlign, AnchorSide } from '../utils/anchor/anchorUtils';
+import { ElementLike } from '../utils/dom/domUtils';
 export type { PopoverReason };
 /** The DOM attributes the trigger has to carry. */
 export type PopoverTriggerAttributes = PopoverLayerTriggerAttributes<'dialog'>;
@@ -51,10 +52,15 @@ interface Props<TKey extends keyof ComponentsAndVariants> extends PopoverBoxProp
     /** Whether the panel is at least as wide as its trigger. Default `false` — a panel sizes to its content. */
     matchWidth?: boolean;
     /**
-     * Whether opening moves focus into the panel. Default `true`, which is what APG asks of a dialog. An
-     * `autofocus` attribute inside wins: the browser applies it first and this only acts on what is left.
+     * Whether opening moves focus into the panel: onto its first control, or the panel itself when it has
+     * none. Default `true`, which is what APG asks of a dialog.
      */
     autoFocus?: boolean;
+    /**
+     * Where focus lands on open, instead of the first control — a field whose text should be selected, or a
+     * static element at the top of a long panel. React writes no `autofocus` attribute, so this is the way.
+     */
+    initialFocus?: ElementLike;
 }
 declare const Popover: <TKey extends keyof ComponentsAndVariants = "popover">(props: Props<TKey>) => React.ReactNode;
 export default Popover;