@box-kite/react 2.3.0 → 2.3.1

package/components/sortableList.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("../reporting.cjs"),o=require("./svg.cjs"),s=require("./visuallyHidden.cjs"),c=require("../scrolling.cjs"),l=require("./list.cjs");let u=require("react"),d=require("react/jsx-runtime");var f;(function(e){e.SLOP=4;function t(e){return e.top+e.height/2}function n(e,n,r){let i=e[n];if(!i)return n;let a=t(i)+r,o=n;if(r>0)for(let r=n+1;r<e.length&&a>t(e[r]);r++)o=r;else for(let r=n-1;r>=0&&a<t(e[r]);r--)o=r;return o}e.targetIndex=n;function r(e,t){let n=e[t];if(!n)return 0;let r=e.length>1?Math.max(0,e[1].top-e[0].top-e[0].height):0;return n.height+r}e.pitchOf=r;function i(e,t,n,i){return t<n&&i>t&&i<=n?-r(e,t):n<t&&i>=n&&i<t?r(e,t):0}e.shiftOf=i;function a(e,t,n){let r=e.slice();if(t===n||t<0||t>=r.length)return r;let[i]=r.splice(t,1);return r.splice(Math.max(0,Math.min(n,r.length)),0,i),r}e.move=a;function o(e,t,n){switch(e){case`ArrowUp`:return Math.max(0,t-1);case`ArrowDown`:return Math.min(n-1,t+1);case`Home`:return 0;case`End`:return n-1;default:return null}}e.keyTarget=o})(f||={});var p=f,m=(0,u.createContext)(null),h=(0,u.createContext)(null),g=48,ee=12,_=`:scope > [data-sortable-value]`;function v(e){return e?Array.from(e.querySelectorAll(_)):[]}function y(e){return v(e).map(e=>e.dataset.sortableValue??``)}function b(e){return new Map(v(e).map(e=>[e.dataset.sortableValue??``,e.getBoundingClientRect().top]))}function te(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}function x(e,r){let{onOrderChange:o,onOrderCommit:f,children:h,variant:_,props:x,...S}=e,C=(0,u.useRef)(null),w=(0,u.useRef)(null),T=(0,u.useRef)(null),[E,D]=(0,u.useState)(null),[O,k]=(0,u.useState)(0),[A,j]=(0,u.useState)(!1),[ne,M]=(0,u.useState)(``),N=`${(0,u.useId)()}-sortable`,P=i.o(E),F=a.r(o,`sortableList`,`orderChange`),I=a.r(f,`sortableList`,`orderCommit`),L=a.i(`sortableList`),R=(0,u.useCallback)(e=>{C.current=e,t.d(r,e)},[r]),z=(e,t)=>`position ${e.indexOf(t)+1} of ${e.length}`,B=(e,t)=>{T.current=b(C.current),F(e,t)};n.n(()=>{let e=T.current;if(e){T.current=null;for(let t of v(C.current)){let n=e.get(t.dataset.sortableValue??``),r=n===void 0?0:n-t.getBoundingClientRect().top,i=parseFloat(getComputedStyle(t).transitionDuration)*1e3||0;Math.abs(r)<1||i===0||typeof t.animate!=`function`||t.animate([{translate:`0 ${r}px`},{translate:`0 0`}],{duration:i,easing:`ease-out`})}}}),(0,u.useEffect)(()=>{if(!A)return;let e=requestAnimationFrame(()=>j(!1));return()=>cancelAnimationFrame(e)},[A]),n.n(()=>{if(!E||E.pointer)return;let e=v(C.current).find(e=>e.dataset.sortableValue===E.value)?.querySelector(`[data-sortable-handle]`);e&&e.ownerDocument.activeElement!==e&&e.focus()});let V=i.a((e,t)=>{let n=e.pointer,r=C.current;if(!n||!r)return;n.lastY=t;let i=t-r.getBoundingClientRect().top-(n.startY-n.startTop),a=n.order.indexOf(e.value);n.to=p.targetIndex(n.slots,a,i),k(i)}),H=(e,t)=>{let n=C.current;if(!n)return;let r=n.getBoundingClientRect().top,i=v(n),a=i.map(e=>e.dataset.sortableValue??``),o=i.map(e=>{let t=e.getBoundingClientRect();return{top:t.top-r,height:t.height}}),s={value:t.value,name:t.name,origin:a,pointer:{id:t.id,startY:t.y,startTop:r,lastY:e.clientY,slots:o,order:a,to:a.indexOf(t.value)}};D(s),V(s,e.clientY)},U=E?.pointer!==void 0;(0,u.useEffect)(()=>{if(!U)return;let e=c.t(C.current),t=0,n=()=>{let r=P.current;if(r?.pointer){let t=r.pointer.lastY,n=e?e.getBoundingClientRect().top:0,i=e?e.getBoundingClientRect().bottom:window.innerHeight,a=t<n+g?-12:t>i-g?ee:0;a&&((e??window).scrollBy(0,a),V(r,t))}t=requestAnimationFrame(n)};return t=requestAnimationFrame(n),()=>cancelAnimationFrame(t)},[U,V,P]);let W=(e,t,n)=>{let r=y(C.current);D({value:e,name:t,origin:r}),L(`grab`,e,{reason:n.type===`keydown`?`keyboard`:`pointer`,event:n,from:r.indexOf(e)}),M(`${t} picked up at ${z(r,e)}. Use the arrow keys to move it, Enter to drop it.`),n.preventDefault()},G=(e,t,n=y(C.current))=>{let r=n.indexOf(e.value);D(null),I(n,{reason:`keyboard`,event:t,value:e.value,from:e.origin.indexOf(e.value),to:r}),M(`${e.name} dropped at ${z(n,e.value)}.`)},K=i.a((e,t)=>{let n=y(C.current);L(`grabCancel`,e.value,{reason:t.type===`keydown`?`escape`:t.type===`blur`?`blur`:`pointercancel`,event:t}),D(null),k(0),te(n,e.origin)||B(e.origin,{reason:e.pointer?`pointer`:`keyboard`,event:t,value:e.value,from:n.indexOf(e.value),to:e.origin.indexOf(e.value)}),M(`${e.name} put back at ${z(e.origin,e.value)}.`)}),q=(e,t,n)=>{let r=y(C.current),i=r.indexOf(e.value);if(i<0||t===i)return r;let a=p.move(r,i,t);return B(a,{reason:`keyboard`,event:n,value:e.value,from:i,to:t}),M(`${e.name}, ${z(a,e.value)}.`),a},J=i.a((e,t,n)=>{e.button!==0||e.defaultPrevented||(e.preventDefault(),e.currentTarget.focus(),e.currentTarget.setPointerCapture?.(e.pointerId),w.current={id:e.pointerId,x:e.clientX,y:e.clientY,value:t,name:n})}),Y=i.a(e=>{let t=P.current;if(t?.pointer&&t.pointer.id===e.pointerId){V(t,e.clientY);return}let n=w.current;!n||n.id!==e.pointerId||Math.hypot(e.clientX-n.x,e.clientY-n.y)<p.SLOP||(w.current=null,H(e,n))}),X=i.a(e=>{let t=w.current;w.current=null;let n=P.current;if(t&&t.id===e.pointerId&&e.type===`pointerup`){n&&!n.pointer?n.value===t.value&&G(n,e):W(t.value,t.name,e);return}let r=n?.pointer;if(!n||!r||r.id!==e.pointerId)return;if(e.currentTarget.releasePointerCapture?.(e.pointerId),j(!0),e.type===`pointercancel`){T.current=b(C.current),K(n,e);return}let i=r.order.indexOf(n.value),a=p.move(r.order,i,r.to),o={reason:`pointer`,event:e,value:n.value,from:i,to:r.to};T.current=b(C.current),D(null),k(0),r.to!==i&&F(a,o),I(a,o),M(`${n.name} dropped at ${z(a,n.value)}.`)}),Z=i.a((e,t,n)=>{if(e.defaultPrevented)return;let r=P.current,i=r&&r.value===t&&!r.pointer?r:void 0;if(!i){(e.key===`Enter`||e.key===` `)&&W(t,n,e);return}if(e.key===`Escape`){e.preventDefault(),K(i,e);return}if(e.key===`Enter`||e.key===` `){e.preventDefault(),G(i,e);return}let a=y(C.current),o=p.keyTarget(e.key,a.indexOf(t),a.length);o!==null&&(e.preventDefault(),q(i,o,e))}),Q=i.a(e=>{setTimeout(()=>{let t=P.current,n=C.current;!t||t.pointer||t.value!==e||!n||n.ownerDocument.activeElement?.closest(`[data-sortable-value]`)?.getAttribute(`data-sortable-value`)!==e&&K(t,new Event(`blur`))})}),$=e=>{let t=P.current;if(!t||t.pointer||!(e.target instanceof Element))return null;let n=e.target.closest(`[data-sortable-value]`);return n&&n.parentElement===C.current&&n.dataset.sortableValue!==t.value?n:null},re=e=>{$(e)&&e.preventDefault()},ie=e=>{let t=$(e),n=P.current;!t||!n||(e.preventDefault(),e.stopPropagation(),G(n,e,q(n,y(C.current).indexOf(t.dataset.sortableValue??``),e)))},ae=(0,u.useMemo)(()=>{let e=E?.pointer,t=e?e.order.indexOf(E.value):-1;return{heldOf:e=>E&&E.value===e?E.pointer?`pointer`:`keyboard`:void 0,translateOf:n=>{if(!e)return;if(n===E.value)return`0 ${Math.round(O)}px`;let r=p.shiftOf(e.slots,t,e.to,e.order.indexOf(n));return r?`0 ${r}px`:void 0},settling:A,instructionsId:N,handleProps:(e,t)=>({type:`button`,"data-sortable-handle":``,"aria-label":`Move ${t}`,"aria-pressed":E?.value===e,"aria-describedby":N,onPointerDown:n=>J(n,e,t),onPointerMove:Y,onPointerUp:X,onPointerCancel:X,onKeyDown:n=>Z(n,e,t),onBlur:()=>Q(e)})}},[E,O,A,N,J,Y,X,Z,Q]);return(0,d.jsxs)(m.Provider,{value:ae,children:[(0,d.jsx)(l.default,{ref:R,...S,variant:_,userSelect:U?`none`:void 0,props:{...x,onMouseDownCapture:re,onClickCapture:ie},children:h}),(0,d.jsx)(s.default,{props:{role:`status`},children:ne}),(0,d.jsx)(s.default,{id:N,children:`Press Enter or Space to pick the item up, the arrow keys to move it, Enter to drop it and Escape to put it back.`})]})}function S(e,t){let{value:n,label:r,disabled:i=!1,variant:a,props:o,...s}=e,c=(0,u.useContext)(m),f=c?.heldOf(n),p=c?.translateOf(n),g=(0,u.useMemo)(()=>({value:n,name:r??n,disabled:i}),[n,r,i]);return(0,d.jsx)(h.Provider,{value:g,children:(0,d.jsx)(l.default.Item,{ref:t,...s,variant:[a,{lifted:f===`pointer`,grabbed:f===`keyboard`,settling:c?.settling??!1}],style:p?{translate:p}:void 0,props:{...o,"data-sortable-value":n}})})}function C(){return(0,d.jsx)(o.Svg,{viewBox:`0 0 16 16`,width:`1rem`,fill:`currentColor`,children:[5,11].flatMap(e=>[3,8,13].map(t=>(0,d.jsx)(o.Circle,{cx:e,cy:t,r:1.4},`${e}-${t}`)))})}function w(e,t){let{children:n,variant:i,props:a,...o}=e,s=(0,u.useContext)(m),c=(0,u.useContext)(h),l=c&&s?s.handleProps(c.value,c.name):{};return r.useBoxElement({tag:`button`,component:`sortableList.handle`,display:`flex`,ai:`center`,jc:`center`,flexShrink:0,width:10,height:10,position:`relative`,zIndex:1,css:{touchAction:`none`},...o,variant:[i,{grabbed:c?s?.heldOf(c.value)!==void 0:!1}],props:{...l,...c?.disabled?{disabled:!0}:{},...a},children:n??(0,d.jsx)(C,{})},t)}var T=e.f(x,`SortableList`);T.Item=e.f(S,`SortableList.Item`),T.Handle=e.f(w,`SortableList.Handle`),exports.SortableUtils=p,exports.default=T;
+"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("../reporting.cjs"),o=require("./svg.cjs"),s=require("./visuallyHidden.cjs"),c=require("../scrolling.cjs"),l=require("./list.cjs");let u=require("react"),d=require("react/jsx-runtime");var f;(function(e){e.SLOP=4;function t(e){return e.top+e.height/2}function n(e,n,r){let i=e[n];if(!i)return n;let a=t(i)+r,o=n;if(r>0)for(let r=n+1;r<e.length&&a>t(e[r]);r++)o=r;else for(let r=n-1;r>=0&&a<t(e[r]);r--)o=r;return o}e.targetIndex=n;function r(e,t){let n=e[t];if(!n)return 0;let r=e.length>1?Math.max(0,e[1].top-e[0].top-e[0].height):0;return n.height+r}e.pitchOf=r;function i(e,t,n,i){return t<n&&i>t&&i<=n?-r(e,t):n<t&&i>=n&&i<t?r(e,t):0}e.shiftOf=i;function a(e,t,n){let r=e.slice();if(t===n||t<0||t>=r.length)return r;let[i]=r.splice(t,1);return r.splice(Math.max(0,Math.min(n,r.length)),0,i),r}e.move=a;function o(e,t,n){switch(e){case`ArrowUp`:return Math.max(0,t-1);case`ArrowDown`:return Math.min(n-1,t+1);case`Home`:return 0;case`End`:return n-1;default:return null}}e.keyTarget=o})(f||={});var p=f,m=(0,u.createContext)(null),h=(0,u.createContext)(null),g=48,ee=12,_=`:scope > [data-sortable-value]`;function v(e){return e?Array.from(e.querySelectorAll(_)):[]}function y(e){return v(e).map(e=>e.dataset.sortableValue??``)}function b(e){return new Map(v(e).map(e=>[e.dataset.sortableValue??``,e.getBoundingClientRect().top]))}function te(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}function x(e,r){let{onOrderChange:o,onOrderCommit:f,children:h,variant:_,props:x,...S}=e,C=(0,u.useRef)(null),w=(0,u.useRef)(null),T=(0,u.useRef)(null),[E,D]=(0,u.useState)(null),[O,k]=(0,u.useState)(0),[A,j]=(0,u.useState)(!1),[ne,M]=(0,u.useState)(``),N=`${(0,u.useId)()}-sortable`,P=i.o(E),F=a.r(o,`sortableList`,`orderChange`),I=a.r(f,`sortableList`,`orderCommit`),L=a.i(`sortableList`),R=(0,u.useCallback)(e=>{C.current=e,t.d(r,e)},[r]),z=(e,t)=>`position ${e.indexOf(t)+1} of ${e.length}`,B=(e,t)=>{T.current=b(C.current),F(e,t)};n.n(()=>{let e=T.current;if(e){T.current=null;for(let t of v(C.current)){let n=e.get(t.dataset.sortableValue??``),r=n===void 0?0:n-t.getBoundingClientRect().top,i=parseFloat(getComputedStyle(t).transitionDuration)*1e3||0;Math.abs(r)<1||i===0||typeof t.animate!=`function`||t.animate([{translate:`0 ${r}px`},{translate:`0 0`}],{duration:i,easing:`ease-out`})}}}),(0,u.useEffect)(()=>{if(!A)return;let e=requestAnimationFrame(()=>j(!1));return()=>cancelAnimationFrame(e)},[A]),n.n(()=>{if(!E||E.pointer)return;let e=v(C.current).find(e=>e.dataset.sortableValue===E.value)?.querySelector(`[data-sortable-handle]`);e&&e.ownerDocument.activeElement!==e&&e.focus()});let V=i.a((e,t)=>{let n=e.pointer,r=C.current;if(!n||!r)return;n.lastY=t;let i=t-r.getBoundingClientRect().top-(n.startY-n.startTop),a=n.order.indexOf(e.value);n.to=p.targetIndex(n.slots,a,i),k(i)}),H=(e,t)=>{let n=C.current;if(!n)return;let r=n.getBoundingClientRect().top,i=v(n),a=i.map(e=>e.dataset.sortableValue??``),o=i.map(e=>{let t=e.getBoundingClientRect();return{top:t.top-r,height:t.height}}),s={value:t.value,name:t.name,origin:a,pointer:{id:t.id,startY:t.y,startTop:r,lastY:e.clientY,slots:o,order:a,to:a.indexOf(t.value)}};D(s),V(s,e.clientY)},U=E?.pointer!==void 0;(0,u.useEffect)(()=>{if(!U)return;let e=c.t(C.current),t=0,n=()=>{let r=P.current;if(r?.pointer){let t=r.pointer.lastY,n=e?e.getBoundingClientRect().top:0,i=e?e.getBoundingClientRect().bottom:window.innerHeight,a=t<n+g?-12:t>i-g?ee:0;a&&((e??window).scrollBy(0,a),V(r,t))}t=requestAnimationFrame(n)};return t=requestAnimationFrame(n),()=>cancelAnimationFrame(t)},[U,V,P]);let W=(e,t,n)=>{let r=y(C.current);D({value:e,name:t,origin:r}),L(`grab`,e,{reason:n.type===`keydown`?`keyboard`:`pointer`,event:n,from:r.indexOf(e)}),M(`${t} picked up at ${z(r,e)}. Use the arrow keys to move it, Enter to drop it.`),n.preventDefault()},G=(e,t,n=y(C.current))=>{let r=n.indexOf(e.value);D(null),I(n,{reason:`keyboard`,event:t,value:e.value,from:e.origin.indexOf(e.value),to:r}),M(`${e.name} dropped at ${z(n,e.value)}.`)},K=i.a((e,t)=>{let n=y(C.current);L(`grabCancel`,e.value,{reason:t.type===`keydown`?`escape`:t.type===`blur`?`blur`:`pointercancel`,event:t}),D(null),k(0),te(n,e.origin)||B(e.origin,{reason:e.pointer?`pointer`:`keyboard`,event:t,value:e.value,from:n.indexOf(e.value),to:e.origin.indexOf(e.value)}),M(`${e.name} put back at ${z(e.origin,e.value)}.`)}),q=(e,t,n)=>{let r=y(C.current),i=r.indexOf(e.value);if(i<0||t===i)return r;let a=p.move(r,i,t);return B(a,{reason:`keyboard`,event:n,value:e.value,from:i,to:t}),M(`${e.name}, ${z(a,e.value)}.`),a},J=i.a((e,t,n)=>{e.button!==0||e.defaultPrevented||(e.preventDefault(),e.currentTarget.focus(),e.currentTarget.setPointerCapture?.(e.pointerId),w.current={id:e.pointerId,x:e.clientX,y:e.clientY,value:t,name:n})}),Y=i.a(e=>{let t=P.current;if(t?.pointer&&t.pointer.id===e.pointerId){V(t,e.clientY);return}let n=w.current;!n||n.id!==e.pointerId||Math.hypot(e.clientX-n.x,e.clientY-n.y)<p.SLOP||(w.current=null,H(e,n))}),X=i.a(e=>{let t=w.current;w.current=null;let n=P.current;if(t&&t.id===e.pointerId&&e.type===`pointerup`){n&&!n.pointer?n.value===t.value&&G(n,e):W(t.value,t.name,e);return}let r=n?.pointer;if(!n||!r||r.id!==e.pointerId)return;if(e.currentTarget.releasePointerCapture?.(e.pointerId),j(!0),e.type===`pointercancel`){T.current=b(C.current),K(n,e);return}let i=r.order.indexOf(n.value),a=p.move(r.order,i,r.to),o={reason:`pointer`,event:e,value:n.value,from:i,to:r.to};T.current=b(C.current),D(null),k(0),r.to!==i&&F(a,o),I(a,o),M(`${n.name} dropped at ${z(a,n.value)}.`)}),Z=i.a((e,t,n)=>{if(e.defaultPrevented)return;let r=P.current,i=r&&r.value===t&&!r.pointer?r:void 0;if(!i){(e.key===`Enter`||e.key===` `)&&W(t,n,e);return}if(e.key===`Escape`){e.preventDefault(),K(i,e);return}if(e.key===`Enter`||e.key===` `){e.preventDefault(),G(i,e);return}let a=y(C.current),o=p.keyTarget(e.key,a.indexOf(t),a.length);o!==null&&(e.preventDefault(),q(i,o,e))}),Q=i.a(e=>{setTimeout(()=>{let t=P.current,n=C.current;!t||t.pointer||t.value!==e||!n||n.ownerDocument.activeElement?.closest(`[data-sortable-value]`)?.getAttribute(`data-sortable-value`)!==e&&K(t,new Event(`blur`))})}),$=e=>{let t=P.current;if(!t||t.pointer||!(e.target instanceof Element))return null;let n=e.target.closest(`[data-sortable-value]`);return n&&n.parentElement===C.current&&n.dataset.sortableValue!==t.value?n:null},re=e=>{$(e)&&e.preventDefault()},ie=e=>{let t=$(e),n=P.current;!t||!n||(e.preventDefault(),e.stopPropagation(),G(n,e,q(n,y(C.current).indexOf(t.dataset.sortableValue??``),e)))},ae=(0,u.useMemo)(()=>{let e=E?.pointer,t=e?e.order.indexOf(E.value):-1;return{heldOf:e=>E&&E.value===e?E.pointer?`pointer`:`keyboard`:void 0,translateOf:n=>{if(!e)return;if(n===E.value)return`0 ${Math.round(O)}px`;let r=p.shiftOf(e.slots,t,e.to,e.order.indexOf(n));return r?`0 ${r}px`:void 0},settling:A,instructionsId:N,handleProps:(e,t)=>({type:`button`,"data-sortable-handle":``,"aria-label":`Move ${t}`,"aria-pressed":E?.value===e,"aria-describedby":N,onPointerDown:n=>J(n,e,t),onPointerMove:Y,onPointerUp:X,onPointerCancel:X,onKeyDown:n=>Z(n,e,t),onBlur:()=>Q(e)})}},[E,O,A,N,J,Y,X,Z,Q]);return(0,d.jsxs)(m.Provider,{value:ae,children:[(0,d.jsx)(l.default,{ref:R,...S,variant:_,userSelect:U?`none`:void 0,props:{...x,onMouseDownCapture:re,onClickCapture:ie},children:h}),(0,d.jsx)(s.default,{props:{role:`status`},children:ne}),(0,d.jsx)(s.default,{id:N,children:`Press Enter or Space to pick the item up, the arrow keys to move it, Enter to drop it and Escape to put it back.`})]})}function S(e,t){let{value:n,label:r,disabled:i=!1,variant:a,props:o,...s}=e,c=(0,u.useContext)(m),f=c?.heldOf(n),p=c?.translateOf(n),g=(0,u.useMemo)(()=>({value:n,name:r??n,disabled:i}),[n,r,i]);return(0,d.jsx)(h.Provider,{value:g,children:(0,d.jsx)(l.default.Item,{ref:t,...s,variant:[a,{lifted:f===`pointer`,grabbed:f===`keyboard`,settling:c?.settling??!1}],style:p?{translate:p}:void 0,props:{...o,"data-sortable-value":n}})})}function C(){return(0,d.jsx)(o.Svg,{viewBox:`0 0 16 16`,width:`1rem`,fill:`currentColor`,children:[5,11].flatMap(e=>[3,8,13].map(t=>(0,d.jsx)(o.Circle,{cx:e,cy:t,r:1.4},`${e}-${t}`)))})}function w(e,t){let{children:n,variant:i,props:a,...o}=e,s=(0,u.useContext)(m),c=(0,u.useContext)(h),l=c&&s?s.handleProps(c.value,c.name):{};return r.useBoxElement({tag:`button`,component:`sortableList.handle`,display:`flex`,ai:`center`,jc:`center`,flexShrink:0,width:10,height:10,position:`relative`,zIndex:1,touchAction:`none`,...o,variant:[i,{grabbed:c?s?.heldOf(c.value)!==void 0:!1}],props:{...l,...c?.disabled?{disabled:!0}:{},...a},children:n??(0,d.jsx)(C,{})},t)}var T=e.f(x,`SortableList`);T.Item=e.f(S,`SortableList.Item`),T.Handle=e.f(w,`SortableList.Handle`),exports.SortableUtils=p,exports.default=T;

package/components/sortableList.mjs

@@ -376,7 +376,7 @@ function M(e, t) {
 		height: 10,
 		position: "relative",
 		zIndex: 1,
-		css: { touchAction: "none" },
+		touchAction: "none",
 		...o,
 		variant: [i, { grabbed: c ? s?.heldOf(c.value) !== void 0 : !1 }],
 		props: {

package/components/svg.d.ts

@@ -35,8 +35,8 @@ export declare const Svg: (<TKey extends keyof ComponentsAndVariants = never>(pr
 export type SvgProps = Props & RefAttributes<SVGSVGElement>;
 /**
  * The rest of the elements, each with the attributes it owns — everything CSS styles on it stays a Box
- * prop. `transform` is an attribute everywhere, because SVG's version carries its own centre of rotation
- * (`rotate(-90 48 48)`) and the CSS `rotate` prop cannot say that without a `transformOrigin` we lack.
+ * prop. A rotation about the shape's own centre is `rotate={45} transformBox="fill-box" transformOrigin="center"`;
+ * `transform` stays an attribute for a matrix, or an angle that is data rather than a class.
  */
 export declare const G: SvgElementType<"g", "transform">;
 export declare const Defs: SvgElementType<"defs", keyof import('react').SVGProps<SVGDefsElement>>;

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

package/components/swipeItem.mjs

@@ -250,7 +250,7 @@ function re({ size: e, wrap: t, dragging: n, translate: r, handlers: i, children
 		...h[e],
 		...t ? { flexWrap: "wrap" } : {},
 		position: "relative",
-		css: { touchAction: "pan-y" },
+		touchAction: "pan-y",
 		variant: { dragging: n },
 		style: r ? { translate: r } : void 0,
 		props: i,

package/dataGridList.cjs

@@ -1 +1 @@
-const e=require("./box.cjs"),t=require("./reporting.cjs"),n=require("./components/svg.cjs"),r=require("./components/button.cjs"),i=require("./components/visuallyHidden.cjs"),a=require("./components/flex.cjs"),o=require("./components/checkbox.cjs"),s=require("./components/textbox.cjs"),c=require("./components/semantics.cjs"),l=require("./components/dataGrid.cjs"),u=require("./components/dialog.cjs"),d=require("./components/list.cjs"),f=require("./components/radioButton.cjs"),p=require("./components/skeleton.cjs"),m=require("./dataGridListLayout.cjs");let h=require("react"),g=require("react/jsx-runtime");function _(e){let{cell:t}=e,{AggregateCell:n}=t.column;return n?(0,g.jsx)(n,{cell:t}):(0,g.jsx)(g.Fragment,{children:t.value??`—`})}_.displayName=`DataGridListAggregate`;function v(t){let{grid:n,shown:i}=t,{list:o,pagination:s,aggregation:c}=n,u=n.componentName,d=n.localeText,f=s.state,p=c.hasFooter?c.footerCells.value.filter(e=>e.column.aggregate):[];return(0,g.jsxs)(g.Fragment,{children:[p.length>0&&(0,g.jsxs)(e.default,{bgColor:`currentColor/3`,px:4,py:3,children:[(0,g.jsx)(e.default,{fontWeight:600,fontSize:14,mb:1,children:c.footerLabel}),(0,g.jsx)(e.default,{tag:`dl`,display:`grid`,gridTemplateColumns:2,columnGap:4,rowGap:2,m:0,children:p.map(t=>(0,g.jsxs)(e.default,{minWidth:0,children:[(0,g.jsx)(e.default,{tag:`dt`,component:`list.muted`,fontSize:12,lineHeight:16,children:t.column.header??String(t.column.key)}),(0,g.jsx)(e.default,{tag:`dd`,m:0,fontSize:14,lineHeight:20,fontWeight:600,children:(0,g.jsx)(_,{cell:t})})]},t.column.key))})]}),f?(0,g.jsx)(a.default,{component:`list.muted`,d:`column`,gap:2,ai:`center`,px:4,py:4,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:(0,g.jsxs)(a.default,{ai:`center`,jc:`space-between`,gap:3,width:`fit`,children:[(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.button`,...m.t.ICON_BUTTON,borderRadius:3,disabled:!s.canGoPrev,onClick:s.prevPage,props:{"aria-label":d.previousPage},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:90,rtl:{rotate:-90}})}),(0,g.jsx)(e.default,{textAlign:`center`,children:d.pageRowRange(s.startItem,s.endItem,s.totalItems)}),(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.button`,...m.t.ICON_BUTTON,borderRadius:3,disabled:!s.canGoNext,onClick:s.nextPage,props:{"aria-label":d.nextPage},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:-90,rtl:{rotate:90}})})]})}):(o.hasMore||i!==void 0)&&(0,g.jsxs)(a.default,{component:`list.muted`,d:`column`,gap:2,ai:`center`,px:4,py:4,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:[o.hasMore&&(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.button`,width:`fit`,height:11,borderRadius:3,fontSize:15,fontWeight:500,color:`accent-600`,cursor:`pointer`,theme:{dark:{color:`accent-300`}},onClick:o.showMore,children:d.showMore(o.nextBatch)}),i!==void 0&&(0,g.jsx)(e.default,{children:d.shownCount(i,n.source.enabled?n.totalRowCount:n.filterStats.filtered)})]})]})}v.displayName=`DataGridListFooter`;function y(e){let{row:t}=e,{grid:n}=t,r=t.cells.flatMap(e=>e.aggregate?[e.aggregate]:[]),i=t.placeholder?``:String(t.groupValue);return(0,g.jsxs)(d.default.Item,{size:`sm`,bgColor:`currentColor/3`,ps:4+Math.min(t.depth,3)*4,props:{"aria-busy":t.placeholder||void 0},children:[n.list.selecting&&t.selectable&&(0,g.jsx)(d.default.Actions,{children:(0,g.jsx)(o.default,{variant:`datagrid`,checked:t.selected,indeterminate:t.indeterminate,onChange:t.toggleSelectAll,props:{"aria-label":n.localeText.selectGroupRows(i)}})}),(0,g.jsx)(l.f,{width:`16px`,height:`16px`,flexShrink:0,rotate:t.expanded?0:-90,rtl:{rotate:t.expanded?0:90}}),(0,g.jsxs)(d.default.Content,{children:[(0,g.jsx)(d.default.Title,{lines:1,fontSize:14,fontWeight:600,children:(0,g.jsx)(d.default.Action,{onClick:()=>t.toggleRow(),props:{"aria-expanded":t.expanded},children:i})}),r.length>0&&(0,g.jsx)(d.default.Row,{secondary:!0,wrap:!0,columnGap:4,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:r.map(e=>(0,g.jsxs)(c.Span,{display:`inline-flex`,gap:1,children:[(0,g.jsx)(c.Span,{children:e.column.header??String(e.column.key)}),(0,g.jsx)(c.Span,{fontWeight:600,children:(0,g.jsx)(_,{cell:e})})]},e.column.key))})]}),(0,g.jsx)(d.default.Meta,{px:2,borderRadius:999,fontSize:12,fontWeight:600,lineHeight:20,bgColor:`currentColor/10`,alignSelf:`center`,children:t.count})]})}y.displayName=`DataGridListGroup`;var b=(0,h.memo)(y);function x(e){let{row:n,column:r}=e,i=n.cells.find(e=>e.column===r);if(!i)return null;if(r.Cell)return(0,g.jsx)(t.n,{children:(0,g.jsx)(r.Cell,{cell:i})});let{value:a}=i;if(typeof a==`boolean`)return(0,g.jsx)(g.Fragment,{children:a?i.grid.localeText.booleanTrue:i.grid.localeText.booleanFalse});let o=l.u(r,a);return o&&a!=null&&a!==``?(0,g.jsx)(l.l,{value:a,format:o}):(0,g.jsx)(g.Fragment,{children:a==null||a===``?`—`:String(a)})}x.displayName=`DataGridListValue`;function S(t){let{row:n,index:i,position:a,setSize:s}=t,{grid:u}=n,{list:f}=u,{title:h,kicker:_,subtitle:v,end:y,fields:b}=f.layout.value,{selecting:S}=f,C=f.recordViewEnabled&&!n.placeholder,w=l.p(n)?n:void 0,T=u.props.def.rowDetail,E=u.localeText,D={"aria-posinset":a,"aria-setsize":s};if(n.placeholder)return(0,g.jsx)(d.default.Item,{props:{...D,"aria-busy":!0},children:(0,g.jsx)(p.default,{lines:2,flex1:!0})});let O=h?(0,g.jsx)(x,{row:n,column:h}):E.unnamedRow(n.rowIndex+1),k=h?String(n.cells.find(e=>e.column===h)?.value??``):``,A=f.checkboxId(n.key);return(0,g.jsxs)(d.default.Item,{ai:`start`,selected:!!u.props.def.rowSelection&&n.selected,chevron:C&&!S,ps:w?4+Math.min(w.level,3)*4:void 0,props:{...D,"data-list-key":String(n.key)},children:[S&&(0,g.jsx)(d.default.Actions,{width:6,jc:`center`,alignSelf:`center`,children:(0,g.jsx)(o.default,{id:A,variant:`datagrid`,checked:n.selected,indeterminate:n.indeterminate,onChange:n.toggleSelection})}),(0,g.jsxs)(d.default.Content,{children:[_&&(0,g.jsx)(d.default.Overline,{lines:1,children:(0,g.jsx)(x,{row:n,column:_})}),(0,g.jsxs)(d.default.Row,{ai:`start`,gap:3,children:[(0,g.jsxs)(d.default.Row,{jc:`start`,ai:`center`,gap:1,flex1:!0,children:[w?.hasChildren&&(0,g.jsx)(d.default.Actions,{ms:-2,children:(0,g.jsx)(r.default,{type:`button`,component:`${u.componentName}.list.toggle`,...m.t.ICON_BUTTON,width:8,height:8,onClick:w.toggleTree,props:{"aria-expanded":w.treeExpanded,"aria-label":(w.treeExpanded?E.collapseTreeRow:E.expandTreeRow)(k||E.unnamedRow(n.rowIndex+1))},children:(0,g.jsx)(l.f,{width:`16px`,height:`16px`,rotate:w.treeExpanded?0:-90,rtl:{rotate:w.treeExpanded?0:90}})})}),(0,g.jsx)(d.default.Title,{lines:1,flex1:!0,fontWeight:600,children:S?(0,g.jsx)(d.default.Action,{props:{htmlFor:A},children:O}):C?(0,g.jsx)(d.default.Action,{props:{"aria-haspopup":`dialog`},onClick:()=>f.openRecord(n,i),children:O}):O})]}),y&&(0,g.jsxs)(d.default.End,{fontSize:16,fontWeight:600,lineHeight:22,...m.t.TRUNCATE,children:[(0,g.jsx)(x,{row:n,column:y}),(0,g.jsx)(d.default.Meta,{fontWeight:400,...m.t.LABEL,children:y.header??String(y.key)})]})]}),v.length>0&&(0,g.jsx)(d.default.Description,{lines:1,children:v.map((e,t)=>(0,g.jsxs)(c.Span,{children:[t>0&&` · `,(0,g.jsx)(x,{row:n,column:e})]},e.key))}),b.length>0&&(0,g.jsx)(d.default.Fields,{mt:2,css:{gridTemplateColumns:`repeat(2, minmax(0, 1fr))`},children:b.map(t=>(0,g.jsx)(d.default.Field,{label:t.header??String(t.key),children:(0,g.jsx)(e.default,{...m.t.TRUNCATE,children:(0,g.jsx)(x,{row:n,column:t})})},t.key))}),T&&(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(d.default.Actions,{alignSelf:`start`,mt:1,ms:-2,children:(0,g.jsxs)(r.default,{type:`button`,component:`${u.componentName}.list.toggle`,display:`inline-flex`,ai:`center`,gap:1,minHeight:8,px:2,borderRadius:2,fontSize:13,fontWeight:500,cursor:`pointer`,onClick:n.toggleDetail,props:{"aria-expanded":n.expanded},children:[(0,g.jsx)(l.f,{width:`14px`,height:`14px`,rotate:n.expanded?0:-90,rtl:{rotate:n.expanded?0:90}}),E.details]})}),n.expanded&&(0,g.jsx)(d.default.Actions,{display:`block`,mt:2,children:(0,g.jsx)(e.default,{component:`${u.componentName}.list.detail`,p:3,borderRadius:2,fontSize:14,children:T.content(n.data)})})]})]})]})}S.displayName=`DataGridListItem`;var C=(0,h.memo)(S);function w(e){return(0,g.jsx)(n.Svg,{viewBox:`0 0 24 24`,width:`1.25rem`,fill:`none`,stroke:`currentColor`,strokeWidth:2,...e,children:(0,g.jsx)(n.Path,{d:`M6 6l12 12M18 6L6 18`,strokeLinecap:`round`})})}var T=80;function E(n){let{grid:i,open:o,onOpen:s,onClose:c,title:l,trigger:d,actions:f,footer:p,tall:_,bodyProps:v,bodyRef:y,onKeyDown:b,children:x}=n,S=i.componentName,C=`${S}.list.sheet.line`,E=(0,h.useRef)(null),D=(0,h.useCallback)(e=>{let t=e.currentTarget.closest(`dialog`);e.button!==0||!t||e.target.closest(`button`)||(E.current={id:e.pointerId,y:e.clientY,dy:0,dialog:t},e.currentTarget.setPointerCapture(e.pointerId))},[]),O=(0,h.useCallback)(e=>{let t=E.current;if(!t||t.id!==e.pointerId)return;let{dialog:n}=t;t.dy=Math.max(0,e.clientY-t.y),n.style.transition=`none`,n.style.translate=`0 ${t.dy}px`},[]),k=(0,h.useCallback)(()=>{let e=E.current;if(E.current=null,!e)return;let{dialog:t}=e;t.style.transition=``,t.style.translate=``,e.dy>T&&c()},[c]);return(0,g.jsx)(t.t,{children:(0,g.jsxs)(u.default,{component:`${S}.list.sheet`,display:`flex`,d:`column`,css:_?{minHeight:`min(32rem, calc(100dvh - 2rem))`}:void 0,open:o,onOpenChange:e=>e?s?.():c(),trigger:d,props:{onKeyDown:b},children:[(0,g.jsxs)(a.default,{d:`column`,flexShrink:0,css:{touchAction:`none`},props:{onPointerDown:D,onPointerMove:O,onPointerUp:k,onPointerCancel:k},children:[(0,g.jsx)(e.default,{width:9,height:1.25,mt:2,mx:`auto`,borderRadius:999,bgColor:`base-300`,theme:{dark:{bgColor:`base-600`}},props:{"aria-hidden":!0}}),(0,g.jsxs)(a.default,{component:`${C}`,ai:`center`,gap:2,ps:4,pe:2,py:2,bb:1,children:[(0,g.jsx)(u.default.Title,{flex1:!0,minWidth:0,m:0,fontSize:17,fontWeight:600,lineHeight:24,...m.t.TRUNCATE,children:l}),f,(0,g.jsx)(r.default,{type:`button`,component:`${S}.list.sheet.button`,...m.t.ICON_BUTTON,onClick:c,props:{"aria-label":i.localeText.close},children:(0,g.jsx)(w,{})})]})]}),(0,g.jsx)(e.default,{ref:y,flex1:!0,overflowY:`auto`,px:4,py:2,css:{overscrollBehavior:`contain`,touchAction:`pan-y`},props:v,children:x}),p&&(0,g.jsx)(a.default,{component:C,gap:3,flexShrink:0,px:4,pt:3,pb:4,bt:1,children:p})]})})}E.displayName=`DataGridListSheet`;var D=60;function O({cell:t,index:n}){let{grid:i,column:o}=t,s=i.componentName,c=String(o.header??o.key),{editing:u}=t,d=(0,h.useRef)(null),f=(0,h.useRef)(!1);return(0,h.useEffect)(()=>{f.current&&!u&&d.current?.focus(),f.current=u},[u]),(0,g.jsxs)(e.default,{component:`${s}.list.sheet.line`,py:3,bb:1,children:[(0,g.jsx)(e.default,{tag:`dt`,component:`list.muted`,fontSize:13,lineHeight:18,children:c}),(0,g.jsxs)(e.default,{tag:`dd`,display:`flex`,ai:`center`,gap:2,m:0,fontSize:16,lineHeight:24,css:{fontVariantNumeric:`tabular-nums`,overflowWrap:`anywhere`},children:[u?(0,g.jsx)(a.default,{component:`${s}.list.sheet.input`,...m.t.INPUT,flex1:!0,ai:`center`,px:1,children:(0,g.jsx)(l.d,{cell:t,row:-1,columnIndex:n})}):(0,g.jsx)(e.default,{flex1:!0,minWidth:0,children:(0,g.jsx)(x,{row:t.row,column:o})}),t.editable&&!u&&(0,g.jsx)(r.default,{ref:d,type:`button`,component:`${s}.list.sheet.button`,...m.t.SHEET_BUTTON,height:10,onClick:()=>t.beginEdit(),props:{"aria-label":i.localeText.editCell(c)},children:i.localeText.edit})]})]})}function k(n){let{grid:i}=n,{list:s}=i,u=i.componentName,d=i.localeText,f=s.record,p=s.recordPosition,{title:_}=s.layout.value,v=(0,h.useRef)(null),y=(0,h.useRef)(null),b=f?.key;(0,h.useEffect)(()=>{y.current?.scrollTo?.({top:0})},[b]);let S=(0,h.useCallback)(()=>{let e=s.record?.key;i.edits.cancel(),s.closeRecord(),requestAnimationFrame(()=>{let t=i.sizingElement?.querySelectorAll(`[data-list-key]`)??[];Array.from(t).find(t=>t.dataset.listKey===String(e))?.querySelector(`[data-list-action]`)?.focus()})},[i,s]),C=(0,h.useCallback)(e=>{i.edits.isOpen&&i.edits.commit(),i.edits.isOpen||s.stepRecord(e)},[i,s]),w=e=>{v.current=e.pointerType===`touch`?{x:e.clientX,y:e.clientY}:null},T=e=>{let t=v.current;if(v.current=null,!t)return;let n=e.clientX-t.x,r=e.clientY-t.y;Math.abs(n)<D||Math.abs(n)<Math.abs(r)*1.5||C(n<0===i.isRtl?-1:1)},k=e=>{if(e.target.closest(`input,select,textarea,[role="combobox"]`))return;let t=i.isRtl?`ArrowLeft`:`ArrowRight`,n=i.isRtl?`ArrowRight`:`ArrowLeft`;(e.key===t||e.key===n)&&(e.preventDefault(),C(e.key===t?1:-1))},A=f&&p&&(0,g.jsxs)(a.default,{ai:`center`,gap:.5,flexShrink:0,children:[(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.sheet.button`,...m.t.ICON_BUTTON,disabled:!s.hasPreviousRecord,onClick:()=>C(-1),props:{"aria-label":d.previousRow},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:90,rtl:{rotate:-90}})}),(0,g.jsx)(e.default,{fontSize:13,color:`base-500`,textWrap:`nowrap`,css:{fontVariantNumeric:`tabular-nums`},props:{"aria-live":`polite`},children:d.recordPosition(p.position,p.total)}),(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.sheet.button`,...m.t.ICON_BUTTON,disabled:!s.hasNextRecord,onClick:()=>C(1),props:{"aria-label":d.nextRow},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:-90,rtl:{rotate:90}})})]}),j=i.props.def.rowDetail;return(0,g.jsx)(E,{grid:i,open:!!f,onClose:S,tall:!0,title:f&&_?(0,g.jsx)(x,{row:f,column:_}):``,actions:A,onKeyDown:k,bodyRef:y,bodyProps:{onPointerDown:w,onPointerUp:T},children:f&&(0,g.jsxs)(g.Fragment,{children:[i.props.def.rowSelection&&(0,g.jsx)(e.default,{py:3,children:(0,g.jsx)(o.default,{variant:`datagrid`,checked:f.selected,onChange:f.toggleSelection,label:d.selectRow(f.rowIndex+1),labelProps:{display:`flex`,ai:`center`,gap:3,fontSize:15}})}),(0,g.jsx)(e.default,{tag:`dl`,m:0,children:s.recordColumns.map(e=>{let t=f.cells.findIndex(t=>t.column===e);return t===-1?null:(0,g.jsx)(O,{cell:f.cells[t],index:t},e.key)})}),j&&(0,g.jsxs)(a.default,{d:`column`,gap:2,py:3,children:[(0,g.jsx)(c.H3,{m:0,fontSize:14,fontWeight:600,children:d.details}),(0,g.jsx)(t.n,{children:j.content(f.data)})]})]})})}k.displayName=`DataGridListRecord`;function A(t){let{grid:n}=t,i=n.componentName,o=n.localeText,s=n.selectedRows.size;return!n.props.def.rowSelection||s===0?null:(0,g.jsxs)(a.default,{component:`${i}.list.selectionBar`,position:`sticky`,bottom:0,zIndex:2,ai:`center`,gap:2,px:4,py:2,fontSize:14,fontWeight:500,children:[(0,g.jsx)(e.default,{flex1:!0,minWidth:0,textWrap:`nowrap`,css:{fontVariantNumeric:`tabular-nums`},children:o.selectedRows(s)}),!n.allRowsSelected&&(0,g.jsx)(r.default,{type:`button`,minHeight:10,px:3,borderRadius:2,fontSize:14,fontWeight:500,cursor:`pointer`,active:{bgColor:`white/15`},theme:{dark:{active:{bgColor:`black/10`}}},onClick:n.toggleSelectAllRows,children:o.selectAll}),(0,g.jsx)(r.default,{type:`button`,minHeight:10,px:3,borderRadius:2,fontSize:14,fontWeight:500,cursor:`pointer`,active:{bgColor:`white/15`},theme:{dark:{active:{bgColor:`black/10`}}},onClick:n.clearSelection,children:o.clearSelection})]})}A.displayName=`DataGridListSelectionBar`;function j(e){return(0,g.jsx)(n.Svg,{viewBox:`0 0 24 24`,width:`1rem`,fill:`none`,stroke:`currentColor`,strokeWidth:2,...e,children:(0,g.jsx)(n.Path,{d:`M4 6h16M7 12h10M10 18h4`,strokeLinecap:`round`})})}var M=8,N=[{value:`eq`,label:`=`},{value:`ne`,label:`≠`},{value:`gt`,label:`>`},{value:`gte`,label:`≥`},{value:`lt`,label:`<`},{value:`lte`,label:`≤`},{value:`between`,label:`↔`}];function P({column:e}){let{currentFilter:t}=e,n=e.grid.componentName,r=e.grid.localeText,[i,a]=(0,h.useState)(t?.type===`text`?t.value:``),{debounce:o}=l.s(t,e=>l.c.textMatches(i,e),e=>a(e?.type===`text`?e.value:``));return(0,g.jsx)(s.default,{component:`${n}.list.sheet.input`,...m.t.INPUT,type:`search`,value:i,placeholder:e.filterConfig?.placeholder??r.filterPlaceholder,onChange:t=>{let n=t.target.value;a(n),o(`value`,()=>e.setTextFilter(n))},props:{"aria-label":r.filterColumn(String(e.header??e.key))}})}function F({column:t}){let{currentFilter:n}=t,r=t.grid.componentName,i=t.grid.localeText,o=String(t.header??t.key),c=t.filterConfig,[u,d]=(0,h.useState)(()=>l.c.numberDraft(n)),f=(0,h.useRef)(u),p=(0,h.useCallback)(e=>{f.current=e,d(e)},[]),{debounce:_,cancel:v}=l.s(n,e=>l.c.numberMatches(u,e),e=>p(l.c.numberDraft(e))),y=(e,n)=>{p({...f.current,...e});let r=()=>t.setNumberFilter(f.current.operator,f.current.value,f.current.valueTo);n?_(`value`,r):(v(),r())},b=(e,t,n,i)=>(0,g.jsx)(s.default,{component:`${r}.list.sheet.input`,...m.t.INPUT,type:`number`,value:e,step:c?.step,placeholder:n,onChange:e=>y({[i]:e.target.value},!0),props:{"aria-label":t,inputMode:`decimal`,min:c?.min,max:c?.max}});return(0,g.jsxs)(a.default,{gap:2,ai:`center`,children:[(0,g.jsx)(e.default,{tag:`select`,component:`${r}.list.sheet.input`,...m.t.INPUT,width:18,flexShrink:0,props:{value:u.operator,"aria-label":i.filterComparison(o),onChange:e=>y({operator:e.target.value},!1)},children:N.map(e=>(0,g.jsx)(`option`,{value:e.value,children:e.label},e.value))}),b(u.value,u.operator===`between`?i.filterFrom(o):i.filterColumn(o),u.operator===`between`?i.filterFromPlaceholder:c?.placeholder??i.filterValuePlaceholder,`value`),u.operator===`between`&&b(u.valueTo,i.filterTo(o),i.filterToPlaceholder,`valueTo`)]})}function I({column:e}){let t=l.m(!0);return t?(0,g.jsx)(t.ListDateFilter,{column:e}):null}function L({column:e}){let{currentFilter:t}=e,n=e.grid.componentName,i=e.grid.localeText,c=t?.type===`multiselect`?t.values:[],l=e.filterOptions,[u,d]=(0,h.useState)(``),f=t=>{e.setMultiselectFilter(c.includes(t)?c.filter(e=>e!==t):[...c,t])};if(l.length<=M)return(0,g.jsx)(a.default,{flexWrap:`wrap`,gap:2,children:l.map(e=>(0,g.jsx)(r.default,{type:`button`,component:`${n}.list.sheet.chip`,display:`inline-flex`,ai:`center`,minHeight:10,px:3.5,borderRadius:999,fontSize:14,cursor:`pointer`,onClick:()=>f(e.value),props:{"aria-pressed":c.includes(e.value)},children:e.label},String(e.value)))});let p=u.trim().toLocaleLowerCase(),_=p?l.filter(e=>e.label.toLocaleLowerCase().includes(p)):l;return(0,g.jsxs)(a.default,{d:`column`,gap:2,children:[(0,g.jsx)(s.default,{component:`${n}.list.sheet.input`,...m.t.INPUT,type:`search`,value:u,placeholder:i.filterSelectSearchPlaceholder,onChange:e=>d(e.target.value),props:{"aria-label":i.filterColumn(String(e.header??e.key))}}),(0,g.jsx)(a.default,{d:`column`,maxHeight:64,overflowY:`auto`,children:_.map(e=>(0,g.jsx)(o.default,{checked:c.includes(e.value),onChange:()=>f(e.value),label:e.label,labelProps:{component:`${n}.list.sheet.line`,display:`flex`,ai:`center`,gap:3,minHeight:12,fontSize:16,bb:1}},String(e.value)))})]})}function R(e){let{column:t}=e;switch(t.filterConfig?.type){case void 0:return null;case`number`:return(0,g.jsx)(F,{column:t});case`multiselect`:return(0,g.jsx)(L,{column:t});case`date`:return(0,g.jsx)(I,{column:t});default:return(0,g.jsx)(P,{column:t})}}R.displayName=`DataGridListFilter`;function z(t){let{grid:n}=t,{list:i}=n,o=n.componentName,s=n.localeText,l=i.activeFilters.length,u=i.filterableColumns;return u.length===0?null:(0,g.jsx)(E,{grid:n,open:i.sheet===`filter`,onOpen:()=>i.openSheet(`filter`),onClose:()=>i.openSheet(null),title:s.filters,trigger:({ref:t,props:{onClick:n,...i}})=>(0,g.jsxs)(r.default,{type:`button`,component:`${o}.list.toolbar.button`,variant:{active:l>0},...m.t.PILL,ref:t,onClick:n,props:{...i,"aria-label":s.filtersLabel(l)},children:[(0,g.jsx)(j,{}),s.filters,l>0&&(0,g.jsx)(e.default,{tag:`span`,minWidth:5,height:5,px:1.5,borderRadius:999,bgColor:`accent-600`,color:`white`,fontSize:12,fontWeight:600,lineHeight:20,textAlign:`center`,props:{"aria-hidden":!0},children:l})]}),footer:(0,g.jsxs)(g.Fragment,{children:[l>0&&(0,g.jsx)(r.default,{type:`button`,component:`${o}.list.sheet.button`,...m.t.SHEET_BUTTON,onClick:n.clearColumnFilters,children:s.clearFilters}),(0,g.jsx)(r.default,{type:`button`,component:`${o}.list.sheet.primary`,...m.t.SHEET_BUTTON,flex1:!0,fontWeight:600,onClick:()=>i.openSheet(null),children:s.showRows(n.filterStats.filtered)})]}),children:u.map(e=>(0,g.jsxs)(a.default,{component:`${o}.list.sheet.line`,d:`column`,gap:2,py:3,bb:1,children:[(0,g.jsx)(c.H3,{m:0,fontSize:14,fontWeight:600,children:e.header??String(e.key)}),(0,g.jsx)(R,{column:e})]},e.key))})}z.displayName=`DataGridListFilterSheet`;function B(e){let{grid:t}=e,{list:n}=t,i=t.componentName,o=t.localeText,s=n.sortedColumn,c=t.sortDirection===`DESC`,u=`${t.identifier}-sort`,d={component:`${i}.list.sheet.line`,display:`flex`,ai:`center`,gap:3,minHeight:12,fontSize:16,cursor:`pointer`,bb:1};return(0,g.jsxs)(E,{grid:t,open:n.sheet===`sort`,onClose:()=>n.openSheet(null),title:o.sortBy,onOpen:()=>n.openSheet(`sort`),trigger:({ref:e,props:{onClick:t,...n}})=>(0,g.jsxs)(r.default,{type:`button`,component:`${i}.list.toolbar.button`,variant:{active:!!s},...m.t.PILL,ref:e,onClick:t,props:n,children:[(0,g.jsx)(l.o,{width:`16px`,height:`16px`,fill:`currentColor`,rotate:c?180:0}),s?o.sortedBy(String(s.header??s.key),c):o.sortBy]}),footer:(0,g.jsxs)(g.Fragment,{children:[s&&(0,g.jsx)(r.default,{type:`button`,component:`${i}.list.sheet.button`,...m.t.SHEET_BUTTON,onClick:()=>t.setSortColumn(s.key,void 0),children:o.clearSort}),(0,g.jsx)(r.default,{type:`button`,component:`${i}.list.sheet.primary`,...m.t.SHEET_BUTTON,flex1:!0,fontWeight:600,onClick:()=>n.openSheet(null),children:o.close})]}),children:[(0,g.jsx)(a.default,{tag:`fieldset`,d:`column`,b:0,m:0,p:0,props:{"aria-label":o.sortBy},children:n.sortableColumns.map(e=>(0,g.jsx)(f.default,{name:u,checked:s===e,onChange:()=>t.setSortColumn(e.key,c&&s?`DESC`:`ASC`),label:e.header??String(e.key),labelProps:d},e.key))}),s&&(0,g.jsx)(a.default,{tag:`fieldset`,d:`column`,b:0,m:0,p:0,pt:4,props:{"aria-label":`${o.sortBy}: ${s.header??s.key}`},children:[`ASC`,`DESC`].map(e=>(0,g.jsx)(f.default,{name:`${u}-direction`,checked:t.sortDirection===e,onChange:()=>t.setSortColumn(s.key,e),label:e===`ASC`?o.ascending:o.descending,labelProps:d},e))})]})}B.displayName=`DataGridListSortSheet`;function V({grid:e}){let t=e.componentName,[n,i]=(0,h.useState)(e.globalFilterValue),{debounce:o,cancel:c}=l.s(e.globalFilterValue,e=>e===n,i);return(0,g.jsxs)(a.default,{position:`relative`,ai:`center`,children:[(0,g.jsx)(a.default,{position:`absolute`,insetStart:3.5,pointerEvents:`none`,color:`base-500`,props:{"aria-hidden":!0},children:(0,g.jsx)(l.r,{fill:`currentColor`,width:`16px`})}),(0,g.jsx)(s.default,{component:`${t}.list.toolbar.search`,width:`fit`,height:11,ps:10,pe:10,b:0,borderRadius:3,fontSize:16,type:`search`,value:n,placeholder:e.localeText.searchPlaceholder,onChange:t=>{let n=t.target.value;i(n),o(`value`,()=>e.filter.setGlobalFilter(n))},props:{"aria-label":e.localeText.searchPlaceholder,enterKeyHint:`search`}}),n&&(0,g.jsx)(r.default,{type:`button`,component:`${t}.list.sheet.button`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,borderRadius:999,cursor:`pointer`,position:`absolute`,insetEnd:2,onClick:()=>{c(),i(``),e.filter.setGlobalFilter(``)},props:{"aria-label":e.localeText.clearSearch},children:(0,g.jsx)(w,{width:`16px`})})]})}function H(t){let{grid:n}=t,{list:o}=n,{def:s}=n.props,c=n.componentName,u=n.localeText,{filtered:d,total:f}=n.filterStats,p=o.activeFilters,h=o.sortableColumns.length>0;return(0,g.jsxs)(a.default,{component:`${c}.list.toolbar`,d:`column`,gap:3,px:4,pt:4,pb:3,children:[(0,g.jsxs)(a.default,{ai:`center`,gap:3,flexWrap:`wrap`,children:[(0,g.jsxs)(a.default,{d:`column`,flex1:!0,minWidth:0,children:[s.title&&(0,g.jsx)(e.default,{id:n.titleId,fontSize:17,fontWeight:600,lineHeight:24,children:s.title}),(0,g.jsx)(e.default,{component:`${c}.list.toolbar.count`,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:u.rowCount(d,f)})]}),s.topBar&&(0,g.jsxs)(a.default,{ai:`center`,gap:2,flexWrap:`wrap`,children:[(0,g.jsx)(l.n,{grid:n}),(0,g.jsx)(l.t,{grid:n})]})]}),s.globalFilter&&(0,g.jsx)(V,{grid:n}),(0,g.jsxs)(a.default,{gap:2,overflowX:`auto`,scrollbarWidth:`none`,mx:-4,px:4,children:[h&&(0,g.jsx)(B,{grid:n}),(0,g.jsx)(z,{grid:n}),s.rowSelection&&(0,g.jsx)(r.default,{type:`button`,component:`${c}.list.toolbar.button`,...m.t.PILL,variant:{active:o.selecting},onClick:()=>o.setSelecting(!o.selecting),props:{"aria-pressed":o.selecting},children:u.selectRows})]}),p.length>0&&(0,g.jsx)(a.default,{gap:2,overflowX:`auto`,scrollbarWidth:`none`,mx:-4,px:4,children:p.map(t=>(0,g.jsxs)(e.default,{tag:`span`,component:`${c}.list.toolbar.chip`,display:`inline-flex`,ai:`center`,gap:1,flexShrink:0,height:8,ps:3,pe:1,borderRadius:999,fontSize:13,textWrap:`nowrap`,children:[(0,g.jsxs)(e.default,{tag:`span`,fontWeight:500,children:[t.label,`:`]}),(0,g.jsx)(e.default,{tag:`span`,children:t.value}),(0,g.jsx)(r.default,{type:`button`,component:`${c}.list.sheet.button`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,borderRadius:999,cursor:`pointer`,onClick:()=>t.column.clearFilter(),props:{"aria-label":u.clearFilter(t.label)},children:(0,g.jsx)(w,{width:`14px`})})]},t.column.key))}),s.topBarContent&&(0,g.jsx)(e.default,{children:s.topBarContent}),(0,g.jsx)(i.default,{props:{role:`status`},children:n.hasActiveFilters?u.rowCount(d,f):``})]})}H.displayName=`DataGridListToolbar`;function U(t){let{grid:n}=t,{list:r,source:i}=n,o=n.componentName,s=r.visibleItems,c=n.props.loading||i.isLoading,u=n.groupColumns.size===0&&!n.tree.enabled,f=i.enabled?n.totalRowCount:n.filterStats.filtered,{queryVersion:p}=i;return(0,h.useEffect)(()=>{i.enabled&&i.request(0,Math.max(s.length,1))},[i,p,s.length,n.page,n.pageSize,n.expansionVersion]),(0,g.jsxs)(a.default,{component:`${o}.list`,d:`column`,children:[(0,g.jsx)(H,{grid:n}),(0,g.jsx)(l.i,{grid:n}),c&&(0,g.jsx)(l.a,{grid:n}),s.length===0?(0,g.jsx)(e.default,{component:`list.muted`,px:4,py:10,textAlign:`center`,children:n.props.def.noDataComponent??(c?n.localeText.loadingRows:n.localeText.noRows)}):(0,g.jsx)(d.default,{props:{"aria-labelledby":n.props.def.title?n.titleId:void 0,"aria-busy":c||void 0},children:s.map(({row:e,index:t},r)=>e.kind===`group`?(0,g.jsx)(b,{row:e,version:n.rowVersion(e,t)},e.key):(0,g.jsx)(C,{row:e,index:t,position:u?r+1:void 0,setSize:u?f:void 0,version:n.rowVersion(e,t)},e.key))}),(0,g.jsx)(v,{grid:n,shown:u?s.length:void 0}),(0,g.jsx)(A,{grid:n}),(0,g.jsx)(k,{grid:n})]})}U.displayName=`DataGridList`,exports.default=U;
+const e=require("./box.cjs"),t=require("./reporting.cjs"),n=require("./components/svg.cjs"),r=require("./components/button.cjs"),i=require("./components/visuallyHidden.cjs"),a=require("./components/flex.cjs"),o=require("./components/checkbox.cjs"),s=require("./components/textbox.cjs"),c=require("./components/semantics.cjs"),l=require("./components/dataGrid.cjs"),u=require("./components/dialog.cjs"),d=require("./components/list.cjs"),f=require("./components/radioButton.cjs"),p=require("./components/skeleton.cjs"),m=require("./dataGridListLayout.cjs");let h=require("react"),g=require("react/jsx-runtime");function _(e){let{cell:t}=e,{AggregateCell:n}=t.column;return n?(0,g.jsx)(n,{cell:t}):(0,g.jsx)(g.Fragment,{children:t.value??`—`})}_.displayName=`DataGridListAggregate`;function v(t){let{grid:n,shown:i}=t,{list:o,pagination:s,aggregation:c}=n,u=n.componentName,d=n.localeText,f=s.state,p=c.hasFooter?c.footerCells.value.filter(e=>e.column.aggregate):[];return(0,g.jsxs)(g.Fragment,{children:[p.length>0&&(0,g.jsxs)(e.default,{bgColor:`currentColor/3`,px:4,py:3,children:[(0,g.jsx)(e.default,{fontWeight:600,fontSize:14,mb:1,children:c.footerLabel}),(0,g.jsx)(e.default,{tag:`dl`,display:`grid`,gridTemplateColumns:2,columnGap:4,rowGap:2,m:0,children:p.map(t=>(0,g.jsxs)(e.default,{minWidth:0,children:[(0,g.jsx)(e.default,{tag:`dt`,component:`list.muted`,fontSize:12,lineHeight:16,children:t.column.header??String(t.column.key)}),(0,g.jsx)(e.default,{tag:`dd`,m:0,fontSize:14,lineHeight:20,fontWeight:600,children:(0,g.jsx)(_,{cell:t})})]},t.column.key))})]}),f?(0,g.jsx)(a.default,{component:`list.muted`,d:`column`,gap:2,ai:`center`,px:4,py:4,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:(0,g.jsxs)(a.default,{ai:`center`,jc:`space-between`,gap:3,width:`fit`,children:[(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.button`,...m.t.ICON_BUTTON,borderRadius:3,disabled:!s.canGoPrev,onClick:s.prevPage,props:{"aria-label":d.previousPage},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:90,rtl:{rotate:-90}})}),(0,g.jsx)(e.default,{textAlign:`center`,children:d.pageRowRange(s.startItem,s.endItem,s.totalItems)}),(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.button`,...m.t.ICON_BUTTON,borderRadius:3,disabled:!s.canGoNext,onClick:s.nextPage,props:{"aria-label":d.nextPage},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:-90,rtl:{rotate:90}})})]})}):(o.hasMore||i!==void 0)&&(0,g.jsxs)(a.default,{component:`list.muted`,d:`column`,gap:2,ai:`center`,px:4,py:4,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:[o.hasMore&&(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.button`,width:`fit`,height:11,borderRadius:3,fontSize:15,fontWeight:500,color:`accent-600`,cursor:`pointer`,theme:{dark:{color:`accent-300`}},onClick:o.showMore,children:d.showMore(o.nextBatch)}),i!==void 0&&(0,g.jsx)(e.default,{children:d.shownCount(i,n.source.enabled?n.totalRowCount:n.filterStats.filtered)})]})]})}v.displayName=`DataGridListFooter`;function y(e){let{row:t}=e,{grid:n}=t,r=t.cells.flatMap(e=>e.aggregate?[e.aggregate]:[]),i=t.placeholder?``:String(t.groupValue);return(0,g.jsxs)(d.default.Item,{size:`sm`,bgColor:`currentColor/3`,ps:4+Math.min(t.depth,3)*4,props:{"aria-busy":t.placeholder||void 0},children:[n.list.selecting&&t.selectable&&(0,g.jsx)(d.default.Actions,{children:(0,g.jsx)(o.default,{variant:`datagrid`,checked:t.selected,indeterminate:t.indeterminate,onChange:t.toggleSelectAll,props:{"aria-label":n.localeText.selectGroupRows(i)}})}),(0,g.jsx)(l.f,{width:`16px`,height:`16px`,flexShrink:0,rotate:t.expanded?0:-90,rtl:{rotate:t.expanded?0:90}}),(0,g.jsxs)(d.default.Content,{children:[(0,g.jsx)(d.default.Title,{lines:1,fontSize:14,fontWeight:600,children:(0,g.jsx)(d.default.Action,{onClick:()=>t.toggleRow(),props:{"aria-expanded":t.expanded},children:i})}),r.length>0&&(0,g.jsx)(d.default.Row,{secondary:!0,wrap:!0,columnGap:4,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:r.map(e=>(0,g.jsxs)(c.Span,{display:`inline-flex`,gap:1,children:[(0,g.jsx)(c.Span,{children:e.column.header??String(e.column.key)}),(0,g.jsx)(c.Span,{fontWeight:600,children:(0,g.jsx)(_,{cell:e})})]},e.column.key))})]}),(0,g.jsx)(d.default.Meta,{px:2,borderRadius:999,fontSize:12,fontWeight:600,lineHeight:20,bgColor:`currentColor/10`,alignSelf:`center`,children:t.count})]})}y.displayName=`DataGridListGroup`;var b=(0,h.memo)(y);function x(e){let{row:n,column:r}=e,i=n.cells.find(e=>e.column===r);if(!i)return null;if(r.Cell)return(0,g.jsx)(t.n,{children:(0,g.jsx)(r.Cell,{cell:i})});let{value:a}=i;if(typeof a==`boolean`)return(0,g.jsx)(g.Fragment,{children:a?i.grid.localeText.booleanTrue:i.grid.localeText.booleanFalse});let o=l.u(r,a);return o&&a!=null&&a!==``?(0,g.jsx)(l.l,{value:a,format:o}):(0,g.jsx)(g.Fragment,{children:a==null||a===``?`—`:String(a)})}x.displayName=`DataGridListValue`;function S(t){let{row:n,index:i,position:a,setSize:s}=t,{grid:u}=n,{list:f}=u,{title:h,kicker:_,subtitle:v,end:y,fields:b}=f.layout.value,{selecting:S}=f,C=f.recordViewEnabled&&!n.placeholder,w=l.p(n)?n:void 0,T=u.props.def.rowDetail,E=u.localeText,D={"aria-posinset":a,"aria-setsize":s};if(n.placeholder)return(0,g.jsx)(d.default.Item,{props:{...D,"aria-busy":!0},children:(0,g.jsx)(p.default,{lines:2,flex1:!0})});let O=h?(0,g.jsx)(x,{row:n,column:h}):E.unnamedRow(n.rowIndex+1),k=h?String(n.cells.find(e=>e.column===h)?.value??``):``,A=f.checkboxId(n.key);return(0,g.jsxs)(d.default.Item,{ai:`start`,selected:!!u.props.def.rowSelection&&n.selected,chevron:C&&!S,ps:w?4+Math.min(w.level,3)*4:void 0,props:{...D,"data-list-key":String(n.key)},children:[S&&(0,g.jsx)(d.default.Actions,{width:6,jc:`center`,alignSelf:`center`,children:(0,g.jsx)(o.default,{id:A,variant:`datagrid`,checked:n.selected,indeterminate:n.indeterminate,onChange:n.toggleSelection})}),(0,g.jsxs)(d.default.Content,{children:[_&&(0,g.jsx)(d.default.Overline,{lines:1,children:(0,g.jsx)(x,{row:n,column:_})}),(0,g.jsxs)(d.default.Row,{ai:`start`,gap:3,children:[(0,g.jsxs)(d.default.Row,{jc:`start`,ai:`center`,gap:1,flex1:!0,children:[w?.hasChildren&&(0,g.jsx)(d.default.Actions,{ms:-2,children:(0,g.jsx)(r.default,{type:`button`,component:`${u.componentName}.list.toggle`,...m.t.ICON_BUTTON,width:8,height:8,onClick:w.toggleTree,props:{"aria-expanded":w.treeExpanded,"aria-label":(w.treeExpanded?E.collapseTreeRow:E.expandTreeRow)(k||E.unnamedRow(n.rowIndex+1))},children:(0,g.jsx)(l.f,{width:`16px`,height:`16px`,rotate:w.treeExpanded?0:-90,rtl:{rotate:w.treeExpanded?0:90}})})}),(0,g.jsx)(d.default.Title,{lines:1,flex1:!0,fontWeight:600,children:S?(0,g.jsx)(d.default.Action,{props:{htmlFor:A},children:O}):C?(0,g.jsx)(d.default.Action,{props:{"aria-haspopup":`dialog`},onClick:()=>f.openRecord(n,i),children:O}):O})]}),y&&(0,g.jsxs)(d.default.End,{fontSize:16,fontWeight:600,lineHeight:22,...m.t.TRUNCATE,children:[(0,g.jsx)(x,{row:n,column:y}),(0,g.jsx)(d.default.Meta,{fontWeight:400,...m.t.LABEL,children:y.header??String(y.key)})]})]}),v.length>0&&(0,g.jsx)(d.default.Description,{lines:1,children:v.map((e,t)=>(0,g.jsxs)(c.Span,{children:[t>0&&` · `,(0,g.jsx)(x,{row:n,column:e})]},e.key))}),b.length>0&&(0,g.jsx)(d.default.Fields,{mt:2,css:{gridTemplateColumns:`repeat(2, minmax(0, 1fr))`},children:b.map(t=>(0,g.jsx)(d.default.Field,{label:t.header??String(t.key),children:(0,g.jsx)(e.default,{...m.t.TRUNCATE,children:(0,g.jsx)(x,{row:n,column:t})})},t.key))}),T&&(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(d.default.Actions,{alignSelf:`start`,mt:1,ms:-2,children:(0,g.jsxs)(r.default,{type:`button`,component:`${u.componentName}.list.toggle`,display:`inline-flex`,ai:`center`,gap:1,minHeight:8,px:2,borderRadius:2,fontSize:13,fontWeight:500,cursor:`pointer`,onClick:n.toggleDetail,props:{"aria-expanded":n.expanded},children:[(0,g.jsx)(l.f,{width:`14px`,height:`14px`,rotate:n.expanded?0:-90,rtl:{rotate:n.expanded?0:90}}),E.details]})}),n.expanded&&(0,g.jsx)(d.default.Actions,{display:`block`,mt:2,children:(0,g.jsx)(e.default,{component:`${u.componentName}.list.detail`,p:3,borderRadius:2,fontSize:14,children:T.content(n.data)})})]})]})]})}S.displayName=`DataGridListItem`;var C=(0,h.memo)(S);function w(e){return(0,g.jsx)(n.Svg,{viewBox:`0 0 24 24`,width:`1.25rem`,fill:`none`,stroke:`currentColor`,strokeWidth:2,...e,children:(0,g.jsx)(n.Path,{d:`M6 6l12 12M18 6L6 18`,strokeLinecap:`round`})})}var T=80;function E(n){let{grid:i,open:o,onOpen:s,onClose:c,title:l,trigger:d,actions:f,footer:p,tall:_,bodyProps:v,bodyRef:y,onKeyDown:b,children:x}=n,S=i.componentName,C=`${S}.list.sheet.line`,E=(0,h.useRef)(null),D=(0,h.useCallback)(e=>{let t=e.currentTarget.closest(`dialog`);e.button!==0||!t||e.target.closest(`button`)||(E.current={id:e.pointerId,y:e.clientY,dy:0,dialog:t},e.currentTarget.setPointerCapture(e.pointerId))},[]),O=(0,h.useCallback)(e=>{let t=E.current;if(!t||t.id!==e.pointerId)return;let{dialog:n}=t;t.dy=Math.max(0,e.clientY-t.y),n.style.transition=`none`,n.style.translate=`0 ${t.dy}px`},[]),k=(0,h.useCallback)(()=>{let e=E.current;if(E.current=null,!e)return;let{dialog:t}=e;t.style.transition=``,t.style.translate=``,e.dy>T&&c()},[c]);return(0,g.jsx)(t.t,{children:(0,g.jsxs)(u.default,{component:`${S}.list.sheet`,display:`flex`,d:`column`,css:_?{minHeight:`min(32rem, calc(100dvh - 2rem))`}:void 0,open:o,onOpenChange:e=>e?s?.():c(),trigger:d,props:{onKeyDown:b},children:[(0,g.jsxs)(a.default,{d:`column`,flexShrink:0,touchAction:`none`,props:{onPointerDown:D,onPointerMove:O,onPointerUp:k,onPointerCancel:k},children:[(0,g.jsx)(e.default,{width:9,height:1.25,mt:2,mx:`auto`,borderRadius:999,bgColor:`base-300`,theme:{dark:{bgColor:`base-600`}},props:{"aria-hidden":!0}}),(0,g.jsxs)(a.default,{component:`${C}`,ai:`center`,gap:2,ps:4,pe:2,py:2,bb:1,children:[(0,g.jsx)(u.default.Title,{flex1:!0,minWidth:0,m:0,fontSize:17,fontWeight:600,lineHeight:24,...m.t.TRUNCATE,children:l}),f,(0,g.jsx)(r.default,{type:`button`,component:`${S}.list.sheet.button`,...m.t.ICON_BUTTON,onClick:c,props:{"aria-label":i.localeText.close},children:(0,g.jsx)(w,{})})]})]}),(0,g.jsx)(e.default,{ref:y,flex1:!0,overflowY:`auto`,px:4,py:2,touchAction:`pan-y`,css:{overscrollBehavior:`contain`},props:v,children:x}),p&&(0,g.jsx)(a.default,{component:C,gap:3,flexShrink:0,px:4,pt:3,pb:4,bt:1,children:p})]})})}E.displayName=`DataGridListSheet`;var D=60;function O({cell:t,index:n}){let{grid:i,column:o}=t,s=i.componentName,c=String(o.header??o.key),{editing:u}=t,d=(0,h.useRef)(null),f=(0,h.useRef)(!1);return(0,h.useEffect)(()=>{f.current&&!u&&d.current?.focus(),f.current=u},[u]),(0,g.jsxs)(e.default,{component:`${s}.list.sheet.line`,py:3,bb:1,children:[(0,g.jsx)(e.default,{tag:`dt`,component:`list.muted`,fontSize:13,lineHeight:18,children:c}),(0,g.jsxs)(e.default,{tag:`dd`,display:`flex`,ai:`center`,gap:2,m:0,fontSize:16,lineHeight:24,css:{fontVariantNumeric:`tabular-nums`,overflowWrap:`anywhere`},children:[u?(0,g.jsx)(a.default,{component:`${s}.list.sheet.input`,...m.t.INPUT,flex1:!0,ai:`center`,px:1,children:(0,g.jsx)(l.d,{cell:t,row:-1,columnIndex:n})}):(0,g.jsx)(e.default,{flex1:!0,minWidth:0,children:(0,g.jsx)(x,{row:t.row,column:o})}),t.editable&&!u&&(0,g.jsx)(r.default,{ref:d,type:`button`,component:`${s}.list.sheet.button`,...m.t.SHEET_BUTTON,height:10,onClick:()=>t.beginEdit(),props:{"aria-label":i.localeText.editCell(c)},children:i.localeText.edit})]})]})}function k(n){let{grid:i}=n,{list:s}=i,u=i.componentName,d=i.localeText,f=s.record,p=s.recordPosition,{title:_}=s.layout.value,v=(0,h.useRef)(null),y=(0,h.useRef)(null),b=f?.key;(0,h.useEffect)(()=>{y.current?.scrollTo?.({top:0})},[b]);let S=(0,h.useCallback)(()=>{let e=s.record?.key;i.edits.cancel(),s.closeRecord(),requestAnimationFrame(()=>{let t=i.sizingElement?.querySelectorAll(`[data-list-key]`)??[];Array.from(t).find(t=>t.dataset.listKey===String(e))?.querySelector(`[data-list-action]`)?.focus()})},[i,s]),C=(0,h.useCallback)(e=>{i.edits.isOpen&&i.edits.commit(),i.edits.isOpen||s.stepRecord(e)},[i,s]),w=e=>{v.current=e.pointerType===`touch`?{x:e.clientX,y:e.clientY}:null},T=e=>{let t=v.current;if(v.current=null,!t)return;let n=e.clientX-t.x,r=e.clientY-t.y;Math.abs(n)<D||Math.abs(n)<Math.abs(r)*1.5||C(n<0===i.isRtl?-1:1)},k=e=>{if(e.target.closest(`input,select,textarea,[role="combobox"]`))return;let t=i.isRtl?`ArrowLeft`:`ArrowRight`,n=i.isRtl?`ArrowRight`:`ArrowLeft`;(e.key===t||e.key===n)&&(e.preventDefault(),C(e.key===t?1:-1))},A=f&&p&&(0,g.jsxs)(a.default,{ai:`center`,gap:.5,flexShrink:0,children:[(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.sheet.button`,...m.t.ICON_BUTTON,disabled:!s.hasPreviousRecord,onClick:()=>C(-1),props:{"aria-label":d.previousRow},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:90,rtl:{rotate:-90}})}),(0,g.jsx)(e.default,{fontSize:13,color:`base-500`,textWrap:`nowrap`,css:{fontVariantNumeric:`tabular-nums`},props:{"aria-live":`polite`},children:d.recordPosition(p.position,p.total)}),(0,g.jsx)(r.default,{type:`button`,component:`${u}.list.sheet.button`,...m.t.ICON_BUTTON,disabled:!s.hasNextRecord,onClick:()=>C(1),props:{"aria-label":d.nextRow},children:(0,g.jsx)(l.f,{width:`18px`,height:`18px`,rotate:-90,rtl:{rotate:90}})})]}),j=i.props.def.rowDetail;return(0,g.jsx)(E,{grid:i,open:!!f,onClose:S,tall:!0,title:f&&_?(0,g.jsx)(x,{row:f,column:_}):``,actions:A,onKeyDown:k,bodyRef:y,bodyProps:{onPointerDown:w,onPointerUp:T},children:f&&(0,g.jsxs)(g.Fragment,{children:[i.props.def.rowSelection&&(0,g.jsx)(e.default,{py:3,children:(0,g.jsx)(o.default,{variant:`datagrid`,checked:f.selected,onChange:f.toggleSelection,label:d.selectRow(f.rowIndex+1),labelProps:{display:`flex`,ai:`center`,gap:3,fontSize:15}})}),(0,g.jsx)(e.default,{tag:`dl`,m:0,children:s.recordColumns.map(e=>{let t=f.cells.findIndex(t=>t.column===e);return t===-1?null:(0,g.jsx)(O,{cell:f.cells[t],index:t},e.key)})}),j&&(0,g.jsxs)(a.default,{d:`column`,gap:2,py:3,children:[(0,g.jsx)(c.H3,{m:0,fontSize:14,fontWeight:600,children:d.details}),(0,g.jsx)(t.n,{children:j.content(f.data)})]})]})})}k.displayName=`DataGridListRecord`;function A(t){let{grid:n}=t,i=n.componentName,o=n.localeText,s=n.selectedRows.size;return!n.props.def.rowSelection||s===0?null:(0,g.jsxs)(a.default,{component:`${i}.list.selectionBar`,position:`sticky`,bottom:0,zIndex:2,ai:`center`,gap:2,px:4,py:2,fontSize:14,fontWeight:500,children:[(0,g.jsx)(e.default,{flex1:!0,minWidth:0,textWrap:`nowrap`,css:{fontVariantNumeric:`tabular-nums`},children:o.selectedRows(s)}),!n.allRowsSelected&&(0,g.jsx)(r.default,{type:`button`,minHeight:10,px:3,borderRadius:2,fontSize:14,fontWeight:500,cursor:`pointer`,active:{bgColor:`white/15`},theme:{dark:{active:{bgColor:`black/10`}}},onClick:n.toggleSelectAllRows,children:o.selectAll}),(0,g.jsx)(r.default,{type:`button`,minHeight:10,px:3,borderRadius:2,fontSize:14,fontWeight:500,cursor:`pointer`,active:{bgColor:`white/15`},theme:{dark:{active:{bgColor:`black/10`}}},onClick:n.clearSelection,children:o.clearSelection})]})}A.displayName=`DataGridListSelectionBar`;function j(e){return(0,g.jsx)(n.Svg,{viewBox:`0 0 24 24`,width:`1rem`,fill:`none`,stroke:`currentColor`,strokeWidth:2,...e,children:(0,g.jsx)(n.Path,{d:`M4 6h16M7 12h10M10 18h4`,strokeLinecap:`round`})})}var M=8,N=[{value:`eq`,label:`=`},{value:`ne`,label:`≠`},{value:`gt`,label:`>`},{value:`gte`,label:`≥`},{value:`lt`,label:`<`},{value:`lte`,label:`≤`},{value:`between`,label:`↔`}];function P({column:e}){let{currentFilter:t}=e,n=e.grid.componentName,r=e.grid.localeText,[i,a]=(0,h.useState)(t?.type===`text`?t.value:``),{debounce:o}=l.s(t,e=>l.c.textMatches(i,e),e=>a(e?.type===`text`?e.value:``));return(0,g.jsx)(s.default,{component:`${n}.list.sheet.input`,...m.t.INPUT,type:`search`,value:i,placeholder:e.filterConfig?.placeholder??r.filterPlaceholder,onChange:t=>{let n=t.target.value;a(n),o(`value`,()=>e.setTextFilter(n))},props:{"aria-label":r.filterColumn(String(e.header??e.key))}})}function F({column:t}){let{currentFilter:n}=t,r=t.grid.componentName,i=t.grid.localeText,o=String(t.header??t.key),c=t.filterConfig,[u,d]=(0,h.useState)(()=>l.c.numberDraft(n)),f=(0,h.useRef)(u),p=(0,h.useCallback)(e=>{f.current=e,d(e)},[]),{debounce:_,cancel:v}=l.s(n,e=>l.c.numberMatches(u,e),e=>p(l.c.numberDraft(e))),y=(e,n)=>{p({...f.current,...e});let r=()=>t.setNumberFilter(f.current.operator,f.current.value,f.current.valueTo);n?_(`value`,r):(v(),r())},b=(e,t,n,i)=>(0,g.jsx)(s.default,{component:`${r}.list.sheet.input`,...m.t.INPUT,type:`number`,value:e,step:c?.step,placeholder:n,onChange:e=>y({[i]:e.target.value},!0),props:{"aria-label":t,inputMode:`decimal`,min:c?.min,max:c?.max}});return(0,g.jsxs)(a.default,{gap:2,ai:`center`,children:[(0,g.jsx)(e.default,{tag:`select`,component:`${r}.list.sheet.input`,...m.t.INPUT,width:18,flexShrink:0,props:{value:u.operator,"aria-label":i.filterComparison(o),onChange:e=>y({operator:e.target.value},!1)},children:N.map(e=>(0,g.jsx)(`option`,{value:e.value,children:e.label},e.value))}),b(u.value,u.operator===`between`?i.filterFrom(o):i.filterColumn(o),u.operator===`between`?i.filterFromPlaceholder:c?.placeholder??i.filterValuePlaceholder,`value`),u.operator===`between`&&b(u.valueTo,i.filterTo(o),i.filterToPlaceholder,`valueTo`)]})}function I({column:e}){let t=l.m(!0);return t?(0,g.jsx)(t.ListDateFilter,{column:e}):null}function L({column:e}){let{currentFilter:t}=e,n=e.grid.componentName,i=e.grid.localeText,c=t?.type===`multiselect`?t.values:[],l=e.filterOptions,[u,d]=(0,h.useState)(``),f=t=>{e.setMultiselectFilter(c.includes(t)?c.filter(e=>e!==t):[...c,t])};if(l.length<=M)return(0,g.jsx)(a.default,{flexWrap:`wrap`,gap:2,children:l.map(e=>(0,g.jsx)(r.default,{type:`button`,component:`${n}.list.sheet.chip`,display:`inline-flex`,ai:`center`,minHeight:10,px:3.5,borderRadius:999,fontSize:14,cursor:`pointer`,onClick:()=>f(e.value),props:{"aria-pressed":c.includes(e.value)},children:e.label},String(e.value)))});let p=u.trim().toLocaleLowerCase(),_=p?l.filter(e=>e.label.toLocaleLowerCase().includes(p)):l;return(0,g.jsxs)(a.default,{d:`column`,gap:2,children:[(0,g.jsx)(s.default,{component:`${n}.list.sheet.input`,...m.t.INPUT,type:`search`,value:u,placeholder:i.filterSelectSearchPlaceholder,onChange:e=>d(e.target.value),props:{"aria-label":i.filterColumn(String(e.header??e.key))}}),(0,g.jsx)(a.default,{d:`column`,maxHeight:64,overflowY:`auto`,children:_.map(e=>(0,g.jsx)(o.default,{checked:c.includes(e.value),onChange:()=>f(e.value),label:e.label,labelProps:{component:`${n}.list.sheet.line`,display:`flex`,ai:`center`,gap:3,minHeight:12,fontSize:16,bb:1}},String(e.value)))})]})}function R(e){let{column:t}=e;switch(t.filterConfig?.type){case void 0:return null;case`number`:return(0,g.jsx)(F,{column:t});case`multiselect`:return(0,g.jsx)(L,{column:t});case`date`:return(0,g.jsx)(I,{column:t});default:return(0,g.jsx)(P,{column:t})}}R.displayName=`DataGridListFilter`;function z(t){let{grid:n}=t,{list:i}=n,o=n.componentName,s=n.localeText,l=i.activeFilters.length,u=i.filterableColumns;return u.length===0?null:(0,g.jsx)(E,{grid:n,open:i.sheet===`filter`,onOpen:()=>i.openSheet(`filter`),onClose:()=>i.openSheet(null),title:s.filters,trigger:({ref:t,props:{onClick:n,...i}})=>(0,g.jsxs)(r.default,{type:`button`,component:`${o}.list.toolbar.button`,variant:{active:l>0},...m.t.PILL,ref:t,onClick:n,props:{...i,"aria-label":s.filtersLabel(l)},children:[(0,g.jsx)(j,{}),s.filters,l>0&&(0,g.jsx)(e.default,{tag:`span`,minWidth:5,height:5,px:1.5,borderRadius:999,bgColor:`accent-600`,color:`white`,fontSize:12,fontWeight:600,lineHeight:20,textAlign:`center`,props:{"aria-hidden":!0},children:l})]}),footer:(0,g.jsxs)(g.Fragment,{children:[l>0&&(0,g.jsx)(r.default,{type:`button`,component:`${o}.list.sheet.button`,...m.t.SHEET_BUTTON,onClick:n.clearColumnFilters,children:s.clearFilters}),(0,g.jsx)(r.default,{type:`button`,component:`${o}.list.sheet.primary`,...m.t.SHEET_BUTTON,flex1:!0,fontWeight:600,onClick:()=>i.openSheet(null),children:s.showRows(n.filterStats.filtered)})]}),children:u.map(e=>(0,g.jsxs)(a.default,{component:`${o}.list.sheet.line`,d:`column`,gap:2,py:3,bb:1,children:[(0,g.jsx)(c.H3,{m:0,fontSize:14,fontWeight:600,children:e.header??String(e.key)}),(0,g.jsx)(R,{column:e})]},e.key))})}z.displayName=`DataGridListFilterSheet`;function B(e){let{grid:t}=e,{list:n}=t,i=t.componentName,o=t.localeText,s=n.sortedColumn,c=t.sortDirection===`DESC`,u=`${t.identifier}-sort`,d={component:`${i}.list.sheet.line`,display:`flex`,ai:`center`,gap:3,minHeight:12,fontSize:16,cursor:`pointer`,bb:1};return(0,g.jsxs)(E,{grid:t,open:n.sheet===`sort`,onClose:()=>n.openSheet(null),title:o.sortBy,onOpen:()=>n.openSheet(`sort`),trigger:({ref:e,props:{onClick:t,...n}})=>(0,g.jsxs)(r.default,{type:`button`,component:`${i}.list.toolbar.button`,variant:{active:!!s},...m.t.PILL,ref:e,onClick:t,props:n,children:[(0,g.jsx)(l.o,{width:`16px`,height:`16px`,fill:`currentColor`,rotate:c?180:0}),s?o.sortedBy(String(s.header??s.key),c):o.sortBy]}),footer:(0,g.jsxs)(g.Fragment,{children:[s&&(0,g.jsx)(r.default,{type:`button`,component:`${i}.list.sheet.button`,...m.t.SHEET_BUTTON,onClick:()=>t.setSortColumn(s.key,void 0),children:o.clearSort}),(0,g.jsx)(r.default,{type:`button`,component:`${i}.list.sheet.primary`,...m.t.SHEET_BUTTON,flex1:!0,fontWeight:600,onClick:()=>n.openSheet(null),children:o.close})]}),children:[(0,g.jsx)(a.default,{tag:`fieldset`,d:`column`,b:0,m:0,p:0,props:{"aria-label":o.sortBy},children:n.sortableColumns.map(e=>(0,g.jsx)(f.default,{name:u,checked:s===e,onChange:()=>t.setSortColumn(e.key,c&&s?`DESC`:`ASC`),label:e.header??String(e.key),labelProps:d},e.key))}),s&&(0,g.jsx)(a.default,{tag:`fieldset`,d:`column`,b:0,m:0,p:0,pt:4,props:{"aria-label":`${o.sortBy}: ${s.header??s.key}`},children:[`ASC`,`DESC`].map(e=>(0,g.jsx)(f.default,{name:`${u}-direction`,checked:t.sortDirection===e,onChange:()=>t.setSortColumn(s.key,e),label:e===`ASC`?o.ascending:o.descending,labelProps:d},e))})]})}B.displayName=`DataGridListSortSheet`;function V({grid:e}){let t=e.componentName,[n,i]=(0,h.useState)(e.globalFilterValue),{debounce:o,cancel:c}=l.s(e.globalFilterValue,e=>e===n,i);return(0,g.jsxs)(a.default,{position:`relative`,ai:`center`,children:[(0,g.jsx)(a.default,{position:`absolute`,insetStart:3.5,pointerEvents:`none`,color:`base-500`,props:{"aria-hidden":!0},children:(0,g.jsx)(l.r,{fill:`currentColor`,width:`16px`})}),(0,g.jsx)(s.default,{component:`${t}.list.toolbar.search`,width:`fit`,height:11,ps:10,pe:10,b:0,borderRadius:3,fontSize:16,type:`search`,value:n,placeholder:e.localeText.searchPlaceholder,onChange:t=>{let n=t.target.value;i(n),o(`value`,()=>e.filter.setGlobalFilter(n))},props:{"aria-label":e.localeText.searchPlaceholder,enterKeyHint:`search`}}),n&&(0,g.jsx)(r.default,{type:`button`,component:`${t}.list.sheet.button`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,borderRadius:999,cursor:`pointer`,position:`absolute`,insetEnd:2,onClick:()=>{c(),i(``),e.filter.setGlobalFilter(``)},props:{"aria-label":e.localeText.clearSearch},children:(0,g.jsx)(w,{width:`16px`})})]})}function H(t){let{grid:n}=t,{list:o}=n,{def:s}=n.props,c=n.componentName,u=n.localeText,{filtered:d,total:f}=n.filterStats,p=o.activeFilters,h=o.sortableColumns.length>0;return(0,g.jsxs)(a.default,{component:`${c}.list.toolbar`,d:`column`,gap:3,px:4,pt:4,pb:3,children:[(0,g.jsxs)(a.default,{ai:`center`,gap:3,flexWrap:`wrap`,children:[(0,g.jsxs)(a.default,{d:`column`,flex1:!0,minWidth:0,children:[s.title&&(0,g.jsx)(e.default,{id:n.titleId,fontSize:17,fontWeight:600,lineHeight:24,children:s.title}),(0,g.jsx)(e.default,{component:`${c}.list.toolbar.count`,fontSize:13,css:{fontVariantNumeric:`tabular-nums`},children:u.rowCount(d,f)})]}),s.topBar&&(0,g.jsxs)(a.default,{ai:`center`,gap:2,flexWrap:`wrap`,children:[(0,g.jsx)(l.n,{grid:n}),(0,g.jsx)(l.t,{grid:n})]})]}),s.globalFilter&&(0,g.jsx)(V,{grid:n}),(0,g.jsxs)(a.default,{gap:2,overflowX:`auto`,scrollbarWidth:`none`,mx:-4,px:4,children:[h&&(0,g.jsx)(B,{grid:n}),(0,g.jsx)(z,{grid:n}),s.rowSelection&&(0,g.jsx)(r.default,{type:`button`,component:`${c}.list.toolbar.button`,...m.t.PILL,variant:{active:o.selecting},onClick:()=>o.setSelecting(!o.selecting),props:{"aria-pressed":o.selecting},children:u.selectRows})]}),p.length>0&&(0,g.jsx)(a.default,{gap:2,overflowX:`auto`,scrollbarWidth:`none`,mx:-4,px:4,children:p.map(t=>(0,g.jsxs)(e.default,{tag:`span`,component:`${c}.list.toolbar.chip`,display:`inline-flex`,ai:`center`,gap:1,flexShrink:0,height:8,ps:3,pe:1,borderRadius:999,fontSize:13,textWrap:`nowrap`,children:[(0,g.jsxs)(e.default,{tag:`span`,fontWeight:500,children:[t.label,`:`]}),(0,g.jsx)(e.default,{tag:`span`,children:t.value}),(0,g.jsx)(r.default,{type:`button`,component:`${c}.list.sheet.button`,display:`inline-flex`,ai:`center`,jc:`center`,width:7,height:7,borderRadius:999,cursor:`pointer`,onClick:()=>t.column.clearFilter(),props:{"aria-label":u.clearFilter(t.label)},children:(0,g.jsx)(w,{width:`14px`})})]},t.column.key))}),s.topBarContent&&(0,g.jsx)(e.default,{children:s.topBarContent}),(0,g.jsx)(i.default,{props:{role:`status`},children:n.hasActiveFilters?u.rowCount(d,f):``})]})}H.displayName=`DataGridListToolbar`;function U(t){let{grid:n}=t,{list:r,source:i}=n,o=n.componentName,s=r.visibleItems,c=n.props.loading||i.isLoading,u=n.groupColumns.size===0&&!n.tree.enabled,f=i.enabled?n.totalRowCount:n.filterStats.filtered,{queryVersion:p}=i;return(0,h.useEffect)(()=>{i.enabled&&i.request(0,Math.max(s.length,1))},[i,p,s.length,n.page,n.pageSize,n.expansionVersion]),(0,g.jsxs)(a.default,{component:`${o}.list`,d:`column`,children:[(0,g.jsx)(H,{grid:n}),(0,g.jsx)(l.i,{grid:n}),c&&(0,g.jsx)(l.a,{grid:n}),s.length===0?(0,g.jsx)(e.default,{component:`list.muted`,px:4,py:10,textAlign:`center`,children:n.props.def.noDataComponent??(c?n.localeText.loadingRows:n.localeText.noRows)}):(0,g.jsx)(d.default,{props:{"aria-labelledby":n.props.def.title?n.titleId:void 0,"aria-busy":c||void 0},children:s.map(({row:e,index:t},r)=>e.kind===`group`?(0,g.jsx)(b,{row:e,version:n.rowVersion(e,t)},e.key):(0,g.jsx)(C,{row:e,index:t,position:u?r+1:void 0,setSize:u?f:void 0,version:n.rowVersion(e,t)},e.key))}),(0,g.jsx)(v,{grid:n,shown:u?s.length:void 0}),(0,g.jsx)(A,{grid:n}),(0,g.jsx)(k,{grid:n})]})}U.displayName=`DataGridList`,exports.default=U;

package/dataGridList.mjs

@@ -433,7 +433,7 @@ function K(t) {
 			/* @__PURE__ */ R(s, {
 				d: "column",
 				flexShrink: 0,
-				css: { touchAction: "none" },
+				touchAction: "none",
 				props: {
 					onPointerDown: x,
 					onPointerMove: S,
@@ -486,10 +486,8 @@ function K(t) {
 				overflowY: "auto",
 				px: 4,
 				py: 2,
-				css: {
-					overscrollBehavior: "contain",
-					touchAction: "pan-y"
-				},
+				touchAction: "pan-y",
+				css: { overscrollBehavior: "contain" },
 				props: m,
 				children: _
 			}),

package/docs/props.md

@@ -1,4 +1,4 @@
-# Every prop (235)
+# Every prop (238)
 
 Generated from the prop registry of `@box-kite/react`. The description is the prop's own doc comment and the example is **measured** — the CSS beside a value is what the engine emits for it, not what a doc claims. Alphabetical; the registry's own order is what decides the cascade and is not this.
 
@@ -642,11 +642,11 @@ The cursor CSS property sets the mouse cursor, if any, to show when the mouse po
 
 ### `cx`
 
-The centre of a `<circle>` or `<ellipse>`, horizontally, in user units. Real CSS, so unlike the attribute it transitions — moving a point on hover is one prop and no JavaScript.
+The centre of a `<circle>` or `<ellipse>`, horizontally, in user units. Real CSS, so unlike the attribute it transitions — moving a point on hover is one prop and no JavaScript. Written in `px`, which is a user unit: Firefox and Safari drop a bare number here, and so does every geometry prop (bug #330).
 
 - Writes: `cx`
 - Values: a number, anything else the types allow
-- Example: `cx={4}` → `cx: 4`
+- Example: `cx={4}` → `cx: 4px`
 
 ### `cy`
 
@@ -654,7 +654,7 @@ The cy CSS property positions the centre of a `<circle>` or an `<ellipse>` verti
 
 - Writes: `cy`
 - Values: a number, anything else the types allow
-- Example: `cy={4}` → `cy: 4`
+- Example: `cy={4}` → `cy: 4px`
 
 ### `d`
 
@@ -1242,10 +1242,10 @@ The padding CSS shorthand property sets the padding area on all four sides of an
 
 ### `paintOrder`
 
-The paint-order CSS property sets what is painted first. `paintOrder="stroke"` puts the stroke behind the fill, which is how outlined SVG text stays legible.
+The paint-order CSS property sets what is painted first. `paintOrder="stroke"` puts the stroke behind the fill, which is how outlined SVG text stays legible. Up to three keywords in the order they paint (`'stroke fill markers'`); the ones left out follow in their usual order.
 
 - Writes: `paint-order`
-- Values: `normal` · `fill` · `stroke` · `markers`
+- Values: `normal` · `fill` · `stroke` · `markers` · `fill stroke` · `fill markers` · `stroke fill` · `stroke markers` · `markers fill` · `markers stroke` · `fill stroke markers` · `fill markers stroke` · `stroke fill markers` · `stroke markers fill` · `markers fill stroke` · `markers stroke fill`
 - Example: `paintOrder="normal"` → `paint-order: normal`
 
 ### `pb`
@@ -1290,10 +1290,10 @@ The place-items CSS shorthand sets `align-items` and `justify-items` in one decl
 
 ### `pointerEvents`
 
-The pointer-events CSS property sets under what circumstances (if any) a particular graphic element can become the target of pointer events.
+The pointer-events CSS property sets under what circumstances (if any) a particular graphic element can become the target of pointer events. On SVG the keywords say which part takes the press: `visibleStroke` over a wide transparent stroke is an edge's hit area. `bounding-box` is not in Firefox, which falls back to `visiblePainted`.
 
 - Writes: `pointer-events`
-- Values: `none` · `auto` · `all`
+- Values: `none` · `auto` · `all` · `visiblePainted` · `visibleFill` · `visibleStroke` · `visible` · `painted` · `fill` · `stroke` · `bounding-box`
 - Example: `pointerEvents="none"` → `pointer-events: none`
 
 ### `position`
@@ -1390,7 +1390,7 @@ The r CSS property sets the radius of a `<circle>`, in user units. Transition it
 
 - Writes: `r`
 - Values: a number, anything else the types allow
-- Example: `r={4}` → `r: 4`
+- Example: `r={4}` → `r: 4px`
 
 ### `resize`
 
@@ -1446,7 +1446,7 @@ The horizontal radius of an `<ellipse>` or corner radius of a `<rect>` — `bord
 
 - Writes: `rx`
 - Values: `auto`, a number, anything else the types allow
-- Example: `rx={4}` → `rx: 4`
+- Example: `rx={4}` → `rx: 4px`
 
 ### `ry`
 
@@ -1454,7 +1454,7 @@ The ry CSS property sets the vertical radius of an `<ellipse>` or the vertical c
 
 - Writes: `ry`
 - Values: `auto`, a number, anything else the types allow
-- Example: `ry={4}` → `ry: 4`
+- Example: `ry={4}` → `ry: 4px`
 
 ### `saturate`
 
@@ -1562,10 +1562,10 @@ The stroke CSS property defines the color or SVG paint server used to draw an el
 
 ### `strokeDasharray`
 
-The stroke-dasharray CSS property turns an SVG stroke into dashes: a single number is the dash and the gap alike, a string is the full pattern (`'8 4'`). Lengths are user units.
+The stroke-dasharray CSS property turns an SVG stroke into dashes: a single number is the dash and the gap alike, a string is the full pattern (`'8 4'`). Lengths are user units. `dashed` (four widths on, two off) and `dotted` (one on, one off) follow the `strokeWidth` prop, so a thicker line keeps its pattern.
 
 - Writes: `stroke-dasharray`
-- Values: a number, anything else the types allow
+- Values: `dashed` · `dotted`, a number, anything else the types allow
 - Example: `strokeDasharray={4}` → `stroke-dasharray: 4`
 
 ### `strokeDashoffset`
@@ -1610,11 +1610,11 @@ The stroke-opacity CSS property defines the opacity of the paint applied to an S
 
 ### `strokeWidth`
 
-The stroke-width CSS property sets the width of an SVG element's stroke, in user units — `strokeWidth={2}` is `stroke-width: 2`, no divider.
+The stroke-width CSS property sets the width of an SVG element's stroke, in user units — `strokeWidth={2}` is `stroke-width: 2`, no divider. It also sets `--boxStrokeWidth`, which `strokeDasharray="dashed"` scales with. Firefox drops a unitless one inside `calc()`, hence the `px`.
 
-- Writes: `stroke-width`
+- Writes: `--boxStrokeWidth`, `stroke-width`
 - Values: a number
-- Example: `strokeWidth={4}` → `stroke-width: 4`
+- Example: `strokeWidth={4}` → `--boxStrokeWidth: 4px; stroke-width: 4`
 
 ### `tableLayout`
 
@@ -1704,6 +1704,30 @@ The top CSS property sets the vertical position of a positioned element. This in
 - Values: 55 named values, a number, anything else the types allow
 - Example: `top={4}` → `top: 1rem`
 
+### `touchAction`
+
+The touch-action CSS property sets which gestures the browser keeps for itself on a touch screen: `none` hands every press to the page, which is what a drag needs, and `pan-y` keeps the vertical scroll while a sideways swipe is the page's.
+
+- Writes: `touch-action`
+- Values: `auto` · `none` · `manipulation` · `pan-x` · `pan-y` · `pinch-zoom` · `pan-x pan-y` · `pan-x pinch-zoom` · `pan-y pinch-zoom` · `pan-x pan-y pinch-zoom`
+- Example: `touchAction="auto"` → `touch-action: auto`
+
+### `transformBox`
+
+The box `transformOrigin` is measured in. An SVG shape's default is `view-box`, so it turns about the viewBox's corner; `transformBox="fill-box"` with `transformOrigin="center"` turns it about its own centre.
+
+- Writes: `transform-box`
+- Values: `content-box` · `border-box` · `fill-box` · `stroke-box` · `view-box`
+- Example: `transformBox="content-box"` → `transform-box: content-box`
+
+### `transformOrigin`
+
+The point `rotate` and `scale` turn about: a keyword (`'center'`, `'top left'`), a fraction or a percentage, a number on the ÷4 scale, or two or three positions as CSS writes them (`'48px 48px'`, `'1/2 1/4'`).
+
+- Writes: `transform-origin`
+- Values: a number, anything else the types allow
+- Example: `transformOrigin={4}` → `transform-origin: 1rem`
+
 ### `transition`
 
 What a transition applies to: `all` (what the base class already does), `none`, or one of the property groups — `colors`, `opacity`, `shadow`, `transform`, `size`, `filter`.
@@ -1866,11 +1890,11 @@ The will-change CSS property warns the browser that a property is about to chang
 
 ### `x`
 
-Positions a `<rect>`, `<image>`, `<use>`, `<foreignObject>` or nested `<svg>` horizontally, in user units. Not `<text>`, whose `x` takes a list of positions and stays an attribute — pass it in `props`.
+Positions a `<rect>`, `<image>`, `<use>`, `<foreignObject>` or nested `<svg>` horizontally, in user units. Not `<text>`, whose `x` takes a list of positions: `<SvgText x={4}>` writes it as the attribute.
 
 - Writes: `x`
 - Values: a number, anything else the types allow
-- Example: `x={4}` → `x: 4`
+- Example: `x={4}` → `x: 4px`
 
 ### `y`
 
@@ -1878,7 +1902,7 @@ The y CSS property positions a `<rect>`, `<image>`, `<use>`, `<foreignObject>` o
 
 - Writes: `y`
 - Values: a number, anything else the types allow
-- Example: `y={4}` → `y: 4`
+- Example: `y={4}` → `y: 4px`
 
 ### `zIndex`
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@box-kite/react",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "type": "module",
   "sideEffects": [
     "pages/**"
@@ -548,7 +548,7 @@
         "../dataGridDateParts.mjs"
       ],
       "gzip": true,
-      "limit": "99.89 kB"
+      "limit": "100.21 kB"
     },
     {
       "name": "Interaction delivery, the chunk the first Box.onInteraction fetches",
@@ -614,7 +614,7 @@
         "./interactionListening.mjs"
       ],
       "gzip": true,
-      "limit": "169.84 kB"
+      "limit": "170.45 kB"
     }
   ],
   "repository": {
@@ -648,13 +648,13 @@
     "url": "https://github.com/box-kite/box-kite/issues"
   },
   "homepage": "https://www.box-kite.dev",
-  "description": "One React component with 235 typed CSS props that generates atomic CSS at runtime — no CSS files, no build step, renders in a Server Component.",
+  "description": "One React component that takes CSS properties as typed props and generates atomic CSS at runtime — no CSS files, no build step, renders in a Server Component.",
   "peerDependencies": {
     "react": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
     "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@box-kite/core": "2.3.0",
+    "@box-kite/core": "2.3.1",
     "csstype": "^3.2.3",
     "use-sync-external-store": "^1.6.0"
   },