@exadel/esl
Version:
Exadel Smart Library (ESL) is the lightweight custom elements library that provide a set of super-flexible components
42 lines (41 loc) • 1.62 kB
TypeScript
import { ESLBaseElement } from '../../../esl-base-element/core';
import type { ESLCarousel } from '../../core/esl-carousel';
/**
* {@link ESLCarousel} — Element for displaying dynamic textual information based on the carousel’s current state.
*
* Example:
* ```
* <esl-carousel-info format="Slide {current} of {total}"></esl-carousel-info>
* ```
*/
export declare class ESLCarouselInfo extends ESLBaseElement {
static is: string;
static observedAttributes: string[];
/** {@link ESLTraversingQuery} string to find {@link ESLCarousel} instance */
carousel: string;
/** Format string used to render info text. Supports `{name}`, `{{name}}` and `{%name%}` */
format: string;
/** Returns ESLCarousel instance based on `target` attr */
get $carousel(): ESLCarousel | null;
connectedCallback(): void;
disconnectedCallback(): void;
attributeChangedCallback(name: string, oldValue: string, newValue: string): void;
/** Builds state object used for formatting */
protected get state(): Record<string, any>;
/** Title text for the active slide */
protected get activeTitle(): string;
/** Updates rendered content according to format and current state */
update(): void;
/** Inits a11y of `ESLCarouselInfo` as a status container */
protected initA11y(): void;
/** Handles carousel state changes */
protected _onSlideChange(e: Event): void;
}
declare global {
export interface ESLCarouselNS {
Info: typeof ESLCarouselInfo;
}
export interface HTMLElementTagNameMap {
'esl-carousel-info': ESLCarouselInfo;
}
}