@exadel/esl/modules/esl-carousel/core/esl-carousel.renderer.d.ts

Exadel Smart Library (ESL) is the lightweight custom elements library that provide a set of super-flexible components

import { SyntheticEventTarget } from '../../esl-utils/dom';
import { ESLCarouselDirection } from './esl-carousel.types';
import type { ESLCarousel } from './esl-carousel';
import type { ESLCarouselSlideEventInit } from './esl-carousel.events';
import type { ESLCarouselActionParams, ESLCarouselConfig, ESLCarouselNavInfo } from './esl-carousel.types';
export declare abstract class ESLCarouselRenderer implements ESLCarouselConfig {
    static is: string;
    static classes: string[];
    protected readonly $carousel: ESLCarousel;
    /** (visible) slide count per view */
    readonly count: number;
    /** cyclic carousel rendering mode */
    readonly loop: boolean;
    /** vertical carousel rendering mode */
    readonly vertical: boolean;
    /** marker if the renderer is applied to the carousel */
    protected _bound: boolean;
    constructor($carousel: ESLCarousel, options: ESLCarouselConfig);
    /** @returns marker if the renderer is applied to the carousel */
    get bound(): boolean;
    /** @returns renderer type name */
    get type(): string;
    /** @returns slide total count or 0 if the renderer is not bound */
    get size(): number;
    /** @returns renderer config */
    get config(): ESLCarouselConfig;
    /** @returns {@link ESLCarousel} `$slidesArea` */
    get $area(): HTMLElement;
    /** @returns {@link ESLCarousel} `$slides` */
    get $slides(): HTMLElement[];
    equal(config: ESLCarouselConfig): boolean;
    bind(): void;
    unbind(): void;
    /** Processes binding of defined renderer to the carousel {@link ESLCarousel}. */
    onBind(): void;
    /** Processes unbinding of defined renderer from the carousel {@link ESLCarousel}. */
    onUnbind(): void;
    /** Processes drawing of the carousel {@link ESLCarousel}. */
    redraw(): void;
    /** Normalizes an index before navigation */
    protected normalizeIndex(index: number, params?: ESLCarouselActionParams): number;
    /** Normalizes a direction before navigation */
    protected normalizeDirection(direction: ESLCarouselDirection | undefined, params?: ESLCarouselActionParams): ESLCarouselDirection;
    /** Processes changing slides */
    navigate(to: ESLCarouselNavInfo, params: ESLCarouselActionParams): Promise<void>;
    /** Pre-processing animation action. */
    onBeforeAnimate(index: number, direction: ESLCarouselDirection, params: ESLCarouselActionParams): Promise<void>;
    /** Processes animation. */
    abstract onAnimate(index: number, direction: ESLCarouselDirection, params: ESLCarouselActionParams): Promise<void>;
    /** Post-processing animation action. */
    onAfterAnimate(index: number, direction: ESLCarouselDirection, params: ESLCarouselActionParams): Promise<void>;
    /** Moves slide by the passed offset in px */
    abstract move(offset: number, from: number, params: ESLCarouselActionParams): void;
    /** Normalizes move offset to the "nearest stable" slide position */
    abstract commit(offset: number, from: number, params: ESLCarouselActionParams): Promise<void>;
    /** Sets active slides from passed index **/
    setActive(current: number, event?: Partial<ESLCarouselSlideEventInit>): void;
    setPreActive(from: number, force?: boolean): void;
    static get registry(): ESLCarouselRendererRegistry;
    static register(view?: ESLCarouselRendererConstructor): void;
}
export type ESLCarouselRendererConstructor = (new (carousel: ESLCarousel, config: ESLCarouselConfig) => ESLCarouselRenderer) & typeof ESLCarouselRenderer;
export declare class ESLCarouselRendererRegistry extends SyntheticEventTarget {
    private store;
    create(carousel: ESLCarousel, config: ESLCarouselConfig): ESLCarouselRenderer;
    register(view: ESLCarouselRendererConstructor): void;
}