npm - @recursyve/ngx-material-components - Versions diffs - 21.2.0 → 22.0.0 - Mend

@recursyve/ngx-material-components 21.2.0 → 22.0.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 (12) hide show

package/fesm2022/recursyve-ngx-material-components-chip-list.mjs CHANGED Viewed

@@ -1,19 +1,23 @@
 import * as i0 from '@angular/core';
-import { input, inject, ElementRef, Injector, signal, effect, untracked, HostListener, Directive, Component, output, ChangeDetectionStrategy } from '@angular/core';
+import { input, inject, ElementRef, Injector, signal, effect, untracked, HostListener, Directive, ChangeDetectionStrategy, Component, output } from '@angular/core';
 import { toObservable, toSignal } from '@angular/core/rxjs-interop';
 import { NgControl } from '@angular/forms';
 import { NiceAsyncTypeahead } from '@recursyve/ngx-material-components/typeahead';
 import { MatChipSet, MatChipRemove, MatChipRow } from '@angular/material/chips';
 class NiceChipListDirective {
-    withItemList = input.required(...(ngDevMode ? [{ debugName: "withItemList" }] : []));
-    reloadOnSelected = input(true, ...(ngDevMode ? [{ debugName: "reloadOnSelected" }] : []));
-    separatorKeyboardCodes = input(["Enter"], ...(ngDevMode ? [{ debugName: "separatorKeyboardCodes" }] : []));
+    withItemList = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "withItemList" }] : /* istanbul ignore next */ []));
+    reloadOnSelected = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "reloadOnSelected" }] : /* istanbul ignore next */ []));
+    separatorKeyboardCodes = input(["Enter"], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "separatorKeyboardCodes" }] : /* istanbul ignore next */ []));
     elementRef = inject(ElementRef);
     injector = inject(Injector);
     asyncTypeahead = inject(NiceAsyncTypeahead, { optional: true });
     ngControl = inject(NgControl, { optional: true });
-    values = signal([], ...(ngDevMode ? [{ debugName: "values" }] : []));
+    values = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "values" }] : /* istanbul ignore next */ []));
     propagateChanges;
     constructor() {
         if (this.ngControl) {
@@ -100,10 +104,10 @@ class NiceChipListDirective {
         const searchOptions = this.asyncTypeahead.searchOptions();
         this.asyncTypeahead.setSearchOptions({ ...(searchOptions ?? {}), ignore });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceChipListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.0.5", type: NiceChipListDirective, isStandalone: true, selector: "input[niceChipList], nice-async-typeahead[niceChipList]", inputs: { withItemList: { classPropertyName: "withItemList", publicName: "withItemList", isSignal: true, isRequired: true, transformFunction: null }, reloadOnSelected: { classPropertyName: "reloadOnSelected", publicName: "reloadOnSelected", isSignal: true, isRequired: false, transformFunction: null }, separatorKeyboardCodes: { classPropertyName: "separatorKeyboardCodes", publicName: "separatorKeyboardCodes", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "onKeyDown($event)" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceChipListDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.0", type: NiceChipListDirective, isStandalone: true, selector: "input[niceChipList], nice-async-typeahead[niceChipList]", inputs: { withItemList: { classPropertyName: "withItemList", publicName: "withItemList", isSignal: true, isRequired: true, transformFunction: null }, reloadOnSelected: { classPropertyName: "reloadOnSelected", publicName: "reloadOnSelected", isSignal: true, isRequired: false, transformFunction: null }, separatorKeyboardCodes: { classPropertyName: "separatorKeyboardCodes", publicName: "separatorKeyboardCodes", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "keydown": "onKeyDown($event)" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceChipListDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceChipListDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "input[niceChipList], nice-async-typeahead[niceChipList]"
@@ -114,12 +118,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImpor
             }] } });
 class NiceChipListItemsClearIcon {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceChipListItemsClearIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: NiceChipListItemsClearIcon, isStandalone: true, selector: "nice-chip-list-items-clear-icon", ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceChipListItemsClearIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NiceChipListItemsClearIcon, isStandalone: true, selector: "nice-chip-list-items-clear-icon", ngImport: i0, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>\n", changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceChipListItemsClearIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceChipListItemsClearIcon, decorators: [{
             type: Component,
-            args: [{ selector: "nice-chip-list-items-clear-icon", template: "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>\n" }]
+            args: [{ selector: "nice-chip-list-items-clear-icon", changeDetection: ChangeDetectionStrategy.Eager, template: "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>\n" }]
         }] });
 class NiceChipListItems {
@@ -136,10 +140,10 @@ class NiceChipListItems {
     remove(index) {
         this.removeChip.emit(index);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceChipListItems, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: NiceChipListItems, isStandalone: true, selector: "nice-chip-list-items", outputs: { removeChip: "removeChip" }, ngImport: i0, template: "@if (items) {\n    <mat-chip-set>\n        @for (item of items(); track item) {\n            <mat-chip-row [highlighted]=\"true\" (removed)=\"remove($index)\">\n                @if (formatLabelFn) {\n                    {{ formatLabelFn(item) }}\n                } @else {\n                    {{ item }}\n                }\n\n                <button matChipRemove>\n                    <nice-chip-list-items-clear-icon />\n                </button>\n            </mat-chip-row>\n        }\n    </mat-chip-set>\n}\n", styles: ["nice-chip-list-items-clear-icon{margin-top:-1px;width:16px;height:16px}\n"], dependencies: [{ kind: "component", type: MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: NiceChipListItemsClearIcon, selector: "nice-chip-list-items-clear-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceChipListItems, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NiceChipListItems, isStandalone: true, selector: "nice-chip-list-items", outputs: { removeChip: "removeChip" }, ngImport: i0, template: "@if (items) {\n    <mat-chip-set>\n        @for (item of items(); track item) {\n            <mat-chip-row [highlighted]=\"true\" (removed)=\"remove($index)\">\n                @if (formatLabelFn) {\n                    {{ formatLabelFn(item) }}\n                } @else {\n                    {{ item }}\n                }\n\n                <button matChipRemove>\n                    <nice-chip-list-items-clear-icon />\n                </button>\n            </mat-chip-row>\n        }\n    </mat-chip-set>\n}\n", styles: ["nice-chip-list-items-clear-icon{margin-top:-1px;width:16px;height:16px}\n"], dependencies: [{ kind: "component", type: MatChipSet, selector: "mat-chip-set", inputs: ["disabled", "role", "tabIndex"] }, { kind: "directive", type: MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "component", type: NiceChipListItemsClearIcon, selector: "nice-chip-list-items-clear-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceChipListItems, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceChipListItems, decorators: [{
             type: Component,
             args: [{ selector: "nice-chip-list-items", imports: [
                         MatChipSet,

package/fesm2022/recursyve-ngx-material-components-chip-list.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"recursyve-ngx-material-components-chip-list.mjs","sources":["../../../src/material-components/chip-list/chip-list.ts","../../../src/material-components/chip-list/icons/clear/chip-list-items-clear-icon.ts","../../../src/material-components/chip-list/icons/clear/chip-list-items-clear-icon.svg","../../../src/material-components/chip-list/items/chip-list-items.ts","../../../src/material-components/chip-list/items/chip-list-items.html","../../../src/material-components/chip-list/recursyve-ngx-material-components-chip-list.ts"],"sourcesContent":["import {\n Directive,\n effect,\n ElementRef,\n HostListener,\n inject,\n Injector,\n input,\n OnInit,\n signal,\n untracked\n} from \"@angular/core\";\nimport { toObservable } from \"@angular/core/rxjs-interop\";\nimport { ControlValueAccessor, NgControl } from \"@angular/forms\";\nimport { NiceAsyncTypeahead } from \"@recursyve/ngx-material-components/typeahead\";\nimport { NiceChipListItems } from \"./items/chip-list-items\";\n\n@Directive({\n selector: \"input[niceChipList], nice-async-typeahead[niceChipList]\"\n})\nexport class NiceChipListDirective<T extends object> implements ControlValueAccessor, OnInit {\n public readonly withItemList = input.required<NiceChipListItems<T>>();\n public readonly reloadOnSelected = input<boolean>(true);\n public readonly separatorKeyboardCodes = input<string[]>([\"Enter\"]);\n\n private readonly elementRef = inject(ElementRef);\n private readonly injector = inject(Injector);\n private readonly asyncTypeahead = inject<NiceAsyncTypeahead<T>>(NiceAsyncTypeahead, { optional: true });\n private readonly ngControl = inject<NgControl>(NgControl, { optional: true });\n\n private readonly values = signal<T[]>([]);\n\n private propagateChanges?: (_: T[]) => void;\n\n constructor() {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n\n effect(() => {\n const values = this.values();\n untracked(() => this.updateTypeaheadSearchOptions(values));\n });\n }\n\n @HostListener(\"keydown\", [\"$event\"])\n public onKeyDown(event: KeyboardEvent): void {\n if (this.asyncTypeahead) {\n return;\n }\n\n if (!this.separatorKeyboardCodes().includes(event.code)) {\n return;\n }\n\n if (!this.elementRef.nativeElement.validity.valid) {\n return;\n }\n\n this.addValue(this.elementRef.nativeElement.value);\n this.elementRef.nativeElement.value = \"\";\n event.preventDefault();\n }\n\n public ngOnInit(): void {\n this.setupAsyncTypeahead();\n\n const parentElement = this.elementRef.nativeElement.parentElement;\n if (parentElement.classList.contains(\"mat-mdc-form-field-infix\")) {\n parentElement.style.alignItems = \"flex-start\";\n parentElement.style.flexDirection = \"column-reverse\";\n }\n\n const withItemList = this.withItemList();\n withItemList.setItemsReactivity(toObservable(this.values, { injector: this.injector }));\n withItemList.removeChip.subscribe((index) => {\n const values = [...this.values()];\n values.splice(index, 1);\n\n this.propagateChanges?.(values);\n this.values.set(values);\n });\n\n if (this.asyncTypeahead) {\n withItemList.setFormatLabel((item) => this.asyncTypeahead!.formatLabel(item));\n }\n }\n\n public writeValue(obj: T[] \| null): void {\n if (!obj) {\n this.values.set([]);\n } else if (Array.isArray(obj)) {\n this.values.set([...obj]);\n }\n }\n\n public registerOnChange(fn: (_: T[]) => void): void {\n this.propagateChanges = fn;\n }\n\n public registerOnTouched(): void {\n return;\n }\n\n private setupAsyncTypeahead(): void {\n if (!this.asyncTypeahead) {\n return;\n }\n\n this.asyncTypeahead.selected\n .subscribe((value) => {\n if (!value) {\n return;\n }\n\n this.addValue(value);\n this.asyncTypeahead?.removeActiveValue();\n });\n }\n\n private addValue(value: T): void {\n const values = [...this.values()];\n if (values.includes(value)) {\n return;\n }\n\n values.push(value);\n this.propagateChanges?.(values);\n this.values.set(values);\n }\n\n private updateTypeaheadSearchOptions(ignore: T[]): void {\n if (!this.asyncTypeahead) {\n return;\n }\n\n const searchOptions = this.asyncTypeahead.searchOptions();\n this.asyncTypeahead.setSearchOptions({ ...(searchOptions ?? {}), ignore });\n }\n}\n","import { Component } from \"@angular/core\";\n\n@Component({\n selector: \"nice-chip-list-items-clear-icon\",\n templateUrl: \"chip-list-items-clear-icon.svg\"\n})\nexport class NiceChipListItemsClearIcon {}\n","<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>\n","import { ChangeDetectionStrategy, Component, inject, Injector, output, Signal } from \"@angular/core\";\nimport { toSignal } from \"@angular/core/rxjs-interop\";\nimport { MatChipRemove, MatChipRow, MatChipSet } from \"@angular/material/chips\";\nimport { Observable } from \"rxjs\";\nimport { NiceChipListItemsClearIcon } from \"../icons/clear/chip-list-items-clear-icon\";\n\n@Component({\n selector: \"nice-chip-list-items\",\n templateUrl: \"./chip-list-items.html\",\n styleUrls: [\"./chip-list-items.scss\"],\n imports: [\n MatChipSet,\n MatChipRemove,\n MatChipRow,\n NiceChipListItemsClearIcon\n ],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class NiceChipListItems<T> {\n public readonly removeChip = output<number>();\n\n protected readonly injector = inject(Injector);\n\n public items?: Signal<T[]>;\n public formatLabelFn?: (value: T) => string;\n\n public setItemsReactivity(items$: Observable<T[]>): void {\n this.items = toSignal(items$, { injector: this.injector, initialValue: [] });\n }\n\n public setFormatLabel(fn: (value: T) => string): void {\n this.formatLabelFn = fn;\n }\n\n public remove(index: number): void {\n this.removeChip.emit(index);\n }\n}\n","@if (items) {\n <mat-chip-set>\n @for (item of items(); track item) {\n <mat-chip-row [highlighted]=\"true\" (removed)=\"remove($index)\">\n @if (formatLabelFn) {\n {{ formatLabelFn(item) }}\n } @else {\n {{ item }}\n }\n\n <button matChipRemove>\n <nice-chip-list-items-clear-icon />\n </button>\n </mat-chip-row>\n }\n </mat-chip-set>\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"recursyve-ngx-material-components-chip-list.mjs","sources":["../../../src/material-components/chip-list/chip-list.ts","../../../src/material-components/chip-list/icons/clear/chip-list-items-clear-icon.ts","../../../src/material-components/chip-list/icons/clear/chip-list-items-clear-icon.svg","../../../src/material-components/chip-list/items/chip-list-items.ts","../../../src/material-components/chip-list/items/chip-list-items.html","../../../src/material-components/chip-list/recursyve-ngx-material-components-chip-list.ts"],"sourcesContent":["import {\n Directive,\n effect,\n ElementRef,\n HostListener,\n inject,\n Injector,\n input,\n OnInit,\n signal,\n untracked\n} from \"@angular/core\";\nimport { toObservable } from \"@angular/core/rxjs-interop\";\nimport { ControlValueAccessor, NgControl } from \"@angular/forms\";\nimport { NiceAsyncTypeahead } from \"@recursyve/ngx-material-components/typeahead\";\nimport { NiceChipListItems } from \"./items/chip-list-items\";\n\n@Directive({\n selector: \"input[niceChipList], nice-async-typeahead[niceChipList]\"\n})\nexport class NiceChipListDirective<T extends object> implements ControlValueAccessor, OnInit {\n public readonly withItemList = input.required<NiceChipListItems<T>>();\n public readonly reloadOnSelected = input<boolean>(true);\n public readonly separatorKeyboardCodes = input<string[]>([\"Enter\"]);\n\n private readonly elementRef = inject(ElementRef);\n private readonly injector = inject(Injector);\n private readonly asyncTypeahead = inject<NiceAsyncTypeahead<T>>(NiceAsyncTypeahead, { optional: true });\n private readonly ngControl = inject<NgControl>(NgControl, { optional: true });\n\n private readonly values = signal<T[]>([]);\n\n private propagateChanges?: (_: T[]) => void;\n\n constructor() {\n if (this.ngControl) {\n this.ngControl.valueAccessor = this;\n }\n\n effect(() => {\n const values = this.values();\n untracked(() => this.updateTypeaheadSearchOptions(values));\n });\n }\n\n @HostListener(\"keydown\", [\"$event\"])\n public onKeyDown(event: KeyboardEvent): void {\n if (this.asyncTypeahead) {\n return;\n }\n\n if (!this.separatorKeyboardCodes().includes(event.code)) {\n return;\n }\n\n if (!this.elementRef.nativeElement.validity.valid) {\n return;\n }\n\n this.addValue(this.elementRef.nativeElement.value);\n this.elementRef.nativeElement.value = \"\";\n event.preventDefault();\n }\n\n public ngOnInit(): void {\n this.setupAsyncTypeahead();\n\n const parentElement = this.elementRef.nativeElement.parentElement;\n if (parentElement.classList.contains(\"mat-mdc-form-field-infix\")) {\n parentElement.style.alignItems = \"flex-start\";\n parentElement.style.flexDirection = \"column-reverse\";\n }\n\n const withItemList = this.withItemList();\n withItemList.setItemsReactivity(toObservable(this.values, { injector: this.injector }));\n withItemList.removeChip.subscribe((index) => {\n const values = [...this.values()];\n values.splice(index, 1);\n\n this.propagateChanges?.(values);\n this.values.set(values);\n });\n\n if (this.asyncTypeahead) {\n withItemList.setFormatLabel((item) => this.asyncTypeahead!.formatLabel(item));\n }\n }\n\n public writeValue(obj: T[] \| null): void {\n if (!obj) {\n this.values.set([]);\n } else if (Array.isArray(obj)) {\n this.values.set([...obj]);\n }\n }\n\n public registerOnChange(fn: (_: T[]) => void): void {\n this.propagateChanges = fn;\n }\n\n public registerOnTouched(): void {\n return;\n }\n\n private setupAsyncTypeahead(): void {\n if (!this.asyncTypeahead) {\n return;\n }\n\n this.asyncTypeahead.selected\n .subscribe((value) => {\n if (!value) {\n return;\n }\n\n this.addValue(value);\n this.asyncTypeahead?.removeActiveValue();\n });\n }\n\n private addValue(value: T): void {\n const values = [...this.values()];\n if (values.includes(value)) {\n return;\n }\n\n values.push(value);\n this.propagateChanges?.(values);\n this.values.set(values);\n }\n\n private updateTypeaheadSearchOptions(ignore: T[]): void {\n if (!this.asyncTypeahead) {\n return;\n }\n\n const searchOptions = this.asyncTypeahead.searchOptions();\n this.asyncTypeahead.setSearchOptions({ ...(searchOptions ?? {}), ignore });\n }\n}\n","import { Component, ChangeDetectionStrategy } from \"@angular/core\";\n\n@Component({\n selector: \"nice-chip-list-items-clear-icon\",\n changeDetection: ChangeDetectionStrategy.Eager,\n templateUrl: \"chip-list-items-clear-icon.svg\"\n})\nexport class NiceChipListItemsClearIcon {}\n","<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>\n","import { ChangeDetectionStrategy, Component, inject, Injector, output, Signal } from \"@angular/core\";\nimport { toSignal } from \"@angular/core/rxjs-interop\";\nimport { MatChipRemove, MatChipRow, MatChipSet } from \"@angular/material/chips\";\nimport { Observable } from \"rxjs\";\nimport { NiceChipListItemsClearIcon } from \"../icons/clear/chip-list-items-clear-icon\";\n\n@Component({\n selector: \"nice-chip-list-items\",\n templateUrl: \"./chip-list-items.html\",\n styleUrls: [\"./chip-list-items.scss\"],\n imports: [\n MatChipSet,\n MatChipRemove,\n MatChipRow,\n NiceChipListItemsClearIcon\n ],\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class NiceChipListItems<T> {\n public readonly removeChip = output<number>();\n\n protected readonly injector = inject(Injector);\n\n public items?: Signal<T[]>;\n public formatLabelFn?: (value: T) => string;\n\n public setItemsReactivity(items$: Observable<T[]>): void {\n this.items = toSignal(items$, { injector: this.injector, initialValue: [] });\n }\n\n public setFormatLabel(fn: (value: T) => string): void {\n this.formatLabelFn = fn;\n }\n\n public remove(index: number): void {\n this.removeChip.emit(index);\n }\n}\n","@if (items) {\n <mat-chip-set>\n @for (item of items(); track item) {\n <mat-chip-row [highlighted]=\"true\" (removed)=\"remove($index)\">\n @if (formatLabelFn) {\n {{ formatLabelFn(item) }}\n } @else {\n {{ item }}\n }\n\n <button matChipRemove>\n <nice-chip-list-items-clear-icon />\n </button>\n </mat-chip-row>\n }\n </mat-chip-set>\n}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/recursyve-ngx-material-components-common.mjs CHANGED Viewed

@@ -17,10 +17,10 @@ class NiceTranslatePipe {
     transform(key, params) {
         return this.translater(key, params);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceTranslatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.5", ngImport: i0, type: NiceTranslatePipe, isStandalone: true, name: "niceTranslate" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceTranslatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.0", ngImport: i0, type: NiceTranslatePipe, isStandalone: true, name: "niceTranslate" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceTranslatePipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceTranslatePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: "niceTranslate"

package/fesm2022/recursyve-ngx-material-components-dropzone.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, output, HostListener, Output, HostBinding, Directive, InjectionToken, Component, inject, Pipe, input, computed, viewChild, ElementRef, signal, effect, forwardRef, ViewEncapsulation } from '@angular/core';
+import { EventEmitter, output, HostListener, Output, HostBinding, Directive, InjectionToken, ChangeDetectionStrategy, Component, inject, Pipe, input, computed, viewChild, ElementRef, signal, effect, forwardRef, ViewEncapsulation } from '@angular/core';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import { MatRippleLoader } from '@angular/material/core';
@@ -34,10 +34,10 @@ class NiceDropzoneDirective {
             this.filesDropped.emit(files);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.5", type: NiceDropzoneDirective, isStandalone: true, selector: "[niceDropzone]", outputs: { filesDropped: "filesDropped", files: "files" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.file-over": "this.fileOver" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.0", type: NiceDropzoneDirective, isStandalone: true, selector: "[niceDropzone]", outputs: { filesDropped: "filesDropped", files: "files" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.file-over": "this.fileOver" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: "[niceDropzone]",
@@ -62,21 +62,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImpor
 const NICE_DROPZONE_TRANSLATION_KEYS = new InjectionToken("nice_dropzone_translation_keys");
 class NiceDropzoneFileIcon {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneFileIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: NiceDropzoneFileIcon, isStandalone: true, selector: "nice-dropzone-file-icon", ngImport: i0, template: "<svg fill=\"none\" viewBox=\"-1.25 -1.25 40 40\" height=\"40\" width=\"40\">\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5.859375 36.328125h25.78125c1.294375 0 2.34375 -1.049375 2.34375 -2.34375V12.6890625c-0.00015625 -0.621171875 -0.246875 -1.2168750000000002 -0.6859375 -1.65625l-9.175 -9.175c-0.439375 -0.43909062499999996 -1.03515625 -0.6858046875 -1.65625 -0.6859375H5.859375c-1.2765624999999998 0 -2.34375 1.0671875000000002 -2.34375 2.34375v30.46875c0 1.2765624999999998 1.0671875000000002 2.34375 2.34375 2.34375Z\" stroke-width=\"2.5\"></path>\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M33.984375 12.890625h-9.375c-0.6215625 0 -1.2178125 -0.24693750000000003 -1.65734375 -0.68646875S22.265625 11.16846875 22.265625 10.546875v-9.375\" stroke-width=\"2.5\"></path>\n</svg>" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneFileIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NiceDropzoneFileIcon, isStandalone: true, selector: "nice-dropzone-file-icon", ngImport: i0, template: "<svg fill=\"none\" viewBox=\"-1.25 -1.25 40 40\" height=\"40\" width=\"40\">\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5.859375 36.328125h25.78125c1.294375 0 2.34375 -1.049375 2.34375 -2.34375V12.6890625c-0.00015625 -0.621171875 -0.246875 -1.2168750000000002 -0.6859375 -1.65625l-9.175 -9.175c-0.439375 -0.43909062499999996 -1.03515625 -0.6858046875 -1.65625 -0.6859375H5.859375c-1.2765624999999998 0 -2.34375 1.0671875000000002 -2.34375 2.34375v30.46875c0 1.2765624999999998 1.0671875000000002 2.34375 2.34375 2.34375Z\" stroke-width=\"2.5\"></path>\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M33.984375 12.890625h-9.375c-0.6215625 0 -1.2178125 -0.24693750000000003 -1.65734375 -0.68646875S22.265625 11.16846875 22.265625 10.546875v-9.375\" stroke-width=\"2.5\"></path>\n</svg>", changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneFileIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneFileIcon, decorators: [{
             type: Component,
-            args: [{ selector: "nice-dropzone-file-icon", template: "<svg fill=\"none\" viewBox=\"-1.25 -1.25 40 40\" height=\"40\" width=\"40\">\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5.859375 36.328125h25.78125c1.294375 0 2.34375 -1.049375 2.34375 -2.34375V12.6890625c-0.00015625 -0.621171875 -0.246875 -1.2168750000000002 -0.6859375 -1.65625l-9.175 -9.175c-0.439375 -0.43909062499999996 -1.03515625 -0.6858046875 -1.65625 -0.6859375H5.859375c-1.2765624999999998 0 -2.34375 1.0671875000000002 -2.34375 2.34375v30.46875c0 1.2765624999999998 1.0671875000000002 2.34375 2.34375 2.34375Z\" stroke-width=\"2.5\"></path>\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M33.984375 12.890625h-9.375c-0.6215625 0 -1.2178125 -0.24693750000000003 -1.65734375 -0.68646875S22.265625 11.16846875 22.265625 10.546875v-9.375\" stroke-width=\"2.5\"></path>\n</svg>" }]
+            args: [{ selector: "nice-dropzone-file-icon", changeDetection: ChangeDetectionStrategy.Eager, template: "<svg fill=\"none\" viewBox=\"-1.25 -1.25 40 40\" height=\"40\" width=\"40\">\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M5.859375 36.328125h25.78125c1.294375 0 2.34375 -1.049375 2.34375 -2.34375V12.6890625c-0.00015625 -0.621171875 -0.246875 -1.2168750000000002 -0.6859375 -1.65625l-9.175 -9.175c-0.439375 -0.43909062499999996 -1.03515625 -0.6858046875 -1.65625 -0.6859375H5.859375c-1.2765624999999998 0 -2.34375 1.0671875000000002 -2.34375 2.34375v30.46875c0 1.2765624999999998 1.0671875000000002 2.34375 2.34375 2.34375Z\" stroke-width=\"2.5\"></path>\n    <path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M33.984375 12.890625h-9.375c-0.6215625 0 -1.2178125 -0.24693750000000003 -1.65734375 -0.68646875S22.265625 11.16846875 22.265625 10.546875v-9.375\" stroke-width=\"2.5\"></path>\n</svg>" }]
         }] });
 class NiceDropzoneImageIcon {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneImageIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: NiceDropzoneImageIcon, isStandalone: true, selector: "nice-dropzone-image-icon", ngImport: i0, template: "<svg width=\"40\" height=\"43\" viewBox=\"0 0 40 43\" fill=\"none\">\n    <path d=\"M29.333 1.5H2.66634C1.92996 1.5 1.33301 2.09695 1.33301 2.83333V33.0556C1.33301 33.7919 1.92996 34.3889 2.66634 34.3889H29.333C30.0694 34.3889 30.6663 33.7919 30.6663 33.0556V2.83333C30.6663 2.09695 30.0694 1.5 29.333 1.5Z\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M38.6667 11.2778V40.1667C38.6621 40.5189 38.5201 40.8554 38.2711 41.1044C38.022 41.3535 37.6855 41.4954 37.3333 41.5001H12\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M30.6663 27.2778H1.33301\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M7.55566 27.2778L16.8001 14.0689C17.0316 13.7366 17.3357 13.4614 17.6895 13.2642C18.0432 13.0669 18.4372 12.9528 18.8415 12.9306C19.2459 12.9083 19.6501 12.9784 20.0233 13.1356C20.3965 13.2928 20.7291 13.533 20.9957 13.8378L30.6668 25.0556\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M9.33268 6.8335C9.8601 6.8335 10.3757 6.98989 10.8142 7.28291C11.2527 7.57593 11.5945 7.9924 11.7964 8.47967C11.9982 8.96694 12.051 9.50312 11.9481 10.0204C11.8452 10.5377 11.5912 11.0128 11.2183 11.3858C10.8454 11.7587 10.3702 12.0127 9.85292 12.1156C9.33564 12.2185 8.79946 12.1657 8.31219 11.9638C7.82492 11.762 7.40845 11.4202 7.11543 10.9817C6.82241 10.5432 6.66602 10.0276 6.66602 9.50016C6.66602 8.79292 6.94697 8.11464 7.44706 7.61454C7.94716 7.11445 8.62544 6.8335 9.33268 6.8335\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneImageIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NiceDropzoneImageIcon, isStandalone: true, selector: "nice-dropzone-image-icon", ngImport: i0, template: "<svg width=\"40\" height=\"43\" viewBox=\"0 0 40 43\" fill=\"none\">\n    <path d=\"M29.333 1.5H2.66634C1.92996 1.5 1.33301 2.09695 1.33301 2.83333V33.0556C1.33301 33.7919 1.92996 34.3889 2.66634 34.3889H29.333C30.0694 34.3889 30.6663 33.7919 30.6663 33.0556V2.83333C30.6663 2.09695 30.0694 1.5 29.333 1.5Z\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M38.6667 11.2778V40.1667C38.6621 40.5189 38.5201 40.8554 38.2711 41.1044C38.022 41.3535 37.6855 41.4954 37.3333 41.5001H12\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M30.6663 27.2778H1.33301\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M7.55566 27.2778L16.8001 14.0689C17.0316 13.7366 17.3357 13.4614 17.6895 13.2642C18.0432 13.0669 18.4372 12.9528 18.8415 12.9306C19.2459 12.9083 19.6501 12.9784 20.0233 13.1356C20.3965 13.2928 20.7291 13.533 20.9957 13.8378L30.6668 25.0556\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M9.33268 6.8335C9.8601 6.8335 10.3757 6.98989 10.8142 7.28291C11.2527 7.57593 11.5945 7.9924 11.7964 8.47967C11.9982 8.96694 12.051 9.50312 11.9481 10.0204C11.8452 10.5377 11.5912 11.0128 11.2183 11.3858C10.8454 11.7587 10.3702 12.0127 9.85292 12.1156C9.33564 12.2185 8.79946 12.1657 8.31219 11.9638C7.82492 11.762 7.40845 11.4202 7.11543 10.9817C6.82241 10.5432 6.66602 10.0276 6.66602 9.50016C6.66602 8.79292 6.94697 8.11464 7.44706 7.61454C7.94716 7.11445 8.62544 6.8335 9.33268 6.8335\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>\n", changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneImageIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneImageIcon, decorators: [{
             type: Component,
-            args: [{ selector: "nice-dropzone-image-icon", template: "<svg width=\"40\" height=\"43\" viewBox=\"0 0 40 43\" fill=\"none\">\n    <path d=\"M29.333 1.5H2.66634C1.92996 1.5 1.33301 2.09695 1.33301 2.83333V33.0556C1.33301 33.7919 1.92996 34.3889 2.66634 34.3889H29.333C30.0694 34.3889 30.6663 33.7919 30.6663 33.0556V2.83333C30.6663 2.09695 30.0694 1.5 29.333 1.5Z\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M38.6667 11.2778V40.1667C38.6621 40.5189 38.5201 40.8554 38.2711 41.1044C38.022 41.3535 37.6855 41.4954 37.3333 41.5001H12\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M30.6663 27.2778H1.33301\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M7.55566 27.2778L16.8001 14.0689C17.0316 13.7366 17.3357 13.4614 17.6895 13.2642C18.0432 13.0669 18.4372 12.9528 18.8415 12.9306C19.2459 12.9083 19.6501 12.9784 20.0233 13.1356C20.3965 13.2928 20.7291 13.533 20.9957 13.8378L30.6668 25.0556\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M9.33268 6.8335C9.8601 6.8335 10.3757 6.98989 10.8142 7.28291C11.2527 7.57593 11.5945 7.9924 11.7964 8.47967C11.9982 8.96694 12.051 9.50312 11.9481 10.0204C11.8452 10.5377 11.5912 11.0128 11.2183 11.3858C10.8454 11.7587 10.3702 12.0127 9.85292 12.1156C9.33564 12.2185 8.79946 12.1657 8.31219 11.9638C7.82492 11.762 7.40845 11.4202 7.11543 10.9817C6.82241 10.5432 6.66602 10.0276 6.66602 9.50016C6.66602 8.79292 6.94697 8.11464 7.44706 7.61454C7.94716 7.11445 8.62544 6.8335 9.33268 6.8335\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>\n" }]
+            args: [{ selector: "nice-dropzone-image-icon", changeDetection: ChangeDetectionStrategy.Eager, template: "<svg width=\"40\" height=\"43\" viewBox=\"0 0 40 43\" fill=\"none\">\n    <path d=\"M29.333 1.5H2.66634C1.92996 1.5 1.33301 2.09695 1.33301 2.83333V33.0556C1.33301 33.7919 1.92996 34.3889 2.66634 34.3889H29.333C30.0694 34.3889 30.6663 33.7919 30.6663 33.0556V2.83333C30.6663 2.09695 30.0694 1.5 29.333 1.5Z\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M38.6667 11.2778V40.1667C38.6621 40.5189 38.5201 40.8554 38.2711 41.1044C38.022 41.3535 37.6855 41.4954 37.3333 41.5001H12\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M30.6663 27.2778H1.33301\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M7.55566 27.2778L16.8001 14.0689C17.0316 13.7366 17.3357 13.4614 17.6895 13.2642C18.0432 13.0669 18.4372 12.9528 18.8415 12.9306C19.2459 12.9083 19.6501 12.9784 20.0233 13.1356C20.3965 13.2928 20.7291 13.533 20.9957 13.8378L30.6668 25.0556\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n    <path d=\"M9.33268 6.8335C9.8601 6.8335 10.3757 6.98989 10.8142 7.28291C11.2527 7.57593 11.5945 7.9924 11.7964 8.47967C11.9982 8.96694 12.051 9.50312 11.9481 10.0204C11.8452 10.5377 11.5912 11.0128 11.2183 11.3858C10.8454 11.7587 10.3702 12.0127 9.85292 12.1156C9.33564 12.2185 8.79946 12.1657 8.31219 11.9638C7.82492 11.762 7.40845 11.4202 7.11543 10.9817C6.82241 10.5432 6.66602 10.0276 6.66602 9.50016C6.66602 8.79292 6.94697 8.11464 7.44706 7.61454C7.94716 7.11445 8.62544 6.8335 9.33268 6.8335\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n</svg>\n" }]
         }] });
 function isLocalFile(file) {
@@ -101,10 +101,10 @@ class FileSizePipe {
         const unit = this.translater(this.translationKeys.size.units[this.units[boundedUnitIndex]]);
         return `${size.toFixed(precision)} ${unit}`;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: FileSizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.5", ngImport: i0, type: FileSizePipe, isStandalone: true, name: "niceFileSize" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: FileSizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.0", ngImport: i0, type: FileSizePipe, isStandalone: true, name: "niceFileSize" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: FileSizePipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: FileSizePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: "niceFileSize"
@@ -112,61 +112,72 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImpor
         }] });
 class NiceDropzoneDeleteIcon {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneDeleteIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.5", type: NiceDropzoneDeleteIcon, isStandalone: true, selector: "nice-dropzone-delete-icon", ngImport: i0, template: "<svg viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\" focusable=\"false\" aria-hidden=\"true\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneDeleteIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: NiceDropzoneDeleteIcon, isStandalone: true, selector: "nice-dropzone-delete-icon", ngImport: i0, template: "<svg viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\" focusable=\"false\" aria-hidden=\"true\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>", changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneDeleteIcon, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneDeleteIcon, decorators: [{
             type: Component,
-            args: [{ selector: "nice-dropzone-delete-icon", template: "<svg viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\" focusable=\"false\" aria-hidden=\"true\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>" }]
+            args: [{ selector: "nice-dropzone-delete-icon", changeDetection: ChangeDetectionStrategy.Eager, template: "<svg viewBox=\"0 0 24 24\" width=\"24px\" height=\"24px\" focusable=\"false\" aria-hidden=\"true\">\n    <path d=\"M12 0a12 12 0 1 0 12 12A12 12 0 0 0 12 0Zm5.49 16.07a1 1 0 0 1 -1.41 1.42l-3.9 -3.9a0.25 0.25 0 0 0 -0.36 0l-3.9 3.9a1 1 0 1 1 -1.41 -1.42l3.9 -3.89a0.25 0.25 0 0 0 0 -0.36l-3.9 -3.9a1 1 0 0 1 1.41 -1.41l3.9 3.9a0.25 0.25 0 0 0 0.36 0l3.9 -3.9a1 1 0 0 1 1.41 1.41l-3.9 3.9a0.25 0.25 0 0 0 0 0.36Z\" fill=\"currentColor\" stroke-width=\"1\"></path>\n</svg>" }]
         }] });
 class NiceDropzoneFilePreview {
-    file = input.required(...(ngDevMode ? [{ debugName: "file" }] : []));
-    mode = input.required(...(ngDevMode ? [{ debugName: "mode" }] : []));
+    file = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "file" }] : /* istanbul ignore next */ []));
+    mode = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
     clickDelete = output();
-    isImage = computed(() => this.mode() === "image", ...(ngDevMode ? [{ debugName: "isImage" }] : []));
+    isImage = computed(() => this.mode() === "image", /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isImage" }] : /* istanbul ignore next */ []));
     imageDimensions = computed(() => {
         const file = this.file();
         if (isLocalFile(file)) {
             return file.dimensions ?? null;
         }
         return null;
-    }, ...(ngDevMode ? [{ debugName: "imageDimensions" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "imageDimensions" }] : /* istanbul ignore next */ []));
     imageUrl = computed(() => {
         const file = this.file();
         if (isLocalFile(file)) {
             return URL.createObjectURL(file.file);
         }
         return file.url;
-    }, ...(ngDevMode ? [{ debugName: "imageUrl" }] : []));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "imageUrl" }] : /* istanbul ignore next */ []));
     _translationKeys = inject(NICE_DROPZONE_TRANSLATION_KEYS);
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneFilePreview, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: NiceDropzoneFilePreview, isStandalone: true, selector: "nice-dropzone-file-preview", inputs: { file: { classPropertyName: "file", publicName: "file", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { clickDelete: "clickDelete" }, host: { styleAttribute: "flex: 1 1 auto;" }, ngImport: i0, template: "<div class=\"nice-dropzone-preview\">\n    @if (isImage()) {\n        <img class=\"nice-dropzone-preview-image\" alt=\"\" draggable=\"false\" [src]=\"imageUrl()\" />\n    } @else {\n        <div class=\"nice-dropzone-preview-file\">\n            <nice-dropzone-file-icon />\n        </div>\n    }\n\n    <div class=\"nice-dropzone-preview-file-info\">\n        <span class=\"mat-body-medium\">{{ file().name }}</span>\n\n        @if (imageDimensions(); as dimension) {\n            <span class=\"mat-label-medium\">\n                {{ `${dimension.width}x${dimension.height}` }} {{ _translationKeys.ratio.pixels | niceTranslate }}\n            </span>\n        }\n\n        @if (file().size; as size) {\n            <span class=\"mat-label-medium\">{{ size | niceFileSize }}</span>\n        }\n    </div>\n\n    <div class=\"nice-dropzone-preview-actions\">\n        <button class=\"nice-dropzone-preview-actions-delete\" (click)=\"$event.stopPropagation(); clickDelete.emit()\">\n            <nice-dropzone-delete-icon />\n        </button>\n    </div>\n</div>\n", styles: [".nice-dropzone-preview{position:relative;display:flex;align-items:center;justify-content:center;flex:1 1 auto;gap:32px;height:100px;padding-top:12px;padding-bottom:12px;border-style:solid;border-radius:var(--nice-dropzone-shape, 8px);border-width:var(--nice-dropzone-border-width, 1px);border-color:var(--nice-dropzone-border-color, var(--mat-sys-primary))}.nice-dropzone-preview .nice-dropzone-preview-image{max-height:100%;max-width:min(200px,50%);-webkit-user-select:none;user-select:none}.nice-dropzone-preview .nice-dropzone-preview-file{color:var(--mat-sys-primary)}.nice-dropzone-preview .nice-dropzone-preview-file-info{display:flex;flex-direction:column;gap:4px;max-width:min(400px,40%);-webkit-user-select:none;user-select:none}.nice-dropzone-preview .nice-dropzone-preview-actions{position:absolute;width:24px;height:24px;background-color:var(--mat-sys-on-primary);border-radius:50%;top:-12px;right:-12px;opacity:0;transition:opacity .1s ease-in-out}.nice-dropzone-preview .nice-dropzone-preview-actions .nice-dropzone-preview-actions-delete{background-color:transparent;color:var(--mat-sys-primary);border:none;cursor:pointer;padding:0}.nice-dropzone-preview:hover .nice-dropzone-preview-actions,.nice-dropzone-preview:focus .nice-dropzone-preview-actions{opacity:1}\n"], dependencies: [{ kind: "component", type: NiceDropzoneDeleteIcon, selector: "nice-dropzone-delete-icon" }, { kind: "component", type: NiceDropzoneFileIcon, selector: "nice-dropzone-file-icon" }, { kind: "pipe", type: NiceTranslatePipe, name: "niceTranslate" }, { kind: "pipe", type: FileSizePipe, name: "niceFileSize" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneFilePreview, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NiceDropzoneFilePreview, isStandalone: true, selector: "nice-dropzone-file-preview", inputs: { file: { classPropertyName: "file", publicName: "file", isSignal: true, isRequired: true, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { clickDelete: "clickDelete" }, host: { styleAttribute: "flex: 1 1 auto;" }, ngImport: i0, template: "<div class=\"nice-dropzone-preview\">\n    @if (isImage()) {\n        <img class=\"nice-dropzone-preview-image\" alt=\"\" draggable=\"false\" [src]=\"imageUrl()\" />\n    } @else {\n        <div class=\"nice-dropzone-preview-file\">\n            <nice-dropzone-file-icon />\n        </div>\n    }\n\n    <div class=\"nice-dropzone-preview-file-info\">\n        <span class=\"mat-body-medium\">{{ file().name }}</span>\n\n        @if (imageDimensions(); as dimension) {\n            <span class=\"mat-label-medium\">\n                {{ `${dimension.width}x${dimension.height}` }} {{ _translationKeys.ratio.pixels | niceTranslate }}\n            </span>\n        }\n\n        @if (file().size; as size) {\n            <span class=\"mat-label-medium\">{{ size | niceFileSize }}</span>\n        }\n    </div>\n\n    <div class=\"nice-dropzone-preview-actions\">\n        <button class=\"nice-dropzone-preview-actions-delete\" (click)=\"$event.stopPropagation(); clickDelete.emit()\">\n            <nice-dropzone-delete-icon />\n        </button>\n    </div>\n</div>\n", styles: [".nice-dropzone-preview{position:relative;display:flex;align-items:center;justify-content:center;flex:1 1 auto;gap:32px;height:100px;padding-top:12px;padding-bottom:12px;border-style:solid;border-radius:var(--nice-dropzone-shape, 8px);border-width:var(--nice-dropzone-border-width, 1px);border-color:var(--nice-dropzone-border-color, var(--mat-sys-primary))}.nice-dropzone-preview .nice-dropzone-preview-image{max-height:100%;max-width:min(200px,50%);-webkit-user-select:none;user-select:none}.nice-dropzone-preview .nice-dropzone-preview-file{color:var(--mat-sys-primary)}.nice-dropzone-preview .nice-dropzone-preview-file-info{display:flex;flex-direction:column;gap:4px;max-width:min(400px,40%);-webkit-user-select:none;user-select:none}.nice-dropzone-preview .nice-dropzone-preview-actions{position:absolute;width:24px;height:24px;background-color:var(--mat-sys-on-primary);border-radius:50%;top:-12px;right:-12px;opacity:0;transition:opacity .1s ease-in-out}.nice-dropzone-preview .nice-dropzone-preview-actions .nice-dropzone-preview-actions-delete{background-color:transparent;color:var(--mat-sys-primary);border:none;cursor:pointer;padding:0}.nice-dropzone-preview:hover .nice-dropzone-preview-actions,.nice-dropzone-preview:focus .nice-dropzone-preview-actions{opacity:1}\n"], dependencies: [{ kind: "component", type: NiceDropzoneDeleteIcon, selector: "nice-dropzone-delete-icon" }, { kind: "component", type: NiceDropzoneFileIcon, selector: "nice-dropzone-file-icon" }, { kind: "pipe", type: NiceTranslatePipe, name: "niceTranslate" }, { kind: "pipe", type: FileSizePipe, name: "niceFileSize" }], changeDetection: i0.ChangeDetectionStrategy.Eager });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzoneFilePreview, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzoneFilePreview, decorators: [{
             type: Component,
-            args: [{ selector: "nice-dropzone-file-preview", imports: [NiceDropzoneDeleteIcon, NiceTranslatePipe, FileSizePipe, NiceDropzoneFileIcon], host: {
+            args: [{ selector: "nice-dropzone-file-preview", imports: [NiceDropzoneDeleteIcon, NiceTranslatePipe, FileSizePipe, NiceDropzoneFileIcon], changeDetection: ChangeDetectionStrategy.Eager, host: {
                         style: "flex: 1 1 auto;"
                     }, template: "<div class=\"nice-dropzone-preview\">\n    @if (isImage()) {\n        <img class=\"nice-dropzone-preview-image\" alt=\"\" draggable=\"false\" [src]=\"imageUrl()\" />\n    } @else {\n        <div class=\"nice-dropzone-preview-file\">\n            <nice-dropzone-file-icon />\n        </div>\n    }\n\n    <div class=\"nice-dropzone-preview-file-info\">\n        <span class=\"mat-body-medium\">{{ file().name }}</span>\n\n        @if (imageDimensions(); as dimension) {\n            <span class=\"mat-label-medium\">\n                {{ `${dimension.width}x${dimension.height}` }} {{ _translationKeys.ratio.pixels | niceTranslate }}\n            </span>\n        }\n\n        @if (file().size; as size) {\n            <span class=\"mat-label-medium\">{{ size | niceFileSize }}</span>\n        }\n    </div>\n\n    <div class=\"nice-dropzone-preview-actions\">\n        <button class=\"nice-dropzone-preview-actions-delete\" (click)=\"$event.stopPropagation(); clickDelete.emit()\">\n            <nice-dropzone-delete-icon />\n        </button>\n    </div>\n</div>\n", styles: [".nice-dropzone-preview{position:relative;display:flex;align-items:center;justify-content:center;flex:1 1 auto;gap:32px;height:100px;padding-top:12px;padding-bottom:12px;border-style:solid;border-radius:var(--nice-dropzone-shape, 8px);border-width:var(--nice-dropzone-border-width, 1px);border-color:var(--nice-dropzone-border-color, var(--mat-sys-primary))}.nice-dropzone-preview .nice-dropzone-preview-image{max-height:100%;max-width:min(200px,50%);-webkit-user-select:none;user-select:none}.nice-dropzone-preview .nice-dropzone-preview-file{color:var(--mat-sys-primary)}.nice-dropzone-preview .nice-dropzone-preview-file-info{display:flex;flex-direction:column;gap:4px;max-width:min(400px,40%);-webkit-user-select:none;user-select:none}.nice-dropzone-preview .nice-dropzone-preview-actions{position:absolute;width:24px;height:24px;background-color:var(--mat-sys-on-primary);border-radius:50%;top:-12px;right:-12px;opacity:0;transition:opacity .1s ease-in-out}.nice-dropzone-preview .nice-dropzone-preview-actions .nice-dropzone-preview-actions-delete{background-color:transparent;color:var(--mat-sys-primary);border:none;cursor:pointer;padding:0}.nice-dropzone-preview:hover .nice-dropzone-preview-actions,.nice-dropzone-preview:focus .nice-dropzone-preview-actions{opacity:1}\n"] }]
         }], propDecorators: { file: [{ type: i0.Input, args: [{ isSignal: true, alias: "file", required: true }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: true }] }], clickDelete: [{ type: i0.Output, args: ["clickDelete"] }] } });
 const niceDropzoneModes = ["image", "file", "all"];
 class NiceDropzone {
-    mode = input("all", ...(ngDevMode ? [{ debugName: "mode" }] : []));
-    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : {}), transform: coerceBooleanProperty });
-    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: coerceBooleanProperty });
-    accept = input(...(ngDevMode ? [undefined, { debugName: "accept" }] : []));
-    config = input(...(ngDevMode ? [undefined, { debugName: "config" }] : []));
-    maxFileSize = input(...(ngDevMode ? [undefined, { debugName: "maxFileSize" }] : []));
-    _elementRef = viewChild("element", { ...(ngDevMode ? { debugName: "_elementRef" } : {}), read: ElementRef });
-    _inputRef = viewChild("fileInput", ...(ngDevMode ? [{ debugName: "_inputRef" }] : []));
+    mode = input("all", /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "mode" }] : /* istanbul ignore next */ []));
+    multiple = input(false, { ...(ngDevMode ? { debugName: "multiple" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: coerceBooleanProperty });
+    accept = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "accept" }] : /* istanbul ignore next */ []));
+    config = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "config" }] : /* istanbul ignore next */ []));
+    maxFileSize = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "maxFileSize" }] : /* istanbul ignore next */ []));
+    _elementRef = viewChild("element", { ...(ngDevMode ? { debugName: "_elementRef" } : /* istanbul ignore next */ {}), read: ElementRef });
+    _inputRef = viewChild("fileInput", /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_inputRef" }] : /* istanbul ignore next */ []));
     /**
      * Handles the lazy creation of the MatButton ripple.
      * Used to improve the initial load time of large applications.
      */
     _rippleLoader = inject(MatRippleLoader);
     _translationKeys = inject(NICE_DROPZONE_TRANSLATION_KEYS);
-    files = signal([], ...(ngDevMode ? [{ debugName: "files" }] : []));
+    files = signal([], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "files" }] : /* istanbul ignore next */ []));
     _disabled = false;
     _onChange;
     _value = null;
@@ -283,16 +294,16 @@ class NiceDropzone {
         }
         input.nativeElement.value = "";
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzone, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.5", type: NiceDropzone, isStandalone: true, selector: "nice-dropzone", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzone, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.0", type: NiceDropzone, isStandalone: true, selector: "nice-dropzone", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, maxFileSize: { classPropertyName: "maxFileSize", publicName: "maxFileSize", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => NiceDropzone),
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "_elementRef", first: true, predicate: ["element"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "_inputRef", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n    class=\"nice-dropzone-container\"\n>\n    <div\n        #element\n        role=\"none\"\n        class=\"nice-dropzone\"\n        [class.nice-dropzone-disabled]=\"_disabled\"\n        [class.nice-dropzone-multiple]=\"multiple()\"\n        [class.nice-dropzone-single]=\"!multiple()\"\n        [class.nice-dropzone-image]=\"mode() === 'image'\"\n        [class.nice-dropzone-file]=\"mode() === 'file'\"\n        [class.nice-dropzone-all]=\"mode() === 'all'\"\n        [class.nice-dropzone-selected]=\"files().length > 0\"\n\n        niceDropzone\n        (filesDropped)=\"onFilesDropped($event)\"\n        (click)=\"fileInput.click()\"\n        (keyup.enter)=\"fileInput.click()\"\n    >\n        <div class=\"nice-dropzone-ripple\"></div>\n\n        @if (multiple() || (!multiple() && !files().length)) {\n            <div class=\"nice-dropzone-placeholder\">\n                <div class=\"nice-dropzone-icon\">\n                    @if (mode() === \"image\") {\n                        <nice-dropzone-image-icon />\n                    } @else {\n                        <nice-dropzone-file-icon />\n                    }\n                </div>\n\n                <div class=\"nice-dropzone-content\">\n                    <span class=\"nice-dropzone-content-title\">\n                        @if (mode() === \"image\") {\n                            @if (multiple()) {\n                                {{ _translationKeys.upload.images | niceTranslate }}\n                            } @else {\n                                {{ _translationKeys.upload.image | niceTranslate }}\n                            }\n                        } @else {\n                            @if (multiple()) {\n                                {{ _translationKeys.upload.files | niceTranslate }}\n                            } @else {\n                                {{ _translationKeys.upload.file | niceTranslate }}\n                            }\n                        }\n                    </span>\n\n                    <div class=\"nice-dropzone-content-description\">\n                        @if (accept()?.length) {\n                            <span>\n                                {{ _translationKeys.format.label | niceTranslate }}:&nbsp;\n\n                                <span>\n                                    {{ accept()?.join(\", \") }}\n                                </span>\n                            </span>\n                        }\n\n                        @if (mode() === \"image\" && config()?.recommendedSize; as recommendedSize) {\n                            <span>\n                                {{ _translationKeys.ratio.label | niceTranslate }}:&nbsp;\n\n                                <span>{{ recommendedSize.width }}x{{ recommendedSize.height }} {{ _translationKeys.ratio.pixels | niceTranslate }}</span>\n                            </span>\n                        }\n\n                        @if (maxFileSize(); as maxFileSize) {\n                            <span>\n                                {{ _translationKeys.size.label | niceTranslate }}:&nbsp;\n\n                                <span>{{ maxFileSize.size }} {{ _translationKeys.size.units[maxFileSize.unit] | niceTranslate }}</span>\n                            </span>\n                        }\n                    </div>\n                </div>\n            </div>\n        } @else {\n            <nice-dropzone-file-preview [file]=\"files()[0]\" [mode]=\"mode()\" (clickDelete)=\"onFileDelete(0)\" />\n        }\n    </div>\n\n    @if (multiple()) {\n        <div class=\"nice-dropzone-multiple-files-preview\">\n            @for (file of files(); track file) {\n                <nice-dropzone-file-preview [file]=\"file\" [mode]=\"mode()\" (clickDelete)=\"onFileDelete($index)\" />\n            }\n        </div>\n    }\n</div>\n\n<input #fileInput style=\"display: none;\" type=\"file\" [accept]=\"accept()\" [multiple]=\"multiple()\" (change)=\"onFileChanged($event)\" />\n", styles: [".nice-dropzone-container{--nice-dropzone-ripple-color: color-mix(in srgb, var(--mat-sys-primary) 10%, transparent);--mat-ripple-color: var(--nice-dropzone-ripple-color)}.nice-dropzone-container .nice-dropzone{position:relative;display:flex;justify-content:center;place-items:center;cursor:pointer;min-height:124px;border-radius:var(--nice-dropzone-shape, 8px)}.nice-dropzone-container .nice-dropzone.nice-dropzone-single:not(.nice-dropzone-selected),.nice-dropzone-container .nice-dropzone.nice-dropzone-multiple{border-style:dashed;border-width:var(--nice-dropzone-border-width, 1px);border-color:var(--nice-dropzone-border-color, var(--mat-sys-primary))}.nice-dropzone-container .nice-dropzone .nice-dropzone-placeholder{display:flex;justify-content:center;place-items:center;gap:32px}.nice-dropzone-container .nice-dropzone .nice-dropzone-icon{color:var(--nice-dropzone-icon-color, var(--mat-sys-primary))}.nice-dropzone-container .nice-dropzone .nice-dropzone-content{-webkit-user-select:none;user-select:none;color:var(--nice-dropzone-text-color, var(--mat-sys-primary))}.nice-dropzone-container .nice-dropzone .nice-dropzone-content .nice-dropzone-content-title{font-size:var(--nice-dropzone-content-title-font-size, 18px);font-weight:var(--nice-dropzone-content-title-font-weight, 600);line-height:var(--nice-dropzone-content-title-line-height, 22px)}.nice-dropzone-container .nice-dropzone .nice-dropzone-content .nice-dropzone-content-description{padding-top:4px;display:flex;flex-direction:column;gap:4px;font-size:var(--nice-dropzone-content-description-font-size, 14px);font-weight:var(--nice-dropzone-content-description-font-weight, 400);line-height:var(--nice-dropzone-content-description-line-height, 16px)}.nice-dropzone-container .nice-dropzone .nice-dropzone-ripple,.nice-dropzone-container .nice-dropzone .nice-dropzone-ripple:before{inset:0;position:absolute;pointer-events:none;border-radius:inherit}.nice-dropzone-container .nice-dropzone .nice-dropzone-ripple{overflow:hidden}.nice-dropzone-container .nice-dropzone .mat-ripple-element{background-color:var(--nice-dropzone-ripple-color)}.nice-dropzone-container .nice-dropzone:hover{background-color:var(--nice-dropzone-hover-color, color-mix(in srgb, var(--mat-sys-primary) 20%, transparent))}.nice-dropzone-container .nice-dropzone.nice-dropzone-disabled{cursor:default;pointer-events:none;opacity:.5}.nice-dropzone-container .nice-dropzone-multiple-files-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding-top:16px}\n"], dependencies: [{ kind: "directive", type: NiceDropzoneDirective, selector: "[niceDropzone]", outputs: ["filesDropped", "files"] }, { kind: "component", type: NiceDropzoneImageIcon, selector: "nice-dropzone-image-icon" }, { kind: "component", type: NiceDropzoneFileIcon, selector: "nice-dropzone-file-icon" }, { kind: "component", type: NiceDropzoneFilePreview, selector: "nice-dropzone-file-preview", inputs: ["file", "mode"], outputs: ["clickDelete"] }, { kind: "pipe", type: NiceTranslatePipe, name: "niceTranslate" }], encapsulation: i0.ViewEncapsulation.None });
+        ], viewQueries: [{ propertyName: "_elementRef", first: true, predicate: ["element"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "_inputRef", first: true, predicate: ["fileInput"], descendants: true, isSignal: true }], ngImport: i0, template: "<div\n    class=\"nice-dropzone-container\"\n>\n    <div\n        #element\n        role=\"none\"\n        class=\"nice-dropzone\"\n        [class.nice-dropzone-disabled]=\"_disabled\"\n        [class.nice-dropzone-multiple]=\"multiple()\"\n        [class.nice-dropzone-single]=\"!multiple()\"\n        [class.nice-dropzone-image]=\"mode() === 'image'\"\n        [class.nice-dropzone-file]=\"mode() === 'file'\"\n        [class.nice-dropzone-all]=\"mode() === 'all'\"\n        [class.nice-dropzone-selected]=\"files().length > 0\"\n\n        niceDropzone\n        (filesDropped)=\"onFilesDropped($event)\"\n        (click)=\"fileInput.click()\"\n        (keyup.enter)=\"fileInput.click()\"\n    >\n        <div class=\"nice-dropzone-ripple\"></div>\n\n        @if (multiple() || (!multiple() && !files().length)) {\n            <div class=\"nice-dropzone-placeholder\">\n                <div class=\"nice-dropzone-icon\">\n                    @if (mode() === \"image\") {\n                        <nice-dropzone-image-icon />\n                    } @else {\n                        <nice-dropzone-file-icon />\n                    }\n                </div>\n\n                <div class=\"nice-dropzone-content\">\n                    <span class=\"nice-dropzone-content-title\">\n                        @if (mode() === \"image\") {\n                            @if (multiple()) {\n                                {{ _translationKeys.upload.images | niceTranslate }}\n                            } @else {\n                                {{ _translationKeys.upload.image | niceTranslate }}\n                            }\n                        } @else {\n                            @if (multiple()) {\n                                {{ _translationKeys.upload.files | niceTranslate }}\n                            } @else {\n                                {{ _translationKeys.upload.file | niceTranslate }}\n                            }\n                        }\n                    </span>\n\n                    <div class=\"nice-dropzone-content-description\">\n                        @if (accept()?.length) {\n                            <span>\n                                {{ _translationKeys.format.label | niceTranslate }}:&nbsp;\n\n                                <span>\n                                    {{ accept()?.join(\", \") }}\n                                </span>\n                            </span>\n                        }\n\n                        @if (mode() === \"image\" && config()?.recommendedSize; as recommendedSize) {\n                            <span>\n                                {{ _translationKeys.ratio.label | niceTranslate }}:&nbsp;\n\n                                <span>{{ recommendedSize.width }}x{{ recommendedSize.height }} {{ _translationKeys.ratio.pixels | niceTranslate }}</span>\n                            </span>\n                        }\n\n                        @if (maxFileSize(); as maxFileSize) {\n                            <span>\n                                {{ _translationKeys.size.label | niceTranslate }}:&nbsp;\n\n                                <span>{{ maxFileSize.size }} {{ _translationKeys.size.units[maxFileSize.unit] | niceTranslate }}</span>\n                            </span>\n                        }\n                    </div>\n                </div>\n            </div>\n        } @else {\n            <nice-dropzone-file-preview [file]=\"files()[0]\" [mode]=\"mode()\" (clickDelete)=\"onFileDelete(0)\" />\n        }\n    </div>\n\n    @if (multiple()) {\n        <div class=\"nice-dropzone-multiple-files-preview\">\n            @for (file of files(); track file) {\n                <nice-dropzone-file-preview [file]=\"file\" [mode]=\"mode()\" (clickDelete)=\"onFileDelete($index)\" />\n            }\n        </div>\n    }\n</div>\n\n<input #fileInput style=\"display: none;\" type=\"file\" [accept]=\"accept()\" [multiple]=\"multiple()\" (change)=\"onFileChanged($event)\" />\n", styles: [".nice-dropzone-container{--nice-dropzone-ripple-color: color-mix(in srgb, var(--mat-sys-primary) 10%, transparent);--mat-ripple-color: var(--nice-dropzone-ripple-color)}.nice-dropzone-container .nice-dropzone{position:relative;display:flex;justify-content:center;place-items:center;cursor:pointer;min-height:124px;border-radius:var(--nice-dropzone-shape, 8px)}.nice-dropzone-container .nice-dropzone.nice-dropzone-single:not(.nice-dropzone-selected),.nice-dropzone-container .nice-dropzone.nice-dropzone-multiple{border-style:dashed;border-width:var(--nice-dropzone-border-width, 1px);border-color:var(--nice-dropzone-border-color, var(--mat-sys-primary))}.nice-dropzone-container .nice-dropzone .nice-dropzone-placeholder{display:flex;justify-content:center;place-items:center;gap:32px}.nice-dropzone-container .nice-dropzone .nice-dropzone-icon{color:var(--nice-dropzone-icon-color, var(--mat-sys-primary))}.nice-dropzone-container .nice-dropzone .nice-dropzone-content{-webkit-user-select:none;user-select:none;color:var(--nice-dropzone-text-color, var(--mat-sys-primary))}.nice-dropzone-container .nice-dropzone .nice-dropzone-content .nice-dropzone-content-title{font-size:var(--nice-dropzone-content-title-font-size, 18px);font-weight:var(--nice-dropzone-content-title-font-weight, 600);line-height:var(--nice-dropzone-content-title-line-height, 22px)}.nice-dropzone-container .nice-dropzone .nice-dropzone-content .nice-dropzone-content-description{padding-top:4px;display:flex;flex-direction:column;gap:4px;font-size:var(--nice-dropzone-content-description-font-size, 14px);font-weight:var(--nice-dropzone-content-description-font-weight, 400);line-height:var(--nice-dropzone-content-description-line-height, 16px)}.nice-dropzone-container .nice-dropzone .nice-dropzone-ripple,.nice-dropzone-container .nice-dropzone .nice-dropzone-ripple:before{inset:0;position:absolute;pointer-events:none;border-radius:inherit}.nice-dropzone-container .nice-dropzone .nice-dropzone-ripple{overflow:hidden}.nice-dropzone-container .nice-dropzone .mat-ripple-element{background-color:var(--nice-dropzone-ripple-color)}.nice-dropzone-container .nice-dropzone:hover{background-color:var(--nice-dropzone-hover-color, color-mix(in srgb, var(--mat-sys-primary) 20%, transparent))}.nice-dropzone-container .nice-dropzone.nice-dropzone-disabled{cursor:default;pointer-events:none;opacity:.5}.nice-dropzone-container .nice-dropzone-multiple-files-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding-top:16px}\n"], dependencies: [{ kind: "directive", type: NiceDropzoneDirective, selector: "[niceDropzone]", outputs: ["filesDropped", "files"] }, { kind: "component", type: NiceDropzoneImageIcon, selector: "nice-dropzone-image-icon" }, { kind: "component", type: NiceDropzoneFileIcon, selector: "nice-dropzone-file-icon" }, { kind: "component", type: NiceDropzoneFilePreview, selector: "nice-dropzone-file-preview", inputs: ["file", "mode"], outputs: ["clickDelete"] }, { kind: "pipe", type: NiceTranslatePipe, name: "niceTranslate" }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImport: i0, type: NiceDropzone, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: NiceDropzone, decorators: [{
             type: Component,
             args: [{ selector: "nice-dropzone", imports: [
                         NiceDropzoneDirective,
@@ -300,7 +311,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.5", ngImpor
                         NiceDropzoneFileIcon,
                         NiceDropzoneFilePreview,
                         NiceTranslatePipe
-                    ], encapsulation: ViewEncapsulation.None, providers: [
+                    ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, providers: [
                         {
                             provide: NG_VALUE_ACCESSOR,
                             useExisting: forwardRef(() => NiceDropzone),