[refactor] package name change

Author: rinturaj

.github/workflows/npm-publish.yml

@@ -30,7 +30,7 @@ jobs:
 
       - name: Publish to NPM
         run: |
-          cd dist/ngx-simple-datatable
+          cd dist/ngx-simple-datatables
           npm publish --access public
         env:
           NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}

README.md

@@ -2,9 +2,7 @@
 
 A lightweight, high-performance Angular data table component with features like virtual scrolling, column freezing, and customizable templates.
 
-
-
-![NgxSimpleDatatable Screenshot](projects/ngx-simple-datatable/assets/image.png)
+![NgxSimpleDatatable Screenshot](projects/ngx-simple-datatables/assets/image.png)
 
 ## Features
 
@@ -41,13 +39,13 @@ export class AppModule {}
 2. Use the component in your template:
 
 ```html
-<ngx-simple-datatable
+<ngx-simple-datatables
   [columns]="columns"
   [data]="data"
   [rowHeight]="40"
   [headerHeight]="50"
 >
-</ngx-simple-datatable>
+</ngx-simple-datatables>
 ```
 
 3. Define your columns and data in your component:
@@ -136,7 +134,7 @@ columns: ColumnConfig[] = [
 Use Angular templates to customize cell content:
 
 ```html
-<ngx-simple-datatable [columns]="columns" [data]="data">
+<ngx-simple-datatables [columns]="columns" [data]="data">
   <ng-template #cellTemplate let-row="row" let-column="column">
     <ng-container [ngSwitch]="column.field">
       <ng-container *ngSwitchCase="'status'">
@@ -152,23 +150,23 @@ Use Angular templates to customize cell content:
       <ng-container *ngSwitchDefault> {{ row[column.field] }} </ng-container>
     </ng-container>
   </ng-template>
-</ngx-simple-datatable>
+</ngx-simple-datatables>
 ```
 
 ### Custom Header Templates
 
 Customize header appearance and behavior:
 
 ```html
-<ngx-simple-datatable [columns]="columns" [data]="data">
+<ngx-simple-datatables [columns]="columns" [data]="data">
   <ng-template #headerTemplate let-column="column">
     <div class="custom-header">
       <i class="fas fa-info-circle" [title]="column.header"></i>
       <span>{{ column.header }}</span>
       <i class="fas fa-sort" *ngIf="column.sortable"></i>
     </div>
   </ng-template>
-</ngx-simple-datatable>
+</ngx-simple-datatables>
 ```
 
 ### Theming
@@ -265,17 +263,17 @@ You can customize the table appearance by overriding the following CSS custom pr
 
 ## Development
 
-Run `ng build ngx-simple-datatable` to build the library. The build artifacts will be stored in the `dist/` directory.
+Run `ng build ngx-simple-datatables` to build the library. The build artifacts will be stored in the `dist/` directory.
 
 ## Publishing
 
-After building your library with `ng build ngx-simple-datatable`, go to the dist folder `cd dist/ngx-simple-datatable` and run `npm publish`.
+After building your library with `ng build ngx-simple-datatables`, go to the dist folder `cd dist/ngx-simple-datatables` and run `npm publish`.
 
-After building your library with `ng build ngx-simple-datatable`, go to the dist folder `cd dist/ngx-simple-datatable` and run `npm publish`.
+After building your library with `ng build ngx-simple-datatables`, go to the dist folder `cd dist/ngx-simple-datatables` and run `npm publish`.
 
 ## Running unit tests
 
-Run `ng test ngx-simple-datatable` to execute the unit tests via [Karma](https://karma-runner.github.io).
+Run `ng test ngx-simple-datatables` to execute the unit tests via [Karma](https://karma-runner.github.io).
 
 ## Further help
 

angular.json

@@ -3,31 +3,31 @@
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
-    "ngx-simple-datatable": {
+    "ngx-simple-datatables": {
       "projectType": "library",
-      "root": "projects/ngx-simple-datatable",
-      "sourceRoot": "projects/ngx-simple-datatable/src",
+      "root": "projects/ngx-simple-datatables",
+      "sourceRoot": "projects/ngx-simple-datatables/src",
       "prefix": "lib",
       "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:ng-packagr",
           "options": {
-            "project": "projects/ngx-simple-datatable/ng-package.json"
+            "project": "projects/ngx-simple-datatables/ng-package.json"
           },
           "configurations": {
             "production": {
-              "tsConfig": "projects/ngx-simple-datatable/tsconfig.lib.prod.json"
+              "tsConfig": "projects/ngx-simple-datatables/tsconfig.lib.prod.json"
             },
             "development": {
-              "tsConfig": "projects/ngx-simple-datatable/tsconfig.lib.json"
+              "tsConfig": "projects/ngx-simple-datatables/tsconfig.lib.json"
             }
           },
           "defaultConfiguration": "production"
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
-            "tsConfig": "projects/ngx-simple-datatable/tsconfig.spec.json",
+            "tsConfig": "projects/ngx-simple-datatables/tsconfig.spec.json",
             "polyfills": [
               "zone.js",
               "zone.js/testing"

package-lock.json

@@ -1,11 +1,11 @@
 {
-  "name": "ngx-simple-datatable-workspace",
+  "name": "ngx-simple-datatables-workspace",
   "version": "1.17.0",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
-    "start:lib": "ng build ngx-simple-datatable --watch",
-    "build:lib": "ng build ngx-simple-datatable",
+    "start:lib": "ng build ngx-simple-datatables --watch",
+    "build:lib": "ng build ngx-simple-datatables",
     "build": "ng build",
     "watch": "ng build --watch --configuration development",
     "test": "ng test",

package.json

@@ -1,7 +1,7 @@
 <div class="app-container">
   <h1>Dynamic Table Example</h1>
   <div class="table-wrapper">
-    <ngx-simple-datatable [columns]="columns" [data]="data" [rowHeight]="26" [headerHeight]="26">
+    <ngx-simple-datatables [columns]="columns" [data]="data" [rowHeight]="26" [headerHeight]="26">
       <ng-template #headerTemplate let-column="column">
 
         <span class="custom-header">{{ column?.header }}</span>
@@ -22,7 +22,7 @@ <h1>Dynamic Table Example</h1>
         </div>
 
       </ng-template>
-    </ngx-simple-datatable>
+    </ngx-simple-datatables>
 
   </div>
 </div>

projects/example-app/src/app/app.component.html

@@ -1,13 +1,13 @@
 import { Component } from "@angular/core";
 import { RouterOutlet } from "@angular/router";
-import { NgxSimpleDatatableComponent } from "ngx-simple-datatable";
-import { ColumnConfig } from "../../../ngx-simple-datatable/src/interfaces/column-config.interface";
+import { ColumnConfig } from "../../../ngx-simple-datatables/src/interfaces/column-config.interface";
 import { CommonModule } from "@angular/common";
+import { NgxSimpleDatatablesComponent } from "../../../ngx-simple-datatables/src/public-api";
 
 @Component({
   selector: "app-root",
   standalone: true,
-  imports: [NgxSimpleDatatableComponent, CommonModule],
+  imports: [NgxSimpleDatatablesComponent, CommonModule],
   templateUrl: "./app.component.html",
   styleUrl: "./app.component.css",
 })