OptionWheel

Selector curvo tipo rueda que gira con scroll, arrastre o flechas.

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

Cómo instalarlo

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

Cuándo usarlo

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

Props para personalizarlo

PropTipoPor defecto
itemsstring[][...]
defaultSelectednumber3
onChange(index, item) => void-
textColorstring"#a6a6a6"
activeColorstring"#ffffff"
side"left" | "right""left"
fontSizenumber3
spacingnumber1.4
curvenumber1
tiltnumber6
blurnumber2
fadenumber0.25
minOpacitynumber0.05
smoothingnumber200
insetnumber80
loopbooleanfalse
draggablebooleantrue
soundUrlstring""
soundVolumenumber0.5
classNamestring""

Otros efectos de componentes

  • 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.
  • CircularGallery — Galería curva infinita que se arrastra o se desplaza con scroll.
  • DepthCarousel — Tarjetas en un raíl 3D con profundidad, arrastre y autoplay.