LineSidebar

Barra lateral cuyos elementos reaccionan a la cercanía del cursor.

Código: RODD·CP·029
Familia: Componentes
Origen: React Bits (David Haz) · Licencia MIT + Commons Clause

Cómo instalarlo

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

Cuándo usarlo

Sustituyen a un componente estándar cuando la experiencia es parte del producto.

Props para personalizarlo

Prop	Tipo	Por defecto
items	string[]	[...]
accentColor	string	"#A855F7"
textColor	string	"#c4c4c4"
markerColor	string	"#6c6c6c"
showIndex	boolean	true
showMarker	boolean	true
proximityRadius	number	100
maxShift	number	30
falloff	"linear" \| "smooth" \| "sharp"	"smooth"
markerLength	number	60
markerGap	number	0
tickScale	number	0.5
scaleTick	boolean	true
itemGap	number	20
fontSize	number	1.1
smoothing	number	100
defaultActive	number \| null	null
onItemClick	(index, label) => void	-
className	string	""

Otros efectos de componentes

MediaBetweenText — Una imagen o vídeo que se abre entre dos palabras.
PillNav — Navegación en píldora con resaltado deslizante.
ScrollStack — Tarjetas que se apilan con profundidad al hacer scroll.
Stepper — Asistente de pasos con transiciones animadas.
AnimatedList — Lista que aparece elemento a elemento, como notificaciones.
BubbleMenu — Menú de burbujas que se expande con elementos escalonados.