gridjs-spreadsheet 23.4.0 → 23.4.2

package/index.d.ts

@@ -0,0 +1,199 @@
+declare module 'gridjs-spreadsheet' {
+  export interface Options {
+    mode?: 'edit' | 'read';
+    showToolbar?: boolean;
+    showGrid?: boolean;
+    showContextmenu?: boolean;
+    showFileName?: boolean;
+    local?:string;
+    view?: {
+      height: () => number;
+      width: () => number;
+    };
+    row?: {
+      len: number;
+      height: number;
+    };
+    col?: {
+      len: number;
+      width: number;
+      indexWidth: number;
+      minWidth: number;
+    };
+    style?: {
+      bgcolor: string;
+      align: 'left' | 'center' | 'right';
+      valign: 'top' | 'middle' | 'bottom';
+      textwrap: boolean;
+      strike: boolean;
+      underline: boolean;
+      color: string;
+      font: {
+        name: 'Helvetica';
+        size: number;
+        bold: boolean;
+        italic: false;
+      };
+    };
+  }
+
+  export type CELL_SELECTED = 'cell-selected';
+  export type CELLS_SELECTED = 'cells-selected';
+  export type CELL_EDITED = 'cell-edited';
+
+  export type CellMerge = [number, number];
+
+  export interface SpreadsheetEventHandler {
+    (
+      envt: CELL_SELECTED,
+      callback: (cell: Cell, rowIndex: number, colIndex: number) => void
+    ): void;
+    (
+      envt: CELLS_SELECTED,
+      callback: (
+        cell: Cell,
+        parameters: { sri: number; sci: number; eri: number; eci: number }
+      ) => void
+    ): void;
+    (
+      evnt: CELL_EDITED,
+      callback: (text: string, rowIndex: number, colIndex: number) => void
+    ): void;
+  }
+
+  export interface ColProperties {
+    width?: number;
+  }
+
+  /**
+   * Data for representing a cell
+   */
+  export interface CellData {
+    text: string;
+    style?: number;
+    merge?: CellMerge;
+  }
+  /**
+   * Data for representing a row
+   */
+  export interface RowData {
+    cells: {
+      [key: number]: CellData;
+    }
+  }
+
+  /**
+   * Data for representing a sheet
+   */
+  export interface SheetData {
+    name?: string;
+    freeze?: string;
+    styles?: CellStyle[];
+    merges?: string[];
+    cols?: {
+      len?: number;
+      [key: number]: ColProperties;
+    };
+    rows?: {
+      [key: number]: RowData
+    };
+  }
+
+  /**
+   * Data for representing a spreadsheet
+   */
+  export interface SpreadsheetData {
+    [index: number]: SheetData;
+  }
+
+  export interface CellStyle {
+    align?: 'left' | 'center' | 'right';
+    valign?: 'top' | 'middle' | 'bottom';
+    font?: {
+      bold?: boolean;
+    }
+    bgcolor?: string;
+    textwrap?: boolean;
+    color?: string;
+    border?: {
+      top?: string[];
+      right?: string[];
+      bottom?: string[];
+      left?: string[];
+    };
+  }
+  export interface Editor {}
+  export interface Element {}
+
+  export interface Row {}
+  export interface Table {}
+  export interface Cell {}
+  export interface Sheet {}
+
+  export default class Spreadsheet {
+    constructor(container: string | HTMLElement, opts?: Options);
+    on: SpreadsheetEventHandler;
+    /**
+     * retrieve cell
+     * @param rowIndex {number} row index
+     * @param colIndex {number} column index
+     * @param sheetIndex {number} sheet iindex
+     */
+    cell(rowIndex: number, colIndex: number, sheetIndex: number): Cell;
+    /**
+     * retrieve cell style
+     * @param rowIndex
+     * @param colIndex
+     * @param sheetIndex
+     */
+    cellStyle(
+      rowIndex: number,
+      colIndex: number,
+      sheetIndex: number
+    ): CellStyle;
+    /**
+     * get/set cell text
+     * @param rowIndex
+     * @param colIndex
+     * @param text
+     * @param sheetIndex
+     */
+    cellText(
+      rowIndex: number,
+      colIndex: number,
+      text: string,
+      sheetIndex?: number
+    ): string;
+    /**
+     * remove current sheet
+     */
+    deleteSheet(): void;
+
+    /**
+     * load data
+     * @param json
+     */
+    loadData(json: Record<string, any>): void;
+    /**
+     * get data
+     */
+    getData(): Record<string, any>;
+    /**
+     * bind handler to change event, including data change and user actions
+     * @param callback
+     */
+    change(callback: (json: Record<string, any>) => void): void;
+    /**
+     * set locale
+     * @param lang
+     * @param message
+     */
+    locale(lang: string, message: string): void;
+  }
+  global {
+    interface Window {
+      x_spreadsheet(container: string | HTMLElement, opts?: Options): Spreadsheet; 
+    }
+  }
+}
+

package/index.js

@@ -0,0 +1 @@
+module.exports = require('./xspreadsheet.js');

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "gridjs-spreadsheet",
-  "version": "23.4.0",
-  "description": "A simple library allows you to view and edit spreadsheet documents with ease.",
+  "version": "23.4.2",
+  "description": "A smart and simple to use Excel-like JavaScript Spreadsheet library allows you to view and edit spreadsheet file with ease and quick.",
+  "types": "index.d.ts",
   "main": "xspreadsheet.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "keywords": [
-    "Excel",
     "XLS",
     "XLSX",
     "XLSB",
@@ -30,8 +30,17 @@
     "SVG",
     "JSON",
     "SQL",
-    "XML"
+    "XML",
+    "Online excel",
+    "spread-sheets",
+    "javascript spreadsheet",
+    "javascript excel",
+    "excel io",
+    "sheets",
+    "sheet",
+    "javascript",
+    "excel"
   ],
-  "author": "Aspose",
+  "author": "Aspose Cells Team",
   "license": "MIT"
 }

package/readme.md

@@ -1,6 +1,6 @@
 # gridjs-spreadsheet
  
-> A web-based JavaScript spreadsheet for GridJs client side
+> A smart and simple to use Excel-like JavaScript Canvas based Spreadsheet library allows you to view and edit spreadsheet file with ease and quick
 
  
 
@@ -44,6 +44,31 @@
    </body>
 ```
 
+## NPM
+
+```shell
+npm install gridjs-spreadsheet
+```
+
+```html
+<div id="gridjs-demo"></div>
+```
+
+```javascript
+import Spreadsheet from "gridjs-spreadsheet";
+// If you need to override the default options, you can set the override
+// const options = {};
+// new Spreadsheet('#gridjs-demo', options);
+const s = new Spreadsheet("#gridjs-demo")
+  .loadData({}) // load data
+  .change(data => {
+    // save data to db
+  });
+
+// data validation
+s.validate()
+```
+
 
  ## simple usage
 
@@ -152,6 +177,7 @@ xs.cellStyle(ri, ci);
   - Autofill
   - Insert/Delete row, column
   - Filter row, column
+  - Zoom in/out 
   - Sort 
   - Search 
   - Formula
@@ -167,11 +193,14 @@ xs.cellStyle(ri, ci);
   - Display Form Controls /ActiveX Controls(incoming)
 
 ## Demo
-for more detail ,please check
-
+Visit the GridJs demo to find more detail info 
 https://github.com/aspose-cells/Aspose.Cells-for-.NET/tree/master/Examples_GridJs
- 
- 
+You can ask any question  using the [Forum](https://forum.aspose.com/c/cells).
+
+## Documentation
+Online documentation is available here:
+- [Developer's Guide](https://docs.aspose.com/cells/net/aspose-cells-gridjs/)
+- [API Reference](https://docs.aspose.com/cells/net/aspose-cells-gridjs/client/)
 
 ## Browser Support