beez-ui 3.0.0 → 4.0.0

package/CHANGELOG.md

@@ -4,6 +4,38 @@ Todos los cambios relevantes de beez-ui se documentan en este archivo con el for
 
 ## [Unreleased]
 
+## [4.0.0] - 2026-10-18
+
+### Changed
+
+- El movimiento de todos los componentes queda alineado únicamente con Arc: se quitan las entradas al montar de `Card`, `Badge`, `Separator`, las filas de `Table`, `Alert` estático y la raíz de `Avatar`; el hover de `Link` y del ícono de WhatsApp; la reacción al foco de `Input`, `Textarea`, `InputGroup`, `Label` y el trigger de `Select`; el pop demorado de los botones de cierre de `Dialog` y `Sheet`; el pop de los íconos de las toasts; la presión de los ítems de `Sidebar` y del avatar de `AccountMenu`; y el giro del botón de `AnimatedThemeToggler`.
+- `DropdownMenu` entra y sale y `Select` entra en cada apertura como en Arc (escala y desplazamiento desde el trigger) en lugar de revelarse con un clip; las opciones de `Select` ya no se animan por separado y su check, igual que el de los ítems con check de `DropdownMenu`, aparece desde 0.6 con un desenfoque breve.
+- El resaltado de `DropdownMenu` se desliza con el puntero y salta al instante con el teclado, como en Arc; `Select` y las sugerencias de `FilterQueryBar` ya no tienen resaltado deslizante.
+- `Sidebar` sigue al sidebar rail de Arc: el hover solo cambia el color (sin la píldora compartida con desenfoque), los submenús abren su altura con el spring `smooth` sin escalonar ítems, las etiquetas se desplazan 6 px y la hoja móvil se desliza con `smooth`.
+- `Sheet` sale con la curva estándar y se desvanece al final, como el drawer de Arc; `Card` interactiva suma el borde fuerte y la sombra `--shadow-raised` de Arc a su elevación de hover en lugar de la sombra animada anterior.
+- `FormMessage` aparece subiendo desde un desenfoque; la foto de `Avatar` aparece desde un desenfoque de 4 px sin zoom; el ícono de `AnimatedThemeToggler` crece desde 0.7 con un desenfoque breve; `ReactionButton` usa el impulso de las reacciones de Arc.
+- `AnimatedCollapse` abre y cierra su altura con el spring `smooth`, `PresenceSwap` usa el swap de Arc (sube 0.3 em desde un desenfoque) y `AnimatedListItem` entra 4 px desde un desenfoque leve sin escala y se reordena con `smooth`.
+- `MOTION_TIMING.checkDraw` pasa a 0.24 s y `MOTION_LIST_STAGGER_LIMIT` a 4, los valores de Arc.
+
+### Deprecated
+
+- La prop `duration` de `AnimatedThemeToggler` se ignora: el botón ya no gira al cambiar el tema.
+
+### Removed
+
+- Se quitan los tokens de movimiento que no son de Arc: `MOTION_EASE_DRAWER`, `MOTION_EASE_UNFOLD`, `SPRING_HIGHLIGHT`, `SPRING_TABS`, `SPRING_TOOLTIP`, `SPRING_THUMB`, `MOTION_SUBTLE_PRESS_SCALE`, `MOTION_TOGGLE_PRESS_SCALE`, `MOTION_HOVER_SCALE`, `MOTION_THUMB_SQUISH_SCALE`, `MOTION_ITEM_CHECK_SCALE`, `MOTION_ICON_SWAP_SCALE`, `MOTION_CLOSE_BUTTON_SCALE`, `MOTION_LIST_ITEM_DISTANCE`, `MOTION_ITEM_ENTER_SCALE`, `MOTION_REVEAL_SCALE`, `MOTION_REVEAL_BLUR_PX`, `MOTION_SHIMMER_TRANSLATE`, `MOTION_CARD_SHADOW_LIFT`, `MOTION_CARD_SHADOW_REST`, `MOTION_SURFACE_CLIP_PERCENT`, `MOTION_SURFACE_CLIP_BLEED_PX`, `MOTION_TOOLTIP_DISTANCE`, `MOTION_TOOLTIP_SCALE`, `MOTION_CENTER_MORPH_FOLDED_PERCENT`, `MOTION_CONTENT_DISTANCE` y `MOTION_INVALID_SHAKE_PX`.
+- `MOTION_TIMING` pierde `message`, `surfaceClip`, `shake`, `checkDrawDelay`, `iconSwap`, `listItem`, `listDelay`, `closeEnter`, `closeDelay`, `centerMorph`, `centerMorphFold`, `reveal`, `pop`, `collapse`, `monthSwap` y `skeleton`, y `MotionKind` queda con los tipos que usa la biblioteca (`rotate`, `item-check`, `icon-swap`, `message`, `reveal`, `dialog`, `sheet` y `overlay`).
+
+### Fixed
+
+- Los submenús de `Sidebar` recortan su contenido solo mientras abren o cierran: una vez abiertos, el anillo de foco de sus ítems se ve completo.
+
+## [3.0.1] - 2026-10-16
+
+### Fixed
+
+- Las fotos de `Avatar`, `AvatarGroup` y `AccountMenu` se piden sin `Referer` (`referrerPolicy="no-referrer"`), así cargan las fotos de perfil de Google que antes se rechazaban y quedaban las iniciales.
+
 ## [3.0.0] - 2026-10-16
 
 ### Added

package/README.md

@@ -110,64 +110,62 @@ keyframes CSS para estas animaciones.
 
 `MotionSlot` anima el nodo original del primitive mediante refs compuestos,
 sin agregar wrappers al DOM ni reemplazar sus handlers. Los tokens exportados en
-`beez-ui/motion-tokens` toman los valores de los presets de Arc
+`beez-ui/motion-tokens` son únicamente los presets de Arc
 (`components/arc/lib/motion-tokens.ts`):
 
 - Springs: `snappy` (0.26 s, rebote 0.12) para presiones, indicadores chicos y cambios de
-  ícono (`SPRING_PRESS`, `SPRING_POP`, `SPRING_CHEVRON`, `SPRING_HIGHLIGHT`, `SPRING_TOOLTIP`);
-  `smooth` (0.4 s, sin rebote) para paneles y todo lo que informa un estado
-  (`SPRING_PANEL`, `SPRING_THUMB`); `morph` (0.42 s, rebote 0.16) para resaltados compartidos
-  (`SPRING_LAYOUT`, `SPRING_TABS`).
+  ícono (`SPRING_PRESS`, `SPRING_POP`, `SPRING_CHEVRON`); `smooth` (0.4 s, sin rebote) para
+  paneles, alturas y todo lo que informa un estado (`SPRING_PANEL`); `morph` (0.42 s, rebote
+  0.16) para resaltados compartidos (`SPRING_LAYOUT`).
 - Duraciones: `instant` 0.12 s, `fast` 0.16 s, `exit` 0.18 s, `enter`/`standard` 0.24 s y
   `considered` 0.48 s. Las salidas son más cortas que las entradas.
 - Curvas: `MOTION_EASE` (entrada), `MOTION_EASE_EXIT`, `MOTION_EASE_STANDARD` y
   `MOTION_EASE_IN_OUT`.
 
-Los nombres de los tokens se mantienen entre versiones; los del despliegue desde el centro
-y del temblor de campos inválidos quedan deprecados y conservan su valor.
-
-- `Button` usa la presión de Arc: se comprime a 0.97 con el spring `snappy` (un poco más en
-  botones de solo ícono y menos en los anchos), sin escalar los disparadores de menús; su
-  texto cambia de ancho con un spring. Los ítems de `Sidebar` y `Tabs` se comprimen a 0.98.
-- `Checkbox` y `RadioGroup` se comprimen a 0.92. La marca del checkbox aparece
-  con pop y trazo (`pathLength`); el punto del radio aparece con spring.
-- El thumb de `Switch` viaja con el spring `smooth`, sin rebote, y se aplasta mientras se presiona.
-- `Input`, `Textarea`, `InputGroup` y el trigger de `Select` no se mueven al pasar a
-  `aria-invalid="true"`: el error se indica con el color y el mensaje. `FormMessage` y
-  `Alert` aparecen con un fundido y una escala breves (desde 0.98), sin desenfoque.
-- `Tooltip` sube 3 px desde 0.97 mientras aparece y sale en el lugar, sin desenfoque.
-  `Popover` y `HoverCard` se acercan desde su trigger con escala y fundido; `DropdownMenu`
-  y `Select` escalan desde 0.96 y se revelan con un clip desde la esquina más cercana al trigger.
+Ningún componente agrega movimiento que Arc no tenga: no hay entradas al montar en cards,
+badges, separadores, filas de tabla ni alertas estáticas; no hay hovers con escala,
+rotación u opacidad en enlaces e íconos; los campos no reaccionan al foco con movimiento y
+no tiemblan al pasar a `aria-invalid="true"`.
+
+- `Button`, `ControlButton` y los pasos de `Pagination` usan la presión de Arc: se comprimen
+  a 0.97 (un poco más los de solo ícono y menos los anchos) y vuelven con `snappy`; los
+  disparadores de menús, popovers y diálogos responden solo con color.
+- `Checkbox`, `RadioGroup`, `Switch`, `Tabs`, `Calendar`, `Carousel`, `Card`, `Avatar`,
+  `AvatarGroup`, `Badge`, `Alert`, `ActionButton` y `SplitButton` usan el movimiento de sus
+  componentes de Arc.
+- Una `Card` interactiva se eleva 2 px con el borde fuerte y la sombra `--shadow-raised` de
+  Arc al pasar un puntero fino.
+- `Tooltip`, `Popover` y `HoverCard` se acercan desde su trigger con escala y fundido.
+  `DropdownMenu` crece 5 px desde su trigger y desde 0.97 con el spring de Arc y sale en
+  130 ms; sus ítems entran escalonados. `Select` crece 6 px desde 0.97 en 0.24 s; sus
+  opciones no se animan por separado y el check de la opción elegida aparece desde 0.6 con
+  un desenfoque breve, igual que el de los ítems con check de `DropdownMenu`.
 - `Dialog`, también en su modo `alert`, entra como el diálogo de Arc: el fondo se oscurece en 0.24 s y el
   panel sube 8 px y crece desde 0.96 con el spring `smooth` mientras aparece en 0.16 s; al
   cerrar baja 4 px hasta 0.98 y se desvanece en 0.16 s, y una reapertura parte de donde
-  está. `Sheet` entra desde su borde con spring y sale con la curva de cajón (0.24 s), sin
-  demorar la siguiente interacción.
-- `GlideSlot` desliza el indicador activo entre ítems como un `layoutId` compartido:
-  la pestaña activa de `Tabs`, la
-  página actual de `Pagination`, y al navegar con teclado el ítem resaltado de
-  `DropdownMenu` y `Select` y la sugerencia activa de `FilterQueryBar`. Con el puntero,
-  esos resaltados lo siguen al instante: el propio puntero ya marca la posición.
-- Las superficies que se revelan con clip dejan 24 px libres fuera de la
-  caja, así su borde (`ring`) y su sombra se ven desde el primer frame. Una copia
-  transitoria viaja entre ítems y se elimina al llegar, devolviendo el estilo al ítem.
-- El chevron del trigger de `Select` gira 180° al abrir y los chevrons de `DataTable`
-  (grupos y columnas) giran en lugar de cambiar de ícono; CSS define el ángulo final.
-- Las opciones del `Select` entran todas juntas con un fundido y una escala breves, sin
-  escalonarse ni desenfocarse, y los checks de ítems de `Select` y `DropdownMenu` aparecen con pop.
-- El ancho de `Sidebar` cambia con el spring `smooth` entre el panel y el riel de íconos, las
-  etiquetas se desvanecen al colapsar, una píldora compartida sigue al ítem activo y al
-  hovereado, los submenús se despliegan escalonados y en pantallas chicas se abre como hoja
-  con foco atrapado.
-- El ícono de `AnimatedThemeToggler` crece desde 0.6 con el spring `snappy` mientras aparece,
-  sin desenfoque; el botón de cierre de `Dialog` aparece con un pop demorado.
-- El contenido de `Tabs` entra con un desplazamiento de 4 px.
-  Cards y enlaces responden al hover; el avatar bajo el puntero de un `AvatarGroup` se
-  eleva. Un brillo recorre el `Skeleton` desde su `::after` con reproducción nativa,
-  sin trabajo por frame en JavaScript.
-- `Calendar` desliza el mes entrante desde el lado de la navegación (invertido en RTL).
-- La foto de `Avatar` se revela con blur y un zoom de 1.06 al terminar de cargar; las imágenes
-  ya cargadas al montar no se animan.
+  está. `Sheet` entra desde su borde con `smooth` y sale en 0.24 s con la curva estándar,
+  desvaneciéndose al final como el drawer de Arc. Los botones de cierre no tienen animación
+  de entrada.
+- `GlideSlot` desliza el indicador activo entre ítems como un `layoutId` compartido: la
+  pestaña activa de `Tabs`, la página actual de `Pagination` y el resaltado de `DropdownMenu`,
+  que se desliza con el puntero y salta al instante con el teclado. `Select` y las
+  sugerencias de `FilterQueryBar` no tienen resaltado deslizante.
+- El chevron del trigger de `Select` gira 180° con el spring CSS de Arc y los chevrons de
+  `DataTable` (grupos y columnas) giran con `snappy`; CSS define el ángulo final.
+- `FormMessage` sube un tercio de línea desde un desenfoque al aparecer, como las filas de
+  ayuda y error de Arc.
+- El ancho de `Sidebar` cambia con `smooth` entre el panel y el riel de íconos, las
+  etiquetas se desvanecen y se desplazan 6 px al colapsar, el resaltado del ítem activo se
+  desliza con `morph`, el hover solo cambia el color, los submenús abren su altura con
+  `smooth` y en pantallas chicas se abre como hoja con foco atrapado.
+- El ícono de `AnimatedThemeToggler` crece desde 0.7 desde un desenfoque con `snappy`; el
+  botón no gira ni se desvanece al cambiar el tema.
+- La foto de `Avatar` aparece desde un desenfoque de 4 px al terminar de cargar; las
+  imágenes ya cargadas al montar no se animan.
+- `ReactionButton` le da al ícono el impulso de las reacciones de Arc al activarse.
+- `AnimatedCollapse` abre y cierra su altura con `smooth`; `PresenceSwap` usa el swap de
+  Arc (sube 0.3 em desde un desenfoque y la versión anterior sale hacia arriba);
+  `AnimatedListItem` entra 4 px desde un desenfoque leve y se reordena con `smooth`.
 - El cursor de `TypingAnimation` queda fijo mientras escribe y parpadea en reposo. Las animaciones especializadas
   existentes de Embla, Sonner y rough-notation se conservan.
 

package/dist/components/account-menu.js

@@ -168,7 +168,7 @@ export function AccountMenu(t0) {
 	const t14 = classNames?.trigger;
 	let t15;
 	if ($[12] !== t12 || $[13] !== t13 || $[14] !== t14) {
-		t15 = cn("inline-flex items-center rounded-full outline-none [-webkit-tap-highlight-color:transparent] transition-[box-shadow,opacity,transform] hover:opacity-90 active:scale-[0.96] focus-visible:shadow-[0_0_0_2px_var(--background),0_0_0_4px_var(--ring)] data-[state=open]:shadow-[0_0_0_2px_var(--background),0_0_0_4px_var(--ring)]", t12, t13, t14);
+		t15 = cn("inline-flex items-center rounded-full outline-none [-webkit-tap-highlight-color:transparent] transition-[box-shadow,opacity] hover:opacity-90 focus-visible:shadow-[0_0_0_2px_var(--background),0_0_0_4px_var(--ring)] data-[state=open]:shadow-[0_0_0_2px_var(--background),0_0_0_4px_var(--ring)]", t12, t13, t14);
 		$[12] = t12;
 		$[13] = t13;
 		$[14] = t14;

package/dist/components/alert.js

@@ -14,7 +14,6 @@ import { usePrefersReducedMotion } from "../hooks/use-prefers-reduced-motion.js"
 import { cn } from "../lib/utils.js";
 import { ARC_BLUR, ARC_DURATION, ARC_EASE, ARC_SPRING_SMOOTH } from "../motion/arc-tokens.js";
 import { ARC_ICON_ENTER, ARC_ICON_EXIT, ARC_ICON_TRANSITION, ARC_REDUCED_EXIT, ARC_REDUCED_TRANSITION, ARC_SWAP_EXIT_TRANSITION, ARC_SWAP_REST } from "../motion/arc-swap.js";
-import { MotionSlot } from "../motion/motion-slot.js";
 import { useAttachedElement } from "../motion/use-attached-element.js";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 /** The icon each tone shows unless `icon` replaces it. */
@@ -432,12 +431,9 @@ function AlertBox(t0) {
 	}
 	let t14;
 	if ($[57] !== content || $[58] !== rootProps) {
-		t14 = /* @__PURE__ */ _jsx(MotionSlot, {
-			kind: "message",
-			children: /* @__PURE__ */ _jsx("div", {
-				...rootProps,
-				children: content
-			})
+		t14 = /* @__PURE__ */ _jsx("div", {
+			...rootProps,
+			children: content
 		});
 		$[57] = content;
 		$[58] = rootProps;

package/dist/components/animated-collapse.js

@@ -5,18 +5,24 @@ import { useState } from "react";
 import { AnimatePresence, motion, useIsPresent } from "motion/react";
 import { usePrefersReducedMotion } from "../hooks/use-prefers-reduced-motion.js";
 import { cn } from "../lib/utils.js";
-import { MOTION_EASE, MOTION_EASE_IN_OUT, MOTION_TIMING } from "../motion/tokens.js";
+import { MOTION_EASE, MOTION_EASE_STANDARD, MOTION_TIMING, SPRING_PANEL } from "../motion/tokens.js";
 import { jsx as _jsx } from "react/jsx-runtime";
+/** Arc's accordion: the height springs without overshoot while the content fades in. */
 const COLLAPSE_TRANSITION = {
-	height: {
-		duration: MOTION_TIMING.collapse,
-		ease: MOTION_EASE_IN_OUT
-	},
+	height: SPRING_PANEL,
 	opacity: {
 		duration: MOTION_TIMING.panel,
 		ease: MOTION_EASE
 	}
 };
+/** Arc's accordion closes on the same spring and fades out faster than it came in. */
+const COLLAPSE_EXIT_TRANSITION = {
+	height: SPRING_PANEL,
+	opacity: {
+		duration: MOTION_TIMING.fast,
+		ease: MOTION_EASE_STANDARD
+	}
+};
 /** Reduced motion applies the height at once but keeps the short fade, so exits always settle. */
 const REDUCED_MOTION_COLLAPSE_TRANSITION = {
 	height: { duration: 0 },
@@ -32,7 +38,7 @@ const REDUCED_MOTION_COLLAPSE_TRANSITION = {
 * @returns The animated region.
 */
 function AnimatedCollapseRegion(t0) {
-	const $ = _c(15);
+	const $ = _c(17);
 	const { children, className, id, isEntering } = t0;
 	const [isSettled, setIsSettled] = useState(!isEntering);
 	const isPresent = useIsPresent();
@@ -51,7 +57,6 @@ function AnimatedCollapseRegion(t0) {
 	}
 	let t5;
 	let t6;
-	let t7;
 	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
 		t5 = {
 			height: 0,
@@ -61,33 +66,40 @@ function AnimatedCollapseRegion(t0) {
 			height: "auto",
 			opacity: 1
 		};
-		t7 = {
-			height: 0,
-			opacity: 0
-		};
 		$[3] = t5;
 		$[4] = t6;
-		$[5] = t7;
 	} else {
 		t5 = $[3];
 		t6 = $[4];
-		t7 = $[5];
 	}
-	const t8 = shouldReduceMotion ? REDUCED_MOTION_COLLAPSE_TRANSITION : COLLAPSE_TRANSITION;
-	let t10;
-	let t9;
-	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
-		t9 = () => setIsSettled(false);
-		t10 = () => setIsSettled(true);
-		$[6] = t10;
-		$[7] = t9;
+	const t7 = shouldReduceMotion ? REDUCED_MOTION_COLLAPSE_TRANSITION : COLLAPSE_EXIT_TRANSITION;
+	let t8;
+	if ($[5] !== t7) {
+		t8 = {
+			height: 0,
+			opacity: 0,
+			transition: t7
+		};
+		$[5] = t7;
+		$[6] = t8;
 	} else {
-		t10 = $[6];
-		t9 = $[7];
+		t8 = $[6];
 	}
+	const t9 = shouldReduceMotion ? REDUCED_MOTION_COLLAPSE_TRANSITION : COLLAPSE_TRANSITION;
+	let t10;
 	let t11;
-	if ($[8] !== children || $[9] !== id || $[10] !== t1 || $[11] !== t2 || $[12] !== t4 || $[13] !== t8) {
-		t11 = /* @__PURE__ */ _jsx(motion.div, {
+	if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+		t10 = () => setIsSettled(false);
+		t11 = () => setIsSettled(true);
+		$[7] = t10;
+		$[8] = t11;
+	} else {
+		t10 = $[7];
+		t11 = $[8];
+	}
+	let t12;
+	if ($[9] !== children || $[10] !== id || $[11] !== t1 || $[12] !== t2 || $[13] !== t4 || $[14] !== t8 || $[15] !== t9) {
+		t12 = /* @__PURE__ */ _jsx(motion.div, {
 			"data-slot": "animated-collapse",
 			id,
 			"aria-hidden": t1,
@@ -95,23 +107,24 @@ function AnimatedCollapseRegion(t0) {
 			className: t4,
 			initial: t5,
 			animate: t6,
-			exit: t7,
-			transition: t8,
-			onAnimationStart: t9,
-			onAnimationComplete: t10,
+			exit: t8,
+			transition: t9,
+			onAnimationStart: t10,
+			onAnimationComplete: t11,
 			children
 		});
-		$[8] = children;
-		$[9] = id;
-		$[10] = t1;
-		$[11] = t2;
-		$[12] = t4;
-		$[13] = t8;
-		$[14] = t11;
+		$[9] = children;
+		$[10] = id;
+		$[11] = t1;
+		$[12] = t2;
+		$[13] = t4;
+		$[14] = t8;
+		$[15] = t9;
+		$[16] = t12;
 	} else {
-		t11 = $[14];
+		t12 = $[16];
 	}
-	return t11;
+	return t12;
 }
 /**
 * Renders `children` only while `isOpen`, animating height and opacity.

package/dist/components/animated-list-item.js

@@ -3,21 +3,26 @@ import { c as _c } from "react/compiler-runtime";
 import { motion, useIsPresent } from "motion/react";
 import { usePrefersReducedMotion } from "../hooks/use-prefers-reduced-motion.js";
 import { cn } from "../lib/utils.js";
-import { MOTION_EASE, MOTION_ITEM_ENTER_SCALE, MOTION_LIST_ITEM_DISTANCE, MOTION_TIMING, SPRING_LAYOUT } from "../motion/tokens.js";
+import { ARC_BLUR } from "../motion/arc-tokens.js";
+import { MOTION_EASE, MOTION_EASE_STANDARD, MOTION_TIMING, SPRING_PANEL } from "../motion/tokens.js";
 import { jsx as _jsx } from "react/jsx-runtime";
+/** Arc's rows settle 4px into place out of a subtle blur. */
+const LIST_ITEM_RISE_PX = 4;
+const LIST_ITEM_BLUR = `blur(${ARC_BLUR.subtle}px)`;
 const ANIMATED_LIST_ITEM_ELEMENTS = {
 	li: motion.li,
 	div: motion.div,
 	article: motion.article
 };
+/** Arc's rows enter on the standard tween and reorder on the smooth spring, without overshoot. */
 const LIST_ITEM_TRANSITION = {
-	duration: MOTION_TIMING.panel,
+	duration: MOTION_TIMING.standard,
 	ease: MOTION_EASE,
-	layout: SPRING_LAYOUT
+	layout: SPRING_PANEL
 };
 const LIST_ITEM_EXIT_TRANSITION = {
 	duration: MOTION_TIMING.exit,
-	ease: MOTION_EASE
+	ease: MOTION_EASE_STANDARD
 };
 /**
 * Wrap the list in `<AnimatePresence initial={false}>` so only items added after the
@@ -28,7 +33,7 @@ const LIST_ITEM_EXIT_TRANSITION = {
 * @returns The animated item.
 */
 export function AnimatedListItem(t0) {
-	const $ = _c(24);
+	const $ = _c(22);
 	let children;
 	let className;
 	let elementProps;
@@ -54,8 +59,8 @@ export function AnimatedListItem(t0) {
 	const MotionElement = ANIMATED_LIST_ITEM_ELEMENTS[as];
 	const isPresent = useIsPresent();
 	const shouldReduceMotion = usePrefersReducedMotion();
-	const distance = shouldReduceMotion ? 0 : MOTION_LIST_ITEM_DISTANCE;
-	const enterScale = shouldReduceMotion ? 1 : MOTION_ITEM_ENTER_SCALE;
+	const distance = shouldReduceMotion ? 0 : LIST_ITEM_RISE_PX;
+	const blur = shouldReduceMotion ? "blur(0px)" : LIST_ITEM_BLUR;
 	const t3 = isPresent ? elementProps["aria-hidden"] : true;
 	const t4 = !isPresent || undefined;
 	let t5;
@@ -68,43 +73,38 @@ export function AnimatedListItem(t0) {
 	}
 	const t6 = layout && !shouldReduceMotion ? "position" : false;
 	let t7;
-	if ($[8] !== distance || $[9] !== enterScale) {
+	if ($[8] !== blur || $[9] !== distance) {
 		t7 = {
 			opacity: 0,
 			y: distance,
-			scale: enterScale
+			filter: blur
 		};
-		$[8] = distance;
-		$[9] = enterScale;
+		$[8] = blur;
+		$[9] = distance;
 		$[10] = t7;
 	} else {
 		t7 = $[10];
 	}
 	let t8;
+	let t9;
 	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
 		t8 = {
 			opacity: 1,
 			y: 0,
-			scale: 1
+			filter: "blur(0px)"
 		};
-		$[11] = t8;
-	} else {
-		t8 = $[11];
-	}
-	let t9;
-	if ($[12] !== enterScale) {
 		t9 = {
 			opacity: 0,
-			scale: enterScale,
 			transition: LIST_ITEM_EXIT_TRANSITION
 		};
-		$[12] = enterScale;
-		$[13] = t9;
+		$[11] = t8;
+		$[12] = t9;
 	} else {
-		t9 = $[13];
+		t8 = $[11];
+		t9 = $[12];
 	}
 	let t10;
-	if ($[14] !== MotionElement || $[15] !== children || $[16] !== elementProps || $[17] !== t3 || $[18] !== t4 || $[19] !== t5 || $[20] !== t6 || $[21] !== t7 || $[22] !== t9) {
+	if ($[13] !== MotionElement || $[14] !== children || $[15] !== elementProps || $[16] !== t3 || $[17] !== t4 || $[18] !== t5 || $[19] !== t6 || $[20] !== t7) {
 		t10 = /* @__PURE__ */ _jsx(MotionElement, {
 			"data-slot": "animated-list-item",
 			...elementProps,
@@ -118,18 +118,17 @@ export function AnimatedListItem(t0) {
 			transition: LIST_ITEM_TRANSITION,
 			children
 		});
-		$[14] = MotionElement;
-		$[15] = children;
-		$[16] = elementProps;
-		$[17] = t3;
-		$[18] = t4;
-		$[19] = t5;
-		$[20] = t6;
-		$[21] = t7;
-		$[22] = t9;
-		$[23] = t10;
+		$[13] = MotionElement;
+		$[14] = children;
+		$[15] = elementProps;
+		$[16] = t3;
+		$[17] = t4;
+		$[18] = t5;
+		$[19] = t6;
+		$[20] = t7;
+		$[21] = t10;
 	} else {
-		t10 = $[23];
+		t10 = $[21];
 	}
 	return t10;
 }

package/dist/components/animated-theme-toggler.d.ts

@@ -1,8 +1,12 @@
 import type { ThemeMode, ResolvedTheme } from "../theme.js";
 export interface AnimatedThemeTogglerProps extends React.ComponentPropsWithoutRef<"button"> {
+    /**
+     * @deprecated The trigger no longer turns when the theme changes: like Arc's theme switch, only its icon swaps.
+     * The value is ignored.
+     */
     duration?: number;
     theme?: ThemeMode;
     resolvedTheme?: ResolvedTheme;
     onThemeChange?: (theme: ThemeMode) => void;
 }
-export declare const AnimatedThemeToggler: ({ className, duration, disabled, theme: controlledTheme, resolvedTheme: controlledResolvedTheme, onThemeChange: controlledOnThemeChange, ...props }: AnimatedThemeTogglerProps) => import("react").JSX.Element;
+export declare const AnimatedThemeToggler: ({ className, duration: _duration, disabled, theme: controlledTheme, resolvedTheme: controlledResolvedTheme, onThemeChange: controlledOnThemeChange, ...props }: AnimatedThemeTogglerProps) => import("react").JSX.Element;