@sixbell-telco/sdk

import { ElementRef } from '@angular/core'; import { ControlValueAccessor, FormGroup } from '@angular/forms'; import { TranslateService } from '@ngx-translate/core'; import { AudioPlayerService, Track } from '@sixbell-telco/sdk/components/audio-player'; import { FileExtension } from '../shared/types/file-upload'; import * as i0 from "@angular/core"; /** * A customizable drag-and-drop file upload zone with audio playback capabilities * * @remarks * Supports file validation, multi-file uploads, and audio file preview/playback. * Implements ControlValueAccessor for Angular form integration. * * @example * ```html * <st-file-dropzone * [extensions]="['.mp3', '.wav']" * [maxFiles]="3" * (fileDropped)="handleUpload($event)" * ></st-file-dropzone> * ``` * * @example * ```html *  * <st-file-dropzone * [parentForm]="mediaForm" * formControlName="attachments" * [multiple]="true" * ></st-file-dropzone> * ``` */ export declare class DropzoneComponent implements ControlValueAccessor { /** @internal Translation service instance */ translateService: TranslateService; /** @internal Audio player service instance */ audioService: AudioPlayerService; /** * Maximum number of allowed files * @defaultValue 1 */ maxFiles: import("@angular/core").InputSignal<number>; /** * Maximum file size in bytes (0 for unlimited) * @defaultValue 0 */ maxFileSize: import("@angular/core").InputSignal<number>; /** * Whether to display uploaded files list * @defaultValue true */ showFiles: import("@angular/core").InputSignal<boolean>; /** * Allowed file extensions (e.g., ['.pdf', '.mp3']) */ extensions: import("@angular/core").InputSignal<FileExtension[]>; /** * Whether upload is in progress * @defaultValue false */ uploading: import("@angular/core").InputSignal<boolean>; /** * Whether the component is disabled * @defaultValue false */ disabled: import("@angular/core").ModelSignal<boolean>; /** * Whether multiple files can be uploaded * @defaultValue false */ multiple: import("@angular/core").InputSignal<boolean>; /** * HTML name attribute for the input * @defaultValue 'file' */ name: import("@angular/core").InputSignal<string>; /** * Computed accept attribute for file input * @internal */ accept: import("@angular/core").Signal<string>; /** @internal Tracks audio player open state */ opened: import("@angular/core").WritableSignal<boolean>; /** @internal Tracks blur events for validation */ private blurTrigger; /** * Parent form group for reactive forms */ parentForm: import("@angular/core").InputSignal<FormGroup<any> | null>; /** * Form control name for reactive forms */ formControlName: import("@angular/core").InputSignal<string>; /** * Emitted when valid files are dropped/selected */ fileDropped: import("@angular/core").OutputEmitterRef<File[]>; /** * Emitted when a file is removed */ fileRemoved: import("@angular/core").OutputEmitterRef<File>; /** @internal Current list of uploaded files */ files: import("@angular/core").WritableSignal<File[]>; /** @internal Drag state tracker */ isDragging: import("@angular/core").WritableSignal<boolean>; /** @internal Validation error message */ errorMessage: import("@angular/core").WritableSignal<string>; /** @internal Change callback function */ private onControlChange; /** @internal Touch callback function */ private onControlTouch; /** @internal Reference to file input element */ fileInput: import("@angular/core").Signal<ElementRef<any> | undefined>; /** @internal Material icon references */ iconDelete: string; iconDownload: string; iconInsertDriveFile: string; iconCloudUpload: string; iconError: string; iconVisibility: string; iconVisibilityOff: string; /** * Computed audio tracks from uploaded files * @internal */ tracks: import("@angular/core").Signal<Track[]>; /** * Whether to show audio player controls * @internal */ addAudioPlayer: import("@angular/core").Signal<boolean>; /** * Gets track index for audio files * @param file - File to check * @returns Index in audio tracks array * @internal */ getIndexForTracks(file: File): number; /** * Handles drag over event * @param event - Drag event * @internal */ handleDragOver(event: DragEvent): void; /** * Handles drag leave event * @param event - Drag event * @internal */ handleDragLeave(event: DragEvent): void; /** * Handles file drop event * @param event - Drag event * @internal */ handleDrop(event: DragEvent): void; /** * Handles file input selection * @param event - Input change event * @internal */ handleFileSelect(event: Event): void; /** @internal Processes and validates uploaded files */ private processFiles; /** * Validates file size against maxFileSize * @param file - File to validate * @returns True if file size is valid * @internal */ validateFileSize(file: File): boolean; /** * Validates file type against allowed extensions * @param file - File to validate * @returns True if file type is valid * @internal */ validateFileType(file: File): boolean; /** * Handles file download * @param file - File to download * @internal */ handlefileDownload(file: File): void; /** * Removes a file from the list * @param file - File to remove * @internal */ handleRemove(file: File): void; /** * Checks if a file is an audio file * @param file - File to check * @returns True if audio file * @internal */ checkIfIsAudioFile(file: File): boolean; /** * Toggles audio player visibility * @internal */ handleAudioPlayerOpen(): void; /** @internal Cleans up object URLs */ ngDestroy(): void; /** * Writes form value to component * @param files - Array of files from form control */ writeValue(files: File[]): void; /** * Registers change callback * @param fn - Callback function for value changes */ registerOnChange(fn: (value: File[]) => void): void; /** * Registers touch callback * @param fn - Callback function for touch events */ registerOnTouched(fn: () => void): void; /** * Sets disabled state * @param isDisabled - Whether component is disabled */ setDisabledState(isDisabled: boolean): void; /** * Triggers file input dialog * @internal */ triggerFileInput(): void; /** @internal Form control reference */ private formControl; /** @internal Form control observable */ private formControl$; /** @internal Status changes observable */ private statusChanges$; /** @internal Value changes observable */ private stateChanges$; /** @internal Status signal */ private statusSignal; /** @internal State signal */ private stateSignal; /** * Handles blur events for validation * @internal */ handleBlur(): void; /** * Computes CSS classes for dropzone based on state * @internal */ dropzoneClass: import("@angular/core").Signal<string>; static ɵfac: i0.ɵɵFactoryDeclaration<DropzoneComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<DropzoneComponent, "st-file-dropzone", never, { "maxFiles": { "alias": "maxFiles"; "required": false; "isSignal": true; }; "maxFileSize": { "alias": "maxFileSize"; "required": false; "isSignal": true; }; "showFiles": { "alias": "showFiles"; "required": false; "isSignal": true; }; "extensions": { "alias": "extensions"; "required": true; "isSignal": true; }; "uploading": { "alias": "uploading"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "parentForm": { "alias": "parentForm"; "required": false; "isSignal": true; }; "formControlName": { "alias": "formControlName"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "fileDropped": "fileDropped"; "fileRemoved": "fileRemoved"; }, never, ["*"], true, never>; }