cats-data-grid 1.0.1 → 2.0.0

package/index.d.ts

@@ -1,5 +1,421 @@
-/**
- * Generated bundle index. Do not edit.
- */
-/// <amd-module name="cats-data-grid" />
-export * from './public-api';
+import * as i0 from '@angular/core';
+import { OnChanges, OnInit, EventEmitter, ChangeDetectorRef, SimpleChanges } from '@angular/core';
+
+declare class CatsDataGridService {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<CatsDataGridService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<CatsDataGridService>;
+}
+
+interface DateConfig {
+    selectionMode: 'single' | 'range';
+    enableTime?: boolean;
+}
+
+declare class CatsDataGridComponent implements OnChanges, OnInit {
+    private cd;
+    tableOptions: any;
+    totalRecords: number;
+    sortingRequired: boolean;
+    checkBoxSelection: boolean;
+    checkboxSelectionType: string;
+    rowData: any[];
+    colDefs: any[];
+    paginationRequired: boolean;
+    selectedRowEmpty: boolean;
+    filterRequired: boolean;
+    threeDotsMenuRequired: boolean;
+    showDropdown: boolean;
+    height: number;
+    groupByRequired: boolean;
+    onPaginationChange: EventEmitter<any>;
+    onCheckboxSelection: EventEmitter<any>;
+    onScrollEmitter: EventEmitter<any>;
+    filter: EventEmitter<any>;
+    activeFilterIndex: number | null;
+    originalRowData: any[];
+    pageDetails: any;
+    recordsToShow: any;
+    sortingColumnIndex: number;
+    sortingType: any;
+    selectedRow: any[];
+    pageSizeList: number[];
+    showPageSizeList: boolean;
+    dragOverIndex: null | number;
+    draggedIndex: null | number;
+    originalColDefs: any[];
+    filteredRowData: any[];
+    filteredData: any[];
+    currentColumn: any;
+    currentIndex: number;
+    menuVisible: boolean[];
+    menuPosition: any[];
+    activeFilters: Set<any>;
+    resizingColumnIndex: number | null;
+    startX: number;
+    startWidth: number;
+    isResizing: boolean;
+    groupedResult: any[];
+    showMoveIcon: any;
+    columnDraggable: any[];
+    activeGroups: any[];
+    groupBy: string[];
+    dragGroupIndex: number | null;
+    dateConfig: DateConfig;
+    filterOptions: {
+        label: string;
+        value: string;
+    }[];
+    numberFilterOptions: {
+        label: string;
+        value: string;
+    }[];
+    showPin: boolean;
+    pinActionClicked: any;
+    constructor(cd: ChangeDetectorRef);
+    ngOnInit(): void;
+    ngOnChanges(changes: SimpleChanges): void;
+    /**
+     * @description Prepares and normalizes column definitions for filtering and menu behavior
+     * @author Anand Pandey
+     * @param {any[]} colDefs - Raw column definitions received from the parent.
+     * @returns {any[]} - Updated column definitions with filter/menu
+     */
+    getUpdatedColDefs(colDefs: any[]): any[];
+    normalizeSetFilterType(value: any, key: string): any[] | undefined;
+    /**
+     * @description - Evaluates a text-based filter condition on a given field value.
+     * @author Anand Pandey
+     * @param {string} type - The type of text filter to apply ('contains' | 'doesNotContain' | 'equals' etc).
+     * @param {string} fieldValue - The actual value from the data row being evaluated.
+     * @param {string} value - The user-entered filter value to compare against.
+     * @returns {boolean} `true` if the fieldValue satisfies the specified filter condition,
+     *                    otherwise `false`.
+     */
+    evaluateTextFilterCondition(type: string, fieldValue: string, value: string): boolean;
+    /**
+     * @description - Evaluates number/date filter conditions.
+     * @author Anand
+     * @param {string} type - Comparison operator ('=' | '>' | '<' | '>=' | '<=').
+     * @param {number|string} fieldValue - Actual value from the row (number or timestamp).
+     * @param {number|string} value - User-entered value for comparison.
+     * @returns {boolean} True if the condition matches, otherwise false.
+     */
+    evaluateNumDateFilterCondition(type: string, fieldValue: number | string, value: number | string): boolean;
+    /**
+     * @description Method to filter data according to filterType and comparator selection
+     * @author Anand Pandey
+     * @param {}
+     * @returns void
+     */
+    applyAllFilters(): void;
+    resetFilter(col: any): void;
+    /**
+     * @description Method to change the data format to utc
+     * @author Anand Pandey
+     * @param {date} - date value to be changed
+     * @returns date in milliseconds
+     */
+    normalizeDate(dateStr: string): number | null;
+    /**
+     * @description
+     * Filters the available set options inside a Set Filter (checkbox filter)
+     * based on the user's search text. This updates only the list shown in
+     * the dropdown
+     * @author Anand Pandey
+     * @param col - Column definition object containing filter config
+     * @param event - Input event from the search textbox
+     * @returns void
+     */
+    filterSetOptions(col: any, event: any): void;
+    /**
+     * @description
+     * Toggles an individual checkbox option inside a Set Filter.   *
+     * @author Anand Pandey
+     * @param col - Column definition object
+     * @param opt - Selected option value
+     * @param event - Checkbox change event
+     * @returns void
+     */
+    toggleSetOption(col: any, opt: any, event: any): void;
+    /**
+     * @description  * Selects or deselects all checkbox options in the Set Filter.
+     * @author Anand Pandey
+     * @param col - Column definition object
+     * @param event - Checkbox change event
+     * @returns void
+     */
+    toggleSelectAll(col: any, event: any): void;
+    /**
+     * @description
+     * Checks whether all options inside a Set Filter are currently selected.
+     * @author Anand Pandey
+     * @param col - Column definition object
+     * @returns boolean - TRUE if all options are selected, otherwise FALSE.
+     */
+    isAllSelected(col: any): boolean;
+    /**
+     * @description
+     * Opens the three-dots column menu for the selected column.
+     * Opens only the menu belonging to the clicked column index
+     * @author Anand Pandey
+     * @param {MouseEvent} event - The click event triggered on the three-dots icon.
+     * @param {any} col - The column definition object for which menu is opened.
+     * @param {number} index - Index of the column whose menu has been requested.
+     * @returns {void}
+     */
+    openMenu(event: MouseEvent, col: any, index: number): void;
+    /**
+     * @description Sort from three dots menu pop up.
+     * @author Anand Pandey
+     * @param {fieldName} string - fieldname.
+     * @param {string} type - Type defines the sorting type whether this is ascending, descending.
+     * @returns {void}
+     */
+    onSort(col: any, type: string, sortingColumIndex: number): void;
+    /**
+     * @description Generates grouped data based on the selected `groupBy` columns..
+     * @author Anand Pandey
+     * @returns void
+     */
+    getGroupedData(): void;
+    /**
+     * @description Initializes column resize operation when the user presses the mouse on the resize handle.
+     * @author Anand Pandey
+     * @param {MouseEvent} event - The mousedown event triggered on the resize handle.
+     * @param {number} index - Index of the column being resized.
+     * @returns {void}
+     */
+    startResize(event: MouseEvent, index: number): void;
+    /**
+     * @description Handles column resizing as the mouse moves.
+     * @author Anand Pandey
+     * @param {MouseEvent} event - Mouse movement event during resizing.
+     * @returns {void}
+     */
+    onMouseMove: (event: MouseEvent) => void;
+    /**
+     * @description Stops the column resizing operation.
+     * Clears resizing state and removes mouse event listeners.
+     * @author Anand Pandey
+     * @param {MouseEvent} event - Mouse up event ending the resize action.
+     * @returns {void}
+     */
+    stopResize: (event: MouseEvent) => void;
+    /**
+     * @description Recursively groups row data into a hierarchical structure based on the provided group keys.
+     * @author Anand Pandey
+     * @param {any[]} data - The row data to be grouped.
+     * @param {string[]} groupKeys - Ordered list of column keys to group by.
+     * @returns {any[]} A hierarchical grouped structure containing nested group nodes.
+     */
+    groupData(data: any[], groupKeys: string[]): any;
+    /**
+     * @description Toggles the expand/collapse state of a group node.
+     * @author Anand Pandey
+     * @param {any} node - The group node whose expanded state needs to be toggled.
+     * @returns {void}
+     */
+    toggleGroup(node: any): void;
+    /**
+     * @description Pin column on the left side.
+     * @author Anand Pandey
+     * @param {any} col - The selected column details from table on clicking pin or unpin from three dots menu.
+     * @param {number} index - The index of column from table on clicking pin or unpin from three dots menu.
+     * @returns {void}
+     */
+    pinColumn(col: any, index: number, direction: string): void;
+    showPinActions(): void;
+    hidePinActions(): void;
+    /**
+     * @description Updates the horizontal left and right offsets of pinned columns by assigning cumulative widths to each pinned column and resetting non-pinned columns.
+     * @author Anand Pandey
+     * @returns void
+     */
+    updatePinnedOffsets(): void;
+    /**
+     * @description Method to parse column value from rowdata object
+     *  according to given field value in column Defination
+     * @author Tarun Kumar
+     * @param row - current row object
+     * @param toParse - field value
+     * @returns string
+     */
+    parseColValue(row: any, col: any): any;
+    /**
+     * @description method to reset table configuration
+     * @author Tarun Kumar
+     * @param none
+     * @returns void
+     */
+    resetTableConfig(): void;
+    /**
+     * @description method to set total pages count
+     * @author Tarun Kumar
+     * @param none
+     * @returns void
+     */
+    setPageCount(): void;
+    /**
+     * @description method to update table on page size change
+     * @author Tarun Kumar
+     * @param event
+     * @returns void
+     */
+    onPageSizeChanged(event: any): void;
+    /**
+     * @description method to update table on previous button click
+     * @author Tarun Kumar
+     */
+    onBtPrevClick(): void;
+    /**
+     * @description method to update table on next button click
+     * @author Tarun Kumar
+     */
+    onBtNextClick(): void;
+    /**
+     * @description method to update table on selecting any page randomly
+     * @author Tarun Kumar
+     * @param event
+     */
+    goToSelectedPage(event: any): void;
+    /**
+     * @description method to sort data according to type and column
+     * @author Tarun Kumar
+     * @param sortingColumIndex
+     * @param col
+     * @param sortingType
+     */
+    onSortingRowData(sortingColumIndex: number, col: any): void;
+    /**
+     * @description method to sort table in ascending order according to given field
+     * @param fieldName
+     */
+    ascendingOrder(col: any): void;
+    /**
+     * @description method to sort table in descending order according to given field
+     * @param fieldName
+     */
+    descendingOrder(col: any): void;
+    /**
+     * @description method to check/uncheck all rows on header checkbox selection/deselection
+     * @author Tarun Kumar
+     * @param event
+     */
+    onHeaderCheckboxChange(event: any): void;
+    /**
+     * @description method to check/uncheck row on row checkbox selection/deselection
+     * @author Tarun Kumar
+     * @param event
+     */
+    onRowCheckboxSelection(event: any): void;
+    /**
+     * @description method to check/uncheck all rows on header checkbox selection/deselection
+     * @author Tarun Kumar
+     * @param col
+     * @returns {object}
+     */
+    getStyle(col: any, type?: string): object;
+    onClickOutside(): void;
+    checkCondition(data: any): boolean;
+    infinityScroll(event: any): void;
+    checkAllSelected(): boolean;
+    checkInterminate(): boolean;
+    /**
+     * @author Tarun Kumar
+     * @description function triggered when the drag starts
+     * @param {event object, index}
+     * @returns {void}
+     */
+    onDragStart(event: DragEvent, index: number): void;
+    onGroupDragStart(event: DragEvent, index: number): void;
+    /**
+     * @author Anand Pandey
+     * @description Copies computed CSS styles from the source element to the target element, including all child elements recursively.
+     * @param {HTMLElement} source - Original element.
+     * @param {HTMLElement} target - Cloned element.
+     * @returns {void}
+     */
+    copyComputedStyles(source: HTMLElement, target: HTMLElement): void;
+    /**
+     * @author Tarun Kumar
+     * @description function to track the index of the element being dragged over and allow dropping
+     * @param {event object, index}
+     * @returns {void}
+     */
+    onDragOver(event: DragEvent, index: number): void;
+    /**
+     * @author Tarun Kumar
+     * @description function to Reorder the items on drop
+     * @param {event object, index}
+     * @returns {void}
+     */
+    onDrop(event: DragEvent, index: number): void;
+    /**
+     * @author Tarun Kumar
+     * @description function to reset dragOverIndex when the drag ends
+     * @param {none}
+     * @returns {void}
+     */
+    onDragEnd(): void;
+    /**
+     * @description Handles drag over on group panel to allow dropping.
+     * @author Anand Pandey
+     * @param {DragEvent} event
+     * @returns {void}
+     */
+    onGroupDragOver(event: DragEvent): void;
+    /**
+     * @description Handles drag over on a group tag and updates the target index for reordering.
+     * @author Anand Pandey
+     * @param {DragEvent} event
+     * @param {number} index
+     * @returns {void}
+     */
+    onActiveDragOver(event: DragEvent, index: number): void;
+    /**
+     * @description Handles drop on group panel and routes the drop to group reordering or column grouping logic.
+     * @author Anand Pandey
+     * @param {DragEvent} event
+     * @returns {void}
+     */
+    onGroupDrop(event: DragEvent): void;
+    /**
+     * @description Handles column grouping triggered from the column action menu by adding the column to the active group list,
+     * removing it from visible columns, and recalculating grouped row data.
+     *
+     * @param {any} col - The column definition selected for grouping.
+     * @param {number} index - Index of the column in the current column definitions array.
+     * @returns {void}
+     */
+    groupByColumnAction(col: any, index: number): void;
+    /**
+     * @description Handles drop on a group tag and reorders the active groups accordingly.
+     * @author Anand Pandey
+     * @param {DragEvent} event
+     * @param {number} index
+     * @returns {void}
+     */
+    onActiveGroupDrop(event: DragEvent, index: number): void;
+    /**
+     * @description Removes a group tag and restores the column to available columns list.
+     * @author Anand Pandey
+     * @param {any} col
+     * @param {number} id
+     * @returns {void}
+     */
+    removeGroup(col: any, id: number): void;
+    toggleDropdown(): void;
+    selectFilter(option: any, col: any): void;
+    getSelectedFilterLabel(value: string): string;
+    toggleFilter(col: any, index: number, event: MouseEvent): void;
+    onMouseEnterHeader(index: number): void;
+    onMouseLeaveHeader(index: number): void;
+    enableColumnDrag(event: MouseEvent, index: number): void;
+    disableColumnDrag(event: MouseEvent, index: number): void;
+    dateTimeSelected(date: any): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<CatsDataGridComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<CatsDataGridComponent, "cats-data-grid", never, { "tableOptions": { "alias": "tableOptions"; "required": false; }; "totalRecords": { "alias": "totalRecords"; "required": false; }; "sortingRequired": { "alias": "sortingRequired"; "required": false; }; "checkBoxSelection": { "alias": "checkBoxSelection"; "required": false; }; "checkboxSelectionType": { "alias": "checkboxSelectionType"; "required": false; }; "rowData": { "alias": "rowData"; "required": false; }; "colDefs": { "alias": "colDefs"; "required": false; }; "paginationRequired": { "alias": "paginationRequired"; "required": false; }; "selectedRowEmpty": { "alias": "selectedRowEmpty"; "required": false; }; "filterRequired": { "alias": "filterRequired"; "required": false; }; "threeDotsMenuRequired": { "alias": "threeDotsMenuRequired"; "required": false; }; "height": { "alias": "height"; "required": false; }; "groupByRequired": { "alias": "groupByRequired"; "required": false; }; "pageSizeList": { "alias": "pageSizeList"; "required": false; }; }, { "onPaginationChange": "onPaginationChange"; "onCheckboxSelection": "onCheckboxSelection"; "onScrollEmitter": "onScrollEmitter"; "filter": "filter"; }, never, never, true, never>;
+}
+
+export { CatsDataGridComponent, CatsDataGridService };

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "cats-data-grid",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "peerDependencies": {
-    "@angular/common": "^19.2.0",
-    "@angular/core": "^19.2.0"
+    "@angular/common": "^20.3.15",
+    "@angular/core": "^20.3.15"
   },
   "dependencies": {
     "tslib": "^2.3.0"

package/styles/base/_reset.scss

@@ -5,7 +5,7 @@
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  font-family: "Rethink";
+  // font-family: "Open Sans", sans-serif;
 }
 
 body {