@alaarab/ogrid-angular 2.0.9 → 2.0.12

package/dist/types/components/base-pagination-controls.component.d.ts

@@ -0,0 +1,34 @@
+import { EventEmitter } from '@angular/core';
+/**
+ * Abstract base class containing all shared TypeScript logic for PaginationControls components.
+ * Framework-specific UI packages extend this with their templates and style overrides.
+ *
+ * Subclasses must:
+ * 1. Provide a @Component decorator with template and styles
+ *
+ * Uses @Input setter + signal pattern so computed() can track dependencies.
+ * (Plain @Input properties are NOT tracked by computed() — only signals are.)
+ */
+export declare abstract class BasePaginationControlsComponent {
+    private readonly _currentPage;
+    private readonly _pageSize;
+    private readonly _totalCount;
+    private readonly _pageSizeOptions;
+    private readonly _entityLabelPlural;
+    set currentPage(v: number);
+    get currentPage(): number;
+    set pageSize(v: number);
+    get pageSize(): number;
+    set totalCount(v: number);
+    get totalCount(): number;
+    set pageSizeOptions(v: number[] | undefined);
+    get pageSizeOptions(): number[] | undefined;
+    set entityLabelPlural(v: string);
+    get entityLabelPlural(): string;
+    pageChange: EventEmitter<number>;
+    pageSizeChange: EventEmitter<number>;
+    readonly labelPlural: import("@angular/core").Signal<string>;
+    readonly vm: import("@angular/core").Signal<import("@alaarab/ogrid-core").PaginationViewModel | null>;
+    onPageSizeSelect(event: Event): void;
+    onPageSizeChange(value: string): void;
+}

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

@@ -1,6 +1,7 @@
+import { EventEmitter } from '@angular/core';
 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>;
+    message: string | undefined;
+    hasActiveFilters: boolean;
+    render: unknown;
+    clearAll: EventEmitter<void>;
 }

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

@@ -1,27 +1,27 @@
-import { ElementRef } from '@angular/core';
+import { EventEmitter, 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<{
+    x: number;
+    y: number;
+    hasSelection: boolean;
+    canUndoProp: boolean;
+    canRedoProp: boolean;
+    classNames: {
         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>;
+    } | undefined;
+    copy: EventEmitter<void>;
+    cut: EventEmitter<void>;
+    paste: EventEmitter<void>;
+    selectAll: EventEmitter<void>;
+    undoAction: EventEmitter<void>;
+    redoAction: EventEmitter<void>;
+    close: EventEmitter<void>;
+    menuRef?: ElementRef<HTMLDivElement>;
     readonly menuItems: import("@alaarab/ogrid-core").GridContextMenuItem[];
     readonly formatShortcutFn: typeof formatShortcut;
     private clickOutsideHandler;

package/dist/types/components/marching-ants-overlay.component.d.ts

@@ -1,24 +1,24 @@
+import { OnChanges, SimpleChanges } from '@angular/core';
 import type { ISelectionRange } from '../types';
-interface OverlayRect {
-    top: number;
-    left: number;
-    width: number;
-    height: number;
-}
-export declare class MarchingAntsOverlayComponent {
+import { type OverlayRect } from '@alaarab/ogrid-core';
+export declare class MarchingAntsOverlayComponent implements OnChanges {
     private destroyRef;
-    readonly containerEl: import("@angular/core").InputSignal<HTMLElement | null>;
-    readonly selectionRange: import("@angular/core").InputSignal<ISelectionRange | null>;
-    readonly copyRange: import("@angular/core").InputSignal<ISelectionRange | null>;
-    readonly cutRange: import("@angular/core").InputSignal<ISelectionRange | null>;
-    readonly colOffset: import("@angular/core").InputSignal<number>;
-    readonly columnSizingVersion: import("@angular/core").InputSignal<number>;
+    containerEl: HTMLElement | null;
+    selectionRange: ISelectionRange | null;
+    copyRange: ISelectionRange | null;
+    cutRange: ISelectionRange | null;
+    colOffset: number;
+    columnSizingVersion: number;
+    items: readonly unknown[];
+    visibleColumns: readonly string[] | undefined;
+    columnOrder: readonly string[] | undefined;
     readonly selRect: import("@angular/core").WritableSignal<OverlayRect | null>;
     readonly clipRect: import("@angular/core").WritableSignal<OverlayRect | null>;
     private rafId;
     private resizeObserver;
     constructor();
+    ngOnChanges(_changes: SimpleChanges): void;
+    private recalculate;
     clipRangeMatchesSel(): boolean;
     max0(n: number): number;
 }
-export {};

package/dist/types/components/ogrid-layout.component.d.ts

@@ -1,9 +1,9 @@
 import type { SideBarProps } from './sidebar.component';
 export declare class OGridLayoutComponent {
-    readonly className: import("@angular/core").InputSignal<string | undefined>;
-    readonly hasToolbar: import("@angular/core").InputSignal<boolean>;
-    readonly hasToolbarBelow: import("@angular/core").InputSignal<boolean>;
-    readonly hasPagination: import("@angular/core").InputSignal<boolean>;
-    readonly sideBar: import("@angular/core").InputSignal<SideBarProps | null>;
+    className?: string;
+    hasToolbar: boolean;
+    hasToolbarBelow: boolean;
+    hasPagination: boolean;
+    sideBar: SideBarProps | null;
     readonly borderRadius = 6;
 }

package/dist/types/components/sidebar.component.d.ts

@@ -21,7 +21,7 @@ export interface SideBarProps {
     filterOptions: Record<string, string[]>;
 }
 export declare class SideBarComponent {
-    readonly sideBarProps: import("@angular/core").InputSignal<SideBarProps | null>;
+    sideBarProps: SideBarProps | null;
     readonly panelLabels: Record<SideBarPanelId, string>;
     readonly tabWidth = 36;
     readonly panelWidth = 240;

package/dist/types/components/status-bar.component.d.ts

@@ -1,21 +1,21 @@
 export declare class StatusBarComponent {
-    readonly totalCount: import("@angular/core").InputSignal<number>;
-    readonly filteredCount: import("@angular/core").InputSignal<number | undefined>;
-    readonly selectedCount: import("@angular/core").InputSignal<number | undefined>;
-    readonly selectedCellCount: import("@angular/core").InputSignal<number | undefined>;
-    readonly aggregation: import("@angular/core").InputSignal<{
+    totalCount: number;
+    filteredCount: number | undefined;
+    selectedCount: number | undefined;
+    selectedCellCount: number | undefined;
+    aggregation: {
         sum: number;
         avg: number;
         min: number;
         max: number;
         count: number;
-    } | null | undefined>;
-    readonly suppressRowCount: import("@angular/core").InputSignal<boolean | undefined>;
-    readonly classNames: import("@angular/core").InputSignal<{
+    } | null | undefined;
+    suppressRowCount: boolean | undefined;
+    classNames: {
         statusBar?: string;
         statusBarItem?: string;
         statusBarLabel?: string;
         statusBarValue?: string;
-    } | undefined>;
-    protected readonly parts: () => import("@alaarab/ogrid-core").StatusBarPart[];
+    } | undefined;
+    getParts(): import("@alaarab/ogrid-core").StatusBarPart[];
 }

package/dist/types/index.d.ts

@@ -18,5 +18,10 @@ export type { SideBarProps, SideBarFilterColumn } from './components/sidebar.com
 export { MarchingAntsOverlayComponent } from './components/marching-ants-overlay.component';
 export { EmptyStateComponent } from './components/empty-state.component';
 export { BaseDataGridTableComponent } from './components/base-datagrid-table.component';
+export { BaseColumnHeaderFilterComponent } from './components/base-column-header-filter.component';
+export type { IColumnHeaderFilterProps } from './components/base-column-header-filter.component';
+export { BaseColumnChooserComponent } from './components/base-column-chooser.component';
+export type { IColumnChooserProps } from './components/base-column-chooser.component';
+export { BasePaginationControlsComponent } from './components/base-pagination-controls.component';
 export type { HeaderFilterConfigInput, HeaderFilterConfig, CellRenderDescriptorInput, CellRenderDescriptor, CellRenderMode, } from './utils';
 export { getHeaderFilterConfig, getCellRenderDescriptor, resolveCellDisplayContent, resolveCellStyle, createDebouncedSignal, createDebouncedCallback, debounce, createLatestRef, createLatestCallback, } from './utils';

package/dist/types/services/datagrid-state.service.d.ts

@@ -88,7 +88,7 @@ export interface DataGridViewModelState<T> {
     headerFilterInput: {
         sortBy?: string;
         sortDirection: 'asc' | 'desc';
-        onColumnSort: (columnKey: string) => void;
+        onColumnSort: (columnKey: string, direction?: 'asc' | 'desc' | null) => void;
         filters: IFilters;
         onFilterChange: (key: string, value: FilterValue | undefined) => void;
         filterOptions: Record<string, string[]>;

package/dist/types/services/ogrid.service.d.ts

@@ -101,6 +101,7 @@ export declare class OGridService<T> {
     readonly onFirstDataRendered: import("@angular/core").WritableSignal<(() => void) | undefined>;
     readonly onError: import("@angular/core").WritableSignal<((error: unknown) => void) | undefined>;
     readonly columnChooserProp: import("@angular/core").WritableSignal<boolean | "toolbar" | "sidebar" | undefined>;
+    readonly columnReorder: import("@angular/core").WritableSignal<boolean | undefined>;
     readonly virtualScroll: import("@angular/core").WritableSignal<IVirtualScrollConfig | undefined>;
     readonly ariaLabel: import("@angular/core").WritableSignal<string | undefined>;
     readonly ariaLabelledBy: import("@angular/core").WritableSignal<string | undefined>;
@@ -179,7 +180,7 @@ export declare class OGridService<T> {
     }): void;
     setFilters(f: IFilters): void;
     setVisibleColumns(cols: Set<string>): void;
-    handleSort(columnKey: string): void;
+    handleSort(columnKey: string, direction?: 'asc' | 'desc' | null): void;
     handleFilterChange(key: string, value: FilterValue | undefined): void;
     handleVisibilityChange(columnKey: string, isVisible: boolean): void;
     handleSelectionChange(event: IRowSelectionChangeEvent<T>): void;

package/dist/types/types/dataGridTypes.d.ts

@@ -57,6 +57,7 @@ interface IOGridBaseProps<T> {
     layoutMode?: 'content' | 'fill';
     suppressHorizontalScroll?: boolean;
     sideBar?: boolean | ISideBarDef;
+    columnReorder?: boolean;
     virtualScroll?: IVirtualScrollConfig;
     pageSizeOptions?: number[];
     onFirstDataRendered?: () => void;
@@ -85,7 +86,7 @@ export interface IOGridDataGridProps<T> {
     getRowId: (item: T) => RowId;
     sortBy?: string;
     sortDirection: 'asc' | 'desc';
-    onColumnSort: (columnKey: string) => void;
+    onColumnSort: (columnKey: string, direction?: 'asc' | 'desc' | null) => void;
     visibleColumns: Set<string>;
     columnOrder?: string[];
     onColumnOrderChange?: (order: string[]) => void;
@@ -120,6 +121,7 @@ export interface IOGridDataGridProps<T> {
     loadingFilterOptions: Record<string, boolean>;
     peopleSearch?: (query: string) => Promise<UserLike[]>;
     getUserByEmail?: (email: string) => Promise<UserLike | undefined>;
+    columnReorder?: boolean;
     virtualScroll?: IVirtualScrollConfig;
     emptyState?: {
         onClearAll: () => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alaarab/ogrid-angular",
-  "version": "2.0.9",
+  "version": "2.0.12",
   "description": "OGrid Angular – Angular services, signals, and headless components for OGrid data grids.",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -35,7 +35,7 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@alaarab/ogrid-core": "2.0.9"
+    "@alaarab/ogrid-core": "2.0.12"
   },
   "peerDependencies": {
     "@angular/core": "^21.0.0",