tangrid 0.1.0

package/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2026 infinity2zero
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+

package/README.md

@@ -0,0 +1,124 @@
+<p align="center">
+  <a href="https://infinity2zero.github.io/tanGrid/">
+    <img src="demo/src/public/images/tanGrid-logo.png" alt="tanGrid Logo" width="250" />
+  </a>
+</p>
+
+<p align="center">
+  <a href="https://infinity2zero.github.io/tanGrid/">
+    <img src="https://img.shields.io/badge/Docs-Demo-blue?style=for-the-badge&logo=github" alt="Docs & Demo" />
+  </a>
+</p>
+
+# <span style="color:#0B2447">tan</span><span style="color:#20B2AA">Grid</span>
+
+A powerful, feature-rich, and highly customizable data table component for Angular, built on top of the headless UI library [TanStack Table](https://tanstack.com/table/v8).
+
+## Introduction
+
+`TanGrid` provides a production-grade data table solution that combines the power and flexibility of TanStack Table with the ease of use of a pre-built Angular component. It is designed to handle complex data scenarios with ease, offering features like virtual scrolling, column reordering, server-side operations, and extensive theming capabilities out of the box.
+
+Key design principles:
+- **Headless Core**: Leverages TanStack Table for logic, ensuring robustness and flexibility.
+- **Performance**: Optimized for large datasets with virtual scrolling support via `@tanstack/angular-virtual`.
+- **Developer Experience**: Extensive API with typed interfaces and intuitive configuration.
+- **Modern Angular**: Built with Standalone Components and Signals for optimal performance.
+
+## Key Features
+
+- **🚀 High Performance**: Virtual scrolling support for rendering thousands of rows efficiently.
+- **🔄 Sorting & Filtering**: Multi-column sorting and global/column-specific filtering.
+- **📄 Pagination**: Built-in pagination with customizable page sizes.
+- **👆 Selection**: Single and multiple row selection modes.
+- **↔️ Column Reordering**: Drag-and-drop column reordering using SortableJS.
+- **📌 Column Pinning**: Pin columns to the left or right.
+- **✏️ Inline Editing**: Edit cell values directly within the table.
+- **📂 Row Expansion**: Expandable rows for showing detailed information.
+- **📤 Exporting**: Built-in support for exporting data to CSV, Excel, and PDF.
+- **🎨 Theming**: Multiple built-in themes (Material, Bootstrap, Ant Design) and SCSS customization.
+- **🌐 Server-side Support**: Full support for server-side sorting, filtering, and pagination.
+
+## Installation
+
+Install the package and its required peer dependencies:
+
+```bash
+npm install tangrid @tanstack/angular-table @tanstack/angular-virtual sortablejs
+```
+
+Ensure you also have `@angular/cdk` installed if you plan to use specific features that might rely on it (though the core virtual scroll now uses TanStack Virtual).
+
+```bash
+npm install @angular/cdk
+```
+
+## Basic Usage
+
+Import `TanGrid` in your component:
+
+```typescript
+import { Component } from '@angular/core';
+import { TanGrid, TanGridColumn } from 'tangrid';
+
+interface User {
+  id: number;
+  name: string;
+  email: string;
+  role: string;
+}
+
+@Component({
+  selector: 'app-users-table',
+  standalone: true,
+  imports: [TanGrid],
+  template: `
+    <tan-grid
+      [data]="users"
+      [columns]="columns"
+      [pagination]="true"
+      [sorting]="true"
+      [filtering]="true"
+      globalFilterPlaceholder="Search users..."
+    ></tan-grid>
+  `,
+})
+export class UsersTableComponent {
+  users: User[] = [
+    { id: 1, name: 'John Doe', email: 'john@example.com', role: 'Admin' },
+    { id: 2, name: 'Jane Smith', email: 'jane@example.com', role: 'User' },
+    // ... more data
+  ];
+
+  columns: TanGridColumn<User>[] = [
+    { header: 'ID', accessorKey: 'id', width: '50px' },
+    { header: 'Name', accessorKey: 'name', sortable: true, filterable: true },
+    { header: 'Email', accessorKey: 'email' },
+    { 
+      header: 'Role', 
+      accessorKey: 'role',
+      cell: (ctx) => `<span class="badge">${ctx.row.role}</span>` // Or use a TemplateRef
+    },
+  ];
+}
+```
+
+## API Reference
+
+### `<tan-grid>` Component
+
+#### Inputs
+
+| Input | Type | Default | Description |
+|-------|------|---------|-------------|
+| `data` | `T[]` | `[]` | Array of data objects to display. |
+| `columns` | `TanGridColumn<T>[]` | `[]` | Column definitions. |
+| `pagination` | `boolean` | `false` | Enable pagination. |
+| `sorting` | `boolean` | `false` | Enable sorting. |
+| `filtering` | `boolean` | `false` | Enable filtering. |
+
+## License
+
+This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
+
+## Author
+Created by **infinity2zero**.

package/config/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+/// <amd-module name="tangrid/config" />
+export * from './public-api';

package/config/ngs-config.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+/**
+ * Configuration service for tanGrid components.
+ * Provides global configuration options.
+ */
+export declare class NgsConfig {
+    /**
+     * If `true`, animations will be enabled globally for all components.
+     * Individual components can override this setting.
+     *
+     * @default true
+     */
+    animation: boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NgsConfig, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<NgsConfig>;
+}

package/config/public-api.d.ts

@@ -0,0 +1 @@
+export { NgsConfig } from './ngs-config';

package/esm2022/config/ngs-config.mjs

@@ -0,0 +1,24 @@
+import { Injectable } from '@angular/core';
+import * as i0 from "@angular/core";
+/**
+ * Configuration service for tanGrid components.
+ * Provides global configuration options.
+ */
+export class NgsConfig {
+    constructor() {
+        /**
+         * If `true`, animations will be enabled globally for all components.
+         * Individual components can override this setting.
+         *
+         * @default true
+         */
+        this.animation = true;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgsConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgsConfig, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgsConfig, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmdzLWNvbmZpZy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb25maWcvbmdzLWNvbmZpZy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQUUzQzs7O0dBR0c7QUFFSCxNQUFNLE9BQU8sU0FBUztJQUR0QjtRQUVDOzs7OztXQUtHO1FBQ0gsY0FBUyxHQUFHLElBQUksQ0FBQztLQUNqQjs4R0FSWSxTQUFTO2tIQUFULFNBQVMsY0FESSxNQUFNOzsyRkFDbkIsU0FBUztrQkFEckIsVUFBVTttQkFBQyxFQUFFLFVBQVUsRUFBRSxNQUFNLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJbmplY3RhYmxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbi8qKlxuICogQ29uZmlndXJhdGlvbiBzZXJ2aWNlIGZvciB0YW5HcmlkIGNvbXBvbmVudHMuXG4gKiBQcm92aWRlcyBnbG9iYWwgY29uZmlndXJhdGlvbiBvcHRpb25zLlxuICovXG5ASW5qZWN0YWJsZSh7IHByb3ZpZGVkSW46ICdyb290JyB9KVxuZXhwb3J0IGNsYXNzIE5nc0NvbmZpZyB7XG5cdC8qKlxuXHQgKiBJZiBgdHJ1ZWAsIGFuaW1hdGlvbnMgd2lsbCBiZSBlbmFibGVkIGdsb2JhbGx5IGZvciBhbGwgY29tcG9uZW50cy5cblx0ICogSW5kaXZpZHVhbCBjb21wb25lbnRzIGNhbiBvdmVycmlkZSB0aGlzIHNldHRpbmcuXG5cdCAqXG5cdCAqIEBkZWZhdWx0IHRydWVcblx0ICovXG5cdGFuaW1hdGlvbiA9IHRydWU7XG59XG5cbiJdfQ==

package/esm2022/config/public-api.mjs

@@ -0,0 +1,2 @@
+export { NgsConfig } from './ngs-config';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9jb25maWcvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sY0FBYyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IHsgTmdzQ29uZmlnIH0gZnJvbSAnLi9uZ3MtY29uZmlnJztcblxuIl19

package/esm2022/config/tangrid-config.mjs

@@ -0,0 +1,5 @@
+/**
+ * Generated bundle index. Do not edit.
+ */
+export * from './public-api';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFuZ3JpZC1jb25maWcuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9zcmMvY29uZmlnL3RhbmdyaWQtY29uZmlnLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsY0FBYyxjQUFjLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEdlbmVyYXRlZCBidW5kbGUgaW5kZXguIERvIG5vdCBlZGl0LlxuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vcHVibGljLWFwaSc7XG4iXX0=

package/esm2022/index.mjs

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { TanGridModule } from './table/public-api';
+import * as i0 from "@angular/core";
+export * from './table/public-api';
+export { NgsConfig } from './config/public-api';
+export { NgsThemeService } from './theme/public-api';
+const NGS_MODULES = [TanGridModule];
+export class NgsModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.7", ngImport: i0, type: NgsModule, imports: [TanGridModule], exports: [TanGridModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgsModule, imports: [NGS_MODULES, TanGridModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.7", ngImport: i0, type: NgsModule, decorators: [{
+            type: NgModule,
+            args: [{ imports: NGS_MODULES, exports: NGS_MODULES }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUV6QyxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7O0FBRW5ELGNBQWMsb0JBQW9CLENBQUM7QUFFbkMsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQ2hELE9BQU8sRUFBRSxlQUFlLEVBQWlCLE1BQU0sb0JBQW9CLENBQUM7QUFFcEUsTUFBTSxXQUFXLEdBQUcsQ0FBQyxhQUFhLENBQUMsQ0FBQztBQUdwQyxNQUFNLE9BQU8sU0FBUzs4R0FBVCxTQUFTOytHQUFULFNBQVMsWUFIRCxhQUFhLGFBQWIsYUFBYTsrR0FHckIsU0FBUyxZQURELFdBQVcsRUFGWCxhQUFhOzsyRkFHckIsU0FBUztrQkFEckIsUUFBUTttQkFBQyxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsT0FBTyxFQUFFLFdBQVcsRUFBRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IFRhbkdyaWRNb2R1bGUgfSBmcm9tICcuL3RhYmxlL3B1YmxpYy1hcGknO1xuXG5leHBvcnQgKiBmcm9tICcuL3RhYmxlL3B1YmxpYy1hcGknO1xuXG5leHBvcnQgeyBOZ3NDb25maWcgfSBmcm9tICcuL2NvbmZpZy9wdWJsaWMtYXBpJztcbmV4cG9ydCB7IE5nc1RoZW1lU2VydmljZSwgdHlwZSBOZ3NUaGVtZSB9IGZyb20gJy4vdGhlbWUvcHVibGljLWFwaSc7XG5cbmNvbnN0IE5HU19NT0RVTEVTID0gW1RhbkdyaWRNb2R1bGVdO1xuXG5ATmdNb2R1bGUoeyBpbXBvcnRzOiBOR1NfTU9EVUxFUywgZXhwb3J0czogTkdTX01PRFVMRVMgfSlcbmV4cG9ydCBjbGFzcyBOZ3NNb2R1bGUge31cblxuIl19

package/esm2022/table/public-api.mjs

@@ -0,0 +1,4 @@
+export * from './table.component';
+export * from './table.types';
+export * from './table.module';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy90YWJsZS9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsbUJBQW1CLENBQUM7QUFDbEMsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxnQkFBZ0IsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vdGFibGUuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vdGFibGUudHlwZXMnO1xuZXhwb3J0ICogZnJvbSAnLi90YWJsZS5tb2R1bGUnO1xuXG4iXX0=