@ghyassd/office-preview

Vue components for Office preview, focused on:

• Word (doc/docx) image or PDF preview
• Excel (xls/xlsx) sheet rendering with merged cell support

Install

pnpm add @ghyassd/office-preview

Usage

<template>
  <OfficePreview :file="file" :adapter="adapter" />
</template>

<script setup>
import { OfficePreview } from '@ghyassd/office-preview';
import '@ghyassd/office-preview/style.css';

const file = {
  name: 'report.xlsx',
  mimeType: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
  url: '/api/file/preview/xxx'
};

const adapter = {
  // Required for Excel
  async getArrayBuffer(file) {
    const res = await fetch(file.url);
    return await res.arrayBuffer();
  },

  // Required for Word
  async getPageImages(file) {
    const res = await fetch(`/api/file/convert-preview-images/${file.hash}`);
    return await res.json();
  },

  // Optional fallback
  getPdfUrl(file) {
    return `/api/file/convert-preview/${file.hash}`;
  }
};
</script>

Components

• OfficePreview: wrapper by file type
• WordPreview: word-only preview
• ExcelPreview: excel-only preview