@oiij/js-pdf 0.0.12 → 0.0.13

package/README.md

@@ -1,90 +1,308 @@
-# Use JS-PDF 🚀
+# @oiij/js-pdf
 
 [![NPM version](https://img.shields.io/npm/v/@oiij/js-pdf)](https://www.npmjs.com/package/@oiij/js-pdf)
 [![MIT-license](https://img.shields.io/npm/l/@oiij/js-pdf)](https://github.com/oiij/use/blob/main/packages/js-pdf/LICENSE)
 
-## 项目简介 📦
+## 简介
 
-Use JS-PDF 是基于 jsPDF 的 Vue 3 封装，提供便捷的 PDF 生成功能，帮助开发者在浏览器端快速生成和下载 PDF 文档。
+Use JS-PDF 是基于 jsPDF 和 pdfjs-dist 的工具库，提供 PDF 生成、读取、转换等功能，帮助开发者在浏览器端处理 PDF 文件。
 
-## 功能特点 ✨
+## 特点
 
-### PDF 生成 📄
+### 📄 PDF 生成
 
-- 📝 支持文本、图片等多种内容
-- 🎨 提供丰富的样式配置
-- 💾 直接在浏览器端生成 PDF
+- 📝 支持文本、图片、圆形、线条等元素
+- 🖼️ 支持异步图片加载
+- 🎨 支持自定义样式配置
 
-### 模块化设计 🧩
+### 📖 PDF 读取
 
-- 📁 采用模块化架构，组件独立封装
-- 📦 支持按需导入，减小打包体积
-- 🔧 清晰的文件结构，易于维护和扩展
+- 🔗 支持从 URL 或 File 对象读取 PDF
+- 🖥️ 支持渲染 PDF 为 Canvas
+- 📑 支持多页 PDF 处理
 
-### 类型安全 🔒
+### 📦 导出功能
+
+- 📥 支持将 Canvas 导出为 PDF
+- 📦 支持将 Canvas 打包为 ZIP
+
+### 🔒 类型安全
 
 - 📝 完整的 TypeScript 类型定义
 - 💡 提供准确的类型推断和代码提示
-- 🎯 支持 Vue 3 的 Composition API 类型系统
 
-### 轻量高效 ⚡
+## 安装
 
-- 🚀 核心代码精简，无额外依赖
-- 🏃 优化的性能表现，最小化运行时开销
-- 📦 支持 Tree Shaking，进一步减小打包体积
+```bash
+# 使用 pnpm
+pnpm add @oiij/js-pdf
 
-## 安装 📥
+# 使用 npm
+npm install @oiij/js-pdf
 
-### 使用 pnpm 🐱
+# 使用 yarn
+yarn add @oiij/js-pdf
+```
 
-```bash
-pnpm add @oiij/js-pdf
+## 依赖
+
+- `jspdf`: ^2.0.0
+- `pdfjs-dist`: ^4.0.0
+- `file-saver`: ^2.0.0
+- `jszip`: ^3.0.0
+- `nanoid`: ^5.0.0
+
+## 示例
+
+### 生成 PDF
+
+```ts
+import { generatePDF } from '@oiij/js-pdf'
+
+const { pdf } = await generatePDF([
+  {
+    type: 'text',
+    text: 'Hello World',
+    x: 10,
+    y: 10,
+    fontSize: 20
+  },
+  {
+    type: 'image',
+    imageData: 'data:image/png;base64,...',
+    x: 10,
+    y: 30,
+    width: 100,
+    height: 100
+  },
+  {
+    type: 'circle',
+    x: 50,
+    y: 80,
+    r: 20,
+    fillColor: 'red'
+  }
+])
+
+pdf.save('example.pdf')
 ```
 
-### 使用 npm 📦
+### 读取 PDF
 
-```bash
-npm install @oiij/js-pdf
-```
+```ts
+import { openPdf } from '@oiij/js-pdf'
 
-### 使用 yarn 🧶
+// 从 URL 读取
+const result = await openPdf('https://example.com/file.pdf')
 
-```bash
-yarn add @oiij/js-pdf
+// 从 File 读取
+const file = document.querySelector('input[type="file"]').files[0]
+const result = await openPdf(file)
+
+// result.pdf - PDF 文档
+// result.pages - 页面数组
+// result.canvases - Canvas 数组
 ```
 
-## 快速开始 🌟
+### Canvas 转 PDF
+
+```ts
+import { canvas2Pdf, openPdf } from '@oiij/js-pdf'
 
-### 基础使用
+const { canvases } = await openPdf('file.pdf')
+canvas2Pdf(canvases, 'output.pdf')
+```
+
+### Canvas 转 ZIP
 
-```vue
-<script setup>
-import { useJsPdf } from '@oiij/js-pdf'
-</script>
+```ts
+import { canvas2Zip, openPdf } from '@oiij/js-pdf'
 
-<template>
-  <div />
-</template>
+const { canvases } = await openPdf('file.pdf')
+await canvas2Zip(canvases, 'output')
 ```
 
-## 在线文档 📚
+## API
+
+### `generatePDF(data, options?, globalStyle?)`
+
+生成 PDF 文档。
+
+#### 参数
+
+| 参数          | 类型           | 说明             |
+| ------------- | -------------- | ---------------- |
+| `data`        | `PDFDataRow[]` | PDF 数据行数组   |
+| `options`     | `jsPDFOptions` | jsPDF 初始化选项 |
+| `globalStyle` | `PDFStyle`     | 全局样式         |
+
+#### 返回值
+
+| 属性  | 类型    | 说明       |
+| ----- | ------- | ---------- |
+| `pdf` | `jsPDF` | jsPDF 实例 |
+
+### `openPdf(url?)`
 
-[在线文档](https://oiij-use.vercel.app/js-pdf/js-pdf) 📖
+打开并读取 PDF 文件。
 
-## 贡献指南 🤝
+#### 参数
 
-欢迎贡献代码、报告问题或提出新功能建议！
+| 参数  | 类型                    | 说明                        |
+| ----- | ----------------------- | --------------------------- |
+| `url` | `string \| URL \| File` | PDF 文件的 URL 或 File 对象 |
 
-1. Fork 本仓库 🍴
-2. 创建您的特性分支 (`git checkout -b feature/amazing-feature`) 🌿
-3. 提交您的更改 (`git commit -m 'Add some amazing feature'`) 💾
-4. 推送到分支 (`git push origin feature/amazing-feature`) 🚀
-5. 打开一个 Pull Request 📥
+#### 返回值
 
-## 许可证 📄
+| 属性       | 类型                  | 说明         |
+| ---------- | --------------------- | ------------ |
+| `pdf`      | `PDFDocumentProxy`    | PDF 文档对象 |
+| `pages`    | `PDFPageProxy[]`      | 页面数组     |
+| `id`       | `string`              | 唯一 ID      |
+| `canvases` | `HTMLCanvasElement[]` | Canvas 数组  |
 
-本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情 📑
+### `canvas2Pdf(canvases, fileName)`
+
+将 Canvas 数组转换为 PDF 并下载。
+
+#### 参数
+
+| 参数       | 类型                  | 说明        |
+| ---------- | --------------------- | ----------- |
+| `canvases` | `HTMLCanvasElement[]` | Canvas 数组 |
+| `fileName` | `string`              | 文件名      |
+
+### `canvas2Zip(canvases, fileName)`
+
+将 Canvas 数组转换为 ZIP 并下载。
+
+#### 参数
+
+| 参数       | 类型                  | 说明        |
+| ---------- | --------------------- | ----------- |
+| `canvases` | `HTMLCanvasElement[]` | Canvas 数组 |
+| `fileName` | `string`              | 文件名      |
+
+### `readPdfFile(buffer)`
+
+从 ArrayBuffer 读取 PDF 文件。
+
+#### 参数
+
+| 参数     | 类型          | 说明                   |
+| -------- | ------------- | ---------------------- |
+| `buffer` | `ArrayBuffer` | PDF 文件的 ArrayBuffer |
+
+## PDFDataRow 类型
+
+### text 类型
+
+```ts
+type TextDataRow = {
+  type: 'text'
+  text: string
+  x: number
+  y: number
+  fontSize?: number
+  fontName?: string
+  fontStyle?: string
+  fontWeight?: string
+  textColor?: Color
+  align?: string
+  baseline?: string
+}
+```
+
+### image 类型
+
+```ts
+type ImageDataRow = {
+  type: 'image'
+  imageData: string | HTMLImageElement | (() => Promise<HTMLImageElement>)
+  x: number
+  y: number
+  width: number
+  height: number
+  alias?: string
+  compression?: string
+  rotation?: number
+}
+```
+
+### circle 类型
+
+```ts
+type CircleDataRow = {
+  type: 'circle'
+  x: number
+  y: number
+  r: number
+  fillColor?: Color
+  drawColor?: Color
+  lineWidth?: number
+  style?: 'S' | 'F' | 'FD' | 'DF'
+}
+```
+
+### line 类型
+
+```ts
+type LineDataRow = {
+  type: 'line'
+  x1: number
+  y1: number
+  x2: number
+  y2: number
+  drawColor?: Color
+  lineWidth?: number
+  style?: 'S' | 'F' | 'FD' | 'DF'
+}
+```
+
+### lines 类型
+
+```ts
+type LinesDataRow = {
+  type: 'lines'
+  lines: number[][]
+  x: number
+  y: number
+  scale?: [number, number]
+  closed?: boolean
+  drawColor?: Color
+  lineWidth?: number
+  style?: 'S' | 'F' | 'FD' | 'DF'
+}
+```
+
+## 类型定义
+
+```ts
+type Color = string | [number, number, number, number]
+
+type PDFStyle = {
+  fontSize?: number
+  fontName?: string
+  fontStyle?: string
+  fontWeight?: string
+  textColor?: Color
+  drawColor?: Color
+  fillColor?: Color
+  lineWidth?: number
+}
+
+type PDFDataRow = {
+  type: 'text' | 'image' | 'circle' | 'line' | 'lines'
+  // ... 具体选项根据 type 不同
+}
+
+export declare function generatePDF(data: PDFDataRow[], options?: jsPDFOptions, globalStyle?: PDFStyle): Promise<{ pdf: jsPDF }>
+export declare function openPdf(url?: string | URL | File): Promise<{ pdf: PDFDocumentProxy, pages: PDFPageProxy[], id: string, canvases: HTMLCanvasElement[] }>
+export declare function canvas2Pdf(canvases: HTMLCanvasElement[], fileName: string): void
+export declare function canvas2Zip(canvases: HTMLCanvasElement[], fileName: string): Promise<unknown>
+export declare function readPdfFile(buffer: ArrayBuffer): Promise<{ pdf: PDFDocumentProxy, pages: PDFPageProxy[], id: string, canvases: HTMLCanvasElement[] }>
+```
 
-## 联系方式 📞
+## 在线文档
 
-- GitHub: [https://github.com/Eiog/@oiij/js-pdf](https://github.com/Eiog/@oiij/js-pdf) 🌟
+[在线文档](https://oiij-use.vercel.app/js-pdf/js-pdf)

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@oiij/js-pdf",
   "type": "module",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "description": "A simple PDF library for JavaScript",
   "author": "oiij",
   "license": "MIT",