@arsedizioni/ars-utils 21.2.299 → 21.2.300
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { input, inject, Renderer2, ElementRef, afterNextRender, Directive, output, ChangeDetectorRef, signal, ChangeDetectionStrategy, Component, Injectable, DestroyRef, viewChild, NgModule, effect, Input, Optional, Self, computed, booleanAttribute,
|
|
2
|
+
import { input, inject, Renderer2, ElementRef, afterNextRender, Directive, output, ChangeDetectorRef, signal, ChangeDetectionStrategy, Component, Injectable, DestroyRef, viewChild, NgModule, effect, Input, Optional, Self, computed, booleanAttribute, model } from '@angular/core';
|
|
3
3
|
import * as i14 from '@angular/material/paginator';
|
|
4
4
|
import { MatPaginatorModule, MatPaginatorIntl } from '@angular/material/paginator';
|
|
5
5
|
import { DialogService, OtpInputComponent, PaginatorIntl, UIService } from '@arsedizioni/ars-utils/ui';
|
|
@@ -2209,14 +2209,18 @@ class FileInputComponent {
|
|
|
2209
2209
|
get empty() {
|
|
2210
2210
|
return !this._value || !this._value.file;
|
|
2211
2211
|
}
|
|
2212
|
+
/** True when the control has validation errors and has been touched. */
|
|
2212
2213
|
get errorState() {
|
|
2213
|
-
return this.ngControl
|
|
2214
|
+
return (this.ngControl?.errors != null) && (this.ngControl?.touched ?? false);
|
|
2214
2215
|
}
|
|
2216
|
+
/** True when the label should float above the field. */
|
|
2215
2217
|
get shouldLabelFloat() {
|
|
2216
2218
|
return this.focused || !this.empty;
|
|
2217
2219
|
}
|
|
2218
2220
|
constructor(ngControl) {
|
|
2219
2221
|
this.ngControl = ngControl;
|
|
2222
|
+
/** Reference to the hidden native file input element. */
|
|
2223
|
+
this.__file = viewChild.required('__file');
|
|
2220
2224
|
this.renderer = inject(Renderer2);
|
|
2221
2225
|
this.uiService = inject(UIService);
|
|
2222
2226
|
this.stateChanges = new Subject();
|
|
@@ -2230,6 +2234,8 @@ class FileInputComponent {
|
|
|
2230
2234
|
this._value = new FileInfo();
|
|
2231
2235
|
this._required = false;
|
|
2232
2236
|
this._disabled = false;
|
|
2237
|
+
/** The currently displayed file name. Can be bound two-way from outside or updated on file selection. */
|
|
2238
|
+
this.fileName = model(undefined, ...(ngDevMode ? [{ debugName: "fileName" }] : /* istanbul ignore next */ []));
|
|
2233
2239
|
this.maxSizeMb = input(5, ...(ngDevMode ? [{ debugName: "maxSizeMb" }] : /* istanbul ignore next */ []));
|
|
2234
2240
|
this.minSizeMb = input(0, ...(ngDevMode ? [{ debugName: "minSizeMb" }] : /* istanbul ignore next */ []));
|
|
2235
2241
|
this.isNew = input(false, ...(ngDevMode ? [{ debugName: "isNew" }] : /* istanbul ignore next */ []));
|
|
@@ -2246,9 +2252,8 @@ class FileInputComponent {
|
|
|
2246
2252
|
if (this.ngControl != null) {
|
|
2247
2253
|
this.ngControl.valueAccessor = this;
|
|
2248
2254
|
}
|
|
2249
|
-
|
|
2250
|
-
|
|
2251
|
-
await this.setupDevices();
|
|
2255
|
+
// Detect camera availability and set the default placeholder after the first render
|
|
2256
|
+
afterNextRender(() => { this.setupDevices(); });
|
|
2252
2257
|
}
|
|
2253
2258
|
/**
|
|
2254
2259
|
* Detects camera availability and updates the placeholder accordingly.
|
|
@@ -2353,7 +2358,7 @@ class FileInputComponent {
|
|
|
2353
2358
|
(!this.maxSizeMb() || fileSizeMb <= this.maxSizeMb()) &&
|
|
2354
2359
|
(!this.minSizeMb() || fileSizeMb >= this.minSizeMb());
|
|
2355
2360
|
this.writeValue(fileInfo);
|
|
2356
|
-
this.fileName
|
|
2361
|
+
this.fileName.set(f.name);
|
|
2357
2362
|
this.fileSize.set(Math.round(fileSizeMb));
|
|
2358
2363
|
}
|
|
2359
2364
|
}
|
|
@@ -2369,13 +2374,13 @@ class FileInputComponent {
|
|
|
2369
2374
|
*/
|
|
2370
2375
|
clearFile() {
|
|
2371
2376
|
if (this.hasFile()) {
|
|
2372
|
-
this.fileName
|
|
2377
|
+
this.fileName.set(undefined);
|
|
2373
2378
|
this.fileSize.set(0);
|
|
2374
2379
|
const fi = new FileInfo();
|
|
2375
2380
|
fi.file = undefined;
|
|
2376
2381
|
fi.valid = !this.required;
|
|
2377
2382
|
this.writeValue(fi);
|
|
2378
|
-
this.__file.nativeElement.value = '';
|
|
2383
|
+
this.__file().nativeElement.value = '';
|
|
2379
2384
|
}
|
|
2380
2385
|
}
|
|
2381
2386
|
/**
|
|
@@ -2393,36 +2398,27 @@ class FileInputComponent {
|
|
|
2393
2398
|
this.preview.emit();
|
|
2394
2399
|
}
|
|
2395
2400
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: FileInputComponent, deps: [{ token: i1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2396
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: FileInputComponent, isStandalone: true, selector: "file-input", inputs: { required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, fileName: { classPropertyName: "fileName", publicName: "fileName", isSignal:
|
|
2401
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: FileInputComponent, isStandalone: true, selector: "file-input", inputs: { required: { classPropertyName: "required", publicName: "required", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, fileName: { classPropertyName: "fileName", publicName: "fileName", isSignal: true, isRequired: false, transformFunction: null }, maxSizeMb: { classPropertyName: "maxSizeMb", publicName: "maxSizeMb", isSignal: true, isRequired: false, transformFunction: null }, minSizeMb: { classPropertyName: "minSizeMb", publicName: "minSizeMb", isSignal: true, isRequired: false, transformFunction: null }, isNew: { classPropertyName: "isNew", publicName: "isNew", isSignal: true, isRequired: false, transformFunction: null }, canPreview: { classPropertyName: "canPreview", publicName: "canPreview", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileName: "fileNameChange", changed: "changed", download: "download", preview: "preview" }, host: { properties: { "id": "id", "class.floating": "shouldLabelFloat", "attr.aria-describedBy": "describedBy" } }, providers: [{ provide: MatFormFieldControl, useExisting: FileInputComponent }], viewQueries: [{ propertyName: "__file", first: true, predicate: ["__file"], descendants: true, isSignal: true }], ngImport: i0, template: "<mat-form-field style=\"width:100%\" [appearance]=\"appearance()\">\r\n <mat-label>{{placeholder}}</mat-label>\r\n <input type=\"file\" [hidden]=\"true\" [accept]=\"accept()\" (change)=\"selectFile($event)\" #__file />\r\n <input name=\"_fileName\" #_fileName=\"ngModel\" [ngModel]=\"fileName()\" (ngModelChange)=\"fileName.set($event)\" [id]=\"id\" matInput readonly [required]=\"required\"\r\n fileSize [size]=\"fileSize()\" [maxSizeMb]=\"maxSizeMb()\" [minSizeMb]=\"minSizeMb()\" [disabled]=\"disabled\" />\r\n @if (hasFile()) {\r\n <button type=\"button\" tabindex=\"-1\" mat-icon-button matSuffix aria-label=\"Azzera\" (click)=\"clearFile()\" [disabled]=\"disabled\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (!disabled) {\r\n <button type=\"button\" type=\"button\" mat-icon-button matSuffix (click)=\"__file.click()\" aria-label=\"Seleziona file\"\r\n matTooltip=\"Seleziona\" [disabled]=\"disabled\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n }\r\n @if (!isNew() && canPreview()) {\r\n <button type=\"button\" mat-icon-button matSuffix (click)=\"previewFile()\" aria-label=\"Anteprima\" matTooltip=\"Anteprima\" [disabled]=\"disabled\">\r\n <mat-icon>preview</mat-icon>\r\n </button>\r\n }\r\n @if (!isNew()) {\r\n <button type=\"button\" mat-icon-button matSuffix (click)=\"downloadFile()\" aria-label=\"Scarica file\"\r\n matTooltip=\"Scarica\" [disabled]=\"disabled\">\r\n <mat-icon>save_alt</mat-icon>\r\n </button>\r\n }\r\n @if (hasFile() && fileSize() > 0) {\r\n <mat-hint align=\"start\">{{fileSize()}} MB</mat-hint>\r\n }\r\n @if (hasFile() && fileSize() == 0) {\r\n <mat-hint align=\"start\">\r\n > 1 MB</mat-hint>\r\n } @if (maxSizeMb()) {\r\n <mat-hint align=\"end\">Massimo {{maxSizeMb()}} MB\r\n </mat-hint>\r\n }\r\n @if (_fileName.invalid && !hasFile()) {\r\n <mat-error>Obbligatorio.</mat-error>\r\n }\r\n @if (_fileName.invalid && hasFile()) {\r\n <mat-error>Dimensione non consentita.</mat-error>\r\n }\r\n</mat-form-field>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i4.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: FileSizeValidatorDirective, selector: "[fileSize]", inputs: ["maxSizeMb", "minSizeMb", "size"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i6.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2397
2402
|
}
|
|
2398
2403
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: FileInputComponent, decorators: [{
|
|
2399
2404
|
type: Component,
|
|
2400
2405
|
args: [{ selector: 'file-input', providers: [{ provide: MatFormFieldControl, useExisting: FileInputComponent }], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatFormFieldModule, MatInputModule, FormsModule, FileSizeValidatorDirective, MatButtonModule,
|
|
2401
|
-
MatIconModule, MatTooltipModule],
|
|
2406
|
+
MatIconModule, MatTooltipModule], host: {
|
|
2407
|
+
'[id]': 'id',
|
|
2408
|
+
'[class.floating]': 'shouldLabelFloat',
|
|
2409
|
+
'[attr.aria-describedBy]': 'describedBy',
|
|
2410
|
+
}, template: "<mat-form-field style=\"width:100%\" [appearance]=\"appearance()\">\r\n <mat-label>{{placeholder}}</mat-label>\r\n <input type=\"file\" [hidden]=\"true\" [accept]=\"accept()\" (change)=\"selectFile($event)\" #__file />\r\n <input name=\"_fileName\" #_fileName=\"ngModel\" [ngModel]=\"fileName()\" (ngModelChange)=\"fileName.set($event)\" [id]=\"id\" matInput readonly [required]=\"required\"\r\n fileSize [size]=\"fileSize()\" [maxSizeMb]=\"maxSizeMb()\" [minSizeMb]=\"minSizeMb()\" [disabled]=\"disabled\" />\r\n @if (hasFile()) {\r\n <button type=\"button\" tabindex=\"-1\" mat-icon-button matSuffix aria-label=\"Azzera\" (click)=\"clearFile()\" [disabled]=\"disabled\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (!disabled) {\r\n <button type=\"button\" type=\"button\" mat-icon-button matSuffix (click)=\"__file.click()\" aria-label=\"Seleziona file\"\r\n matTooltip=\"Seleziona\" [disabled]=\"disabled\">\r\n <mat-icon>add</mat-icon>\r\n </button>\r\n }\r\n @if (!isNew() && canPreview()) {\r\n <button type=\"button\" mat-icon-button matSuffix (click)=\"previewFile()\" aria-label=\"Anteprima\" matTooltip=\"Anteprima\" [disabled]=\"disabled\">\r\n <mat-icon>preview</mat-icon>\r\n </button>\r\n }\r\n @if (!isNew()) {\r\n <button type=\"button\" mat-icon-button matSuffix (click)=\"downloadFile()\" aria-label=\"Scarica file\"\r\n matTooltip=\"Scarica\" [disabled]=\"disabled\">\r\n <mat-icon>save_alt</mat-icon>\r\n </button>\r\n }\r\n @if (hasFile() && fileSize() > 0) {\r\n <mat-hint align=\"start\">{{fileSize()}} MB</mat-hint>\r\n }\r\n @if (hasFile() && fileSize() == 0) {\r\n <mat-hint align=\"start\">\r\n > 1 MB</mat-hint>\r\n } @if (maxSizeMb()) {\r\n <mat-hint align=\"end\">Massimo {{maxSizeMb()}} MB\r\n </mat-hint>\r\n }\r\n @if (_fileName.invalid && !hasFile()) {\r\n <mat-error>Obbligatorio.</mat-error>\r\n }\r\n @if (_fileName.invalid && hasFile()) {\r\n <mat-error>Dimensione non consentita.</mat-error>\r\n }\r\n</mat-form-field>" }]
|
|
2402
2411
|
}], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
|
|
2403
2412
|
type: Optional
|
|
2404
2413
|
}, {
|
|
2405
2414
|
type: Self
|
|
2406
|
-
}] }], propDecorators: { __file: [{
|
|
2407
|
-
type: ViewChild,
|
|
2408
|
-
args: ['__file']
|
|
2409
|
-
}], required: [{
|
|
2415
|
+
}] }], propDecorators: { __file: [{ type: i0.ViewChild, args: ['__file', { isSignal: true }] }], required: [{
|
|
2410
2416
|
type: Input
|
|
2411
2417
|
}], disabled: [{
|
|
2412
2418
|
type: Input
|
|
2413
2419
|
}], placeholder: [{
|
|
2414
2420
|
type: Input
|
|
2415
|
-
}], fileName: [{
|
|
2416
|
-
type: Input
|
|
2417
|
-
}], maxSizeMb: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSizeMb", required: false }] }], minSizeMb: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSizeMb", required: false }] }], isNew: [{ type: i0.Input, args: [{ isSignal: true, alias: "isNew", required: false }] }], canPreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "canPreview", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], id: [{
|
|
2418
|
-
type: HostBinding
|
|
2419
|
-
}], shouldLabelFloat: [{
|
|
2420
|
-
type: HostBinding,
|
|
2421
|
-
args: ['class.floating']
|
|
2422
|
-
}], describedBy: [{
|
|
2423
|
-
type: HostBinding,
|
|
2424
|
-
args: ['attr.aria-describedBy']
|
|
2425
|
-
}], changed: [{ type: i0.Output, args: ["changed"] }], download: [{ type: i0.Output, args: ["download"] }], preview: [{ type: i0.Output, args: ["preview"] }] } });
|
|
2421
|
+
}], fileName: [{ type: i0.Input, args: [{ isSignal: true, alias: "fileName", required: false }] }, { type: i0.Output, args: ["fileNameChange"] }], maxSizeMb: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSizeMb", required: false }] }], minSizeMb: [{ type: i0.Input, args: [{ isSignal: true, alias: "minSizeMb", required: false }] }], isNew: [{ type: i0.Input, args: [{ isSignal: true, alias: "isNew", required: false }] }], canPreview: [{ type: i0.Input, args: [{ isSignal: true, alias: "canPreview", required: false }] }], appearance: [{ type: i0.Input, args: [{ isSignal: true, alias: "appearance", required: false }] }], accept: [{ type: i0.Input, args: [{ isSignal: true, alias: "accept", required: false }] }], changed: [{ type: i0.Output, args: ["changed"] }], download: [{ type: i0.Output, args: ["download"] }], preview: [{ type: i0.Output, args: ["preview"] }] } });
|
|
2426
2422
|
|
|
2427
2423
|
class FilePreviewComponent {
|
|
2428
2424
|
constructor() {
|