@zeedhi/common 1.45.1 → 1.46.0

package/dist/zd-common.esm.js

@@ -495,7 +495,7 @@ class ApexChart extends ComponentRender {
      * @param options New options
      */
     updateChart(options) {
-        this.options = Object.assign(Object.assign({}, this.options), options);
+        merge(this.options, options);
         if (options.series) {
             this.series = this.options.series;
         }
@@ -1757,7 +1757,8 @@ class Input extends ComponentRender {
      * Removes all input validation.
      */
     clearValidations() {
-        Object.keys(this.validations).forEach((name) => this.removeValidation(name));
+        this.validations = {};
+        this.rules = [];
     }
     /**
      * Updates input rules.
@@ -4947,6 +4948,9 @@ class Grid extends Iterable {
         this.toolbarSlot = [
             { name: '<<NAME>>_gridSearch', component: 'ZdSearch' },
         ];
+        this.loadingText = 'LOADING';
+        this.noDataText = 'NO_DATA';
+        this.noResultsText = 'NO_RESULT';
         /**
          * Components that will be rendered in no-data case
          */
@@ -4955,7 +4959,7 @@ class Grid extends Iterable {
                 name: '<<NAME>>_no-data',
                 component: 'ZdText',
                 cssClass: 'no-data',
-                text: 'NO_DATA',
+                text: this.noDataText,
             },
         ];
         /**
@@ -4966,7 +4970,7 @@ class Grid extends Iterable {
                 name: '<<NAME>>_no-result',
                 component: 'ZdText',
                 cssClass: 'no-result',
-                text: 'NO_RESULT',
+                text: this.noResultsText,
             },
         ];
         /**
@@ -5070,6 +5074,7 @@ class Grid extends Iterable {
         this.headerCellTextColor = this.getInitValue('headerCellTextColor', props.headerCellTextColor, this.headerCellTextColor);
         this.dragColumns = this.getInitValue('dragColumns', props.dragColumns, this.dragColumns);
         this.resizeColumns = this.getInitValue('resizeColumns', props.resizeColumns, this.resizeColumns);
+        this.loadingText = this.getInitValue('loadingText', props.loadingText, this.loadingText);
         this.toolbarSlot = props.toolbarSlot || this.toolbarSlot;
         this.footerSlot = props.footerSlot || this.footerSlot;
         this.noDataSlot = props.noDataSlot || this.noDataSlot;
@@ -5079,6 +5084,8 @@ class Grid extends Iterable {
         this.footerSlot = this.changeDefaultSlotNames(this.footerSlot);
         this.toolbarSlot = this.changeDefaultSlotNames(this.toolbarSlot);
         this.noResultSlot = this.changeDefaultSlotNames(this.noResultSlot);
+        this.noDataText = this.getInitValue('noDataText', props.noDataText, this.noDataText);
+        this.noResultsText = this.getInitValue('noResultsText', props.noResultsText, this.noResultsText);
         this.createAccessors();
     }
     onMounted(element) {
@@ -8267,6 +8274,12 @@ class RangeSlider extends Input {
         this.vertical = this.getInitValue('vertical', props.vertical, this.vertical);
         this.createAccessors();
     }
+    get value() {
+        return this.rangeSliderValue === null ? undefined : this.rangeSliderValue;
+    }
+    set value(value) {
+        this.rangeSliderValue = value;
+    }
 }
 
 /**
@@ -10316,6 +10329,8 @@ class Tree extends ComponentRender {
         this.titleField = '';
         /** Datasource data field */
         this.dataField = '';
+        /** Datasource checked field */
+        this.checkedField = 'checked';
         /**
          * Defines if the tree will be opened or not (true/false) or if it should open only until a specific level
          */
@@ -10334,7 +10349,6 @@ class Tree extends ComponentRender {
         this.appliedConditions = {};
         /* Conditions of tree */
         this.factoredConditions = {};
-        this.nodes = this.initNodes(props.nodes || this.nodes);
         this.itemIconName = this.getInitValue('itemIconName', props.itemIconName, this.itemIconName);
         this.groupIconName = this.getInitValue('groupIconName', props.groupIconName, this.groupIconName);
         this.openedIconName = this.getInitValue('openedIconName', props.openedIconName, this.openedIconName);
@@ -10344,6 +10358,7 @@ class Tree extends ComponentRender {
         this.parentField = this.getInitValue('parentField', props.parentField, this.parentField);
         this.titleField = this.getInitValue('titleField', props.titleField, this.titleField);
         this.dataField = this.getInitValue('dataField', props.dataField, this.dataField);
+        this.checkedField = this.getInitValue('checkedField', props.checkedField, this.checkedField);
         this.openLevelOnLoad = this.getInitValue('openLevelOnLoad', props.openLevelOnLoad, this.openLevelOnLoad);
         this.checkbox = this.getInitValue('checkbox', props.checkbox, this.checkbox);
         this.afterTitleSlot = props.afterTitleSlot || this.afterTitleSlot;
@@ -10361,29 +10376,46 @@ class Tree extends ComponentRender {
             this.createDataStructure();
         }
         this.createAccessors();
+        this.nodes = props.nodes || this.nodes;
     }
     /**
      * Initialize all the properties of the declared nodes (reactivity)
      */
-    initNodes(nodes) {
-        return nodes.map((node) => (Object.assign(Object.assign({ isLeaf: false, isExpanded: true, isSelected: false, isDraggable: true, isSelectable: true, isChecked: false }, node), { children: this.initNodes(node.children || []) })));
+    initNodes(nodes, override) {
+        return nodes.map((node) => {
+            let newNode = {
+                title: '',
+                isLeaf: false,
+                isExpanded: true,
+                isSelected: false,
+                isDraggable: true,
+                isSelectable: true,
+                data: {
+                    [this.checkedField]: false,
+                },
+                children: [],
+            };
+            newNode = merge(newNode, node, override);
+            newNode.children = this.initNodes(node.children || [], override);
+            return newNode;
+        });
     }
     /** Nodes */
     get nodes() {
         return this.nodesValue;
     }
     set nodes(value) {
+        let override = {};
         if (!this.allowDragDrop) {
-            this.removeDraggable(value);
+            override = { isDraggable: false };
         }
-        this.nodesValue = value;
+        this.nodesValue = this.initNodes(value, override);
     }
     getCheckedNodes() {
         const selectedNodes = [];
         this.tree.traverse((node) => {
-            const instanceNode = this.getNode(node.path || []);
-            if (instanceNode === null || instanceNode === void 0 ? void 0 : instanceNode.isChecked) {
-                selectedNodes.push(instanceNode);
+            if (node.data && node.data[this.checkedField]) {
+                selectedNodes.push(node);
             }
         });
         return selectedNodes;
@@ -10436,15 +10468,16 @@ class Tree extends ComponentRender {
     }
     /** Insert nodes by the current cursor position */
     insertNode(newNode) {
+        const initNode = this.initNodes([newNode])[0];
         if (this.selectedNodes.length) {
             const cursorPosition = {
                 node: this.selectedNodes[0],
                 placement: 'inside',
             };
-            this.tree.insert(cursorPosition, newNode);
+            this.tree.insert(cursorPosition, initNode);
         }
         else {
-            this.nodes.push(newNode);
+            this.nodes.push(initNode);
         }
     }
     importNodes(nodes) {
@@ -10474,15 +10507,6 @@ class Tree extends ComponentRender {
     updateNodeData(node, value) {
         this.tree.updateNode(node.path, value);
     }
-    removeDraggable(items) {
-        items.forEach((item) => {
-            var _a;
-            item.isDraggable = false;
-            if ((_a = item.children) === null || _a === void 0 ? void 0 : _a.length) {
-                this.removeDraggable(item.children);
-            }
-        });
-    }
     setTree(tree) {
         this.tree = tree;
     }
@@ -10614,7 +10638,7 @@ class Tree extends ComponentRender {
     }
     getParentNode(node) {
         var _a;
-        return this.getNode(((_a = node.path) === null || _a === void 0 ? void 0 : _a.slice(0, -1)) || []);
+        return this.tree.getNode(((_a = node.path) === null || _a === void 0 ? void 0 : _a.slice(0, -1)) || []);
     }
     searchPath(nodes, path) {
         const currentNode = (path[0] > -1 && path[0] < nodes.length) ? nodes[path[0]] : undefined;
@@ -10809,6 +10833,7 @@ class TreeGridEditable extends TreeGrid {
             },
         };
         this.doubleClickEdit = this.getInitValue('doubleClickEdit', props.doubleClickEdit, this.doubleClickEdit);
+        this.noDataSlot = this.changeDefaultSlotNames(this.noDataSlot);
         this.createAccessors();
     }
     onMounted(element) {

package/dist/zd-common.umd.js

@@ -502,7 +502,7 @@
        * @param options New options
        */
       updateChart(options) {
-          this.options = Object.assign(Object.assign({}, this.options), options);
+          merge__default["default"](this.options, options);
           if (options.series) {
               this.series = this.options.series;
           }
@@ -1764,7 +1764,8 @@
        * Removes all input validation.
        */
       clearValidations() {
-          Object.keys(this.validations).forEach((name) => this.removeValidation(name));
+          this.validations = {};
+          this.rules = [];
       }
       /**
        * Updates input rules.
@@ -4954,6 +4955,9 @@
           this.toolbarSlot = [
               { name: '<<NAME>>_gridSearch', component: 'ZdSearch' },
           ];
+          this.loadingText = 'LOADING';
+          this.noDataText = 'NO_DATA';
+          this.noResultsText = 'NO_RESULT';
           /**
            * Components that will be rendered in no-data case
            */
@@ -4962,7 +4966,7 @@
                   name: '<<NAME>>_no-data',
                   component: 'ZdText',
                   cssClass: 'no-data',
-                  text: 'NO_DATA',
+                  text: this.noDataText,
               },
           ];
           /**
@@ -4973,7 +4977,7 @@
                   name: '<<NAME>>_no-result',
                   component: 'ZdText',
                   cssClass: 'no-result',
-                  text: 'NO_RESULT',
+                  text: this.noResultsText,
               },
           ];
           /**
@@ -5077,6 +5081,7 @@
           this.headerCellTextColor = this.getInitValue('headerCellTextColor', props.headerCellTextColor, this.headerCellTextColor);
           this.dragColumns = this.getInitValue('dragColumns', props.dragColumns, this.dragColumns);
           this.resizeColumns = this.getInitValue('resizeColumns', props.resizeColumns, this.resizeColumns);
+          this.loadingText = this.getInitValue('loadingText', props.loadingText, this.loadingText);
           this.toolbarSlot = props.toolbarSlot || this.toolbarSlot;
           this.footerSlot = props.footerSlot || this.footerSlot;
           this.noDataSlot = props.noDataSlot || this.noDataSlot;
@@ -5086,6 +5091,8 @@
           this.footerSlot = this.changeDefaultSlotNames(this.footerSlot);
           this.toolbarSlot = this.changeDefaultSlotNames(this.toolbarSlot);
           this.noResultSlot = this.changeDefaultSlotNames(this.noResultSlot);
+          this.noDataText = this.getInitValue('noDataText', props.noDataText, this.noDataText);
+          this.noResultsText = this.getInitValue('noResultsText', props.noResultsText, this.noResultsText);
           this.createAccessors();
       }
       onMounted(element) {
@@ -8274,6 +8281,12 @@
           this.vertical = this.getInitValue('vertical', props.vertical, this.vertical);
           this.createAccessors();
       }
+      get value() {
+          return this.rangeSliderValue === null ? undefined : this.rangeSliderValue;
+      }
+      set value(value) {
+          this.rangeSliderValue = value;
+      }
   }
 
   /**
@@ -10323,6 +10336,8 @@
           this.titleField = '';
           /** Datasource data field */
           this.dataField = '';
+          /** Datasource checked field */
+          this.checkedField = 'checked';
           /**
            * Defines if the tree will be opened or not (true/false) or if it should open only until a specific level
            */
@@ -10341,7 +10356,6 @@
           this.appliedConditions = {};
           /* Conditions of tree */
           this.factoredConditions = {};
-          this.nodes = this.initNodes(props.nodes || this.nodes);
           this.itemIconName = this.getInitValue('itemIconName', props.itemIconName, this.itemIconName);
           this.groupIconName = this.getInitValue('groupIconName', props.groupIconName, this.groupIconName);
           this.openedIconName = this.getInitValue('openedIconName', props.openedIconName, this.openedIconName);
@@ -10351,6 +10365,7 @@
           this.parentField = this.getInitValue('parentField', props.parentField, this.parentField);
           this.titleField = this.getInitValue('titleField', props.titleField, this.titleField);
           this.dataField = this.getInitValue('dataField', props.dataField, this.dataField);
+          this.checkedField = this.getInitValue('checkedField', props.checkedField, this.checkedField);
           this.openLevelOnLoad = this.getInitValue('openLevelOnLoad', props.openLevelOnLoad, this.openLevelOnLoad);
           this.checkbox = this.getInitValue('checkbox', props.checkbox, this.checkbox);
           this.afterTitleSlot = props.afterTitleSlot || this.afterTitleSlot;
@@ -10368,29 +10383,46 @@
               this.createDataStructure();
           }
           this.createAccessors();
+          this.nodes = props.nodes || this.nodes;
       }
       /**
        * Initialize all the properties of the declared nodes (reactivity)
        */
-      initNodes(nodes) {
-          return nodes.map((node) => (Object.assign(Object.assign({ isLeaf: false, isExpanded: true, isSelected: false, isDraggable: true, isSelectable: true, isChecked: false }, node), { children: this.initNodes(node.children || []) })));
+      initNodes(nodes, override) {
+          return nodes.map((node) => {
+              let newNode = {
+                  title: '',
+                  isLeaf: false,
+                  isExpanded: true,
+                  isSelected: false,
+                  isDraggable: true,
+                  isSelectable: true,
+                  data: {
+                      [this.checkedField]: false,
+                  },
+                  children: [],
+              };
+              newNode = merge__default["default"](newNode, node, override);
+              newNode.children = this.initNodes(node.children || [], override);
+              return newNode;
+          });
       }
       /** Nodes */
       get nodes() {
           return this.nodesValue;
       }
       set nodes(value) {
+          let override = {};
           if (!this.allowDragDrop) {
-              this.removeDraggable(value);
+              override = { isDraggable: false };
           }
-          this.nodesValue = value;
+          this.nodesValue = this.initNodes(value, override);
       }
       getCheckedNodes() {
           const selectedNodes = [];
           this.tree.traverse((node) => {
-              const instanceNode = this.getNode(node.path || []);
-              if (instanceNode === null || instanceNode === void 0 ? void 0 : instanceNode.isChecked) {
-                  selectedNodes.push(instanceNode);
+              if (node.data && node.data[this.checkedField]) {
+                  selectedNodes.push(node);
               }
           });
           return selectedNodes;
@@ -10443,15 +10475,16 @@
       }
       /** Insert nodes by the current cursor position */
       insertNode(newNode) {
+          const initNode = this.initNodes([newNode])[0];
           if (this.selectedNodes.length) {
               const cursorPosition = {
                   node: this.selectedNodes[0],
                   placement: 'inside',
               };
-              this.tree.insert(cursorPosition, newNode);
+              this.tree.insert(cursorPosition, initNode);
           }
           else {
-              this.nodes.push(newNode);
+              this.nodes.push(initNode);
           }
       }
       importNodes(nodes) {
@@ -10481,15 +10514,6 @@
       updateNodeData(node, value) {
           this.tree.updateNode(node.path, value);
       }
-      removeDraggable(items) {
-          items.forEach((item) => {
-              var _a;
-              item.isDraggable = false;
-              if ((_a = item.children) === null || _a === void 0 ? void 0 : _a.length) {
-                  this.removeDraggable(item.children);
-              }
-          });
-      }
       setTree(tree) {
           this.tree = tree;
       }
@@ -10621,7 +10645,7 @@
       }
       getParentNode(node) {
           var _a;
-          return this.getNode(((_a = node.path) === null || _a === void 0 ? void 0 : _a.slice(0, -1)) || []);
+          return this.tree.getNode(((_a = node.path) === null || _a === void 0 ? void 0 : _a.slice(0, -1)) || []);
       }
       searchPath(nodes, path) {
           const currentNode = (path[0] > -1 && path[0] < nodes.length) ? nodes[path[0]] : undefined;
@@ -10816,6 +10840,7 @@
               },
           };
           this.doubleClickEdit = this.getInitValue('doubleClickEdit', props.doubleClickEdit, this.doubleClickEdit);
+          this.noDataSlot = this.changeDefaultSlotNames(this.noDataSlot);
           this.createAccessors();
       }
       onMounted(element) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/common",
-  "version": "1.45.1",
+  "version": "1.46.0",
   "description": "Zeedhi Common",
   "author": "Zeedhi <zeedhi@teknisa.com>",
   "license": "ISC",
@@ -37,5 +37,5 @@
     "lodash.times": "^4.3.2",
     "mockdate": "^3.0.2"
   },
-  "gitHead": "48ccd8cb489384bbdedb6f649504ca64d9d6fc1c"
+  "gitHead": "0133e8028e0b9b5876c2bb24b9a8c4d687d22dd8"
 }

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

@@ -11,6 +11,9 @@ export declare class Grid extends Iterable implements IGrid {
      * Components that will be rendered on toolbar slot
      */
     toolbarSlot: IComponentRender[];
+    loadingText: string;
+    noDataText: string;
+    noResultsText: string;
     /**
      * Components that will be rendered in no-data case
      */
@@ -163,5 +166,5 @@ export declare class Grid extends Iterable implements IGrid {
     protected navigatePageDown(): void;
     deleteRows(): Promise<any[]>;
     getActionComponent(actionComponent: IComponent, column: GridColumn, row: IDictionary, parentPath?: string): IComponent;
-    private changeDefaultSlotNames;
+    protected changeDefaultSlotNames(slot: IComponentRender[]): IComponentRender[];
 }

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

@@ -37,6 +37,9 @@ export interface IGrid extends IIterable {
     toolbarSlot?: IComponentRender[];
     dragColumns?: boolean;
     resizeColumns?: boolean;
+    loadingText?: string;
+    noDataText?: string;
+    noResultsText?: string;
 }
 export interface IGridColumn extends IColumn {
     children?: IChildrenActionColumn[];

package/types/components/zd-range-slider/range-slider.d.ts

@@ -58,9 +58,12 @@ export declare class RangeSlider extends Input implements IRangeSlider {
      * Defines the range-slider ticks
      */
     ticks: IRangeSliderTicks;
+    private rangeSliderValue;
     /**
      * Create a new Range Slider
      * @param props Range Slider properties
      */
     constructor(props: IRangeSlider);
+    get value(): any;
+    set value(value: any);
 }

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

@@ -9,7 +9,6 @@ export interface ITreeNodeModel<T> {
     isSelected?: boolean;
     isDraggable?: boolean;
     isSelectable?: boolean;
-    isChecked?: boolean;
     data?: T;
 }
 export interface ITreeNode<T> extends ITreeNodeModel<T> {
@@ -62,6 +61,7 @@ export interface ITree extends IComponentRender {
     parentField?: string;
     titleField?: string;
     dataField?: string;
+    checkedField?: string;
     openLevelOnLoad?: number | boolean;
     checkbox?: boolean;
 }

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

@@ -37,6 +37,8 @@ export declare class Tree extends ComponentRender implements ITree {
     titleField: string;
     /** Datasource data field */
     dataField: string;
+    /** Datasource checked field */
+    checkedField: string;
     /**
      * Defines if the tree will be opened or not (true/false) or if it should open only until a specific level
      */
@@ -66,11 +68,11 @@ export declare class Tree extends ComponentRender implements ITree {
     /**
      * Initialize all the properties of the declared nodes (reactivity)
      */
-    protected initNodes(nodes: ITreeNodeModel<IDictionary>[]): ITreeNodeModel<IDictionary>[];
+    protected initNodes(nodes: ITreeNodeModel<IDictionary>[], override?: IDictionary): ITreeNodeModel<IDictionary>[];
     /** Nodes */
     get nodes(): ITreeNodeModel<IDictionary>[];
     set nodes(value: ITreeNodeModel<IDictionary>[]);
-    getCheckedNodes(): ITreeNodeModel<IDictionary<any>>[];
+    getCheckedNodes(): ITreeNode<IDictionary<any>>[];
     /** Returns the selected nodes */
     get selectedNodes(): ITreeNode<IDictionary>[];
     private createDataStructure;
@@ -85,7 +87,6 @@ export declare class Tree extends ComponentRender implements ITree {
     removeSelected(): void;
     /** Update selected node */
     updateNodeData(node: ITreeNode<IDictionary>, value: IDictionary): void;
-    private removeDraggable;
     setTree(tree: any): void;
     /**
      * Return plain conditions object
@@ -110,6 +111,6 @@ export declare class Tree extends ComponentRender implements ITree {
     nodeCheck(node: ITreeNode<IDictionary>, event?: Event, element?: HTMLElement): void;
     clearSelection(nodes?: ITreeNodeModel<IDictionary<any>>[]): void;
     getNode(path: number[]): ITreeNodeModel<IDictionary<any>> | undefined;
-    getParentNode(node: ITreeNode<IDictionary>): ITreeNodeModel<IDictionary<any>> | undefined;
+    getParentNode(node: ITreeNode<IDictionary>): any;
     private searchPath;
 }