ia-table 0.9.2 → 0.10.1

package/README.md

@@ -10,6 +10,158 @@ A powerful, feature-rich React data table component for enterprise applications.
 npm install --save ia-table
 ```
 
+## Development Setup
+
+If you're contributing to this project or have cloned the repository, follow these steps:
+
+### 1. Install Dependencies
+
+```bash
+npm install
+```
+
+### 2. ESLint Configuration
+
+This project uses **ESLint 9+ with Flat Config** format. The configuration is in `eslint.config.js`.
+
+#### Running ESLint
+
+```bash
+# Check for linting errors
+npm run lint
+
+# Auto-fix linting errors
+npm run lint:fix
+```
+
+#### IDE Integration
+
+**VS Code:**
+
+1. Install the [ESLint extension](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
+2. Install the [Prettier extension](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
+3. Create `.vscode/settings.json` in the project root with:
+
+```json
+{
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[javascriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[typescriptreact]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[json]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact"
+  ]
+}
+```
+
+This configuration enables:
+
+- Auto-format on save with Prettier
+- Auto-fix ESLint errors on save
+- Consistent formatting across all file types
+
+**Other IDEs:**
+
+- Most modern IDEs support ESLint flat config format
+- Ensure your IDE's ESLint plugin is updated to the latest version
+
+#### What's Configured
+
+- **React Hooks Rules**: Enforces React hooks best practices
+- **React Refresh**: Warns about components that can't be hot-reloaded
+- **React Compiler**: Optimizations for React 19+
+- **TypeScript Support**: Full TypeScript linting with `typescript-eslint`
+- **Ignored Paths**: Automatically ignores `dist/`, `build/`, `node_modules/`, config files, and example files
+
+#### Customizing Rules
+
+To modify linting rules, edit `eslint.config.js`:
+
+```javascript
+{
+  rules: {
+    "your-rule": "error", // or "warn" or "off"
+  }
+}
+```
+
+### 3. Prettier Configuration
+
+This project uses **Prettier** for consistent code formatting across the team.
+
+#### Running Prettier
+
+```bash
+# Format all files
+npm run format
+
+# Check if files are formatted (useful for CI)
+npm run format:check
+```
+
+#### IDE Integration
+
+The `.vscode/settings.json` configuration shown in the ESLint section above already includes Prettier integration. No additional setup needed if you've already configured VS Code for ESLint.
+
+**Other IDEs:**
+
+- Most modern IDEs have Prettier plugins available
+- Configuration is automatically detected from `.prettierrc`
+
+#### ESLint + Prettier Integration
+
+The project is configured so that:
+
+- **ESLint** handles code quality rules (bugs, best practices)
+- **Prettier** handles code formatting (spacing, line breaks, quotes)
+- `eslint-config-prettier` disables conflicting ESLint formatting rules
+
+### 4. Available Scripts
+
+```bash
+# Development server
+npm start
+
+# Build library for production
+npm run build:lib
+
+# Run tests
+npm test
+
+# Linting
+npm run lint          # Check for linting errors
+npm run lint:fix      # Auto-fix linting errors
+
+# Formatting
+npm run format        # Format all files with Prettier
+npm run format:check  # Check if files are formatted
+
+# Storybook for component development
+npm run storybook
+
+# Build Storybook
+npm run build:storybook
+```
+
 ## Quick Start
 
 ```jsx
@@ -40,14 +192,12 @@ const App = () => {
 ### Core Table Features
 
 - **Data Display**:
-
   - Renders tabular data with fully customizable columns
   - Supports complex data objects and nested properties
   - Handles large datasets efficiently with virtualization
   - Displays empty state and loading indicators
 
 - **Responsive Layout**:
-
   - Adapts to container size with proper overflow handling
   - Horizontal scrolling for tables wider than their container
   - Maintains header alignment with body cells during scroll
@@ -64,7 +214,6 @@ const App = () => {
 ### Data Management
 
 - **Sorting**:
-
   - Sort data by any column in ascending or descending order
   - Visual indicators for sort direction
   - Support for custom sort functions
@@ -72,7 +221,6 @@ const App = () => {
   - Maintains sort state between renders
 
 - **Pagination**:
-
   - Built-in pagination with customizable page size
   - Page navigation controls (previous, next, first, last)
   - Dynamic calculation of total pages
@@ -92,7 +240,6 @@ const App = () => {
 ### Row Features
 
 - **Row Selection**:
-
   - Single or multi-row selection with checkbox support
   - Select all/deselect all functionality
   - Selection persistence between page changes
@@ -101,7 +248,6 @@ const App = () => {
   - Access to selection data through context
 
 - **Row Expansion**:
-
   - Expandable rows with custom content
   - Expand/collapse indicators with animation
   - Customizable expanded content renderer
@@ -109,7 +255,6 @@ const App = () => {
   - Context-aware expansion tracking
 
 - **Row Grouping**:
-
   - Support for hierarchical data with parent-child relationships
   - Configurable grouping fields
   - Visual indicators for grouped data
@@ -128,7 +273,6 @@ const App = () => {
 ### UI Components
 
 - **Table Header**:
-
   - Customizable with sort indicators
   - Support for multi-level column groups
   - Column resizing via drag handles
@@ -137,7 +281,6 @@ const App = () => {
   - Support for custom header cell renderers
 
 - **Table Body**:
-
   - Efficient rendering with virtualization for large datasets
   - Custom cell renderers for complex content
   - Row and cell event handlers (click, hover, etc.)
@@ -146,7 +289,6 @@ const App = () => {
   - Type-aware cell formatting
 
 - **Table Footer**:
-
   - Optional with pagination controls
   - Summary row capabilities
   - Aggregate function support (sum, average, count, etc.)
@@ -154,7 +296,6 @@ const App = () => {
   - Custom footer renderers
 
 - **Toolbar**:
-
   - Search functionality with debounced input
   - Column visibility toggle
   - Export options (CSV, Excel, etc.)
@@ -162,7 +303,6 @@ const App = () => {
   - Responsive design for mobile compatibility
 
 - **Column Toggle Menu**:
-
   - Show/hide columns dynamically
   - Drag and drop column reordering
   - Reset to default option
@@ -180,7 +320,6 @@ const App = () => {
 ### Visual Customization
 
 - **Column Resizing**:
-
   - Drag handles to adjust column widths
   - Visual feedback during resize operation
   - Minimum/maximum width constraints
@@ -188,7 +327,6 @@ const App = () => {
   - Persist column width preferences
 
 - **Styling**:
-
   - Comprehensive CSS for enterprise appearance
   - Support for theming and custom styles
   - Responsive design principles
@@ -206,7 +344,6 @@ const App = () => {
 ### Performance Optimizations
 
 - **Virtualized Rendering**:
-
   - Only renders visible rows for large datasets
   - Significantly improves performance for tables with thousands of rows
   - Dynamic buffer size calculation
@@ -214,7 +351,6 @@ const App = () => {
   - Efficient DOM reuse
 
 - **Memoization**:
-
   - Efficient re-rendering using React.useMemo
   - Prevents unnecessary calculations during renders
   - Smart component updates based on changed props

package/dist/components/IATable/types/api.type.ts

@@ -0,0 +1,272 @@
+// SmartGrid API Type Definitions
+
+import {
+  SmartGridInfiniteCache,
+  SmartGridInfiniteRowModel,
+} from "./cache.type";
+import { SmartGridColumnDefinition } from "./columns.type";
+import {
+  SmartGridFilterModel,
+  SmartGridRowNode,
+  SmartGridSortDirection,
+  SmartGridSortModel,
+  SmartGridUpdateData,
+} from "./common.type";
+import { SmartGridStateContext } from "./reducer.type";
+
+export type SmartGridModelType = "normal" | "serverSide" | "infinite";
+
+export type SmartGridPinnedType = "left" | "right" | null;
+
+export type SmartGridFloatingType = "top" | "bottom" | null;
+
+export interface SmartGridRowData {
+  [key: string]: unknown;
+  id?: string | number;
+  isChildRow?: boolean;
+  isChildGroup?: boolean;
+  childIndex?: number;
+  groupingLevel?: number;
+  level?: number;
+  parentRowIndex?: number;
+  parentRowData?: SmartGridRowData;
+  __parentPath?: string;
+  _rowHeight?: number;
+  _isPinnedTop?: boolean;
+  _isPinnedBottom?: boolean;
+  __isAggregationRow?: boolean;
+  __parentId?: string | number;
+}
+
+export interface SmartGridColumnState {
+  colId: string;
+  hide: boolean;
+  width: number;
+  sort: SmartGridSortDirection | null;
+  filter: SmartGridFilterModel | null;
+}
+
+export interface SmartGridPaginationModel {
+  currentPage: number;
+  pageSize: number;
+  totalPages: number;
+  totalRecords: number;
+}
+
+export interface SmartGridDisplayedRowNode extends SmartGridRowNode {
+  rowIndex: number;
+  absoluteRowIndex: number;
+  originalData: SmartGridRowData;
+  rowHeight?: number;
+}
+
+export interface SmartGridCacheState {
+  blockCount: number;
+  cache?: SmartGridInfiniteCache;
+  lastRowKnown: boolean;
+  rowCount: number;
+  status: string;
+}
+
+export interface SmartGridTableModel {
+  getData: () => SmartGridRowData[];
+  modelRef?: {
+    current?: SmartGridInfiniteRowModel;
+  };
+  infiniteCache: SmartGridInfiniteCache | null;
+  getColumnDefs: () => SmartGridColumnDefinition[];
+  getSortModel: () => SmartGridSortModel[];
+  getFilterModel: () => SmartGridFilterModel;
+  getType: () => SmartGridModelType;
+  getRowsToDisplay: () => number;
+  forEachNode: (
+    callback: (node: SmartGridRowNode, index: number) => void
+  ) => void;
+  getRowNode: (id: string | number) => SmartGridRowNode | null;
+  getSelectedRows: () => SmartGridRowData[];
+  getPaginationModel: () => SmartGridPaginationModel;
+  getColumnState: () => SmartGridColumnState[];
+  rowsToDisplay: SmartGridRowData[];
+}
+
+export interface SmartGridDisplayedColumn {
+  colDef: SmartGridColumnDefinition;
+  colId: string;
+  getColId: () => string;
+  isVisible: () => boolean;
+  isPinned: () => SmartGridPinnedType;
+  label: string;
+}
+
+export interface SmartGridSelectedCell {
+  colIndex: number;
+  column: SmartGridColumnDefinition;
+  data: SmartGridRowData;
+  field: string;
+  rowId: string | number;
+  rowIndex: number;
+  value: unknown;
+}
+
+export interface SmartGridFocusedCell extends SmartGridSelectedCell {
+  floating: SmartGridFloatingType;
+}
+
+export interface SmartGridRefreshOptions {
+  purge?: boolean;
+  resetPage?: boolean;
+  userInitiated?: boolean;
+}
+
+export interface SmartGridNotification {
+  message: string;
+  type?: "success" | "error" | "warning" | "info";
+  duration?: number;
+}
+
+export interface SmartGridParamsNode {
+  rowIndex: number;
+  data: SmartGridRowData;
+  api: SmartGridAPI;
+}
+
+export interface SmartGridDisplayedRowAtIndex {
+  data: SmartGridRowData;
+  rowIndex: number;
+  node: SmartGridParamsNode;
+  api: SmartGridAPI;
+}
+
+export interface SmartGridCachedBlockData {
+  [blockId: string]: SmartGridRowData[];
+}
+
+export interface SmartGridCellValueChangedParams {
+  colDef: SmartGridColumnDefinition;
+  column: SmartGridColumnDefinition;
+  data: SmartGridRowData;
+  newValue: unknown;
+  node: {
+    data: SmartGridRowData;
+    id: string | number;
+    level: number;
+    parent?: SmartGridUpdateData;
+    rowIndex: number;
+  };
+  value: unknown;
+}
+
+export interface SmartGridCheckConfiguration {
+  checkedRows?: string[];
+  unCheckedRows?: string[];
+  checkAll?: boolean;
+  searchColumns?: {
+    [key: string]: SmartGridFilterModel[];
+  };
+  unCheckAll?: boolean;
+}
+export interface SmartGridOptions {
+  [key: string]: unknown;
+}
+
+export interface SmartGridGetRowDataParams {
+  data: SmartGridRowData;
+  rowIndex: number;
+  node: SmartGridParamsNode;
+  api: SmartGridAPI;
+}
+export interface SmartGridDisptach {
+  type: string;
+  payload?: unknown;
+}
+
+export interface SmartGridAPI {
+  getInfiniteRowModel: () => SmartGridInfiniteRowModel | null;
+  getInfiniteCache: () => SmartGridInfiniteCache | null;
+  getModel: () => SmartGridTableModel;
+  onCellValueChanged: (params: SmartGridCellValueChangedParams) => void;
+  getPrevAction: () => string;
+  setPrevAction: (value: string) => void;
+  getCheckConfiguration: () => SmartGridCheckConfiguration[];
+  setCheckConfiguration: (config: SmartGridCheckConfiguration[]) => void;
+  addToCheckConfiguration: (item: SmartGridCheckConfiguration) => void;
+  getIsSelectAllRecords: () => boolean;
+  setIsSelectAllRecords: (value: boolean) => void;
+  getSelectedRows: () => SmartGridRowData[];
+  setSelectedRows: (rowIds: (string | number)[]) => void;
+  clearSelection: () => void;
+  selectAll: () => void;
+  refreshCells: () => void;
+  getCache: () => SmartGridInfiniteCache | null;
+  getCacheState: () => SmartGridCacheState | null;
+  getInfiniteCacheInstance: () => SmartGridInfiniteCache | undefined;
+  refreshServerSideStore: (options?: SmartGridRefreshOptions) => void;
+  getCachedBlockData: () => SmartGridCachedBlockData;
+  logCacheSummary: () => void | null;
+  getCachedRowById: (id: string | number) => SmartGridRowData | null;
+  getRowNode: (key: string | number) => Partial<SmartGridRowNode>;
+  setVisibleRange: (startRow: number, endRow: number) => void;
+  refreshCache: (options?: SmartGridRefreshOptions) => boolean;
+  deselectAll: () => void;
+  getRenderedNodes: () => SmartGridDisplayedRowNode[];
+  gridOptionsWrapper: {
+    gridOptions: SmartGridOptions;
+  };
+  getDisplayedRowAtIndex: (
+    index: number,
+    wholeData?: SmartGridRowData[],
+    api?: Partial<SmartGridAPI>
+  ) => SmartGridDisplayedRowAtIndex | null;
+  getTableWidth: () => number;
+  sizeColumnsToFit: () => void;
+  setRowData: (newData: SmartGridRowData[]) => boolean | void;
+  forEachNode: (
+    callback: (node: SmartGridRowNode, index: number) => void
+  ) => void;
+  getColumnDefs: () => SmartGridColumnDefinition[];
+  getAllColumns: () => SmartGridColumnDefinition[];
+  setColumnDefs: (newColumns: SmartGridColumnDefinition) => void;
+  addEventListener: (event: string, listener: Function) => void;
+  removeEventListener: (event: string, listener: Function) => void;
+  getPinnedTopRow: () => SmartGridRowData[] | null;
+  setPinnedTopRowData: (rows: SmartGridRowData[]) => void;
+  getPinnedBottomRow: () => SmartGridRowData[] | null;
+  setPinnedBottomRowData: (rows: SmartGridRowData[]) => void;
+  getRowData: (
+    params: SmartGridGetRowDataParams,
+    columnName: string
+  ) => string | number | boolean;
+  tableId: string;
+  getFocusedCell: () => SmartGridFocusedCell | null;
+  getSelectedCells: () => SmartGridSelectedCell[];
+  getAllDisplayedColumns: () => SmartGridDisplayedColumn[];
+  getDisplayedRowCount: () => number;
+  setFocusedCell: (
+    rowIndex: number,
+    colKey: SmartGridColumnDefinition | string | number,
+    floating?: SmartGridFloatingType
+  ) => boolean;
+  ensureColumnVisible: (
+    colKey: SmartGridColumnDefinition | string | number
+  ) => boolean;
+  getColumnByField: (fieldName: string) => SmartGridColumnDefinition | null;
+  getTableInstance: () =>
+    | {
+        current?: HTMLElement;
+      }
+    | undefined;
+  getFilterModel: () => SmartGridFilterModel;
+  setFilterModel: (field: string, rules: SmartGridFilterModel) => void;
+  getTableDispatcher: () => (action: SmartGridDisptach) => void;
+  getTableStateContext: () => SmartGridStateContext;
+  showNotification: (notification: SmartGridNotification) => void;
+  hideNotification: () => void;
+  applySearch: () => void;
+  getCurrentPageData: () => SmartGridRowData[];
+  getWholeTableData: () => SmartGridRowData[];
+  flashCells: () => void;
+  redrawRows: () => void;
+  refreshClientSideRowModel: () => void;
+  resetRecentSearchChanges: () => void;
+  onFilterChanged: () => void;
+}

package/dist/components/IATable/types/cache.type.ts

@@ -0,0 +1,65 @@
+import { SmartGridRowData } from "./api.type";
+
+export type SmartGridCacheAnalytics = {
+  blockEvictions: number;
+  blockLoadTimestamps: number[];
+  blockLoads: number;
+  bytesLoaded: number;
+  cachePurges: number;
+  cacheRefreshes: number;
+  hits: number;
+  lastBlockLoadTime: number;
+  misses: number;
+  startTime: number;
+  totalBlockLoadTime: number;
+};
+
+export type SmartGridCacheBlockParams = Record<string, unknown>;
+
+export type SmartGridCacheBlock = {
+  endRow: number;
+  id: number;
+  infiniteCache: SmartGridInfiniteCache;
+  lastAccessed: number;
+  loadStartedAt: number;
+  params: SmartGridCacheBlockParams;
+  parent: SmartGridInfiniteCache | null;
+  parentCache: SmartGridInfiniteCache | null;
+  rowNodes: {
+    data: SmartGridRowData;
+    id: number;
+    rowIndex: number;
+  }[];
+  rows: unknown;
+  startRow: number;
+  state: string;
+  version: number;
+  _inactiveForPageTransition: boolean;
+  _processingInProgress: boolean;
+  _targetPage: number;
+};
+
+export interface SmartGridInfiniteCache {
+  analytics: SmartGridCacheAnalytics;
+  blockCount: number;
+  blocks: Record<number, SmartGridCacheBlock>;
+  eventListeners: Record<"cacheUpdated", Function[]>;
+  lastRequestedPage: number;
+  lastRowIndexKnown: boolean;
+  params: SmartGridInfiniteCacheParams;
+  rowCount: number;
+  _currentRequestedPage: number;
+}
+
+export interface SmartGridInfiniteRowModel {
+  infiniteCache?: SmartGridInfiniteCache;
+  setViewportRange?: (startRow: number, endRow: number) => void;
+  logCacheSummary?: () => void;
+  [key: string]: unknown;
+}
+
+export interface SmartGridInfiniteCacheParams {
+  datasource: {
+    getWholeData: () => SmartGridRowData[];
+  };
+}