@arsedizioni/ars-utils 21.2.298 → 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.
|
@@ -2165,6 +2165,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
2165
2165
|
}] } });
|
|
2166
2166
|
|
|
2167
2167
|
class FileInputComponent {
|
|
2168
|
+
// Initialize
|
|
2168
2169
|
static { this.nextId = 0; }
|
|
2169
2170
|
set value(value) {
|
|
2170
2171
|
this._value = value;
|
|
@@ -2172,21 +2173,18 @@ class FileInputComponent {
|
|
|
2172
2173
|
this.stateChanges.next();
|
|
2173
2174
|
this.changed.emit(this._value);
|
|
2174
2175
|
}
|
|
2175
|
-
/** The current FileInfo value. */
|
|
2176
2176
|
get value() {
|
|
2177
2177
|
return this._value;
|
|
2178
2178
|
}
|
|
2179
|
-
/** Size of the current file in bytes. */
|
|
2180
2179
|
get size() {
|
|
2181
2180
|
return this._value?.file?.size;
|
|
2182
2181
|
}
|
|
2183
|
-
/** True when the control is required (implements `MatFormFieldControl.required`). */
|
|
2184
2182
|
get required() {
|
|
2185
|
-
return this.
|
|
2183
|
+
return this._required;
|
|
2186
2184
|
}
|
|
2187
|
-
|
|
2188
|
-
|
|
2189
|
-
|
|
2185
|
+
set required(value) {
|
|
2186
|
+
this._required = coerceBooleanProperty(value);
|
|
2187
|
+
this.stateChanges.next();
|
|
2190
2188
|
}
|
|
2191
2189
|
get disabled() {
|
|
2192
2190
|
if (this.ngControl && this.ngControl.disabled != null) {
|
|
@@ -2201,7 +2199,13 @@ class FileInputComponent {
|
|
|
2201
2199
|
this.stateChanges.next();
|
|
2202
2200
|
}
|
|
2203
2201
|
}
|
|
2204
|
-
|
|
2202
|
+
get placeholder() {
|
|
2203
|
+
return this._placeholder();
|
|
2204
|
+
}
|
|
2205
|
+
set placeholder(value) {
|
|
2206
|
+
this._placeholder.set(value);
|
|
2207
|
+
this.stateChanges.next();
|
|
2208
|
+
}
|
|
2205
2209
|
get empty() {
|
|
2206
2210
|
return !this._value || !this._value.file;
|
|
2207
2211
|
}
|
|
@@ -2226,10 +2230,11 @@ class FileInputComponent {
|
|
|
2226
2230
|
this.canCapture = signal(false, ...(ngDevMode ? [{ debugName: "canCapture" }] : /* istanbul ignore next */ []));
|
|
2227
2231
|
/** Size in MB of the currently selected file. */
|
|
2228
2232
|
this.fileSize = signal(0, ...(ngDevMode ? [{ debugName: "fileSize" }] : /* istanbul ignore next */ []));
|
|
2229
|
-
/** Internal placeholder text, derived from the input and camera availability. */
|
|
2230
2233
|
this._placeholder = signal('', ...(ngDevMode ? [{ debugName: "_placeholder" }] : /* istanbul ignore next */ []));
|
|
2231
2234
|
this._value = new FileInfo();
|
|
2232
|
-
|
|
2235
|
+
this._required = false;
|
|
2236
|
+
this._disabled = false;
|
|
2237
|
+
/** The currently displayed file name. Can be bound two-way from outside or updated on file selection. */
|
|
2233
2238
|
this.fileName = model(undefined, ...(ngDevMode ? [{ debugName: "fileName" }] : /* istanbul ignore next */ []));
|
|
2234
2239
|
this.maxSizeMb = input(5, ...(ngDevMode ? [{ debugName: "maxSizeMb" }] : /* istanbul ignore next */ []));
|
|
2235
2240
|
this.minSizeMb = input(0, ...(ngDevMode ? [{ debugName: "minSizeMb" }] : /* istanbul ignore next */ []));
|
|
@@ -2237,11 +2242,6 @@ class FileInputComponent {
|
|
|
2237
2242
|
this.canPreview = input(false, ...(ngDevMode ? [{ debugName: "canPreview" }] : /* istanbul ignore next */ []));
|
|
2238
2243
|
this.appearance = input(this.uiService.appearance(), ...(ngDevMode ? [{ debugName: "appearance" }] : /* istanbul ignore next */ []));
|
|
2239
2244
|
this.accept = input(...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
|
|
2240
|
-
/** @internal Input signal for the required state (bound via the `[required]` attribute). */
|
|
2241
|
-
this._requiredInput = input(false, { ...(ngDevMode ? { debugName: "_requiredInput" } : /* istanbul ignore next */ {}), alias: 'required', transform: booleanAttribute });
|
|
2242
|
-
/** @internal Input signal for the placeholder text (bound via the `[placeholder]` attribute). */
|
|
2243
|
-
this._placeholderInput = input('', { ...(ngDevMode ? { debugName: "_placeholderInput" } : /* istanbul ignore next */ {}), alias: 'placeholder' });
|
|
2244
|
-
this._disabled = false;
|
|
2245
2245
|
this.id = `${this.controlType}-${FileInputComponent.nextId++}`;
|
|
2246
2246
|
this.describedBy = '';
|
|
2247
2247
|
this.changed = output();
|
|
@@ -2252,31 +2252,11 @@ class FileInputComponent {
|
|
|
2252
2252
|
if (this.ngControl != null) {
|
|
2253
2253
|
this.ngControl.valueAccessor = this;
|
|
2254
2254
|
}
|
|
2255
|
-
// Notify state changes when required changes
|
|
2256
|
-
effect(() => {
|
|
2257
|
-
this._requiredInput();
|
|
2258
|
-
this.stateChanges.next();
|
|
2259
|
-
});
|
|
2260
|
-
// Sync placeholder input into internal signal; setupDevices may override it when empty
|
|
2261
|
-
effect(() => {
|
|
2262
|
-
const p = this._placeholderInput();
|
|
2263
|
-
if (p) {
|
|
2264
|
-
this._placeholder.set(p);
|
|
2265
|
-
}
|
|
2266
|
-
});
|
|
2267
2255
|
// Detect camera availability and set the default placeholder after the first render
|
|
2268
|
-
afterNextRender(() => {
|
|
2269
|
-
this.setupDevices();
|
|
2270
|
-
});
|
|
2271
|
-
}
|
|
2272
|
-
ngOnDestroy() {
|
|
2273
|
-
this.stateChanges.complete();
|
|
2274
|
-
}
|
|
2275
|
-
ngDoCheck() {
|
|
2276
|
-
this.updateInputDirtyCheck();
|
|
2256
|
+
afterNextRender(() => { this.setupDevices(); });
|
|
2277
2257
|
}
|
|
2278
2258
|
/**
|
|
2279
|
-
* Detects camera availability and
|
|
2259
|
+
* Detects camera availability and updates the placeholder accordingly.
|
|
2280
2260
|
*/
|
|
2281
2261
|
async setupDevices() {
|
|
2282
2262
|
this.canCapture.set(false);
|
|
@@ -2289,13 +2269,18 @@ class FileInputComponent {
|
|
|
2289
2269
|
}
|
|
2290
2270
|
catch { }
|
|
2291
2271
|
}
|
|
2292
|
-
|
|
2293
|
-
if (!current || current === 'Seleziona file') {
|
|
2272
|
+
if (!this.placeholder || this.placeholder === 'Seleziona file') {
|
|
2294
2273
|
this._placeholder.set(this.canCapture()
|
|
2295
2274
|
? 'Seleziona file o acquisisci con fotocamera'
|
|
2296
2275
|
: 'Seleziona file');
|
|
2297
2276
|
}
|
|
2298
2277
|
}
|
|
2278
|
+
ngOnDestroy() {
|
|
2279
|
+
this.stateChanges.complete();
|
|
2280
|
+
}
|
|
2281
|
+
ngDoCheck() {
|
|
2282
|
+
this.updateInputDirtyCheck();
|
|
2283
|
+
}
|
|
2299
2284
|
/**
|
|
2300
2285
|
* Writes a new value to the component (called by the form layer).
|
|
2301
2286
|
* @param value - The new file info to display.
|
|
@@ -2325,15 +2310,10 @@ class FileInputComponent {
|
|
|
2325
2310
|
this.describedBy = ids.join(' ');
|
|
2326
2311
|
}
|
|
2327
2312
|
/**
|
|
2328
|
-
* Updates the disabled state
|
|
2313
|
+
* Updates the disabled state of the underlying native element.
|
|
2329
2314
|
* @param isDisabled - Whether the control should be disabled.
|
|
2330
2315
|
*/
|
|
2331
2316
|
setDisabledState(isDisabled) {
|
|
2332
|
-
this._disabled = isDisabled;
|
|
2333
|
-
if (isDisabled && this.focused) {
|
|
2334
|
-
this.focused = false;
|
|
2335
|
-
this.stateChanges.next();
|
|
2336
|
-
}
|
|
2337
2317
|
if (!SystemUtils.isBrowser())
|
|
2338
2318
|
return;
|
|
2339
2319
|
const elem = document.getElementById(this.id);
|
|
@@ -2418,7 +2398,7 @@ class FileInputComponent {
|
|
|
2418
2398
|
this.preview.emit();
|
|
2419
2399
|
}
|
|
2420
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 }); }
|
|
2421
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.11", type: FileInputComponent, isStandalone: true, selector: "file-input", inputs: {
|
|
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 }); }
|
|
2422
2402
|
}
|
|
2423
2403
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImport: i0, type: FileInputComponent, decorators: [{
|
|
2424
2404
|
type: Component,
|
|
@@ -2427,14 +2407,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.11", ngImpo
|
|
|
2427
2407
|
'[id]': 'id',
|
|
2428
2408
|
'[class.floating]': 'shouldLabelFloat',
|
|
2429
2409
|
'[attr.aria-describedBy]': 'describedBy',
|
|
2430
|
-
}, template: "<mat-form-field style=\"width:100%\" [appearance]=\"appearance()\">\r\n <mat-label>{{
|
|
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>" }]
|
|
2431
2411
|
}], ctorParameters: () => [{ type: i1.NgControl, decorators: [{
|
|
2432
2412
|
type: Optional
|
|
2433
2413
|
}, {
|
|
2434
2414
|
type: Self
|
|
2435
|
-
}] }], propDecorators: { __file: [{ type: i0.ViewChild, args: ['__file', { isSignal: true }] }],
|
|
2415
|
+
}] }], propDecorators: { __file: [{ type: i0.ViewChild, args: ['__file', { isSignal: true }] }], required: [{
|
|
2416
|
+
type: Input
|
|
2417
|
+
}], disabled: [{
|
|
2418
|
+
type: Input
|
|
2419
|
+
}], placeholder: [{
|
|
2436
2420
|
type: Input
|
|
2437
|
-
}], 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"] }] } });
|
|
2438
2422
|
|
|
2439
2423
|
class FilePreviewComponent {
|
|
2440
2424
|
constructor() {
|