@ibsheet/angular - npm Package Compare versions

Comparing version 1.0.4 to 1.0.5

CHANGELOG.md

@@ -5,2 +5,4 @@ # Changelog
 
+### [1.0.5](https://github.com/ibsheet/ibsheet-angular-component/compare/v1.0.4...v1.0.5) (2025-09-26)
+
 ### [1.0.4](https://github.com/ibsheet/ibsheet-angular-component/compare/v1.0.3...v1.0.4) (2025-08-27)
@@ -7,0 +9,0 @@

package.json

 {
   "name": "@ibsheet/angular",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "license": "MIT",
@@ -28,5 +28,2 @@ "author": "IB Leaders <[e-mail]>",
       "require": "./fesm2022/ibsheet-angular.mjs"
-    },
-    "./package.json": {
-      "default": "./package.json"
     }
@@ -40,3 +37,3 @@ },
     "tslib": ">=2.3.0",
-    "@ibsheet/interface": ">=1.0.0"
+    "@ibsheet/interface": "latest"
   },
@@ -43,0 +40,0 @@ "sideEffects": [

README.md

@@ -45,3 +45,2 @@ # ibsheet-angular
     <div>
-      <h1>My Spreadsheet</h1>
       <ibsheet-angular [options]="sheetOptions" [data]="sheetData"> </ibsheet-angular>
@@ -58,3 +57,3 @@ </div>
     Cols: [
-      { Header: "ID", Type: "Text", Name: "id" },
+      { Header: "ID", Type: "Text", Name: "sId" },
       { Header: "Name", Type: "Text", Name: "name" },
@@ -66,4 +65,4 @@ { Header: "Age", Type: "Int", Name: "age" },
   sheetData = [
-    { id: "1", name: "John Doe", age: 30 },
-    { id: "2", name: "Jane Smith", age: 25 },
+    { sId: "1", name: "John Doe", age: 30 },
+    { sId: "2", name: "Jane Smith", age: 25 },
   ];
@@ -73,2 +72,4 @@ }
 
+Example: https://stackblitz.com/edit/stackblitz-starters-e5wa2tt7
+
 ### Advanced Usage with Event Handling
@@ -78,5 +79,14 @@
 import { Component } from "@angular/core";
-import { IBSheetAngular, IB_Preset, type IBSheetInstance, type IBSheetOptions, type IBSheetEvents } from "@ibsheet/angular";
+import { 
+  IBSheetAngular, 
+  IB_Preset, 
+  type IBSheetInstance, 
+  type IBSheetOptions, 
+  type IBSheetEvents 
+} from "@ibsheet/angular";
 
-type OnAfterChangeParam = Parameters<NonNullable<IBSheetEvents["onAfterChange"]>>[0];
+const handleAfterChange: IBSheetEvents['onAfterChange'] = (param) => { 
+  // The type of the parameter is automatically inferred.
+  console.log('Data changed value:', param.val); 
+};
 
@@ -90,4 +100,4 @@ @Component({
       <div>
-        <button (click)="addRow()">Add Row</button>
-        <button (click)="getDataRows()">Get DataRows</button>
+        <button (click)="handleAddRow()">Add Row</button>
+        <button (click)="handleExportExcel()">Export Excel</button>
       </div>
@@ -100,3 +110,3 @@
 export class AdvancedComponent {
-  private sheet: IBSheetInstance | undefined;
+  private mySheet: IBSheetInstance | undefined;
 
@@ -110,9 +120,10 @@ sheetOptions: IBSheetOptions = {
     Cols: [
-      { Header: "ID", Type: "Text", Name: "id" },
+      { Header: "ID", Type: "Text", Name: "sId" },
       { Header: "Name", Type: "Text", Name: "name" },
       { Header: "Age", Type: "Int", Name: "age" },
-      { Header: "Ymd", Name: "sDate_Ymd", Extend: IB_Preset.YMD, Width: 110 },
-      { Header: "Ym", Name: "sDate_Ym", Extend: IB_Preset.YM, Width: 90 },
-      { Header: "Md", Name: "sDate_Md", Extend: IB_Preset.MD, Width: 90 },
+      { Header: "Ymd", Name: "sDate_Ymd", Extend: IB_Preset.YMD, Width: 110 }
     ],
+    Events: {
+      onAfterChange: handleAfterChange
+    }
   };
@@ -122,2 +133,4 @@
     // Your data
+    { sId: '1', name: 'John Doe', age: 30, sDate_Ymd: '20250923' },
+    { sId: '2', name: 'Jane Smith', age: 25, sDate_Ymd: '20251002' }
   ];
@@ -131,24 +144,18 @@
 
-  getInstance(obj: IBSheetInstance): void {
-    console.log("Sheet instance ready:", obj);
-    this.sheet = obj;
-
-    // Set up event listeners or perform initial operations
-    if (this.sheet.addEventListener) {
-      this.sheet.addEventListener("onAfterChange", (event: OnAfterChangeParam) => {
-        console.log("Data changed value:", event.val);
-      });
-    }
+  getInstance(sheet: IBSheetInstance): void {
+    // You can store the sheet instance or perform initial operations
+    this.mySheet = sheet;
   }
 
-  addRow(): void {
-    if (this.sheet && this.sheet.addRow) {
-      this.sheet.addRow();
+  handleAddRow(): void {
+    if (this.mySheet) {
+      this.mySheet.addRow();
     }
   }
 
-  getDataRows(): void {
-    if (this.sheet && this.sheet.getDataRows) {
-      const data = this.sheet.getDataRows();
-      console.log("Sheet data:", data);
+  handleExportExcel(): void {
+    if (this.mySheet) {
+      // exportData method requires the jsZip library
+      // When checking for the jsZip library, if it hasn't been loaded separately, the file at ./plugins/jszip.min.js (relative to ibsheet.js) will be loaded automatically.
+      this.mySheet.exportData({fileName:'ibsheet_angular_export_example.xlsx'});
     }
@@ -159,2 +166,4 @@ }
 
+Example: https://stackblitz.com/edit/stackblitz-starters-y4wxdjox
+
 ### Reuse existing IBSheet instances
@@ -161,0 +170,0 @@

No alert changes

Improved metrics

Total package byte prevSize

32769

0.88%

Number of lines in readme file

340

2.72%

Dependency changes

• Updated

  @ibsheet/interface@latest