@zeedhi/common 1.57.0 → 1.57.1

package/dist/zd-common.esm.js

@@ -4427,7 +4427,7 @@ class Number$1 extends TextInput {
         return this.localValue;
     }
     set value(value) {
-        if (typeof value === 'string' && window.Number.isNaN(parseFloat(value)))
+        if (this.isFocused || (typeof value === 'string' && window.Number.isNaN(parseFloat(value))))
             return;
         this.localValue = value;
         if (this.maskValid && this.localValue !== undefined && this.localValue !== null) {
@@ -6107,11 +6107,11 @@ class Frame extends ComponentRender {
         });
     }
     overrideNamedPropsFunc(metadata) {
-        let strMatadata = JSON.stringify(metadata);
+        let strMetadata = JSON.stringify(metadata);
         Object.keys(this.overrideNamedProps).forEach((key) => {
-            strMatadata = strMatadata.replace(RegExp(`<<${key}>>`, 'g'), this.overrideNamedProps[key]);
+            strMetadata = strMetadata.replace(RegExp(`<<${key}>>`, 'g'), this.overrideNamedProps[key]);
         });
-        return JSON.parse(strMatadata);
+        return JSON.parse(strMetadata);
     }
     reload() {
         return __awaiter(this, void 0, void 0, function* () {
@@ -6440,11 +6440,11 @@ class ColumnNotFoundError extends Error {
 class IterableController {
     constructor(iterable) {
         this.searchInValue = undefined;
-        this.columns = iterable.columns;
+        this.iterable = iterable;
     }
     get searchIn() {
-        return this.searchInValue || this.columns.reduce((result, column) => {
-            if (column.type !== 'action' && column.isVisible)
+        return this.searchInValue || this.iterable.columns.reduce((result, column) => {
+            if (column.type !== 'action' && (!this.iterable.searchVisibleOnly || column.isVisible))
                 result.push(column.name);
             return result;
         }, []);
@@ -6464,7 +6464,7 @@ class Iterable extends ComponentRender {
      * @param props Iterable properties
      */
     constructor(props) {
-        var _a;
+        var _a, _b;
         super(props);
         /**
          * Iterable columns
@@ -6488,10 +6488,12 @@ class Iterable extends ComponentRender {
          * Dictionary of prop pointing to the condition (applied) return value
          */
         this.actionsApplied = {};
+        this.defaultSearchVisibleOnly = (_a = Config.iterableSearchVisibleOnly) !== null && _a !== void 0 ? _a : true;
         this.columns = this.getColumns(props.columns || this.columns);
         this.createController();
-        this.datasource = DatasourceFactory.factory(Object.assign(Object.assign({}, props.datasource), { searchIn: ((_a = props.datasource) === null || _a === void 0 ? void 0 : _a.searchIn) || `{{IterableController_${this.name}.searchIn}}` }));
+        this.datasource = DatasourceFactory.factory(Object.assign(Object.assign({}, props.datasource), { searchIn: ((_b = props.datasource) === null || _b === void 0 ? void 0 : _b.searchIn) || `{{IterableController_${this.name}.searchIn}}` }));
         this.pageSizes = this.getInitValue('pageSizes', props.pageSizes, this.pageSizes);
+        this.searchVisibleOnly = this.getInitValue('searchVisibleOnly', props.searchVisibleOnly, this.defaultSearchVisibleOnly);
         this.virtualScroll = this.getInitValue('virtualScroll', props.virtualScroll, this.virtualScroll);
     }
     createController() {
@@ -6813,8 +6815,24 @@ class Grid extends Iterable {
          */
         this.footerSlot = [
             { name: '<<NAME>>_iterablePagination', component: 'ZdIterablePagination' },
-            { name: '<<NAME>>_iterablePageSize', component: 'ZdIterablePageSize' },
-            { name: '<<NAME>>_iterablePageInfo', component: 'ZdIterablePageInfo' },
+            {
+                name: '<<NAME>>_iterableInfoDiv',
+                component: 'ZdTag',
+                cssClass: 'zd-grid-div-footer',
+                tag: 'div',
+                children: [
+                    {
+                        name: '<<NAME>>_iterablePageSize',
+                        component: 'ZdIterablePageSize',
+                        iterableComponentName: '<<NAME>>',
+                    },
+                    {
+                        name: '<<NAME>>_iterablePageInfo',
+                        component: 'ZdIterablePageInfo',
+                        iterableComponentName: '<<NAME>>',
+                    },
+                ],
+            },
         ];
         /**
          * Toggle checkbox column
@@ -7104,10 +7122,9 @@ class Grid extends Iterable {
         return newComponent;
     }
     changeDefaultSlotNames(slot) {
-        slot.forEach((item) => {
-            item.name = item.name.replace('<<NAME>>', this.name);
-        });
-        return slot;
+        const strMetadata = JSON.stringify(slot);
+        const newObj = strMetadata.replace(RegExp('<<NAME>>', 'g'), this.name);
+        return JSON.parse(newObj);
     }
     callDisableSelection(row) {
         return !!this.disableSelection && typeof this.disableSelection === 'function'
@@ -8314,7 +8331,7 @@ class Select extends TextInput {
         return this.fieldValue;
     }
     set value(value) {
-        if (this.initialized && this.value !== value) {
+        if (this.initialized && this.fieldValue !== value) {
             this.setValue(value);
         }
     }
@@ -12381,6 +12398,10 @@ class TreeGrid extends Grid {
          * Components that will be rendered on footer slot
          */
         this.footerSlot = [];
+        /**
+         * Even though all children are selected, the parent node is not
+         */
+        this.flat = false;
         this.navigationTreeKeyMapping = {
             right: {
                 event: this.navigateToggle.bind(this, false),
@@ -12397,6 +12418,7 @@ class TreeGrid extends Grid {
         this.lazyLoad = ((_a = props.datasource) === null || _a === void 0 ? void 0 : _a.lazyLoad) !== false;
         this.parentField = this.getInitValue('parentField', props.parentField, this.parentField);
         this.fetchOnDemand = this.getInitValue('fetchOnDemand', props.fetchOnDemand, this.fetchOnDemand);
+        this.flat = this.getInitValue('flat', props.flat, this.flat);
         this.treeDataStructure = new TreeDataStructure(this);
         this.createAccessors();
     }
@@ -12507,17 +12529,22 @@ class TreeGrid extends Grid {
             }
         }
     }
+    removeDuplicates(arr, key) {
+        return [...new Map(arr.map((item) => [item[key], item])).values()];
+    }
     /**
      * Select/deselect rows
      * @param row selected row
      * @param isSelected row is selected
      */
     selectRow(row, isSelected) {
-        const rows = [row, ...this.treeDataStructure.getChildren(row)];
+        const childrenRows = !this.flat ? this.treeDataStructure.getChildren(row) : [];
+        const rows = [row, ...childrenRows];
         if (isSelected) {
-            this.selectedRows = Array.from(new Set(this.selectedRows.concat(rows))); // remove duplicates
+            this.selectedRows = this.removeDuplicates(this.selectedRows.concat(rows), this.datasource.uniqueKey);
             // check if all the children of the parent are selected.
-            this.selectParents(rows, row);
+            if (!this.flat)
+                this.selectParents(row);
         }
         else {
             rows.forEach((item) => {
@@ -12525,10 +12552,33 @@ class TreeGrid extends Grid {
                 if (index > -1)
                     this.selectedRows.splice(index, 1);
             });
-            this.unselectParents(row);
+            if (!this.flat)
+                this.unselectParents(row);
         }
     }
-    selectParents(rows, row) {
+    /**
+     * Select children rows
+     * @param row Row to unselect children
+     */
+    selectChildren(row) {
+        const childrenRows = this.treeDataStructure.getChildren(row);
+        const rows = this.flat ? childrenRows : [row, ...childrenRows];
+        this.selectedRows = this.removeDuplicates(this.selectedRows.concat(rows), this.datasource.uniqueKey);
+    }
+    /**
+     * Unselect children rows
+     * @param row Row to select children
+     */
+    unselectChildren(row) {
+        const childrenRows = this.treeDataStructure.getChildren(row);
+        const rows = this.flat ? childrenRows : [row, ...childrenRows];
+        rows.forEach((item) => {
+            const index = this.treeDataStructure.findDataIndex(this.selectedRows, item[this.datasource.uniqueKey]);
+            if (index > -1)
+                this.selectedRows.splice(index, 1);
+        });
+    }
+    selectParents(row) {
         if (row[this.parentField]) {
             const parentRow = this.treeDataStructure.getRowData(row).tree__parent;
             const every = this.treeDataStructure.getChildren(parentRow).every((item) => {
@@ -12537,10 +12587,11 @@ class TreeGrid extends Grid {
                     return true;
                 return false;
             });
+            const rows = [];
             if (every)
                 rows.push(parentRow);
-            this.selectedRows = Array.from(new Set(this.selectedRows.concat(rows))); // remove duplicates
-            this.selectParents(rows, parentRow);
+            this.selectedRows = this.removeDuplicates(this.selectedRows.concat(rows), this.datasource.uniqueKey);
+            this.selectParents(parentRow);
         }
     }
     unselectParents(row) {

package/dist/zd-common.umd.js

@@ -4434,7 +4434,7 @@
           return this.localValue;
       }
       set value(value) {
-          if (typeof value === 'string' && window.Number.isNaN(parseFloat(value)))
+          if (this.isFocused || (typeof value === 'string' && window.Number.isNaN(parseFloat(value))))
               return;
           this.localValue = value;
           if (this.maskValid && this.localValue !== undefined && this.localValue !== null) {
@@ -6114,11 +6114,11 @@
           });
       }
       overrideNamedPropsFunc(metadata) {
-          let strMatadata = JSON.stringify(metadata);
+          let strMetadata = JSON.stringify(metadata);
           Object.keys(this.overrideNamedProps).forEach((key) => {
-              strMatadata = strMatadata.replace(RegExp(`<<${key}>>`, 'g'), this.overrideNamedProps[key]);
+              strMetadata = strMetadata.replace(RegExp(`<<${key}>>`, 'g'), this.overrideNamedProps[key]);
           });
-          return JSON.parse(strMatadata);
+          return JSON.parse(strMetadata);
       }
       reload() {
           return __awaiter(this, void 0, void 0, function* () {
@@ -6447,11 +6447,11 @@
   class IterableController {
       constructor(iterable) {
           this.searchInValue = undefined;
-          this.columns = iterable.columns;
+          this.iterable = iterable;
       }
       get searchIn() {
-          return this.searchInValue || this.columns.reduce((result, column) => {
-              if (column.type !== 'action' && column.isVisible)
+          return this.searchInValue || this.iterable.columns.reduce((result, column) => {
+              if (column.type !== 'action' && (!this.iterable.searchVisibleOnly || column.isVisible))
                   result.push(column.name);
               return result;
           }, []);
@@ -6471,7 +6471,7 @@
        * @param props Iterable properties
        */
       constructor(props) {
-          var _a;
+          var _a, _b;
           super(props);
           /**
            * Iterable columns
@@ -6495,10 +6495,12 @@
            * Dictionary of prop pointing to the condition (applied) return value
            */
           this.actionsApplied = {};
+          this.defaultSearchVisibleOnly = (_a = core.Config.iterableSearchVisibleOnly) !== null && _a !== void 0 ? _a : true;
           this.columns = this.getColumns(props.columns || this.columns);
           this.createController();
-          this.datasource = core.DatasourceFactory.factory(Object.assign(Object.assign({}, props.datasource), { searchIn: ((_a = props.datasource) === null || _a === void 0 ? void 0 : _a.searchIn) || `{{IterableController_${this.name}.searchIn}}` }));
+          this.datasource = core.DatasourceFactory.factory(Object.assign(Object.assign({}, props.datasource), { searchIn: ((_b = props.datasource) === null || _b === void 0 ? void 0 : _b.searchIn) || `{{IterableController_${this.name}.searchIn}}` }));
           this.pageSizes = this.getInitValue('pageSizes', props.pageSizes, this.pageSizes);
+          this.searchVisibleOnly = this.getInitValue('searchVisibleOnly', props.searchVisibleOnly, this.defaultSearchVisibleOnly);
           this.virtualScroll = this.getInitValue('virtualScroll', props.virtualScroll, this.virtualScroll);
       }
       createController() {
@@ -6820,8 +6822,24 @@
            */
           this.footerSlot = [
               { name: '<<NAME>>_iterablePagination', component: 'ZdIterablePagination' },
-              { name: '<<NAME>>_iterablePageSize', component: 'ZdIterablePageSize' },
-              { name: '<<NAME>>_iterablePageInfo', component: 'ZdIterablePageInfo' },
+              {
+                  name: '<<NAME>>_iterableInfoDiv',
+                  component: 'ZdTag',
+                  cssClass: 'zd-grid-div-footer',
+                  tag: 'div',
+                  children: [
+                      {
+                          name: '<<NAME>>_iterablePageSize',
+                          component: 'ZdIterablePageSize',
+                          iterableComponentName: '<<NAME>>',
+                      },
+                      {
+                          name: '<<NAME>>_iterablePageInfo',
+                          component: 'ZdIterablePageInfo',
+                          iterableComponentName: '<<NAME>>',
+                      },
+                  ],
+              },
           ];
           /**
            * Toggle checkbox column
@@ -7111,10 +7129,9 @@
           return newComponent;
       }
       changeDefaultSlotNames(slot) {
-          slot.forEach((item) => {
-              item.name = item.name.replace('<<NAME>>', this.name);
-          });
-          return slot;
+          const strMetadata = JSON.stringify(slot);
+          const newObj = strMetadata.replace(RegExp('<<NAME>>', 'g'), this.name);
+          return JSON.parse(newObj);
       }
       callDisableSelection(row) {
           return !!this.disableSelection && typeof this.disableSelection === 'function'
@@ -8321,7 +8338,7 @@
           return this.fieldValue;
       }
       set value(value) {
-          if (this.initialized && this.value !== value) {
+          if (this.initialized && this.fieldValue !== value) {
               this.setValue(value);
           }
       }
@@ -12388,6 +12405,10 @@
            * Components that will be rendered on footer slot
            */
           this.footerSlot = [];
+          /**
+           * Even though all children are selected, the parent node is not
+           */
+          this.flat = false;
           this.navigationTreeKeyMapping = {
               right: {
                   event: this.navigateToggle.bind(this, false),
@@ -12404,6 +12425,7 @@
           this.lazyLoad = ((_a = props.datasource) === null || _a === void 0 ? void 0 : _a.lazyLoad) !== false;
           this.parentField = this.getInitValue('parentField', props.parentField, this.parentField);
           this.fetchOnDemand = this.getInitValue('fetchOnDemand', props.fetchOnDemand, this.fetchOnDemand);
+          this.flat = this.getInitValue('flat', props.flat, this.flat);
           this.treeDataStructure = new TreeDataStructure(this);
           this.createAccessors();
       }
@@ -12514,17 +12536,22 @@
               }
           }
       }
+      removeDuplicates(arr, key) {
+          return [...new Map(arr.map((item) => [item[key], item])).values()];
+      }
       /**
        * Select/deselect rows
        * @param row selected row
        * @param isSelected row is selected
        */
       selectRow(row, isSelected) {
-          const rows = [row, ...this.treeDataStructure.getChildren(row)];
+          const childrenRows = !this.flat ? this.treeDataStructure.getChildren(row) : [];
+          const rows = [row, ...childrenRows];
           if (isSelected) {
-              this.selectedRows = Array.from(new Set(this.selectedRows.concat(rows))); // remove duplicates
+              this.selectedRows = this.removeDuplicates(this.selectedRows.concat(rows), this.datasource.uniqueKey);
               // check if all the children of the parent are selected.
-              this.selectParents(rows, row);
+              if (!this.flat)
+                  this.selectParents(row);
           }
           else {
               rows.forEach((item) => {
@@ -12532,10 +12559,33 @@
                   if (index > -1)
                       this.selectedRows.splice(index, 1);
               });
-              this.unselectParents(row);
+              if (!this.flat)
+                  this.unselectParents(row);
           }
       }
-      selectParents(rows, row) {
+      /**
+       * Select children rows
+       * @param row Row to unselect children
+       */
+      selectChildren(row) {
+          const childrenRows = this.treeDataStructure.getChildren(row);
+          const rows = this.flat ? childrenRows : [row, ...childrenRows];
+          this.selectedRows = this.removeDuplicates(this.selectedRows.concat(rows), this.datasource.uniqueKey);
+      }
+      /**
+       * Unselect children rows
+       * @param row Row to select children
+       */
+      unselectChildren(row) {
+          const childrenRows = this.treeDataStructure.getChildren(row);
+          const rows = this.flat ? childrenRows : [row, ...childrenRows];
+          rows.forEach((item) => {
+              const index = this.treeDataStructure.findDataIndex(this.selectedRows, item[this.datasource.uniqueKey]);
+              if (index > -1)
+                  this.selectedRows.splice(index, 1);
+          });
+      }
+      selectParents(row) {
           if (row[this.parentField]) {
               const parentRow = this.treeDataStructure.getRowData(row).tree__parent;
               const every = this.treeDataStructure.getChildren(parentRow).every((item) => {
@@ -12544,10 +12594,11 @@
                       return true;
                   return false;
               });
+              const rows = [];
               if (every)
                   rows.push(parentRow);
-              this.selectedRows = Array.from(new Set(this.selectedRows.concat(rows))); // remove duplicates
-              this.selectParents(rows, parentRow);
+              this.selectedRows = this.removeDuplicates(this.selectedRows.concat(rows), this.datasource.uniqueKey);
+              this.selectParents(parentRow);
           }
       }
       unselectParents(row) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/common",
-  "version": "1.57.0",
+  "version": "1.57.1",
   "description": "Zeedhi Common",
   "author": "Zeedhi <zeedhi@teknisa.com>",
   "license": "ISC",
@@ -37,5 +37,5 @@
     "lodash.times": "^4.3.2",
     "mockdate": "^3.0.2"
   },
-  "gitHead": "099b5a1c0726bb00c757de8985868b197d7a57ad"
+  "gitHead": "c77cf358d4514a7230f8c85515eba42ef015cf55"
 }

package/types/components/zd-grid/grid.d.ts

@@ -175,6 +175,6 @@ export declare class Grid extends Iterable implements IGrid {
     protected navigatePageDown(): void;
     deleteRows(): Promise<any[]>;
     getActionComponent(actionComponent: IComponent, column: GridColumn, row: IDictionary, parentPath?: string): IComponent;
-    protected changeDefaultSlotNames(slot: IComponentRender[]): IComponentRender[];
+    protected changeDefaultSlotNames(slot: IComponentRender[]): any;
     callDisableSelection(row: IDictionary<any>): boolean;
 }

package/types/components/zd-iterable/interfaces.d.ts

@@ -30,6 +30,7 @@ export interface IIterable extends IComponentRender {
     datasource?: IDatasource;
     pageSizes?: string[];
     virtualScroll?: boolean;
+    searchVisibleOnly?: boolean;
 }
 export interface IIterablePageComponent extends IComponentRender {
     iterableComponentName?: string;

package/types/components/zd-iterable/iterable-controller.d.ts

@@ -1,6 +1,6 @@
 import { Iterable } from './iterable';
 export declare class IterableController {
-    private columns;
+    private iterable;
     private searchInValue?;
     constructor(iterable: Iterable);
     get searchIn(): string[] | undefined;

package/types/components/zd-iterable/iterable.d.ts

@@ -36,6 +36,11 @@ export declare class Iterable extends ComponentRender implements IIterable {
      * Dictionary of prop pointing to the condition (applied) return value
      */
     actionsApplied: IDictionary<IDictionary<IDictionary<any>>>;
+    /**
+     * Defines if searchIn should consider only visible columns or not
+     */
+    searchVisibleOnly: boolean;
+    defaultSearchVisibleOnly: boolean;
     /**
      * Creates a new Iterable.
      * @param props Iterable properties

package/types/components/zd-tree-grid/interfaces.d.ts

@@ -5,6 +5,7 @@ export interface ITreeGrid extends IGrid {
     parentField?: string;
     openLevelOnLoad?: number | boolean;
     fetchOnDemand?: boolean;
+    flat?: boolean;
 }
 export interface ITreeGridEditable extends ITreeGrid {
     columns?: IGridColumnEditable[];

package/types/components/zd-tree-grid/tree-grid.d.ts

@@ -31,6 +31,10 @@ export declare class TreeGrid extends Grid implements ITreeGrid {
      * Tree data structure
      */
     treeDataStructure: TreeDataStructure;
+    /**
+     * Even though all children are selected, the parent node is not
+     */
+    flat: boolean;
     viewUpdateScrollData?: () => void;
     /**
      * Creates a new Tree Grid.
@@ -80,12 +84,23 @@ export declare class TreeGrid extends Grid implements ITreeGrid {
      * Navigate downwards
      */
     protected navigateDown(): void;
+    private removeDuplicates;
     /**
      * Select/deselect rows
      * @param row selected row
      * @param isSelected row is selected
      */
     selectRow(row: IDictionary<any>, isSelected: boolean): void;
+    /**
+     * Select children rows
+     * @param row Row to unselect children
+     */
+    selectChildren(row: IDictionary<any>): void;
+    /**
+     * Unselect children rows
+     * @param row Row to select children
+     */
+    unselectChildren(row: IDictionary<any>): void;
     private selectParents;
     private unselectParents;
 }