import { Ref, PropType } from 'vue';
import { JSX } from 'vue/jsx-runtime';
export interface WallItem {
    id: number;
    [key: string]: any;
}
interface DisplaySize {
    width: number;
    height: number;
    scale: number;
}
export interface RenderOptions {
    width: number;
    height: number;
    aspectRatio: number;
    displaySize: DisplaySize;
}
interface FullImageWallConfig<T extends WallItem> {
    items: T[];
    renderThumbnail: (item: T, options: RenderOptions) => JSX.Element;
    renderFullView: (item: T, options: RenderOptions) => JSX.Element;
    thumbnailHeight?: number;
    thumbnailGap?: number;
    initialIndex?: number;
    defaultShowFull?: boolean;
    cacheCount?: number;
    enableTransition?: boolean;
    enablePlayback?: boolean;
    showPlaybackControls?: boolean;
    playbackConfig?: Record<string, unknown>;
}
export default class ZFullImageWall<T extends WallItem> {
    protected state: {
        items: T[];
        thumbnailHeight: number;
        thumbnailGap: number;
        containerWidth: string;
        containerHeight: string;
        showFull: boolean;
        currentIndex: number;
        cacheCount: number;
        enableTransition: boolean;
        renderThumbnail: ((item: T, options: RenderOptions) => JSX.Element) | null;
        renderFullView: ((item: T, options: RenderOptions) => JSX.Element) | null;
    };
    private clearCache;
    private initializeLayout;
    getConfig(): {
        itemsCount: number;
        items: T[];
        thumbnailHeight: number;
        thumbnailGap: number;
        containerWidth: string;
        containerHeight: string;
        showFull: boolean;
        currentIndex: number;
        cacheCount: number;
        enableTransition: boolean;
        renderThumbnail: ((item: T, options: RenderOptions) => JSX.Element) | null;
        renderFullView: ((item: T, options: RenderOptions) => JSX.Element) | null;
    };
    setConfig(config: Partial<typeof this.state>): void;
    setItems(items: T[]): void;
    setInitialIndex(index: number): void;
    private selectedIndex;
    private items;
    private listRef;
    private renderThumbnail;
    private renderFullView;
    private showFullView;
    private direction;
    private keydownHandler;
    private thumbnailHeight;
    private containerWidth;
    private visibleCount;
    private centerIndex;
    private thumbnailGap;
    private cacheCount;
    private cachedImages;
    constructor(config: FullImageWallConfig<T>);
    /**
     * 更新图片缓存，缓存当前索引前后的图片
     */
    private updateImageCache;
    private updateSelectedAndCenter;
    private handleItemClick;
    private handlePrev;
    private handleNext;
    private handleKeydown;
    private handlePrevPage;
    private handleNextPage;
    private updateContainerWidth;
    private updateVisibleCount;
    private getVisibleItems;
    private handleClose;
    private calculateDisplaySize;
    createContentEle: () => import('vue').DefineComponent<{}, () => JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    createListEle: () => import('vue').DefineComponent<{}, () => JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    fullViewContainerRef: Ref<HTMLDivElement | null, HTMLDivElement | null>;
    EleList: import('vue').DefineComponent<{}, () => JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    createJsx(): JSX.Element;
    createElement(): import('vue').DefineComponent<{}, () => JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
    getMediaManager(): null;
    playCurrentItem(): void;
    pauseCurrentItem(): void;
    stopCurrentItem(): void;
}
export declare const ZFullImageWallComponent: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
    items: {
        type: PropType<WallItem[]>;
        required: true;
    };
    renderThumbnail: {
        type: PropType<(item: WallItem, options: RenderOptions) => JSX.Element>;
        required: true;
    };
    renderFullView: {
        type: PropType<(item: WallItem, options: RenderOptions) => JSX.Element>;
        required: true;
    };
    thumbnailHeight: {
        type: NumberConstructor;
        default: number;
    };
    thumbnailGap: {
        type: NumberConstructor;
        default: number;
    };
    initialIndex: {
        type: NumberConstructor;
        default: number;
    };
    defaultShowFull: {
        type: BooleanConstructor;
        default: boolean;
    };
    cacheCount: {
        type: NumberConstructor;
        default: number;
    };
    enableTransition: {
        type: BooleanConstructor;
        default: boolean;
    };
}>, () => JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
    items: {
        type: PropType<WallItem[]>;
        required: true;
    };
    renderThumbnail: {
        type: PropType<(item: WallItem, options: RenderOptions) => JSX.Element>;
        required: true;
    };
    renderFullView: {
        type: PropType<(item: WallItem, options: RenderOptions) => JSX.Element>;
        required: true;
    };
    thumbnailHeight: {
        type: NumberConstructor;
        default: number;
    };
    thumbnailGap: {
        type: NumberConstructor;
        default: number;
    };
    initialIndex: {
        type: NumberConstructor;
        default: number;
    };
    defaultShowFull: {
        type: BooleanConstructor;
        default: boolean;
    };
    cacheCount: {
        type: NumberConstructor;
        default: number;
    };
    enableTransition: {
        type: BooleanConstructor;
        default: boolean;
    };
}>> & Readonly<{}>, {
    thumbnailHeight: number;
    thumbnailGap: number;
    cacheCount: number;
    enableTransition: boolean;
    initialIndex: number;
    defaultShowFull: boolean;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
export {};