@ngx-mce/file-input 21.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +114 -0
  2. package/fesm2022/ngx-mce-file-input.mjs +333 -0
  3. package/fesm2022/ngx-mce-file-input.mjs.map +1 -0
  4. package/package.json +58 -0
  5. package/types/ngx-mce-file-input.d.ts +118 -0
package/README.md ADDED
@@ -0,0 +1,114 @@
1
+ # Angular Material File Input for @angular/material 7.x, 8.x, 9.x, 10.x, 11.x, 12.x, 13.x, 14.x, 15.x, 16.x
2
+
3
+ [![Build Status](https://travis-ci.com/h2qutc/angular-material-components.svg?branch=master)](https://travis-ci.com/h2qutc/angular-material-components)
4
+ [![License](https://img.shields.io/npm/l/angular-material-components.svg)](https://www.npmjs.com/package/angular-material-components)
5
+ [![npm version](https://badge.fury.io/js/%40angular-material-components%2Ffile-input.svg)](https://www.npmjs.com/package/@ngx-mce/file-input)
6
+
7
+ ## Description
8
+
9
+ An Angular Material File Input.
10
+
11
+ <a href="https://buymeacoffee.com/fbf.prog64" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 60px !important;width: 217px !important;" ></a>
12
+
13
+ ## DEMO
14
+
15
+ @see [DEMO stackblitz](https://stackblitz.com/edit/demo-ngx-mat-file-input)
16
+
17
+ @see [LIVE DEMO](https://h2qutc.github.io/angular-material-components/)
18
+
19
+ ![Alt Text](demo_file_input.png)
20
+
21
+ Choose the version corresponding to your Angular version:
22
+
23
+ | Angular | @ngx-mce/file-input |
24
+ | ------- | ------------------------------- |
25
+ | 16 | 16.x+ |
26
+ | 15 | 15.x+ OR 9.x+ for legacy import |
27
+ | 14 | 8.x+ |
28
+ | 13 | 7.x+ |
29
+ | 12 | 6.x+ |
30
+ | 11 | 5.x+ |
31
+ | 10 | 4.x+ |
32
+ | 9 | 2.x+ |
33
+ | 8 | 2.x+ |
34
+ | 7 | 2.x+ |
35
+
36
+ ## Getting started
37
+
38
+ ```
39
+ npm install --save @ngx-mce/file-input
40
+ ```
41
+
42
+ ## Setup
43
+
44
+ ```
45
+ import { NgxMatFileInputModule } from '@ngx-mce/file-input';
46
+
47
+ @NgModule({
48
+ ...
49
+ imports: [
50
+ ...
51
+ NgxMatFileInputModule
52
+ ]
53
+ ...
54
+ })
55
+ export class AppModule { }
56
+ ```
57
+
58
+ @see
59
+ [src/app/demo-fileinput/demo-fileinput.module.ts](src/app/demo-fileinput/demo-fileinput.module.ts)
60
+
61
+ ## Using the component
62
+
63
+ ### File Input (ngx-mat-file-input)
64
+
65
+ ```
66
+ <mat-form-field>
67
+ <ngx-mat-file-input [formControl]="fileControl" [multiple]="multiple" [accept]="accept" [color]="color">
68
+ </ngx-mat-file-input>
69
+ </mat-form-field>
70
+ ```
71
+
72
+ #### You can provide a custom icon by using the directive _ngxMatFileInputIcon_
73
+
74
+ ```
75
+ <mat-form-field>
76
+ <ngx-mat-file-input [formControl]="fileControl" [multiple]="multiple" [accept]="accept"
77
+ [color]="color">
78
+ <mat-icon ngxMatFileInputIcon>folder</mat-icon>
79
+ </ngx-mat-file-input>
80
+ </mat-form-field>
81
+ ```
82
+
83
+ #### You can use with all properties of MatFormField such as appearance variants, hint...
84
+
85
+ ```
86
+ <mat-form-field appearance="outline">
87
+ <ngx-mat-file-input [formControl]="file3Control">
88
+ </ngx-mat-file-input>
89
+ <mat-hint>Hint</mat-hint>
90
+ </mat-form-field>
91
+ ```
92
+
93
+ #### List of @Input
94
+
95
+ | @Input | Type | Default value | Description |
96
+ | ------------ | ------------ | ------------- | ------------------------------------------------------------------------------------------------------------------------------------ |
97
+ | **disabled** | boolean | null | If true, the file input is readonly. |
98
+ | **multiple** | boolean | false | If true, the file input allows the user to select more than one file. |
99
+ | **accept** | string | null | Limiting accepted file types (For example: accept="image/png, image/jpeg" or accept=".png, .jpg, .jpeg" — Accept PNG or JPEG files.) |
100
+ | **color** | ThemePalette | null | Theme color palette for the component. |
101
+
102
+ ## Theming
103
+
104
+ - @see @angular/material
105
+ [Using a pre-built theme](https://material.angular.io/guide/theming#using-a-pre-built-theme)
106
+ - Add the Material Design icon font to your index.html
107
+
108
+ ```
109
+ <link href="https://fonts.googleapis.com/icon?family=Material+Icons&display=block" rel="stylesheet">
110
+ ```
111
+
112
+ ## License
113
+
114
+ MIT
package/fesm2022/ngx-mce-file-input.mjs ADDED
@@ -0,0 +1,333 @@
1
+ import { coerceBooleanProperty } from '@angular/cdk/coercion';
2
+ import * as i0 from '@angular/core';
3
+ import { Directive, viewChild, input, forwardRef, Input, Optional, Self, ViewEncapsulation, Component } from '@angular/core';
4
+ import * as i5 from '@angular/material/button';
5
+ import { MatButtonModule } from '@angular/material/button';
6
+ import { MatFormFieldControl } from '@angular/material/form-field';
7
+ import * as i4 from '@angular/material/icon';
8
+ import { MatIconModule } from '@angular/material/icon';
9
+ import { Subject } from 'rxjs';
10
+ import * as i1 from '@angular/cdk/platform';
11
+ import * as i2 from '@angular/forms';
12
+ import * as i3 from '@angular/material/core';
13
+
14
+ let nextUniqueId = 0;
15
+ class NgxMatInputMixinBase {
16
+ constructor(_defaultErrorStateMatcher, _parentForm, _parentFormGroup,
17
+ /** @docs-private */
18
+ ngControl) {
19
+ this._defaultErrorStateMatcher = _defaultErrorStateMatcher;
20
+ this._parentForm = _parentForm;
21
+ this._parentFormGroup = _parentFormGroup;
22
+ this.ngControl = ngControl;
23
+ this.stateChanges = new Subject();
24
+ }
25
+ }
26
+ class NgxMatFileInputIcon {
27
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgxMatFileInputIcon, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
28
+ /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.3", type: NgxMatFileInputIcon, isStandalone: true, selector: "[ngxMatFileInputIcon]", ngImport: i0 }); }
29
+ }
30
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgxMatFileInputIcon, decorators: [{
31
+ type: Directive,
32
+ args: [{
33
+ selector: '[ngxMatFileInputIcon]',
34
+ }]
35
+ }] });
36
+ class NgxMatFileInputComponent extends NgxMatInputMixinBase {
37
+ get disabled() {
38
+ if (this.ngControl && this.ngControl.disabled !== null) {
39
+ return this.ngControl.disabled;
40
+ }
41
+ return this._disabled;
42
+ }
43
+ set disabled(value) {
44
+ this._disabled = coerceBooleanProperty(value);
45
+ if (this.focused) {
46
+ this.focused = false;
47
+ this.stateChanges.next();
48
+ }
49
+ }
50
+ get id() {
51
+ return this._id;
52
+ }
53
+ set id(value) {
54
+ this._id = value || this._uid;
55
+ }
56
+ get multiple() {
57
+ return this._multiple;
58
+ }
59
+ set multiple(value) {
60
+ this._multiple = coerceBooleanProperty(value);
61
+ }
62
+ get required() {
63
+ return this._required;
64
+ }
65
+ set required(value) {
66
+ this._required = coerceBooleanProperty(value);
67
+ }
68
+ get value() {
69
+ return this._value;
70
+ }
71
+ set value(value) {
72
+ this._value = value;
73
+ }
74
+ get readonly() {
75
+ return this._readonly;
76
+ }
77
+ set readonly(value) {
78
+ this._readonly = coerceBooleanProperty(value);
79
+ }
80
+ /**
81
+ * Limiting accepted file types
82
+ * Example: accept="image/png, image/jpeg" or accept=".png, .jpg, .jpeg" — Accept PNG or JPEG files.
83
+ */
84
+ get accept() {
85
+ return this._accept;
86
+ }
87
+ set accept(value) {
88
+ this._accept = value;
89
+ }
90
+ constructor(_elementRef, _platform, _cd, ngControl, _parentForm, _parentFormGroup, _defaultErrorStateMatcher) {
91
+ super(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl);
92
+ this._elementRef = _elementRef;
93
+ this._platform = _platform;
94
+ this._cd = _cd;
95
+ this.ngControl = ngControl;
96
+ this._inputFileRef = viewChild('inputFile', ...(ngDevMode ? [{ debugName: "_inputFileRef" }] : []));
97
+ this._inputValueRef = viewChild('inputValue', ...(ngDevMode ? [{ debugName: "_inputValueRef" }] : []));
98
+ this.color = input('primary', ...(ngDevMode ? [{ debugName: "color" }] : []));
99
+ this.fileNames = null;
100
+ this._uid = `ngx-mat-fileinput-${nextUniqueId++}`;
101
+ this.stateChanges = new Subject();
102
+ this.focused = false;
103
+ this.controlType = 'ngx-mat-file-input';
104
+ this.autofilled = false;
105
+ /** Function when touched */
106
+ this._onTouched = () => { };
107
+ /** Function when changed */
108
+ this._onChange = () => { };
109
+ this._disabled = false;
110
+ this._multiple = false;
111
+ this.placeholder = 'Choose a file';
112
+ this.separator = input(',', ...(ngDevMode ? [{ debugName: "separator" }] : []));
113
+ this._required = false;
114
+ this._readonly = true;
115
+ this.id = this.id;
116
+ if (this.ngControl) {
117
+ this.ngControl.valueAccessor = this;
118
+ }
119
+ }
120
+ ngOnChanges() {
121
+ this.stateChanges.next();
122
+ }
123
+ ngOnDestroy() {
124
+ this.stateChanges.complete();
125
+ }
126
+ ngDoCheck() {
127
+ if (this.ngControl) {
128
+ this.updateErrorState();
129
+ }
130
+ }
131
+ updateErrorState() {
132
+ const control = this.ngControl ? this.ngControl.control : null;
133
+ this.errorState = (this.errorStateMatcher ?? this._defaultErrorStateMatcher).isErrorState(control, this._parentForm);
134
+ }
135
+ // Implemented as part of ControlValueAccessor.
136
+ writeValue(value) {
137
+ this._updateInputValue(value);
138
+ }
139
+ // Implemented as part of ControlValueAccessor.
140
+ registerOnChange(fn) {
141
+ this._onChange = fn;
142
+ }
143
+ // Implemented as part of ControlValueAccessor.
144
+ registerOnTouched(fn) {
145
+ this._onTouched = fn;
146
+ }
147
+ // Implemented as part of ControlValueAccessor.
148
+ setDisabledState(isDisabled) {
149
+ this.disabled = isDisabled;
150
+ this.stateChanges.next();
151
+ }
152
+ /** Focuses the input. */
153
+ focus(options) {
154
+ this._inputValueRef().nativeElement.focus(options);
155
+ }
156
+ _focusChanged(isFocused) {
157
+ if (isFocused !== this.focused && (!this.readonly || !isFocused)) {
158
+ this.focused = isFocused;
159
+ this.stateChanges.next();
160
+ }
161
+ }
162
+ /** Mark the field as touched */
163
+ _markAsTouched() {
164
+ this._onTouched();
165
+ this._cd.markForCheck();
166
+ this.stateChanges.next();
167
+ }
168
+ _isBadInput() {
169
+ let validity = this._inputValueRef().nativeElement.validity;
170
+ return validity && validity.badInput;
171
+ }
172
+ get empty() {
173
+ return !this._inputValueRef().nativeElement.value && !this._isBadInput() && !this.autofilled;
174
+ }
175
+ get shouldLabelFloat() {
176
+ return this.focused || !this.empty;
177
+ }
178
+ setDescribedByIds(ids) {
179
+ this._ariaDescribedby = ids.join(' ');
180
+ }
181
+ openFilePicker(event) {
182
+ this._inputFileRef().nativeElement.click();
183
+ if (event) {
184
+ event.preventDefault();
185
+ event.stopPropagation();
186
+ }
187
+ this._markAsTouched();
188
+ }
189
+ handleFiles(filelist) {
190
+ if (filelist.length > 0) {
191
+ const files = new Array();
192
+ for (let i = 0; i < filelist.length; i++) {
193
+ files.push(filelist.item(i));
194
+ }
195
+ this._updateInputValue(files);
196
+ this._resetInputFile();
197
+ this._onChange(this.multiple ? files : files[0]);
198
+ }
199
+ }
200
+ /** Handles a click on the control's container. */
201
+ onContainerClick(event) { }
202
+ _resetInputFile() {
203
+ this._inputFileRef().nativeElement.value = '';
204
+ }
205
+ _updateInputValue(files) {
206
+ let text = null;
207
+ if (files) {
208
+ if (Array.isArray(files)) {
209
+ text = this._multiple ? files.map((x) => x.name).join(this.separator()) : files[0].name;
210
+ }
211
+ else {
212
+ text = files.name != null ? files.name : null;
213
+ }
214
+ }
215
+ this._inputValueRef().nativeElement.value = text;
216
+ }
217
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgxMatFileInputComponent, deps: [{ token: i0.ElementRef }, { token: i1.Platform }, { token: i0.ChangeDetectorRef }, { token: i2.NgControl, optional: true, self: true }, { token: i2.NgForm, optional: true }, { token: i2.FormGroupDirective, optional: true }, { token: i3.ErrorStateMatcher }], target: i0.ɵɵFactoryTarget.Component }); }
218
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.1.3", type: NgxMatFileInputComponent, isStandalone: true, selector: "ngx-mat-file-input", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, separator: { classPropertyName: "separator", publicName: "separator", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, errorStateMatcher: { classPropertyName: "errorStateMatcher", publicName: "errorStateMatcher", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: false, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngx-mat-file-input" }, providers: [
219
+ {
220
+ provide: MatFormFieldControl,
221
+ useExisting: forwardRef((() => NgxMatFileInputComponent)),
222
+ },
223
+ ], viewQueries: [{ propertyName: "_inputFileRef", first: true, predicate: ["inputFile"], descendants: true, isSignal: true }, { propertyName: "_inputValueRef", first: true, predicate: ["inputValue"], descendants: true, isSignal: true }], exportAs: ["ngx-mat-file-input"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<input\r\n #inputValue\r\n autocomplete=\"off\"\r\n class=\"mat-mdc-input-element mat-mdc-form-field-input-control mdc-text-field__input\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [required]=\"required\"\r\n [attr.readonly]=\"readonly || null\"\r\n [attr.aria-describedby]=\"_ariaDescribedby || null\"\r\n [attr.aria-invalid]=\"errorState\"\r\n [attr.aria-required]=\"required.toString()\"\r\n/>\r\n<div class=\"mat-mdc-form-field-suffix\">\r\n <button\r\n matSuffix\r\n mat-icon-button\r\n [color]=\"color()\"\r\n class=\"button-browse\"\r\n (click)=\"openFilePicker($event)\"\r\n type=\"button\"\r\n [disabled]=\"disabled\"\r\n >\r\n <ng-content select=\"[ngxMatFileInputIcon]\">\r\n <mat-icon class=\"ngx-mat-file-input--default-icon\">attach_file</mat-icon>\r\n </ng-content>\r\n </button>\r\n</div>\r\n<input\r\n type=\"file\"\r\n #inputFile\r\n (change)=\"handleFiles($event.target.files)\"\r\n class=\"input-file\"\r\n [multiple]=\"multiple\"\r\n [accept]=\"accept\"\r\n/>\r\n", styles: [".mat-mdc-form-field-appearance-outline .mat-form-field-prefix .ngx-mat-file-input--default-icon,.mat-mdc-form-field-appearance-outline .mat-form-field-suffix .ngx-mat-file-input--default-icon{width:1em}.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-prefix .ngx-mat-file-input--default-icon,.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-suffix .ngx-mat-file-input--default-icon{display:block;width:1.5em;height:1.5em}.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-prefix .mat-icon-button .ngx-mat-file-input--default-icon,.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-suffix .mat-icon-button .ngx-mat-file-input--default-icon{margin:auto}.ngx-mat-file-input{display:flex;line-height:18px;align-items:center}.ngx-mat-file-input .input-file{display:block;visibility:hidden;width:0;height:0}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }], encapsulation: i0.ViewEncapsulation.None }); }
224
+ }
225
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImport: i0, type: NgxMatFileInputComponent, decorators: [{
226
+ type: Component,
227
+ args: [{ selector: 'ngx-mat-file-input', encapsulation: ViewEncapsulation.None, host: {
228
+ class: 'ngx-mat-file-input',
229
+ }, providers: [
230
+ {
231
+ provide: MatFormFieldControl,
232
+ useExisting: forwardRef((() => NgxMatFileInputComponent)),
233
+ },
234
+ ], exportAs: 'ngx-mat-file-input', imports: [MatIconModule, MatButtonModule], template: "<input\r\n #inputValue\r\n autocomplete=\"off\"\r\n class=\"mat-mdc-input-element mat-mdc-form-field-input-control mdc-text-field__input\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [required]=\"required\"\r\n [attr.readonly]=\"readonly || null\"\r\n [attr.aria-describedby]=\"_ariaDescribedby || null\"\r\n [attr.aria-invalid]=\"errorState\"\r\n [attr.aria-required]=\"required.toString()\"\r\n/>\r\n<div class=\"mat-mdc-form-field-suffix\">\r\n <button\r\n matSuffix\r\n mat-icon-button\r\n [color]=\"color()\"\r\n class=\"button-browse\"\r\n (click)=\"openFilePicker($event)\"\r\n type=\"button\"\r\n [disabled]=\"disabled\"\r\n >\r\n <ng-content select=\"[ngxMatFileInputIcon]\">\r\n <mat-icon class=\"ngx-mat-file-input--default-icon\">attach_file</mat-icon>\r\n </ng-content>\r\n </button>\r\n</div>\r\n<input\r\n type=\"file\"\r\n #inputFile\r\n (change)=\"handleFiles($event.target.files)\"\r\n class=\"input-file\"\r\n [multiple]=\"multiple\"\r\n [accept]=\"accept\"\r\n/>\r\n", styles: [".mat-mdc-form-field-appearance-outline .mat-form-field-prefix .ngx-mat-file-input--default-icon,.mat-mdc-form-field-appearance-outline .mat-form-field-suffix .ngx-mat-file-input--default-icon{width:1em}.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-prefix .ngx-mat-file-input--default-icon,.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-suffix .ngx-mat-file-input--default-icon{display:block;width:1.5em;height:1.5em}.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-prefix .mat-icon-button .ngx-mat-file-input--default-icon,.mat-mdc-form-field:not(.mat-form-field-appearance-outline) .mat-form-field-suffix .mat-icon-button .ngx-mat-file-input--default-icon{margin:auto}.ngx-mat-file-input{display:flex;line-height:18px;align-items:center}.ngx-mat-file-input .input-file{display:block;visibility:hidden;width:0;height:0}\n"] }]
235
+ }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.Platform }, { type: i0.ChangeDetectorRef }, { type: i2.NgControl, decorators: [{
236
+ type: Optional
237
+ }, {
238
+ type: Self
239
+ }] }, { type: i2.NgForm, decorators: [{
240
+ type: Optional
241
+ }] }, { type: i2.FormGroupDirective, decorators: [{
242
+ type: Optional
243
+ }] }, { type: i3.ErrorStateMatcher }], propDecorators: { _inputFileRef: [{ type: i0.ViewChild, args: ['inputFile', { isSignal: true }] }], _inputValueRef: [{ type: i0.ViewChild, args: ['inputValue', { isSignal: true }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], disabled: [{
244
+ type: Input
245
+ }], id: [{
246
+ type: Input
247
+ }], multiple: [{
248
+ type: Input
249
+ }], placeholder: [{
250
+ type: Input
251
+ }], separator: [{ type: i0.Input, args: [{ isSignal: true, alias: "separator", required: false }] }], required: [{
252
+ type: Input
253
+ }], errorStateMatcher: [{
254
+ type: Input
255
+ }], value: [{
256
+ type: Input
257
+ }], readonly: [{
258
+ type: Input
259
+ }], accept: [{
260
+ type: Input
261
+ }] } });
262
+
263
+ function calculFileSize(number) {
264
+ if (number < 1024) {
265
+ return number + 'bytes';
266
+ }
267
+ else if (number >= 1024 && number < 1048576) {
268
+ return (number / 1024).toFixed(1) + 'KB';
269
+ }
270
+ else if (number >= 1048576) {
271
+ return (number / 1048576).toFixed(1) + 'MB';
272
+ }
273
+ }
274
+
275
+ /**
276
+ * Validator for size of file
277
+ * @param max Max of size of file (in bytes)
278
+ */
279
+ function MaxSizeValidator(max) {
280
+ return (ctrl) => {
281
+ max = Number(max);
282
+ if (isNaN(max)) {
283
+ throw 'MaxSizeValidator: max of size of file is invalid';
284
+ }
285
+ if (!ctrl.value)
286
+ return null;
287
+ let files = ctrl.value;
288
+ if (!Array.isArray(ctrl.value)) {
289
+ files = [ctrl.value];
290
+ }
291
+ if (!files.length)
292
+ return null;
293
+ const add = (a, b) => a + b;
294
+ const sumSize = files.map((x) => x.size).reduce(add);
295
+ if (sumSize > max) {
296
+ return {
297
+ maxSize: true,
298
+ };
299
+ }
300
+ return null;
301
+ };
302
+ }
303
+
304
+ /**
305
+ * Validator for input file accept
306
+ * @param accept Allowable type of file
307
+ */
308
+ function AcceptValidator(accept) {
309
+ return (ctrl) => {
310
+ if (!accept) {
311
+ throw 'AcceptValidator: allowable type of file can not be empty';
312
+ }
313
+ if (ctrl.value == null)
314
+ return null;
315
+ if (!accept.includes(ctrl.value.type)) {
316
+ return {
317
+ accept: true,
318
+ };
319
+ }
320
+ return null;
321
+ };
322
+ }
323
+
324
+ /*
325
+ * Public API Surface of file-input
326
+ */
327
+
328
+ /**
329
+ * Generated bundle index. Do not edit.
330
+ */
331
+
332
+ export { AcceptValidator, MaxSizeValidator, NgxMatFileInputComponent, NgxMatFileInputIcon, calculFileSize };
333
+ //# sourceMappingURL=ngx-mce-file-input.mjs.map
package/fesm2022/ngx-mce-file-input.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ngx-mce-file-input.mjs","sources":["../../../../projects/file-input/src/lib/file-input.component.ts","../../../../projects/file-input/src/lib/file-input.component.html","../../../../projects/file-input/src/lib/file-input-helper.ts","../../../../projects/file-input/src/lib/validators/max-size.validator.ts","../../../../projects/file-input/src/lib/validators/accept.validator.ts","../../../../projects/file-input/src/public-api.ts","../../../../projects/file-input/src/ngx-mce-file-input.ts"],"sourcesContent":["import { coerceBooleanProperty } from '@angular/cdk/coercion';\nimport { Platform } from '@angular/cdk/platform';\n\nimport {\n ChangeDetectorRef,\n Component,\n Directive,\n DoCheck,\n ElementRef,\n forwardRef,\n Input,\n input,\n OnDestroy,\n Optional,\n Self,\n viewChild,\n ViewEncapsulation,\n} from '@angular/core';\nimport { ControlValueAccessor, FormGroupDirective, NgControl, NgForm } from '@angular/forms';\nimport { MatButtonModule } from '@angular/material/button';\nimport { ErrorStateMatcher, ThemePalette } from '@angular/material/core';\nimport { MatFormFieldControl } from '@angular/material/form-field';\nimport { MatIconModule } from '@angular/material/icon';\nimport { Subject } from 'rxjs';\nimport { FileOrArrayFile } from './file-input-type';\n\nlet nextUniqueId = 0;\n\nclass NgxMatInputMixinBase {\n readonly stateChanges = new Subject<void>();\n\n constructor(\n public _defaultErrorStateMatcher: ErrorStateMatcher,\n public _parentForm: NgForm,\n public _parentFormGroup: FormGroupDirective,\n /** @docs-private */\n public ngControl: NgControl,\n ) {}\n}\n\n@Directive({\n selector: '[ngxMatFileInputIcon]',\n})\nexport class NgxMatFileInputIcon {}\n\n@Component({\n selector: 'ngx-mat-file-input',\n templateUrl: 'file-input.component.html',\n styleUrls: ['file-input.component.scss'],\n encapsulation: ViewEncapsulation.None,\n host: {\n class: 'ngx-mat-file-input',\n },\n providers: [\n {\n provide: MatFormFieldControl,\n useExisting: forwardRef(() => NgxMatFileInputComponent),\n },\n ],\n exportAs: 'ngx-mat-file-input',\n imports: [MatIconModule, MatButtonModule],\n})\nexport class NgxMatFileInputComponent\n extends NgxMatInputMixinBase\n implements MatFormFieldControl<FileOrArrayFile>, OnDestroy, DoCheck, ControlValueAccessor\n{\n private _inputFileRef = viewChild<ElementRef>('inputFile');\n private _inputValueRef = viewChild<ElementRef>('inputValue');\n\n readonly color = input<ThemePalette>('primary');\n\n public fileNames: string = null;\n\n protected _uid = `ngx-mat-fileinput-${nextUniqueId++}`;\n protected _previousNativeValue: any;\n _ariaDescribedby: string;\n\n readonly stateChanges: Subject<void> = new Subject<void>();\n focused: boolean = false;\n errorState: boolean;\n controlType: string = 'ngx-mat-file-input';\n autofilled: boolean = false;\n\n /** Function when touched */\n _onTouched = () => {};\n\n /** Function when changed */\n _onChange: (value: FileOrArrayFile) => void = () => {};\n\n @Input()\n get disabled(): boolean {\n if (this.ngControl && this.ngControl.disabled !== null) {\n return this.ngControl.disabled;\n }\n return this._disabled;\n }\n set disabled(value: boolean) {\n this._disabled = coerceBooleanProperty(value);\n if (this.focused) {\n this.focused = false;\n this.stateChanges.next();\n }\n }\n protected _disabled = false;\n\n @Input()\n get id(): string {\n return this._id;\n }\n set id(value: string) {\n this._id = value || this._uid;\n }\n protected _id: string;\n\n @Input()\n get multiple(): boolean {\n return this._multiple;\n }\n set multiple(value: boolean) {\n this._multiple = coerceBooleanProperty(value);\n }\n protected _multiple = false;\n\n @Input()\n placeholder = 'Choose a file';\n separator = input<string>(',');\n\n @Input()\n get required(): boolean {\n return this._required;\n }\n set required(value: boolean) {\n this._required = coerceBooleanProperty(value);\n }\n protected _required = false;\n\n @Input() errorStateMatcher: ErrorStateMatcher;\n\n @Input()\n get value(): FileOrArrayFile {\n return this._value;\n }\n set value(value: FileOrArrayFile) {\n this._value = value;\n }\n protected _value: FileOrArrayFile;\n\n @Input()\n get readonly(): boolean {\n return this._readonly;\n }\n set readonly(value: boolean) {\n this._readonly = coerceBooleanProperty(value);\n }\n private _readonly = true;\n\n /**\n * Limiting accepted file types\n * Example: accept=\"image/png, image/jpeg\" or accept=\".png, .jpg, .jpeg\" — Accept PNG or JPEG files.\n */\n @Input()\n get accept(): string {\n return this._accept;\n }\n set accept(value: string) {\n this._accept = value;\n }\n private _accept: string;\n\n constructor(\n protected _elementRef: ElementRef<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>,\n protected _platform: Platform,\n private _cd: ChangeDetectorRef,\n @Optional() @Self() public ngControl: NgControl,\n @Optional() _parentForm: NgForm,\n @Optional() _parentFormGroup: FormGroupDirective,\n _defaultErrorStateMatcher: ErrorStateMatcher,\n ) {\n super(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl);\n\n this.id = this.id;\n\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n ngOnChanges() {\n this.stateChanges.next();\n }\n\n ngOnDestroy() {\n this.stateChanges.complete();\n }\n\n ngDoCheck() {\n if (this.ngControl) {\n this.updateErrorState();\n }\n }\n\n updateErrorState() {\n const control = this.ngControl ? this.ngControl.control : null;\n\n this.errorState = (this.errorStateMatcher ?? this._defaultErrorStateMatcher).isErrorState(\n control,\n this._parentForm,\n );\n }\n\n // Implemented as part of ControlValueAccessor.\n writeValue(value: FileOrArrayFile): void {\n this._updateInputValue(value);\n }\n\n // Implemented as part of ControlValueAccessor.\n registerOnChange(fn: (value: any) => void): void {\n this._onChange = fn;\n }\n\n // Implemented as part of ControlValueAccessor.\n registerOnTouched(fn: () => void): void {\n this._onTouched = fn;\n }\n\n // Implemented as part of ControlValueAccessor.\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.stateChanges.next();\n }\n\n /** Focuses the input. */\n focus(options?: FocusOptions): void {\n this._inputValueRef().nativeElement.focus(options);\n }\n\n _focusChanged(isFocused: boolean) {\n if (isFocused !== this.focused && (!this.readonly || !isFocused)) {\n this.focused = isFocused;\n this.stateChanges.next();\n }\n }\n\n /** Mark the field as touched */\n _markAsTouched() {\n this._onTouched();\n this._cd.markForCheck();\n this.stateChanges.next();\n }\n\n protected _isBadInput() {\n let validity = (this._inputValueRef().nativeElement as HTMLInputElement).validity;\n return validity && validity.badInput;\n }\n\n get empty(): boolean {\n return !this._inputValueRef().nativeElement.value && !this._isBadInput() && !this.autofilled;\n }\n\n get shouldLabelFloat(): boolean {\n return this.focused || !this.empty;\n }\n\n setDescribedByIds(ids: string[]) {\n this._ariaDescribedby = ids.join(' ');\n }\n\n openFilePicker(event?: MouseEvent) {\n this._inputFileRef().nativeElement.click();\n if (event) {\n event.preventDefault();\n event.stopPropagation();\n }\n this._markAsTouched();\n }\n\n handleFiles(filelist: FileList) {\n if (filelist.length > 0) {\n const files: Array<File> = new Array();\n for (let i = 0; i < filelist.length; i++) {\n files.push(filelist.item(i));\n }\n this._updateInputValue(files);\n this._resetInputFile();\n this._onChange(this.multiple ? files : files[0]);\n }\n }\n\n /** Handles a click on the control's container. */\n onContainerClick(event: MouseEvent) {}\n\n private _resetInputFile() {\n this._inputFileRef().nativeElement.value = '';\n }\n\n private _updateInputValue(files: FileOrArrayFile) {\n let text = null;\n if (files) {\n if (Array.isArray(files)) {\n text = this._multiple ? files.map((x) => x.name).join(this.separator()) : files[0].name;\n } else {\n text = files.name != null ? files.name : null;\n }\n }\n\n this._inputValueRef().nativeElement.value = text;\n }\n}\n","<input\r\n #inputValue\r\n autocomplete=\"off\"\r\n class=\"mat-mdc-input-element mat-mdc-form-field-input-control mdc-text-field__input\"\r\n [attr.id]=\"id\"\r\n [attr.placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [required]=\"required\"\r\n [attr.readonly]=\"readonly || null\"\r\n [attr.aria-describedby]=\"_ariaDescribedby || null\"\r\n [attr.aria-invalid]=\"errorState\"\r\n [attr.aria-required]=\"required.toString()\"\r\n/>\r\n<div class=\"mat-mdc-form-field-suffix\">\r\n <button\r\n matSuffix\r\n mat-icon-button\r\n [color]=\"color()\"\r\n class=\"button-browse\"\r\n (click)=\"openFilePicker($event)\"\r\n type=\"button\"\r\n [disabled]=\"disabled\"\r\n >\r\n <ng-content select=\"[ngxMatFileInputIcon]\">\r\n <mat-icon class=\"ngx-mat-file-input--default-icon\">attach_file</mat-icon>\r\n </ng-content>\r\n </button>\r\n</div>\r\n<input\r\n type=\"file\"\r\n #inputFile\r\n (change)=\"handleFiles($event.target.files)\"\r\n class=\"input-file\"\r\n [multiple]=\"multiple\"\r\n [accept]=\"accept\"\r\n/>\r\n","export function calculFileSize(number: number): string {\n if (number < 1024) {\n return number + 'bytes';\n } else if (number >= 1024 && number < 1048576) {\n return (number / 1024).toFixed(1) + 'KB';\n } else if (number >= 1048576) {\n return (number / 1048576).toFixed(1) + 'MB';\n }\n}\n","import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';\n\n/**\n * Validator for size of file\n * @param max Max of size of file (in bytes)\n */\nexport function MaxSizeValidator(max: number): ValidatorFn {\n return (ctrl: AbstractControl): ValidationErrors | null => {\n max = Number(max);\n if (isNaN(max)) {\n throw 'MaxSizeValidator: max of size of file is invalid';\n }\n if (!ctrl.value) return null;\n let files: File[] = ctrl.value;\n if (!Array.isArray(ctrl.value)) {\n files = [ctrl.value];\n }\n if (!files.length) return null;\n const add = (a: any, b: any): number => a + b;\n const sumSize = files.map((x) => x.size).reduce(add);\n if (sumSize > max) {\n return {\n maxSize: true,\n };\n }\n return null;\n };\n}\n","import { AbstractControl, ValidationErrors, ValidatorFn } from '@angular/forms';\n\n/**\n * Validator for input file accept\n * @param accept Allowable type of file\n */\nexport function AcceptValidator(accept: string): ValidatorFn {\n return (ctrl: AbstractControl): ValidationErrors | null => {\n if (!accept) {\n throw 'AcceptValidator: allowable type of file can not be empty';\n }\n\n if (ctrl.value == null) return null;\n\n if (!accept.includes(ctrl.value.type)) {\n return {\n accept: true,\n };\n }\n\n return null;\n };\n}\n","/*\n * Public API Surface of file-input\n */\n\nexport * from './lib/file-input.component';\n\nexport * from './lib/file-input-type';\nexport * from './lib/file-input-helper';\nexport * from './lib/validators';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
package/package.json ADDED
@@ -0,0 +1,58 @@
1
+ {
2
+ "name": "@ngx-mce/file-input",
3
+ "version": "21.1.0",
4
+ "description": "Angular Material File Input",
5
+ "author": "HO Hong Quan",
6
+ "repository": {
7
+ "type": "git",
8
+ "url": "https://github.com/fbf-prog64/angular-material-components.git"
9
+ },
10
+ "bugs": {
11
+ "url": "https://github.com/fbf-prog64/angular-material-components/issues"
12
+ },
13
+ "homepage": "https://github.com/fbf-prog64/angular-material-components",
14
+ "keywords": [
15
+ "angular",
16
+ "angular2",
17
+ "angular 12",
18
+ "angular 13",
19
+ "angular 14",
20
+ "angular 15",
21
+ "angular 16",
22
+ "angular 17",
23
+ "angular 18",
24
+ "angular 19",
25
+ "angular 20",
26
+ "angular-material",
27
+ "angular material file input",
28
+ "angular material file drop",
29
+ "file input",
30
+ "file drop",
31
+ "ngx-mat-file-input",
32
+ "ngx-material-file-input"
33
+ ],
34
+ "license": "MIT",
35
+ "peerDependencies": {
36
+ "@angular/platform-browser": "^21.0.0",
37
+ "@angular/common": "^21.0.0",
38
+ "@angular/core": "^21.0.0",
39
+ "@angular/forms": "^21.0.0",
40
+ "@angular/material": "^21.0.0",
41
+ "@angular/cdk": "^21.0.0"
42
+ },
43
+ "module": "fesm2022/ngx-mce-file-input.mjs",
44
+ "typings": "types/ngx-mce-file-input.d.ts",
45
+ "exports": {
46
+ "./package.json": {
47
+ "default": "./package.json"
48
+ },
49
+ ".": {
50
+ "types": "./types/ngx-mce-file-input.d.ts",
51
+ "default": "./fesm2022/ngx-mce-file-input.mjs"
52
+ }
53
+ },
54
+ "sideEffects": false,
55
+ "dependencies": {
56
+ "tslib": "^2.3.0"
57
+ }
58
+ }
package/types/ngx-mce-file-input.d.ts ADDED
@@ -0,0 +1,118 @@
1
+ import * as i0 from '@angular/core';
2
+ import { OnDestroy, DoCheck, ElementRef, ChangeDetectorRef } from '@angular/core';
3
+ import { Platform } from '@angular/cdk/platform';
4
+ import { NgForm, FormGroupDirective, NgControl, ControlValueAccessor, ValidatorFn } from '@angular/forms';
5
+ import { ErrorStateMatcher, ThemePalette } from '@angular/material/core';
6
+ import { MatFormFieldControl } from '@angular/material/form-field';
7
+ import { Subject } from 'rxjs';
8
+
9
+ type FileOrArrayFile = File | Array<File> | File[];
10
+
11
+ declare class NgxMatInputMixinBase {
12
+ _defaultErrorStateMatcher: ErrorStateMatcher;
13
+ _parentForm: NgForm;
14
+ _parentFormGroup: FormGroupDirective;
15
+ /** @docs-private */
16
+ ngControl: NgControl;
17
+ readonly stateChanges: Subject<void>;
18
+ constructor(_defaultErrorStateMatcher: ErrorStateMatcher, _parentForm: NgForm, _parentFormGroup: FormGroupDirective,
19
+ /** @docs-private */
20
+ ngControl: NgControl);
21
+ }
22
+ declare class NgxMatFileInputIcon {
23
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgxMatFileInputIcon, never>;
24
+ static ɵdir: i0.ɵɵDirectiveDeclaration<NgxMatFileInputIcon, "[ngxMatFileInputIcon]", never, {}, {}, never, never, true, never>;
25
+ }
26
+ declare class NgxMatFileInputComponent extends NgxMatInputMixinBase implements MatFormFieldControl<FileOrArrayFile>, OnDestroy, DoCheck, ControlValueAccessor {
27
+ protected _elementRef: ElementRef<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>;
28
+ protected _platform: Platform;
29
+ private _cd;
30
+ ngControl: NgControl;
31
+ private _inputFileRef;
32
+ private _inputValueRef;
33
+ readonly color: i0.InputSignal<ThemePalette>;
34
+ fileNames: string;
35
+ protected _uid: string;
36
+ protected _previousNativeValue: any;
37
+ _ariaDescribedby: string;
38
+ readonly stateChanges: Subject<void>;
39
+ focused: boolean;
40
+ errorState: boolean;
41
+ controlType: string;
42
+ autofilled: boolean;
43
+ /** Function when touched */
44
+ _onTouched: () => void;
45
+ /** Function when changed */
46
+ _onChange: (value: FileOrArrayFile) => void;
47
+ get disabled(): boolean;
48
+ set disabled(value: boolean);
49
+ protected _disabled: boolean;
50
+ get id(): string;
51
+ set id(value: string);
52
+ protected _id: string;
53
+ get multiple(): boolean;
54
+ set multiple(value: boolean);
55
+ protected _multiple: boolean;
56
+ placeholder: string;
57
+ separator: i0.InputSignal<string>;
58
+ get required(): boolean;
59
+ set required(value: boolean);
60
+ protected _required: boolean;
61
+ errorStateMatcher: ErrorStateMatcher;
62
+ get value(): FileOrArrayFile;
63
+ set value(value: FileOrArrayFile);
64
+ protected _value: FileOrArrayFile;
65
+ get readonly(): boolean;
66
+ set readonly(value: boolean);
67
+ private _readonly;
68
+ /**
69
+ * Limiting accepted file types
70
+ * Example: accept="image/png, image/jpeg" or accept=".png, .jpg, .jpeg" — Accept PNG or JPEG files.
71
+ */
72
+ get accept(): string;
73
+ set accept(value: string);
74
+ private _accept;
75
+ constructor(_elementRef: ElementRef<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>, _platform: Platform, _cd: ChangeDetectorRef, ngControl: NgControl, _parentForm: NgForm, _parentFormGroup: FormGroupDirective, _defaultErrorStateMatcher: ErrorStateMatcher);
76
+ ngOnChanges(): void;
77
+ ngOnDestroy(): void;
78
+ ngDoCheck(): void;
79
+ updateErrorState(): void;
80
+ writeValue(value: FileOrArrayFile): void;
81
+ registerOnChange(fn: (value: any) => void): void;
82
+ registerOnTouched(fn: () => void): void;
83
+ setDisabledState(isDisabled: boolean): void;
84
+ /** Focuses the input. */
85
+ focus(options?: FocusOptions): void;
86
+ _focusChanged(isFocused: boolean): void;
87
+ /** Mark the field as touched */
88
+ _markAsTouched(): void;
89
+ protected _isBadInput(): boolean;
90
+ get empty(): boolean;
91
+ get shouldLabelFloat(): boolean;
92
+ setDescribedByIds(ids: string[]): void;
93
+ openFilePicker(event?: MouseEvent): void;
94
+ handleFiles(filelist: FileList): void;
95
+ /** Handles a click on the control's container. */
96
+ onContainerClick(event: MouseEvent): void;
97
+ private _resetInputFile;
98
+ private _updateInputValue;
99
+ static ɵfac: i0.ɵɵFactoryDeclaration<NgxMatFileInputComponent, [null, null, null, { optional: true; self: true; }, { optional: true; }, { optional: true; }, null]>;
100
+ static ɵcmp: i0.ɵɵComponentDeclaration<NgxMatFileInputComponent, "ngx-mat-file-input", ["ngx-mat-file-input"], { "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; }; "id": { "alias": "id"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "separator": { "alias": "separator"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "value": { "alias": "value"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "accept": { "alias": "accept"; "required": false; }; }, {}, never, ["[ngxMatFileInputIcon]"], true, never>;
101
+ }
102
+
103
+ declare function calculFileSize(number: number): string;
104
+
105
+ /**
106
+ * Validator for size of file
107
+ * @param max Max of size of file (in bytes)
108
+ */
109
+ declare function MaxSizeValidator(max: number): ValidatorFn;
110
+
111
+ /**
112
+ * Validator for input file accept
113
+ * @param accept Allowable type of file
114
+ */
115
+ declare function AcceptValidator(accept: string): ValidatorFn;
116
+
117
+ export { AcceptValidator, MaxSizeValidator, NgxMatFileInputComponent, NgxMatFileInputIcon, calculFileSize };
118
+ export type { FileOrArrayFile };