Current File : /home/exataengenharia/public_html/node_modules/@splidejs/splide/src/js/transitions/Fade/Fade.ts |
import { EVENT_MOUNTED, EVENT_REFRESH } from '../../constants/events';
import { EventInterface } from '../../constructors';
import { Splide } from '../../core/Splide/Splide';
import { Components, Options, TransitionComponent } from '../../types';
import { nextTick, noop } from '../../utils';
/**
* The component for the fade transition.
*
* @since 3.0.0
*
* @param Splide - A Splide instance.
* @param Components - A collection of components.
* @param options - Options.
*
* @return A Transition component object.
*/
export function Fade( Splide: Splide, Components: Components, options: Options ): TransitionComponent {
const { Slides } = Components;
/**
* Called when the component is mounted.
*/
function mount(): void {
EventInterface( Splide ).on( [ EVENT_MOUNTED, EVENT_REFRESH ], init );
}
/**
* Initializes the component.
* Offsets all slides for stacking them onto the head of the list.
* The `nextTick` disables the initial fade transition of the first slide.
*/
function init(): void {
Slides.forEach( Slide => {
Slide.style( 'transform', `translateX(-${ 100 * Slide.index }%)` );
} );
}
/**
* Starts the transition.
*
* @param index - A slide index to be active.
* @param done - The callback function that must be called after the transition ends.
*/
function start( index: number, done: () => void ): void {
Slides.style( 'transition', `opacity ${ options.speed }ms ${ options.easing }` );
nextTick( done );
}
return {
mount,
start,
cancel: noop,
};
}