@exadel/esl
Version:
Exadel Smart Library (ESL) is the lightweight custom elements library that provide a set of super-flexible components
101 lines (100 loc) • 4.72 kB
TypeScript
import { ESLIntersectionEvent } from '../../../esl-event-listener/core';
import { ESLCarouselPlugin } from '../esl-carousel.plugin';
export interface ESLCarouselAutoplayConfig {
/** Global autoplay duration (ms) or media rule pattern. 0 means "no default cycle"; negative / invalid disables plugin */
duration: string | number;
/** Navigation command executed each cycle */
command: string;
/** Intersection threshold used to (auto) pause when out of viewport */
intersection: number;
/** Enable hover / focus based pausing */
trackInteraction: boolean;
/** Scope selector for interaction tracking (defaults to host (carousel)) */
interactionScope?: string;
/** Selector for external control(s) toggling autoplay */
control?: string;
/** CSS class applied to external autoplay control elements while autoplay is enabled */
controlCls?: string;
/** CSS class applied to the carousel container while autoplay is enabled */
containerCls?: string;
/** Selector for items that, when active, should disable autoplay */
blockerSelector?: string;
/** Events that should block autoplay when fired on interaction scope elements */
watchEvents: string;
}
/**
* Autoplay plugin mixin for {@link ESLCarousel}.
* Schedules slide navigation by timeout while allowed by viewport, interaction and config constraints.
*/
export declare class ESLCarouselAutoplayMixin extends ESLCarouselPlugin<ESLCarouselAutoplayConfig> {
static is: string;
static DEFAULT_CONFIG: ESLCarouselAutoplayConfig;
static DEFAULT_CONFIG_KEY: keyof ESLCarouselAutoplayConfig;
/** Per-slide override attribute name for timeout */
static SLIDE_DURATION_ATTRIBUTE: string;
/** User suspension flag (inverse of manual enable state) */
private _suspended;
/** Last known viewport intersection state */
private _inViewport;
/** Active cycle timeout id (null if no cycle scheduled) */
private _timeout;
/** True when a navigation timeout is currently scheduled */
get active(): boolean;
/**
* Effective enabled state.
* True when user did not suspend and global duration is non-negative / valid.
* (duration = 0 keeps plugin enabled but suppresses default scheduling unless slide overrides).
*/
get enabled(): boolean;
/** Manually enable / disable (suspend) autoplay */
set enabled(value: boolean);
/** Global base duration in ms (raw config parsed). Negative / NaN considered as disabled */
get duration(): number;
/**
* Effective current slide duration.
* Tries active slide attribute; falls back to global duration.
* Non-positive result pauses cycle for the slide only (unless global invalid disables plugin).
*/
get effectiveDuration(): number;
/** Control elements collection (memoized) */
get $controls(): HTMLElement[];
/** Interaction scope elements (memoized) */
get $interactionScope(): HTMLElement[];
/** True if active slide contains any blocking items */
get hasActiveBlockingItems(): boolean;
/** True if any scope element is hovered */
get hovered(): boolean;
/** True if keyboard-visible focus is within scope */
get focused(): boolean;
/** Runtime allowance: enabled + in viewport + no blocking interaction (if tracked) */
get allowed(): boolean;
/** Init lifecycle hook */
protected onInit(): void;
/** React to config changes (rebuild memoized queries, re-evaluate state) */
protected onConfigChange(): void;
/** Suspend & cleanup on disconnect */
protected disconnectedCallback(): void;
/** Update classes and listeners, then re-validate cycle */
protected update(): void;
/** Update UI markers (CSS classes) reflecting effective enable state */
protected updateMarkers(): void;
/** Re-evaluate cycle scheduling (optionally force restart) */
protected refresh(restart?: boolean): void;
/** Internal cycle handler (exec step then schedule next) */
protected _onCycle(exec?: boolean): Promise<void>;
/** Viewport intersection listener controlling runtime allowance */
protected _onIntersection(e: ESLIntersectionEvent): void;
/** Hover/focus interaction listener toggling pause state */
protected _onInteract(): void;
/** Slide change listener (forces cycle restart) */
protected _onSlideChange(): void;
/** Control click handler toggling manual enabled state */
protected _onToggle(e: Event): void;
/** Subscribe to events that block autoplay */
protected _onBlockingEvent(): void;
}
declare global {
export interface ESLCarouselNS {
Autoplay: typeof ESLCarouselAutoplayMixin;
}
}