@zeedhi/common 1.41.0 → 1.44.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeedhi/common",
-  "version": "1.41.0",
+  "version": "1.44.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": "8ca8a393eef096d9012bb2730f60588db71db828"
+  "gitHead": "cfe94f85ab62e7e30d7bb09ea8178edf2b75fd59"
 }

package/types/components/index.d.ts

@@ -121,6 +121,8 @@ export * from './zd-select-tree/select-tree';
 export * from './zd-select-tree/interfaces';
 export * from './zd-select-tree-multiple/select-tree-multiple';
 export * from './zd-select-tree-multiple/interfaces';
+export * from './zd-selectable-list/selectable-list';
+export * from './zd-selectable-list/interfaces';
 export * from './zd-speed-dial/speed-dial';
 export * from './zd-speed-dial/interfaces';
 export * from './zd-steppers/steppers';

package/types/components/zd-apex-chart/apex-chart.d.ts

@@ -1,4 +1,4 @@
-import { IApexChart } from './interfaces';
+import { IApexChart, IApexChartEvents } from './interfaces';
 import { ComponentRender } from '../zd-component/component-render';
 /**
  * Base class for ApexChart component.
@@ -43,6 +43,10 @@ export declare class ApexChart extends ComponentRender implements IApexChart {
      * Defines the load progress color
      */
     loadColor: string;
+    /**
+     * Defines Apex Chart events.
+     */
+    events: IApexChartEvents;
     /**
      * Optional update method assigned by view layer.
      */
@@ -72,5 +76,152 @@ export declare class ApexChart extends ComponentRender implements IApexChart {
      * @param options New options
      */
     updateChart(options: any): Promise<any>;
+    /**
+     * Fires when the chart’s initial animation is finished
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    animationEndEvent(chartContext: any, options: any): void;
+    /**
+     * Fires before the chart has been drawn on screen
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    beforeMountEvent(chartContext: any, config: any): void;
+    /**
+     * Fires after the chart has been drawn on screen
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    mountedEvent(chartContext: any, config: any): void;
+    /**
+     * Fires when the chart has been dynamically updated either with
+     * updateOptions() or updateSeries() functions
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    updatedEvent(chartContext: any, config: any): void;
+    /**
+     * Fires when the chart has been dynamically updated either with
+     * updateOptions() or updateSeries() functions
+     * @param event Event that triggered the click event
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    clickEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * Fires when user moves mouse on any area of the chart.
+     * @param event Event that triggered the click event
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    mouseMoveEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * Fires when user moves mouse on any area of the chart.
+     * @param event Event that triggered the mouse leave
+     * @param chartContext
+     * @param config New config
+     * @param element DOM Element
+     */
+    mouseLeaveEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * Fires when user moves mouse on any area of the chart.
+     * @param chartContext
+     * @param seriesIndex
+     * @param config
+     * @param element DOM Element
+     */
+    legendClickEvent(chartContext?: any, seriesIndex?: any, config?: any): void;
+    /**
+     * Fires when user moves mouse on any area of the chart.
+     * @param event Event that triggered the marker click
+     * @param chartContext
+     * @param option New config
+     * @param element DOM Element
+     */
+    markerClickEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * Fires when user selects rect using the selection tool.
+     * The second argument
+     * @param chartContext
+     * @param config contains the yaxis and xaxis coordinates where user made the selection
+     * @param element DOM Element
+     */
+    selectionEvent(chartContext?: any, config?: any): void;
+    /**
+     * Fires when user clicks on a datapoint (bar/column/marker/bubble/donut-slice).
+     * @param event Event that triggered when user clicks on a datapoint
+     * @param chartContext
+     * @param config The config object, also includes additional information like
+     * which dataPointIndex was selected of which series.
+     * @param element DOM Element
+     */
+    dataPointSelectionEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * Fires when user clicks on a datapoint (bar/column/marker/bubble/donut-slice).
+     * @param event Event that triggered when user’s mouse enter on a datapoint
+     * @param chartContext
+     * @param config The config object, also includes additional information like
+     * which dataPointIndex was hovered of particular series.
+     * @param element DOM Element
+     */
+    dataPointMouseEnterEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * MouseLeave event for a datapoint (bar/column/marker/bubble/donut-slice).
+     * @param event Event that triggered the beforeSlide event
+     * @param chartContext
+     * @param config
+     * @param element DOM Element
+     */
+    dataPointMouseLeaveEvent(event?: Event, chartContext?: any, config?: any): void;
+    /**
+     * This function, if defined, runs just before zooming in/out of the chart
+     * allowing you to set a custom range for zooming in/out.
+     * @param chartContext
+     * @param config { min: timestamp, max: timestamp }
+     * @param element DOM Element
+     */
+    beforeZoomEvent(chartContext?: any, config?: any): void;
+    /**
+     * This function, if defined, runs just before the user hits the HOME button
+     * on the toolbar to reset the chart to it’s original state. The function
+     * allows you to set a custom axes range for the initial view of the chart.
+     * @param chartContext
+     * @param config { min: timestamp, max: timestamp }
+     * @param element DOM Element
+     */
+    beforeResetZoomEvent(chartContext?: any, config?: any): void;
+    /**
+     * Fires when user zooms in/out the chart using either the selection zooming
+     * tool or zoom in/out buttons.
+     * The 2nd argument includes information of the new xaxis/yaxis generated after zooming.
+     * @param chartContext
+     * @param config { min: timestamp, max: timestamp }
+     * @param element DOM Element
+     */
+    zoomedEvent(chartContext?: any, config?: any): void;
+    /**
+     * Fires when user scrolls using the pan tool.
+     * The 2nd argument includes information of the new xaxis generated after scrolling.
+     * @param chartContext
+     * @param config { xaxis: any  }
+     * @param element DOM Element
+     */
+    scrolledEvent(chartContext?: any, config?: any): void;
+    /**
+     * Fires when user drags the brush in a brush chart.
+     * The 2nd argument includes information of the new axes generated after
+     * scrolling the brush.
+     * @param chartContext
+     * @param config { xaxis: any, yaxis: any  }
+     * @param element DOM Element
+     */
+    brushScrolledEvent(chartContext?: any, config?: any): void;
     updateToolbarIcons(): any;
 }

package/types/components/zd-apex-chart/interfaces.d.ts

@@ -1,7 +1,38 @@
-import { IEventParam } from '@zeedhi/core';
-import { IComponentRender } from '../zd-component/interfaces';
+import { IEventParam, IEvent } from '@zeedhi/core';
+import { IComponentEvents, IComponentRender } from '../zd-component/interfaces';
 import { ApexChart } from './apex-chart';
-export declare type IApexChartEvent = IEventParam<ApexChart>;
+export declare type ApexChartOption = {
+    xaxis?: any;
+    yaxis?: any;
+    seriesIndex?: any;
+    config?: any;
+    dataPointIndex?: any;
+};
+export interface IApexChartEvent extends IEventParam<ApexChart> {
+    chartContext: any;
+    config?: ApexChartOption;
+    seriesIndex?: any;
+}
+export interface IApexChartEvents<T = IApexChartEvent | IEventParam<any>> extends IComponentEvents<T> {
+    chartAnimationEnd?: IEvent<T> | string;
+    chartBeforeMount?: IEvent<T> | string;
+    chartMounted?: IEvent<T> | string;
+    chartUpdated?: IEvent<T> | string;
+    chartMouseMove?: IEvent<T> | string;
+    chartMouseLeave?: IEvent<T> | string;
+    chartClick?: IEvent<T> | string;
+    chartLegendClick?: IEvent<T> | string;
+    chartMarkerClick?: IEvent<T> | string;
+    chartSelection?: IEvent<T> | string;
+    chartDataPointSelection?: IEvent<T> | string;
+    chartDataPointMouseEnter?: IEvent<T> | string;
+    chartDataPointMouseLeave?: IEvent<T> | string;
+    chartBeforeZoom?: IEvent<T> | string;
+    chartBeforeResetZoom?: IEvent<T> | string;
+    chartZoomed?: IEvent<T> | string;
+    chartScrolled?: IEvent<T> | string;
+    chartBrushScrolled?: IEvent<T> | string;
+}
 export interface IApexChart extends IComponentRender {
     chartType?: string;
     series?: any[] | string;
@@ -11,4 +42,5 @@ export interface IApexChart extends IComponentRender {
     loading?: boolean;
     loadOpacity?: number;
     loadColor?: string;
+    events?: IApexChartEvents;
 }

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

@@ -40,6 +40,16 @@ export declare class Carousel extends ComponentRender implements ICarousel {
      * '30em', '400', 400. Values without measurement unit will be notated in pixels by default
      */
     height: number | string;
+    /**
+     * Sets the carousel max height. Example values: 'auto', '100%', '400px',
+     * '30em', '400', 400. Values without measurement unit will be notated in pixels by default
+     */
+    maxHeight: number | string;
+    /**
+     * Sets the carousel min height. Example values: 'auto', '100%', '400px',
+     * '30em', '400', 400. Values without measurement unit will be notated in pixels by default
+     */
+    minHeight: number | string;
     /**
      * Configures the carousel as infinite (the slide after the last one is the first slide, and vice-versa)
      */

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

@@ -19,6 +19,8 @@ export interface ICarousel extends IComponentRender {
     center?: boolean;
     currentSlide?: number;
     height?: number | string;
+    maxHeight?: number | string;
+    minHeight?: number | string;
     infiniteScroll?: boolean;
     initialSlide?: number;
     interval?: number;

package/types/components/zd-code-editor/code-editor.d.ts

@@ -11,7 +11,11 @@ export declare class CodeEditor extends ComponentRender implements ICodeEditor {
     /**
      * Max height in pixels. 'none' means no limit.
      */
-    maxHeight: string;
+    maxHeight: number | string;
+    /**
+     * Max height in pixels. 'none' means no limit.
+     */
+    height: number | string;
     /**
      * Language code to be used for highlight (js|javascript, css, html, json, ts|typescript, bash|shell)
      * Other languages must be imported above

package/types/components/zd-code-editor/interfaces.d.ts

@@ -3,6 +3,7 @@ export interface ICodeEditor extends IComponentRender {
     staticCode?: object | string | string[];
     language?: string;
     showLineNumbers?: boolean | string;
-    maxHeight?: string;
+    maxHeight?: string | number;
+    height?: string | number;
     copyIcon?: string;
 }

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

@@ -8,6 +8,18 @@ export declare class Container extends ComponentRender implements IContainer {
      * Adds height 100% to container.
      */
     fillHeight: boolean;
+    /**
+     * Sets the height for the component.
+     */
+    height: number | string;
+    /**
+     * Sets the maximum height for the component.
+     */
+    maxHeight: number | string;
+    /**
+     * Sets the minimum height for the component.
+     */
+    minHeight: number | string;
     /**
      * Removes viewport maximum-width size breakpoints.
      */

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

@@ -2,4 +2,7 @@ import { IComponentRender } from '../zd-component/interfaces';
 export interface IContainer extends IComponentRender {
     fillHeight?: boolean;
     fluid?: boolean;
+    height?: number | string;
+    maxHeight?: number | string;
+    minHeight?: number | string;
 }

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

@@ -29,12 +29,22 @@ export declare class Dialog extends Component implements IDialog {
      * Dialog type (normal, success, error, warning, info)
      */
     type: string;
+    /**
+     * Confirm button component name
+     */
+    confirmButton?: string;
+    /**
+     * Deny button component name
+     */
+    denyButton?: string;
     /**
      * Default dialog buttons
      * @private
      */
     private defaultButtons;
     protected defaultValues: {
+        confirmButton: string | undefined;
+        denyButton: string | undefined;
         name: string;
         maxWidth: string | number;
         persistent: boolean;
@@ -52,6 +62,7 @@ export declare class Dialog extends Component implements IDialog {
      * @param dialog Dialog structure
      */
     assignDialogProperties(dialog: IDialog): void;
+    protected clickDefaultButtonKeyMapping: any;
     /**
      * Displays dialog
      */

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

@@ -4,6 +4,8 @@ export interface IDialog extends IComponent {
     buttons?: IButton[];
     maxWidth?: string | number;
     persistent?: boolean;
+    confirmButton?: string;
+    denyButton?: string;
     text?: string;
     title?: string;
     type?: string;

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

@@ -37,6 +37,10 @@ export declare class Dropdown extends ComponentRender implements IDropdown {
      * Applies position fixed to the dropdown.
      */
     fixed: boolean;
+    /**
+     * Sets the height for the dropdown.
+     */
+    height?: number | string;
     /**
      * Sets the maximum height for the dropdown.
      */

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

@@ -11,6 +11,7 @@ export interface IDropdown extends IComponentRender {
     cursor?: string;
     fixed?: boolean;
     hover?: boolean;
+    height?: number | string;
     maxHeight?: number | string;
     maxWidth?: number | string;
     minHeight?: number | string;

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

@@ -20,6 +20,10 @@ export declare class Form extends ComponentRender implements IForm {
      * Available options are start, center, end, space-between and space-around.
      */
     justify?: string;
+    /**
+     * Sets the height for the form.
+     */
+    height?: number | string;
     /**
      * Defines form events.
      */

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

@@ -22,6 +22,7 @@ export interface IFormComponent extends IComponentRender {
 export interface IForm extends IComponentRender {
     align?: string;
     justify?: string;
+    height?: number | string;
     children?: IFormComponent[];
     events?: IFormEvents;
 }

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

@@ -12,6 +12,9 @@ export declare class Frame extends ComponentRender implements IFrame {
     cache: boolean;
     events: IFrameEvents;
     cacheDuration: number;
+    height: number | string;
+    maxHeight: number | string;
+    minHeight: number | string;
     private readonly headerName;
     private static readonly cacheName;
     /**

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

@@ -11,4 +11,7 @@ export interface IFrame extends IComponentRender {
     override?: Object;
     cache?: boolean;
     cacheDuration?: number;
+    height?: number | string;
+    maxHeight?: number | string;
+    minHeight?: number | string;
 }

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

@@ -23,12 +23,20 @@ export declare class GridEditable extends Grid implements IGridEditable {
      * @private
      */
     private editedRows;
+    /**
+     * Rows with newRowIdentifier
+     * @private
+     */
+    private addedRows;
     /**
      * Invalid inline components
      * @private
      */
     private invalidComponents;
+    protected cancelEditedRowsKeyMapping: any;
     constructor(props: IGridEditable);
+    onMounted(element: HTMLElement): void;
+    onBeforeDestroy(): void;
     /**
      * Get Grid columns objects
      * @param columns Grid columns parameter
@@ -112,11 +120,13 @@ export declare class GridEditable extends Grid implements IGridEditable {
      * Cancels all edited rows and enable grid components
      */
     cancelEditedRows(): Promise<void>;
+    private removeAddedRows;
+    private addDataRow;
     /**
      * Saves all edited rows if they are valid
      * @throws Will throw when it finds an invalid row
      */
-    saveEditedRows(): Promise<any[]>;
+    saveEditedRows(): Promise<void[]>;
     /**
      * Retrieves all edited rows if they are valid
      * @throws Will throw when it finds an invalid row

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

@@ -16,6 +16,8 @@ export declare class Column extends Component implements IColumn {
     componentProps: any;
     /** column style property */
     style: IDictionary;
+    /** Type of XLS */
+    xlsType: string;
     protected lookupDatasource?: Datasource;
     lookupData: any;
     lookupDataCount: number;

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

@@ -22,6 +22,7 @@ export interface IColumn extends IComponent {
     conditions?: IDictionary;
     style?: IDictionary;
     events?: IIterableEvents;
+    xlsType?: string;
 }
 export interface IIterable extends IComponentRender {
     columns?: IColumn[];

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

@@ -12,6 +12,9 @@ export interface IList extends IComponentRender {
     color?: string;
     elevation?: number | string;
     expand?: boolean;
+    height?: number | string;
+    maxHeight?: number | string;
+    minHeight?: number | string;
 }
 /**
  * Interface for list itens

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

@@ -41,6 +41,18 @@ export declare class List extends ComponentRender implements IList {
      * Will only collapse when explicitly closed.
      */
     expand: boolean;
+    /**
+     * Sets the height for the component.
+     */
+    height: number | string;
+    /**
+     * Sets the maxHeight for the component.
+     */
+    maxHeight: number | string;
+    /**
+     * Sets the minHeight for the component.
+     */
+    minHeight: number | string;
     constructor(props: IList);
     /**
      * Get item by name

package/types/components/zd-menu/menu-group.d.ts

@@ -50,4 +50,12 @@ export declare class MenuGroup extends ComponentRender implements IMenuGroup {
      * Close group
      */
     close(): void;
+    /**
+     * Event triggered when this item is clicked
+     */
+    click(event: Event): void;
+    /**
+     * Event triggered when this item is focus
+     */
+    focus(event: Event): void;
 }

package/types/components/zd-menu/menu-link.d.ts

@@ -39,6 +39,10 @@ export declare class MenuLink extends ComponentRender implements IMenuLink {
      * Event triggered when this item is clicked
      */
     click(event: Event): void;
+    /**
+     * Event triggered when this item is focus
+     */
+    focus(): void;
     /**
      * @returns item is selected or not
      */

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

@@ -111,6 +111,8 @@ export declare class Menu extends ComponentRender implements IMenu {
     private filteredMenuItems;
     /** Search value */
     private searchValue;
+    /** Store the current item focused */
+    currentItem: IMenuItem | null;
     /**
      * Creates a new Menu.
      * @param props Menu properties

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

@@ -18,6 +18,8 @@ export interface IModal extends IComponent {
     fullscreen?: boolean;
     grid?: IModalGrid;
     persistent?: boolean;
+    draggable?: boolean;
+    dragHandle?: string;
 }
 export interface IModalCloseButton extends IButton {
     modalName: string;

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

@@ -17,6 +17,14 @@ export declare class Modal extends Component implements IModal {
      * If true the modal won't close when overlay is clicked
      */
     persistent: boolean;
+    /**
+     * Allows modal to be dragged around in the screen
+     */
+    draggable: boolean;
+    /**
+     * Css selector of the drag handle
+     */
+    dragHandle?: string;
     /**
      * Creates a new modal
      * @param props Modal structure

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

@@ -12,6 +12,7 @@ export interface ISelectTreeMultiple extends ISelectTree {
     flat?: boolean;
     limit?: number;
     events?: ISelectTreeMultipleEvents;
+    valueConsistsOf?: string;
 }
 export interface ISelectTreeMultipleSelectedNodesEvent extends IEventParam<SelectTreeMultiple> {
     selectedNodes: ISelectTreeMultipleNode<IDictionary>[];

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

@@ -22,6 +22,10 @@ export declare class SelectTreeMultiple extends SelectTree implements ISelectTre
      */
     selectedNodes: ISelectTreeMultipleNode<IDictionary>[];
     selectValue: any[];
+    /**
+     * Changes the behavior of checked nodes that will be displayed in the array of values
+     */
+    valueConsistsOf: string;
     /**
      * Creates a new instance of Select Tree Multiple
      * @param props

package/types/components/zd-selectable-list/interfaces.d.ts

@@ -4,4 +4,5 @@ export interface ISelectableList extends IList {
     mandatory?: boolean;
     max?: number;
     multiple?: boolean;
+    value?: any;
 }

package/types/components/zd-selectable-list/selectable-list.d.ts

@@ -16,14 +16,14 @@ export declare class SelectableList extends List implements ISelectableList {
      * Defines the maximum number of elements the list has
      */
     max?: number;
-    /**
-     * Defines the maximum number of elements the list has
-     */
-    value?: string;
     /**
      * Defines how many elements of the list can be selected at the same time
      */
     multiple?: boolean;
+    /**
+     * Sets the active list-item inside the list-group
+     */
+    value?: any;
     constructor(props: ISelectableList);
     change(event?: Event, element?: HTMLElement): void;
 }

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

@@ -17,4 +17,5 @@ export interface ITab extends IComponent {
 export interface ITabs extends IComponentRender {
     activeTab?: number;
     tabs?: ITab[];
+    height?: number | string;
 }

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

@@ -8,6 +8,10 @@ export declare class Tabs extends ComponentRender implements ITabs {
     activeTab: number;
     events: ITabsEvents;
     tabs: Tab[];
+    /**
+     * Sets the height for Tabs.
+     */
+    height?: number | string;
     /**
      * Create a new Tabs.
      * @param props Tabs properties
@@ -15,6 +19,16 @@ export declare class Tabs extends ComponentRender implements ITabs {
     constructor(props: ITabs);
     private getTabs;
     getTab(name: string): Tab;
+    /**
+     * Method for navigating to the next tab
+     * @param loop Defines if want a loop navigation
+     */
+    nextTab(loop?: boolean): void;
+    /**
+     * Method for navigating to the previous tab
+     * @param loop Defines if want a loop navigation
+     */
+    previousTab(loop?: boolean): void;
     /**
      * Triggered before tab is change.
      * @param event DOM event