Excelify

Handsontable-powered Excel UI that lets you upload, edit, find/replace, format, and download spreadsheets inside Angular.

Features

• Upload .xlsx, .xls, and .csv files and pick sheets to edit.
• Excel-style toolbar (bold, alignment, wrapping, AutoSum/Average/Count).
• Status bar that mirrors Excel's Sum/Average/Count logic.
• Built-in find/replace panel with case sensitivity support.
• Formula bar backed by HyperFormula so spreadsheet formulas continue to work.
• Download the edited workbook back to disk.

Installation

npm install @devath/excelify

The package lists Angular, Handsontable, HyperFormula, FileSaver, and XLSX as peer dependencies so your app controls versions.

Register the Handsontable styles once (e.g. in angular.json or a global style):

"styles": [
  "node_modules/handsontable/dist/handsontable.full.min.css",
  "src/styles.scss"
]

Usage (NgModule)

import { ExcelifyModule } from '@devath/excelify';

@NgModule({
  imports: [ExcelifyModule],
})
export class AppModule {}

<eq-excelify
  [data]="tableData"
  [columns]="columns"
  [sheetName]="'Sheet1'"
  [excludeColumns]="['internalId']"
  [containerHeight]="'75vh'">
</eq-excelify>

Usage (Standalone)

import { ExcelifyComponent } from '@devath/excelify';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [ExcelifyComponent],
  template: `
    <eq-excelify [data]="tableData" [columns]="columns"></eq-excelify>
  `,
})
export class AppComponent {
  tableData = [
    { name: 'Ada Lovelace', team: 'Math', score: 98 },
    { name: 'Grace Hopper', team: 'Compilers', score: 95 },
  ];

  columns = [
    { field: 'name', header: 'Name' },
    { field: 'team', header: 'Team' },
    { field: 'score', header: 'Score' },
  ];
}

Inputs

| Input | Type | Description | | --- | --- | --- | | data | any[] | Optional array of objects to seed the grid. | | columns | { field: string; header?: string }[] | Optional column definitions when supplying data. | | sheetName | string | Name of the initial worksheet to show when uploading multi-sheet files. | | hideUpload | boolean | Hide the upload/download toolbar (defaults to false). | | excludeColumns | string[] | Case-insensitive list of column field/headers to omit when generating sheets. | | containerHeight / containerWidth | string | Dimensions for the Handsontable container. | | headerRows | number | Number of locked header rows when sorting (default 1). |

Notes

• Clipboard copy/cut is intentionally disabled in the grid.
• Handsontable uses the non-commercial-and-evaluation license key by default. HyperFormula uses the gpl-v3 license key. For production/commercial use, supply appropriate licenses.