@box-kite/react 2.2.15 → 2.2.17

package/components/slider.cjs

@@ -1 +1 @@
-"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../platform.cjs"),t=require("../box.cjs"),n=require("../behavior.cjs"),r=require("../reporting.cjs");let i=require("react"),a=require("react/jsx-runtime");var o;(function(e){function t(e){let t=String(Math.abs(e));if(t.includes(`e`))return 12;let n=t.indexOf(`.`);return n===-1?0:t.length-n-1}e.decimals=t;function n(e,t){return Number(e.toFixed(Math.min(t,15)))}function r(e,t,n){return Math.min(Math.max(e,t),n)}e.clamp=r;function i(e,i){let{min:a,max:o,step:s}=i,c=r(e,a,o);return s>0?r(n(a+Math.round((c-a)/s)*s,t(s)+t(a)),a,o):c}e.snap=i;function a(e,t,n){return n<=t?0:(r(e,t,n)-t)*(100/(n-t))}e.percent=a;function o(e,t,n){return`${Math.round(a(e,t,n)*100)/100}%`}e.percentage=o;function s(e){return typeof e==`number`?[e]:[...e]}e.thumbs=s;function c(e,t){return typeof e==`number`?t[0]:[...t]}e.shaped=c;function l(e,t,n,a){let o=t>0?e[t-1]:a.min,s=t<e.length-1?e[t+1]:a.max,c=[...e];return c[t]=r(i(n,a),o,s),c}e.move=l;function u(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}e.same=u;function d(e,t){let n=0,r=1/0;return e.forEach((e,i)=>{let a=Math.abs(e-t);a<=r&&(n=i,r=a)}),n}e.nearest=d;function f(e,t,n,r,i){let a=r===`vertical`?e.height===0?0:(e.bottom-n)/e.height:e.width===0?0:i?(e.right-t)/e.width:(t-e.left)/e.width;return Math.min(Math.max(a,0),1)}e.valueAt=f;function p(e,t=!1){if(e===`Home`)return{kind:`edge`,delta:-1};if(e===`End`)return{kind:`edge`,delta:1};if(e===`PageUp`)return{kind:`page`,delta:1};if(e===`PageDown`)return{kind:`page`,delta:-1};if(e===`ArrowUp`)return{kind:`step`,delta:1};if(e===`ArrowDown`)return{kind:`step`,delta:-1};if(e===`ArrowRight`)return{kind:`step`,delta:t?-1:1};if(e===`ArrowLeft`)return{kind:`step`,delta:t?1:-1}}e.moveFor=p;function m(e,t,n,r){if(t.kind===`edge`)return t.delta>0?n.max:n.min;let i=t.kind===`page`?r:n.step;return e+t.delta*i}e.moved=m})(o||={});var s=o,c=`data-index`;function l(e,t,n){return{min:e,max:t,step:n}}function u(e,t){return t?{insetBlockEnd:e}:{insetInlineStart:e}}function d(e,t,n){let r=e.length>1?Math.min(...e):t.min,i=Math.max(...e),a=s.percent(r,t.min,t.max),o=`${Math.round((s.percent(i,t.min,t.max)-a)*100)/100}%`;return n?{insetBlockEnd:`${Math.round(a*100)/100}%`,blockSize:o}:{insetInlineStart:`${Math.round(a*100)/100}%`,inlineSize:o}}function f(o){let{value:f,defaultValue:p,onValueChange:m,onValueCommit:h,min:g=0,max:_=100,step:v=1,largeStep:y=v*10,orientation:b=`horizontal`,disabled:x=!1,label:S,labelledBy:C,thumbLabels:w,format:T,name:E,props:D,...O}=o,k=(0,i.useRef)(null),A=(0,i.useRef)(null),j=(0,i.useRef)(null),M=(0,i.useRef)(!1),[N,P]=(0,i.useState)(!1),[F,I]=n.i({value:f,defaultValue:p??g,onChange:m}),L=l(g,_,v),R=b===`vertical`,z=s.thumbs(F),B=n.o(F),V=r.r(h,`slider`,`valueCommit`),H=n.a((e,t)=>{I(t=>s.same(s.thumbs(t),e)?t:s.shaped(t,e),t)}),U=t=>{let n=A.current;if(!n)return;let r=s.valueAt(n.getBoundingClientRect(),t.clientX,t.clientY,b,e.p(n));return g+r*(_-g)},W=e=>k.current?.querySelectorAll(`[role="slider"]`)[e],G=n.a(e=>{if(x||e.button!==0||e.defaultPrevented)return;let t=U(e);if(t===void 0)return;let n=s.thumbs(B.current),r=s.nearest(n,t);j.current=r,e.preventDefault(),e.currentTarget.setPointerCapture?.(e.pointerId),W(r)?.focus(),H(s.move(n,r,t,L),{reason:`pointer`,event:e})}),K=n.a(e=>{let t=j.current;if(t===null)return;let n=U(e);n!==void 0&&(P(!0),H(s.move(s.thumbs(B.current),t,n,L),{reason:`pointer`,event:e}))}),q=n.a(e=>{j.current!==null&&(j.current=null,P(!1),e.currentTarget.releasePointerCapture?.(e.pointerId),V(B.current,{reason:`pointer`,event:e}))}),J=n.a(t=>{if(x||t.defaultPrevented)return;let n=t.target?.closest(`[role="slider"]`),r=Number(n?.getAttribute(c)??-1);if(!n||r<0)return;let i=s.moveFor(t.key,e.p(n));if(!i)return;t.preventDefault(),M.current=!0,P(!0);let a=s.thumbs(B.current);H(s.move(a,r,s.moved(a[r],i,L,y),L),{reason:`keyboard`,event:t})}),Y=n.a(e=>{M.current&&(M.current=!1,P(!1),V(B.current,{reason:`keyboard`,event:e}))}),X=z.length>1;return(0,a.jsxs)(t.default,{ref:k,component:`slider`,...O,variant:[O.variant,{vertical:R,disabled:x}],props:{role:X?`group`:void 0,"aria-label":X?S:void 0,"aria-labelledby":X?C:void 0,...D,onPointerDown:G,onPointerMove:K,onPointerUp:q,onPointerCancel:q,onKeyDown:J,onKeyUp:Y},children:[(0,a.jsx)(t.default,{ref:A,component:`slider.track`,variant:{vertical:R},children:(0,a.jsx)(t.default,{component:`slider.fill`,variant:{vertical:R,tracking:N},style:d(z,L,R)})}),z.map((e,n)=>(0,a.jsx)(t.default,{component:`slider.thumb`,variant:{vertical:R,disabled:x,tracking:N},style:u(s.percentage(e,g,_),R),props:{role:`slider`,tabIndex:x?-1:0,"aria-valuemin":g,"aria-valuemax":_,"aria-valuenow":e,"aria-valuetext":T?.(e),"aria-orientation":b,"aria-label":w?.[n]??(X?void 0:S),"aria-labelledby":w?.[n]||X?void 0:C,"aria-disabled":x||void 0,[c]:n}},n)),E!==void 0&&z.map((e,t)=>(0,a.jsx)(`input`,{type:`hidden`,name:E,value:e,readOnly:!0},t))]})}var p=f;p.displayName=`Slider`,exports.default=p;
+"use client";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});const e=require("../react-shared.cjs"),t=require("../platform.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../reporting.cjs");let a=require("react"),o=require("react/jsx-runtime");var s;(function(e){function t(e){let t=String(Math.abs(e));if(t.includes(`e`))return 12;let n=t.indexOf(`.`);return n===-1?0:t.length-n-1}e.decimals=t;function n(e,t){return Number(e.toFixed(Math.min(t,15)))}function r(e,t,n){return Math.min(Math.max(e,t),n)}e.clamp=r;function i(e,i){let{min:a,max:o,step:s}=i,c=r(e,a,o);return s>0?r(n(a+Math.round((c-a)/s)*s,t(s)+t(a)),a,o):c}e.snap=i;function a(e,t,n){return n<=t?0:(r(e,t,n)-t)*(100/(n-t))}e.percent=a;function o(e,t,n){return`${Math.round(a(e,t,n)*100)/100}%`}e.percentage=o;function s(e){return typeof e==`number`?[e]:[...e]}e.thumbs=s;function c(e,t){return typeof e==`number`?t[0]:[...t]}e.shaped=c;function l(e,t,n,a){let o=t>0?e[t-1]:a.min,s=t<e.length-1?e[t+1]:a.max,c=[...e];return c[t]=r(i(n,a),o,s),c}e.move=l;function u(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}e.same=u;function d(e,t){let n=0,r=1/0;return e.forEach((e,i)=>{let a=Math.abs(e-t);a<=r&&(n=i,r=a)}),n}e.nearest=d;function f(e,t,n,r,i){let a=r===`vertical`?e.height===0?0:(e.bottom-n)/e.height:e.width===0?0:i?(e.right-t)/e.width:(t-e.left)/e.width;return Math.min(Math.max(a,0),1)}e.valueAt=f;function p(e,t=!1){if(e===`Home`)return{kind:`edge`,delta:-1};if(e===`End`)return{kind:`edge`,delta:1};if(e===`PageUp`)return{kind:`page`,delta:1};if(e===`PageDown`)return{kind:`page`,delta:-1};if(e===`ArrowUp`)return{kind:`step`,delta:1};if(e===`ArrowDown`)return{kind:`step`,delta:-1};if(e===`ArrowRight`)return{kind:`step`,delta:t?-1:1};if(e===`ArrowLeft`)return{kind:`step`,delta:t?1:-1}}e.moveFor=p;function m(e,t,n,r){if(t.kind===`edge`)return t.delta>0?n.max:n.min;let i=t.kind===`page`?r:n.step;return e+t.delta*i}e.moved=m})(s||={});var c=s,l=`data-index`;function u(e,t,n){return{min:e,max:t,step:n}}function d(e,t){return t?{insetBlockEnd:e}:{insetInlineStart:e}}function f(e,t,n){let r=e.length>1?Math.min(...e):t.min,i=Math.max(...e),a=c.percent(r,t.min,t.max),o=`${Math.round((c.percent(i,t.min,t.max)-a)*100)/100}%`;return n?{insetBlockEnd:`${Math.round(a*100)/100}%`,blockSize:o}:{insetInlineStart:`${Math.round(a*100)/100}%`,inlineSize:o}}function p(e,s){let{value:p,defaultValue:m,onValueChange:h,onValueCommit:g,min:_=0,max:v=100,step:y=1,largeStep:b=y*10,orientation:x=`horizontal`,disabled:S=!1,label:C,labelledBy:w,thumbLabels:T,format:E,name:D,props:O,...k}=e,A=(0,a.useRef)(null),j=(0,a.useCallback)(e=>{A.current=e,t.l(s,e)},[s]),M=(0,a.useRef)(null),N=(0,a.useRef)(null),P=(0,a.useRef)(!1),[F,I]=(0,a.useState)(!1),[L,R]=r.i({value:p,defaultValue:m??_,onChange:h}),z=u(_,v,y),B=x===`vertical`,V=c.thumbs(L),H=r.o(L),U=i.r(g,`slider`,`valueCommit`),W=r.a((e,t)=>{R(t=>c.same(c.thumbs(t),e)?t:c.shaped(t,e),t)}),G=e=>{let n=M.current;if(!n)return;let r=c.valueAt(n.getBoundingClientRect(),e.clientX,e.clientY,x,t.m(n));return _+r*(v-_)},K=e=>A.current?.querySelectorAll(`[role="slider"]`)[e],q=r.a(e=>{if(S||e.button!==0||e.defaultPrevented)return;let t=G(e);if(t===void 0)return;let n=c.thumbs(H.current),r=c.nearest(n,t);N.current=r,e.preventDefault(),e.currentTarget.setPointerCapture?.(e.pointerId),K(r)?.focus(),W(c.move(n,r,t,z),{reason:`pointer`,event:e})}),J=r.a(e=>{let t=N.current;if(t===null)return;let n=G(e);n!==void 0&&(I(!0),W(c.move(c.thumbs(H.current),t,n,z),{reason:`pointer`,event:e}))}),Y=r.a(e=>{N.current!==null&&(N.current=null,I(!1),e.currentTarget.releasePointerCapture?.(e.pointerId),U(H.current,{reason:`pointer`,event:e}))}),X=r.a(e=>{if(S||e.defaultPrevented)return;let n=e.target?.closest(`[role="slider"]`),r=Number(n?.getAttribute(l)??-1);if(!n||r<0)return;let i=c.moveFor(e.key,t.m(n));if(!i)return;e.preventDefault(),P.current=!0,I(!0);let a=c.thumbs(H.current);W(c.move(a,r,c.moved(a[r],i,z,b),z),{reason:`keyboard`,event:e})}),Z=r.a(e=>{P.current&&(P.current=!1,I(!1),U(H.current,{reason:`keyboard`,event:e}))}),Q=V.length>1;return(0,o.jsxs)(n.default,{ref:j,component:`slider`,...k,variant:[k.variant,{vertical:B,disabled:S}],props:{role:Q?`group`:void 0,"aria-label":Q?C:void 0,"aria-labelledby":Q?w:void 0,...O,onPointerDown:q,onPointerMove:J,onPointerUp:Y,onPointerCancel:Y,onKeyDown:X,onKeyUp:Z},children:[(0,o.jsx)(n.default,{ref:M,component:`slider.track`,variant:{vertical:B},children:(0,o.jsx)(n.default,{component:`slider.fill`,variant:{vertical:B,tracking:F},style:f(V,z,B)})}),V.map((e,t)=>(0,o.jsx)(n.default,{component:`slider.thumb`,variant:{vertical:B,disabled:S,tracking:F},style:d(c.percentage(e,_,v),B),props:{role:`slider`,tabIndex:S?-1:0,"aria-valuemin":_,"aria-valuemax":v,"aria-valuenow":e,"aria-valuetext":E?.(e),"aria-orientation":x,"aria-label":T?.[t]??(Q?void 0:C),"aria-labelledby":T?.[t]||Q?void 0:w,"aria-disabled":S||void 0,[l]:t}},t)),D!==void 0&&V.map((e,t)=>(0,o.jsx)(`input`,{type:`hidden`,name:D,value:e,readOnly:!0},t))]})}var m=e.f(p,`Slider`);exports.default=m;

package/components/slider.d.ts

@@ -40,59 +40,5 @@ export interface SliderProps<TKey extends keyof ComponentsAndVariants = 'slider'
     /** What the value submits under. One hidden input per thumb, so a range posts two values of that name. */
     name?: string;
 }
-/**
- * A value chosen by dragging a thumb along a track.
- * Pattern: https://www.w3.org/WAI/ARIA/apg/patterns/slider/ and .../slider-multithumb/
- *
- * ```tsx
- * <Slider label="Volume" defaultValue={40} onValueChange={(value) => setVolume(value)} />
- * <Slider label="Price" defaultValue={[20, 80]} thumbLabels={['Lowest', 'Highest']} />
- * ```
- *
- * **A number in is a number out.** `defaultValue={40}` makes a one-thumb slider whose `onValueChange`
- * hands back a `number`; `defaultValue={[20, 80]}` makes a range whose handler takes a `number[]`. The
- * number of thumbs is the value's own shape, so there is no second prop saying which kind this is.
- *
- * **This is not `<input type="range">`, and that is the one place the platform loses.** A range input
- * cannot hold two thumbs, and its track and thumb are vendor pseudo-elements (`::-webkit-slider-thumb`)
- * that no typed prop can reach — so a styled one is a rewrite of the parts, at which point the native
- * element is only the keyboard. `name` still submits: a hidden input per thumb, so a form posts the
- * value whether or not JavaScript ran the drag.
- *
- * **The position is an inline style, deliberately.** Everything a slider paints is a shared class except
- * where its thumbs are — that is a per-frame value, and a class for it would be a rule per frame of a
- * drag, never freed. It is the exception `useAnchorPosition`'s anchor name and the travelling tab
- * indicator already take, and the reason a `ProgressRing` can round its fraction into a class where this
- * cannot: nobody drags a ring.
- *
- * **It mirrors for free.** The fill and the thumbs are placed with `inset-inline-start`, so a
- * right-to-left page draws the minimum on the right with no second stylesheet. The half that is not free
- * is the keyboard, which is why the sideways arrows swap and Up and Down never do.
- *
- * **A press travels; a nudge does not.** A press on the track is the one move the eye has to follow, so
- * the thumb animates the whole way. Every other move — a drag, an arrow key, a held arrow — is the
- * `tracking` variant instead: 60ms `ease-out` on both the thumb and the fill, which must both carry it
- * or they come apart (#144). Short rather than *off*, because off is exact and steps — a 1-in-100 slider
- * moves 3.2px at a time on a 320px track. **Eased out rather than linear or eased**: a repeat restarts
- * the transition every 33ms, so only its first half is ever seen, and on this curve that half is the
- * straight part — it glides while the key is held and still decelerates on the last transition, the one
- * allowed to finish. Measured against linear, which rode **1.4 steps** behind the value and stopped at
- * full speed, this rides 0.9 behind and lands at 0.6 of cruising (#146).
- *
- * @pattern https://www.w3.org/WAI/ARIA/apg/patterns/slider/
- * @a11y Each thumb is a `role="slider"` carrying `aria-valuemin`, `aria-valuemax`, `aria-valuenow` and
- * `aria-orientation`; `format` writes `aria-valuetext` for a value a bare number does not read as.
- * @a11y A thumb has to be named, so `label` names the one on a single slider — and on a range it names
- * the `role="group"` around the thumbs, where `thumbLabels` names them one at a time.
- * @a11y `disabled` is `aria-disabled` rather than the attribute: a slider a reader cannot reach is a
- * value they cannot read, and a div takes no `disabled` anyway.
- * @keyboard Tab — Every thumb is its own tab stop, so a range is two of them.
- * @keyboard Right / Up — One step towards the maximum. In a right-to-left page Left is the increase, and
- * Up never changes: the block axis has no reading order.
- * @keyboard Left / Down — One step towards the minimum.
- * @keyboard PageUp / PageDown — `largeStep`, ten steps unless it says otherwise.
- * @keyboard Home / End — The minimum and the maximum themselves, on or off the step grid.
- */
-declare function SliderImpl<TKey extends keyof ComponentsAndVariants = 'slider', TValue extends SliderValue = number>(props: SliderProps<TKey, TValue>): import("react").JSX.Element;
-declare const Slider: typeof SliderImpl;
+declare const Slider: <TKey extends keyof ComponentsAndVariants = "slider", TValue extends SliderValue = number>(props: SliderProps<TKey, TValue>) => React.ReactNode;
 export default Slider;

package/components/slider.mjs

@@ -1,12 +1,13 @@
 "use client";
-import { p as e } from "../platform.mjs";
-import t from "../box.mjs";
-import { a as n, i as r, o as i } from "../behavior.mjs";
-import { r as a } from "../reporting.mjs";
-import { useRef as o, useState as s } from "react";
-import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { f as e } from "../react-shared.mjs";
+import { l as t, m as n } from "../platform.mjs";
+import r from "../box.mjs";
+import { a as i, i as a, o } from "../behavior.mjs";
+import { r as s } from "../reporting.mjs";
+import { useCallback as c, useRef as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/utils/slider/sliderUtils.ts
-var u;
+var p;
 (function(e) {
 	function t(e) {
 		let t = String(Math.abs(e));
@@ -106,20 +107,20 @@ var u;
 		return e + t.delta * i;
 	}
 	e.moved = m;
-})(u ||= {});
-var d = u, f = "data-index";
-function p(e, t, n) {
+})(p ||= {});
+var m = p, h = "data-index";
+function g(e, t, n) {
 	return {
 		min: e,
 		max: t,
 		step: n
 	};
 }
-function m(e, t) {
+function _(e, t) {
 	return t ? { insetBlockEnd: e } : { insetInlineStart: e };
 }
-function h(e, t, n) {
-	let r = e.length > 1 ? Math.min(...e) : t.min, i = Math.max(...e), a = d.percent(r, t.min, t.max), o = `${Math.round((d.percent(i, t.min, t.max) - a) * 100) / 100}%`;
+function v(e, t, n) {
+	let r = e.length > 1 ? Math.min(...e) : t.min, i = Math.max(...e), a = m.percent(r, t.min, t.max), o = `${Math.round((m.percent(i, t.min, t.max) - a) * 100) / 100}%`;
 	return n ? {
 		insetBlockEnd: `${Math.round(a * 100) / 100}%`,
 		blockSize: o
@@ -128,124 +129,125 @@ function h(e, t, n) {
 		inlineSize: o
 	};
 }
-function g(u) {
-	let { value: g, defaultValue: _, onValueChange: v, onValueCommit: y, min: b = 0, max: x = 100, step: S = 1, largeStep: C = S * 10, orientation: w = "horizontal", disabled: T = !1, label: E, labelledBy: D, thumbLabels: O, format: k, name: A, props: j, ...M } = u, N = o(null), P = o(null), F = o(null), I = o(!1), [L, R] = s(!1), [z, B] = r({
-		value: g,
-		defaultValue: _ ?? b,
-		onChange: v
-	}), V = p(b, x, S), H = w === "vertical", U = d.thumbs(z), W = i(z), G = a(y, "slider", "valueCommit"), K = n((e, t) => {
-		B((t) => d.same(d.thumbs(t), e) ? t : d.shaped(t, e), t);
-	}), q = (t) => {
-		let n = P.current;
-		if (!n) return;
-		let r = d.valueAt(n.getBoundingClientRect(), t.clientX, t.clientY, w, e(n));
-		return b + r * (x - b);
-	}, J = (e) => N.current?.querySelectorAll("[role=\"slider\"]")[e], Y = n((e) => {
-		if (T || e.button !== 0 || e.defaultPrevented) return;
-		let t = q(e);
+function y(e, p) {
+	let { value: y, defaultValue: b, onValueChange: x, onValueCommit: S, min: C = 0, max: w = 100, step: T = 1, largeStep: E = T * 10, orientation: D = "horizontal", disabled: O = !1, label: k, labelledBy: A, thumbLabels: j, format: M, name: N, props: ee, ...P } = e, F = l(null), I = c((e) => {
+		F.current = e, t(p, e);
+	}, [p]), L = l(null), R = l(null), z = l(!1), [B, V] = u(!1), [H, te] = a({
+		value: y,
+		defaultValue: b ?? C,
+		onChange: x
+	}), U = g(C, w, T), W = D === "vertical", G = m.thumbs(H), K = o(H), q = s(S, "slider", "valueCommit"), J = i((e, t) => {
+		te((t) => m.same(m.thumbs(t), e) ? t : m.shaped(t, e), t);
+	}), Y = (e) => {
+		let t = L.current;
+		if (!t) return;
+		let r = m.valueAt(t.getBoundingClientRect(), e.clientX, e.clientY, D, n(t));
+		return C + r * (w - C);
+	}, X = (e) => F.current?.querySelectorAll("[role=\"slider\"]")[e], Z = i((e) => {
+		if (O || e.button !== 0 || e.defaultPrevented) return;
+		let t = Y(e);
 		if (t === void 0) return;
-		let n = d.thumbs(W.current), r = d.nearest(n, t);
-		F.current = r, e.preventDefault(), e.currentTarget.setPointerCapture?.(e.pointerId), J(r)?.focus(), K(d.move(n, r, t, V), {
+		let n = m.thumbs(K.current), r = m.nearest(n, t);
+		R.current = r, e.preventDefault(), e.currentTarget.setPointerCapture?.(e.pointerId), X(r)?.focus(), J(m.move(n, r, t, U), {
 			reason: "pointer",
 			event: e
 		});
-	}), X = n((e) => {
-		let t = F.current;
+	}), ne = i((e) => {
+		let t = R.current;
 		if (t === null) return;
-		let n = q(e);
-		n !== void 0 && (R(!0), K(d.move(d.thumbs(W.current), t, n, V), {
+		let n = Y(e);
+		n !== void 0 && (V(!0), J(m.move(m.thumbs(K.current), t, n, U), {
 			reason: "pointer",
 			event: e
 		}));
-	}), Z = n((e) => {
-		F.current !== null && (F.current = null, R(!1), e.currentTarget.releasePointerCapture?.(e.pointerId), G(W.current, {
+	}), Q = i((e) => {
+		R.current !== null && (R.current = null, V(!1), e.currentTarget.releasePointerCapture?.(e.pointerId), q(K.current, {
 			reason: "pointer",
 			event: e
 		}));
-	}), Q = n((t) => {
-		if (T || t.defaultPrevented) return;
-		let n = t.target?.closest("[role=\"slider\"]"), r = Number(n?.getAttribute(f) ?? -1);
-		if (!n || r < 0) return;
-		let i = d.moveFor(t.key, e(n));
+	}), re = i((e) => {
+		if (O || e.defaultPrevented) return;
+		let t = e.target?.closest("[role=\"slider\"]"), r = Number(t?.getAttribute(h) ?? -1);
+		if (!t || r < 0) return;
+		let i = m.moveFor(e.key, n(t));
 		if (!i) return;
-		t.preventDefault(), I.current = !0, R(!0);
-		let a = d.thumbs(W.current);
-		K(d.move(a, r, d.moved(a[r], i, V, C), V), {
+		e.preventDefault(), z.current = !0, V(!0);
+		let a = m.thumbs(K.current);
+		J(m.move(a, r, m.moved(a[r], i, U, E), U), {
 			reason: "keyboard",
-			event: t
+			event: e
 		});
-	}), ee = n((e) => {
-		I.current && (I.current = !1, R(!1), G(W.current, {
+	}), ie = i((e) => {
+		z.current && (z.current = !1, V(!1), q(K.current, {
 			reason: "keyboard",
 			event: e
 		}));
-	}), $ = U.length > 1;
-	return /* @__PURE__ */ l(t, {
-		ref: N,
+	}), $ = G.length > 1;
+	return /* @__PURE__ */ f(r, {
+		ref: I,
 		component: "slider",
-		...M,
-		variant: [M.variant, {
-			vertical: H,
-			disabled: T
+		...P,
+		variant: [P.variant, {
+			vertical: W,
+			disabled: O
 		}],
 		props: {
 			role: $ ? "group" : void 0,
-			"aria-label": $ ? E : void 0,
-			"aria-labelledby": $ ? D : void 0,
-			...j,
-			onPointerDown: Y,
-			onPointerMove: X,
-			onPointerUp: Z,
-			onPointerCancel: Z,
-			onKeyDown: Q,
-			onKeyUp: ee
+			"aria-label": $ ? k : void 0,
+			"aria-labelledby": $ ? A : void 0,
+			...ee,
+			onPointerDown: Z,
+			onPointerMove: ne,
+			onPointerUp: Q,
+			onPointerCancel: Q,
+			onKeyDown: re,
+			onKeyUp: ie
 		},
 		children: [
-			/* @__PURE__ */ c(t, {
-				ref: P,
+			/* @__PURE__ */ d(r, {
+				ref: L,
 				component: "slider.track",
-				variant: { vertical: H },
-				children: /* @__PURE__ */ c(t, {
+				variant: { vertical: W },
+				children: /* @__PURE__ */ d(r, {
 					component: "slider.fill",
 					variant: {
-						vertical: H,
-						tracking: L
+						vertical: W,
+						tracking: B
 					},
-					style: h(U, V, H)
+					style: v(G, U, W)
 				})
 			}),
-			U.map((e, n) => /* @__PURE__ */ c(t, {
+			G.map((e, t) => /* @__PURE__ */ d(r, {
 				component: "slider.thumb",
 				variant: {
-					vertical: H,
-					disabled: T,
-					tracking: L
+					vertical: W,
+					disabled: O,
+					tracking: B
 				},
-				style: m(d.percentage(e, b, x), H),
+				style: _(m.percentage(e, C, w), W),
 				props: {
 					role: "slider",
-					tabIndex: T ? -1 : 0,
-					"aria-valuemin": b,
-					"aria-valuemax": x,
+					tabIndex: O ? -1 : 0,
+					"aria-valuemin": C,
+					"aria-valuemax": w,
 					"aria-valuenow": e,
-					"aria-valuetext": k?.(e),
-					"aria-orientation": w,
-					"aria-label": O?.[n] ?? ($ ? void 0 : E),
-					"aria-labelledby": O?.[n] || $ ? void 0 : D,
-					"aria-disabled": T || void 0,
-					[f]: n
+					"aria-valuetext": M?.(e),
+					"aria-orientation": D,
+					"aria-label": j?.[t] ?? ($ ? void 0 : k),
+					"aria-labelledby": j?.[t] || $ ? void 0 : A,
+					"aria-disabled": O || void 0,
+					[h]: t
 				}
-			}, n)),
-			A !== void 0 && U.map((e, t) => /* @__PURE__ */ c("input", {
+			}, t)),
+			N !== void 0 && G.map((e, t) => /* @__PURE__ */ d("input", {
 				type: "hidden",
-				name: A,
+				name: N,
 				value: e,
 				readOnly: !0
 			}, t))
 		]
 	});
 }
-var _ = g;
-_.displayName = "Slider";
+var b = e(y, "Slider");
 //#endregion
-export { _ as default };
+export { b as default };

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("../effects.cjs"),n=require("../box.cjs"),r=require("../behavior.cjs"),i=require("../reporting.cjs"),a=require("./svg.cjs"),o=require("./visuallyHidden.cjs"),s=require("../scrolling.cjs"),c=require("./list.cjs");let l=require("react"),u=require("react/jsx-runtime");var d;(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})(d||={});var f=d,p=(0,l.createContext)(null),m=(0,l.createContext)(null),h=48,g=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 x(e,t){return e.length===t.length&&e.every((e,n)=>e===t[n])}function S(e,n){let{onOrderChange:a,onOrderCommit:d,children:m,variant:_,props:S,...C}=e,w=(0,l.useRef)(null),T=(0,l.useRef)(null),E=(0,l.useRef)(null),[D,O]=(0,l.useState)(null),[k,A]=(0,l.useState)(0),[j,M]=(0,l.useState)(!1),[N,P]=(0,l.useState)(``),F=`${(0,l.useId)()}-sortable`,I=r.o(D),L=i.r(a,`sortableList`,`orderChange`),R=i.r(d,`sortableList`,`orderCommit`),z=i.i(`sortableList`),ee=(0,l.useCallback)(e=>{w.current=e,typeof n==`function`?n(e):n&&(n.current=e)},[n]),B=(e,t)=>`position ${e.indexOf(t)+1} of ${e.length}`,V=(e,t)=>{E.current=b(w.current),L(e,t)};t.n(()=>{let e=E.current;if(e){E.current=null;for(let t of v(w.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,l.useEffect)(()=>{if(!j)return;let e=requestAnimationFrame(()=>M(!1));return()=>cancelAnimationFrame(e)},[j]),t.n(()=>{if(!D||D.pointer)return;let e=v(w.current).find(e=>e.dataset.sortableValue===D.value)?.querySelector(`[data-sortable-handle]`);e&&e.ownerDocument.activeElement!==e&&e.focus()});let H=r.a((e,t)=>{let n=e.pointer,r=w.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=f.targetIndex(n.slots,a,i),A(i)}),te=(e,t)=>{let n=w.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)}};O(s),H(s,e.clientY)},U=D?.pointer!==void 0;(0,l.useEffect)(()=>{if(!U)return;let e=s.t(w.current),t=0,n=()=>{let r=I.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+h?-12:t>i-h?g:0;a&&((e??window).scrollBy(0,a),H(r,t))}t=requestAnimationFrame(n)};return t=requestAnimationFrame(n),()=>cancelAnimationFrame(t)},[U,H,I]);let W=(e,t,n)=>{let r=y(w.current);O({value:e,name:t,origin:r}),z(`grab`,e,{reason:n.type===`keydown`?`keyboard`:`pointer`,event:n,from:r.indexOf(e)}),P(`${t} picked up at ${B(r,e)}. Use the arrow keys to move it, Enter to drop it.`),n.preventDefault()},G=(e,t,n=y(w.current))=>{let r=n.indexOf(e.value);O(null),R(n,{reason:`keyboard`,event:t,value:e.value,from:e.origin.indexOf(e.value),to:r}),P(`${e.name} dropped at ${B(n,e.value)}.`)},K=r.a((e,t)=>{let n=y(w.current);z(`grabCancel`,e.value,{reason:t.type===`keydown`?`escape`:t.type===`blur`?`blur`:`pointercancel`,event:t}),O(null),A(0),x(n,e.origin)||V(e.origin,{reason:e.pointer?`pointer`:`keyboard`,event:t,value:e.value,from:n.indexOf(e.value),to:e.origin.indexOf(e.value)}),P(`${e.name} put back at ${B(e.origin,e.value)}.`)}),q=(e,t,n)=>{let r=y(w.current),i=r.indexOf(e.value);if(i<0||t===i)return r;let a=f.move(r,i,t);return V(a,{reason:`keyboard`,event:n,value:e.value,from:i,to:t}),P(`${e.name}, ${B(a,e.value)}.`),a},J=r.a((e,t,n)=>{e.button!==0||e.defaultPrevented||(e.preventDefault(),e.currentTarget.focus(),e.currentTarget.setPointerCapture?.(e.pointerId),T.current={id:e.pointerId,x:e.clientX,y:e.clientY,value:t,name:n})}),Y=r.a(e=>{let t=I.current;if(t?.pointer&&t.pointer.id===e.pointerId){H(t,e.clientY);return}let n=T.current;!n||n.id!==e.pointerId||Math.hypot(e.clientX-n.x,e.clientY-n.y)<f.SLOP||(T.current=null,te(e,n))}),X=r.a(e=>{let t=T.current;T.current=null;let n=I.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),M(!0),e.type===`pointercancel`){E.current=b(w.current),K(n,e);return}let i=r.order.indexOf(n.value),a=f.move(r.order,i,r.to),o={reason:`pointer`,event:e,value:n.value,from:i,to:r.to};E.current=b(w.current),O(null),A(0),r.to!==i&&L(a,o),R(a,o),P(`${n.name} dropped at ${B(a,n.value)}.`)}),Z=r.a((e,t,n)=>{if(e.defaultPrevented)return;let r=I.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(w.current),o=f.keyTarget(e.key,a.indexOf(t),a.length);o!==null&&(e.preventDefault(),q(i,o,e))}),Q=r.a(e=>{setTimeout(()=>{let t=I.current,n=w.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=I.current;if(!t||t.pointer||!(e.target instanceof Element))return null;let n=e.target.closest(`[data-sortable-value]`);return n&&n.parentElement===w.current&&n.dataset.sortableValue!==t.value?n:null},ne=e=>{$(e)&&e.preventDefault()},re=e=>{let t=$(e),n=I.current;!t||!n||(e.preventDefault(),e.stopPropagation(),G(n,e,q(n,y(w.current).indexOf(t.dataset.sortableValue??``),e)))},ie=(0,l.useMemo)(()=>{let e=D?.pointer,t=e?e.order.indexOf(D.value):-1;return{heldOf:e=>D&&D.value===e?D.pointer?`pointer`:`keyboard`:void 0,translateOf:n=>{if(!e)return;if(n===D.value)return`0 ${Math.round(k)}px`;let r=f.shiftOf(e.slots,t,e.to,e.order.indexOf(n));return r?`0 ${r}px`:void 0},settling:j,instructionsId:F,handleProps:(e,t)=>({type:`button`,"data-sortable-handle":``,"aria-label":`Move ${t}`,"aria-pressed":D?.value===e,"aria-describedby":F,onPointerDown:n=>J(n,e,t),onPointerMove:Y,onPointerUp:X,onPointerCancel:X,onKeyDown:n=>Z(n,e,t),onBlur:()=>Q(e)})}},[D,k,j,F,J,Y,X,Z,Q]);return(0,u.jsxs)(p.Provider,{value:ie,children:[(0,u.jsx)(c.default,{ref:ee,...C,variant:_,userSelect:U?`none`:void 0,props:{...S,onMouseDownCapture:ne,onClickCapture:re},children:m}),(0,u.jsx)(o.default,{props:{role:`status`},children:N}),(0,u.jsx)(o.default,{id:F,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 C(e,t){let{value:n,label:r,disabled:i=!1,variant:a,props:o,...s}=e,d=(0,l.useContext)(p),f=d?.heldOf(n),h=d?.translateOf(n),g=(0,l.useMemo)(()=>({value:n,name:r??n,disabled:i}),[n,r,i]);return(0,u.jsx)(m.Provider,{value:g,children:(0,u.jsx)(c.default.Item,{ref:t,...s,variant:[a,{lifted:f===`pointer`,grabbed:f===`keyboard`,settling:d?.settling??!1}],style:h?{translate:h}:void 0,props:{...o,"data-sortable-value":n}})})}function w(){return(0,u.jsx)(a.Svg,{viewBox:`0 0 16 16`,width:`1rem`,fill:`currentColor`,children:[5,11].flatMap(e=>[3,8,13].map(t=>(0,u.jsx)(a.Circle,{cx:e,cy:t,r:1.4},`${e}-${t}`)))})}function T(e,t){let{children:r,variant:i,props:a,...o}=e,s=(0,l.useContext)(p),c=(0,l.useContext)(m),d=c&&s?s.handleProps(c.value,c.name):{};return n.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:{...d,...c?.disabled?{disabled:!0}:{},...a},children:r??(0,u.jsx)(w,{})},t)}var E=e.f(S,`SortableList`);E.Item=e.f(C,`SortableList.Item`),E.Handle=e.f(T,`SortableList.Handle`),exports.SortableUtils=f,exports.default=E;
+"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.l(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;