@zeedhi/teknisa-components-common 1.87.1 → 1.89.0

package/tests/unit/components/tree-grid/tree-grid.spec.ts

@@ -5,15 +5,16 @@ import {
   Http, IDictionary, KeyMap, Metadata,
 } from '@zeedhi/core';
 import {
-  ITekTreeGrid, TekGridColumn, TekRestDatasource, TekTreeGrid,
+  ITekGridFilterButton,
+  ITekTreeGrid, TekGridColumn, TekGridFilterButton, TekRestDatasource, TekTreeGrid,
 } from '../../../../src';
 import { getChild, setClick } from '../../../__helpers__';
 
 const flushPromises = () => new Promise(setImmediate);
 
 const clickOnFilterButton = (grid: TekTreeGrid, event?: any) => {
-  const buttonProps = getChild<IButton>(grid.toolbarSlot, `${grid.name}_filterButton`);
-  const button = new Button(buttonProps);
+  const buttonProps = getChild<ITekGridFilterButton>(grid.toolbarSlot, `${grid.name}_filterButton`);
+  const button = new TekGridFilterButton(buttonProps);
   setClick(button, event);
 
   return button;
@@ -138,9 +139,10 @@ describe('TekTreeGrid', () => {
 
       const method = jest.fn();
 
-      const spyMetadata = jest.spyOn(Metadata, 'getInstance').mockImplementation(() => new Button({
+      const spyMetadata = jest.spyOn(Metadata, 'getInstance').mockImplementation(() => new TekGridFilterButton({
         name: 'grid_navigation_2_filterButton',
-        component: 'ZdButton',
+        component: 'TekGridFilterButton',
+        grid: instance,
         events: {
           click: method,
         },
@@ -281,8 +283,8 @@ describe('TekTreeGrid', () => {
 
       instance.onCreated();
 
-      const buttonProps = getChild<IButton>(instance.toolbarSlot, `${instance.name}_filterButton`);
-      const button = new Button(buttonProps);
+      const buttonProps = getChild<ITekGridFilterButton>(instance.toolbarSlot, `${instance.name}_filterButton`);
+      const button = new TekGridFilterButton(buttonProps);
       setClick(button);
 
       const formObject = new Form(form);
@@ -702,7 +704,9 @@ describe('TekTreeGrid', () => {
 
       const spy = mockMetadata(instance);
       instance.onCreated();
-      clickOnFilterButton(instance);
+
+      const filterButton = clickOnFilterButton(instance);
+      filterButton.onCreated();
 
       const inputs = instance.getFilterInputs();
       expect(inputs[0].name).toBe('grid-filter-AND-CONTAINS-name-0');
@@ -749,7 +753,9 @@ describe('TekTreeGrid', () => {
 
       const spy = mockMetadata(instance);
       instance.onCreated();
-      clickOnFilterButton(instance);
+
+      const filterButton = clickOnFilterButton(instance);
+      filterButton.onCreated();
 
       const inputs = instance.getFilterInputs('salary');
       expect(inputs[0].name).toBe('grid-filter-AND-GREATER_THAN_EQUALS-salary-0');

package/types/components/index.d.ts

@@ -25,6 +25,7 @@ export * from './tek-grid/interfaces';
 export * from './tek-grid/grid';
 export * from './tek-grid/grid-column';
 export * from './tek-grid/grid-columns-button';
+export * from './tek-grid/grid-filter-button';
 export * from './tek-grid/layout-options';
 export * from './tek-grid/filter-helper';
 export * from './tek-datasource/interfaces';
@@ -35,3 +36,5 @@ export * from './tek-tree-grid/tree-grid';
 export * from './tek-user-info/interfaces';
 export * from './tek-user-info/tek-user-info';
 export * from './tek-user-info/tek-user-info-list';
+export * from './tek-drag-grid/interfaces';
+export * from './tek-drag-grid/tek-drag-grid';

package/types/components/tek-drag-grid/interfaces.d.ts

@@ -0,0 +1,7 @@
+import { IDragGridEvents } from '@zeedhi/zd-drag-grid-common';
+import { ITekGrid } from '../tek-grid/interfaces';
+export interface ITekDragGrid extends ITekGrid {
+    orderColumnName: string;
+    orderMode?: 'asc' | 'desc';
+    events?: IDragGridEvents;
+}

package/types/components/tek-drag-grid/tek-drag-grid.d.ts

@@ -0,0 +1,36 @@
+import { IDraggable } from '@zeedhi/zd-drag-grid-common';
+import { IDictionary } from '@zeedhi/core';
+import { TekGrid } from '../tek-grid/grid';
+import { ITekDragGrid } from './interfaces';
+export declare class TekDragGrid extends TekGrid implements ITekDragGrid {
+    private internalOrderColumnName;
+    private internalOrderMode;
+    protected draggable: IDraggable;
+    constructor(props: ITekDragGrid);
+    set orderColumnName(value: string);
+    get orderColumnName(): string;
+    set orderMode(value: 'asc' | 'desc');
+    get orderMode(): 'asc' | 'desc';
+    /**
+     * Event triggered when dragged element is moving
+     * @param event DOM event
+     * @param row row being dragged
+     * @param element HTML element
+     * @returns return false to cancel dragging
+     */
+    onDragMove(event: Event, row: IDictionary, element: HTMLElement): boolean;
+    /**
+     * Event triggered when drag starts
+     * @param event DOM event
+     * @param row row being dragged
+     * @param element HTML element
+     */
+    onDragStart(event: Event, row: IDictionary, element: HTMLElement): boolean;
+    /**
+     * Event triggered when drag ends
+     * @param event DOM event
+     * @param row row being dragged
+     * @param element HTML element
+     */
+    onDragEnd(event: Event, row: IDictionary, element: HTMLElement): void;
+}

package/types/components/tek-grid/grid-filter-button.d.ts

@@ -0,0 +1,29 @@
+import { Button, Input } from '@zeedhi/common';
+import { IDictionary } from '@zeedhi/core';
+import { ITekGridFilterButton } from './interfaces';
+import { TekGrid } from './grid';
+import { TekTreeGrid } from '../tek-tree-grid/tree-grid';
+/**
+ * Base class for TekGrid Filter Button component
+ */
+export declare class TekGridFilterButton extends Button implements ITekGridFilterButton {
+    gridName?: string;
+    grid: TekGrid | TekTreeGrid;
+    private filterModal?;
+    protected filterFormInputs: IDictionary<string[]>;
+    constructor(props: ITekGridFilterButton);
+    loadGrid(gridName?: string): void;
+    click(event: Event): void;
+    private loadFilterValues;
+    hideFilterModal(): void;
+    destroyFilterModal(): void;
+    private createFilterFromColumns;
+    onBeforeDestroy(): void;
+    private applyFilter;
+    private setFilter;
+    private clearFilter;
+    private sortFilterIndex;
+    getFilterInputs(columnName?: string): Input[];
+    private getFilterModalComponents;
+    private changeHelperEvent;
+}

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

@@ -1,6 +1,6 @@
-import { IBeforeReportEvent, IComponent, IComponentEvents, IComponentRender, IGridColumnEditable, IGridEditable, IIterableColumnsButton, EventDef, IModal } from '@zeedhi/common';
+import { IBeforeReportEvent, IComponent, IComponentEvents, IComponentRender, IGridColumnEditable, IGridEditable, IIterableColumnsButton, EventDef, IModal, IButton } from '@zeedhi/common';
 import { IDictionary, IEvent, IEventParam, IDateHelperValue, IDateHelperValues } from '@zeedhi/core';
-import { IDynamicFilterItem, TekGridLayoutOptions } from '..';
+import { IDynamicFilterItem, TekGrid, TekGridLayoutOptions, TekTreeGrid } from '..';
 export interface ITekGridLayoutEventParams extends IEventParam<ITekGrid> {
     layouts: ITekGridLayoutInfo;
 }
@@ -112,6 +112,10 @@ export interface ITekGridColumn extends IGridColumnEditable {
 export interface ITekGridColumnsButton extends IIterableColumnsButton {
     hideGroups?: boolean;
 }
+export interface ITekGridFilterButton extends IButton {
+    gridName?: string;
+    grid?: TekGrid | TekTreeGrid;
+}
 export interface ITekGridGroup {
     column: ITekGridColumn;
     name: string;

package/types/utils/grid-base/grid-base.d.ts

@@ -1,6 +1,6 @@
-import { IButton, Input } from '@zeedhi/common';
-import { IDictionary, IEventParam } from '@zeedhi/core';
-import { TekGrid, TekTreeGrid } from '../../components';
+import { IButton } from '@zeedhi/common';
+import { IEventParam } from '@zeedhi/core';
+import { TekGrid, TekGridFilterButton, TekTreeGrid } from '../../components';
 export interface ITekGridAtoms {
     TITLE: string;
     ADD_BUTTON: string;
@@ -224,11 +224,11 @@ export declare class GridBase {
         children: {
             name: string;
             component: string;
-            icon: boolean;
-            iconName: string;
+            grid: TekGrid | TekTreeGrid;
+            gridName: string;
             isVisible: string;
             events: {
-                click: ({ event }: any) => void;
+                onCreated: ({ component }: IEventParam<TekGridFilterButton>) => void;
             };
         }[];
         cssClass?: undefined;
@@ -241,23 +241,14 @@ export declare class GridBase {
         events?: undefined;
         outline?: undefined;
     })[];
+    filterButton?: TekGridFilterButton;
+    private loadFilterButton;
     private addButtonClick;
     private deleteButtonClick;
     private reloadGrid;
     private saveChanges;
     private cancelChanges;
-    filterClick({ event }: any): void;
-    private filterModal?;
-    destroyFilterModal(): void;
-    private createFilterFromColumns;
     hideFilterModal(): void;
-    private sortFilterIndex;
-    private getFilterModalComponents;
-    private changeHelperEvent;
-    private loadFilterValues;
-    private applyFilter;
-    private setFilter;
-    private clearFilter;
     getFilterRelationsDatasource(): any;
     getFilterOperationsDatasource(): any;
     getFilterOptionsData(prop: string): {
@@ -265,8 +256,7 @@ export declare class GridBase {
         value: string;
     }[];
     setSearch(search: string): Promise<any>;
-    protected filterFormInputs: IDictionary<string[]>;
     protected atoms: ITekGridAtoms;
     getAtomInstance<T>(key: keyof ITekGridAtoms): T;
-    getFilterInputs(columnName?: string): Input[];
+    getFilterInputs(columnName?: string): import("@zeedhi/common").Input[];
 }