WarmTooltip

Tooltips agrupados: el primero espera y los siguientes aparecen al instante.

Código: RODD·MI·034
Familia: Microinteracciones
Origen: React Bits (David Haz) · Licencia MIT + Commons Clause

Cómo instalarlo

npx shadcn@latest add https://reactbits.dev/r/WarmTooltip-TS-TW

Cuándo usarlo

Para acciones frecuentes: confirmar, marcar, valorar. El feedback convierte un clic en una sensación.

Props para personalizarlo

Prop	Tipo	Por defecto
content	ReactNode	-
shortcut	ReactNode	undefined
children	ReactElement	-
side	"top" \| "bottom" \| "left" \| "right"	"top"
delay	number	400
warmWindow	number	300
surfaceColor	string	"#f5f5f5"
inkColor	string	"#18181b"
size	"sm" \| "md" \| "lg"	"md"
radius	number	8
gap	number	8
arrow	boolean	true
popDuration	number	160
popScale	number	0.94
popBlur	number	4
showFuse	boolean	false
longPress	number	500
disabled	boolean	false
className	string	""
WarmTooltipGroup	component	-

Otros efectos de microinteracciones

CodeSlots — Campo de código de un solo uso (OTP) con animación por dígito.
FuseButton — Botón con “deshacer” sobre una mecha que se consume.
LatticeLoader — Indicador de estado de agente IA con rejilla de puntos en ola.
PulsatingButton — Botón que late para llamar la atención.
RubberSegment — Control segmentado con un selector de goma elástica.
SlideCommit — Desliza para confirmar, con estados de carga, éxito y error.