GoKawiilThis entire codebase — Rust parsers, TypeScript renderers, tests, and tooling — was implemented by Claude (Anthropic's AI assistant) through iterative prompting. No human-written application code exists in this repository.
Demo (Storybook)
A browser-based viewer for Office Open XML documents that renders to an HTML Canvas element. The parsers are written in Rust and compiled to WebAssembly; the renderers use the Canvas 2D API. Each format also exposes a headless engine ( DocxDocument / XlsxWorkbook / PptxPresentation ) that renders into any caller-supplied canvas, so you can compose your own UI — scroll views, thumbnail grids, master-detail panes — instead of being locked into the built-in viewer. See the Examples section in the Storybook demo.
DOCX XLSX PPTX
npm install @silurus/ooxml # or pnpm add @silurus/ooxml
Bundler note: this package embeds .wasm files. With Vite add vite-plugin-wasm ; with webpack use experiments.asyncWebAssembly .
Bundle size note: the package is ESM-only ( .mjs ). npm's Unpacked Size sums all four entry bundles, including the opt-in math engine (MathJax + STIX Two Math, ~3 MB). What actually lands in your app is much smaller — import only the format you need (e.g. @silurus/ooxml/pptx ). The math engine is a separate entry ( @silurus/ooxml/math ): it is bundled only if you import it and pass it to a viewer (see Rendering equations). Viewers that never receive a math engine — and all xlsx usage — tree-shake the ~3 MB away entirely.
Quick Start
import { DocxViewer } from '@silurus/ooxml/docx' ; import { XlsxViewer } from '@silurus/ooxml/xlsx' ; import { PptxViewer } from '@silurus/ooxml/pptx' ; // DOCX — caller provides the <canvas> const canvas = document . getElementById ( 'docx-canvas' ) as HTMLCanvasElement ; const docx = new DocxViewer ( canvas ) ; await docx . load ( '/document.docx' ) ; docx . nextPage ( ) ; // XLSX — viewer manages its own <canvas> + tab bar const container = document . getElementById ( 'xlsx-container' ) as HTMLElement ; const xlsx = new XlsxViewer ( container ) ; await xlsx . load ( '/workbook.xlsx' ) ; // PPTX — caller provides the <canvas> const canvas = document . getElementById ( 'pptx-canvas' ) as HTMLCanvasElement ; const pptx = new PptxViewer ( canvas ) ; await pptx . load ( '/deck.pptx' ) ; pptx . nextSlide ( ) ;
Rendering equations
... continue reading