@c10t/nice-component-library 0.0.21-g → 0.0.22

package/components/cva-counter-input.component.d.ts

@@ -3,8 +3,9 @@ import { AbstractControl, ControlValueAccessor, NgControl } from '@angular/forms
 import { ValidatorService } from '../services/validator.service';
 import { AlignEnum } from '../enums/align.enum';
 import { NiceComponentLibraryConfig } from '../models/nice-component-library.config';
+import { CvaFormControl } from './cva-form-control';
 import * as i0 from "@angular/core";
-export declare class CvaCounterInputComponent implements ControlValueAccessor, OnInit, OnChanges {
+export declare class CvaCounterInputComponent implements ControlValueAccessor, CvaFormControl, OnInit, OnChanges {
     private injector;
     label: string;
     placeholder: string;
@@ -25,12 +26,13 @@ export declare class CvaCounterInputComponent implements ControlValueAccessor, O
     isFormControl: boolean;
     onChange: EventEmitter<number>;
     onEnter: EventEmitter<void>;
-    formControl: AbstractControl | undefined;
+    formControl: AbstractControl | null;
     config: NiceComponentLibraryConfig;
     constructor(injector: Injector, ngControl: NgControl);
     get NsValidator(): typeof ValidatorService;
     get counterValue(): number;
     set counterValue(val: number);
+    getFormControl(): AbstractControl | null;
     ngOnChanges(changes: SimpleChanges): void;
     ngOnInit(): void;
     getMinNumber(): number;

package/components/cva-form-control.d.ts

@@ -0,0 +1,4 @@
+import { AbstractControl } from '@angular/forms';
+export interface CvaFormControl {
+    getFormControl(): AbstractControl | null;
+}

package/components/cva-input.component.d.ts

@@ -3,8 +3,9 @@ import { AbstractControl, ControlValueAccessor, NgControl } from '@angular/forms
 import { ValidatorService } from '../services/validator.service';
 import { NiceComponentLibraryConfig } from '../models/nice-component-library.config';
 import { AlignEnum } from '../enums/align.enum';
+import { CvaFormControl } from './cva-form-control';
 import * as i0 from "@angular/core";
-export declare class CvaInputComponent implements ControlValueAccessor, OnInit {
+export declare class CvaInputComponent implements ControlValueAccessor, CvaFormControl, OnInit {
     private injector;
     label: string;
     name: string;
@@ -30,12 +31,13 @@ export declare class CvaInputComponent implements ControlValueAccessor, OnInit {
     patternFilter: string;
     isFormControl: boolean;
     formatFunc: any;
-    formControl: AbstractControl | undefined;
+    formControl: AbstractControl | null;
     config: NiceComponentLibraryConfig;
     constructor(injector: Injector, ngControl: NgControl);
     get NsValidator(): typeof ValidatorService;
     get textValue(): string;
     set textValue(val: string);
+    getFormControl(): AbstractControl | null;
     ngOnInit(): void;
     callValidator(): void;
     propagateChange: (_: any) => void;

package/components/cva-live-searching.component.d.ts

@@ -3,8 +3,9 @@ import { AbstractControl, ControlValueAccessor, FormControl, NgControl } from '@
 import { ValidatorService } from '../services/validator.service';
 import { Observable } from 'rxjs';
 import { NiceComponentLibraryConfig } from '../models/nice-component-library.config';
+import { CvaFormControl } from './cva-form-control';
 import * as i0 from "@angular/core";
-export declare class CvaLiveSearchingComponent implements ControlValueAccessor, OnInit {
+export declare class CvaLiveSearchingComponent implements ControlValueAccessor, CvaFormControl, OnInit {
     private injector;
     label: string;
     placeholder: string;
@@ -23,7 +24,7 @@ export declare class CvaLiveSearchingComponent implements ControlValueAccessor,
     isFormControl: boolean;
     row?: any;
     columnDef?: string;
-    formControl: AbstractControl | undefined;
+    formControl: AbstractControl | null;
     textControl: FormControl<string>;
     filteredOptions: any[];
     selected: any;
@@ -32,6 +33,7 @@ export declare class CvaLiveSearchingComponent implements ControlValueAccessor,
     private searchSub?;
     constructor(injector: Injector, ngControl: NgControl);
     get NsValidator(): typeof ValidatorService;
+    getFormControl(): AbstractControl | null;
     ngOnInit(): void;
     callValidator(): void;
     propagateChange: (_: any) => void;

package/components/cva-multi-select-autocomplete.d.ts

@@ -8,8 +8,9 @@ import { ValidatorService } from '../services/validator.service';
 import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
 import { MatOptionSelectionChange } from '@angular/material/core';
 import { NiceComponentLibraryConfig } from '../models/nice-component-library.config';
+import { CvaFormControl } from './cva-form-control';
 import * as i0 from "@angular/core";
-export declare class CvaMultiSelectAutocomplete implements ControlValueAccessor, OnInit, OnChanges {
+export declare class CvaMultiSelectAutocomplete implements ControlValueAccessor, CvaFormControl, OnInit, OnChanges {
     private translateService;
     private injector;
     placeholder: string;
@@ -32,7 +33,7 @@ export declare class CvaMultiSelectAutocomplete implements ControlValueAccessor,
     valueOptionRef: SelectModel[];
     isFormControl: boolean;
     searchInputRef: any;
-    formControl: AbstractControl | undefined;
+    formControl: AbstractControl | null;
     filteredOptions: SelectModel[];
     selectAllChecked: boolean;
     labelCount: number;
@@ -46,6 +47,7 @@ export declare class CvaMultiSelectAutocomplete implements ControlValueAccessor,
     get NsValidator(): typeof ValidatorService;
     get selectedValue(): any[] | any;
     set selectedValue(val: any[] | any);
+    getFormControl(): AbstractControl | null;
     ngOnInit(): void;
     getRequired(): boolean;
     callValidator(): void;

package/components/datepicker/cva-date-picker.component.d.ts

@@ -4,8 +4,9 @@ import { MatDatepicker } from '@angular/material/datepicker';
 import { DateUtilService } from '../../services/date-util.service';
 import { NiceComponentLibraryConfig } from '../../models/nice-component-library.config';
 import { ValidatorService } from '../../services/validator.service';
+import { CvaFormControl } from '../cva-form-control';
 import * as i0 from "@angular/core";
-export declare class CvaDatePickerComponent implements ControlValueAccessor, OnInit {
+export declare class CvaDatePickerComponent implements ControlValueAccessor, CvaFormControl, OnInit {
     private dateServiceUtil;
     private injector;
     label: string;
@@ -23,12 +24,13 @@ export declare class CvaDatePickerComponent implements ControlValueAccessor, OnI
     title: string | null;
     config: NiceComponentLibraryConfig;
     isFormControl: boolean;
-    formControl: AbstractControl | undefined;
+    formControl: AbstractControl | null;
     datepicker: MatDatepicker<any> | undefined;
     constructor(dateServiceUtil: DateUtilService, ngControl: NgControl, injector: Injector);
     get NsValidator(): typeof ValidatorService;
     get datepickerValue(): any;
     set datepickerValue(val: any);
+    getFormControl(): AbstractControl | null;
     ngOnInit(): void;
     callValidator(): void;
     checkRequired(isRequired: boolean | (() => boolean)): boolean;

package/components/datepicker/cva-range-date-picker.component.d.ts

@@ -4,8 +4,9 @@ import { RangeDatePickerModel } from '../../models/components/range-date-picker.
 import { DateUtilService } from '../../services/date-util.service';
 import { ValidatorService } from '../../services/validator.service';
 import { MatDateRangePicker } from '@angular/material/datepicker';
+import { CvaFormControl } from '../cva-form-control';
 import * as i0 from "@angular/core";
-export declare class CvaRangeDatePickerComponent implements ControlValueAccessor, OnInit {
+export declare class CvaRangeDatePickerComponent implements ControlValueAccessor, CvaFormControl, OnInit {
     private dateServiceUtil;
     private injector;
     label: string;
@@ -36,7 +37,7 @@ export declare class CvaRangeDatePickerComponent implements ControlValueAccessor
     toDateControlName: string;
     title: string | null;
     isFormControl: boolean;
-    formControl: AbstractControl | undefined;
+    formControl: AbstractControl | null;
     defaultFromDate: any;
     picker: MatDateRangePicker<any> | undefined;
     constructor(dateServiceUtil: DateUtilService, ngControl: NgControl, injector: Injector);
@@ -45,6 +46,7 @@ export declare class CvaRangeDatePickerComponent implements ControlValueAccessor
     set fromDateValue(val: any);
     get toDateValue(): any;
     set toDateValue(val: any);
+    getFormControl(): AbstractControl | null;
     ngOnInit(): void;
     propagateChange: (_: any) => void;
     registerOnChange(fn: any): void;

package/components/table/cva-smart-table.component.d.ts

@@ -1,4 +1,4 @@
-import { AfterContentChecked, ChangeDetectorRef, EventEmitter, Injector, OnChanges, OnInit } from '@angular/core';
+import { AfterContentChecked, ChangeDetectorRef, EventEmitter, Injector, OnChanges, OnInit, QueryList } from '@angular/core';
 import { AbstractControl, ControlValueAccessor, NgControl } from '@angular/forms';
 import { MatCheckboxChange } from '@angular/material/checkbox';
 import { MatTable, MatTableDataSource } from '@angular/material/table';
@@ -13,11 +13,13 @@ import { IconTypeEnum } from '../../enums/icon-type.enum';
 import { TableFooterModel } from '../../models/components/table-footer.model';
 import { NiceComponentLibraryConfig } from '../../models/nice-component-library.config';
 import { NumericInputFormat } from '../../directives/numeric-input-format';
+import { CvaFormControl } from '../cva-form-control';
 import * as i0 from "@angular/core";
 export declare class CvaSmartTableComponent implements ControlValueAccessor, OnChanges, OnInit, AfterContentChecked {
     private ref;
     config: NiceComponentLibraryConfig;
     private injector;
+    cellComponents: QueryList<CvaFormControl>;
     moduleName: string;
     columns: ColumnModel[];
     buttons: ButtonModel[];
@@ -69,6 +71,7 @@ export declare class CvaSmartTableComponent implements ControlValueAccessor, OnC
     expandRow(i: number, row: any, parentRowClassIndex: number | 0 | 1): void;
     getAlign(column: ColumnModel): AlignEnum;
     getHeaderButtonColspan(): number;
+    markAllControlsAsDirty(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<CvaSmartTableComponent, [null, null, null, { optional: true; self: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<CvaSmartTableComponent, "cva-smart-table", never, { "moduleName": { "alias": "moduleName"; "required": false; }; "columns": { "alias": "columns"; "required": false; }; "buttons": { "alias": "buttons"; "required": false; }; "value": { "alias": "value"; "required": false; }; "minRow": { "alias": "minRow"; "required": false; }; "maxRow": { "alias": "maxRow"; "required": false; }; "errorMessages": { "alias": "errorMessages"; "required": false; }; "isFormControl": { "alias": "isFormControl"; "required": false; }; "isSticky": { "alias": "isSticky"; "required": false; }; "isStickyHeader": { "alias": "isStickyHeader"; "required": false; }; "isStickyFooter": { "alias": "isStickyFooter"; "required": false; }; "isExpandRowTable": { "alias": "isExpandRowTable"; "required": false; }; "expandRowProperty": { "alias": "expandRowProperty"; "required": false; }; }, { "clickAction": "clickAction"; "onChange": "onChange"; }, never, never, false, never>;
 }

package/fesm2022/c10t-nice-component-library.mjs

@@ -3,7 +3,7 @@ import { FormGroup, FormArray, FormControl, Validators, NgControl, NG_VALUE_ACCE
 import * as i1$3 from '@angular/common/http';
 import { HttpParams, HttpHeaders, HttpResponse, HttpResponseBase } from '@angular/common/http';
 import * as i0 from '@angular/core';
-import { InjectionToken, Self, Optional, Inject, Component, Injectable, Directive, EventEmitter, Output, Input, Host, Pipe, HostListener, forwardRef, ViewChild, HostBinding, ViewEncapsulation, NgModule, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { InjectionToken, Self, Optional, Inject, Component, Injectable, Directive, EventEmitter, Output, Input, Host, Pipe, HostListener, forwardRef, ViewChild, ViewChildren, HostBinding, ViewEncapsulation, NgModule, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import * as i1$1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
 import * as i1 from '@ngx-translate/core';
@@ -1578,7 +1578,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
 
 class ValidatorService {
     static invalid(control) {
-        return !!control ? (control?.invalid || !!control?.errors) : false;
+        if (!control || !control.dirty) {
+            return false;
+        }
+        return control.invalid || !!control.errors;
     }
     static getErrorMessage(control, errorMessages) {
         if (!control) {
@@ -1872,7 +1875,7 @@ class CvaCounterInputComponent {
     onChange = new EventEmitter();
     onEnter = new EventEmitter();
     // Cái này là để gắn khi nó là FormControl trong 1 FormGroup
-    formControl;
+    formControl = null;
     config;
     constructor(injector, ngControl) {
         this.injector = injector;
@@ -1892,6 +1895,9 @@ class CvaCounterInputComponent {
     set counterValue(val) {
         this.writeValue(val);
     }
+    getFormControl() {
+        return this.formControl;
+    }
     ngOnChanges(changes) {
         if ('value' in changes) {
             this.value = changes.value.currentValue;
@@ -1913,7 +1919,7 @@ class CvaCounterInputComponent {
         if (ngControl && !this.formControl) {
             // Nếu là NsSmartTable thì phải tự new FormControl còn không thì cứ hóng parent FormControl về ^^
             if (this.isFormControl) {
-                this.formControl = ngControl.control ? ngControl.control : undefined;
+                this.formControl = ngControl.control ? ngControl.control : null;
             }
             else {
                 this.formControl = new FormControl();
@@ -1977,22 +1983,22 @@ class CvaCounterInputComponent {
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaCounterInputComponent, isStandalone: false, selector: "cva-counter-input", inputs: { label: "label", placeholder: "placeholder", suffixText: "suffixText", hint: "hint", value: "value", disabled: "disabled", required: "required", errorMessages: "errorMessages", min: "min", max: "max", error: "error", isDecimal: "isDecimal", isLabelOutside: "isLabelOutside", isFloatLabel: "isFloatLabel", percentOfLabelOutside: "percentOfLabelOutside", alignNumber: "alignNumber", isFormControl: "isFormControl" }, outputs: { onChange: "onChange", onEnter: "onEnter" }, usesOnChanges: true, ngImport: i0, template: `
     <!-- css labelOutside trong base.theme-->
     <div class="cva-counter-input"
-         [ngClass]="{'labelOutside': !!isLabelOutside, 'float_label': !!isFloatLabel && !isLabelOutside}"
+         [ngClass]="{'labelOutside': isLabelOutside, 'float_label': isFloatLabel && !isLabelOutside}"
          fxLayout="row" fxLayout.lt-sm="row wrap">
       <mat-label *ngIf="isLabelOutside" class="label_width"
                  fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
         <div class="label">
           <div>
             {{ (label ? label : placeholder) | translate }}<span
-            class="required-label-outside">{{ !!required ? '*' : '' }}</span>
+            class="required-label-outside">{{ required ? '*' : '' }}</span>
           </div>
         </div>
       </mat-label>
       <mat-form-field *ngIf="isShowControl()"
-                      appearance="outline" [floatLabel]="!!isFloatLabel ? 'always' : 'auto'"
+                      appearance="outline" [floatLabel]="isFloatLabel ? 'always' : 'auto'"
                       [hideRequiredMarker]="!isFloatLabel"
                       fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
-        <mat-label *ngIf="!isLabelOutside && !!isFloatLabel">{{ (label ? label : placeholder) | translate }}</mat-label>
+        <mat-label *ngIf="!isLabelOutside && isFloatLabel">{{ (label ? label : placeholder) | translate }}</mat-label>
         <div class="input-area">
           <input matInput type="number" [(ngModel)]="counterValue" #nsCounterInput="ngModel"
                  [style.text-align]="alignNumber"
@@ -2033,22 +2039,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                     template: `
     <!-- css labelOutside trong base.theme-->
     <div class="cva-counter-input"
-         [ngClass]="{'labelOutside': !!isLabelOutside, 'float_label': !!isFloatLabel && !isLabelOutside}"
+         [ngClass]="{'labelOutside': isLabelOutside, 'float_label': isFloatLabel && !isLabelOutside}"
          fxLayout="row" fxLayout.lt-sm="row wrap">
       <mat-label *ngIf="isLabelOutside" class="label_width"
                  fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
         <div class="label">
           <div>
             {{ (label ? label : placeholder) | translate }}<span
-            class="required-label-outside">{{ !!required ? '*' : '' }}</span>
+            class="required-label-outside">{{ required ? '*' : '' }}</span>
           </div>
         </div>
       </mat-label>
       <mat-form-field *ngIf="isShowControl()"
-                      appearance="outline" [floatLabel]="!!isFloatLabel ? 'always' : 'auto'"
+                      appearance="outline" [floatLabel]="isFloatLabel ? 'always' : 'auto'"
                       [hideRequiredMarker]="!isFloatLabel"
                       fxLayout="column" fxFlex="auto" fxFlex.lt-md="100%">
-        <mat-label *ngIf="!isLabelOutside && !!isFloatLabel">{{ (label ? label : placeholder) | translate }}</mat-label>
+        <mat-label *ngIf="!isLabelOutside && isFloatLabel">{{ (label ? label : placeholder) | translate }}</mat-label>
         <div class="input-area">
           <input matInput type="number" [(ngModel)]="counterValue" #nsCounterInput="ngModel"
                  [style.text-align]="alignNumber"
@@ -3329,7 +3335,7 @@ class CvaInputComponent {
     // Chỉ bằng false khi trong NsSmartTable thôi nhé @@
     isFormControl = true;
     formatFunc;
-    formControl = undefined;
+    formControl = null;
     config;
     constructor(injector, ngControl) {
         this.injector = injector;
@@ -3348,6 +3354,9 @@ class CvaInputComponent {
     set textValue(val) {
         this.writeValue(val);
     }
+    getFormControl() {
+        return this.formControl;
+    }
     ngOnInit() {
         this.callValidator();
     }
@@ -3357,7 +3366,7 @@ class CvaInputComponent {
         if (ngControl && !this.formControl) {
             // Nếu là NsSmartTable thì phải tự new FormControl còn không thì cứ hóng parent FormControl về ^^
             if (this.isFormControl) {
-                this.formControl = ngControl.control ? ngControl.control : undefined;
+                this.formControl = ngControl.control ? ngControl.control : null;
             }
             else {
                 this.formControl = new FormControl();
@@ -3765,7 +3774,7 @@ class CvaDatePickerComponent {
     config;
     // Chỉ bằng false khi trong NsSmartTable thôi @@
     isFormControl = true;
-    formControl;
+    formControl = null;
     datepicker;
     constructor(dateServiceUtil, ngControl, injector) {
         this.dateServiceUtil = dateServiceUtil;
@@ -3791,6 +3800,9 @@ class CvaDatePickerComponent {
     set datepickerValue(val) {
         this.writeValue(val);
     }
+    getFormControl() {
+        return this.formControl;
+    }
     ngOnInit() {
         if (this.isShowControl()) {
             this.callValidator();
@@ -3802,7 +3814,7 @@ class CvaDatePickerComponent {
         if (ngControl && !this.formControl) {
             // Nếu là NsSmartTable thì phải tự new FormControl còn không thì cứ hóng parent FormControl về ^^
             if (this.isFormControl) {
-                this.formControl = ngControl.control ? ngControl.control : undefined;
+                this.formControl = ngControl.control ? ngControl.control : null;
             }
             else {
                 this.formControl = new FormControl();
@@ -4099,7 +4111,7 @@ class CvaMultiSelectAutocomplete {
     isFormControl = true;
     searchInputRef;
     // Cái này là để gắn khi nó là FormControl trong 1 FormGroup
-    formControl;
+    formControl = null;
     filteredOptions = [];
     selectAllChecked = false;
     labelCount = 1;
@@ -4130,6 +4142,9 @@ class CvaMultiSelectAutocomplete {
     set selectedValue(val) {
         // this.writeValue(val); // Đọc comment bên dưới matSelectionChange
     }
+    getFormControl() {
+        return this.formControl;
+    }
     ngOnInit() {
         this.callValidator();
     }
@@ -4141,7 +4156,7 @@ class CvaMultiSelectAutocomplete {
         if (ngControl && !this.formControl) {
             // Nếu là NsSmartTable thì phải tự new FormControl còn không thì cứ hóng parent FormControl về ^^
             if (this.isFormControl) {
-                this.formControl = ngControl.control ? ngControl.control : undefined;
+                this.formControl = ngControl.control ? ngControl.control : null;
             }
             else {
                 this.formControl = new FormControl();
@@ -4632,7 +4647,7 @@ class CvaLiveSearchingComponent {
     isFormControl = true;
     row;
     columnDef;
-    formControl = undefined;
+    formControl = null;
     textControl = new FormControl('');
     filteredOptions = [];
     selected;
@@ -4650,6 +4665,9 @@ class CvaLiveSearchingComponent {
     get NsValidator() {
         return ValidatorService;
     }
+    getFormControl() {
+        return this.formControl;
+    }
     ngOnInit() {
         this.callValidator();
         this.textValueChangeSubscribe();
@@ -4663,7 +4681,7 @@ class CvaLiveSearchingComponent {
         if (ngControl && !this.formControl) {
             // Nếu là NsSmartTable thì phải tự new FormControl còn không thì cứ hóng parent FormControl về ^^
             if (this.isFormControl) {
-                this.formControl = ngControl.control ? ngControl.control : undefined;
+                this.formControl = ngControl.control ? ngControl.control : null;
             }
             else {
                 this.formControl = new FormControl();
@@ -4952,6 +4970,7 @@ class CvaSmartTableComponent {
     ref;
     config;
     injector;
+    cellComponents;
     moduleName = '';
     columns = [];
     buttons = [];
@@ -5114,27 +5133,6 @@ class CvaSmartTableComponent {
     onDisplayFooter(footer, dataTable) {
         return typeof (footer.display) === 'function' ? footer.display(dataTable) : !!footer.display;
     }
-    // //Cái khúc này về sau mà có cái loại validate nào mà ngoài thì mới enable validate cột sau
-    // validate(control: AbstractControl): ValidationErrors | null {
-    //     let valid = null;
-    //
-    //     if (this.value) {
-    //         for (const row of this.value) {
-    //             for (const column of this.columns) {
-    //                 if (column.validate) {
-    //                     valid = column.validate(row);
-    //                     if (valid) {
-    //                         break;
-    //                     }
-    //                 }
-    //             }
-    //             if (valid) {
-    //                 break;
-    //             }
-    //         }
-    //     }
-    //     return valid;
-    // }
     callValidator() {
         const ngControl = this.injector.get(NgControl);
         if (ngControl && !this.formControl) {
@@ -5150,6 +5148,11 @@ class CvaSmartTableComponent {
                     minRow: this.minRow,
                     maxRow: this.maxRow,
                 }));
+                this.formControl.statusChanges.subscribe(status => {
+                    if (this.formControl?.touched && this.formControl?.dirty) {
+                        this.markAllControlsAsDirty();
+                    }
+                });
             }
         }
         if (this.formControl) {
@@ -5173,29 +5176,6 @@ class CvaSmartTableComponent {
         if (row.isChildRow) {
             return;
         }
-        // default not expand
-        // if (row.expanded) {
-        //   // remove the flag
-        //   row.expanded = false;
-        //
-        //   // remove the child rows
-        //   let childrenDetected = false;
-        //   const length = this.datasource.data.length;
-        //   for (let index = 0; index < length; index++) {
-        //     if (childrenDetected && !this.datasource.data[index].isChildRow) {
-        //       break;
-        //     }
-        //
-        //     if (index > i && this.datasource.data[index].isChildRow) {
-        //       this.datasource.data.splice(index, 1);
-        //       index--;
-        //       childrenDetected = true;
-        //     }
-        //   }
-        //
-        //   this.matTable?.renderRows();
-        //   return;
-        // }
         // set expanded to true so we don't expand this row again
         row.expanded = true;
         row.parentRowClassIndex = parentRowClassIndex;
@@ -5220,8 +5200,19 @@ class CvaSmartTableComponent {
         this.buttonColspan = TableService.getHeaderButtonColspan(this.buttons, this.datasource.data);
         return this.buttonColspan;
     }
+    markAllControlsAsDirty() {
+        if (this.cellComponents) {
+            this.cellComponents.forEach(cell => {
+                const control = cell.getFormControl();
+                if (control) {
+                    control.markAsDirty();
+                    control.updateValueAndValidity();
+                }
+            });
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.5", ngImport: i0, type: CvaSmartTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: InjectTokenNextSolutionsConfig }, { token: i0.Injector }, { token: i1$2.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaSmartTableComponent, isStandalone: false, selector: "cva-smart-table", inputs: { moduleName: "moduleName", columns: "columns", buttons: "buttons", value: "value", minRow: "minRow", maxRow: "maxRow", errorMessages: "errorMessages", isFormControl: "isFormControl", isSticky: "isSticky", isStickyHeader: "isStickyHeader", isStickyFooter: "isStickyFooter", isExpandRowTable: "isExpandRowTable", expandRowProperty: "expandRowProperty" }, outputs: { clickAction: "clickAction", onChange: "onChange" }, viewQueries: [{ propertyName: "matTable", first: true, predicate: ["matTable"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.5", type: CvaSmartTableComponent, isStandalone: false, selector: "cva-smart-table", inputs: { moduleName: "moduleName", columns: "columns", buttons: "buttons", value: "value", minRow: "minRow", maxRow: "maxRow", errorMessages: "errorMessages", isFormControl: "isFormControl", isSticky: "isSticky", isStickyHeader: "isStickyHeader", isStickyFooter: "isStickyFooter", isExpandRowTable: "isExpandRowTable", expandRowProperty: "expandRowProperty" }, outputs: { clickAction: "clickAction", onChange: "onChange" }, viewQueries: [{ propertyName: "matTable", first: true, predicate: ["matTable"], descendants: true }, { propertyName: "cellComponents", predicate: ["cellComponentRef"], descendants: true }], usesOnChanges: true, ngImport: i0, template: `
     <div class="table-responsive"
          [ngClass]="{'fixed_header': isSticky||isStickyHeader, 'fixed_footer': isSticky||isStickyFooter}">
       <table mat-table [dataSource]="datasource" #matTable class="mat-elevation-z8 cva-smart-table">
@@ -5304,6 +5295,7 @@ class CvaSmartTableComponent {
                 </div>
               </ng-container>
               <cva-counter-input *ngSwitchCase="ColumnTypes.INPUT_COUNTER"
+                                 #cellComponentRef
                                  class="inputNumber" #nsCounterInput
                                  [isFormControl]="false"
                                  [alignNumber]="getAlign(column)"
@@ -5317,6 +5309,7 @@ class CvaSmartTableComponent {
                                  (onChange)="onCellValueChange(result, column, $event);">
               </cva-counter-input>
               <cva-input *ngSwitchCase="ColumnTypes.INPUT"
+                         #cellComponentRef
                          [isFormControl]="false"
                          [alignText]="getAlign(column)"
                          [disabled]="column.disabled ? column.disabled(result) : false"
@@ -5328,6 +5321,7 @@ class CvaSmartTableComponent {
                          (onChange)="onCellValueChange(result, column, $event);">
               </cva-input>
               <cva-input *ngSwitchCase="ColumnTypes.INPUT_CURRENCY"
+                         #cellComponentRef
                          [isFormControl]="false"
                          [alignText]="getAlign(column)"
                          [disabled]="column.disabled ? column.disabled(result) : false"
@@ -5341,6 +5335,7 @@ class CvaSmartTableComponent {
                          [formatFunc]="formatFunc">
               </cva-input>
               <cva-date-picker *ngSwitchCase="ColumnTypes.DATE_PICKER"
+                               #cellComponentRef
                                [value]="result[column.columnDef]"
                                [isFormControl]="false"
                                [minDate]="column.min ? column.min(result) : null"
@@ -5351,6 +5346,7 @@ class CvaSmartTableComponent {
                                (onChange)="onCellValueChange(result, column, $event);">
               </cva-date-picker>
               <cva-multi-select-autocomplete [isFormControl]="false"
+                                             #cellComponentRef
                                              *ngSwitchCase="ColumnTypes.MULTI_SELECT_AUTOCOMPLETE"
                                              class="multiSelectAutocomplete"
                                              [isTree]="column.isTree??false"
@@ -5373,6 +5369,7 @@ class CvaSmartTableComponent {
                 </mat-checkbox>
               </div>
               <cva-live-searching *ngSwitchCase="ColumnTypes.LIVE_SEARCHING"
+                                  #cellComponentRef
                                   [isFormControl]="false" [required]="getRequired(column)"
                                   [row]="result" [columnDef]="column.columnDef"
                                   [searchFn]="column.searchFn"
@@ -5551,6 +5548,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                 </div>
               </ng-container>
               <cva-counter-input *ngSwitchCase="ColumnTypes.INPUT_COUNTER"
+                                 #cellComponentRef
                                  class="inputNumber" #nsCounterInput
                                  [isFormControl]="false"
                                  [alignNumber]="getAlign(column)"
@@ -5564,6 +5562,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                                  (onChange)="onCellValueChange(result, column, $event);">
               </cva-counter-input>
               <cva-input *ngSwitchCase="ColumnTypes.INPUT"
+                         #cellComponentRef
                          [isFormControl]="false"
                          [alignText]="getAlign(column)"
                          [disabled]="column.disabled ? column.disabled(result) : false"
@@ -5575,6 +5574,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                          (onChange)="onCellValueChange(result, column, $event);">
               </cva-input>
               <cva-input *ngSwitchCase="ColumnTypes.INPUT_CURRENCY"
+                         #cellComponentRef
                          [isFormControl]="false"
                          [alignText]="getAlign(column)"
                          [disabled]="column.disabled ? column.disabled(result) : false"
@@ -5588,6 +5588,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                          [formatFunc]="formatFunc">
               </cva-input>
               <cva-date-picker *ngSwitchCase="ColumnTypes.DATE_PICKER"
+                               #cellComponentRef
                                [value]="result[column.columnDef]"
                                [isFormControl]="false"
                                [minDate]="column.min ? column.min(result) : null"
@@ -5598,6 +5599,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                                (onChange)="onCellValueChange(result, column, $event);">
               </cva-date-picker>
               <cva-multi-select-autocomplete [isFormControl]="false"
+                                             #cellComponentRef
                                              *ngSwitchCase="ColumnTypes.MULTI_SELECT_AUTOCOMPLETE"
                                              class="multiSelectAutocomplete"
                                              [isTree]="column.isTree??false"
@@ -5620,6 +5622,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                 </mat-checkbox>
               </div>
               <cva-live-searching *ngSwitchCase="ColumnTypes.LIVE_SEARCHING"
+                                  #cellComponentRef
                                   [isFormControl]="false" [required]="getRequired(column)"
                                   [row]="result" [columnDef]="column.columnDef"
                                   [searchFn]="column.searchFn"
@@ -5717,7 +5720,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.5", ngImpor
                     type: Self
                 }, {
                     type: Optional
-                }] }], propDecorators: { moduleName: [{
+                }] }], propDecorators: { cellComponents: [{
+                type: ViewChildren,
+                args: ['cellComponentRef']
+            }], moduleName: [{
                 type: Input
             }], columns: [{
                 type: Input
@@ -5790,7 +5796,7 @@ class CvaRangeDatePickerComponent {
     // config: NiceComponentLibraryConfig;
     // Chỉ bằng false khi trong NsSmartTable thôi @@
     isFormControl = true;
-    formControl;
+    formControl = null;
     defaultFromDate; // lưu giá trị khởi tạo ban đầu khi truyền từ bên ngoài vào
     picker;
     constructor(dateServiceUtil, ngControl, injector) {
@@ -5830,6 +5836,9 @@ class CvaRangeDatePickerComponent {
         this.value.toDate = val;
         this.writeValue(this.value);
     }
+    getFormControl() {
+        return this.formControl;
+    }
     ngOnInit() {
         this.callValidator();
     }
@@ -5875,7 +5884,7 @@ class CvaRangeDatePickerComponent {
         if (ngControl && !this.formControl) {
             // Nếu là NsSmartTable thì phải tự new FormControl còn không thì cứ hóng parent FormControl về ^^
             if (this.isFormControl) {
-                this.formControl = ngControl.control ? ngControl.control : undefined;
+                this.formControl = ngControl.control ? ngControl.control : null;
                 if (this.formControl && !this.formControl.value) {
                     this.formControl.setValue(this.value);
                 }