@haklex/rich-renderers 0.0.65 → 0.0.67

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +52 -174
  2. package/package.json +27 -22
package/README.md CHANGED
@@ -1,204 +1,82 @@
1
1
  # @haklex/rich-renderers
2
2
 
3
- 静态渲染器聚合包。
4
- 为 `@haklex/rich-renderer` 提供一套增强版 `rendererConfig`，并统一导出常见扩展节点与工具。
3
+ Static renderer aggregator that bundles all static (read-only) renderers and extension renderers into a single configuration.
5
4
 
6
- ## 包定位
7
-
8
- - 面向只读渲染场景（文章页、SSR、预览页）
9
- - 聚合多个 feature 包（codeblock/image/video/linkcard/...）
10
- - 不负责编辑器插件挂载（编辑态请看 `@haklex/rich-renderers-edit`）
11
-
12
- ## 安装
5
+ ## Installation
13
6
 
14
7
  ```bash
15
- pnpm add @haklex/rich-renderers @haklex/rich-renderer @haklex/rich-editor
8
+ pnpm add @haklex/rich-renderers
16
9
  ```
17
10
 
18
- ## 快速开始
11
+ ## Peer Dependencies
12
+
13
+ | Package | Version |
14
+ | --- | --- |
15
+ | `lexical` | `^0.41.0` |
16
+ | `@lexical/react` | `^0.41.0` |
17
+ | `react` | `>=19` |
18
+ | `react-dom` | `>=19` |
19
+
20
+ ## Usage
19
21
 
20
22
  ```tsx
23
+ import { enhancedRendererConfig } from '@haklex/rich-renderers'
21
24
  import { RichRenderer } from '@haklex/rich-static-renderer'
22
- import {
23
- codeSnippetNodes,
24
- embedNodes,
25
- enhancedRendererConfig,
26
- galleryNodes,
27
- TldrawNode,
28
- } from '@haklex/rich-renderers'
29
25
 
30
26
  import '@haklex/rich-editor/style.css'
31
27
  import '@haklex/rich-renderers/style.css'
32
- import '@haklex/rich-ext-code-snippet/style.css'
33
- import '@haklex/rich-ext-embed/style.css'
34
- import 'katex/dist/katex.min.css'
35
- import 'tldraw/tldraw.css'
36
-
37
- const extraNodes = [
38
- TldrawNode,
39
- ...embedNodes,
40
- ...galleryNodes,
41
- ...codeSnippetNodes,
42
- ]
43
-
44
- export function Article({ value }) {
45
- return (
46
- <RichRenderer
47
- value={value}
48
- rendererConfig={enhancedRendererConfig}
49
- extraNodes={extraNodes}
50
- variant="article"
51
- />
52
- )
53
- }
54
- ```
55
-
56
- ## `enhancedRendererConfig` 包含项
57
-
58
- | key | renderer |
59
- | --- | --- |
60
- | `Alert` | `AlertRenderer` |
61
- | `Banner` | `BannerRenderer` |
62
- | `CodeBlock` | `CodeBlockRenderer` |
63
- | `Image` | `ImageRenderer` |
64
- | `LinkCard` | `LinkCardRenderer` |
65
- | `Mention` | `MentionRenderer` |
66
- | `Gallery` | `GalleryRenderer` |
67
- | `Mermaid` | `MermaidRenderer` |
68
- | `Video` | `VideoRenderer` |
69
- | `CodeSnippet` | `CodeSnippetRenderer` |
70
-
71
- ## 样式引入策略
72
-
73
- `@haklex/rich-renderers/style.css` 已包含：
74
-
75
- - alert/banner/codeblock/gallery/image/linkcard/mention/mermaid/video/tldraw 扩展样式
76
-
77
- 仍需按需额外引入：
78
-
79
- - `@haklex/rich-ext-code-snippet/style.css`（CodeSnippet）
80
- - `@haklex/rich-ext-embed/style.css`（Embed）
81
- - `katex/dist/katex.min.css`（KaTeX）
82
- - `tldraw/tldraw.css`（Tldraw 内核）
83
-
84
- ## 核心导出
85
-
86
- ### 1) 预置配置
87
-
88
- ```ts
89
- enhancedRendererConfig
90
- ```
91
-
92
- ### 2) 扩展节点
93
28
 
94
- ```ts
95
- // gallery
96
- galleryNodes
97
- GalleryNode
98
- GalleryEditNode
99
-
100
- // code-snippet
101
- codeSnippetNodes
102
- CodeSnippetNode
103
-
104
- // embed
105
- embedNodes
106
- EmbedNode
107
-
108
- // tldraw
109
- TldrawNode
110
- ```
111
-
112
- ### 3) 各功能渲染器
113
-
114
- ```ts
115
- AlertRenderer
116
- BannerRenderer
117
- CodeBlockRenderer
118
- ImageRenderer
119
- LinkCardRenderer
120
- MentionRenderer
121
- MermaidRenderer
122
- VideoRenderer
123
- GalleryRenderer
124
- CodeSnippetRenderer
125
- EmbedStaticRenderer
126
- EmbedLinkRenderer
127
- TldrawStaticRenderer
29
+ <RichRenderer
30
+ value={value}
31
+ rendererConfig={enhancedRendererConfig}
32
+ variant="article"
33
+ />
128
34
  ```
129
35
 
130
- ### 4) LinkCard 插件体系
131
-
132
- ```ts
133
- plugins
134
- pluginMap
135
- getPluginByName
136
- githubRepoPlugin
137
- githubPrPlugin
138
- githubIssuePlugin
139
- githubCommitPlugin
140
- githubDiscussionPlugin
141
- arxivPlugin
142
- tmdbPlugin
143
- bangumiPlugin
144
- qqMusicPlugin
145
- neteaseMusicPlugin
146
- leetcodePlugin
147
- ```
148
-
149
- ## 子路径按需引入
150
-
151
- 可用子路径（对应 `package.json exports`）：
152
-
153
- - `@haklex/rich-renderers/alert`
154
- - `@haklex/rich-renderers/banner`
155
- - `@haklex/rich-renderers/codeblock`
156
- - `@haklex/rich-renderers/code-snippet`
157
- - `@haklex/rich-renderers/image`
158
- - `@haklex/rich-renderers/linkcard`
159
- - `@haklex/rich-renderers/mention`
160
- - `@haklex/rich-renderers/mermaid`
161
- - `@haklex/rich-renderers/video`
162
- - `@haklex/rich-renderers/gallery`
163
- - `@haklex/rich-renderers/embed`
164
- - `@haklex/rich-renderers/tldraw`
165
- - `@haklex/rich-renderers/style.css`
166
-
167
- ## 设计模式
36
+ This aggregator re-exports all static renderers from individual renderer packages as well as extension static renderers, so you do not need to install or configure them individually.
168
37
 
169
- ### 1) 配置聚合模式
170
-
171
- 把复杂渲染能力汇总为单个对象 `enhancedRendererConfig`，业务只需要：
172
-
173
- - 注入这一个 config
174
- - 注册扩展节点（`extraNodes`）
175
- - 引入对应样式
176
-
177
- ### 2) 静态与编辑分层
178
-
179
- 本包只关注静态渲染，不在这里装配编辑插件。
180
- 编辑行为统一在 `@haklex/rich-renderers-edit` 处理，保持 bundle 边界清晰。
181
-
182
- ### 3) 可覆写不 fork
183
-
184
- 你可以基于预置配置增量覆写：
38
+ The config can be extended or overridden:
185
39
 
186
40
  ```tsx
187
41
  const rendererConfig = {
188
42
  ...enhancedRendererConfig,
189
- CodeBlock: MyCodeBlockRenderer,
43
+ CodeBlock: MyCustomCodeBlockRenderer,
190
44
  }
191
45
  ```
192
46
 
193
- ## 扩展接入建议
47
+ ## Exports
48
+
49
+ ### Configuration
50
+
51
+ - `enhancedRendererConfig` — Pre-configured renderer config with all static renderers registered
194
52
 
195
- 新增扩展时，建议同步维护：
53
+ ### Re-exports
196
54
 
197
- 1. 扩展包内导出 `nodes` 数组（静态）
198
- 2. 在本包 `config.ts` 注册静态 renderer（如适配 `RendererConfig` key）
199
- 3. 在本包 `index.ts` 与必要的子路径导出 API
55
+ All static renderers from individual packages, extension static renderers, and LinkCard plugins are re-exported for convenience.
200
56
 
201
- 对应编辑态扩展再接入 `@haklex/rich-renderers-edit`。
57
+ ### Sub-path Exports
58
+
59
+ | Path | Description |
60
+ | --- | --- |
61
+ | `@haklex/rich-renderers` | Full exports with `enhancedRendererConfig` |
62
+ | `@haklex/rich-renderers/alert` | Alert static renderer |
63
+ | `@haklex/rich-renderers/banner` | Banner static renderer |
64
+ | `@haklex/rich-renderers/codeblock` | CodeBlock static renderer |
65
+ | `@haklex/rich-renderers/image` | Image static renderer |
66
+ | `@haklex/rich-renderers/linkcard` | LinkCard static renderer + plugins |
67
+ | `@haklex/rich-renderers/mention` | Mention static renderer |
68
+ | `@haklex/rich-renderers/mermaid` | Mermaid static renderer |
69
+ | `@haklex/rich-renderers/ruby` | Ruby static renderer |
70
+ | `@haklex/rich-renderers/video` | Video static renderer |
71
+ | `@haklex/rich-renderers/code-snippet` | Code snippet extension renderer |
72
+ | `@haklex/rich-renderers/gallery` | Gallery extension renderer |
73
+ | `@haklex/rich-renderers/excalidraw` | Excalidraw extension renderer |
74
+ | `@haklex/rich-renderers/embed` | Embed extension renderer |
75
+ | `@haklex/rich-renderers/style.css` | Combined stylesheet |
76
+
77
+ ## Part of Haklex
78
+
79
+ This package is part of the [Haklex](../../README.md) rich editor ecosystem.
202
80
 
203
81
  ## License
204
82
 
package/package.json CHANGED
@@ -1,9 +1,14 @@
1
1
  {
2
2
  "name": "@haklex/rich-renderers",
3
- "type": "module",
4
- "version": "0.0.65",
3
+ "version": "0.0.67",
5
4
  "description": "Static renderers aggregator for haklex rich editor",
5
+ "repository": {
6
+ "type": "git",
7
+ "url": "https://github.com/Innei/haklex.git",
8
+ "directory": "packages/rich-renderers"
9
+ },
6
10
  "license": "MIT",
11
+ "type": "module",
7
12
  "exports": {
8
13
  ".": {
9
14
  "import": "./dist/index.mjs",
@@ -68,27 +73,21 @@
68
73
  "dist",
69
74
  "src/style.css"
70
75
  ],
71
- "peerDependencies": {
72
- "@lexical/react": "^0.41.0",
73
- "lexical": "^0.41.0",
74
- "react": ">=19",
75
- "react-dom": ">=19"
76
- },
77
76
  "dependencies": {
78
- "@haklex/rich-editor": "0.0.65",
79
- "@haklex/rich-ext-code-snippet": "0.0.65",
80
- "@haklex/rich-ext-excalidraw": "0.0.65",
81
- "@haklex/rich-ext-embed": "0.0.65",
82
- "@haklex/rich-ext-gallery": "0.0.65",
83
- "@haklex/rich-renderer-banner": "0.0.65",
84
- "@haklex/rich-renderer-image": "0.0.65",
85
- "@haklex/rich-renderer-alert": "0.0.65",
86
- "@haklex/rich-renderer-codeblock": "0.0.65",
87
- "@haklex/rich-renderer-linkcard": "0.0.65",
88
- "@haklex/rich-renderer-mention": "0.0.65",
89
- "@haklex/rich-renderer-mermaid": "0.0.65",
90
- "@haklex/rich-renderer-video": "0.0.65",
91
- "@haklex/rich-renderer-ruby": "0.0.65"
77
+ "@haklex/rich-editor": "0.0.67",
78
+ "@haklex/rich-ext-excalidraw": "0.0.67",
79
+ "@haklex/rich-ext-embed": "0.0.67",
80
+ "@haklex/rich-ext-gallery": "0.0.67",
81
+ "@haklex/rich-renderer-banner": "0.0.67",
82
+ "@haklex/rich-renderer-alert": "0.0.67",
83
+ "@haklex/rich-ext-code-snippet": "0.0.67",
84
+ "@haklex/rich-renderer-image": "0.0.67",
85
+ "@haklex/rich-renderer-codeblock": "0.0.67",
86
+ "@haklex/rich-renderer-linkcard": "0.0.67",
87
+ "@haklex/rich-renderer-mention": "0.0.67",
88
+ "@haklex/rich-renderer-mermaid": "0.0.67",
89
+ "@haklex/rich-renderer-ruby": "0.0.67",
90
+ "@haklex/rich-renderer-video": "0.0.67"
92
91
  },
93
92
  "devDependencies": {
94
93
  "@lexical/react": "^0.41.0",
@@ -101,6 +100,12 @@
101
100
  "vite": "^7.3.1",
102
101
  "vite-plugin-dts": "^4.5.4"
103
102
  },
103
+ "peerDependencies": {
104
+ "@lexical/react": "^0.41.0",
105
+ "lexical": "^0.41.0",
106
+ "react": ">=19",
107
+ "react-dom": ">=19"
108
+ },
104
109
  "publishConfig": {
105
110
  "access": "public"
106
111
  },