{"_id":"@emertola/win-primetail-datatable","_rev":"4-77932815c2677648838057742d00eb5f","name":"@emertola/win-primetail-datatable","dist-tags":{"latest":"1.0.3"},"versions":{"1.0.0":{"name":"@emertola/win-primetail-datatable","version":"1.0.0","author":{"name":"Win emertola@gmail.com"},"_id":"@emertola/win-primetail-datatable@1.0.0","maintainers":[{"name":"emertola","email":"emertola@gmail.com"}],"dist":{"shasum":"75bb4677675f1d6fa4a40cd8a8335687db71537b","tarball":"https://registry.npmjs.org/@emertola/win-primetail-datatable/-/win-primetail-datatable-1.0.0.tgz","fileCount":9,"integrity":"sha512-WUWHuGhc2X1N2N5raj4cdIu1WobVvluunDKDz1fcMHJSG9YYUVcswvFNLdqT22x/Be8T7tG0Q4N3mwKUrURk2w==","signatures":[{"sig":"MEQCIDL49f/aIM4Ni1eW/9yq3Us9cQPkD5dSmc0TG0veV91MAiBCzxvF4hLLFW9va1WjnsN04OWh6fSS4Iotw2pXbTUZBQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":52283},"module":"fesm2022/emertola-win-primetail-datatable.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/emertola-win-primetail-datatable.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"af55fc5c3d4809cd06f19485c19041496dd7dc7b","typings":"index.d.ts","_npmUser":{"name":"emertola","actor":{"name":"emertola","type":"user","email":"emertola@gmail.com"},"email":"emertola@gmail.com"},"_npmVersion":"10.5.0","description":"A reusable Angular DataTable component with PrimeNG and Tailwind CSS","directories":{},"sideEffects":false,"_nodeVersion":"20.12.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"primeng":"^19.0.8","primeicons":"^7.0.0","@angular/core":"^19.0.0","@angular/common":"^19.0.0","tailwindcss-primeui":"^0.5.1"},"_npmOperationalInternal":{"tmp":"tmp/win-primetail-datatable_1.0.0_1751700011809_0.6926531594404906","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@emertola/win-primetail-datatable","version":"1.0.1","author":{"name":"Win emertola@gmail.com"},"_id":"@emertola/win-primetail-datatable@1.0.1","maintainers":[{"name":"emertola","email":"emertola@gmail.com"}],"dist":{"shasum":"2261abeed67a7e26f36829367c90346685c9de8f","tarball":"https://registry.npmjs.org/@emertola/win-primetail-datatable/-/win-primetail-datatable-1.0.1.tgz","fileCount":10,"integrity":"sha512-KWvvtS+ZDA+QqBdrUNZcDob6WgWP+tIHvpI+kTjYkZKJ3cHd0sFJw9YcSKUhEL1gq4UU9LKTeT8+aJAK4ZpKUQ==","signatures":[{"sig":"MEYCIQDMTtaImkWE3ft4HDsqpDqLXb9vJsWYnpYbik3NF8kpyAIhAK/bGPfzyBC5ElSKunyOial6dhkEnEodAhnZWmUOcijD","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":52454},"module":"fesm2022/emertola-win-primetail-datatable.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/emertola-win-primetail-datatable.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"af55fc5c3d4809cd06f19485c19041496dd7dc7b","typings":"index.d.ts","_npmUser":{"name":"emertola","actor":{"name":"emertola","type":"user","email":"emertola@gmail.com"},"email":"emertola@gmail.com"},"_npmVersion":"10.5.0","description":"A reusable Angular DataTable component with PrimeNG and Tailwind CSS","directories":{},"sideEffects":false,"_nodeVersion":"20.12.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"primeng":"^19.0.8","primeicons":"^7.0.0","@angular/core":"^19.0.0","@angular/common":"^19.0.0","tailwindcss-primeui":"^0.5.1"},"_npmOperationalInternal":{"tmp":"tmp/win-primetail-datatable_1.0.1_1751705750201_0.500928135453564","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@emertola/win-primetail-datatable","version":"1.0.2","author":{"name":"Win emertola@gmail.com"},"_id":"@emertola/win-primetail-datatable@1.0.2","maintainers":[{"name":"emertola","email":"emertola@gmail.com"}],"dist":{"shasum":"e1e99d9a15362724025ccf5a96162aa3c9697082","tarball":"https://registry.npmjs.org/@emertola/win-primetail-datatable/-/win-primetail-datatable-1.0.2.tgz","fileCount":10,"integrity":"sha512-TQuqbD5WoiN6Q2sPUcuV8Y7XSjk++6FJhCvz3ZAm+OrKaeGXB20hQCxbg4UqjvUTuvrftS8fS757DczR4jnQmA==","signatures":[{"sig":"MEQCIFpe2thBdIT7fQwNqM4BlXhGoQ/NtygtGUy5ZndBpIAxAiAnSdMk5rJx8mZStvxu8gnqgfPFkm1NqclitMaXqEiYcA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":128132},"module":"fesm2022/emertola-win-primetail-datatable.mjs","exports":{".":{"types":"./index.d.ts","default":"./fesm2022/emertola-win-primetail-datatable.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"af55fc5c3d4809cd06f19485c19041496dd7dc7b","typings":"index.d.ts","_npmUser":{"name":"emertola","actor":{"name":"emertola","type":"user","email":"emertola@gmail.com"},"email":"emertola@gmail.com"},"_npmVersion":"10.5.0","description":"A reusable Angular DataTable component with PrimeNG and Tailwind CSS","directories":{},"sideEffects":false,"_nodeVersion":"20.12.0","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"primeng":"^19.0.8","primeicons":"^7.0.0","tailwindcss":"^3.4.17","@angular/core":"^19.0.0","@angular/common":"^19.0.0","tailwindcss-primeui":"^0.5.1"},"_npmOperationalInternal":{"tmp":"tmp/win-primetail-datatable_1.0.2_1751707928682_0.28736370449930004","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@emertola/win-primetail-datatable","version":"1.0.3","description":"A reusable Angular DataTable component with PrimeNG and Tailwind CSS","author":{"name":"Win emertola@gmail.com"},"peerDependencies":{"@angular/common":"^19.0.0","@angular/core":"^19.0.0","primeicons":"^7.0.0","primeng":"^19.0.8","tailwindcss":"^3.4.17","tailwindcss-primeui":"^0.5.1"},"dependencies":{"tslib":"^2.3.0"},"sideEffects":false,"module":"fesm2022/emertola-win-primetail-datatable.mjs","typings":"index.d.ts","exports":{"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","default":"./fesm2022/emertola-win-primetail-datatable.mjs"}},"_id":"@emertola/win-primetail-datatable@1.0.3","gitHead":"af55fc5c3d4809cd06f19485c19041496dd7dc7b","_nodeVersion":"20.12.0","_npmVersion":"10.5.0","dist":{"integrity":"sha512-vhwOwQxUM+K8fNHHRXZRy34UbUyV5Hm9yN9EAx71Wfi7LtIPgHbyBpZCkBjb2WXNRsVYDtpROCxtCo2JuUJasg==","shasum":"f2e549500048023a3d3b48bf09e998639db9d393","tarball":"https://registry.npmjs.org/@emertola/win-primetail-datatable/-/win-primetail-datatable-1.0.3.tgz","fileCount":10,"unpackedSize":130121,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIHj3RnxaxFglJkxTgfvmA+Kd+kDpsESJwjPhg88SR1q+AiEAr0HvMhlVLlu2DiIcY3Fztc2+LUPcSSYosWXSDC+wbu0="}]},"_npmUser":{"name":"emertola","email":"emertola@gmail.com","actor":{"name":"emertola","email":"emertola@gmail.com","type":"user"}},"directories":{},"maintainers":[{"name":"emertola","email":"emertola@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/win-primetail-datatable_1.0.3_1751851515777_0.9527354908246557"},"_hasShrinkwrap":false}},"time":{"created":"2025-07-05T07:20:11.715Z","modified":"2025-07-07T01:25:16.205Z","1.0.0":"2025-07-05T07:20:11.989Z","1.0.1":"2025-07-05T08:55:50.423Z","1.0.2":"2025-07-05T09:32:08.856Z","1.0.3":"2025-07-07T01:25:15.996Z"},"author":{"name":"Win emertola@gmail.com"},"description":"A reusable Angular DataTable component with PrimeNG and Tailwind CSS","maintainers":[{"name":"emertola","email":"emertola@gmail.com"}],"readme":"# WinPrimetailDatatable\r\n\r\nA powerful, reusable Angular 19 DataTable component built with PrimeNG and Tailwind CSS.\r\n\r\n## Installation\r\n\r\n```bash\r\nnpm install @emertola/win-primetail-datatable primeng@19.0.8 primeicons@7.0.0 @primeng/themes@19.0.5  tailwindcss-primeui@0.5.1\r\nnpm install postcss@8.4.49 autoprefixer@10.4.20 tailwindcss@3.4.17 --save-dev\r\n// add --legacy-peer-deps if peer dependency error occurs\r\n```\r\n\r\n## Usage\r\n\r\n```bash\r\nimport { WinPrimeTailDataTable } from '@emertola/win-primetail-datatable';\r\n\r\ninterface TableColumn {\r\n  field: string;\r\n  header: string;\r\n  sortable?: boolean;\r\n  filterable?: boolean;\r\n  sortField?: string;\r\n  width?: string;\r\n  render?: (row: any) => string;\r\n}\r\n\r\n@Component({\r\n  selector: 'app-example',\r\n  imports: [WinPrimeTailDataTable],\r\n  template: `\r\n    <win-primetail-datatable\r\n\t  [dataSource]=\"mockData\"\r\n\t  [columns]=\"columns\"\r\n\t  [showAction]=\"true\"\r\n\t  [hasViewAction]=\"true\"\r\n      [hasEditAction]=\"true\"\r\n      [hasDeleteAction]=\"true\"\r\n\t  [isPaginated]=\"true\"\r\n\t  [entityName]=\"'Test Application'\"></win-primetail-datatable>\r\n  `\r\n})\r\nexport class ExampleComponent {\r\n  columns: TableColumn[] = [\r\n\t{ header: 'Name', field: 'name' },\r\n\t{ header: 'Mobile', field: 'mobile' },\r\n\t{ header: 'Email', field: 'email' }\r\n  ];\r\n\r\n  mockData = [{ id: 1, name: 'John Doe', mobile: '+6390187892', email: 'jdoe@mailinator.com' }];\r\n}\r\n```\r\n\r\n## Import Styles\r\n```bash\r\n// styles.scss\r\n@use \"primeicons/primeicons.css\";\r\n\r\n@tailwind base;\r\n@tailwind components;\r\n@tailwind utilities;\r\n\r\n```\r\n\r\nIf you are using VSCode and get a warning about `Unknown at rule` on the @tailwind, go to the `settings.json` file and add the following:\r\n```bash\r\n\"css.validate\": false,\r\n\"scss.validate\": false,\r\n\"less.validate\": false,\r\n\"files.associations\": {\r\n  \"*.css\": \"tailwindcss\",\r\n  \"*.scss\": \"tailwindcss\"\r\n}\r\n```\r\n\r\nAdd `tailwind.config.js` file to your angular root project containing the following:\r\n```bash\r\nexport default {\r\n    darkMode: ['selector', '[class=\"app-dark\"]'],\r\n    content: ['./src/**/*.{html,ts,scss,css}', './index.html'],\r\n    plugins: [PrimeUI]\r\n};\r\n```\r\n\r\nUpdate your `app.config.ts`:\r\n```bash\r\n// add the following to your app.config.ts\r\nprovideAnimationsAsync(),\r\nprovidePrimeNG({\r\n  theme: { preset: Aura, options: { darkModeSelector: '.app-dark' } },\r\n})\r\n\r\n// Example\r\nimport { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';\r\nimport { provideRouter } from '@angular/router';\r\nimport { routes } from './app.routes';\r\nimport { providePrimeNG } from 'primeng/config';\r\nimport { provideAnimationsAsync } from '@angular/platform-browser/animations/async';\r\nimport Aura from '@primeng/themes/aura';\r\n\r\nexport const appConfig: ApplicationConfig = {\r\n  providers: [\r\n    provideZoneChangeDetection({ eventCoalescing: true }),\r\n    provideRouter(routes),\r\n    provideAnimationsAsync(),\r\n    providePrimeNG({\r\n      theme: { preset: Aura, options: { darkModeSelector: '.app-dark' } },\r\n    }),\r\n  ],\r\n};\r\n```\r\n\r\nTest your app by running `ng serve` or your custom command script.\r\n","readmeFilename":"README.md"}