@shival99/z-ui 1.4.20 → 1.4.22

package/fesm2022/shival99-z-ui-components-z-table.mjs

@@ -249,6 +249,7 @@ class ZTableEditCellComponent {
     zChange = output();
     _currentValue = signal(undefined, ...(ngDevMode ? [{ debugName: "_currentValue" }] : []));
     _initialized = false;
+    _debounceTimeout = null;
     editConfig = computed(() => {
         const config = this.zEditConfig();
         if (!config || typeof config === 'boolean') {
@@ -319,7 +320,8 @@ class ZTableEditCellComponent {
         const oldValue = this.zValue();
         this._currentValue.set(newValue);
         this._initialized = true;
-        this._emitChange(oldValue, newValue);
+        // Use debounce for typing controls (text, number, textarea)
+        this._emitChangeWithDebounce(oldValue, newValue);
     }
     onSelectChange(newValue) {
         const oldValue = this.zValue();
@@ -344,10 +346,6 @@ class ZTableEditCellComponent {
         this._emitChange(oldValue, checked);
     }
     _emitChange(oldValue, newValue) {
-        const config = this.editConfig();
-        if (config?.onChange) {
-            config.onChange(newValue, this.zRow(), this.zColumnId());
-        }
         this.zChange.emit({
             row: this.zRow(),
             rowId: this.zRowId(),
@@ -357,6 +355,30 @@ class ZTableEditCellComponent {
             newValue,
         });
     }
+    _emitChangeWithDebounce(oldValue, newValue) {
+        const config = this.editConfig();
+        const debounceTime = config?.debounceTime;
+        // If no debounceTime configured, emit immediately
+        if (!debounceTime || debounceTime <= 0) {
+            this._emitChange(oldValue, newValue);
+            return;
+        }
+        // Clear previous timeout
+        if (this._debounceTimeout) {
+            clearTimeout(this._debounceTimeout);
+        }
+        // Schedule debounced emit
+        this._debounceTimeout = setTimeout(() => {
+            this._emitChange(oldValue, newValue);
+            this._debounceTimeout = null;
+        }, debounceTime);
+    }
+    ngOnDestroy() {
+        if (this._debounceTimeout) {
+            clearTimeout(this._debounceTimeout);
+            this._debounceTimeout = null;
+        }
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: ZTableEditCellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: ZTableEditCellComponent, isStandalone: true, selector: "z-table-edit-cell", inputs: { zRow: { classPropertyName: "zRow", publicName: "zRow", isSignal: true, isRequired: true, transformFunction: null }, zRowId: { classPropertyName: "zRowId", publicName: "zRowId", isSignal: true, isRequired: true, transformFunction: null }, zRowIndex: { classPropertyName: "zRowIndex", publicName: "zRowIndex", isSignal: true, isRequired: true, transformFunction: null }, zColumnId: { classPropertyName: "zColumnId", publicName: "zColumnId", isSignal: true, isRequired: true, transformFunction: null }, zValue: { classPropertyName: "zValue", publicName: "zValue", isSignal: true, isRequired: false, transformFunction: null }, zEditConfig: { classPropertyName: "zEditConfig", publicName: "zEditConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { zChange: "zChange" }, host: { classAttribute: "z-table-edit-cell block" }, ngImport: i0, template: `
     @switch (editType()) {
@@ -378,6 +400,7 @@ class ZTableEditCellComponent {
           [zMin]="editConfig().min"
           [zMax]="editConfig().max"
           [zStep]="editConfig().step ?? 1"
+          [zThousandSeparator]="editConfig().thousandSeparator || ','"
           [zDisabled]="isDisabled()"
           [ngModel]="numericValue()"
           (ngModelChange)="onValueChange($event)"
@@ -459,6 +482,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
           [zMin]="editConfig().min"
           [zMax]="editConfig().max"
           [zStep]="editConfig().step ?? 1"
+          [zThousandSeparator]="editConfig().thousandSeparator || ','"
           [zDisabled]="isDisabled()"
           [ngModel]="numericValue()"
           (ngModelChange)="onValueChange($event)"