open-index/open-npm huggingface dataset:
npm package: @jacktea/numbering-maker
Description: Pure numbering generator for JavaScript and TypeScript runtimes.
Latest version: 0.1.4

# @jacktea/numbering-maker (TypeScript)

TypeScript/JavaScript 实现的多语言编号生成器。

## 功能特性

- 支持多种格式：阿拉伯数字、字母、罗马数字、中文数字等。
- 支持单层、多层及混合层级编号。
- 状态可保存与恢复，支持分页生成。
- 纯 ESM 包。
- 零依赖。

## 支持的格式

- `decimal` (数字)
- `upperLetter` (大写字母)
- `lowerLetter` (小写字母)
- `upperRoman` (大写罗马数字)
- `lowerRoman` (小写罗马数字)
- `ordinal` (序数词)
- `bullet` (符号)
- `chineseSimplified` (简体中文)
- `chineseTraditional` (繁体中文)

## 安装

```bash
npm install @jacktea/numbering-maker
```

或使用 yarn/pnpm:

```bash
pnpm add @jacktea/numbering-maker
yarn add @jacktea/numbering-maker
```

## 快速开始

```typescript
import { createMultilevelNumberingMaker } from '@jacktea/numbering-maker';

const maker = createMultilevelNumberingMaker(1);

console.log(maker.generateNumbering(0)); // 输出: 1.
console.log(maker.generateNumbering(1)); // 输出: 1.1.
console.log(maker.generateNumbering(1)); // 输出: 1.2.
console.log(maker.generateNumbering(2)); // 输出: 1.2.1.
```

## 不同层级使用不同编码器

```typescript
import {
  createMultilevelNumberingMaker,
  createNumberingLevel
} from '@jacktea/numbering-maker';

const maker = createMultilevelNumberingMaker(1);

maker.levels[0] = createNumberingLevel('decimal', {
  start: 1,
  level: 0,
  pattern: '%1.'
});
maker.levels[1] = createNumberingLevel('upperRoman', {
  start: 1,
  level: 1,
  pattern: '%1.%2.'
});
maker.levels[2] = createNumberingLevel('chineseSimplified', {
  start: 1,
  level: 2,
  pattern: '%1.%2.%3.'
});

console.log(maker.generateNumbering(0)); // 输出: 1.
console.log(maker.generateNumbering(1)); // 输出: 1.I.
console.log(maker.generateNumbering(1)); // 输出: 1.II.
console.log(maker.generateNumbering(2)); // 输出: 1.II.一.
console.log(maker.generateNumbering(2)); // 输出: 1.II.二.
```

## 运行测试

```bash
npm test
```
npm package: @jacktea/pdf-viewer-component
Description: 基于 Vanilla Web Components 标准实现的 PDF 预览与批注组件。
Latest version: 0.1.19

# @jacktea/pdf-viewer-component

基于 Vanilla Web Components 标准实现的 PDF 预览与批注组件。

## 简介

这是一个轻量、高性能、高度可定制的 PDF 浏览器组件。由于采用原生 Web Components 构建，所以可以在**任何前端框架（Vue、React、Angular、Svelte 等）或纯 HTML 环境下无缝运行**。

## 特性

- 📝 **开箱即用的批注功能**：支持高亮、下划线、画笔、文本标签等多种注释。
- ⚡ **原生级性能**：基于底层 WebAssembly 及原生 Web Components 的优秀渲染性能。
- 🎨 **主题定制**：方便灵活地配置组件主题与工具栏样式。
- 🌐 **框架无关**。

## 安装

```bash
npm install @jacktea/pdf-viewer-component
```
```bash
yarn add @jacktea/pdf-viewer-component
```
```bash
pnpm add @jacktea/pdf-viewer-component
```

## 基础用法

如果你是原生 HTML / 原生 JS 开发者：

```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <!-- 引入组件库打包后的产物 -->
  <script type="module" src="node_modules/@jacktea/pdf-viewer-component/dist/index.es.js"></script>
</head>
<body>
  <!-- 直接使用自定义标签 -->
  <pdf-viewer src="/path/to/your/document.pdf" style="width: 100%; height: 100vh;"></pdf-viewer>
</body>
</html>
```

## PDF Worker 默认行为

- 默认使用独立 worker 文件（`dist/pdf.worker.min.mjs`），不会把 worker 内联为 `data:text/javascript`。
- 生产环境消费方只需 `import "@jacktea/pdf-viewer-component"`，无需 `postinstall patch` 或全局 monkey patch。

## 可选覆盖方式

```ts
import {
  setPdfJsResources,
  setPdfJsWorkerSrc,
  getDefaultPdfJsWorkerSrc,
} from "@jacktea/pdf-viewer-component";

// 方式一：统一资源配置（推荐）
setPdfJsResources({
  workerSrc: "/pdfjs/pdf.worker.min.mjs",
});

// 方式二：仅覆盖 worker
setPdfJsWorkerSrc("/pdfjs/pdf.worker.min.mjs");

console.log(getDefaultPdfJsWorkerSrc());
```

也可以在加载组件前设置全局配置：

```html
<script>
  window.__PDF_VIEWER_PDFJS_RESOURCES__ = {
    workerSrc: "/pdfjs/pdf.worker.min.mjs",
  };
</script>
```

## 迁移说明

1. 删除旧的 worker patch / monkey patch 逻辑。
2. 保留 `import "@jacktea/pdf-viewer-component"`。
3. 仅在需要自定义 worker 路径时显式覆盖。
npm package: @jacktea/pdf-viewer-core
Description: 核心逻辑处理模块，提供给 `Jacktea PDF Viewer` 生态的基础运行时库。
Latest version: 0.1.19

# @jacktea/pdf-viewer-core

核心逻辑处理模块，提供给 `Jacktea PDF Viewer` 生态的基础运行时库。

## 简介

本包主要包含：
- 基于 WebAssembly 封装的高级 PDF 解析与数据处理工具。
- 框架无关的通用业务逻辑。
- 协作相关的核心类型定义。

⚠️ **注意：** 这个包主要作为底层依赖在各种 UI 组件库中被引用，对于普通业务开发者，通常不需要直接安装和使用这个包，而是使用对应的 UI 框架包装包（如 Vue/React）。

## 安装

```bash
npm install @jacktea/pdf-viewer-core
```
```bash
yarn add @jacktea/pdf-viewer-core
```
```bash
pnpm add @jacktea/pdf-viewer-core
```
npm package: @jacktea/pdf-viewer-react
Description: 专为 React 应用打造的 PDF 预览与批注组件。
Latest version: 0.1.19

# @jacktea/pdf-viewer-react

专为 React 应用打造的 PDF 预览与批注组件。

## 简介

本组件是对 `@jacktea/pdf-viewer-component` (Web Components) 的一层 React 包装器，使你在 React 生态中享受符合习惯的 Props 传递、事件回调处理和完整的 TypeScript 类型支持。

## 安装

```bash
npm install @jacktea/pdf-viewer-react
```
```bash
yarn add @jacktea/pdf-viewer-react
```
```bash
pnpm add @jacktea/pdf-viewer-react
```

## 基础用法

```tsx
import React from 'react';
import { PdfViewer } from '@jacktea/pdf-viewer-react';

export default function App() {
  const handlePdfLoad = () => {
    console.log('PDF Document has been successfully loaded!');
  };

  return (
    <div style={{ width: '100%', height: '100vh' }}>
      <PdfViewer 
        src="/path/to/your/document.pdf"
        onLoad={handlePdfLoad}
      />
    </div>
  );
}
```
npm package: @jacktea/pdf-viewer-server
Description: Jacktea PDF Viewer 的实时协作后端服务，基于 Socket.io 实现。
Latest version: 0.1.19

# @jacktea/pdf-viewer-server

Jacktea PDF Viewer 的实时协作后端服务，基于 Socket.io 实现。

## 简介

如果你希望在你的 PDF 预览器中接入多人实时协作功能（如：实时看到别人的高亮、批注、评论拉取与同步），可以使用此 Node.js 服务。

服务端主要负责多端状态同步和协同数据的分发，目前作为本地运行或自行部署的独立微服务使用。

## 特性

- ⚡ **实时光标与轨迹**：可以看到其他协作者的鼠标滚动和选择轨迹。
- 🔄 **秒级同步更新**：文档中的任何批注添加与修改均会基于房间隔离实时广播。
- 🔒 **权限拦截机制**：内置房间与用户身份概念的验证能力。

## 安装

你可以全局安装作为 CLI 服务启动：

```bash
npm install -g @jacktea/pdf-viewer-server
```

或者在你的自有工程中配合脚本启动：

```bash
npm install @jacktea/pdf-viewer-server
```

## 启动服务

### 1. 全局 CLI 方式 (开发调试)

全局安装后，在终端任意目录直接执行：

```bash
pdf-viewer-server
```
*(默认监听 `3000` 端口)*

### 2. 作为 Node 包在你的项目中启动

你可以通过 npm scripts 启动：

```json
{
  "scripts": {
    "start:collab": "pdf-viewer-server"
  }
}
```

### 3. Server 配置环境变量

服务支持通过配置环境变量来控制行为，例如：

```bash
PORT=8080 CORS_ORIGINS="https://app.example.com" pdf-viewer-server
```

主要参量：
- `PORT`: 启动端口 (默认 `3000`)
- `CORS_ORIGINS`: 允许跨域请求的域名白名单，逗号分隔
- `ALLOW_ALL_ORIGINS`: `true` (开启无限制 CORS，仅开发环境)
- `REQUIRE_AUTH`: `true` | `false` (是否必须校验认证 token)
npm package: @jacktea/pdf-viewer-vue
Description: 专为 Vue 3 应用打造的 PDF 预览与批注组件。
Latest version: 0.1.19

# @jacktea/pdf-viewer-vue

专为 Vue 3 应用打造的 PDF 预览与批注组件。

## 简介

本组件是对 `@jacktea/pdf-viewer-component` (Web Components) 的一层 Vue 3 包装器，提供了 Vue 友好的 API（Properties & Events 绑定），并享有完整的 TypeScript 类型提示。

## 安装

```bash
npm install @jacktea/pdf-viewer-vue
```
```bash
yarn add @jacktea/pdf-viewer-vue
```
```bash
pnpm add @jacktea/pdf-viewer-vue
```

## 基础用法

```vue
<template>
  <div style="width: 100%; height: 100vh;">
    <PdfViewer 
      src="/path/to/your/document.pdf"
      @load="onPdfLoaded"
    />
  </div>
</template>

<script setup lang="ts">
import { PdfViewer } from '@jacktea/pdf-viewer-vue';
// 引入基础样式（如果需要的话，具体按照组件导出规格）
import '@jacktea/pdf-viewer-component/dist/index.css'; 

const onPdfLoaded = () => {
  console.log('PDF Document has been successfully loaded!');
};
</script>
```
npm package: @jacktea/tech3d-viewer
Description: 基于 Web Components 的高性能 3D 浏览器核心库，支持多种 3D 模型格式的预览。
Latest version: 0.1.6

# @jacktea/tech3d-viewer

基于 Web Components 的高性能 3D 浏览器核心库，支持多种 3D 模型格式的预览。

## 特性

- **Web Components 驱动**：兼容任何现代前端框架（React, Vue, Angular 等）或原生 HTML。
- **高性能渲染**：基于 HOOPS Communicator 引擎，可流畅处理大型装配体。
- **易于集成**：提供简单的 API 来加载和控制 3D 模型。
- **灵活的转换机制**：支持自定义后端转换器以加载非原生（非 SCS）格式。

## 安装

```bash
npm install @jacktea/tech3d-viewer
# 或
pnpm add @jacktea/tech3d-viewer
```

## 快速开始

### 使用原生 HTML

```html
<!DOCTYPE html>
<html>
<head>
    <script type="module" src="node_modules/@jacktea/tech3d-viewer/dist/tech3d-viewer.js"></script>
    <style>
        #viewer { width: 100%; height: 500px; display: block; }
    </style>
</head>
<body>
    <tech3d-viewer id="viewer"></tech3d-viewer>

    <script type="module">
        const viewer = document.getElementById('viewer');
        
        viewer.addEventListener('ready', () => {
          console.log('Viewer is ready!');
          viewer.open('https://your-server.com/models/sample.scs');
        });
    </script>
</body>
</html>
```

### 使用 JavaScript API

```ts
import { createTech3DViewer } from '@jacktea/tech3d-viewer';

const container = document.getElementById('app');
const viewer = createTech3DViewer(container, {
  locale: 'zh-CN'
});

await viewer.open('path/to/model.scs');
```

## API 说明

### 属性 (Attributes/Properties)

| 属性名 | 类型 | 说明 |
| :--- | :--- | :--- |
| `config` | `Tech3DViewerConfig` | 运行时配置，包括语言、主题、效果等。 |

### 方法

- `open(input: Tech3DInput, options?: Tech3DOpenOptions)`: 加载 3D 模型。
- `setConfig(config: Partial<Tech3DViewerConfig>)`: 更新视图配置。
- `getConfig()`: 获取当前配置。
- `reset()`: 重置视图状态。
- `destroy()`: 销毁查看器实例。

### 事件

- `ready`: 查看器初始化完成并准备就绪。
- `error`: 加载或运行过程中发生错误。
- `selection-change`: 模型选择项发生变化。
- `view-mode-change`: 查看模式（如正交/透视）改变。
- `snapshot`: 完成屏幕截图。
- `export-start` / `export-end`: 导出过程开始与结束。

## 相关包

- [@jacktea/tech3d-viewer-react](../react): React 官方封装。
- [@jacktea/tech3d-viewer-vue](../vue): Vue 3 官方封装。
npm package: @jacktea/tech3d-viewer-react
Description: 为 `@jacktea/tech3d-viewer` 核心库提供的 React 封装组件，方便在 React 项目中集成高性能 3D 浏览器。
Latest version: 0.1.7

# @jacktea/tech3d-viewer-react

为 `@jacktea/tech3d-viewer` 核心库提供的 React 封装组件，方便在 React 项目中集成高性能 3D 浏览器。

## 特性

- **React 风格声明式 API**：通过 Props 控制配置和状态。
- **完善的事件绑定**：支持 `onReady`, `onError`, `onSelectionChange` 等回调。
- **内建生命周期维护**：自动处理组件挂载和销毁时的资源回收。
- **TypeScript 支持**：提供完整的类型定义。

## 安装

你需要同时安装核心库和 React 封装库：

```bash
npm install @jacktea/tech3d-viewer @jacktea/tech3d-viewer-react
# 或
pnpm add @jacktea/tech3d-viewer @jacktea/tech3d-viewer-react
```

## 快速开始

```tsx
import React, { useRef } from 'react';
import { Tech3DViewer, Tech3DViewerRef } from '@jacktea/tech3d-viewer-react';

function App() {
  const viewerRef = useRef<Tech3DViewerRef>(null);

  const handleReady = () => {
    console.log('Viewer is ready!');
    viewerRef.current?.open('https://your-server.com/models/sample.scs');
  };

  return (
    <div style={{ width: '100%', height: '500px' }}>
      <Tech3DViewer 
        ref={viewerRef}
        onReady={handleReady}
        onError={(err) => console.error(err)}
      />
    </div>
  );
}

export default App;
```

## API 说明

### Props

| 属性 | 类型 | 说明 |
| :--- | :--- | :--- |
| `config` | `Partial<Tech3DViewerConfig>` | 视图配置（如 locale, theme）。 |
| `input` | `Tech3DInput` | (可选) 初始化加载的模型（文件或 URL）。 |
| `openOptions` | `Tech3DOpenOptions` | (可选) 加载时使用的配置项。 |
| `onReady` | `(detail: any) => void` | 初始化完成回调。 |
| `onError` | `(detail: any) => void` | 错误回调。 |
| `onSelectionChange` | `(detail: any) => void` | 选择项变化回调。 |
| `onViewModeChange` | `(detail: any) => void` | 视角模式变化回调。 |
| `onSnapshot` | `(detail: any) => void` | 截图完成回调。 |

### Ref 方法 (Tech3DViewerRef)

通过 `useRef` 获得对组件实例的操作权限：

- `open(input, options)`: 手动加载新模型。
- `setConfig(config)`: 动态更新配置。
- `getConfig()`: 获取当前核心配置。
- `reset()`: 重置状态。
- `destroy()`: 销毁实例。

## 核心库

本项目依赖核心库 [@jacktea/tech3d-viewer](../core)。
npm package: @jacktea/tech3d-viewer-vue
Description: 为 `@jacktea/tech3d-viewer` 核心库提供的 Vue 3 封装组件，方便在 Vue 项目中集成高性能 3D 浏览器。
Latest version: 0.1.7

# @jacktea/tech3d-viewer-vue

为 `@jacktea/tech3d-viewer` 核心库提供的 Vue 3 封装组件，方便在 Vue 项目中集成高性能 3D 浏览器。

## 特性

- **Vue 3 组合式 API 支持**：完美契合 `script setup` 语法。
- **Props 与 Events**：通过标准的 Vue 属性和事件进行控制和交互。
- **资源自动回收**：在组件卸载时自动销毁实例，避免内存泄漏。
- **TypeScript 友好**：提供完善的 Prop 类型定义和事件类型提示。

## 安装

你需要同时安装核心库和 Vue 封装库：

```bash
npm install @jacktea/tech3d-viewer @jacktea/tech3d-viewer-vue
# 或
pnpm add @jacktea/tech3d-viewer @jacktea/tech3d-viewer-vue
```

## 快速开始

```vue
<template>
  <div style="width: 100%; height: 500px">
    <Tech3DViewer 
      ref="viewer"
      :input="modelUrl"
      @ready="handleReady"
      @error="handleError"
    />
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { Tech3DViewer } from '@jacktea/tech3d-viewer-vue';

const modelUrl = 'https://your-server.com/models/sample.scs';
const viewer = ref<InstanceType<typeof Tech3DViewer> | null>(null);

const handleReady = () => {
  console.log('Viewer is ready!');
};

const handleError = (err: any) => {
  console.error('Viewer error:', err);
};
</script>
```

## API 说明

### Props

| 属性 | 类型 | 说明 |
| :--- | :--- | :--- |
| `config` | `Partial<Tech3DViewerConfig>` | 视图配置（如语言、效果等）。 |
| `input` | `Tech3DInput` | (可选) 初始化或动态切换的模型 URL 或文件。 |
| `openOptions` | `Tech3DOpenOptions` | (可选) 加载参数。 |

### 事件 (Events)

- `@ready`: 初始化完成。
- `@error`: 发生错误。
- `@selection-change`: 模型选择变化。
- `@view-mode-change`: 视角模式切换。
- `@snapshot`: 截图完成。
- `@export-start` / `@export-end`: 导出过程状态。

### 公开方法 (Exposed)

通过模板引用（ref）获取组件实例后，可以调用以下方法：

- `open(input, options)`: 加载新模型。
- `setConfig(config)`: 更新配置。
- `getConfig()`: 获取当前配置。
- `reset()`: 重置视图。
- `destroy()`: 销毁实例。

## 核心库

本项目依赖核心库 [@jacktea/tech3d-viewer](../core)。
npm package: @jackthomas/ui-library
Description: This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Latest version: 0.0.17

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

```js
export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```

You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:

```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```