ds-markdown 0.1.2-beta.2 → 0.1.2-beta.3
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.
- package/README.en.md +254 -28
- package/README.ja.md +49 -33
- package/README.ko.md +49 -28
- package/README.md +330 -28
- package/dist/cjs/Markdown/index.js +3 -0
- package/dist/cjs/Markdown/index.js.map +1 -1
- package/dist/cjs/MarkdownCMD/index.js +26 -13
- package/dist/cjs/MarkdownCMD/index.js.map +1 -1
- package/dist/cjs/defined.d.ts +15 -6
- package/dist/cjs/hooks/useTypingTask.d.ts +4 -1
- package/dist/cjs/hooks/useTypingTask.js +82 -57
- package/dist/cjs/hooks/useTypingTask.js.map +1 -1
- package/dist/esm/Markdown/index.js +3 -0
- package/dist/esm/Markdown/index.js.map +1 -1
- package/dist/esm/MarkdownCMD/index.js +26 -13
- package/dist/esm/MarkdownCMD/index.js.map +1 -1
- package/dist/esm/defined.d.ts +15 -6
- package/dist/esm/hooks/useTypingTask.d.ts +4 -1
- package/dist/esm/hooks/useTypingTask.js +82 -57
- package/dist/esm/hooks/useTypingTask.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -182,6 +182,211 @@ React 19 带来了许多激动人心的新特性：
|
|
|
182
182
|
}
|
|
183
183
|
```
|
|
184
184
|
|
|
185
|
+
### 🎯 高级回调控制
|
|
186
|
+
|
|
187
|
+
```tsx
|
|
188
|
+
import { useRef, useState } from 'react';
|
|
189
|
+
import { MarkdownCMD, MarkdownCMDRef } from 'ds-markdown';
|
|
190
|
+
|
|
191
|
+
function AdvancedCallbackDemo() {
|
|
192
|
+
const markdownRef = useRef<MarkdownCMDRef>(null);
|
|
193
|
+
const [typingStats, setTypingStats] = useState({ progress: 0, currentChar: '', totalChars: 0 });
|
|
194
|
+
|
|
195
|
+
const handleBeforeTypedChar = async (data) => {
|
|
196
|
+
// 在字符打字前进行异步操作
|
|
197
|
+
console.log('即将打字:', data.currentChar);
|
|
198
|
+
|
|
199
|
+
// 可以在这里进行网络请求、数据验证等异步操作
|
|
200
|
+
if (data.currentChar === '!') {
|
|
201
|
+
await new Promise((resolve) => setTimeout(resolve, 500)); // 模拟延迟
|
|
202
|
+
}
|
|
203
|
+
};
|
|
204
|
+
|
|
205
|
+
const handleTypedChar = (data) => {
|
|
206
|
+
// 更新打字统计信息
|
|
207
|
+
setTypingStats({
|
|
208
|
+
progress: Math.round(data.percent),
|
|
209
|
+
currentChar: data.currentChar,
|
|
210
|
+
totalChars: data.currentIndex + 1,
|
|
211
|
+
});
|
|
212
|
+
|
|
213
|
+
// 可以在这里添加音效、动画等效果
|
|
214
|
+
if (data.currentChar === '.') {
|
|
215
|
+
// 播放句号音效
|
|
216
|
+
console.log('播放句号音效');
|
|
217
|
+
}
|
|
218
|
+
};
|
|
219
|
+
|
|
220
|
+
const handleStart = (data) => {
|
|
221
|
+
console.log('开始打字:', data.currentChar);
|
|
222
|
+
};
|
|
223
|
+
|
|
224
|
+
const handleEnd = (data) => {
|
|
225
|
+
console.log('打字完成:', data.str);
|
|
226
|
+
};
|
|
227
|
+
|
|
228
|
+
const startDemo = () => {
|
|
229
|
+
markdownRef.current?.clear();
|
|
230
|
+
markdownRef.current?.push(
|
|
231
|
+
'# 高级回调演示\n\n' +
|
|
232
|
+
'这个示例展示了如何使用 `onBeforeTypedChar` 和 `onTypedChar` 回调：\n\n' +
|
|
233
|
+
'- 🎯 **打字前回调**：可以在字符显示前进行异步操作\n' +
|
|
234
|
+
'- 📊 **打字后回调**：可以实时更新进度和添加特效\n' +
|
|
235
|
+
'- ⚡ **性能优化**：支持异步操作，不影响打字流畅度\n\n' +
|
|
236
|
+
'当前进度：' +
|
|
237
|
+
typingStats.progress +
|
|
238
|
+
'%\n' +
|
|
239
|
+
'已打字数：' +
|
|
240
|
+
typingStats.totalChars +
|
|
241
|
+
'\n\n' +
|
|
242
|
+
'这是一个非常强大的功能！',
|
|
243
|
+
'answer',
|
|
244
|
+
);
|
|
245
|
+
};
|
|
246
|
+
|
|
247
|
+
return (
|
|
248
|
+
<div>
|
|
249
|
+
<button onClick={startDemo}>🚀 开始高级演示</button>
|
|
250
|
+
|
|
251
|
+
<div style={{ margin: '10px 0', padding: '10px', background: '#f5f5f5', borderRadius: '4px' }}>
|
|
252
|
+
<strong>打字统计：</strong> 进度 {typingStats.progress}% | 当前字符: "{typingStats.currentChar}" | 总字符数: {typingStats.totalChars}
|
|
253
|
+
</div>
|
|
254
|
+
|
|
255
|
+
<MarkdownCMD ref={markdownRef} interval={30} onBeforeTypedChar={handleBeforeTypedChar} onTypedChar={handleTypedChar} onStart={handleStart} onEnd={handleEnd} />
|
|
256
|
+
</div>
|
|
257
|
+
);
|
|
258
|
+
}
|
|
259
|
+
```
|
|
260
|
+
|
|
261
|
+
### 🔄 重新开始动画演示
|
|
262
|
+
|
|
263
|
+
```tsx
|
|
264
|
+
import { useRef, useState } from 'react';
|
|
265
|
+
import { MarkdownCMD, MarkdownCMDRef } from 'ds-markdown';
|
|
266
|
+
|
|
267
|
+
function RestartDemo() {
|
|
268
|
+
const markdownRef = useRef<MarkdownCMDRef>(null);
|
|
269
|
+
const [isPlaying, setIsPlaying] = useState(false);
|
|
270
|
+
|
|
271
|
+
const startContent = () => {
|
|
272
|
+
markdownRef.current?.clear();
|
|
273
|
+
markdownRef.current?.push(
|
|
274
|
+
'# 重新开始动画演示\n\n' +
|
|
275
|
+
'这个示例展示了如何使用 `restart()` 方法：\n\n' +
|
|
276
|
+
'- 🔄 **重新开始**：从头开始播放当前内容\n' +
|
|
277
|
+
'- ⏸️ **暂停恢复**：可以随时暂停和恢复\n' +
|
|
278
|
+
'- 🎯 **精确控制**：完全控制动画播放状态\n\n' +
|
|
279
|
+
'当前状态：' +
|
|
280
|
+
(isPlaying ? '播放中' : '已暂停') +
|
|
281
|
+
'\n\n' +
|
|
282
|
+
'这是一个非常实用的功能！',
|
|
283
|
+
'answer',
|
|
284
|
+
);
|
|
285
|
+
setIsPlaying(true);
|
|
286
|
+
};
|
|
287
|
+
|
|
288
|
+
const handleStart = () => {
|
|
289
|
+
markdownRef.current?.start();
|
|
290
|
+
setIsPlaying(true);
|
|
291
|
+
};
|
|
292
|
+
|
|
293
|
+
const handleStop = () => {
|
|
294
|
+
markdownRef.current?.stop();
|
|
295
|
+
setIsPlaying(false);
|
|
296
|
+
};
|
|
297
|
+
|
|
298
|
+
const handleResume = () => {
|
|
299
|
+
markdownRef.current?.resume();
|
|
300
|
+
setIsPlaying(true);
|
|
301
|
+
};
|
|
302
|
+
|
|
303
|
+
const handleRestart = () => {
|
|
304
|
+
markdownRef.current?.restart();
|
|
305
|
+
setIsPlaying(true);
|
|
306
|
+
};
|
|
307
|
+
|
|
308
|
+
const handleEnd = () => {
|
|
309
|
+
setIsPlaying(false);
|
|
310
|
+
};
|
|
311
|
+
|
|
312
|
+
return (
|
|
313
|
+
<div>
|
|
314
|
+
<div style={{ marginBottom: '10px', display: 'flex', gap: '10px', flexWrap: 'wrap' }}>
|
|
315
|
+
<button onClick={startContent}>🚀 开始内容</button>
|
|
316
|
+
<button onClick={handleStart} disabled={isPlaying}>
|
|
317
|
+
▶️ 开始
|
|
318
|
+
</button>
|
|
319
|
+
<button onClick={handleStop} disabled={!isPlaying}>
|
|
320
|
+
⏸️ 暂停
|
|
321
|
+
</button>
|
|
322
|
+
<button onClick={handleResume} disabled={isPlaying}>
|
|
323
|
+
▶️ 恢复
|
|
324
|
+
</button>
|
|
325
|
+
<button onClick={handleRestart}>🔄 重新开始</button>
|
|
326
|
+
</div>
|
|
327
|
+
|
|
328
|
+
<div style={{ margin: '10px 0', padding: '10px', background: '#f5f5f5', borderRadius: '4px' }}>
|
|
329
|
+
<strong>动画状态：</strong> {isPlaying ? '🟢 播放中' : '🔴 已暂停'}
|
|
330
|
+
</div>
|
|
331
|
+
|
|
332
|
+
<MarkdownCMD ref={markdownRef} interval={25} onEnd={handleEnd} />
|
|
333
|
+
</div>
|
|
334
|
+
);
|
|
335
|
+
}
|
|
336
|
+
```
|
|
337
|
+
|
|
338
|
+
### ▶️ 手动开始动画演示
|
|
339
|
+
|
|
340
|
+
```tsx
|
|
341
|
+
import { useRef, useState } from 'react';
|
|
342
|
+
import { MarkdownCMD, MarkdownCMDRef } from 'ds-markdown';
|
|
343
|
+
|
|
344
|
+
function StartDemo() {
|
|
345
|
+
const markdownRef = useRef<MarkdownCMDRef>(null);
|
|
346
|
+
const [isPlaying, setIsPlaying] = useState(false);
|
|
347
|
+
|
|
348
|
+
const loadContent = () => {
|
|
349
|
+
markdownRef.current?.clear();
|
|
350
|
+
markdownRef.current?.push(
|
|
351
|
+
'# 手动开始动画演示\n\n' +
|
|
352
|
+
'这个示例展示了如何使用 `start()` 方法：\n\n' +
|
|
353
|
+
'- 🎯 **手动控制**：当 `autoStartTyping=false` 时，需要手动调用 `start()`\n' +
|
|
354
|
+
'- ⏱️ **延迟开始**：可以在用户交互后开始动画\n' +
|
|
355
|
+
'- 🎮 **游戏化**：适合需要用户主动触发的场景\n\n' +
|
|
356
|
+
'点击"开始动画"按钮来手动启动打字效果！',
|
|
357
|
+
'answer',
|
|
358
|
+
);
|
|
359
|
+
setIsPlaying(false);
|
|
360
|
+
};
|
|
361
|
+
|
|
362
|
+
const handleStart = () => {
|
|
363
|
+
markdownRef.current?.start();
|
|
364
|
+
setIsPlaying(true);
|
|
365
|
+
};
|
|
366
|
+
|
|
367
|
+
const handleEnd = () => {
|
|
368
|
+
setIsPlaying(false);
|
|
369
|
+
};
|
|
370
|
+
|
|
371
|
+
return (
|
|
372
|
+
<div>
|
|
373
|
+
<div style={{ marginBottom: '10px', display: 'flex', gap: '10px', flexWrap: 'wrap' }}>
|
|
374
|
+
<button onClick={loadContent}>📝 加载内容</button>
|
|
375
|
+
<button onClick={handleStart} disabled={isPlaying}>
|
|
376
|
+
▶️ 开始动画
|
|
377
|
+
</button>
|
|
378
|
+
</div>
|
|
379
|
+
|
|
380
|
+
<div style={{ margin: '10px 0', padding: '10px', background: '#f5f5f5', borderRadius: '4px' }}>
|
|
381
|
+
<strong>状态：</strong> {isPlaying ? '🟢 动画播放中' : '🔴 等待开始'}
|
|
382
|
+
</div>
|
|
383
|
+
|
|
384
|
+
<MarkdownCMD ref={markdownRef} interval={30} autoStartTyping={false} onEnd={handleEnd} />
|
|
385
|
+
</div>
|
|
386
|
+
);
|
|
387
|
+
}
|
|
388
|
+
```
|
|
389
|
+
|
|
185
390
|
---
|
|
186
391
|
|
|
187
392
|
## 📚 完整 API 文档
|
|
@@ -192,28 +397,43 @@ React 19 带来了许多激动人心的新特性：
|
|
|
192
397
|
import DsMarkdown, { MarkdownCMD } from 'ds-markdown';
|
|
193
398
|
```
|
|
194
399
|
|
|
195
|
-
| 属性
|
|
196
|
-
|
|
|
197
|
-
| `interval`
|
|
198
|
-
| `timerType`
|
|
199
|
-
| `answerType`
|
|
200
|
-
| `theme`
|
|
201
|
-
| `plugins`
|
|
202
|
-
| `math`
|
|
203
|
-
| `onEnd`
|
|
204
|
-
| `onStart`
|
|
205
|
-
| `
|
|
206
|
-
| `
|
|
400
|
+
| 属性 | 类型 | 说明 | 默认值 |
|
|
401
|
+
| ------------------- | ------------------------------------------- | ------------------------------------------------ | ----------------------------------------------------------- |
|
|
402
|
+
| `interval` | `number` | 打字间隔 (毫秒) | `30` |
|
|
403
|
+
| `timerType` | `'setTimeout'` \| `'requestAnimationFrame'` | 定时器类型 | 当前默认值是`setTimeout`，后期会改为`requestAnimationFrame` |
|
|
404
|
+
| `answerType` | `'thinking'` \| `'answer'` | 内容类型 (影响样式主题) | `'answer'` |
|
|
405
|
+
| `theme` | `'light'` \| `'dark'` | 主题类型 | `'light'` |
|
|
406
|
+
| `plugins` | `IMarkdownPlugin[]` | 插件配置 | `[]` |
|
|
407
|
+
| `math` | [IMarkdownMath](#IMarkdownMath) | 数学公式配置 | `{ splitSymbol: 'dollar' }` |
|
|
408
|
+
| `onEnd` | `(data: EndData) => void` | 打字结束回调 | - |
|
|
409
|
+
| `onStart` | `(data: StartData) => void` | 打字开始回调 | - |
|
|
410
|
+
| `onBeforeTypedChar` | `(data: IBeforeTypedChar) => Promise<void>` | 字符打字前的回调，支持异步操作，会阻塞之后的打字 | - |
|
|
411
|
+
| `onTypedChar` | `(data: ITypedChar) => void` | 每字符打字后的回调 | - |
|
|
412
|
+
| `disableTyping` | `boolean` | 禁用打字动画效果 | `false` |
|
|
413
|
+
| `autoStartTyping` | `boolean` | 是否自动开始打字动画，设为 false 时需手动触发 | `true` |
|
|
207
414
|
|
|
208
415
|
> 注意： 如果当在打字中 `disableTyping`从 `true` 变为 `false`，则在下一个打字触发时，会把剩下的所有字一次性显示
|
|
209
416
|
|
|
417
|
+
### IBeforeTypedChar
|
|
418
|
+
|
|
419
|
+
| 属性 | 类型 | 说明 | 默认值 |
|
|
420
|
+
| -------------- | ------------ | ---------------------------- | ------ |
|
|
421
|
+
| `currentIndex` | `number` | 当前字符在整个字符串中的索引 | `0` |
|
|
422
|
+
| `currentChar` | `string` | 当前即将打字的字符 | - |
|
|
423
|
+
| `answerType` | `AnswerType` | 内容类型 (thinking/answer) | - |
|
|
424
|
+
| `prevStr` | `string` | 当前类型内容的前缀字符串 | - |
|
|
425
|
+
| `percent` | `number` | 打字进度百分比 (0-100) | `0` |
|
|
426
|
+
|
|
210
427
|
### ITypedChar
|
|
211
428
|
|
|
212
|
-
| 属性 | 类型
|
|
213
|
-
| -------------- |
|
|
214
|
-
| `
|
|
215
|
-
| `currentChar` | `string`
|
|
216
|
-
| `
|
|
429
|
+
| 属性 | 类型 | 说明 | 默认值 |
|
|
430
|
+
| -------------- | ------------ | ---------------------------- | ------ |
|
|
431
|
+
| `currentIndex` | `number` | 当前字符在整个字符串中的索引 | `0` |
|
|
432
|
+
| `currentChar` | `string` | 当前已打字的字符 | - |
|
|
433
|
+
| `answerType` | `AnswerType` | 内容类型 (thinking/answer) | - |
|
|
434
|
+
| `prevStr` | `string` | 当前类型内容的前缀字符串 | - |
|
|
435
|
+
| `currentStr` | `string` | 当前类型内容的完整字符串 | - |
|
|
436
|
+
| `percent` | `number` | 打字进度百分比 (0-100) | `0` |
|
|
217
437
|
|
|
218
438
|
#### IMarkdownMath
|
|
219
439
|
|
|
@@ -239,26 +459,32 @@ import DsMarkdown, { MarkdownCMD } from 'ds-markdown';
|
|
|
239
459
|
|
|
240
460
|
#### 默认导出 DsMarkdown
|
|
241
461
|
|
|
242
|
-
| 方法
|
|
243
|
-
|
|
|
244
|
-
| `
|
|
245
|
-
| `
|
|
462
|
+
| 方法 | 参数 | 说明 |
|
|
463
|
+
| --------- | ---- | -------------------------------------- |
|
|
464
|
+
| `start` | - | 开始打字动画 |
|
|
465
|
+
| `stop` | - | 暂停打字动画 |
|
|
466
|
+
| `resume` | - | 恢复打字动画 |
|
|
467
|
+
| `restart` | - | 重新开始打字动画，从头开始播放当前内容 |
|
|
246
468
|
|
|
247
469
|
#### MarkdownCMD 暴露的方法
|
|
248
470
|
|
|
249
|
-
| 方法 | 参数 | 说明
|
|
250
|
-
| ----------------- | ------------------------------------------- |
|
|
251
|
-
| `push` | `(content: string, answerType: AnswerType)` | 添加内容并开始打字
|
|
252
|
-
| `clear` | - | 清空所有内容和状态
|
|
253
|
-
| `triggerWholeEnd` | - | 手动触发完成回调
|
|
254
|
-
| `
|
|
255
|
-
| `
|
|
471
|
+
| 方法 | 参数 | 说明 |
|
|
472
|
+
| ----------------- | ------------------------------------------- | -------------------------------------- |
|
|
473
|
+
| `push` | `(content: string, answerType: AnswerType)` | 添加内容并开始打字 |
|
|
474
|
+
| `clear` | - | 清空所有内容和状态 |
|
|
475
|
+
| `triggerWholeEnd` | - | 手动触发完成回调 |
|
|
476
|
+
| `start` | - | 开始打字动画 |
|
|
477
|
+
| `stop` | - | 暂停打字动画 |
|
|
478
|
+
| `resume` | - | 恢复打字动画 |
|
|
479
|
+
| `restart` | - | 重新开始打字动画，从头开始播放当前内容 |
|
|
256
480
|
|
|
257
481
|
**用法示例：**
|
|
258
482
|
|
|
259
483
|
```tsx
|
|
484
|
+
markdownRef.current?.start(); // 开始动画
|
|
260
485
|
markdownRef.current?.stop(); // 暂停动画
|
|
261
486
|
markdownRef.current?.resume(); // 恢复动画
|
|
487
|
+
markdownRef.current?.restart(); // 重新开始动画
|
|
262
488
|
```
|
|
263
489
|
|
|
264
490
|
---
|
|
@@ -531,6 +757,82 @@ function MathStreamingDemo() {
|
|
|
531
757
|
}
|
|
532
758
|
```
|
|
533
759
|
|
|
760
|
+
### 🎯 高级回调控制
|
|
761
|
+
|
|
762
|
+
```tsx
|
|
763
|
+
import { useRef, useState } from 'react';
|
|
764
|
+
import { MarkdownCMD, MarkdownCMDRef } from 'ds-markdown';
|
|
765
|
+
|
|
766
|
+
function AdvancedCallbackDemo() {
|
|
767
|
+
const markdownRef = useRef<MarkdownCMDRef>(null);
|
|
768
|
+
const [typingStats, setTypingStats] = useState({ progress: 0, currentChar: '', totalChars: 0 });
|
|
769
|
+
|
|
770
|
+
const handleBeforeTypedChar = async (data) => {
|
|
771
|
+
// 在字符打字前进行异步操作
|
|
772
|
+
console.log('即将打字:', data.currentChar);
|
|
773
|
+
|
|
774
|
+
// 可以在这里进行网络请求、数据验证等异步操作
|
|
775
|
+
if (data.currentChar === '!') {
|
|
776
|
+
await new Promise((resolve) => setTimeout(resolve, 500)); // 模拟延迟
|
|
777
|
+
}
|
|
778
|
+
};
|
|
779
|
+
|
|
780
|
+
const handleTypedChar = (data) => {
|
|
781
|
+
// 更新打字统计信息
|
|
782
|
+
setTypingStats({
|
|
783
|
+
progress: Math.round(data.percent),
|
|
784
|
+
currentChar: data.currentChar,
|
|
785
|
+
totalChars: data.currentIndex + 1,
|
|
786
|
+
});
|
|
787
|
+
|
|
788
|
+
// 可以在这里添加音效、动画等效果
|
|
789
|
+
if (data.currentChar === '.') {
|
|
790
|
+
// 播放句号音效
|
|
791
|
+
console.log('播放句号音效');
|
|
792
|
+
}
|
|
793
|
+
};
|
|
794
|
+
|
|
795
|
+
const handleStart = (data) => {
|
|
796
|
+
console.log('开始打字:', data.currentChar);
|
|
797
|
+
};
|
|
798
|
+
|
|
799
|
+
const handleEnd = (data) => {
|
|
800
|
+
console.log('打字完成:', data.str);
|
|
801
|
+
};
|
|
802
|
+
|
|
803
|
+
const startDemo = () => {
|
|
804
|
+
markdownRef.current?.clear();
|
|
805
|
+
markdownRef.current?.push(
|
|
806
|
+
'# 高级回调演示\n\n' +
|
|
807
|
+
'这个示例展示了如何使用 `onBeforeTypedChar` 和 `onTypedChar` 回调：\n\n' +
|
|
808
|
+
'- 🎯 **打字前回调**：可以在字符显示前进行异步操作\n' +
|
|
809
|
+
'- 📊 **打字后回调**：可以实时更新进度和添加特效\n' +
|
|
810
|
+
'- ⚡ **性能优化**：支持异步操作，不影响打字流畅度\n\n' +
|
|
811
|
+
'当前进度：' +
|
|
812
|
+
typingStats.progress +
|
|
813
|
+
'%\n' +
|
|
814
|
+
'已打字数：' +
|
|
815
|
+
typingStats.totalChars +
|
|
816
|
+
'\n\n' +
|
|
817
|
+
'这是一个非常强大的功能！',
|
|
818
|
+
'answer',
|
|
819
|
+
);
|
|
820
|
+
};
|
|
821
|
+
|
|
822
|
+
return (
|
|
823
|
+
<div>
|
|
824
|
+
<button onClick={startDemo}>🚀 开始高级演示</button>
|
|
825
|
+
|
|
826
|
+
<div style={{ margin: '10px 0', padding: '10px', background: '#f5f5f5', borderRadius: '4px' }}>
|
|
827
|
+
<strong>打字统计：</strong> 进度 {typingStats.progress}% | 当前字符: "{typingStats.currentChar}" | 总字符数: {typingStats.totalChars}
|
|
828
|
+
</div>
|
|
829
|
+
|
|
830
|
+
<MarkdownCMD ref={markdownRef} interval={30} onBeforeTypedChar={handleBeforeTypedChar} onTypedChar={handleTypedChar} onStart={handleStart} onEnd={handleEnd} />
|
|
831
|
+
</div>
|
|
832
|
+
);
|
|
833
|
+
}
|
|
834
|
+
```
|
|
835
|
+
|
|
534
836
|
## 🔧 最佳实践
|
|
535
837
|
|
|
536
838
|
### 1. 性能优化
|
|
@@ -48,6 +48,9 @@ const MarkdownInner = ({ children: _children = '', answerType, markdownRef, ...r
|
|
|
48
48
|
start: () => {
|
|
49
49
|
cmdRef.current.start();
|
|
50
50
|
},
|
|
51
|
+
restart: () => {
|
|
52
|
+
cmdRef.current.restart();
|
|
53
|
+
},
|
|
51
54
|
}));
|
|
52
55
|
return (0, jsx_runtime_1.jsx)(index_js_1.default, { ref: cmdRef, ...rest });
|
|
53
56
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Markdown/index.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAAiG;AACjG,gDAAyC;AAEzC,uEAAkD;AAMlD,MAAM,aAAa,GAAiC,CAAC,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE;IACrH,MAAM,MAAM,GAAG,IAAA,cAAM,EAAiB,IAAK,CAAC,CAAC;IAC7C,MAAM,SAAS,GAAG,IAAA,cAAM,EAAC,EAAE,CAAC,CAAC;IAC7B,MAAM,OAAO,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC3B,IAAI,OAAO,SAAS,KAAK,QAAQ,EAAE,CAAC;YAClC,OAAO,SAAS,CAAC;QACnB,CAAC;QACD,IAAI,qBAAO,EAAE,CAAC;YACZ,OAAO,CAAC,KAAK,CAAC,wBAAwB,CAAC,CAAC;QAC1C,CAAC;QACD,OAAO,EAAE,CAAC;IACZ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,SAAS,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;YAClC,IAAI,UAAU,GAAG,EAAE,CAAC;YACpB,IAAI,SAAS,CAAC,OAAO,KAAK,EAAE,EAAE,CAAC;gBAC7B,UAAU,GAAG,OAAO,CAAC;YACvB,CAAC;iBAAM,CAAC;gBACN,IAAI,OAAO,CAAC,UAAU,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,CAAC;oBAC1C,UAAU,GAAG,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;gBACvD,CAAC;qBAAM,CAAC;oBACN,UAAU,GAAG,OAAO,CAAC;oBACrB,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;gBACzB,CAAC;YACH,CAAC;YACD,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,CAAC;YAC5C,SAAS,CAAC,OAAO,GAAG,OAAO,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAE1B,IAAA,2BAAmB,EAAC,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC;QACtC,IAAI,EAAE,GAAG,EAAE;YACT,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QACxB,CAAC;QACD,MAAM,EAAE,GAAG,EAAE;YACX,MAAM,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;QAC1B,CAAC;QACD,KAAK,EAAE,GAAG,EAAE;YACV,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;QACzB,CAAC;KACF,CAAC,CAAC,CAAC;IAEJ,OAAO,uBAAC,kBAAW,IAAC,GAAG,EAAE,MAAM,KAAM,IAAI,GAAI,CAAC;AAChD,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAG,IAAA,kBAAU,EAA6B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrE,MAAM,EAAE,QAAQ,GAAG,EAAE,EAAE,UAAU,GAAG,QAAQ,EAAE,GAAG,KAAK,CAAC;IAEvD,IAAI,qBAAO,EAAE,CAAC;QACZ,IAAI,CAAC,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;YACjD,MAAM,IAAI,KAAK,CAAC,yCAAyC,CAAC,CAAC;QAC7D,CAAC;QACD,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;YACjC,MAAM,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC;QAC5C,CAAC;IACH,CAAC;IAED,OAAO,uBAAC,aAAa,OAAK,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,GAAI,CAAC;AAChF,CAAC,CAAC,CAAC;AAEH,kBAAe,IAAA,YAAI,EAAC,QAAQ,CAAC,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Markdown/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -9,7 +9,7 @@ const index_js_1 = __importDefault(require("../components/HighReactMarkdown/inde
|
|
|
9
9
|
const classnames_1 = __importDefault(require("classnames"));
|
|
10
10
|
const constant_js_1 = require("../constant.js");
|
|
11
11
|
const useTypingTask_js_1 = require("../hooks/useTypingTask.js");
|
|
12
|
-
const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, onTypedChar, timerType = 'setTimeout', theme = 'light', math, plugins, disableTyping = false, autoStartTyping = true }, ref) => {
|
|
12
|
+
const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, onTypedChar, onBeforeTypedChar, timerType = 'setTimeout', theme = 'light', math, plugins, disableTyping = false, autoStartTyping = true }, ref) => {
|
|
13
13
|
/** 是否自动开启打字动画, 后面发生变化将不会生效 */
|
|
14
14
|
const autoStartTypingRef = (0, react_1.useRef)(autoStartTyping);
|
|
15
15
|
/** 是否打过字 */
|
|
@@ -27,10 +27,12 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
27
27
|
thinking: {
|
|
28
28
|
content: '',
|
|
29
29
|
length: 0,
|
|
30
|
+
prevLength: 0,
|
|
30
31
|
},
|
|
31
32
|
answer: {
|
|
32
33
|
content: '',
|
|
33
34
|
length: 0,
|
|
35
|
+
prevLength: 0,
|
|
34
36
|
},
|
|
35
37
|
allLength: 0,
|
|
36
38
|
});
|
|
@@ -55,6 +57,15 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
55
57
|
}
|
|
56
58
|
triggerUpdate();
|
|
57
59
|
};
|
|
60
|
+
const resetWholeContent = () => {
|
|
61
|
+
wholeContentRef.current.thinking.content = '';
|
|
62
|
+
wholeContentRef.current.thinking.length = 0;
|
|
63
|
+
wholeContentRef.current.thinking.prevLength = 0;
|
|
64
|
+
wholeContentRef.current.answer.content = '';
|
|
65
|
+
wholeContentRef.current.answer.length = 0;
|
|
66
|
+
wholeContentRef.current.answer.prevLength = 0;
|
|
67
|
+
wholeContentRef.current.allLength = 0;
|
|
68
|
+
};
|
|
58
69
|
// 使用新的打字任务 hook
|
|
59
70
|
const typingTask = (0, useTypingTask_js_1.useTypingTask)({
|
|
60
71
|
timerType,
|
|
@@ -63,10 +74,12 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
63
74
|
onEnd,
|
|
64
75
|
onStart,
|
|
65
76
|
onTypedChar,
|
|
77
|
+
onBeforeTypedChar,
|
|
66
78
|
processCharDisplay,
|
|
67
79
|
wholeContentRef,
|
|
68
80
|
disableTyping,
|
|
69
81
|
triggerUpdate,
|
|
82
|
+
resetWholeContent,
|
|
70
83
|
});
|
|
71
84
|
/**
|
|
72
85
|
* 内部推送处理逻辑
|
|
@@ -80,7 +93,6 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
80
93
|
const charObj = {
|
|
81
94
|
content: chatStr,
|
|
82
95
|
answerType,
|
|
83
|
-
contentType: 'segment',
|
|
84
96
|
tokenId: 0,
|
|
85
97
|
index,
|
|
86
98
|
};
|
|
@@ -97,11 +109,14 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
97
109
|
};
|
|
98
110
|
const processNoTypingPush = (content, answerType) => {
|
|
99
111
|
wholeContentRef.current[answerType].content += content;
|
|
112
|
+
// 记录打字前的长度
|
|
113
|
+
wholeContentRef.current[answerType].prevLength = wholeContentRef.current[answerType].length;
|
|
100
114
|
wholeContentRef.current[answerType].length += content.length;
|
|
101
115
|
triggerUpdate();
|
|
102
116
|
onEnd?.({
|
|
103
117
|
str: content,
|
|
104
|
-
|
|
118
|
+
answerStr: wholeContentRef.current.answer.content,
|
|
119
|
+
thinkingStr: wholeContentRef.current.thinking.content,
|
|
105
120
|
manual: false,
|
|
106
121
|
});
|
|
107
122
|
};
|
|
@@ -125,11 +140,7 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
125
140
|
typingTask.stop();
|
|
126
141
|
typingTask.typedIsManualStopRef.current = false;
|
|
127
142
|
charsRef.current = [];
|
|
128
|
-
|
|
129
|
-
wholeContentRef.current.thinking.length = 0;
|
|
130
|
-
wholeContentRef.current.answer.content = '';
|
|
131
|
-
wholeContentRef.current.answer.length = 0;
|
|
132
|
-
wholeContentRef.current.allLength = 0;
|
|
143
|
+
resetWholeContent();
|
|
133
144
|
isWholeTypedEndRef.current = false;
|
|
134
145
|
charIndexRef.current = 0;
|
|
135
146
|
isStartedTypingRef.current = false;
|
|
@@ -157,15 +168,17 @@ const MarkdownCMD = (0, react_1.forwardRef)(({ interval = 30, onEnd, onStart, on
|
|
|
157
168
|
if (!typingTask.isTyping()) {
|
|
158
169
|
// 这里需要手动触发结束回调，因为 hook 中的 triggerOnEnd 不能直接调用
|
|
159
170
|
onEnd?.({
|
|
160
|
-
str:
|
|
161
|
-
|
|
171
|
+
str: wholeContentRef.current.answer.content,
|
|
172
|
+
answerStr: wholeContentRef.current.answer.content,
|
|
173
|
+
thinkingStr: wholeContentRef.current.thinking.content,
|
|
162
174
|
manual: true,
|
|
163
175
|
});
|
|
164
176
|
}
|
|
165
177
|
},
|
|
166
|
-
/**
|
|
167
|
-
|
|
168
|
-
|
|
178
|
+
/** 重新开始打字任务 */
|
|
179
|
+
restart: () => {
|
|
180
|
+
typingTask.restart();
|
|
181
|
+
},
|
|
169
182
|
}));
|
|
170
183
|
const getParagraphs = (answerType) => {
|
|
171
184
|
const content = wholeContentRef.current[answerType].content || '';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/MarkdownCMD/index.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAA0E;AAE1E,wFAAyE;AACzE,4DAAoC;AAEpC,gDAAyC;AACzC,gEAA0D;AAE1D,MAAM,WAAW,GAAG,IAAA,kBAAU,EAC5B,CAAC,EAAE,QAAQ,GAAG,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,SAAS,GAAG,YAAY,EAAE,KAAK,GAAG,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,aAAa,GAAG,KAAK,EAAE,eAAe,GAAG,IAAI,EAAE,EAAE,GAAG,EAAE,EAAE;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/MarkdownCMD/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/cjs/defined.d.ts
CHANGED
|
@@ -9,10 +9,6 @@ export type Theme = 'light' | 'dark';
|
|
|
9
9
|
export interface IChar {
|
|
10
10
|
content: string;
|
|
11
11
|
answerType: AnswerType;
|
|
12
|
-
/**
|
|
13
|
-
* split_segment 两个连续的段落，需要做分割
|
|
14
|
-
*/
|
|
15
|
-
contentType: 'space' | 'segment' | 'split_segment';
|
|
16
12
|
tokenId: number;
|
|
17
13
|
/** 字符索引 */
|
|
18
14
|
index: number;
|
|
@@ -46,6 +42,10 @@ export interface IOnTypedCharData {
|
|
|
46
42
|
}
|
|
47
43
|
export interface ITypedChar extends IOnTypedCharData {
|
|
48
44
|
percent: number;
|
|
45
|
+
currentStr: string;
|
|
46
|
+
}
|
|
47
|
+
export interface IBeforeTypedChar extends IOnTypedCharData {
|
|
48
|
+
percent: number;
|
|
49
49
|
}
|
|
50
50
|
export interface MarkdownBaseProps {
|
|
51
51
|
/** 计时类型： 支持setTimeout和requestAnimationFrame */
|
|
@@ -60,6 +60,8 @@ export interface MarkdownBaseProps {
|
|
|
60
60
|
onEnd?: (data?: IEndData) => void;
|
|
61
61
|
/** 开始打字回调 */
|
|
62
62
|
onStart?: (data?: IOnTypedCharData) => void;
|
|
63
|
+
/** 打字前回调 */
|
|
64
|
+
onBeforeTypedChar?: (data?: IBeforeTypedChar) => Promise<void>;
|
|
63
65
|
/**
|
|
64
66
|
* 打字机打完一个字符回调
|
|
65
67
|
* @param char 字符
|
|
@@ -96,10 +98,12 @@ export interface IWholeContent {
|
|
|
96
98
|
thinking: {
|
|
97
99
|
content: string;
|
|
98
100
|
length: number;
|
|
101
|
+
prevLength: number;
|
|
99
102
|
};
|
|
100
103
|
answer: {
|
|
101
104
|
content: string;
|
|
102
105
|
length: number;
|
|
106
|
+
prevLength: number;
|
|
103
107
|
};
|
|
104
108
|
allLength: number;
|
|
105
109
|
}
|
|
@@ -107,6 +111,7 @@ export interface MarkdownBaseRef {
|
|
|
107
111
|
stop: () => void;
|
|
108
112
|
resume: () => void;
|
|
109
113
|
start: () => void;
|
|
114
|
+
restart: () => void;
|
|
110
115
|
}
|
|
111
116
|
/** Markdown 组件的ref 类型 */
|
|
112
117
|
export type MarkdownRef = MarkdownBaseRef;
|
|
@@ -117,7 +122,11 @@ export interface MarkdownCMDRef extends MarkdownBaseRef {
|
|
|
117
122
|
triggerWholeEnd: () => void;
|
|
118
123
|
}
|
|
119
124
|
export interface IEndData {
|
|
120
|
-
str?: string;
|
|
121
|
-
answerType?: AnswerType;
|
|
122
125
|
manual: boolean;
|
|
126
|
+
/** 回答字符串 */
|
|
127
|
+
answerStr: string;
|
|
128
|
+
/** 思考字符串 */
|
|
129
|
+
thinkingStr: string;
|
|
130
|
+
/** 打字机打过的字符串, 和answerStr 相同 */
|
|
131
|
+
str: string;
|
|
123
132
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AnswerType, IChar, ITypedChar, IWholeContent, MarkdownProps, IEndData } from '../defined.js';
|
|
1
|
+
import { AnswerType, IChar, ITypedChar, IWholeContent, MarkdownProps, IEndData, IBeforeTypedChar } from '../defined.js';
|
|
2
2
|
interface UseTypingTaskOptions {
|
|
3
3
|
timerType: MarkdownProps['timerType'];
|
|
4
4
|
interval: number;
|
|
@@ -10,11 +10,13 @@ interface UseTypingTaskOptions {
|
|
|
10
10
|
answerType: AnswerType;
|
|
11
11
|
prevStr: string;
|
|
12
12
|
}) => void;
|
|
13
|
+
onBeforeTypedChar?: (data?: IBeforeTypedChar) => Promise<void>;
|
|
13
14
|
onTypedChar?: (data?: ITypedChar) => void;
|
|
14
15
|
processCharDisplay: (char: IChar) => void;
|
|
15
16
|
wholeContentRef: React.RefObject<IWholeContent>;
|
|
16
17
|
disableTyping: boolean;
|
|
17
18
|
triggerUpdate: () => void;
|
|
19
|
+
resetWholeContent: () => void;
|
|
18
20
|
}
|
|
19
21
|
export interface TypingTaskController {
|
|
20
22
|
start: () => void;
|
|
@@ -24,6 +26,7 @@ export interface TypingTaskController {
|
|
|
24
26
|
/** 是否主动调用 stop 方法 */
|
|
25
27
|
typedIsManualStopRef: React.RefObject<boolean>;
|
|
26
28
|
resume: () => void;
|
|
29
|
+
restart: () => void;
|
|
27
30
|
}
|
|
28
31
|
export declare const useTypingTask: (options: UseTypingTaskOptions) => TypingTaskController;
|
|
29
32
|
export {};
|