import { default as CxAvatar } from '../../../atoms/src/components/avatar/avatar.ts';
import { default as CxButton } from '../../../atoms/src/components/button/button.ts';
import { default as CxDialog } from '../../../atoms/src/components/dialog/dialog.ts';
import { default as CxDivider } from '../../../atoms/src/components/divider/divider.ts';
import { default as CxFormatBytes } from '../../../atoms/src/components/format-bytes/format-bytes.ts';
import { default as CxIcon } from '../../../atoms/src/components/icon/icon.ts';
import { default as CxIconButton } from '../../../atoms/src/components/icon-button/icon-button.ts';
import { default as CxInput } from '../../../atoms/src/components/input/input.ts';
import { default as CxLineClamp } from '../../../atoms/src/components/line-clamp/line-clamp.ts';
import { default as CxOption } from '../../../atoms/src/components/option/option.ts';
import { default as CxRelativeTime } from '../../../atoms/src/components/relative-time/relative-time.ts';
import { default as CxSelect } from '../../../atoms/src/components/select/select.ts';
import { default as CxSpace } from '../../../atoms/src/components/space/space.ts';
import { default as CxTab } from '../../../atoms/src/components/tab/tab.ts';
import { default as CxTabGroup } from '../../../atoms/src/components/tab-group/tab-group.ts';
import { default as CxTabPanel } from '../../../atoms/src/components/tab-panel/tab-panel.ts';
import { default as CxTooltip } from '../../../atoms/src/components/tooltip/tooltip.ts';
import { default as CxTree } from '../../../atoms/src/components/tree/tree.ts';
import { default as CxTreeItem } from '../../../atoms/src/components/tree-item/tree-item.ts';
import { default as CxTypography } from '../../../atoms/src/components/typography/typography.ts';
import { default as CortexElement } from '../../../base/src/cortex-element.ts';
import { default as CxConfirmPopover } from '../../../molecules/src/confirm-popover/confirm-popover.ts';
import { Asset, AssetIndexSyncStatus, AssetsProp, ConnectionStatus, FolderOption, Settings } from '../../../types/src/file-on-demand';
import { CSSResultGroup, nothing, TemplateResult } from 'lit';
import { default as CxFileOnDemandAsset } from './components/file-on-demand-asset/file-on-demand-asset';
import { default as CxFolderTree } from './components/folder-tree/folder-tree';
import { ASSET_LIST_TYPES } from './file-on-demand.constants';

/**
 * @summary File on Demand is a component that allows users to view and manage their assets.
 * @description Input auth token of the corresponding site before connecting. Open console to see events details.
 *
 * @event {{ assetId: string }} cx-mark-favorite - Emitted when the user marks an asset as favorite.
 * @event {{ assetId: string }} cx-unmark-favorite - Emitted when the user unmarks an asset as favorite.
 * @event cx-open-search - Emitted when the user opens the search.
 * @event {{ assetId: string }} cx-open-drive - Emitted when the user opens the drive.
 * @event {{ type: string }} cx-file-on-demand-load-more - Emitted when the user requests more assets.
 * @event {{ connectUrl: string }} cx-connect - Emitted when the user requests to connect to the given connectionUrl.
 * @event {{ connectUrl: string }} cx-disconnect - Emitted when the user requests to disconnect from the given connectionUrl.
 * @event cx-clear-cache - Emitted when the user requests to clear the cache.
 * @event cx-import-settings - Emitted when the user requests to import settings.
 * @event cx-export-settings - Emitted when the user requests to export settings.
 * @event cx-view-logs - Emitted when the user requests to view logs.
 * @event cx-open-cache-location - Emitted when the user requests to open the cache location folder.
 * @event cx-add-proxy-format-folders - Emitted when the user requests to add proxy format folders.
 * @event {{ settings: Settings }} cx-save-settings - Emitted when the user saves the settings.
 * @event cx-upgrade - Emitted when the user requests to upgrade the application.
 * @event {{ assetId: string }} cx-retry-upload - Emitted when the user retries an upload.
 * @event {{ assetId: string }} cx-pause-upload - Emitted when the user pauses an upload.
 * @event {{ assetId: string }} cx-resume-upload - Emitted when the user resumes an upload.
 * @event {{ assetId: string }} cx-cancel-upload - Emitted when the user cancels an upload.
 * @event cx-renew-token - Emitted when fetch fails due to token expiration.
 *
 * @typedef Asset - {
 *   id: string;
 *   isFavorite?: boolean;
 *   label: string;
 *   remainingTime?: number;
 *   size?: number;
 *   uploadStatus?: UploadStatus;
 *   remainingSize?: number;
 *   uploadTimestamp?: number;
 *   thumbnailUrl?: string;
 *   timestamp: number;
 *   type: 'file' | 'folder';
 *   parentRecordId?: string;
 * }
 *
 * @typedef AssetsProp - {
 *   assets: Asset[];
 *   hasMore: boolean;
 * }
 *
 * @typedef Settings - {
 *   cacheLocation: string;
 *   cacheSize: number;
 *   config: {
 *     rootIDs: string[];
 *     monitoringActivated: boolean;
 *     mountPoint: string;
 *     mountProxy: boolean;
 *     proxyTypes: Array<'Image' | 'Video' | 'Audio' | 'All'>;
 *     siteUrl: string;
 *     version: string;
 *   };
 * }
 *
 * @typedef FolderOption - {
 *   children: any[];
 *   id: string;
 *   label: string;
 * }
 */
export default class CxFileOnDemand extends CortexElement {
    private readonly localize;
    static readonly styles: CSSResultGroup;
    static readonly dependencies: {
        'cx-avatar': typeof CxAvatar;
        'cx-button': typeof CxButton;
        'cx-confirm-popover': typeof CxConfirmPopover;
        'cx-dialog': typeof CxDialog;
        'cx-divider': typeof CxDivider;
        'cx-file-on-demand-asset': typeof CxFileOnDemandAsset;
        'cx-folder-tree': typeof CxFolderTree;
        'cx-format-bytes': typeof CxFormatBytes;
        'cx-icon': typeof CxIcon;
        'cx-icon-button': typeof CxIconButton;
        'cx-input': typeof CxInput;
        'cx-line-clamp': typeof CxLineClamp;
        'cx-option': typeof CxOption;
        'cx-relative-time': typeof CxRelativeTime;
        'cx-select': typeof CxSelect;
        'cx-space': typeof CxSpace;
        'cx-tab': typeof CxTab;
        'cx-tab-group': typeof CxTabGroup;
        'cx-tab-panel': typeof CxTabPanel;
        'cx-tooltip': typeof CxTooltip;
        'cx-tree': typeof CxTree;
        'cx-tree-item': typeof CxTreeItem;
        'cx-typography': typeof CxTypography;
    };
    container: HTMLDivElement;
    folderTree: CxFolderTree;
    dialog: CxDialog;
    recentAssetsList: HTMLDivElement;
    favoritesAssetsList: HTMLDivElement;
    uploadsAssetsList: HTMLDivElement;
    pinnedAssetsList: HTMLDivElement;
    assetsListTabGroup: CxTabGroup;
    cacheLocationValueText: CxLineClamp;
    /** Indicates if the user is connected to the provided connection URL.*/
    connectionEstablished: boolean;
    /** The connection status. */
    connectionStatus: ConnectionStatus;
    connectionStatusTooltip: string;
    /** The asset index sync status. */
    assetIndexSyncStatus: AssetIndexSyncStatus;
    /** The user's avatar URL. */
    userAvatarUrl: string;
    username: string;
    recentAssets: AssetsProp;
    favoriteAssets: AssetsProp;
    /** The last sync timestamp for favorite assets. */
    favoritesLastSync: number;
    /** The assets that are currently being marked/unmarked as favorite. */
    favoriteInProgressAssets: string[];
    /** The assets that are currently being pinned/unpinning. */
    pinInProgressAssets: string[];
    uploadingAssets: AssetsProp;
    pinnedAssets: AssetsProp;
    availableFolderIdentifiers: FolderOption[];
    isLoading: boolean;
    settings: Settings;
    /** A function to pick cache location and returns the folder path. */
    pickCacheLocation: () => Promise<string>;
    /** Indicates if the application has a new version to upgrade to. */
    hasNewVersion: boolean;
    /** The about content to display in the settings view. */
    aboutContent: string;
    /** The authentication token to use for fetching data from OrangeDAM. */
    token: string;
    userInteractionBlocked: boolean;
    isConnecting: boolean;
    isCancellingConnection: boolean;
    isDisconnecting: boolean;
    isUpgrading: boolean;
    /** Indicates if settings view is active.*/
    isSettingsOpened: boolean;
    private rootIDs;
    private _activeFoldersMode;
    private removedIds;
    private cacheSize;
    private cacheLocation;
    private proxyTypes;
    private siteUrl;
    isRecentAssetsLoading: boolean;
    isFavoriteAssetsLoading: boolean;
    isUploadingAssetsLoading: boolean;
    isPinnedAssetsLoading: boolean;
    connectError: string;
    disconnectError: string;
    upgradeError: string;
    totalCount: number;
    folderPathsSet: Set<string>;
    validConnectionUrl: boolean;
    isAddingRootIDs: boolean;
    connectedCallback(): void;
    runFirstUpdated(): void;
    fetchFolders: ({ excludes, folderId, folderPathsSet, limit, start, }: {
        excludes?: string[];
        folderId: string;
        folderPathsSet?: Set<string>;
        limit?: number;
        start?: number;
    }) => Promise<{
        data: FolderOption[];
        totalCount: number;
    }>;
    fetchData(): void;
    showRecentTab(): Promise<void>;
    updateSettingsStates(): void;
    get formHasChanges(): boolean;
    private connect;
    private cancelConnection;
    private disconnect;
    private upgrade;
    private clearCache;
    private importSettings;
    private exportSettings;
    private viewLogs;
    private clearUpload;
    private saveSettings;
    private openSearch;
    private openDrive;
    private openCacheLocation;
    hideSettings(): void;
    showSettings(): void;
    private requestMoreRecentAssets;
    onRecentAssetsChanged(): void;
    private requestMoreFavoriteAssets;
    private requestMorePinnedAssets;
    onPinnedAssetsChanged(): void;
    onFavoriteAssetsChanged(): void;
    private requestMoreUploadingAssets;
    onUploadingAssetsChanged(): void;
    updateActiveFolderIdentifiers(values: string[]): Promise<void>;
    renderHeader(): TemplateResult;
    renderAsset(asset: Asset, listType: (typeof ASSET_LIST_TYPES)[keyof typeof ASSET_LIST_TYPES]): TemplateResult;
    renderRecentAssets(): TemplateResult;
    renderFavoriteAssets(): TemplateResult;
    renderUploadingAssets(): TemplateResult;
    renderPinnedAssets(): TemplateResult;
    renderAssetsList(): TemplateResult;
    renderAssetsView(): TemplateResult;
    searchText: string;
    onSearch(): void;
    renderSelectFoldersPopup(): TemplateResult;
    private readonly loadMore;
    renderSelectableFolderTree(): TemplateResult;
    renderRootFolderTree(): TemplateResult<1> | typeof nothing;
    private handleActiveFolderChange;
    renderGeneralSettings(): TemplateResult;
    private handleProxyChange;
    private handleCacheSizeKeydown;
    private handleCacheSizeChange;
    private handleCacheLocationClick;
    handleCacheLocationChange(): Promise<void>;
    renderAdvancedSettings(): TemplateResult;
    renderSettingsView(): TemplateResult;
    renderStatusFooter(): TemplateResult;
    private handleConnectionURLInput;
    renderWelcomeView(): TemplateResult;
    renderView(): TemplateResult;
    renderLoadingOverlay(): TemplateResult;
    render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        'cx-file-on-demand': CxFileOnDemand;
    }
}
