ia-table 0.5.4 → 0.5.6

package/README.md

@@ -13,33 +13,27 @@ npm install --save ia-table
 ## Quick Start
 
 ```jsx
-import { IATable } from 'ia-table';
-import 'ia-table/dist/style.css'; // Import styles
+import IATable from "ia-table";
 
 const App = () => {
   const data = [
-    { id: 1, name: 'Product A', price: 100 },
-    { id: 2, name: 'Product B', price: 200 },
+    { id: 1, name: "Product A", price: 100 },
+    { id: 2, name: "Product B", price: 200 },
   ];
 
   const columns = [
-    { field: 'id', headerName: 'ID' },
-    { field: 'name', headerName: 'Name' },
-    { field: 'price', headerName: 'Price' },
+    { field: "id", headerName: "ID" },
+    { field: "name", headerName: "Name" },
+    { field: "price", headerName: "Price" },
   ];
 
   return (
-    <IATable 
-      data={data}
-      columns={columns}
-      height="400px"
-      uniqueIdField="id"
-    />
+    <IATable data={data} columns={columns} height="400px" uniqueIdField="id" />
   );
 };
 ```
 
-For detailed documentation on publishing this package, see [PUBLISHING.md](./PUBLISHING.md).
+<!-- For detailed documentation on publishing this package, see [PUBLISHING.md](./PUBLISHING.md). -->
 
 ## Features
 
@@ -236,7 +230,7 @@ For detailed documentation on publishing this package, see [PUBLISHING.md](./PUB
 ## Usage
 
 ```jsx
-import CustomTable from "./components/CustomTable";
+import IATable from "ia-table";
 
 // Sample data
 const data = [
@@ -281,7 +275,7 @@ const columns = [
 // Component implementation
 const MyTable = () => {
   return (
-    <CustomTable
+    <IATable
       data={data}
       columns={columns}
       height="500px"
@@ -296,23 +290,20 @@ const MyTable = () => {
 
 ## Props
 
-| Prop            | Type     | Default         | Description                                        |
-| --------------- | -------- | --------------- | -------------------------------------------------- |
-| `data`          | Array    | `[]`            | Array of data objects to display                   |
-| `columns`       | Array    | `[]`            | Column definitions                                 |
-| `height`        | String   | `'auto'`        | Table height                                       |
-| `uniqueIdField` | String   | `'store_code'`  | Field to use as unique row identifier              |
-| `childKeyField` | String   | `'status_obj1'` | Field containing child items for hierarchical data |
-| `showHeader`    | Boolean  | `true`          | Whether to show the table header                   |
-| `showFooter`    | Boolean  | `false`         | Whether to show the table footer                   |
-| `showToolbar`   | Boolean  | `true`          | Whether to show the toolbar                        |
-| `showFilters`   | Boolean  | `false`         | Whether to show the filter panel                   |
-| `selectable`    | Boolean  | `false`         | Enable row selection                               |
-| `expandable`    | Boolean  | `false`         | Enable row expansion                               |
-| `pagination`    | Boolean  | `false`         | Enable pagination                                  |
-| `pageSize`      | Number   | `10`            | Items per page when pagination is enabled          |
-| `onRowClick`    | Function | -               | Row click handler                                  |
-| `onCellClick`   | Function | -               | Cell click handler                                 |
+| Prop              | Type    | Default         | Description                                        |
+| ----------------- | ------- | --------------- | -------------------------------------------------- |
+| `data`            | Array   | `[]`            | Array of data objects to display                   |
+| `columns`         | Array   | `[]`            | Column definitions                                 |
+| `height`          | String  | `'auto'`        | Table height                                       |
+| `uniqueIdField`   | String  | `'store_code'`  | Field to use as unique row identifier              |
+| `childKeyField`   | String  | `'status_obj1'` | Field containing child items for hierarchical data |
+| `showHeader`      | Boolean | `true`          | Whether to show the table header                   |
+| `showFooter`      | Boolean | `false`         | Whether to show the table footer                   |
+| `showToolbar`     | Boolean | `true`          | Whether to show the toolbar                        |
+| `selectable`      | Boolean | `false`         | Enable row selection                               |
+| `expandable`      | Boolean | `false`         | Enable row expansion                               |
+| `pagination`      | Boolean | `false`         | Enable pagination                                  |
+| `defaultPageSize` | Number  | `10`            | Items per page when pagination is enabled          |
 
 ## Column Definition
 
@@ -321,111 +312,12 @@ interface ColumnDefinition {
   field: string; // The field name in the data object
   headerName: string; // The display name for the column header
   width?: number; // The width of the column in pixels (default: 100)
-  sortable?: boolean; // Whether the column is sortable (default: true)
+  isSortable?: boolean; // Whether the column is sortable (default: true)
   filterable?: boolean; // Whether the column is filterable (default: true)
   resizable?: boolean; // Whether the column can be resized (default: true)
   cellRenderer?: Function; // Custom cell renderer function
-  headerRenderer?: Function; // Custom header renderer function
   align?: "left" | "center" | "right"; // Text alignment (default: 'left')
   pinned?: boolean | "left"; // Whether the column is pinned (true = right, 'left' = left)
-  hidden?: boolean; // Whether the column is initially hidden
-  children?: ColumnDefinition[]; // Child columns for grouping headers
+  is_hidden?: boolean; // Whether the column is initially hidden
 }
 ```
-
-## Project Setup
-
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
-
-### Available Scripts
-
-In the project directory, you can run:
-
-#### `npm start`
-
-Runs the app in the development mode.\
-Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
-
-#### `npm test`
-
-Launches the test runner in the interactive watch mode.
-
-#### `npm run build`
-
-Builds the app for production to the `build` folder.
-
-# Advanced Data Caching System for React Tables
-
-A high-performance caching system for handling extremely large datasets (50M+ rows) in React applications with support for both pagination and infinite scrolling patterns.
-
-## Core Components
-
-- **InfiniteCache**: Block-based cache management with multiple purge strategies
-- **InfiniteRowModel**: Virtual row model to efficiently handle rows and viewport
-- **InfiniteDataSource**: Data provider with client-side and server-side implementations
-- **InfiniteBlock**: Data block for efficient memory management and cache operations
-- **StreamingDataAdapter**: Enables streaming large datasets in chunks
-- **LargeDataStorage**: Optimized storage for extremely large datasets
-- **LargeDataSourceAdapter**: Adapter for connecting large storage to data sources
-- **Web Workers**: Background processing for heavy operations
-  - `worker.js`: Standard worker for data processing
-  - `enhanced-worker.js`: WebAssembly-enhanced worker for extreme performance
-
-## Key Features
-
-- **Virtual Rendering**: Only renders visible rows with intelligent row recycling
-- **Block-Based Caching**: Stores data in blocks for efficient memory use
-- **Multiple Purge Strategies**:
-  - LRU (Least Recently Used)
-  - Furthest From Viewport
-  - Memory Optimized
-- **Persistence Options**: Save cache state between sessions
-- **Automatic Memory Management**: Monitors and optimizes memory usage
-- **Extreme Dataset Optimizations**:
-  - Web Worker offloading
-  - IndexedDB integration
-  - Binary data format
-  - Streaming data loading
-  - WebAssembly acceleration
-
-## Performance Characteristics
-
-- **Dataset Size**: Efficiently handles 50M+ rows
-- **Memory Usage**: Optimized for low memory footprint
-- **Rendering Performance**: Maintains 60fps scrolling
-- **Initial Load Time**: Fast initial loading with progressive enhancements
-- **Server-Side Operations**: Optimized for REST/GraphQL pagination
-
-## Usage
-
-The system can be used via the `useInfiniteCache` hook:
-
-```jsx
-const { visibleData, getRows, setVisibleRange, refreshCache, analytics } =
-  useInfiniteCache(data, {
-    threshold: 1000,
-    blockSize: 100,
-    maxBlocksInCache: 10,
-    enableEnhancedWorker: true,
-  });
-```
-
-Perfect for:
-
-- Data grids/tables
-- Virtual lists
-- Infinite scrolling feeds
-- Paginated data displays
-
-## Advanced Configuration
-
-- **Block Size**: Configure memory/performance tradeoff
-- **Cache Size**: Adjust total blocks kept in memory
-- **Worker Options**: Enable/disable WebAssembly optimization
-- **Storage Options**: Configure persistence and compression
-- **Streaming Options**: Fine-tune loading behavior
-- **IndexedDB Integration**: Offload memory pressure for extreme datasets
-
-## Industry Compatibility
-
-Implements the same caching architecture as AG Grid Enterprise (v27), ensuring familiar patterns and optimal performance for massive datasets.