@alaarab/ogrid-angular 2.0.2

package/dist/esm/services/ogrid.service.js

@@ -0,0 +1,619 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Injectable, signal, computed, effect, DestroyRef, inject } from '@angular/core';
+import { mergeFilter, deriveFilterOptionsFromData, getMultiSelectFilterFields, flattenColumns, processClientSideData, } from '@alaarab/ogrid-core';
+const DEFAULT_PAGE_SIZE = 25;
+const EMPTY_LOADING_OPTIONS = {};
+const DEFAULT_PANELS = ['columns', 'filters'];
+/**
+ * Top-level orchestration service for OGrid: manages pagination, sorting, filtering,
+ * column visibility, sidebar, and server-side data fetching via Angular signals.
+ *
+ * Port of React's useOGrid hook.
+ */
+let OGridService = class OGridService {
+    constructor() {
+        this.destroyRef = inject(DestroyRef);
+        // --- Input signals (set by the component consuming this service) ---
+        this.columnsProp = signal([]);
+        this.getRowId = signal((item) => item['id']);
+        this.data = signal(undefined);
+        this.dataSource = signal(undefined);
+        this.controlledPage = signal(undefined);
+        this.controlledPageSize = signal(undefined);
+        this.controlledSort = signal(undefined);
+        this.controlledFilters = signal(undefined);
+        this.controlledVisibleColumns = signal(undefined);
+        this.controlledLoading = signal(undefined);
+        this.onPageChange = signal(undefined);
+        this.onPageSizeChange = signal(undefined);
+        this.onSortChange = signal(undefined);
+        this.onFiltersChange = signal(undefined);
+        this.onVisibleColumnsChange = signal(undefined);
+        this.columnOrder = signal(undefined);
+        this.onColumnOrderChange = signal(undefined);
+        this.onColumnResized = signal(undefined);
+        this.onColumnPinned = signal(undefined);
+        this.freezeRows = signal(undefined);
+        this.freezeCols = signal(undefined);
+        this.defaultPageSize = signal(DEFAULT_PAGE_SIZE);
+        this.defaultSortBy = signal(undefined);
+        this.defaultSortDirection = signal('asc');
+        this.toolbar = signal(undefined);
+        this.toolbarBelow = signal(undefined);
+        this.emptyState = signal(undefined);
+        this.entityLabelPlural = signal('items');
+        this.className = signal(undefined);
+        this.layoutMode = signal('fill');
+        this.suppressHorizontalScroll = signal(undefined);
+        this.editable = signal(undefined);
+        this.cellSelection = signal(undefined);
+        this.onCellValueChanged = signal(undefined);
+        this.onUndo = signal(undefined);
+        this.onRedo = signal(undefined);
+        this.canUndo = signal(undefined);
+        this.canRedo = signal(undefined);
+        this.rowSelection = signal('none');
+        this.selectedRows = signal(undefined);
+        this.onSelectionChange = signal(undefined);
+        this.statusBar = signal(undefined);
+        this.pageSizeOptions = signal(undefined);
+        this.sideBarConfig = signal(undefined);
+        this.onFirstDataRendered = signal(undefined);
+        this.onError = signal(undefined);
+        this.columnChooserProp = signal(undefined);
+        this.ariaLabel = signal(undefined);
+        this.ariaLabelledBy = signal(undefined);
+        // --- Internal state signals ---
+        this.internalData = signal([]);
+        this.internalLoading = signal(false);
+        this.internalPage = signal(1);
+        this.internalPageSize = signal(DEFAULT_PAGE_SIZE);
+        this.internalSort = signal({ field: '', direction: 'asc' });
+        this.internalFilters = signal({});
+        this.internalVisibleColumns = signal(new Set());
+        this.internalSelectedRows = signal(new Set());
+        this.columnWidthOverrides = signal({});
+        this.pinnedOverrides = signal({});
+        // Server-side state
+        this.serverItems = signal([]);
+        this.serverTotalCount = signal(0);
+        this.serverLoading = signal(true);
+        this.fetchId = 0;
+        this.refreshCounter = signal(0);
+        this.firstDataRendered = false;
+        // Side bar state
+        this.sideBarActivePanel = signal(null);
+        // Filter options state
+        this.serverFilterOptions = signal({});
+        this.loadingFilterOptions = signal({});
+        // --- Initialization ---
+        this.sortInitialized = false;
+        this.visibleColumnsInitialized = false;
+        this.pageSizeInitialized = false;
+        // --- Derived computed signals ---
+        this.columns = computed(() => flattenColumns(this.columnsProp()));
+        this.isServerSide = computed(() => this.dataSource() != null);
+        this.isClientSide = computed(() => !this.isServerSide());
+        this.displayData = computed(() => this.data() ?? this.internalData());
+        this.displayLoading = computed(() => this.controlledLoading() ?? this.internalLoading());
+        this.defaultSortField = computed(() => this.defaultSortBy() ?? this.columns()[0]?.columnId ?? '');
+        this.page = computed(() => this.controlledPage() ?? this.internalPage());
+        this.pageSize = computed(() => this.controlledPageSize() ?? this.internalPageSize());
+        this.sort = computed(() => this.controlledSort() ?? this.internalSort());
+        this.filters = computed(() => this.controlledFilters() ?? this.internalFilters());
+        this.visibleColumns = computed(() => this.controlledVisibleColumns() ?? this.internalVisibleColumns());
+        this.effectiveSelectedRows = computed(() => this.selectedRows() ?? this.internalSelectedRows());
+        this.columnChooserPlacement = computed(() => {
+            const prop = this.columnChooserProp();
+            return prop === false ? 'none' : prop === 'sidebar' ? 'sidebar' : 'toolbar';
+        });
+        this.multiSelectFilterFields = computed(() => getMultiSelectFilterFields(this.columns()));
+        this.hasServerFilterOptions = computed(() => this.dataSource()?.fetchFilterOptions != null);
+        this.clientFilterOptions = computed(() => {
+            if (this.hasServerFilterOptions())
+                return this.serverFilterOptions();
+            return deriveFilterOptionsFromData(this.displayData(), this.columns());
+        });
+        this.clientItemsAndTotal = computed(() => {
+            if (!this.isClientSide())
+                return null;
+            const rows = processClientSideData(this.displayData(), this.columns(), this.filters(), this.sort().field, this.sort().direction);
+            const total = rows.length;
+            const start = (this.page() - 1) * this.pageSize();
+            const paged = rows.slice(start, start + this.pageSize());
+            return { items: paged, totalCount: total };
+        });
+        this.displayItems = computed(() => {
+            const cit = this.clientItemsAndTotal();
+            return this.isClientSide() && cit ? cit.items : this.serverItems();
+        });
+        this.displayTotalCount = computed(() => {
+            const cit = this.clientItemsAndTotal();
+            return this.isClientSide() && cit ? cit.totalCount : this.serverTotalCount();
+        });
+        this.hasActiveFilters = computed(() => {
+            return Object.values(this.filters()).some((v) => v !== undefined);
+        });
+        this.columnChooserColumns = computed(() => this.columns().map((c) => ({
+            columnId: c.columnId,
+            name: c.name,
+            required: c.required === true,
+        })));
+        this.statusBarConfig = computed(() => {
+            const sb = this.statusBar();
+            if (!sb)
+                return undefined;
+            if (typeof sb === 'object')
+                return sb;
+            const totalData = this.isClientSide() ? (this.data()?.length ?? 0) : this.serverTotalCount();
+            const filteredData = this.displayTotalCount();
+            return {
+                totalCount: totalData,
+                filteredCount: this.hasActiveFilters() ? filteredData : undefined,
+                selectedCount: this.effectiveSelectedRows().size,
+                suppressRowCount: true,
+            };
+        });
+        this.isLoadingResolved = computed(() => {
+            return (this.isServerSide() && this.serverLoading()) || this.displayLoading();
+        });
+        // Side bar
+        this.sideBarEnabled = computed(() => {
+            const config = this.sideBarConfig();
+            return config != null && config !== false;
+        });
+        this.sideBarParsed = computed(() => {
+            const config = this.sideBarConfig();
+            if (!this.sideBarEnabled() || config === true) {
+                return { panels: DEFAULT_PANELS, position: 'right', defaultPanel: null };
+            }
+            const def = config;
+            return {
+                panels: def.panels ?? DEFAULT_PANELS,
+                position: def.position ?? 'right',
+                defaultPanel: def.defaultPanel ?? null,
+            };
+        });
+        this.filterableColumns = computed(() => this.columns()
+            .filter((c) => c.filterable && c.filterable.type)
+            .map((c) => ({
+            columnId: c.columnId,
+            name: c.name,
+            filterField: c.filterable.filterField ?? c.columnId,
+            filterType: c.filterable.type,
+        })));
+        this.sideBarState = computed(() => ({
+            isEnabled: this.sideBarEnabled(),
+            activePanel: this.sideBarActivePanel(),
+            setActivePanel: (panel) => this.sideBarActivePanel.set(panel),
+            panels: this.sideBarParsed().panels,
+            position: this.sideBarParsed().position,
+            isOpen: this.sideBarActivePanel() !== null,
+            toggle: (panel) => this.sideBarActivePanel.update((p) => p === panel ? null : panel),
+            close: () => this.sideBarActivePanel.set(null),
+        }));
+        // --- Data grid props computed ---
+        this.dataGridProps = computed(() => ({
+            items: this.displayItems(),
+            columns: this.columnsProp(),
+            getRowId: this.getRowId(),
+            sortBy: this.sort().field,
+            sortDirection: this.sort().direction,
+            onColumnSort: (columnKey) => this.handleSort(columnKey),
+            visibleColumns: this.visibleColumns(),
+            columnOrder: this.columnOrder(),
+            onColumnOrderChange: this.onColumnOrderChange(),
+            onColumnResized: (columnId, width) => this.handleColumnResized(columnId, width),
+            onColumnPinned: (columnId, pinned) => this.handleColumnPinned(columnId, pinned),
+            pinnedColumns: this.pinnedOverrides(),
+            initialColumnWidths: this.columnWidthOverrides(),
+            freezeRows: this.freezeRows(),
+            freezeCols: this.freezeCols(),
+            editable: this.editable(),
+            cellSelection: this.cellSelection(),
+            onCellValueChanged: this.onCellValueChanged(),
+            onUndo: this.onUndo(),
+            onRedo: this.onRedo(),
+            canUndo: this.canUndo(),
+            canRedo: this.canRedo(),
+            rowSelection: this.rowSelection(),
+            selectedRows: this.effectiveSelectedRows(),
+            onSelectionChange: (event) => this.handleSelectionChange(event),
+            statusBar: this.statusBarConfig(),
+            isLoading: this.isLoadingResolved(),
+            filters: this.filters(),
+            onFilterChange: (key, value) => this.handleFilterChange(key, value),
+            filterOptions: this.clientFilterOptions(),
+            loadingFilterOptions: this.dataSource()?.fetchFilterOptions ? this.loadingFilterOptions() : EMPTY_LOADING_OPTIONS,
+            peopleSearch: this.dataSource()?.searchPeople?.bind(this.dataSource()),
+            getUserByEmail: this.dataSource()?.getUserByEmail?.bind(this.dataSource()),
+            layoutMode: this.layoutMode(),
+            suppressHorizontalScroll: this.suppressHorizontalScroll(),
+            'aria-label': this.ariaLabel(),
+            'aria-labelledby': this.ariaLabelledBy(),
+            emptyState: {
+                hasActiveFilters: this.hasActiveFilters(),
+                onClearAll: () => this.setFilters({}),
+                message: this.emptyState()?.message,
+                render: this.emptyState()?.render,
+            },
+        }));
+        this.pagination = computed(() => ({
+            page: this.page(),
+            pageSize: this.pageSize(),
+            displayTotalCount: this.displayTotalCount(),
+            setPage: (p) => this.setPage(p),
+            setPageSize: (size) => this.setPageSize(size),
+            pageSizeOptions: this.pageSizeOptions(),
+            entityLabelPlural: this.entityLabelPlural(),
+        }));
+        this.columnChooser = computed(() => ({
+            columns: this.columnChooserColumns(),
+            visibleColumns: this.visibleColumns(),
+            onVisibilityChange: (columnKey, isVisible) => this.handleVisibilityChange(columnKey, isVisible),
+            placement: this.columnChooserPlacement(),
+        }));
+        this.filtersResult = computed(() => ({
+            hasActiveFilters: this.hasActiveFilters(),
+            setFilters: (f) => this.setFilters(f),
+        }));
+        this.sideBarProps = computed(() => {
+            const state = this.sideBarState();
+            if (!state.isEnabled)
+                return null;
+            return {
+                activePanel: state.activePanel,
+                onPanelChange: state.setActivePanel,
+                panels: state.panels,
+                position: state.position,
+                columns: this.columnChooserColumns(),
+                visibleColumns: this.visibleColumns(),
+                onVisibilityChange: (columnKey, visible) => this.handleVisibilityChange(columnKey, visible),
+                onSetVisibleColumns: (cols) => this.setVisibleColumns(cols),
+                filterableColumns: this.filterableColumns(),
+                filters: this.filters(),
+                onFilterChange: (key, value) => this.handleFilterChange(key, value),
+                filterOptions: this.clientFilterOptions(),
+            };
+        });
+        // Initialize internal default values based on config
+        effect(() => {
+            if (!this.sortInitialized) {
+                this.sortInitialized = true;
+                this.internalSort.set({
+                    field: this.defaultSortField(),
+                    direction: this.defaultSortDirection(),
+                });
+            }
+        });
+        effect(() => {
+            if (!this.pageSizeInitialized) {
+                this.pageSizeInitialized = true;
+                this.internalPageSize.set(this.defaultPageSize());
+            }
+        });
+        effect(() => {
+            if (!this.visibleColumnsInitialized && this.columns().length > 0) {
+                this.visibleColumnsInitialized = true;
+                const cols = this.columns();
+                const visible = cols.filter((c) => c.defaultVisible !== false).map((c) => c.columnId);
+                this.internalVisibleColumns.set(new Set(visible.length > 0 ? visible : cols.map((c) => c.columnId)));
+            }
+        });
+        // Server-side data fetching effect
+        effect(() => {
+            const ds = this.dataSource();
+            if (!this.isServerSide() || !ds) {
+                if (!this.isServerSide())
+                    this.serverLoading.set(false);
+                return;
+            }
+            const page = this.page();
+            const pageSize = this.pageSize();
+            const sort = this.sort();
+            const filters = this.filters();
+            // Read refreshCounter to trigger re-fetches
+            this.refreshCounter();
+            const id = ++this.fetchId;
+            this.serverLoading.set(true);
+            ds.fetchPage({ page, pageSize, sort: { field: sort.field, direction: sort.direction }, filters })
+                .then((res) => {
+                if (id !== this.fetchId)
+                    return;
+                this.serverItems.set(res.items);
+                this.serverTotalCount.set(res.totalCount);
+            })
+                .catch((err) => {
+                if (id !== this.fetchId)
+                    return;
+                this.onError()?.(err);
+                this.serverItems.set([]);
+                this.serverTotalCount.set(0);
+            })
+                .finally(() => {
+                if (id === this.fetchId)
+                    this.serverLoading.set(false);
+            });
+        });
+        // Fire onFirstDataRendered once
+        effect(() => {
+            if (!this.firstDataRendered && this.displayItems().length > 0) {
+                this.firstDataRendered = true;
+                this.onFirstDataRendered()?.();
+            }
+        });
+        // Load server filter options
+        effect(() => {
+            const ds = this.dataSource();
+            const fields = this.multiSelectFilterFields();
+            const fetcher = ds && 'fetchFilterOptions' in ds && typeof ds.fetchFilterOptions === 'function'
+                ? ds.fetchFilterOptions.bind(ds)
+                : undefined;
+            if (!fetcher || fields.length === 0) {
+                this.serverFilterOptions.set({});
+                this.loadingFilterOptions.set({});
+                return;
+            }
+            const loading = {};
+            fields.forEach((f) => { loading[f] = true; });
+            this.loadingFilterOptions.set(loading);
+            const results = {};
+            Promise.all(fields.map(async (field) => {
+                try {
+                    results[field] = await fetcher(field);
+                }
+                catch {
+                    results[field] = [];
+                }
+            })).then(() => {
+                this.serverFilterOptions.set(results);
+                this.loadingFilterOptions.set({});
+            });
+        });
+        // Initialize sidebar default panel
+        effect(() => {
+            const parsed = this.sideBarParsed();
+            if (parsed.defaultPanel) {
+                this.sideBarActivePanel.set(parsed.defaultPanel);
+            }
+        });
+    }
+    // --- Setters ---
+    setPage(p) {
+        if (this.controlledPage() === undefined)
+            this.internalPage.set(p);
+        this.onPageChange()?.(p);
+    }
+    setPageSize(size) {
+        if (this.controlledPageSize() === undefined)
+            this.internalPageSize.set(size);
+        this.onPageSizeChange()?.(size);
+        this.setPage(1);
+    }
+    setSort(s) {
+        if (this.controlledSort() === undefined)
+            this.internalSort.set(s);
+        this.onSortChange()?.(s);
+        this.setPage(1);
+    }
+    setFilters(f) {
+        if (this.controlledFilters() === undefined)
+            this.internalFilters.set(f);
+        this.onFiltersChange()?.(f);
+        this.setPage(1);
+    }
+    setVisibleColumns(cols) {
+        if (this.controlledVisibleColumns() === undefined)
+            this.internalVisibleColumns.set(cols);
+        this.onVisibleColumnsChange()?.(cols);
+    }
+    handleSort(columnKey) {
+        const sort = this.sort();
+        this.setSort({
+            field: columnKey,
+            direction: sort.field === columnKey && sort.direction === 'asc' ? 'desc' : 'asc',
+        });
+    }
+    handleFilterChange(key, value) {
+        this.setFilters(mergeFilter(this.filters(), key, value));
+    }
+    handleVisibilityChange(columnKey, isVisible) {
+        const next = new Set(this.visibleColumns());
+        if (isVisible)
+            next.add(columnKey);
+        else
+            next.delete(columnKey);
+        this.setVisibleColumns(next);
+    }
+    handleSelectionChange(event) {
+        if (this.selectedRows() === undefined) {
+            this.internalSelectedRows.set(new Set(event.selectedRowIds));
+        }
+        this.onSelectionChange()?.(event);
+    }
+    handleColumnResized(columnId, width) {
+        this.columnWidthOverrides.update((prev) => ({ ...prev, [columnId]: width }));
+        this.onColumnResized()?.(columnId, width);
+    }
+    handleColumnPinned(columnId, pinned) {
+        this.pinnedOverrides.update((prev) => {
+            if (pinned === null) {
+                const { [columnId]: _, ...rest } = prev;
+                return rest;
+            }
+            return { ...prev, [columnId]: pinned };
+        });
+        this.onColumnPinned()?.(columnId, pinned);
+    }
+    // --- Configure from props ---
+    configure(props) {
+        this.columnsProp.set(props.columns);
+        this.getRowId.set(props.getRowId);
+        if ('data' in props && props.data !== undefined)
+            this.data.set(props.data);
+        if ('dataSource' in props && props.dataSource !== undefined)
+            this.dataSource.set(props.dataSource);
+        if (props.page !== undefined)
+            this.controlledPage.set(props.page);
+        if (props.pageSize !== undefined)
+            this.controlledPageSize.set(props.pageSize);
+        if (props.sort !== undefined)
+            this.controlledSort.set(props.sort);
+        if (props.filters !== undefined)
+            this.controlledFilters.set(props.filters);
+        if (props.visibleColumns !== undefined)
+            this.controlledVisibleColumns.set(props.visibleColumns);
+        if (props.isLoading !== undefined)
+            this.controlledLoading.set(props.isLoading);
+        if (props.onPageChange)
+            this.onPageChange.set(props.onPageChange);
+        if (props.onPageSizeChange)
+            this.onPageSizeChange.set(props.onPageSizeChange);
+        if (props.onSortChange)
+            this.onSortChange.set(props.onSortChange);
+        if (props.onFiltersChange)
+            this.onFiltersChange.set(props.onFiltersChange);
+        if (props.onVisibleColumnsChange)
+            this.onVisibleColumnsChange.set(props.onVisibleColumnsChange);
+        if (props.columnOrder !== undefined)
+            this.columnOrder.set(props.columnOrder);
+        if (props.onColumnOrderChange)
+            this.onColumnOrderChange.set(props.onColumnOrderChange);
+        if (props.onColumnResized)
+            this.onColumnResized.set(props.onColumnResized);
+        if (props.onColumnPinned)
+            this.onColumnPinned.set(props.onColumnPinned);
+        if (props.freezeRows !== undefined)
+            this.freezeRows.set(props.freezeRows);
+        if (props.freezeCols !== undefined)
+            this.freezeCols.set(props.freezeCols);
+        if (props.defaultPageSize !== undefined)
+            this.defaultPageSize.set(props.defaultPageSize);
+        if (props.defaultSortBy !== undefined)
+            this.defaultSortBy.set(props.defaultSortBy);
+        if (props.defaultSortDirection !== undefined)
+            this.defaultSortDirection.set(props.defaultSortDirection);
+        if (props.editable !== undefined)
+            this.editable.set(props.editable);
+        if (props.cellSelection !== undefined)
+            this.cellSelection.set(props.cellSelection);
+        if (props.onCellValueChanged)
+            this.onCellValueChanged.set(props.onCellValueChanged);
+        if (props.onUndo)
+            this.onUndo.set(props.onUndo);
+        if (props.onRedo)
+            this.onRedo.set(props.onRedo);
+        if (props.canUndo !== undefined)
+            this.canUndo.set(props.canUndo);
+        if (props.canRedo !== undefined)
+            this.canRedo.set(props.canRedo);
+        if (props.rowSelection !== undefined)
+            this.rowSelection.set(props.rowSelection);
+        if (props.selectedRows !== undefined)
+            this.selectedRows.set(props.selectedRows);
+        if (props.onSelectionChange)
+            this.onSelectionChange.set(props.onSelectionChange);
+        if (props.statusBar !== undefined)
+            this.statusBar.set(props.statusBar);
+        if (props.pageSizeOptions !== undefined)
+            this.pageSizeOptions.set(props.pageSizeOptions);
+        if (props.sideBar !== undefined)
+            this.sideBarConfig.set(props.sideBar);
+        if (props.onFirstDataRendered)
+            this.onFirstDataRendered.set(props.onFirstDataRendered);
+        if (props.onError)
+            this.onError.set(props.onError);
+        if (props.columnChooser !== undefined)
+            this.columnChooserProp.set(props.columnChooser);
+        if (props.entityLabelPlural !== undefined)
+            this.entityLabelPlural.set(props.entityLabelPlural);
+        if (props.className !== undefined)
+            this.className.set(props.className);
+        if (props.layoutMode !== undefined)
+            this.layoutMode.set(props.layoutMode);
+        if (props.suppressHorizontalScroll !== undefined)
+            this.suppressHorizontalScroll.set(props.suppressHorizontalScroll);
+        if (props['aria-label'] !== undefined)
+            this.ariaLabel.set(props['aria-label']);
+        if (props['aria-labelledby'] !== undefined)
+            this.ariaLabelledBy.set(props['aria-labelledby']);
+    }
+    // --- API ---
+    getApi() {
+        return {
+            setRowData: (d) => {
+                if (!this.isServerSide())
+                    this.internalData.set(d);
+            },
+            setLoading: (loading) => this.internalLoading.set(loading),
+            getColumnState: () => ({
+                visibleColumns: Array.from(this.visibleColumns()),
+                sort: this.sort(),
+                columnOrder: this.columnOrder() ?? undefined,
+                columnWidths: Object.keys(this.columnWidthOverrides()).length > 0 ? this.columnWidthOverrides() : undefined,
+                filters: Object.keys(this.filters()).length > 0 ? this.filters() : undefined,
+                pinnedColumns: Object.keys(this.pinnedOverrides()).length > 0 ? this.pinnedOverrides() : undefined,
+            }),
+            applyColumnState: (state) => {
+                if (state.visibleColumns)
+                    this.setVisibleColumns(new Set(state.visibleColumns));
+                if (state.sort)
+                    this.setSort(state.sort);
+                if (state.columnOrder && this.onColumnOrderChange())
+                    this.onColumnOrderChange()(state.columnOrder);
+                if (state.columnWidths)
+                    this.columnWidthOverrides.set(state.columnWidths);
+                if (state.filters)
+                    this.setFilters(state.filters);
+                if (state.pinnedColumns)
+                    this.pinnedOverrides.set(state.pinnedColumns);
+            },
+            setFilterModel: (filters) => this.setFilters(filters),
+            getSelectedRows: () => Array.from(this.effectiveSelectedRows()),
+            setSelectedRows: (rowIds) => {
+                if (this.selectedRows() === undefined)
+                    this.internalSelectedRows.set(new Set(rowIds));
+            },
+            selectAll: () => {
+                const allIds = new Set(this.displayItems().map((item) => this.getRowId()(item)));
+                if (this.selectedRows() === undefined)
+                    this.internalSelectedRows.set(allIds);
+                this.onSelectionChange()?.({
+                    selectedRowIds: Array.from(allIds),
+                    selectedItems: this.displayItems(),
+                });
+            },
+            deselectAll: () => {
+                if (this.selectedRows() === undefined)
+                    this.internalSelectedRows.set(new Set());
+                this.onSelectionChange()?.({ selectedRowIds: [], selectedItems: [] });
+            },
+            clearFilters: () => this.setFilters({}),
+            clearSort: () => this.setSort({ field: this.defaultSortField(), direction: this.defaultSortDirection() }),
+            resetGridState: (options) => {
+                this.setFilters({});
+                this.setSort({ field: this.defaultSortField(), direction: this.defaultSortDirection() });
+                if (!options?.keepSelection) {
+                    if (this.selectedRows() === undefined)
+                        this.internalSelectedRows.set(new Set());
+                    this.onSelectionChange()?.({ selectedRowIds: [], selectedItems: [] });
+                }
+            },
+            getDisplayedRows: () => this.displayItems(),
+            refreshData: () => {
+                if (this.isServerSide()) {
+                    this.refreshCounter.update((c) => c + 1);
+                }
+            },
+        };
+    }
+};
+OGridService = __decorate([
+    Injectable()
+], OGridService);
+export { OGridService };

package/dist/esm/types/columnTypes.js

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

package/dist/esm/types/dataGridTypes.js

@@ -0,0 +1 @@
+export { toUserLike, isInSelectionRange, normalizeSelectionRange } from '@alaarab/ogrid-core';

package/dist/esm/types/index.js

@@ -0,0 +1 @@
+export { toUserLike, isInSelectionRange, normalizeSelectionRange } from './dataGridTypes';

package/dist/types/components/empty-state.component.d.ts

@@ -0,0 +1,6 @@
+export declare class EmptyStateComponent {
+    readonly message: import("@angular/core").InputSignal<string | undefined>;
+    readonly hasActiveFilters: import("@angular/core").InputSignal<boolean>;
+    readonly render: import("@angular/core").InputSignal<unknown>;
+    readonly clearAll: import("@angular/core").OutputEmitterRef<void>;
+}

package/dist/types/components/grid-context-menu.component.d.ts

@@ -0,0 +1,32 @@
+import { ElementRef } from '@angular/core';
+import { GRID_CONTEXT_MENU_ITEMS, formatShortcut } from '@alaarab/ogrid-core';
+export declare class GridContextMenuComponent {
+    private destroyRef;
+    readonly x: import("@angular/core").InputSignal<number>;
+    readonly y: import("@angular/core").InputSignal<number>;
+    readonly hasSelection: import("@angular/core").InputSignal<boolean>;
+    readonly canUndoProp: import("@angular/core").InputSignal<boolean>;
+    readonly canRedoProp: import("@angular/core").InputSignal<boolean>;
+    readonly classNames: import("@angular/core").InputSignal<{
+        contextMenu?: string;
+        contextMenuItem?: string;
+        contextMenuItemLabel?: string;
+        contextMenuItemShortcut?: string;
+        contextMenuDivider?: string;
+    } | undefined>;
+    readonly copy: import("@angular/core").OutputEmitterRef<void>;
+    readonly cut: import("@angular/core").OutputEmitterRef<void>;
+    readonly paste: import("@angular/core").OutputEmitterRef<void>;
+    readonly selectAll: import("@angular/core").OutputEmitterRef<void>;
+    readonly undoAction: import("@angular/core").OutputEmitterRef<void>;
+    readonly redoAction: import("@angular/core").OutputEmitterRef<void>;
+    readonly close: import("@angular/core").OutputEmitterRef<void>;
+    readonly menuRef: import("@angular/core").Signal<ElementRef<HTMLDivElement> | undefined>;
+    readonly menuItems: import("@alaarab/ogrid-core").GridContextMenuItem[];
+    readonly formatShortcutFn: typeof formatShortcut;
+    private clickOutsideHandler;
+    private keyDownHandler;
+    constructor();
+    isDisabled(item: (typeof GRID_CONTEXT_MENU_ITEMS)[number]): boolean;
+    onItemClick(id: string): void;
+}