dolfo-angular 1.196.0 → 1.197.0

package/fesm2022/dolfo-angular.mjs

@@ -680,6 +680,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                 type: Output
             }] } });
 
+class IconWrapperComponent {
+    name;
+    iconComponent = inject(ICON_COMPONENT);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: IconWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: IconWrapperComponent, isStandalone: false, selector: "dolfo-icon", inputs: { name: "name" }, ngImport: i0, template: `<ng-container [ngComponentOutlet]="iconComponent" [ngComponentOutletInputs]="{ name }"></ng-container>`, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: IconWrapperComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "dolfo-icon",
+                    standalone: false,
+                    template: `<ng-container [ngComponentOutlet]="iconComponent" [ngComponentOutletInputs]="{ name }"></ng-container>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], propDecorators: { name: [{
+                type: Input,
+                args: [{ required: true }]
+            }] } });
+
 class ComboboxComponent extends BaseFormInput {
     cdr;
     combo;
@@ -690,6 +709,7 @@ class ComboboxComponent extends BaseFormInput {
     onBlur = new EventEmitter();
     opened = signal(false, ...(ngDevMode ? [{ debugName: "opened" }] : []));
     currentFocus = signal(null, ...(ngDevMode ? [{ debugName: "currentFocus" }] : []));
+    comboLabel = signal("", ...(ngDevMode ? [{ debugName: "comboLabel" }] : []));
     constructor(cdr) {
         super();
         this.cdr = cdr;
@@ -699,6 +719,11 @@ class ComboboxComponent extends BaseFormInput {
             else if (!this.opened() && !condition)
                 this.opened.set(true);
         }));
+        this.addSubscription(this.input.valueChanges.subscribe(value => this.comboLabel.set(this.extractLabel(value))));
+    }
+    ngOnChanges(changes) {
+        if (changes.options && !isDeepEqual(changes.options.previousValue, changes.options.currentValue))
+            this.input.setValue(null);
     }
     ngAfterViewInit() {
         super.ngAfterViewInit();
@@ -726,12 +751,11 @@ class ComboboxComponent extends BaseFormInput {
             }
         }));
     }
-    extractLabel = () => {
-        const { value } = this.input;
+    extractLabel = (value) => {
         if (value == null || value?.length === 0)
             return this.placeHolder || " ";
         if (!this.multiple)
-            return this.options.find(opt => isDeepEqual(opt.value, value)).label;
+            return this.options.find(opt => isDeepEqual(opt.value, value))?.label;
         return this.options.filter(opt => value.some(o => isDeepEqual(opt.value, o))).map(opt => opt.label).join(", ");
     };
     focus = (e) => {
@@ -764,15 +788,21 @@ class ComboboxComponent extends BaseFormInput {
             return isDeepEqual(value, opt.value);
         return value.some(o => isDeepEqual(opt.value, o));
     };
+    get hasValue() {
+        return this.multiple ? this.input.value != null && this.input.value.length > 0 : this.input.value != null;
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: ComboboxComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.12", type: ComboboxComponent, isStandalone: false, selector: "dolfo-combobox", inputs: { options: "options", placeHolder: "placeHolder", multiple: ["multiple", "multiple", booleanAttribute] }, outputs: { onFocus: "onFocus", onBlur: "onBlur" }, providers: [
             { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ComboboxComponent), multi: true },
             { provide: NG_VALIDATORS, useExisting: forwardRef(() => ComboboxComponent), multi: true },
             { provide: BaseFormInput, useExisting: ComboboxComponent }
-        ], viewQueries: [{ propertyName: "combo", first: true, predicate: ["combo"], descendants: true }], usesInheritance: true, ngImport: i0, template: `<dolfo-input-container>
+        ], viewQueries: [{ propertyName: "combo", first: true, predicate: ["combo"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `<dolfo-input-container>
 		<div class="combobox" [class.opened]="opened()" #combo tabindex="0" (focus)="focus($event)" (blur)="onBlur.emit($event)" [class.disabled]="input.disabled">
 			<div class="combobox-label">
-				<span>{{ extractLabel() | translate }}</span>
+                @if(hasValue && !input.disabled){
+                    <dolfo-icon [dolfoTooltip]="'form.resetValue' | translate" name="cross" (click)="input.setValue(null); $event.stopPropagation()"></dolfo-icon>
+                }
+				<span>{{ comboLabel() | translate }}</span>
 			</div>
 
 			<div class="combobox-options" [class.opened]="opened()">
@@ -785,7 +815,7 @@ class ComboboxComponent extends BaseFormInput {
 
             <input type="hidden" [formControl]="input" />
 		</div>
-	</dolfo-input-container>`, isInline: true, dependencies: [{ kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: InputContainerComponent, selector: "dolfo-input-container" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+	</dolfo-input-container>`, isInline: true, dependencies: [{ kind: "directive", type: i1$2.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$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: TooltipDirective, selector: "[dolfoTooltip]", inputs: ["dolfoTooltip", "direction"] }, { kind: "component", type: IconWrapperComponent, selector: "dolfo-icon", inputs: ["name"] }, { kind: "component", type: InputContainerComponent, selector: "dolfo-input-container" }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: ComboboxComponent, decorators: [{
             type: Component,
@@ -794,7 +824,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                     template: `<dolfo-input-container>
 		<div class="combobox" [class.opened]="opened()" #combo tabindex="0" (focus)="focus($event)" (blur)="onBlur.emit($event)" [class.disabled]="input.disabled">
 			<div class="combobox-label">
-				<span>{{ extractLabel() | translate }}</span>
+                @if(hasValue && !input.disabled){
+                    <dolfo-icon [dolfoTooltip]="'form.resetValue' | translate" name="cross" (click)="input.setValue(null); $event.stopPropagation()"></dolfo-icon>
+                }
+				<span>{{ comboLabel() | translate }}</span>
 			</div>
 
 			<div class="combobox-options" [class.opened]="opened()">
@@ -937,25 +970,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                 args: [BaseFormInput]
             }] } });
 
-class IconWrapperComponent {
-    name;
-    iconComponent = inject(ICON_COMPONENT);
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: IconWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: IconWrapperComponent, isStandalone: false, selector: "dolfo-icon", inputs: { name: "name" }, ngImport: i0, template: `<ng-container [ngComponentOutlet]="iconComponent" [ngComponentOutletInputs]="{ name }"></ng-container>`, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: IconWrapperComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: "dolfo-icon",
-                    standalone: false,
-                    template: `<ng-container [ngComponentOutlet]="iconComponent" [ngComponentOutletInputs]="{ name }"></ng-container>`,
-                    changeDetection: ChangeDetectionStrategy.OnPush
-                }]
-        }], propDecorators: { name: [{
-                type: Input,
-                args: [{ required: true }]
-            }] } });
-
 const CONTEXT_MENU_DESTROY_TOKEN = new InjectionToken("CONTEXT_MENU_DESTROY_TOKEN");
 class ContextMenuComponent extends Subscriptable {
     x;
@@ -2075,6 +2089,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
                 }]
         }] });
 
+class LoaderComponent {
+    langKey = "loading";
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: LoaderComponent, isStandalone: false, selector: "dolfo-loader", inputs: { langKey: "langKey" }, ngImport: i0, template: `<div class="loading">
+		<dolfo-icon name="spinner5"></dolfo-icon>
+		{{ langKey | translate }}
+	</div>`, isInline: true, dependencies: [{ kind: "component", type: IconWrapperComponent, selector: "dolfo-icon", inputs: ["name"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LoaderComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: "dolfo-loader",
+                    standalone: false,
+                    template: `<div class="loading">
+		<dolfo-icon name="spinner5"></dolfo-icon>
+		{{ langKey | translate }}
+	</div>`,
+                    changeDetection: ChangeDetectionStrategy.OnPush
+                }]
+        }], propDecorators: { langKey: [{
+                type: Input
+            }] } });
+
+class LayoutModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, declarations: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent], imports: [CommonModule, DirectivesModule, TranslatePipe], exports: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, imports: [CommonModule, DirectivesModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent],
+                    imports: [CommonModule, DirectivesModule, TranslatePipe],
+                    exports: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent]
+                }]
+        }] });
+
 class InputCheckboxComponent extends BaseFormInput {
     toggleCheck = () => this.input.setValue(!this.input.value);
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: InputCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
@@ -2111,55 +2162,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImpo
 
 class FormModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: FormModule, declarations: [InputTextComponent, InputContainerComponent, ComboboxComponent, DatepickerComponent, AutocompleteComponent, InputRadioComponent, InputCheckboxComponent], imports: [CommonModule, ReactiveFormsModule, TranslatePipe, DirectivesModule], exports: [ReactiveFormsModule, InputTextComponent, InputContainerComponent, ComboboxComponent, DatepickerComponent, AutocompleteComponent, InputRadioComponent, InputCheckboxComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FormModule, imports: [CommonModule, ReactiveFormsModule, DirectivesModule, ReactiveFormsModule] });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: FormModule, declarations: [InputTextComponent, InputContainerComponent, ComboboxComponent, DatepickerComponent, AutocompleteComponent, InputRadioComponent, InputCheckboxComponent], imports: [CommonModule, ReactiveFormsModule, TranslatePipe, DirectivesModule, LayoutModule], exports: [ReactiveFormsModule, InputTextComponent, InputContainerComponent, ComboboxComponent, DatepickerComponent, AutocompleteComponent, InputRadioComponent, InputCheckboxComponent] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FormModule, imports: [CommonModule, ReactiveFormsModule, DirectivesModule, LayoutModule, ReactiveFormsModule] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: FormModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [InputTextComponent, InputContainerComponent, ComboboxComponent, DatepickerComponent, AutocompleteComponent, InputRadioComponent, InputCheckboxComponent],
-                    imports: [CommonModule, ReactiveFormsModule, TranslatePipe, DirectivesModule],
+                    imports: [CommonModule, ReactiveFormsModule, TranslatePipe, DirectivesModule, LayoutModule],
                     exports: [ReactiveFormsModule, InputTextComponent, InputContainerComponent, ComboboxComponent, DatepickerComponent, AutocompleteComponent, InputRadioComponent, InputCheckboxComponent]
                 }]
         }] });
 
-class LoaderComponent {
-    langKey = "loading";
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.12", type: LoaderComponent, isStandalone: false, selector: "dolfo-loader", inputs: { langKey: "langKey" }, ngImport: i0, template: `<div class="loading">
-		<dolfo-icon name="spinner5"></dolfo-icon>
-		{{ langKey | translate }}
-	</div>`, isInline: true, dependencies: [{ kind: "component", type: IconWrapperComponent, selector: "dolfo-icon", inputs: ["name"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LoaderComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: "dolfo-loader",
-                    standalone: false,
-                    template: `<div class="loading">
-		<dolfo-icon name="spinner5"></dolfo-icon>
-		{{ langKey | translate }}
-	</div>`,
-                    changeDetection: ChangeDetectionStrategy.OnPush
-                }]
-        }], propDecorators: { langKey: [{
-                type: Input
-            }] } });
-
-class LayoutModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, declarations: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent], imports: [CommonModule, DirectivesModule, TranslatePipe], exports: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, imports: [CommonModule, DirectivesModule] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: LayoutModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent],
-                    imports: [CommonModule, DirectivesModule, TranslatePipe],
-                    exports: [ButtonComponent, ContextMenuComponent, IconWrapperComponent, LoaderComponent, NotificationComponent, TooltipComponent, IconComponent, PopoverComponent]
-                }]
-        }] });
-
 class DialogLayoutModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.12", ngImport: i0, type: DialogLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
     static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.12", ngImport: i0, type: DialogLayoutModule, declarations: [DialogComponent, DialogContentComponent, DialogHeaderComponent, DialogFooterComponent, DialogLayoutComponent], imports: [CommonModule, DirectivesModule, LayoutModule, ReactiveFormsModule, TranslatePipe, FormModule], exports: [DialogComponent, DialogContentComponent, DialogHeaderComponent, DialogFooterComponent, DialogLayoutComponent] });