{"id":30635324,"url":"https://github.com/saiful-70/ngx-primeng-toolkit","last_synced_at":"2025-08-30T22:11:20.979Z","repository":{"id":309860880,"uuid":"1037785639","full_name":"saiful-70/ngx-primeng-toolkit","owner":"saiful-70","description":null,"archived":false,"fork":false,"pushed_at":"2025-08-21T07:55:20.000Z","size":113,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-08-21T09:44:29.696Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/saiful-70.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-08-14T05:52:00.000Z","updated_at":"2025-08-21T07:55:17.000Z","dependencies_parsed_at":"2025-08-14T08:33:38.660Z","dependency_job_id":"4e0b7362-9c75-48b3-9b6e-487e2903a197","html_url":"https://github.com/saiful-70/ngx-primeng-toolkit","commit_stats":null,"previous_names":["saiful-70/ngx-primeng-toolkit"],"tags_count":6,"template":false,"template_full_name":null,"purl":"pkg:github/saiful-70/ngx-primeng-toolkit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saiful-70%2Fngx-primeng-toolkit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saiful-70%2Fngx-primeng-toolkit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saiful-70%2Fngx-primeng-toolkit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saiful-70%2Fngx-primeng-toolkit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/saiful-70","download_url":"https://codeload.github.com/saiful-70/ngx-primeng-toolkit/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saiful-70%2Fngx-primeng-toolkit/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":272913729,"owners_count":25014321,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-30T02:00:09.474Z","response_time":77,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-08-30T22:02:27.628Z","updated_at":"2025-08-30T22:11:20.974Z","avatar_url":"https://github.com/saiful-70.png","language":"TypeScript","funding_links":[],"categories":["Third Party Components"],"sub_categories":["Mixed Utilities"],"readme":"# NGX PrimeNG Toolkit\n\nA comprehensive TypeScript utility library for Angular component state management, including PrimeNG table helpers, ng-select integration, data storage, and HTTP caching utilities with NgRx Signals. Compatible with **Angular 19+** and **PrimeNG 19+** (optimized for Angular 20+ and PrimeNG 20+).\n\n## ✨ Features\n\n- 🏗️ **Table State Management** - PrimeNG table helpers with lazy loading, filtering, and sorting\n- 🎛️ **NgSelect Integration** - Complete ng-select lifecycle with search \u0026 pagination\n- 💾 **Data Storage** - Memoized HTTP caching and component data management\n- 🎛️ **Component State** - Reactive state management for UI components\n- 🛠️ **Utility Functions** - Helper functions and TypeScript utility types\n- 📦 **Tree-shakeable** - Import only what you need\n- 🔒 **Type Safe** - Full TypeScript support with strict type checking\n\n## 🚀 Quick Start\n\n### Installation\n\n```bash\nnpm install ngx-primeng-toolkit\n```\n\n### Peer Dependencies\n\n```bash\n# Core dependencies (Angular 19+ supported, 20+ recommended)\nnpm install @angular/common@^19.0.0 @angular/core@^19.0.0 @ngrx/signals@^19.0.0 rxjs@^7.0.0\n\n# UI library dependencies (choose what you need)\nnpm install primeng@^19.0.0        # For PrimeNG table helpers\nnpm install @ng-select/ng-select@^15.0.0  # For ng-select helpers\n\n# Optional (for response validation)\nnpm install zod@^3.0.0\n```\n\n### Basic Usage\n\n```typescript\nimport { Component, inject } from '@angular/core';\nimport { HttpClient } from '@angular/common/http';\nimport { PrimeNgDynamicTableStateHelper } from 'ngx-primeng-toolkit';\n\ninterface User {\n  id: number;\n  name: string;\n  email: string;\n}\n\n@Component({\n  selector: 'app-user-table',\n  template: `\n    \u003cp-table \n      [value]=\"tableState.data()\"\n      [lazy]=\"true\"\n      [loading]=\"tableState.isLoading()\"\n      [totalRecords]=\"tableState.totalRecords()\"\n      [paginator]=\"true\"\n      [rows]=\"10\"\n      (onLazyLoad)=\"tableState.onLazyLoad($event)\"\u003e\n      \n      \u003cng-template pTemplate=\"header\"\u003e\n        \u003ctr\u003e\n          \u003cth pSortableColumn=\"name\"\u003eName\u003c/th\u003e\n          \u003cth pSortableColumn=\"email\"\u003eEmail\u003c/th\u003e\n        \u003c/tr\u003e\n      \u003c/ng-template\u003e\n      \n      \u003cng-template pTemplate=\"body\" let-user\u003e\n        \u003ctr\u003e\n          \u003ctd\u003e{{ user.name }}\u003c/td\u003e\n          \u003ctd\u003e{{ user.email }}\u003c/td\u003e\n        \u003c/tr\u003e\n      \u003c/ng-template\u003e\n    \u003c/p-table\u003e\n  `\n})\nexport class UserTableComponent {\n  private httpClient = inject(HttpClient);\n  \n  readonly tableState = PrimeNgDynamicTableStateHelper.create\u003cUser\u003e({\n    url: '/api/users/query',\n    httpClient: this.httpClient\n  });\n}\n```\n\n## 📚 Documentation\n\n### Core Features\n- **[Table State Management](./docs/table-state-management.md)** - PrimeNG table helpers with lazy loading, filtering, and sorting\n- **[Data Storage](./docs/data-storage.md)** - Memoized HTTP caching and component data management\n- **[Component State](./docs/component-state.md)** - Reactive state management for UI components\n- **[NgSelect Integration](./docs/ng-select-integration.md)** - Complete ng-select lifecycle with search \u0026 pagination\n- **[Utility Functions](./docs/utility-functions.md)** - Helper functions and TypeScript utility types\n\n### Examples\n- **[Complete Examples](./docs/examples/)** - Comprehensive examples and integration patterns\n- **[API Integration](./docs/table-state-management.md#api-integration)** - Expected request/response formats\n- **[Best Practices](./docs/table-state-management.md#best-practices)** - Performance tips and recommendations\n\n## 🔗 Key Concepts\n\n### API Response Format\n```typescript\ninterface ApiResponse\u003cT\u003e {\n  data: T[];           // Array of table row data\n  last_row: number;    // Total number of records\n}\n```\n\n### Filter Types Mapping\nThe library maps PrimeNG filter types to backend operations:\n- `contains` → `like`\n- `equals` → `=`\n- `startsWith` → `starts`\n- `greaterThan` → `\u003e`\n- And many more...\n\n### TypeScript Support\nFull generic typing for type-safe development:\n```typescript\nconst tableState = PrimeNgDynamicTableStateHelper.create\u003cUser\u003e({\n  url: '/api/users',\n  httpClient: this.httpClient\n});\n// tableState.data() is typed as Signal\u003cUser[]\u003e\n```\n\n## License\n\nMIT License - see LICENSE file for details.\n\n## Contributing\n\nContributions are welcome! Please read our contributing guidelines and submit pull requests to our GitHub repository.\n\n## Support\n\nFor issues and questions, please use the GitHub issues page.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsaiful-70%2Fngx-primeng-toolkit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsaiful-70%2Fngx-primeng-toolkit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsaiful-70%2Fngx-primeng-toolkit/lists"}