ngx-custom-material-file-input
Version:
File input management for Angular Material
160 lines (152 loc) • 6.5 kB
TypeScript
import * as i0 from '@angular/core';
import { InjectionToken, OnInit, OnDestroy, DoCheck, ElementRef, Renderer2, PipeTransform } from '@angular/core';
import { NgForm, FormGroupDirective, NgControl, ControlValueAccessor, ValidatorFn } from '@angular/forms';
import { MatFormFieldControl } from '@angular/material/form-field';
import { ErrorStateMatcher } from '@angular/material/core';
import { FocusMonitor } from '@angular/cdk/a11y';
import { Subject } from 'rxjs';
/**
* Optional token to provide custom configuration to the module
*/
declare const NGX_MAT_FILE_INPUT_CONFIG: InjectionToken<FileInputConfig>;
/**
* Provide additional configuration to dynamically customize the module injection
*/
interface FileInputConfig {
/**
* Unit used with the ByteFormatPipe, default value is *Byte*.
* The first letter is used for the short notation.
*/
sizeUnit: string;
}
/**
* The files to be uploaded
*/
declare class FileInput {
private _files;
private delimiter;
private _fileNames;
constructor(_files: File[] | null, delimiter?: string);
get files(): File[];
get fileNames(): string;
}
/** Base class for error state management */
declare class FileInputBase {
_defaultErrorStateMatcher: ErrorStateMatcher;
_parentForm: NgForm | null;
_parentFormGroup: FormGroupDirective | null;
ngControl: NgControl;
stateChanges: Subject<void>;
private _errorState;
constructor(_defaultErrorStateMatcher: ErrorStateMatcher, _parentForm: NgForm | null, _parentFormGroup: FormGroupDirective | null, ngControl: NgControl, stateChanges: Subject<void>);
/** Determines whether the control is in an error state */
get errorState(): boolean;
/** Triggers error state update */
updateErrorState(): void;
}
declare class FileInputComponent extends FileInputBase implements MatFormFieldControl<FileInput>, ControlValueAccessor, OnInit, OnDestroy, DoCheck {
private fm;
private _elementRef;
private _renderer;
_defaultErrorStateMatcher: ErrorStateMatcher;
ngControl: NgControl;
_parentForm: NgForm;
_parentFormGroup: FormGroupDirective;
static nextId: number;
focused: boolean;
controlType: string;
autofilled: boolean;
private _placeholder;
private _required;
private _multiple;
private _checkDuplicates;
private _previewUrls;
private _objectURLs;
private _internalValue;
valuePlaceholder: string;
accept: string | null;
errorStateMatcher: ErrorStateMatcher;
defaultIconBase64: string;
empty: boolean;
get errorState(): boolean;
id: string;
describedBy: string;
setDescribedByIds(ids: string[]): void;
get value(): FileInput | null;
set value(fileInput: FileInput | null);
get multiple(): boolean;
set multiple(value: boolean | string);
get checkDuplicates(): boolean;
set checkDuplicates(value: boolean | string);
get placeholder(): string;
set placeholder(plh: string);
get required(): boolean;
set required(req: boolean | string);
get shouldLabelFloat(): boolean;
get isDisabled(): boolean;
get disabled(): boolean;
set disabled(dis: boolean | string);
get previewUrls(): string[];
private _onChange;
private _onTouched;
get fileNames(): string;
constructor(fm: FocusMonitor, _elementRef: ElementRef, _renderer: Renderer2, _defaultErrorStateMatcher: ErrorStateMatcher, ngControl: NgControl, _parentForm: NgForm, _parentFormGroup: FormGroupDirective);
onContainerClick(event: MouseEvent): void;
writeValue(obj: FileInput | null): void;
registerOnChange(fn: (_: any) => void): void;
registerOnTouched(fn: any): void;
clear(event?: Event): void;
change(event: Event): void;
private updatePreviewUrls;
removeFile(index: number): void;
blur(): void;
setDisabledState(isDisabled: boolean): void;
open(): void;
ngOnInit(): void;
ngOnDestroy(): void;
ngDoCheck(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<FileInputComponent, [null, null, null, null, { optional: true; self: true; }, { optional: true; }, { optional: true; }]>;
static ɵcmp: i0.ɵɵComponentDeclaration<FileInputComponent, "ngx-mat-file-input", never, { "autofilled": { "alias": "autofilled"; "required": false; }; "valuePlaceholder": { "alias": "valuePlaceholder"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "defaultIconBase64": { "alias": "defaultIconBase64"; "required": false; }; "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "checkDuplicates": { "alias": "checkDuplicates"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, {}, never, never, true, never>;
}
declare class ByteFormatPipe implements PipeTransform {
private config;
private unit;
constructor(config: FileInputConfig);
transform(value: any, args?: any): any;
private formatBytes;
static ɵfac: i0.ɵɵFactoryDeclaration<ByteFormatPipe, [{ optional: true; }]>;
static ɵpipe: i0.ɵɵPipeDeclaration<ByteFormatPipe, "byteFormat", true>;
}
declare class FileValidator {
/**
* Function to control content of files
*
* @param bytes max number of bytes allowed
*
* @returns Validator function
*/
static maxContentSize(bytes: number): ValidatorFn;
/**
* Validator function to validate accepted file formats
*
* @param acceptedMimeTypes Array of accepted MIME types (e.g., ['image/jpeg', 'application/pdf'])
* @returns Validator function
*/
static acceptedMimeTypes(acceptedMimeTypes: string[]): ValidatorFn;
/**
* Validator function to validate the min number of uploaded files
*
* @param minCount Number of minimum files to upload
* @returns Validator function
*/
static minFileCount(minCount: number): ValidatorFn;
/**
* Validator function to validate the max number of uploaded files
*
* @param maxCount Number of maximum files to upload
* @returns Validator function
*/
static maxFileCount(maxCount: number): ValidatorFn;
}
export { ByteFormatPipe, FileInput, FileInputComponent, FileValidator, NGX_MAT_FILE_INPUT_CONFIG };
export type { FileInputConfig };