import { Subject } from 'rxjs';
import { VideoControllerApi } from '../video/video-controller-api';
import { MarkerListItem } from './marker-list-item';
export type MarkerListMode = 'TIMELINE' | 'CUTLIST';
export declare class MarkerListComponent extends HTMLElement {
    onAction$: Subject<{
        marker: MarkerListItem;
        action: string;
    }>;
    onRemove$: Subject<MarkerListItem>;
    onClick$: Subject<MarkerListItem>;
    private _markers;
    private _defaultTemplate;
    private _headerElement;
    private _emptyElement;
    private _loadingElement;
    private _listElement;
    private _listBodyElement;
    private _videoController;
    private _isLoading;
    private _nameEditable;
    private _timeEditable;
    private _nameOptions?;
    private _nameValidationFn?;
    private _mode;
    private _modeController;
    constructor();
    set videoController(videoController: VideoControllerApi);
    set headerElement(headerElement: HTMLElement);
    set emptyElement(emptyElement: HTMLElement);
    set loadingElement(loadingElement: HTMLElement);
    get markers(): MarkerListItem[];
    set markers(markers: MarkerListItem[]);
    set isLoading(isLoading: boolean);
    set nameEditable(isEditable: boolean);
    set timeEditable(isEditable: boolean);
    set nameOptions(options: string[]);
    set nameValidationFn(validationFn: (text: string) => boolean);
    set mode(newMode: MarkerListMode);
    updateMarker(id: string, updateValue: Partial<MarkerListItem>): void;
    toggleActiveClass(id: string): void;
    addMarker(markerItem: MarkerListItem): void;
    removeMarker(id: string): void;
    reorderMarker(id: string, index: number): void;
    private resolveMarkerPosition;
    private getNextMarker;
    private renderList;
    private getTemplate;
    private addMarkerToDom;
    private setMarkerSlotValues;
    private removeMarkerFromDom;
    private getDefaultHtmlElement;
    private enableDragging;
}