npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@likewindy/websheet

v1.0.3

Published

Websheet is a pure front-end xlsx file display control developed based on HTML5 CANVAS and JAVASCRIPT.

Readme

What is WEBSHEET

        Websheet is a pure front-end xlsx file display control developed based on HTML5 CANVAS and JAVASCRIPT. This control focuses on page display and mainly implements functions including file import/export, text display, formatted text, merged cells, borders, background colors, setting row/column width/height, hiding rows/columns, view locking, basic tables, undo/redo, keyboard shortcuts, formula parsing and calculation. It supports custom functions, cell display/editing, and right-click menu customization.

Translations

中文文档

homepage

主页


1. Getting Started

        If you're new to Websheet, you can start with the following two articles. These will teach you how to load Websheet in pure HTML and VUE, how to render the control on your page, and how to load local or online EXCEL files. You can also see complete, usable examples at the demo address.


        Currently supported shortcuts

| Shortcut | Function | Shortcut | Function |
| ------- | ------- | ------- | ------- | |Ctrl+O | Open new file | Ctrl+X | Cut | |Ctrl+C | Copy| Ctrl+P | Paste | |Ctrl+Z | Undo | Ctrl+Y | Redo | |Ctrl+A | Select All | Delete | Clear cell value | |Ctrl+Shitf+PageDown | Activate next sheet| Ctrl+Shitf+PageUp | Activate previous sheet| |Ctrl+↑| View switches to sheet start row| Ctrl+↓ | View switches to sheet end row |
|Ctrl+← | View switches to sheet start column | Ctrl+→ | View switches to sheet end column |
|Enter | Confirm edit and move to next cell | Alt+Mouse Wheel | Move table left/right |


2. Intermediate

        If you're already familiar with the control and want to dynamically control some of its functions in your project using scripts, you can learn about the following content. These sections will cover how to set cells, add/delete rows/columns, set row/column height/width, listen to Websheet events, and use supported functions.

| Cells | Formatting | Columns & Rows | |------- | ------- | ------- |

| Sheet Operations | View Freeze | Name Management| | ------- | ------- | ------- |

| Table Management | Editor | Print | | ------- | ------- | ------- |

        Upcoming features and development order:


        Currently supported common functions:

| Function | Description | Example| | :------- | ------- | ------- | |SUM | Sum function | Sum values from A1 to C1: SUM(A1:C1) | |IF | Conditional function | IF(10>5,"Yes","No") | |CONCATENATE| Concatenation function| CONCATENATE(text1,text2,[text3],...) | |NOW| Current system date/time function | Reference: DateTime Formatting | |TRUNC| Truncation function | TRUNC(3.141593) // returns 3 |


        Currently supported common events are listed below. For event binding, refer to: Event Binding:

| Event | Description | Binding Link| | :------- | ------- | ------- | | ActiveCellChange| Triggered when active cell changes | Event Binding | | SheetChange| Triggered when active sheet changes | Event Binding | | CellValueChage|Triggered when cell value changes | Event Binding | | RowChange| Triggered when rows are added/deleted | Event Binding | | ColChange| Triggered when columns are added/deleted | Event Binding | | DocumentChange| Triggered when file loading completes | Event Binding |


3. Advanced

        This section allows you to extend Websheet's functionality, such as displaying your controls within Websheet, using your custom functions, and customizing the right-click menu in interactions.


4. Online Code

         All demo code and display address: Demo

5. About Copyright

        Commercial use is prohibited without permission.


6. Contact Us

Email: [email protected] QQ Group: 1036131666


6. update log

September 2025: Version 1.0.3 Released on npmjs

Removed the select-all warning Color setting for columns and rows after region selection Automatic column width and its undo/redo functions The selected region moves too fast Inaccurate positioning of the topmost row Display lag when loading 20MB files Added function to set row hiding Added function to set column hiding Added barcode function Added QR code function

July 2025: Version 1.0.2 Released on npmjs