@open-dcp/grid 0.0.0-stage → 0.2.17

package/dist/services/FormattingService.js

@@ -0,0 +1,179 @@
+import { format } from 'date-fns';
+import { toZonedTime } from 'date-fns-tz';
+import { logger } from "@open-dcp/utilities";
+function formatInTimeZone(timestamp, timeZone, formatString) {
+    const date = typeof timestamp === "number" ? new Date(timestamp) : timestamp;
+    const zonedDate = toZonedTime(date, timeZone);
+    return format(zonedDate, formatString);
+}
+export class FormattingService {
+    constructor(gridService) {
+        this.gridService = gridService;
+    }
+    applyFormattingToRow(row) {
+        const columns = this.gridService.getColumns();
+        const formattedRow = Object.assign({}, row); // Clone the row to keep it immutable
+        if (columns && columns.length > 0) {
+            // Columns are ready, proceed with formatting
+            columns.forEach((column) => {
+                var _a;
+                const cellData = (_a = row[column.key]) !== null && _a !== void 0 ? _a : null;
+                const rawValue = cellData && typeof cellData === 'object' && 'raw' in cellData
+                    ? cellData.raw
+                    : cellData;
+                const value = this.formatCellValue(row, column);
+                // Store raw and value
+                formattedRow[column.key] = {
+                    raw: rawValue, // Ensure raw value stays the same
+                    value: value, // Store transformed value for sorting/filtering
+                };
+            });
+        }
+        else {
+            Object.keys(row).forEach(key => {
+                formattedRow[key] = {
+                    raw: row[key], // Use original value as raw
+                    value: null, // No transformation yet
+                };
+            });
+            //logger.warn('Columns are not available yet. Row formatting is deferred.');
+        }
+        return formattedRow;
+    }
+    formatCustomCell(cellValue, row, column) {
+        let displayValue = undefined;
+        let renderedElement = undefined;
+        if (typeof column.renderCell === 'function') {
+            try {
+                const functionReturn = column.renderCell(cellValue, row);
+                if (functionReturn instanceof HTMLAnchorElement) {
+                    renderedElement = functionReturn;
+                }
+                else if (typeof functionReturn == "string") {
+                    displayValue = functionReturn;
+                }
+            }
+            catch (error) {
+                logger.error(`Error in custom renderCell function for column ${column.key}:`, error);
+                displayValue = 'Error';
+            }
+        }
+        else {
+            logger.warn(`Custom column type requires a renderCell function.`);
+            displayValue = 'N/A';
+        }
+        return { display: displayValue, renderedElement };
+    }
+    formatDateCell(cellValue, column) {
+        const date = new Date(cellValue);
+        let dateFormatString = this.gridService.displayFormatSubject.getValue().dateFormat;
+        if (column.type === 'datetime') {
+            dateFormatString += ` ${this.gridService.displayFormatSubject.getValue().timeFormat}`;
+        }
+        return formatInTimeZone(date, this.gridService.displayFormatSubject.getValue().timeZone, dateFormatString);
+    }
+    formatCellDisplay(row, column) {
+        var _a, _b;
+        const cellValue = (_b = (_a = row[column.key]) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : null;
+        if (cellValue === null) {
+            return { display: null, renderedElement: undefined };
+        }
+        let displayValue = undefined;
+        let renderedElement = undefined;
+        if (typeof column.transformer === 'function') {
+            try {
+                const transformed = column.transformer(cellValue);
+                displayValue = transformed != null ? transformed.toString() : '';
+                return { display: displayValue, renderedElement };
+            }
+            catch (error) {
+                logger.error(`Error in transformer for column ${column.key}:`, error);
+                return { display: 'Error', renderedElement };
+            }
+        }
+        try {
+            switch (column.type) {
+                case 'component':
+                    break;
+                case 'custom':
+                    return this.formatCustomCell(cellValue, row, column);
+                case 'integer':
+                case 'number':
+                    displayValue = cellValue.toString();
+                    break;
+                case 'date':
+                case 'datetime':
+                    displayValue = this.formatDateCell(cellValue, column);
+                    break;
+                case 'duration':
+                    displayValue = `${Math.floor(cellValue / 3600).toString().padStart(2, '0')}:${Math.floor((cellValue % 3600) / 60).toString().padStart(2, '0')}:${(cellValue % 60).toString().padStart(2, '0')}`;
+                    break;
+                case 'string':
+                default:
+                    displayValue = cellValue.toString();
+                    break;
+            }
+        }
+        catch (error) {
+            logger.error(`Error formatting cell for column ${column.key}:`, error);
+            displayValue = 'Error';
+        }
+        return { display: displayValue, renderedElement };
+    }
+    transformCustomOrComponent(rawValue, column) {
+        if (typeof column.transformer === 'function') {
+            try {
+                return column.transformer(rawValue);
+            }
+            catch (error) {
+                logger.error(`Error in custom transformer function for column ${column.key}:`, error);
+                return 'Error';
+            }
+        }
+        return rawValue;
+    }
+    transformInteger(rawValue) {
+        return rawValue !== null ? parseInt(rawValue, 10) : null;
+    }
+    transformNumber(rawValue) {
+        return rawValue !== null ? parseFloat(rawValue) : null;
+    }
+    transformDate(rawValue) {
+        if (rawValue !== null) {
+            const date = new Date(rawValue);
+            return isNaN(date.getTime()) ? null : date.getTime();
+        }
+        return null;
+    }
+    transformDuration(rawValue) {
+        return rawValue !== null ? parseInt(rawValue, 10) : null;
+    }
+    transformString(rawValue) {
+        return rawValue !== null ? rawValue.toString() : null;
+    }
+    formatCellValue(row, column) {
+        var _a;
+        // Safely retrieve the raw value
+        const cellData = (_a = row[column.key]) !== null && _a !== void 0 ? _a : null;
+        const rawValue = cellData && typeof cellData === 'object' && 'raw' in cellData
+            ? cellData.raw
+            : cellData;
+        switch (column.type) {
+            case 'component':
+            case 'custom':
+                return this.transformCustomOrComponent(rawValue, column);
+            case 'integer':
+                return this.transformInteger(rawValue);
+            case 'number':
+                return this.transformNumber(rawValue);
+            case 'date':
+            case 'datetime':
+                return this.transformDate(rawValue);
+            case 'duration':
+                return this.transformDuration(rawValue);
+            case 'string':
+            default:
+                return this.transformString(rawValue);
+        }
+    }
+}

package/dist/services/RowHeightService.d.ts

@@ -0,0 +1,15 @@
+import type { GridService } from "../GridService";
+export declare class RowHeightService {
+    private rowHeights;
+    private heightCache;
+    private readonly gridService;
+    constructor(gridService: GridService);
+    initRowHeights(numberOfRows: number): void;
+    getRowHeight(index: number): number;
+    getHeightCache(): number[];
+    updateRowHeight(index: number, height: number): void;
+    recalculateHeights(): void;
+    updateRowHeights(): void;
+    findStartIndex(scrollTop: number): number;
+    findEndIndex(scrollBottom: number): number;
+}

package/dist/services/RowHeightService.js

@@ -0,0 +1,63 @@
+export class RowHeightService {
+    constructor(gridService) {
+        this.rowHeights = new Map();
+        this.heightCache = [];
+        this.gridService = gridService;
+    }
+    initRowHeights(numberOfRows) {
+        this.rowHeights = new Map(Array.from({ length: numberOfRows }, (_, index) => [index, this.gridService.elementHeight]));
+    }
+    getRowHeight(index) {
+        var _a;
+        return (_a = this.rowHeights.get(index)) !== null && _a !== void 0 ? _a : this.gridService.elementHeight;
+    }
+    getHeightCache() {
+        return this.heightCache;
+    }
+    updateRowHeight(index, height) {
+        this.rowHeights.set(index, height);
+        this.recalculateHeights();
+    }
+    recalculateHeights() {
+        let filteredRows = this.gridService.getFilterIndexes();
+        this.heightCache = [];
+        let sum = 0;
+        for (let i = 0; i < this.gridService.rowCount(); i++) {
+            let rowIndex = filteredRows ? filteredRows[i] : i;
+            sum += this.getRowHeight(rowIndex);
+            this.heightCache.push(sum);
+        }
+    }
+    updateRowHeights() {
+        let container = this.gridService.getContainer();
+        if (!container)
+            return;
+        const rows = container.querySelectorAll('tbody > tr:not(.firstRow):not(.lastRow)'); // Adjust the selector as needed
+        let hasUpdated = false;
+        rows.forEach((row, index) => {
+            const rowHeight = row.getBoundingClientRect().height; // Get the actual row height
+            const rowIndex = index + this.gridService.startIndex;
+            if (this.getRowHeight(rowIndex) !== rowHeight) {
+                this.updateRowHeight(rowIndex, rowHeight);
+                hasUpdated = true;
+            }
+        });
+        if (hasUpdated) {
+            this.gridService.updateRenderedRows();
+        }
+    }
+    findStartIndex(scrollTop) {
+        let index = 0;
+        while (index < this.heightCache.length && this.heightCache[index] < scrollTop) {
+            index++;
+        }
+        return Math.max(0, index);
+    }
+    findEndIndex(scrollBottom) {
+        let index = 0;
+        while (index < this.heightCache.length && this.heightCache[index] < scrollBottom) {
+            index++;
+        }
+        return Math.min(index, this.heightCache.length - 1);
+    }
+}

package/dist/services/SelectionService.d.ts

@@ -0,0 +1,14 @@
+export declare class SelectionService {
+    private readonly selectedIndexes$;
+    private readonly multiSelect;
+    constructor(selections?: Set<number>, multiSelect?: boolean);
+    get selected$(): import("rxjs").Observable<Set<number>>;
+    selectRow(index: number): void;
+    deselectRow(index: number): void;
+    toggleRowSelection(index: number): void;
+    clearSelection(): void;
+    selectAll(indices: number[]): void;
+    deselectAll(): void;
+    shiftSelect(startIndex: number, endIndex: number): void;
+    isSelected(index: number): boolean;
+}

package/dist/services/SelectionService.js

@@ -0,0 +1,55 @@
+import { BehaviorSubject } from 'rxjs';
+export class SelectionService {
+    constructor(selections = new Set(), multiSelect = true) {
+        this.multiSelect = multiSelect;
+        this.selectedIndexes$ = new BehaviorSubject(selections);
+    }
+    get selected$() {
+        return this.selectedIndexes$.asObservable();
+    }
+    selectRow(index) {
+        const selected = new Set(this.selectedIndexes$.value);
+        selected.add(index);
+        this.selectedIndexes$.next(selected);
+    }
+    deselectRow(index) {
+        const selected = new Set(this.selectedIndexes$.value);
+        selected.delete(index);
+        this.selectedIndexes$.next(selected);
+    }
+    toggleRowSelection(index) {
+        const selected = new Set(this.selectedIndexes$.value);
+        if (selected.has(index)) {
+            selected.delete(index);
+        }
+        else {
+            if (!this.multiSelect) {
+                selected.clear();
+            }
+            selected.add(index);
+        }
+        this.selectedIndexes$.next(selected);
+    }
+    clearSelection() {
+        this.selectedIndexes$.next(new Set());
+    }
+    selectAll(indices) {
+        this.selectedIndexes$.next(new Set(indices));
+    }
+    deselectAll() {
+        this.clearSelection();
+    }
+    shiftSelect(startIndex, endIndex) {
+        if (!this.multiSelect)
+            return;
+        const selected = new Set(this.selectedIndexes$.value);
+        const [start, end] = [Math.min(startIndex, endIndex), Math.max(startIndex, endIndex)];
+        for (let i = start; i <= end; i++) {
+            selected.add(i);
+        }
+        this.selectedIndexes$.next(selected);
+    }
+    isSelected(index) {
+        return this.selectedIndexes$.value.has(index);
+    }
+}

package/dist/services/SortingService.d.ts

@@ -0,0 +1,15 @@
+import type { GridService } from "../GridService";
+import type { Row } from "../types/grid";
+import { SortingCondition } from '../types/sorting';
+export declare class SortingService {
+    private readonly gridService;
+    private readonly sortConditions;
+    private sortedIndexes;
+    constructor(gridService: GridService, sortConditions?: SortingCondition[]);
+    getSorts(): SortingCondition[];
+    getSortCondition(columnKey: string | number): SortingCondition[];
+    toggleSort(columnKey: string | number): void;
+    applySorting(rows: Row[]): Row[];
+    getSortedIndexes(): number[] | null;
+    resetSorting(): void;
+}

package/dist/services/SortingService.js

@@ -0,0 +1,82 @@
+export class SortingService {
+    constructor(gridService, sortConditions = []) {
+        this.sortedIndexes = null;
+        this.gridService = gridService;
+        this.sortConditions = sortConditions;
+    }
+    getSorts() {
+        return this.sortConditions;
+    }
+    getSortCondition(columnKey) {
+        return this.sortConditions.filter(condition => columnKey === condition.columnKey);
+    }
+    toggleSort(columnKey) {
+        const existingIndex = this.sortConditions.findIndex(condition => condition.columnKey === columnKey);
+        if (existingIndex === -1) {
+            this.sortConditions.push({ columnKey, direction: 'asc' });
+        }
+        else {
+            switch (this.sortConditions[existingIndex].direction) {
+                case 'asc':
+                    this.sortConditions[existingIndex].direction = 'desc';
+                    break;
+                case 'desc':
+                    this.sortConditions.splice(existingIndex, 1);
+                    break;
+            }
+        }
+        this.sortedIndexes = null;
+    }
+    applySorting(rows) {
+        var _a;
+        if (this.sortConditions.length === 0) {
+            return rows;
+        }
+        if (this.sortedIndexes &&
+            this.sortedIndexes.length === rows.length &&
+            this.sortedIndexes.every(index => index >= 0 && index < rows.length)) {
+            return this.sortedIndexes.map(index => rows[index]); // Apply cached order
+        }
+        const indexedRows = rows.map((row, index) => ({ row, index }));
+        indexedRows.sort((a, b) => {
+            for (const { columnKey, direction } of this.sortConditions) {
+                const valueA = a.row[columnKey].value;
+                const valueB = b.row[columnKey].value;
+                let comparison = 0;
+                if (typeof valueA === 'string' && typeof valueB === 'string') {
+                    comparison = valueA.localeCompare(valueB);
+                }
+                else if (typeof valueA === 'number' && typeof valueB === 'number') {
+                    comparison = valueA - valueB;
+                }
+                else if (valueA instanceof Date && valueB instanceof Date) {
+                    comparison = valueA.getTime() - valueB.getTime();
+                }
+                else {
+                    comparison = String(valueA).localeCompare(String(valueB));
+                }
+                if (direction === 'desc') {
+                    comparison = -comparison;
+                }
+                if (comparison !== 0) {
+                    return comparison;
+                }
+            }
+            return 0; // Keep stable sorting
+        });
+        const filteredIndexes = (_a = this.gridService.getFilterIndexes()) !== null && _a !== void 0 ? _a : this.gridService.getRows().map((_, i) => i);
+        ;
+        this.gridService.clearIndexMap(); // Clear the existing mapping
+        indexedRows.forEach((indexedRow, i) => {
+            this.gridService.setIndexMappingValue(i, filteredIndexes[indexedRow.index]); // Map the sorted index to the original index
+        });
+        this.sortedIndexes = indexedRows.map(item => item.index);
+        return indexedRows.map(item => item.row); // Return sorted rows
+    }
+    getSortedIndexes() {
+        return this.sortedIndexes;
+    }
+    resetSorting() {
+        this.sortedIndexes = null;
+    }
+}

package/dist/services/__tests__/FilteringService.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/services/__tests__/FilteringService.test.js

@@ -0,0 +1,140 @@
+import { GridService } from '../../GridService';
+describe('FilteringService', () => {
+    let gridService;
+    let filteringService;
+    let mockRows;
+    let mockColumns;
+    beforeEach(() => {
+        mockColumns = [
+            { key: 'id', label: 'ID', type: 'integer' },
+            { key: 'name', label: 'Name', type: 'string' },
+            { key: 'age', label: 'Age', type: 'number' },
+            { key: 'status', label: 'Status', type: 'string' },
+        ];
+        mockRows = [
+            { id: { raw: 1, value: 1 }, name: { raw: 'Alice', value: 'Alice' }, age: { raw: 30, value: 30 }, status: { raw: 'active', value: 'active' } },
+            { id: { raw: 2, value: 2 }, name: { raw: 'Bob', value: 'Bob' }, age: { raw: 25, value: 25 }, status: { raw: 'inactive', value: 'inactive' } },
+            { id: { raw: 3, value: 3 }, name: { raw: 'Charlie', value: 'Charlie' }, age: { raw: 35, value: 35 }, status: { raw: 'active', value: 'active' } },
+        ];
+        gridService = new GridService(mockRows, mockColumns);
+        filteringService = gridService['filteringService'];
+    });
+    describe('Basic Operations', () => {
+        it('should initialize with no filter', () => {
+            expect(filteringService.getFilterTree()).toBeNull();
+            expect(filteringService.getFilterIndexes()).toBeNull();
+        });
+        it('should filter by equals condition', () => {
+            const filter = {
+                type: 'condition',
+                columnKey: 'name',
+                operator: '=',
+                value: 'Alice'
+            };
+            filteringService.setFilterTree(filter);
+            expect(filteringService.getFilterIndexes()).toEqual([0]);
+        });
+        it('should filter by greater than condition', () => {
+            const filter = {
+                type: 'condition',
+                columnKey: 'age',
+                operator: '>',
+                value: 30
+            };
+            filteringService.setFilterTree(filter);
+            expect(filteringService.getFilterIndexes()).toEqual([2]);
+        });
+    });
+    describe('Group Filters', () => {
+        it('should apply AND group filter', () => {
+            const filter = {
+                type: 'group',
+                operator: 'and',
+                filters: [
+                    { type: 'condition', columnKey: 'status', operator: '=', value: 'active' },
+                    { type: 'condition', columnKey: 'age', operator: '>=', value: 30 }
+                ]
+            };
+            filteringService.setFilterTree(filter);
+            expect(filteringService.getFilterIndexes()).toEqual([0, 2]);
+        });
+        it('should apply OR group filter', () => {
+            const filter = {
+                type: 'group',
+                operator: 'or',
+                filters: [
+                    { type: 'condition', columnKey: 'name', operator: '=', value: 'Alice' },
+                    { type: 'condition', columnKey: 'name', operator: '=', value: 'Bob' }
+                ]
+            };
+            filteringService.setFilterTree(filter);
+            expect(filteringService.getFilterIndexes()).toEqual([0, 1]);
+        });
+    });
+    describe('Add and Reset Filters', () => {
+        it('should add filter and replace existing for same column', () => {
+            const filter1 = { type: 'condition', columnKey: 'age', operator: '>', value: 25 };
+            const filter2 = { type: 'condition', columnKey: 'age', operator: '<', value: 35 };
+            filteringService.addFilter(filter1);
+            filteringService.addFilter(filter2);
+            const tree = filteringService.getFilterTree();
+            expect(tree === null || tree === void 0 ? void 0 : tree.type).toBe('group');
+            if ((tree === null || tree === void 0 ? void 0 : tree.type) === 'group') {
+                expect(tree.filters.length).toBe(1);
+                expect(tree.filters[0]).toEqual(filter2);
+            }
+        });
+        it('should reset all filters', () => {
+            filteringService.setFilterTree({ type: 'condition', columnKey: 'status', operator: '=', value: 'active' });
+            filteringService.resetFilters();
+            expect(filteringService.getFilterTree()).toBeNull();
+            expect(filteringService.getFilterIndexes()).toBeNull();
+        });
+        it('should reset specific column filter', () => {
+            const filter = {
+                type: 'group',
+                operator: 'and',
+                filters: [
+                    { type: 'condition', columnKey: 'status', operator: '=', value: 'active' },
+                    { type: 'condition', columnKey: 'age', operator: '>', value: 25 }
+                ]
+            };
+            filteringService.setFilterTree(filter);
+            filteringService.resetFilter('status');
+            const tree = filteringService.getFilterTree();
+            if ((tree === null || tree === void 0 ? void 0 : tree.type) === 'group') {
+                expect(tree.filters.length).toBe(1);
+                expect(tree.filters[0].columnKey).toBe('age');
+            }
+        });
+    });
+    describe('Helper Methods', () => {
+        it('should check if column has filter', () => {
+            filteringService.setFilterTree({ type: 'condition', columnKey: 'status', operator: '=', value: 'active' });
+            expect(filteringService.hasFilter('status')).toBe(true);
+            expect(filteringService.hasFilter('age')).toBe(false);
+        });
+        it('should apply filter to rows', () => {
+            filteringService.setFilterTree({ type: 'condition', columnKey: 'status', operator: '=', value: 'active' });
+            const filtered = filteringService.applyFilter(mockRows);
+            expect(filtered.length).toBe(2);
+            expect(filtered[0].name.value).toBe('Alice');
+            expect(filtered[1].name.value).toBe('Charlie');
+        });
+        it('should combine global search with filter tree using AND semantics', () => {
+            filteringService.setFilterTree({ type: 'condition', columnKey: 'status', operator: '=', value: 'active' });
+            filteringService.setGlobalSearch('char', { caseInsensitive: true });
+            const filtered = filteringService.applyFilter(mockRows);
+            expect(filtered.length).toBe(1);
+            expect(filtered[0].name.value).toBe('Charlie');
+        });
+        it('should use grid case-insensitive option when global search option is not set', () => {
+            const caseInsensitiveGridService = new GridService(mockRows, mockColumns, { caseInsensitiveFiltering: true });
+            const caseInsensitiveFilteringService = caseInsensitiveGridService['filteringService'];
+            caseInsensitiveFilteringService.setGlobalSearch('ALICE');
+            const filtered = caseInsensitiveFilteringService.applyFilter(mockRows);
+            expect(filtered.length).toBe(1);
+            expect(filtered[0].name.value).toBe('Alice');
+        });
+    });
+});

package/dist/services/__tests__/FormattingService.test.d.ts

@@ -0,0 +1 @@
+export {};