gentics-ui-core/components/file-drop-area/file-drop-area.directive.d.ts

This is the common core framework for the Gentics CMS and Mesh UI, and other Angular applications.

import { ElementRef, EventEmitter, NgZone } from '@angular/core';
import { InjectionToken, OnDestroy, OnInit } from '@angular/core';
import { Observable } from 'rxjs';
import { DragStateTrackerFactory, FileDragState } from './drag-state-tracker.service';
import { PageFileDragHandler } from './page-file-drag-handler.service';
import * as i0 from "@angular/core";
export interface IFileDropAreaOptions {
    /**
     * A list of mime types accepted by the drop area. Defaults to "*".
     * Some mime types will not be reported by the client, they get matched as "unknown/unknown".
     * @example
     *   { accept: 'image/*, !image/gif' }
     *   { accept: 'text/*' }
     *   { accept: 'video/*, unknown/*' }
     */
    accept?: string;
    /**
     * Set to true to prevent interaction with the drop area.
     */
    disabled?: boolean;
    /**
     * Allow multiple files to be dropped on the drop area. Defaults to true.
     */
    multiple?: boolean;
}
export interface IDraggedFile {
    type: string;
}
/**
 * A token that can be used to inject a mock into the directive
 * @internal
 */
export declare const FILE_DROPAREA_DRAG_EVENT_TARGET: InjectionToken<unknown>;
/**
 * File upload area that accepts files via drag and drop.
 *
 * ```html
 * <gtx-file-drop-area (fileDrop)="files = $event">Upload files via drag & drop</gtx-file-drop-area>
 * <div gtx-file-drop-area (fileDrop)="files = $event">Upload files via drag & drop</div>
 * ```
 */
export declare class FileDropArea implements OnInit, OnDestroy {
    private pageDrag;
    private fileDrag;
    /**
     * Returns true if an accepted file is dragged on the drop area.
     */
    get dragHovered(): boolean;
    /**
     * Returns a list of mime types of accepted files dragged over the drop area.
     */
    get draggedFiles(): FileDragState;
    /**
     * Returns true if an accepted file is dragged on the page.
     */
    get pageDragHovered(): boolean;
    /**
     * If accepted files are dragged inside the current page / browser tab,
     * returns a list of the dragged file types, `undefined` otherwise.
     */
    get filesDraggedInPage(): FileDragState;
    /**
     * Sets options of this drop area.
     */
    get options(): IFileDropAreaOptions;
    set options(options: IFileDropAreaOptions);
    /**
     * Emits a list when files are dragged over the drop area, `undefined` otherwise.
     * Can be used with AsyncPipe for change detection and subscription handling.
     */
    draggedFiles$: Observable<FileDragState>;
    /**
     * Emits a list when files are dragged over the drop area, `false` otherwise.
     * Can be used with AsyncPipe for change detection and subscription handling.
     */
    filesDraggedInPage$: Observable<FileDragState>;
    /**
     * Fires when a file or files are dragged over the drop area.
     */
    fileDragEnter: EventEmitter<FileDragState>;
    /**
     * Fires when a file or files are dragged out of the drop area.
     */
    fileDragLeave: EventEmitter<void>;
    /**
     * Fires when a file or files are dropped on the drop area.
     */
    fileDrop: EventEmitter<File[]>;
    /**
     * Fires when a file or files which do not match the "accepted" option
     * are dropped on the drop area.
     */
    fileDropReject: EventEmitter<File[]>;
    /**
     * Fires when a file or files are dragged into the page.
     */
    pageDragEnter: EventEmitter<FileDragState>;
    /**
     * Fires when a file or files is dragged out of the page.
     */
    pageDragLeave: EventEmitter<void>;
    private _draggedFiles;
    private _isDraggedOver;
    private _isPageDraggedOver;
    private _filesDraggedInPage;
    private _options;
    private _subscriptions;
    private _eventTarget;
    constructor(elementRef: ElementRef, dragEventTarget: any, pageDrag: PageFileDragHandler, fileDrag: DragStateTrackerFactory, zone: NgZone);
    ngOnInit(): void;
    ngOnDestroy(): void;
    private accepts;
    private onDragEnterOver;
    private onDrop;
    static ɵfac: i0.ɵɵFactoryDeclaration<FileDropArea, [null, { optional: true; }, null, null, null]>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<FileDropArea, "gtx-file-drop-area, [gtxFileDropArea]", ["gtxFileDropArea"], { "options": "gtxFileDropArea"; }, { "draggedFiles$": "draggedFiles$"; "filesDraggedInPage$": "filesDraggedInPage$"; "fileDragEnter": "fileDragEnter"; "fileDragLeave": "fileDragLeave"; "fileDrop": "fileDrop"; "fileDropReject": "fileDropReject"; "pageDragEnter": "pageDragEnter"; "pageDragLeave": "pageDragLeave"; }, never>;
}