@jfrader/ui 0.5.0 → 0.6.0

package/dist/{bottom-sheet-DPJBFkie.js → bottom-sheet-BFQKO0Wo.js}

@@ -1,27 +1,29 @@
 'use client';
-import { r as e, t } from "./sx-Dx9JUKp5.js";
-import { n } from "./focus-ring-BK5W5_NY.js";
-import { n as r, r as i } from "./media-8yrN85VT.js";
+import { i as e } from "./css-BYJhdGh-.js";
+import { n as t } from "./focus-ring-BK5W5_NY.js";
+import { n, r } from "./media-8yrN85VT.js";
+import { t as i } from "./sx-BJXJ2xJK.js";
 import { t as a } from "./use-controlled-state-DpeVQZNR.js";
-import { t as o } from "./visually-hidden-BJdvqqvn.js";
+import { t as o } from "./visually-hidden-DgVO3NaB.js";
 import { t as s } from "./renderable-DzcIj1Lo.js";
-import { n as c, t as l } from "./surface-DZ4d-2aL.js";
-import { t as u } from "./trigger-style-B1KVC8O1.js";
-import { n as d, r as f } from "./overlay-layer-SeUyyEPD.js";
-import { i as p, r as m, t as h } from "./use-native-dialog-DWpIUVO1.js";
-import { createContext as g, useCallback as _, useContext as v, useEffect as y, useId as b, useMemo as x, useRef as S, useState as C } from "react";
-import { vars as w } from "@jfrader/tokens/vars";
-import { jsx as T, jsxs as E } from "@emotion/react/jsx-runtime";
-import { useFloating as D, useFloatingTree as O, useInteractions as k, useMergeRefs as A } from "@floating-ui/react";
-import { getDeepestNode as j } from "@floating-ui/react/utils";
-import { MotionConfig as M, animate as N, useMotionValue as P, useReducedMotion as F } from "motion/react";
+import { n as c, t as l } from "./surface-C69kwSuk.js";
+import { t as u } from "./trigger-style-CtOrdPk4.js";
+import { a as d, i as f } from "./overlay-layer-qEbpEtb8.js";
+import { i as p, r as m, t as h } from "./use-native-dialog-FB0p7lkg.js";
+import { t as g } from "./presence-spring-4zwtUDQN.js";
+import { createContext as _, useCallback as v, useContext as y, useEffect as b, useId as x, useMemo as S, useRef as C, useState as w } from "react";
+import { vars as T } from "@jfrader/tokens/vars";
+import { jsx as E, jsxs as D } from "@emotion/react/jsx-runtime";
+import { MotionConfig as O, animate as k, useMotionValue as A, useReducedMotion as j } from "motion/react";
+import { useFloating as M, useFloatingTree as N, useInteractions as P, useMergeRefs as F } from "@floating-ui/react";
+import { getDeepestNode as I } from "@floating-ui/react/utils";
 //#region src/components/bottom-sheet/bottom-sheet.tsx
-var I = [.45, .92], L = "36rem", R = {
+var ee = [.45, .92], L = "36rem", R = {
 	type: "spring",
 	stiffness: 400,
 	damping: 40,
 	mass: 1
-}, z = .2, ee = 320, B = 80, V = 120, H = 8, U = [
+}, z = .2, B = 320, V = 80, H = 120, U = 8, te = [
 	"button:not([data-ui=\"bottom-sheet-handle\"])",
 	"a[href]",
 	"input",
@@ -31,7 +33,7 @@ var I = [.45, .92], L = "36rem", R = {
 	"[contenteditable]:not([contenteditable=\"false\"])",
 	"[data-ui=\"bottom-sheet-title\"]",
 	"[data-ui=\"bottom-sheet-description\"]"
-].join(", "), te = "button, a[href], input, select, textarea, [contenteditable]:not([contenteditable=\"false\"])", ne = e({
+].join(", "), ne = "button, a[href], input, select, textarea, [contenteditable]:not([contenteditable=\"false\"])", re = e({
 	...l,
 	position: "fixed",
 	inset: 0,
@@ -40,15 +42,15 @@ var I = [.45, .92], L = "36rem", R = {
 	blockSize: "100dvh",
 	maxInlineSize: "none",
 	maxBlockSize: "none",
-	overflow: "hidden",
+	overflow: "clip",
 	"&::backdrop": { backgroundColor: "transparent" }
-}), re = e({
+}), ie = e({
 	position: "absolute",
 	inset: 0,
-	backgroundColor: w.color.scrim,
+	backgroundColor: T.color.scrim,
 	pointerEvents: "none",
 	opacity: "var(--sheet-scrim, 1)"
-}), ie = e({
+}), ae = e({
 	...c,
 	position: "absolute",
 	insetBlockStart: 0,
@@ -60,22 +62,23 @@ var I = [.45, .92], L = "36rem", R = {
 	display: "flex",
 	flexDirection: "column",
 	minBlockSize: 0,
-	borderStartStartRadius: w.radius.lg,
-	borderStartEndRadius: w.radius.lg,
-	boxShadow: w.shadow.floating,
+	borderStartStartRadius: T.radius.lg,
+	borderStartEndRadius: T.radius.lg,
+	boxShadow: T.shadow.floating,
 	paddingBlockEnd: "env(safe-area-inset-bottom, 0px)",
-	"&:focus-visible": n,
-	[r]: {
+	"&:focus-visible": t,
+	[n]: {
 		boxShadow: "none",
 		borderColor: "CanvasText"
 	}
-}), ae = e({
+}), oe = e({
 	flexShrink: 0,
 	display: "grid",
 	gridTemplateColumns: "minmax(0, 1fr) auto",
-	gap: w.space[2],
-	paddingInline: w.space[6],
-	paddingBlock: w.space[2],
+	gap: T.space[2],
+	paddingInline: T.space[6],
+	paddingBlock: T.space[2],
+	"&[data-dragging]": { userSelect: "none" },
 	"& > [data-ui=\"bottom-sheet-handle\"]": {
 		gridColumn: "1 / -1",
 		justifySelf: "center",
@@ -85,158 +88,158 @@ var I = [.45, .92], L = "36rem", R = {
 		gridColumn: 2,
 		gridRow: 2
 	}
-}), oe = e({
+}), se = e({
 	flex: "1 1 auto",
 	minBlockSize: 0,
 	overflow: "auto",
 	overscrollBehavior: "contain",
-	paddingInline: w.space[6],
-	paddingBlock: w.space[4],
-	fontSize: w.textSize.sm,
-	"&:focus-visible": n
-}), se = e({
+	paddingInline: T.space[6],
+	paddingBlock: T.space[4],
+	fontSize: T.textSize.sm,
+	"&:focus-visible": t
+}), ce = e({
 	flexShrink: 0,
 	display: "flex",
 	flexWrap: "wrap",
-	gap: w.space[2],
-	paddingInline: w.space[6],
-	paddingBlock: w.space[4],
-	borderBlockStart: `1px solid ${w.color.border}`
-}), ce = e({
-	margin: 0,
-	fontSize: w.textSize.lg,
-	lineHeight: w.lineHeight.tight,
-	fontWeight: w.fontWeight.semibold
+	gap: T.space[2],
+	paddingInline: T.space[6],
+	paddingBlock: T.space[4],
+	borderBlockStart: `1px solid ${T.color.border}`
 }), le = e({
 	margin: 0,
-	color: w.color.textMuted,
-	fontSize: w.textSize.sm
+	fontSize: T.textSize.lg,
+	lineHeight: T.lineHeight.tight,
+	fontWeight: T.fontWeight.semibold
+}), ue = e({
+	margin: 0,
+	color: T.color.textMuted,
+	fontSize: T.textSize.sm
 }), W = e({
 	appearance: "none",
-	minInlineSize: w.space[8],
-	minBlockSize: w.space[8],
+	minInlineSize: T.space[8],
+	minBlockSize: T.space[8],
 	display: "inline-flex",
 	alignItems: "center",
 	justifyContent: "center",
-	paddingInline: w.space[3],
-	paddingBlock: w.space[1],
+	paddingInline: T.space[3],
+	paddingBlock: T.space[1],
 	border: "1px solid transparent",
-	borderRadius: w.radius.md,
-	color: w.color.textMuted,
+	borderRadius: T.radius.md,
+	color: T.color.textMuted,
 	backgroundColor: "transparent",
 	font: "inherit",
 	cursor: "pointer",
-	"&:focus-visible": n,
+	"&:focus-visible": t,
 	"&:disabled": { cursor: "not-allowed" },
-	[r]: { borderColor: "ButtonText" },
-	[i]: { transition: "none" }
-}), ue = e({
+	[n]: { borderColor: "ButtonText" },
+	[r]: { transition: "none" }
+}), de = e({
 	"&::after": {
 		content: "\"\"",
-		inlineSize: w.space[10],
-		blockSize: w.space[1],
-		borderRadius: w.radius.full,
-		backgroundColor: w.color.borderControl
+		inlineSize: T.space[10],
+		blockSize: T.space[1],
+		borderRadius: T.radius.full,
+		backgroundColor: T.color.borderControl
 	},
-	[r]: { "&::after": {
+	[n]: { "&::after": {
 		backgroundColor: "ButtonText",
 		outline: "1px solid ButtonText"
 	} }
-}), G = o, K = g(null), q = g(null);
+}), G = o, K = _(null), q = _(null);
 function J(e) {
-	let t = v(K);
+	let t = y(K);
 	if (!t) throw Error(`BottomSheet.${e} must be rendered inside <BottomSheet>.`);
 	return t;
 }
-function de(e) {
+function fe(e) {
 	if (!e.length || e.some((t, n) => !Number.isFinite(t) || t <= 0 || t > 1 || n > 0 && t <= e[n - 1])) throw Error("BottomSheet.detents must be nonempty, finite, strictly ascending unique fractions in (0, 1].");
 }
-function fe({ nodeId: e, open: t, defaultOpen: n = !1, onOpenChange: r, detents: i = I, value: o, defaultValue: s = 0, onValueChange: c, locale: l, getValueText: u, children: d }) {
-	de(i);
-	let m = S([...i]);
+function pe({ nodeId: e, open: t, defaultOpen: n = !1, onOpenChange: r, detents: i = ee, value: o, defaultValue: s = 0, onValueChange: c, locale: l, getValueText: u, children: f }) {
+	fe(i);
+	let m = C([...i]);
 	if (i.length !== m.current.length || i.some((e, t) => e !== m.current[t])) throw Error("BottomSheet.detents numeric contents require remount to change.");
 	let [h = 0, g] = a(o, s, c);
 	if (!Number.isInteger(h) || h < 0 || h >= i.length || !Number.isInteger(s) || s < 0 || s >= i.length) throw Error("BottomSheet value/defaultValue must be valid detent indices.");
-	let [v = !1, w] = a(t, n, r), E = p(v, w), [O, A] = C(null), [j, M] = C(!1), N = _((e) => {
-		E.setDialogElement(e), A(e);
-	}, [E.setDialogElement]);
-	y(() => {
-		let e = () => M(O?.open ?? !1);
-		if (e(), !O) return;
-		let t = O.ownerDocument.defaultView?.MutationObserver;
+	let [_ = !1, y] = a(t, n, r), T = p(_, y), [D, O] = w(null), [k, A] = w(!1), j = v((e) => {
+		T.setDialogElement(e), O(e);
+	}, [T.setDialogElement]);
+	b(() => {
+		let e = () => A(D?.open ?? !1);
+		if (e(), !D) return;
+		let t = D.ownerDocument.defaultView?.MutationObserver;
 		if (!t) return;
 		let n = new t(e);
-		return n.observe(O, {
+		return n.observe(D, {
 			attributes: !0,
 			attributeFilter: ["open"]
 		}), () => n.disconnect();
-	}, [O]);
-	let P = D({
+	}, [D]);
+	let N = M({
 		nodeId: e,
-		open: v && j,
-		onOpenChange: (e) => e ? E.setOpen(!0) : E.requestClose()
-	}), F = f(P.context, "container"), L = k(F), R = b(), [z, ee] = C(!1), [B, V] = C(!1), H = x(() => {
+		open: _ && k,
+		onOpenChange: (e) => e ? T.setOpen(!0) : T.requestClose()
+	}), F = d(N.context, "container"), I = P(F), L = x(), [R, z] = w(!1), [B, V] = w(!1), H = S(() => {
 		let e = m.current[h];
 		return u?.(e, h) ?? new Intl.NumberFormat(l, { style: "percent" }).format(e);
 	}, [
 		u,
 		l,
 		h
-	]), U = x(() => ({
-		...E,
-		setDialogElement: N,
-		open: v,
+	]), U = S(() => ({
+		...T,
+		setDialogElement: j,
+		open: _,
 		detents: m.current,
 		value: h,
 		requestValue: g,
 		valueText: H,
-		panelId: `${R}-panel`,
-		valueTextId: `${R}-value`,
-		titleId: `${R}-title`,
-		descriptionId: `${R}-description`,
-		hasTitle: z,
+		panelId: `${L}-panel`,
+		valueTextId: `${L}-value`,
+		titleId: `${L}-title`,
+		descriptionId: `${L}-description`,
+		hasTitle: R,
 		hasDescription: B,
-		setHasTitle: ee,
+		setHasTitle: z,
 		setHasDescription: V,
-		floating: P,
-		interactions: L
+		floating: N,
+		interactions: I
 	}), [
-		E.setOpen,
-		E.requestClose,
-		E.repairToken,
-		N,
-		v,
+		T.setOpen,
+		T.requestClose,
+		T.repairToken,
+		j,
+		_,
 		h,
 		g,
 		H,
+		L,
 		R,
-		z,
 		B,
-		P,
-		L
+		N,
+		I
 	]);
-	return /* @__PURE__ */ T(K.Provider, {
+	return /* @__PURE__ */ E(K.Provider, {
 		value: U,
-		children: d
+		children: f
 	});
 }
 function Y(e) {
-	return /* @__PURE__ */ T(M, {
+	return /* @__PURE__ */ E(O, {
 		reducedMotion: "user",
-		children: /* @__PURE__ */ T(d, { children: (t) => /* @__PURE__ */ T(fe, {
+		children: /* @__PURE__ */ E(f, { children: (t) => /* @__PURE__ */ E(pe, {
 			...e,
 			nodeId: t
 		}) })
 	});
 }
 Y.displayName = "BottomSheet";
-function X({ ref: e, onClick: n, className: r, sx: i, ...a }) {
-	let o = J("Trigger"), s = A([e, o.floating.refs.setReference]);
-	return /* @__PURE__ */ T(t, {
-		className: r,
+function X({ ref: e, onClick: t, className: n, sx: r, ...a }) {
+	let o = J("Trigger"), s = F([e, o.floating.refs.setReference]);
+	return /* @__PURE__ */ E(i, {
+		className: n,
 		styles: u,
-		sx: i,
-		children: (e) => /* @__PURE__ */ T("button", {
+		sx: r,
+		children: (e) => /* @__PURE__ */ E("button", {
 			type: "button",
 			...a,
 			ref: s,
@@ -245,14 +248,14 @@ function X({ ref: e, onClick: n, className: r, sx: i, ...a }) {
 			"aria-expanded": o.open,
 			className: e,
 			onClick: (e) => {
-				n?.(e), e.defaultPrevented || o.setOpen(!0);
+				t?.(e), e.defaultPrevented || o.setOpen(!0);
 			}
 		})
 	});
 }
 X.displayName = "BottomSheet.Trigger";
-function pe(e, t) {
-	let n = S(null), r = S(null), i = P(0), a = S(0), o = S(0), s = S(null), c = S(null), l = S(!1), u = F(), d = S({
+function me(e, t) {
+	let n = C(null), r = C(null), i = A(0), a = C(0), o = C(0), s = C(null), c = C(null), l = C(!1), u = j(), d = C({
 		context: e,
 		reduced: u
 	});
@@ -260,47 +263,59 @@ function pe(e, t) {
 		context: e,
 		reduced: u
 	};
-	let f = () => a.current * (1 - d.current.context.detents[d.current.context.value]), p = _(() => {
-		s.current?.stop(), d.current.reduced ? i.set(f()) : s.current = N(i, f(), R);
-	}, [i]), m = _(() => {
+	let f = C(!1), p = () => a.current * (1 - d.current.context.detents[d.current.context.value]), m = () => t.current?.open ? p() : a.current, h = v((e = R) => {
+		f.current || (s.current?.stop(), d.current.reduced || !t.current?.open ? i.set(m()) : s.current = k(i, p(), e));
+	}, [i, t]), _ = v(() => {
 		let e = c.current;
-		return e ? (c.current = null, e.capture?.hasPointerCapture(e.id) && e.capture.releasePointerCapture(e.id), l.current = !0, p(), !0) : !1;
-	}, [p]);
-	y(() => {
+		return e ? (c.current = null, e.capture?.removeAttribute("data-dragging"), e.capture?.hasPointerCapture(e.id) && e.capture.releasePointerCapture(e.id), l.current = !0, h(), !0) : !1;
+	}, [h]);
+	b(() => {
 		let e = t.current, r = n.current, l = e?.ownerDocument.defaultView;
 		if (!e || !r || !l) return;
 		let u = (t) => {
 			r.style.transform = `translateY(${t}px)`, r.style.setProperty("--sheet-height", `${Math.max(0, a.current - t) + o.current}px`), e.style.setProperty("--sheet-scrim", String(Math.min(1, Math.max(0, (a.current - t) / Math.max(1, a.current)))));
 		}, d = () => {
 			let t = l.visualViewport;
-			m();
+			_();
 			let n = t?.height ?? l.innerHeight;
-			o.current = Number.parseFloat(l.getComputedStyle(r).paddingBottom) || 0, a.current = Math.max(1, n - o.current), e.style.blockSize = `${n}px`, e.style.insetBlockStart = `${t?.offsetTop ?? 0}px`, s.current?.stop(), c.current = null, i.set(f()), u(i.get());
+			o.current = Number.parseFloat(l.getComputedStyle(r).paddingBottom) || 0, a.current = Math.max(1, n - o.current), e.style.blockSize = `${n}px`, e.style.insetBlockStart = `${t?.offsetTop ?? 0}px`, f.current || (s.current?.stop(), c.current = null, i.set(m())), u(i.get());
 		};
 		d();
 		let p = i.on("change", u), h = (e) => {
-			c.current && c.current.id !== e.pointerId && m();
+			c.current && c.current.id !== e.pointerId && _();
 		};
 		return l.addEventListener("pointerdown", h, !0), l.addEventListener("resize", d), l.visualViewport?.addEventListener("resize", d), l.visualViewport?.addEventListener("scroll", d), () => {
 			p(), s.current?.stop();
 			let e = c.current;
-			c.current = null, e?.capture?.hasPointerCapture(e.id) && e.capture.releasePointerCapture(e.id), l.removeEventListener("pointerdown", h, !0), l.removeEventListener("resize", d), l.visualViewport?.removeEventListener("resize", d), l.visualViewport?.removeEventListener("scroll", d);
+			c.current = null, e?.capture?.removeAttribute("data-dragging"), e?.capture?.hasPointerCapture(e.id) && e.capture.releasePointerCapture(e.id), l.removeEventListener("pointerdown", h, !0), l.removeEventListener("resize", d), l.visualViewport?.removeEventListener("resize", d), l.visualViewport?.removeEventListener("scroll", d);
 		};
 	}, [
 		t,
 		i,
-		m
-	]), y(() => {
-		m(), p();
+		_
+	]), b(() => {
+		_(), h();
 	}, [
 		e.value,
-		e.open,
-		p,
+		h,
 		u,
-		m
+		_
 	]);
-	let h = (e, t, n, r = null) => {
-		s.current?.stop(), l.current = !1, c.current = {
+	let y = S(() => ({
+		enter: () => {
+			f.current = !1, h(g);
+		},
+		exit: () => {
+			if (_(), !d.current.reduced) return f.current = !0, s.current?.stop(), s.current = k(i, a.current, g), s.current.finished;
+		}
+	}), [
+		h,
+		_,
+		i
+	]), x = v(() => {
+		f.current = !1, s.current?.stop(), s.current = null, i.set(a.current);
+	}, [i]), w = (e, t, n, r = null) => {
+		f.current || (s.current?.stop(), l.current = !1, r?.setAttribute("data-dragging", ""), c.current = {
 			id: e,
 			start: t,
 			origin: i.get(),
@@ -310,35 +325,35 @@ function pe(e, t) {
 			}],
 			moved: !1,
 			capture: r
-		};
-	}, g = (e, t) => {
+		});
+	}, T = (e, t) => {
 		let n = c.current;
 		if (!n) return;
 		let r = e - n.start;
-		n.moved ||= Math.abs(r) > H;
+		n.moved ||= Math.abs(r) > U;
 		let o = n.origin + r, s = a.current * (1 - d.current.context.detents.at(-1)), l = s - o;
-		i.set(o < s ? d.current.reduced ? s : s - V * l / (V + l) : o), n.samples = [...n.samples, {
+		i.set(o < s ? d.current.reduced ? s : s - H * l / (H + l) : o), n.samples = [...n.samples, {
 			position: e,
 			time: t
-		}].filter((e) => t - e.time <= B);
-	}, v = (e, t) => {
+		}].filter((e) => t - e.time <= V);
+	}, E = (e, t) => {
 		let n = c.current;
 		if (!n) return;
-		c.current = null, l.current = n.moved;
+		c.current = null, n.capture?.removeAttribute("data-dragging"), l.current = n.moved;
 		let r = [...n.samples, {
 			position: e,
 			time: t
-		}].filter((e) => t - e.time <= B)[0], o = r ? (t - r.time) / 1e3 : 0, s = r && o > 0 ? (e - r.position) / o : 0, u = i.get() + s * z, { detents: f, requestClose: m, requestValue: h } = d.current.context, g = a.current * f[0], _ = a.current - g / 2;
-		n.moved && (u > _ || s >= ee && i.get() > a.current * (1 - f[0])) ? m() : n.moved && h(f.reduce((e, t, n) => Math.abs(a.current * (1 - t) - u) < Math.abs(a.current * (1 - f[e]) - u) ? n : e, 0)), p();
+		}].filter((e) => t - e.time <= V)[0], o = r ? (t - r.time) / 1e3 : 0, s = r && o > 0 ? (e - r.position) / o : 0, u = i.get() + s * z, { detents: f, requestClose: p, requestValue: m } = d.current.context, g = a.current * f[0], _ = a.current - g / 2;
+		n.moved && (u > _ || s >= B && i.get() > a.current * (1 - f[0])) ? p() : n.moved && m(f.reduce((e, t, n) => Math.abs(a.current * (1 - t) - u) < Math.abs(a.current * (1 - f[e]) - u) ? n : e, 0)), h();
 	};
-	return y(() => {
+	return b(() => {
 		let e = r.current, t = e?.ownerDocument.defaultView;
 		if (!e || !t) return;
 		let n = null, i = !1, a = () => {
 			e.removeEventListener("touchmove", o), i = !1;
 		}, o = (t) => {
 			if (!n || t.touches.length !== 1) {
-				m(), a();
+				_(), a();
 				return;
 			}
 			let r = t.touches[0], i = r.clientX - n.x, o = r.clientY - n.y;
@@ -346,20 +361,20 @@ function pe(e, t) {
 				a(), n = null;
 				return;
 			}
-			if (Math.abs(o) < H) return;
+			if (Math.abs(o) < U) return;
 			if (c.current) {
-				t.cancelable && t.preventDefault(), g(r.clientY, t.timeStamp);
+				t.cancelable && t.preventDefault(), T(r.clientY, t.timeStamp);
 				return;
 			}
 			let s = d.current.context;
-			s.value < s.detents.length - 1 ? (s.requestValue(s.detents.length - 1), a()) : o > 0 && e.scrollTop <= 0 && (h(n.id, n.y, t.timeStamp), t.cancelable && t.preventDefault(), g(r.clientY, t.timeStamp));
+			s.value < s.detents.length - 1 ? (s.requestValue(s.detents.length - 1), a()) : o > 0 && e.scrollTop <= 0 && (w(n.id, n.y, t.timeStamp), t.cancelable && t.preventDefault(), T(r.clientY, t.timeStamp));
 		}, s = (r) => {
 			if (a(), r.touches.length !== 1) {
-				m();
+				_();
 				return;
 			}
 			let s = r.target;
-			if (s.closest(te) || t.getSelection()?.toString()) return;
+			if (s.closest(ne) || t.getSelection()?.toString()) return;
 			for (let n = s; n && n !== e; n = n.parentElement) {
 				let e = t.getComputedStyle(n);
 				if (n.scrollWidth > n.clientWidth && /auto|scroll/.test(e.overflowX) || n.scrollHeight > n.clientHeight && /auto|scroll/.test(e.overflowY)) return;
@@ -373,98 +388,102 @@ function pe(e, t) {
 			}, e.addEventListener("touchmove", o, { passive: !1 }), i = !0;
 		}, l = (e) => {
 			let t = e.changedTouches[0];
-			c.current && t && v(t.clientY, e.timeStamp), a(), n = null;
+			c.current && t && E(t.clientY, e.timeStamp), a(), n = null;
 		}, u = () => {
-			m(), a(), n = null;
+			_(), a(), n = null;
 		};
 		return e.addEventListener("touchstart", s, { passive: !0 }), e.addEventListener("touchend", l), e.addEventListener("touchcancel", u), () => {
 			i && a(), e.removeEventListener("touchstart", s), e.removeEventListener("touchend", l), e.removeEventListener("touchcancel", u);
 		};
-	}, [m]), {
+	}, [_]), {
 		panelRef: n,
 		bodyRef: r,
 		gesture: {
 			onPointerDown: (e) => {
-				c.current || !e.isPrimary ? m() : e.button !== 0 || e.defaultPrevented || e.target.closest(U) || (h(e.pointerId, e.clientY, e.timeStamp, e.currentTarget), e.currentTarget.setPointerCapture?.(e.pointerId));
+				c.current || !e.isPrimary ? _() : e.button !== 0 || e.defaultPrevented || e.target.closest(te) || (w(e.pointerId, e.clientY, e.timeStamp, e.currentTarget), e.currentTarget.setPointerCapture?.(e.pointerId));
 			},
 			onPointerMove: (e) => {
-				c.current?.id === e.pointerId && g(e.clientY, e.timeStamp);
+				c.current?.id === e.pointerId && T(e.clientY, e.timeStamp);
 			},
 			onPointerUp: (e) => {
-				c.current?.id === e.pointerId && (v(e.clientY, e.timeStamp), e.currentTarget.hasPointerCapture?.(e.pointerId) && e.currentTarget.releasePointerCapture(e.pointerId));
+				c.current?.id === e.pointerId && (E(e.clientY, e.timeStamp), e.currentTarget.hasPointerCapture?.(e.pointerId) && e.currentTarget.releasePointerCapture(e.pointerId));
 			},
 			onPointerCancel: (e) => {
-				c.current?.id === e.pointerId && m();
+				c.current?.id === e.pointerId && _();
 			},
 			onLostPointerCapture: (e) => {
-				c.current?.id === e.pointerId && m();
+				c.current?.id === e.pointerId && _();
 			}
 		},
-		cancelDrag: m,
-		suppressClick: l
+		cancelDrag: _,
+		suppressClick: l,
+		transition: y,
+		reset: x
 	};
 }
-function Z({ ref: e, sx: n, className: r, ...i }) {
-	let { children: a, withDescription: o = !0, onCancel: s, onClose: c, onClick: l, onKeyDownCapture: u, onPointerDownCapture: d, "aria-labelledby": f, "aria-describedby": p, ...g } = h(i), _ = J("Content"), v = S(null), b = pe(_, v), x = O(), w = S(!1), D = m(_, {
+function Z({ ref: e, sx: t, className: n, ...r }) {
+	let { children: a, withDescription: o = !0, onCancel: s, onClose: c, onClick: l, onKeyDownCapture: u, onPointerDownCapture: d, "aria-labelledby": f, "aria-describedby": p, ...g } = h(r), _ = J("Content"), v = C(null), y = me(_, v), x = N(), S = C(!1), T = m(_, {
 		onCancel: s,
 		onClick: (e) => {
-			l?.(e), w.current && (w.current = !1, e.preventDefault());
+			l?.(e), S.current && (S.current = !1, e.preventDefault());
 		},
-		onClose: c
-	}, e, v), k = A([D.ref, _.floating.refs.setFloating]), M = S(_.value), [N, P] = C("");
-	y(() => {
-		M.current !== _.value && (M.current = _.value, P(_.valueText));
+		onClose: (e) => {
+			y.reset(), c?.(e);
+		}
+	}, e, v, y.transition), O = F([T.ref, _.floating.refs.setFloating]), k = C(_.value), [A, j] = w("");
+	b(() => {
+		k.current !== _.value && (k.current = _.value, j(_.valueText));
 	}, [_.value, _.valueText]);
-	let F = {
+	let M = {
 		...g,
-		...D,
+		...T,
 		onCancel: (e) => {
-			e.target === v.current ? D.onCancel(e) : s?.(e);
+			e.target === v.current ? T.onCancel(e) : s?.(e);
 		},
 		onClose: (e) => {
-			e.target === v.current ? D.onClose(e) : c?.(e);
+			e.target === v.current ? T.onClose(e) : c?.(e);
 		},
 		onPointerDownCapture: (e) => {
 			d?.(e);
-			let t = x && j(x.nodesRef.current, _.floating.context.nodeId);
-			w.current = !!(t && t.id !== _.floating.context.nodeId);
+			let t = x && I(x.nodesRef.current, _.floating.context.nodeId);
+			S.current = !!(t && t.id !== _.floating.context.nodeId);
 		},
 		onKeyDownCapture: (e) => {
 			if (u?.(e), e.key !== "Escape" || e.defaultPrevented || e.nativeEvent.isComposing) return;
 			e.preventDefault();
-			let t = x && j(x.nodesRef.current, _.floating.context.nodeId);
-			(!t || t.id === _.floating.context.nodeId) && b.cancelDrag() && e.stopPropagation();
+			let t = x && I(x.nodesRef.current, _.floating.context.nodeId);
+			(!t || t.id === _.floating.context.nodeId) && y.cancelDrag() && e.stopPropagation();
 		}
-	}, I = _.interactions.getFloatingProps(F);
-	return /* @__PURE__ */ T(t, {
-		className: r,
-		styles: ne,
-		sx: n,
-		children: (e) => /* @__PURE__ */ E("dialog", {
-			...I,
-			ref: k,
+	}, P = _.interactions.getFloatingProps(M);
+	return /* @__PURE__ */ E(i, {
+		className: n,
+		styles: re,
+		sx: t,
+		children: (e) => /* @__PURE__ */ D("dialog", {
+			...P,
+			ref: O,
 			className: e,
 			"data-ui": "bottom-sheet",
 			"aria-modal": "true",
 			"aria-labelledby": [f, _.hasTitle && _.titleId].filter(Boolean).join(" ") || void 0,
 			"aria-describedby": [p, o && _.hasDescription && _.descriptionId].filter(Boolean).join(" ") || void 0,
 			children: [
-				/* @__PURE__ */ T("div", {
-					css: re,
+				/* @__PURE__ */ E("div", {
+					css: ie,
 					"aria-hidden": "true"
 				}),
-				/* @__PURE__ */ T(q.Provider, {
-					value: b,
+				/* @__PURE__ */ E(q.Provider, {
+					value: y,
 					children: a
 				}),
-				/* @__PURE__ */ T("span", {
+				/* @__PURE__ */ E("span", {
 					css: G,
 					role: "status",
 					"aria-live": "polite",
 					"aria-atomic": "true",
-					children: N
+					children: A
 				}),
-				/* @__PURE__ */ T("span", {
+				/* @__PURE__ */ E("span", {
 					css: G,
 					id: _.valueTextId,
 					children: _.valueText
@@ -474,19 +493,19 @@ function Z({ ref: e, sx: n, className: r, ...i }) {
 	});
 }
 Z.displayName = "BottomSheet.Content";
-function Q({ ref: e, sx: n, className: r, autoFocus: i = !0, ...a }) {
-	let o = J("Panel"), s = v(q), c = _((e) => {
-		i && e && !e.querySelector("[autofocus]") && e.setAttribute("autofocus", "");
-	}, [i]), l = A([
+function Q({ ref: e, sx: t, className: n, autoFocus: r = !0, ...a }) {
+	let o = J("Panel"), s = y(q), c = v((e) => {
+		r && e && !e.querySelector("[autofocus]") && e.setAttribute("autofocus", "");
+	}, [r]), l = F([
 		e,
 		s?.panelRef,
 		c
 	]);
-	return /* @__PURE__ */ T(t, {
-		className: r,
-		styles: ie,
-		sx: n,
-		children: (e) => /* @__PURE__ */ T("div", {
+	return /* @__PURE__ */ E(i, {
+		className: n,
+		styles: ae,
+		sx: t,
+		children: (e) => /* @__PURE__ */ E("div", {
 			tabIndex: -1,
 			...a,
 			ref: l,
@@ -497,17 +516,17 @@ function Q({ ref: e, sx: n, className: r, autoFocus: i = !0, ...a }) {
 	});
 }
 Q.displayName = "BottomSheet.Panel";
-function $({ ref: e, sx: n, className: r, ...i }) {
+function $({ ref: e, sx: t, className: n, ...r }) {
 	J("Header");
-	let a = v(q), o = Object.fromEntries(Object.entries(a?.gesture ?? {}).map(([e, t]) => [e, (n) => {
-		i[e]?.(n), n.defaultPrevented || t?.(n);
+	let a = y(q), o = Object.fromEntries(Object.entries(a?.gesture ?? {}).map(([e, t]) => [e, (n) => {
+		r[e]?.(n), n.defaultPrevented || t?.(n);
 	}]));
-	return /* @__PURE__ */ T(t, {
-		className: r,
-		styles: ae,
-		sx: n,
-		children: (t) => /* @__PURE__ */ T("div", {
-			...i,
+	return /* @__PURE__ */ E(i, {
+		className: n,
+		styles: oe,
+		sx: t,
+		children: (t) => /* @__PURE__ */ E("div", {
+			...r,
 			...o,
 			ref: e,
 			"data-ui": "bottom-sheet-header",
@@ -516,22 +535,22 @@ function $({ ref: e, sx: n, className: r, ...i }) {
 	});
 }
 $.displayName = "BottomSheet.Header";
-function me({ ref: e, sx: n, className: r, onKeyDown: i, onFocusCapture: a, ...o }) {
-	let s = J("Body"), c = v(q), l = A([e, c?.bodyRef]), u = S(null);
-	return y(() => () => {
+function he({ ref: e, sx: t, className: n, onKeyDown: r, onFocusCapture: a, ...o }) {
+	let s = J("Body"), c = y(q), l = F([e, c?.bodyRef]), u = C(null);
+	return b(() => () => {
 		let e = u.current;
 		e && e.window.cancelAnimationFrame(e.id);
-	}, []), /* @__PURE__ */ T(t, {
-		className: r,
-		styles: oe,
-		sx: n,
-		children: (e) => /* @__PURE__ */ T("div", {
+	}, []), /* @__PURE__ */ E(i, {
+		className: n,
+		styles: se,
+		sx: t,
+		children: (e) => /* @__PURE__ */ E("div", {
 			...o,
 			ref: l,
 			"data-ui": "bottom-sheet-body",
 			className: e,
 			onKeyDown: (e) => {
-				i?.(e), !e.defaultPrevented && e.target === e.currentTarget && (e.key === "PageDown" || e.key === " " && !e.shiftKey) && s.value < s.detents.length - 1 && (e.preventDefault(), s.requestValue(s.detents.length - 1));
+				r?.(e), !e.defaultPrevented && e.target === e.currentTarget && (e.key === "PageDown" || e.key === " " && !e.shiftKey) && s.value < s.detents.length - 1 && (e.preventDefault(), s.requestValue(s.detents.length - 1));
 			},
 			onFocusCapture: (e) => {
 				if (a?.(e), e.defaultPrevented || e.target === e.currentTarget) return;
@@ -551,66 +570,66 @@ function me({ ref: e, sx: n, className: r, onKeyDown: i, onFocusCapture: a, ...o
 		})
 	});
 }
-me.displayName = "BottomSheet.Body";
-function he({ ref: e, sx: n, className: r, ...i }) {
-	return J("Footer"), /* @__PURE__ */ T(t, {
-		className: r,
-		styles: se,
-		sx: n,
-		children: (t) => /* @__PURE__ */ T("div", {
-			...i,
+he.displayName = "BottomSheet.Body";
+function ge({ ref: e, sx: t, className: n, ...r }) {
+	return J("Footer"), /* @__PURE__ */ E(i, {
+		className: n,
+		styles: ce,
+		sx: t,
+		children: (t) => /* @__PURE__ */ E("div", {
+			...r,
 			ref: e,
 			"data-ui": "bottom-sheet-footer",
 			className: t
 		})
 	});
 }
-he.displayName = "BottomSheet.Footer";
-function ge({ ref: e, sx: n, className: r, children: i, ...a }) {
-	let { titleId: o, setHasTitle: c } = J("Title"), l = s(i) && i !== "";
-	return y(() => {
+ge.displayName = "BottomSheet.Footer";
+function _e({ ref: e, sx: t, className: n, children: r, ...a }) {
+	let { titleId: o, setHasTitle: c } = J("Title"), l = s(r) && r !== "";
+	return b(() => {
 		if (l) return c(!0), () => c(!1);
-	}, [l, c]), l ? /* @__PURE__ */ T(t, {
-		className: r,
-		styles: ce,
-		sx: n,
-		children: (t) => /* @__PURE__ */ T("h2", {
+	}, [l, c]), l ? /* @__PURE__ */ E(i, {
+		className: n,
+		styles: le,
+		sx: t,
+		children: (t) => /* @__PURE__ */ E("h2", {
 			...a,
 			ref: e,
 			id: o,
 			"data-ui": "bottom-sheet-title",
 			className: t,
-			children: i
+			children: r
 		})
 	}) : null;
 }
-ge.displayName = "BottomSheet.Title";
-function _e({ ref: e, sx: n, className: r, children: i, ...a }) {
-	let { descriptionId: o, setHasDescription: c } = J("Description"), l = s(i) && i !== "";
-	return y(() => {
+_e.displayName = "BottomSheet.Title";
+function ve({ ref: e, sx: t, className: n, children: r, ...a }) {
+	let { descriptionId: o, setHasDescription: c } = J("Description"), l = s(r) && r !== "";
+	return b(() => {
 		if (l) return c(!0), () => c(!1);
-	}, [l, c]), l ? /* @__PURE__ */ T(t, {
-		className: r,
-		styles: le,
-		sx: n,
-		children: (t) => /* @__PURE__ */ T("p", {
+	}, [l, c]), l ? /* @__PURE__ */ E(i, {
+		className: n,
+		styles: ue,
+		sx: t,
+		children: (t) => /* @__PURE__ */ E("p", {
 			...a,
 			ref: e,
 			id: o,
 			"data-ui": "bottom-sheet-description",
 			className: t,
-			children: i
+			children: r
 		})
 	}) : null;
 }
-_e.displayName = "BottomSheet.Description";
-function ve({ ref: e, sx: n, className: r, onClick: i, onKeyDown: a, "aria-describedby": o, ...s }) {
-	let c = J("Handle"), l = v(q), u = c.detents.length - 1;
-	return /* @__PURE__ */ T(t, {
-		className: r,
-		styles: [W, ue],
-		sx: n,
-		children: (t) => /* @__PURE__ */ T("button", {
+ve.displayName = "BottomSheet.Description";
+function ye({ ref: e, sx: t, className: n, onClick: r, onKeyDown: a, "aria-describedby": o, ...s }) {
+	let c = J("Handle"), l = y(q), u = c.detents.length - 1;
+	return /* @__PURE__ */ E(i, {
+		className: n,
+		styles: [W, de],
+		sx: t,
+		children: (t) => /* @__PURE__ */ E("button", {
 			type: "button",
 			...s,
 			ref: e,
@@ -621,7 +640,7 @@ function ve({ ref: e, sx: n, className: r, onClick: i, onKeyDown: a, "aria-descr
 			"aria-expanded": c.value === u,
 			"aria-describedby": [o, c.valueTextId].filter(Boolean).join(" "),
 			onClick: (e) => {
-				i?.(e), l?.suppressClick.current ? l.suppressClick.current = !1 : e.defaultPrevented || c.requestValue(c.value === u ? 0 : u);
+				r?.(e), l?.suppressClick.current ? l.suppressClick.current = !1 : e.defaultPrevented || c.requestValue(c.value === u ? 0 : u);
 			},
 			onKeyDown: (e) => {
 				if (a?.(e), e.defaultPrevented) return;
@@ -637,37 +656,37 @@ function ve({ ref: e, sx: n, className: r, onClick: i, onKeyDown: a, "aria-descr
 		})
 	});
 }
-ve.displayName = "BottomSheet.Handle";
-function ye({ ref: e, sx: n, className: r, onClick: i, ...a }) {
+ye.displayName = "BottomSheet.Handle";
+function be({ ref: e, sx: t, className: n, onClick: r, ...a }) {
 	let o = J("Close");
-	return /* @__PURE__ */ T(t, {
-		className: r,
+	return /* @__PURE__ */ E(i, {
+		className: n,
 		styles: W,
-		sx: n,
-		children: (t) => /* @__PURE__ */ T("button", {
+		sx: t,
+		children: (t) => /* @__PURE__ */ E("button", {
 			type: "button",
 			...a,
 			ref: e,
 			"data-ui": "bottom-sheet-close",
 			className: t,
 			onClick: (e) => {
-				i?.(e), e.defaultPrevented || o.requestClose();
+				r?.(e), e.defaultPrevented || o.requestClose();
 			}
 		})
 	});
 }
-ye.displayName = "BottomSheet.Close";
-var be = Object.assign(Y, {
+be.displayName = "BottomSheet.Close";
+var xe = Object.assign(Y, {
 	Trigger: X,
 	Content: Z,
 	Panel: Q,
 	Header: $,
-	Body: me,
-	Footer: he,
-	Title: ge,
-	Description: _e,
-	Handle: ve,
-	Close: ye
+	Body: he,
+	Footer: ge,
+	Title: _e,
+	Description: ve,
+	Handle: ye,
+	Close: be
 });
 //#endregion
-export { be as t };
+export { xe as t };