Saltar al contenido
El Muestrario

componente · @solu30/ui-kit/animation

InfiniteSlider

El componente, montado

Cargando el componente del paquete instalado…

Cargando el chunk del paquete instalado…

De dónde se importa

import { InfiniteSlider } from '@solu30/ui-kit/animation'

Props

7 props declaradas en los tipos de la versión instalada.
PropRequeridaTipoQué hace
childrenReactNode
gapopcionalnumberSeparación entre items, en px. Default `16`.
speedopcionalnumberVelocidad en px por segundo. Default `60`.
directionopcional"horizontal" | "vertical"Eje del desplazamiento. Default `"horizontal"`.
reverseopcionalbooleanInvierte el sentido. Default `false`.
pauseOnHoveropcionalbooleanFrena la cinta mientras el puntero está encima. Default `true`.
classNameopcionalstring

Ejemplo del paquete

<InfiniteSlider gap={48} speed={40}>
{logos.map((logo) => <img key={logo.src} {...logo} alt={logo.alt} />)}
</InfiniteSlider>

Del @example del JSDoc de @solu30/ui-kit, sin editar. Cuatro de los 69 ejemplos del paquete traen pegada la firma cruda del .d.ts —el mismo defecto del extractor que se come las descripciones—, y por eso la caja tiene tope de alto: el ejemplo de verdad suele estar al final.