import { IEventEmitter } from '@breadstone/mosaik-elements'; import { type IInvalidable } from '../../../Behaviors/Invalidable'; import type { DropZoneDataEvent, IFileAddEventDetail, IFileErrorEventDetail, IFileRemoveEventDetail, IFilesChangedEventDetail } from '../../../events'; import { FileUploadView } from '../../../Types/FileUploadView'; import { CustomElement } from '../../Abstracts/CustomElement'; import type { IFileUploadElementProps } from './IFileUploadElementProps'; import { FileUploadElementIntl } from './Intl/FileUploadElementIntl'; import { IFileInfo } from './Models/Interfaces/IFileInfo'; import type { IUploadStrategy } from './Strategies/Interfaces/IUploadStrategy'; declare const FileUploadElement_base: (abstract new (...args: Array) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Appearanceable").IAppearanceableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Variantable").IVariantableProps) & (abstract new (...args: Array) => IInvalidable & import("../../../Behaviors/Invalidable").IInvalidableProps) & (abstract new (...args: Array) => import("../../../Behaviors/Valueable").IValueableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor; /** * File Upload - A comprehensive file upload control with drag-and-drop support and multiple view modes. * * @description * The File Upload component provides a complete file upload workflow with drag-and-drop functionality, * multiple view modes (list, table, card), upload progress tracking, and extensive customization options. * It supports single and multiple file selection, file type restrictions, size validation, custom upload * strategies, and comprehensive file management features. The component handles file selection via dialog * or drag-and-drop, displays upload progress, provides error handling and retry mechanisms, and offers * different visual representations for uploaded files. Features include file preview capabilities, * batch operations, upload resumption, and integration with various backend services. Perfect for * document management systems, media upload interfaces, form attachments, and any application requiring * robust file handling capabilities. * * @name File Upload * @element mosaik-file-upload * @category Inputs * * @slot - Default slot for custom UI elements like buttons or instructions. * * @csspart dropZone - The drag-and-drop zone container. * @csspart fileList - The container for file list display. * @csspart fileItem - Individual file items in the list. * @csspart uploadButton - The file selection button. * @csspart progressIndicator - The upload progress display. * * @cssprop {Color} --file-upload-background-color - The background color. * @cssprop {Color} --file-upload-border-color - The border color. * @cssprop {String} --file-upload-border-radius - The border radius. * @cssprop {String} --file-upload-border-style - The border style. * @cssprop {String} --file-upload-border-width - The border width. * @cssprop {Color} --file-upload-foreground-color - The foreground color. * @cssprop {String} --file-upload-shadow - The shadow. * * @dependency mosaik-drop-zone - Used for drag-and-drop functionality. * @dependency mosaik-file-picker - Used for file selection dialog. * @dependency mosaik-button - Used for upload buttons. * @dependency mosaik-card - Used for card view mode. * @dependency mosaik-chip - Used for file tags. * @dependency mosaik-list - Used for list view mode. * @dependency mosaik-table - Used for table view mode. * @dependency mosaik-file-upload-item - Used for individual file items. * * @fires fileAdded {FileAddEvent} - Fired when a file is added to the upload list. * @fires fileRemoved {FileRemoveEvent} - Fired when a file is removed from the upload list. * @fires fileFailed {FileErrorEvent} - Fired when a file upload fails. * @fires filesChanged {FilesChangedEvent} - Fired when the set of files has changed. * * @example * ```html * * ``` * * @example * Table view with 10 MB size limit (`max-size` is in bytes): * ```html * * ``` * * @public */ export declare class FileUploadElement extends FileUploadElement_base implements IFileUploadElementProps, IInvalidable { private readonly _fileAdded; private readonly _fileRemoved; private readonly _fileFailed; private readonly _filesChanged; private readonly _intl; private _inputElement; private _autoUpload; private _view; private _multiple; private _directory; private _accept; private _strategy; private _value; private _placeholder; private _maxSize; private _isDragging; /** * @public */ constructor(); /** * Returns the `is` property. * The `is` property represents natural name of this element. * * @public * @static * @readonly */ static get is(): string; /** * Gets or sets the `autoUpload` property. * * @public * @attr */ get autoUpload(): boolean; set autoUpload(value: boolean); /** * Gets or sets the `view` property. * * @public * @attr */ get view(): FileUploadView; set view(value: FileUploadView); /** * Gets or sets the `multiple` property. * * @public * @attr */ get multiple(): boolean; set multiple(value: boolean); /** * Gets or sets the `directory` property. * * @public * @attr */ get directory(): boolean; set directory(value: boolean); /** * Gets or sets the `accept` property. * * @public */ get accept(): Array; set accept(value: Array); /** * Gets or sets the `strategy` property. * * @public */ get strategy(): IUploadStrategy | null; set strategy(value: IUploadStrategy | null); /** * Gets or sets the `value` property. * * @public * @override */ get value(): Array; set value(value: Array); /** * Gets or sets the `placeholder` property. * * @public */ get placeholder(): string; set placeholder(value: string); /** * Gets or sets the `maxSize` property. * * @public * @attr */ get maxSize(): number; set maxSize(value: number); get isDragging(): boolean; private set isDragging(value); get intl(): FileUploadElementIntl; /** * Called when a file is added. * Provides reference to `IEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get fileAdded(): IEventEmitter; /** * Called when a file is deleted. * Provides reference to `IEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get fileRemoved(): IEventEmitter; /** * Called when a file upload fails. * Provides reference to `IEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get fileFailed(): IEventEmitter; /** * Called when the files are changed. * Provides reference to `IEventDetail` as event detail. * * @public * @readonly * @eventProperty */ get filesChanged(): IEventEmitter; /** * @public */ add(value?: File | Array | FileList): void; /** * @public */ delete(fileInfo: IFileInfo): void; /** * @public */ save(fileInfo: IFileInfo): Promise; /** * Resets the value, all kinds of validation and errors. * * @public */ reset(): void; /** * Checks the validity of the element and returns `true` if it is valid; otherwise, `false`. * * @public * @override */ checkValidity(): boolean; /** * @protected * @template */ onDataTransferred(event: DropZoneDataEvent): void; /** * @protected * @override */ protected onApplyTemplate(): void; /** * @protected * @hidden */ protected onPaste(event: ClipboardEvent): void; /** * @private */ private upload; /** * @private */ private download; /** * Emits the `fileAdded` event. * * @protected */ protected onFileAdded(args: IFileAddEventDetail): void; /** * Emits the `fileRemoved` event. * * @protected */ protected onFileRemoved(args: IFileRemoveEventDetail): void; /** * Emits the `fileFailed` event. * * @protected */ protected onFileFailed(args: IFileErrorEventDetail): void; /** * Emits the `filesChanged` event. * * @protected */ protected onFilesChanged(args: IFilesChangedEventDetail): void; } /** * @public */ export declare namespace FileUploadElement { type Props = IFileUploadElementProps; } /** * @public */ declare global { interface HTMLElementTagNameMap { 'mosaik-file-upload': FileUploadElement; } } export {}; //# sourceMappingURL=FileUploadElement.d.ts.map