@zeedhi/common 1.59.0 → 1.60.0

package/dist/zd-common.esm.js

@@ -3106,34 +3106,38 @@ class Dashboard extends ComponentRender {
         };
         /* ----- end modal functions ----- */
         /* Edit header */
-        this.headerLeftSlot = [
-            {
-                name: `addDashboard${this.name}`,
-                component: 'ZdButton',
-                label: 'ADD',
-                iconName: 'plus',
-                color: 'white',
-                small: true,
-                cssClass: 'zd-my-2',
-                outline: true,
-                events: {
-                    click: this.openModalAddCard.bind(this),
+        this.editHeader = {
+            component: 'ZdHeader',
+            name: `edit-header-${this.name}`,
+            leftSlot: [
+                {
+                    name: `addDashboard${this.name}`,
+                    component: 'ZdButton',
+                    label: 'ADD',
+                    iconName: 'plus',
+                    color: 'white',
+                    small: true,
+                    cssClass: 'zd-my-2',
+                    outline: true,
+                    events: {
+                        click: this.openModalAddCard.bind(this),
+                    },
                 },
-            },
-            {
-                name: `saveDashboard${this.name}`,
-                component: 'ZdButton',
-                label: 'SAVE',
-                iconName: 'complete',
-                color: 'white',
-                small: true,
-                cssClass: 'zd-my-2',
-                outline: true,
-                events: {
-                    click: this.onSave.bind(this),
+                {
+                    name: `saveDashboard${this.name}`,
+                    component: 'ZdButton',
+                    label: 'SAVE',
+                    iconName: 'complete',
+                    color: 'white',
+                    small: true,
+                    cssClass: 'zd-my-2',
+                    outline: true,
+                    events: {
+                        click: this.onSave.bind(this),
+                    },
                 },
-            },
-        ];
+            ],
+        };
         this.editingMode = this.getInitValue('editingMode', props.editingMode, this.editingMode);
         this.moveMode = this.getInitValue('moveMode', props.moveMode, this.moveMode);
         this.cards = this.getInitValue('cards', props.cards, this.cards);
@@ -3142,6 +3146,7 @@ class Dashboard extends ComponentRender {
         this.height = this.getInitValue('height', props.height, this.height);
         this.heightAdjust = this.getInitValue('heightAdjust', props.heightAdjust, this.heightAdjust);
         this.cardFooterSlot = this.getInitValue('cardFooterSlot', props.cardFooterSlot, this.cardFooterSlot);
+        this.editHeader = this.getInitValue('editHeader', props.editHeader, this.editHeader);
         this.createAccessors();
     }
     onMounted(element) {
@@ -3320,7 +3325,7 @@ class Dashboard extends ComponentRender {
     }
     /* Generate unique ids */
     getCardId() {
-        return Math.random().toString(36).substr(2, 9);
+        return Math.random().toString(36).substring(2, 9);
     }
     selectCard(cardId) {
         this.currentCardId = cardId;
@@ -5118,7 +5123,7 @@ FormatterParserProvider.registerFormatter('column_ZdSelect', ({ column, value, r
     return value;
 });
 FormatterParserProvider.registerFormatter('column_ZdSelectMultiple', ({ column, value, row, componentProps, }) => {
-    if (!value || value.length === 0)
+    if (!value || !Array.isArray(value) || value.length === 0)
         return '';
     const { formatterDataText } = componentProps;
     const formatterFn = FormatterParserProvider.getFormatter('column_ZdSelect');

package/dist/zd-common.umd.js

@@ -3113,34 +3113,38 @@
           };
           /* ----- end modal functions ----- */
           /* Edit header */
-          this.headerLeftSlot = [
-              {
-                  name: `addDashboard${this.name}`,
-                  component: 'ZdButton',
-                  label: 'ADD',
-                  iconName: 'plus',
-                  color: 'white',
-                  small: true,
-                  cssClass: 'zd-my-2',
-                  outline: true,
-                  events: {
-                      click: this.openModalAddCard.bind(this),
+          this.editHeader = {
+              component: 'ZdHeader',
+              name: `edit-header-${this.name}`,
+              leftSlot: [
+                  {
+                      name: `addDashboard${this.name}`,
+                      component: 'ZdButton',
+                      label: 'ADD',
+                      iconName: 'plus',
+                      color: 'white',
+                      small: true,
+                      cssClass: 'zd-my-2',
+                      outline: true,
+                      events: {
+                          click: this.openModalAddCard.bind(this),
+                      },
                   },
-              },
-              {
-                  name: `saveDashboard${this.name}`,
-                  component: 'ZdButton',
-                  label: 'SAVE',
-                  iconName: 'complete',
-                  color: 'white',
-                  small: true,
-                  cssClass: 'zd-my-2',
-                  outline: true,
-                  events: {
-                      click: this.onSave.bind(this),
+                  {
+                      name: `saveDashboard${this.name}`,
+                      component: 'ZdButton',
+                      label: 'SAVE',
+                      iconName: 'complete',
+                      color: 'white',
+                      small: true,
+                      cssClass: 'zd-my-2',
+                      outline: true,
+                      events: {
+                          click: this.onSave.bind(this),
+                      },
                   },
-              },
-          ];
+              ],
+          };
           this.editingMode = this.getInitValue('editingMode', props.editingMode, this.editingMode);
           this.moveMode = this.getInitValue('moveMode', props.moveMode, this.moveMode);
           this.cards = this.getInitValue('cards', props.cards, this.cards);
@@ -3149,6 +3153,7 @@
           this.height = this.getInitValue('height', props.height, this.height);
           this.heightAdjust = this.getInitValue('heightAdjust', props.heightAdjust, this.heightAdjust);
           this.cardFooterSlot = this.getInitValue('cardFooterSlot', props.cardFooterSlot, this.cardFooterSlot);
+          this.editHeader = this.getInitValue('editHeader', props.editHeader, this.editHeader);
           this.createAccessors();
       }
       onMounted(element) {
@@ -3327,7 +3332,7 @@
       }
       /* Generate unique ids */
       getCardId() {
-          return Math.random().toString(36).substr(2, 9);
+          return Math.random().toString(36).substring(2, 9);
       }
       selectCard(cardId) {
           this.currentCardId = cardId;
@@ -5125,7 +5130,7 @@
       return value;
   });
   core.FormatterParserProvider.registerFormatter('column_ZdSelectMultiple', ({ column, value, row, componentProps, }) => {
-      if (!value || value.length === 0)
+      if (!value || !Array.isArray(value) || value.length === 0)
           return '';
       const { formatterDataText } = componentProps;
       const formatterFn = core.FormatterParserProvider.getFormatter('column_ZdSelect');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/common",
-  "version": "1.59.0",
+  "version": "1.60.0",
   "description": "Zeedhi Common",
   "author": "Zeedhi <zeedhi@teknisa.com>",
   "license": "ISC",
@@ -39,5 +39,5 @@
     "lodash.times": "^4.3.2",
     "mockdate": "^3.0.2"
   },
-  "gitHead": "1994ad253bafc3190adf1dd0db028b2825a2f16e"
+  "gitHead": "70326c57b4ab9d895495ee1a05045060a09cc41a"
 }

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

@@ -1,9 +1,9 @@
 import { IDashboard, IDashboardEvents, IDashboardCard } from './interfaces';
 import { ComponentRender } from '../zd-component/component-render';
-import { IButton } from '../zd-button/interfaces';
 import { Modal } from '../zd-modal/modal';
 import { IModal } from '../zd-modal/interfaces';
 import { IComponentRender } from '../zd-component/interfaces';
+import { IHeader } from '../zd-header/interfaces';
 /**
  * Base class for Dashboard component.
  */
@@ -38,7 +38,7 @@ export declare class Dashboard extends ComponentRender implements IDashboard {
     openModalAddCard(): void;
     modalCancelClick(): void;
     openModalEditCard(cardId: string): void;
-    headerLeftSlot: IButton[];
+    editHeader: IHeader;
     onSave(): void;
     getFrameProps(cardId: string): {
         name?: undefined;

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

@@ -1,8 +1,8 @@
 import { IEventParam } from '@zeedhi/core';
 import { Dashboard } from './dashboard';
 import { IComponentRender, IComponentEvents } from '../zd-component/interfaces';
-import { IButton } from '../zd-button/interfaces';
 import { ICard } from '../zd-card/interfaces';
+import { IHeader } from '../zd-header/interfaces';
 export declare type IDashboardEventParam = IEventParam<Dashboard>;
 export declare type IDashboardLoadEvent<T> = (event: T) => Promise<any>;
 export interface IDashboardEvents<T = IEventParam<any>> extends IComponentEvents<T> {
@@ -14,7 +14,7 @@ export interface IDashboard extends IComponentRender {
     cards?: IDashboardCard[];
     editingMode?: boolean;
     moveMode?: boolean;
-    headerLeftSlot?: IButton[];
+    editHeader?: IHeader;
     removePadding?: boolean;
     height?: string | number;
     heightAdjust?: string | number;