Once primitivas portadas de motion-primitives, cada una con al menos un defecto del original corregido. Ninguna entró como copia — el desvío va escrito en el JSDoc con su motivo, para que el próximo "sincronizá con upstream" no reintroduzca el bug.
0reservas procesadas
Pasá el puntero por encima
El resplandor es decorativo: no comunica nada que el texto no diga.
fadeInHeladería · pedido confirmado
slideUpSalón · nueva reserva
slideLeftCharter · check-in tripulación
slideRightCharter · check-out marina
scaleInHeladería · lote de producción
delay · duration fija en 500ms
0msSalón Jacarandá — confirmado
150msHeladería Sur — stock repuesto
300msCharter Aurora — tripulación asignada
450msSalón Belgrano — depósito recibido
duration · delay fijo en 0ms
200msHeladería Sur — pedido #418
600msCharter Aurora — check-in listo
1200msSalón Jacarandá — evento cerrado
`threshold` (0–1, qué porción del elemento tiene que entrar en viewport antes de disparar) no se demuestra acá: necesita scroll real, no una caja de tamaño fijo.
fadeUpCharter · zarpe confirmado
fadeInHeladería · turno abierto
slideLeftSalón · check-in staff
slideRightSalón · check-out staff
scaleUpCharter · fondeo listo
Dulce de leche granizado
Frutos del bosque
Chocolate amargo 70%
Limón y albahaca
Pistacho tostado
AnimatedSectionCharter · 8 veleros en flota
CSS puro (utilidad de Tailwind que transiciona todas las propiedades + IntersectionObserver). Nunca pasa por framer-motion — el interruptor no tiene nada que interceptar acá.
MotionSectionSalón · 42 salones activos
Sí corre sobre framer-motion — pero se envuelve en su propia MotionConfig reducedMotion="user", y framer-motion mezcla contexto anidado con el hijo ganando sobre el padre: tapa cualquier MotionConfig de la app anfitriona. Sigue al sistema operativo directo, nunca a este botón. KIT-060.
Con el interruptor de la cabecera en cualquier posición, ninguna de las dos cambia. Es el estado real de las seis piezas de esta familia hoy: cero de seis obedecen.
9 piezas de Movimiento que GestorSalon usa y esta galería no mostraba
Medido, no elegido: sale de cruzar los 254 símbolos del kit que aparecen en el código de GestorSalon contra los que estos especímenes montaban. Cada ficha trae el especificador de import y las props que el producto realmente le pasa.
Collapse
@solu30/ui-kit/animation7 usos · 5 archivos
Alto animado de cero al alto real del contenido, sin que el consumidor mida nada. Es la única pieza de esta lista que renderiza markup: las otras ocho son constantes.
Existe en la 5.8.1 que corre esta galería y no en la 5.2.0 que GestorSalon resuelve hoy. Importarla allá no compila hasta que ese repo reinstale — su lock ya declara una versión más nueva que la que tiene bajada.
open ×7
El alto se anima solo: el consumidor no mide nada ni pasa una altura. Es la diferencia con un `max-height` a ojo, que o corta el contenido o deja una animación que tarda de más cuando el bloque es corto.
SPRING
@solu30/ui-kit/tokens0 usos · 14 archivos
El vocabulario de movimiento del sistema. Duraciones, curvas, resortes, escalonados y las reacciones al toque, todos con nombre y todos versionados con el paquete. Un número suelto en un `transition` es una pieza que se mueve distinto que el resto, y nada avisa.
DURATION (s)
instant
0.1
fast
0.15
normal
0.2
smooth
0.3
slow
0.5
pageTransition
0.4
STAGGER (s)
fast
0.05
normal
0.08
slow
0.12
EASING
standard
0.4, 0, 0.2, 1
easeOut
0, 0, 0.2, 1
easeIn
0.4, 0, 1, 1
easeInOut
0.4, 0, 0.2, 1
premium
0.25, 0.1, 0.25, 1
SPRING
snappy
rigidez 400 · amortiguación 30
default
rigidez 300 · amortiguación 24
smooth
rigidez 200 · amortiguación 20
gentle
rigidez 120 · amortiguación 14
bouncy
rigidez 400 · amortiguación 10
mobile
rigidez 350 · amortiguación 28
sheet
rigidez 300 · amortiguación 30
INTERACTION
tap
{"scale":0.97}
tapDeep
{"scale":0.95}
hover
{"scale":1.02}
hoverLift
{"scale":1.02,"y":-2}
press
{"scale":0.97,"opacity":0.9}
cardPress
{"scale":0.98}
Los siete grupos de constantes, uno por uno
Los cinco primeros están impresos con su valor real en el espécimen de arriba. Los tres últimos son transiciones ya armadas, listas para pasar tal cual a un `transition`: la del panel que entra de costado, la del bloque que cambia de tamaño, y la del contenido que aparece — y las tres son de las que todavía no existen en la versión que el producto resuelve.
Símbolo
De dónde
Usos
Props que le pasa GestorSalon
DURATION
@solu30/ui-kit/tokens
0
—
EASING
@solu30/ui-kit/tokens
0
—
INTERACTION
@solu30/ui-kit/tokens
0
—
STAGGER
@solu30/ui-kit/tokens
0
—
SPRING_SLIDE
@solu30/ui-kit/tokenssólo 5.8.1
0
—
SPRING_SIZE
@solu30/ui-kit/tokenssólo 5.8.1
0
—
EASE_CONTENT
@solu30/ui-kit/tokenssólo 5.8.1
0
—
Existe en la 5.8.1 que corre esta galería y no en la 5.2.0 que GestorSalon resuelve hoy. Importarla allá no compila hasta que ese repo reinstale — su lock ya declara una versión más nueva que la que tiene bajada.