react-markdown-typer 1.0.0-beta.2 โ†’ 1.0.0-beta.4

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.md CHANGED
@@ -59,7 +59,7 @@ A React component designed for modern AI applications, providing smooth real-tim
59
59
  - [๐Ÿš€ 5-Minute Quick Start](#-5-minute-quick-start)
60
60
  - [Basic Usage](#basic-usage)
61
61
  - [Disable Typing Animation](#disable-typing-animation)
62
- - [Math Formula Support](#math-formula-support)
62
+ - [Custom Markdown Processing](#custom-markdown-processing)
63
63
  - [AI Chat Scenario](#ai-chat-scenario)
64
64
  - [๐ŸŽฏ Advanced Callback Control](#-advanced-callback-control)
65
65
  - [๐Ÿ”„ Restart Animation Demo](#-restart-animation-demo)
@@ -68,16 +68,16 @@ A React component designed for modern AI applications, providing smooth real-tim
68
68
  - [Default Exported Props for MarkdownTyper and MarkdownCMD](#default-exported-props-for-markdowntyper-and-markdowncmd)
69
69
  - [IBeforeTypedChar](#ibeforetypedchar)
70
70
  - [ITypedChar](#itypedchar)
71
- - [IMarkdownMath](#imarkdownmath)
71
+ - [Custom Markdown Conversion](#custom-markdown-conversion)
72
72
  - [IMarkdownPlugin](#imarkdownplugin)
73
73
  - [Exposed Methods](#exposed-methods)
74
74
  - [Default Export MarkdownTyper](#default-export-markdowntyper)
75
75
  - [MarkdownCMD Exposed Methods](#markdowncmd-exposed-methods)
76
- - [๐Ÿงฎ Math Formula Guide](#-math-formula-guide)
77
- - [Basic Syntax](#basic-syntax)
78
- - [Delimiter Selection](#delimiter-selection)
79
- - [Streaming Math Formulas](#streaming-math-formulas)
80
- - [Style Customization](#style-customization)
76
+ - [๐Ÿ”ง Custom Markdown Processing Guide](#-custom-markdown-processing-guide)
77
+ - [Basic Usage](#basic-usage-1)
78
+ - [Advanced Processing](#advanced-processing)
79
+ - [Integration with External Processors](#integration-with-external-processors)
80
+ - [Content Filtering](#content-filtering)
81
81
  - [๐Ÿ”Œ Plugin System](#-plugin-system)
82
82
  - [๐ŸŽ›๏ธ Timer Modes Explained](#๏ธ-timer-modes-explained)
83
83
  - [`requestAnimationFrame` Mode ๐ŸŒŸ (Recommended)](#requestanimationframe-mode--recommended)
@@ -85,7 +85,7 @@ A React component designed for modern AI applications, providing smooth real-tim
85
85
  - [๐Ÿ“Š Performance Comparison](#-performance-comparison)
86
86
  - [๐Ÿ’ก Practical Examples](#-practical-examples)
87
87
  - [๐Ÿ“ AI Streaming Chat](#-ai-streaming-chat)
88
- - [๐Ÿงฎ Streaming Math Formula Rendering](#-streaming-math-formula-rendering)
88
+ - [๐Ÿ”ง Custom Markdown Processing Demo](#-custom-markdown-processing-demo)
89
89
  - [๐ŸŽฏ Advanced Callback Control](#-advanced-callback-control-1)
90
90
 
91
91
  ---
@@ -186,19 +186,23 @@ function StaticDemo() {
186
186
  }
187
187
  ```
188
188
 
189
- ### Math Formula Support
189
+ ### Custom Markdown Processing
190
190
 
191
191
  ```tsx
192
192
  import MarkdownTyper from 'react-markdown-typer';
193
- // If you need to display formulas, import the formula plugins
194
- import remarkMath from 'remark-math';
195
- import rehypeKatex from 'rehype-katex';
196
193
 
197
- function MathDemo() {
194
+ function CustomMarkdownDemo() {
195
+ const customConvertMarkdownString = (markdownString) => {
196
+ // Custom processing logic
197
+ return markdownString
198
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>') // Convert links
199
+ .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>') // Convert bold
200
+ .replace(/\*([^*]+)\*/g, '<em>$1</em>'); // Convert italic
201
+ };
202
+
198
203
  return (
199
- <MarkdownTyper interval={20} reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex] }} math={{ splitSymbol: 'dollar' }}>
200
- # Pythagorean Theorem In a right triangle, the square of the hypotenuse equals the sum of the squares of the other two sides: $a^2 + b^2 = c^2$ Where: - $a$ and $b$ are the legs - $c$ is the
201
- hypotenuse For the classic "3-4-5 triangle": $c = \sqrt{3 ^ (2 + 4) ^ 2} = \sqrt{25} = 5$
204
+ <MarkdownTyper interval={20} customConvertMarkdownString={customConvertMarkdownString}>
205
+ # Custom Markdown Processing This is **bold text** and *italic text*. Check out [our website](https://example.com) for more info!
202
206
  </MarkdownTyper>
203
207
  );
204
208
  }
@@ -237,10 +241,10 @@ Let's explore these new features together!`);
237
241
 
238
242
  ```tsx
239
243
  import { useRef, useState } from 'react';
240
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
244
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
241
245
 
242
246
  function AdvancedCallbackDemo() {
243
- const markdownRef = useRef<MarkdownCMDRef>(null);
247
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
244
248
  const [typingStats, setTypingStats] = useState({ progress: 0, currentChar: '', totalChars: 0 });
245
249
 
246
250
  const handleBeforeTypedChar = async (data) => {
@@ -313,10 +317,10 @@ function AdvancedCallbackDemo() {
313
317
 
314
318
  ```tsx
315
319
  import { useRef, useState } from 'react';
316
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
320
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
317
321
 
318
322
  function RestartDemo() {
319
- const markdownRef = useRef<MarkdownCMDRef>(null);
323
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
320
324
  const [isPlaying, setIsPlaying] = useState(false);
321
325
  const [hasStarted, setHasStarted] = useState(false);
322
326
 
@@ -398,10 +402,10 @@ function RestartDemo() {
398
402
 
399
403
  ```tsx
400
404
  import { useRef, useState } from 'react';
401
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
405
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
402
406
 
403
407
  function StartDemo() {
404
- const markdownRef = useRef<MarkdownCMDRef>(null);
408
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
405
409
  const [isPlaying, setIsPlaying] = useState(false);
406
410
  const [hasStarted, setHasStarted] = useState(false);
407
411
 
@@ -464,18 +468,18 @@ function StartDemo() {
464
468
  import MarkdownTyper, { MarkdownCMD } from 'react-markdown-typer';
465
469
  ```
466
470
 
467
- | Prop | Type | Description | Default |
468
- | ------------------- | ------------------------------------------- | ------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- |
469
- | `interval` | `number` | Typing interval (ms) | `30` |
470
- | `timerType` | `'setTimeout'` \| `'requestAnimationFrame'` | Timer type, not dynamically changeable | Default is `setTimeout`, will switch to `requestAnimationFrame` in the future |
471
- | `theme` | `'light'` \| `'dark'` | Theme type | `'light'` |
472
- | `math` | [IMarkdownMath](#IMarkdownMath) | Math formula config | `{ splitSymbol: 'dollar' }` |
473
- | `onEnd` | `(data: EndData) => void` | Typing end callback | - |
474
- | `onStart` | `(data: StartData) => void` | Typing start callback | - |
475
- | `onBeforeTypedChar` | `(data: IBeforeTypedChar) => Promise<void>` | Callback before typing a character, supports async, blocks next typing | - |
476
- | `onTypedChar` | `(data: ITypedChar) => void` | Callback after each character | - |
477
- | `disableTyping` | `boolean` | Disable typing animation | `false` |
478
- | `autoStartTyping` | `boolean` | Whether to auto start typing animation, set false to trigger manually, not dynamically changeable | `true` |
471
+ | Prop | Type | Description | Default |
472
+ | ----------------------------- | ------------------------------------------- | ------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- |
473
+ | `interval` | `number` | Typing interval (ms) | `30` |
474
+ | `timerType` | `'setTimeout'` \| `'requestAnimationFrame'` | Timer type, not dynamically changeable | Default is `setTimeout`, will switch to `requestAnimationFrame` in the future |
475
+ | `theme` | `'light'` \| `'dark'` | Theme type | `'light'` |
476
+ | `customConvertMarkdownString` | `(markdownString: string) => string` | Custom markdown string conversion function | - |
477
+ | `onEnd` | `(data: EndData) => void` | Typing end callback | - |
478
+ | `onStart` | `(data: StartData) => void` | Typing start callback | - |
479
+ | `onBeforeTypedChar` | `(data: IBeforeTypedChar) => Promise<void>` | Callback before typing a character, supports async, blocks next typing | - |
480
+ | `onTypedChar` | `(data: ITypedChar) => void` | Callback after each character | - |
481
+ | `disableTyping` | `boolean` | Disable typing animation | `false` |
482
+ | `autoStartTyping` | `boolean` | Whether to auto start typing animation, set false to trigger manually, not dynamically changeable | `true` |
479
483
 
480
484
  > Note: If `disableTyping` changes from `true` to `false` during typing, all remaining characters will be displayed at once on the next typing trigger.
481
485
 
@@ -498,16 +502,23 @@ import MarkdownTyper, { MarkdownCMD } from 'react-markdown-typer';
498
502
  | `currentStr` | `string` | Full string of current type | - |
499
503
  | `percent` | `number` | Typing progress percent (0-100) | `0` |
500
504
 
501
- #### IMarkdownMath
505
+ #### Custom Markdown Conversion
502
506
 
503
- | Prop | Type | Description | Default |
504
- | ------------- | ------------------------- | --------------------------- | ---------- |
505
- | `splitSymbol` | `'dollar'` \| `'bracket'` | Math formula delimiter type | `'dollar'` |
507
+ The `customConvertMarkdownString` function allows you to preprocess markdown content before it's rendered. This is useful for:
506
508
 
507
- **Delimiter Explanation:**
509
+ - Custom markdown syntax extensions
510
+ - Content filtering or sanitization
511
+ - Integration with external markdown processors
512
+ - Custom link handling or formatting
508
513
 
509
- - `'dollar'`: Use `$...$` and `$$...$$` syntax
510
- - `'bracket'`: Use `\(...\)` and `\[...\]` syntax
514
+ **Example:**
515
+
516
+ ```tsx
517
+ const customConvertMarkdownString = (markdownString) => {
518
+ // Add custom processing logic here
519
+ return markdownString.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>').replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
520
+ };
521
+ ```
511
522
 
512
523
  #### IMarkdownPlugin
513
524
 
@@ -547,90 +558,77 @@ markdownRef.current?.restart(); // Restart animation
547
558
 
548
559
  ---
549
560
 
550
- ## ๐Ÿงฎ Math Formula Guide
551
-
552
- <!-- [DEMO1: Pythagorean Theorem](https://stackblitz.com/edit/vitejs-vite-z94syu8j?file=src%2FApp.tsx) -->
561
+ ## ๐Ÿ”ง Custom Markdown Processing Guide
553
562
 
554
- <!-- [DEMO2: Problem Solution](https://stackblitz.com/edit/vitejs-vite-xk9lxagc?file=README.md) -->
555
-
556
- ### Basic Syntax
563
+ ### Basic Usage
557
564
 
558
565
  ```tsx
559
- import remarkMath from 'remark-math';
560
- import rehypeKatex from 'rehype-katex';
561
-
562
- // 1. Enable math formula support
563
- <MarkdownTyper reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex]}}>
564
- # Math Formula Example
566
+ import MarkdownTyper from 'react-markdown-typer';
565
567
 
566
- // Inline formula
567
- This is an inline formula: $E = mc^2$
568
+ function CustomMarkdownDemo() {
569
+ const customConvertMarkdownString = (markdownString) => {
570
+ // Add your custom processing logic here
571
+ return markdownString
572
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>')
573
+ .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>')
574
+ .replace(/\*([^*]+)\*/g, '<em>$1</em>');
575
+ };
568
576
 
569
- // Block formula
570
- $$\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}$$
571
- </MarkdownTyper>
577
+ return (
578
+ <MarkdownTyper interval={20} customConvertMarkdownString={customConvertMarkdownString}>
579
+ # Custom Markdown Processing This is **bold text** and *italic text*. Check out [our website](https://example.com) for more info!
580
+ </MarkdownTyper>
581
+ );
582
+ }
572
583
  ```
573
584
 
574
- ### Delimiter Selection
585
+ ### Advanced Processing
575
586
 
576
- ```tsx
577
- // Use dollar sign delimiter (default)
578
- <MarkdownTyper
579
- reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex]}}
580
- math={{ splitSymbol: 'dollar' }}
581
- >
582
- Inline: $a + b = c$
583
- Block: $$\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n$$
584
- </MarkdownTyper>
585
-
586
- // Use bracket delimiter
587
- <MarkdownTyper
588
- reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex]}}
589
- math={{ splitSymbol: 'bracket' }}
590
- >
591
- Inline: \(a + b = c\)
592
- Block: \[\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n\]
593
- </MarkdownTyper>
594
- ```
587
+ ````tsx
588
+ // Complex custom processing example
589
+ const customConvertMarkdownString = (markdownString) => {
590
+ return (
591
+ markdownString
592
+ // Custom emoji processing
593
+ .replace(/:([a-zA-Z0-9_]+):/g, '<span class="emoji">:$1:</span>')
594
+ // Custom mention processing
595
+ .replace(/@([a-zA-Z0-9_]+)/g, '<span class="mention">@$1</span>')
596
+ // Custom code block processing
597
+ .replace(/```(\w+)\n([\s\S]*?)```/g, '<pre class="code-block"><code class="language-$1">$2</code></pre>')
598
+ // Custom link processing with security
599
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, (match, text, url) => {
600
+ if (url.startsWith('http')) {
601
+ return `<a href="${url}" target="_blank" rel="noopener noreferrer">${text}</a>`;
602
+ }
603
+ return match;
604
+ })
605
+ );
606
+ };
607
+ ````
595
608
 
596
- ### Streaming Math Formulas
609
+ ### Integration with External Processors
597
610
 
598
611
  ```tsx
599
- // Perfectly supports streaming output of math formulas
600
- const mathContent = [
601
- 'Pythagorean theorem:',
602
- '$a^2 + b^2 = c^2$',
603
- '\n\n',
604
- 'Where:',
605
- '- $a$ and $b$ are the legs\n',
606
- '- $c$ is the hypotenuse\n\n',
607
- 'For the classic "3-4-5 triangle":\n',
608
- '$c = \\sqrt{3^2 + 4^2} = \\sqrt{25} = 5$\n\n',
609
- 'This theorem has wide applications in geometry!',
610
- ];
611
-
612
- mathContent.forEach((chunk) => {
613
- markdownRef.current?.push(chunk, 'answer');
614
- });
612
+ import { marked } from 'marked';
613
+
614
+ const customConvertMarkdownString = (markdownString) => {
615
+ // Use marked.js for processing
616
+ return marked(markdownString, {
617
+ breaks: true,
618
+ gfm: true,
619
+ });
620
+ };
615
621
  ```
616
622
 
617
- ### Style Customization
618
-
619
- ```css
620
- /* Math formula style customization */
621
- .katex {
622
- font-size: 1.1em;
623
- }
623
+ ### Content Filtering
624
624
 
625
- .katex-display {
626
- margin: 1em 0;
627
- text-align: center;
628
- }
625
+ ```tsx
626
+ const customConvertMarkdownString = (markdownString) => {
627
+ // Filter out sensitive content
628
+ const filteredContent = markdownString.replace(/password[:\s]*[^\s]+/gi, 'password: [FILTERED]').replace(/token[:\s]*[^\s]+/gi, 'token: [FILTERED]');
629
629
 
630
- /* Dark theme adaptation */
631
- [data-theme='dark'] .katex {
632
- color: #e1e1e1;
633
- }
630
+ return filteredContent;
631
+ };
634
632
  ```
635
633
 
636
634
  ---
@@ -696,10 +694,10 @@ High frequency: use `requestAnimationFrame`, low frequency: use `setTimeout`
696
694
 
697
695
  ````tsx
698
696
  import { useRef } from 'react';
699
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
697
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
700
698
 
701
699
  function StreamingChat() {
702
- const markdownRef = useRef<MarkdownCMDRef>(null);
700
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
703
701
 
704
702
  // Simulate AI streaming response
705
703
  const simulateAIResponse = async () => {
@@ -752,31 +750,35 @@ function StreamingChat() {
752
750
  const delay = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
753
751
  ````
754
752
 
755
- ### ๐Ÿงฎ Streaming Math Formula Rendering
753
+ ### ๐Ÿ”ง Custom Markdown Processing Demo
756
754
 
757
755
  ```tsx
758
- import remarkMath from 'remark-math';
759
- import rehypeKatex from 'rehype-katex';
760
-
761
- function MathStreamingDemo() {
762
- const markdownRef = useRef<MarkdownCMDRef>(null);
756
+ function CustomMarkdownStreamingDemo() {
757
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
758
+
759
+ const customConvertMarkdownString = (markdownString) => {
760
+ return markdownString
761
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>')
762
+ .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>')
763
+ .replace(/\*([^*]+)\*/g, '<em>$1</em>')
764
+ .replace(/`([^`]+)`/g, '<code>$1</code>');
765
+ };
763
766
 
764
- const simulateMathResponse = async () => {
767
+ const simulateCustomResponse = async () => {
765
768
  markdownRef.current?.clear();
766
769
 
767
- const mathChunks = [
768
- '# Pythagorean Theorem Explained\n\n',
769
- 'In a right triangle, the square of the hypotenuse equals the sum of the squares of the other two sides:\n\n',
770
- '$a^2 + b^2 = c^2$\n\n',
771
- 'Where:\n',
772
- '- $a$ and $b$ are the legs\n',
773
- '- $c$ is the hypotenuse\n\n',
774
- 'For the classic "3-4-5 triangle":\n',
775
- '$c = \\sqrt{3^2 + 4^2} = \\sqrt{25} = 5$\n\n',
776
- 'This theorem has wide applications in geometry!',
770
+ const customChunks = [
771
+ '# Custom Markdown Processing\n\n',
772
+ 'This demo shows how to use **custom markdown processing** with streaming content:\n\n',
773
+ '## Features\n',
774
+ '- *Custom link handling*\n',
775
+ '- **Bold and italic** text processing\n',
776
+ '- `Inline code` formatting\n',
777
+ '- [External links](https://example.com) with security attributes\n\n',
778
+ 'The `customConvertMarkdownString` function allows you to preprocess content before rendering!',
777
779
  ];
778
780
 
779
- for (const chunk of mathChunks) {
781
+ for (const chunk of customChunks) {
780
782
  await delay(150);
781
783
  markdownRef.current?.push(chunk, 'answer');
782
784
  }
@@ -784,15 +786,9 @@ function MathStreamingDemo() {
784
786
 
785
787
  return (
786
788
  <div>
787
- <button onClick={simulateMathResponse}>๐Ÿ“ Explain Pythagorean Theorem</button>
788
-
789
- <MarkdownCMD
790
- ref={markdownRef}
791
- interval={20}
792
- timerType="requestAnimationFrame"
793
- reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex] }}
794
- math={{ splitSymbol: 'dollar' }}
795
- />
789
+ <button onClick={simulateCustomResponse}>๐Ÿ”ง Custom Markdown Demo</button>
790
+
791
+ <MarkdownCMD ref={markdownRef} interval={20} timerType="requestAnimationFrame" customConvertMarkdownString={customConvertMarkdownString} />
796
792
  </div>
797
793
  );
798
794
  }
@@ -802,10 +798,10 @@ function MathStreamingDemo() {
802
798
 
803
799
  ```tsx
804
800
  import { useRef, useState } from 'react';
805
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
801
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
806
802
 
807
803
  function AdvancedCallbackDemo() {
808
- const markdownRef = useRef<MarkdownCMDRef>(null);
804
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
809
805
  const [typingStats, setTypingStats] = useState({ progress: 0, currentChar: '', totalChars: 0 });
810
806
 
811
807
  const handleBeforeTypedChar = async (data) => {
package/README.zh.md CHANGED
@@ -155,18 +155,23 @@ function StaticDemo() {
155
155
  }
156
156
  ```
157
157
 
158
- ### ๆ•ฐๅญฆๅ…ฌๅผๆ”ฏๆŒ
158
+ ### ่‡ชๅฎšไน‰ Markdown ๅค„็†
159
159
 
160
160
  ```tsx
161
161
  import MarkdownTyper from 'react-markdown-typer';
162
- // ๅฆ‚ๆžœ้œ€่ฆๅฑ•็คบๅ…ฌๅผ๏ผŒๅˆ™้œ€่ฆๅผ•ๅ…ฅๅ…ฌๅผ่ฝฌๆขๆ’ไปถ
163
- import remarkMath from 'remark-math';
164
- import rehypeKatex from 'rehype-katex';
165
162
 
166
- function MathDemo() {
163
+ function CustomMarkdownDemo() {
164
+ const customConvertMarkdownString = (markdownString) => {
165
+ // ่‡ชๅฎšไน‰ๅค„็†้€ป่พ‘
166
+ return markdownString
167
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>') // ่ฝฌๆข้“พๆŽฅ
168
+ .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>') // ่ฝฌๆข็ฒ—ไฝ“
169
+ .replace(/\*([^*]+)\*/g, '<em>$1</em>'); // ่ฝฌๆขๆ–œไฝ“
170
+ };
171
+
167
172
  return (
168
- <MarkdownTyper interval={20} reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex] }} math={{ splitSymbol: 'dollar' }}>
169
- # ๅ‹พ่‚กๅฎš็† ๅœจ็›ด่ง’ไธ‰่ง’ๅฝขไธญ๏ผŒๆ–œ่พน็š„ๅนณๆ–น็ญ‰ไบŽไธคๆก็›ด่ง’่พน็š„ๅนณๆ–นๅ’Œ๏ผš $a^2 + b^2 = c^2$ ๅ…ถไธญ๏ผš - $a$ ๅ’Œ $b$ ๆ˜ฏ็›ด่ง’่พน - $c$ ๆ˜ฏๆ–œ่พน ๅฏนไบŽ็ปๅ…ธ็š„"ๅ‹พไธ‰่‚กๅ››ๅผฆไบ”"๏ผš $c = \sqrt{3 ^ (2 + 4) ^ 2} = \sqrt{25} = 5$
173
+ <MarkdownTyper interval={20} customConvertMarkdownString={customConvertMarkdownString}>
174
+ # ่‡ชๅฎšไน‰ Markdown ๅค„็† ่ฟ™ๆ˜ฏ**็ฒ—ไฝ“ๆ–‡ๅญ—**ๅ’Œ*ๆ–œไฝ“ๆ–‡ๅญ—*ใ€‚ๆŸฅ็œ‹[ๆˆ‘ไปฌ็š„็ฝ‘็ซ™](https://example.com)ไบ†่งฃๆ›ดๅคšไฟกๆฏ๏ผ
170
175
  </MarkdownTyper>
171
176
  );
172
177
  }
@@ -205,10 +210,10 @@ React 19 ๅธฆๆฅไบ†่ฎธๅคšๆฟ€ๅŠจไบบๅฟƒ็š„ๆ–ฐ็‰นๆ€ง๏ผš
205
210
 
206
211
  ```tsx
207
212
  import { useRef, useState } from 'react';
208
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
213
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
209
214
 
210
215
  function AdvancedCallbackDemo() {
211
- const markdownRef = useRef<MarkdownCMDRef>(null);
216
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
212
217
  const [typingStats, setTypingStats] = useState({ progress: 0, currentChar: '', totalChars: 0 });
213
218
 
214
219
  const handleBeforeTypedChar = async (data) => {
@@ -281,10 +286,10 @@ function AdvancedCallbackDemo() {
281
286
 
282
287
  ```tsx
283
288
  import { useRef, useState } from 'react';
284
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
289
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
285
290
 
286
291
  function RestartDemo() {
287
- const markdownRef = useRef<MarkdownCMDRef>(null);
292
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
288
293
  const [isPlaying, setIsPlaying] = useState(false);
289
294
  const [hasStarted, setHasStarted] = useState(false);
290
295
 
@@ -366,10 +371,10 @@ function RestartDemo() {
366
371
 
367
372
  ```tsx
368
373
  import { useRef, useState } from 'react';
369
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
374
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
370
375
 
371
376
  function StartDemo() {
372
- const markdownRef = useRef<MarkdownCMDRef>(null);
377
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
373
378
  const [isPlaying, setIsPlaying] = useState(false);
374
379
  const [hasStarted, setHasStarted] = useState(false);
375
380
 
@@ -432,18 +437,18 @@ function StartDemo() {
432
437
  import MarkdownTyper, { MarkdownCMD } from 'react-markdown-typer';
433
438
  ```
434
439
 
435
- | ๅฑžๆ€ง | ็ฑปๅž‹ | ่ฏดๆ˜Ž | ้ป˜่ฎคๅ€ผ |
436
- | ------------------- | ------------------------------------------- | ------------------------------------------------------------- | ----------------------------------------------------------- |
437
- | `interval` | `number` | ๆ‰“ๅญ—้—ด้š” (ๆฏซ็ง’) | `30` |
438
- | `timerType` | `'setTimeout'` \| `'requestAnimationFrame'` | ๅฎšๆ—ถๅ™จ็ฑปๅž‹๏ผŒไธๆ”ฏๆŒๅŠจๆ€ไฟฎๆ”น | ๅฝ“ๅ‰้ป˜่ฎคๅ€ผๆ˜ฏ`setTimeout`๏ผŒๅŽๆœŸไผšๆ”นไธบ`requestAnimationFrame` |
439
- | `theme` | `'light'` \| `'dark'` | ไธป้ข˜็ฑปๅž‹ | `'light'` |
440
- | `math` | [IMarkdownMath](#IMarkdownMath) | ๆ•ฐๅญฆๅ…ฌๅผ้…็ฝฎ | `{ splitSymbol: 'dollar' }` |
441
- | `onEnd` | `(data: EndData) => void` | ๆ‰“ๅญ—็ป“ๆŸๅ›ž่ฐƒ | - |
442
- | `onStart` | `(data: StartData) => void` | ๆ‰“ๅญ—ๅผ€ๅง‹ๅ›ž่ฐƒ | - |
443
- | `onBeforeTypedChar` | `(data: IBeforeTypedChar) => Promise<void>` | ๅญ—็ฌฆๆ‰“ๅญ—ๅ‰็š„ๅ›ž่ฐƒ๏ผŒๆ”ฏๆŒๅผ‚ๆญฅๆ“ไฝœ๏ผŒไผš้˜ปๅกžไน‹ๅŽ็š„ๆ‰“ๅญ— | - |
444
- | `onTypedChar` | `(data: ITypedChar) => void` | ๆฏๅญ—็ฌฆๆ‰“ๅญ—ๅŽ็š„ๅ›ž่ฐƒ | - |
445
- | `disableTyping` | `boolean` | ็ฆ็”จๆ‰“ๅญ—ๅŠจ็”ปๆ•ˆๆžœ | `false` |
446
- | `autoStartTyping` | `boolean` | ๆ˜ฏๅฆ่‡ชๅŠจๅผ€ๅง‹ๆ‰“ๅญ—ๅŠจ็”ป๏ผŒ่ฎพไธบ false ๆ—ถ้œ€ๆ‰‹ๅŠจ่งฆๅ‘๏ผŒไธๆ”ฏๆŒๅŠจๆ€ไฟฎๆ”น | `true` |
440
+ | ๅฑžๆ€ง | ็ฑปๅž‹ | ่ฏดๆ˜Ž | ้ป˜่ฎคๅ€ผ |
441
+ | ----------------------------- | ------------------------------------------- | ------------------------------------------------------------- | ----------------------------------------------------------- |
442
+ | `interval` | `number` | ๆ‰“ๅญ—้—ด้š” (ๆฏซ็ง’) | `30` |
443
+ | `timerType` | `'setTimeout'` \| `'requestAnimationFrame'` | ๅฎšๆ—ถๅ™จ็ฑปๅž‹๏ผŒไธๆ”ฏๆŒๅŠจๆ€ไฟฎๆ”น | ๅฝ“ๅ‰้ป˜่ฎคๅ€ผๆ˜ฏ`setTimeout`๏ผŒๅŽๆœŸไผšๆ”นไธบ`requestAnimationFrame` |
444
+ | `theme` | `'light'` \| `'dark'` | ไธป้ข˜็ฑปๅž‹ | `'light'` |
445
+ | `customConvertMarkdownString` | `(markdownString: string) => string` | ่‡ชๅฎšไน‰ markdown ๅญ—็ฌฆไธฒ่ฝฌๆขๅ‡ฝๆ•ฐ | - |
446
+ | `onEnd` | `(data: EndData) => void` | ๆ‰“ๅญ—็ป“ๆŸๅ›ž่ฐƒ | - |
447
+ | `onStart` | `(data: StartData) => void` | ๆ‰“ๅญ—ๅผ€ๅง‹ๅ›ž่ฐƒ | - |
448
+ | `onBeforeTypedChar` | `(data: IBeforeTypedChar) => Promise<void>` | ๅญ—็ฌฆๆ‰“ๅญ—ๅ‰็š„ๅ›ž่ฐƒ๏ผŒๆ”ฏๆŒๅผ‚ๆญฅๆ“ไฝœ๏ผŒไผš้˜ปๅกžไน‹ๅŽ็š„ๆ‰“ๅญ— | - |
449
+ | `onTypedChar` | `(data: ITypedChar) => void` | ๆฏๅญ—็ฌฆๆ‰“ๅญ—ๅŽ็š„ๅ›ž่ฐƒ | - |
450
+ | `disableTyping` | `boolean` | ็ฆ็”จๆ‰“ๅญ—ๅŠจ็”ปๆ•ˆๆžœ | `false` |
451
+ | `autoStartTyping` | `boolean` | ๆ˜ฏๅฆ่‡ชๅŠจๅผ€ๅง‹ๆ‰“ๅญ—ๅŠจ็”ป๏ผŒ่ฎพไธบ false ๆ—ถ้œ€ๆ‰‹ๅŠจ่งฆๅ‘๏ผŒไธๆ”ฏๆŒๅŠจๆ€ไฟฎๆ”น | `true` |
447
452
 
448
453
  > ๆณจๆ„๏ผš ๅฆ‚ๆžœๅฝ“ๅœจๆ‰“ๅญ—ไธญ `disableTyping`ไปŽ `true` ๅ˜ไธบ `false`๏ผŒๅˆ™ๅœจไธ‹ไธ€ไธชๆ‰“ๅญ—่งฆๅ‘ๆ—ถ๏ผŒไผšๆŠŠๅ‰ฉไธ‹็š„ๆ‰€ๆœ‰ๅญ—ไธ€ๆฌกๆ€งๆ˜พ็คบ
449
454
 
@@ -466,16 +471,23 @@ import MarkdownTyper, { MarkdownCMD } from 'react-markdown-typer';
466
471
  | `currentStr` | `string` | ๅฝ“ๅ‰็ฑปๅž‹ๅ†…ๅฎน็š„ๅฎŒๆ•ดๅญ—็ฌฆไธฒ | - |
467
472
  | `percent` | `number` | ๆ‰“ๅญ—่ฟ›ๅบฆ็™พๅˆ†ๆฏ” (0-100) | `0` |
468
473
 
469
- #### IMarkdownMath
474
+ #### ่‡ชๅฎšไน‰ Markdown ่ฝฌๆข
470
475
 
471
- | ๅฑžๆ€ง | ็ฑปๅž‹ | ่ฏดๆ˜Ž | ้ป˜่ฎคๅ€ผ |
472
- | ------------- | ------------------------- | ------------------ | ---------- |
473
- | `splitSymbol` | `'dollar'` \| `'bracket'` | ๆ•ฐๅญฆๅ…ฌๅผๅˆ†้š”็ฌฆ็ฑปๅž‹ | `'dollar'` |
476
+ `customConvertMarkdownString` ๅ‡ฝๆ•ฐๅ…่ฎธๆ‚จๅœจๆธฒๆŸ“ๅ‰้ข„ๅค„็† markdown ๅ†…ๅฎนใ€‚่ฟ™้€‚็”จไบŽ๏ผš
474
477
 
475
- **ๅˆ†้š”็ฌฆ่ฏดๆ˜Ž๏ผš**
478
+ - ่‡ชๅฎšไน‰ markdown ่ฏญๆณ•ๆ‰ฉๅฑ•
479
+ - ๅ†…ๅฎน่ฟ‡ๆปคๆˆ–ๆธ…็†
480
+ - ไธŽๅค–้ƒจ markdown ๅค„็†ๅ™จ้›†ๆˆ
481
+ - ่‡ชๅฎšไน‰้“พๆŽฅๅค„็†ๆˆ–ๆ ผๅผๅŒ–
476
482
 
477
- - `'dollar'`๏ผšไฝฟ็”จ `$...$` ๅ’Œ `$$...$$` ่ฏญๆณ•
478
- - `'bracket'`๏ผšไฝฟ็”จ `\(...\)` ๅ’Œ `\[...\]` ่ฏญๆณ•
483
+ **็คบไพ‹๏ผš**
484
+
485
+ ```tsx
486
+ const customConvertMarkdownString = (markdownString) => {
487
+ // ๅœจ่ฟ™้‡ŒๆทปๅŠ ่‡ชๅฎšไน‰ๅค„็†้€ป่พ‘
488
+ return markdownString.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>').replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
489
+ };
490
+ ```
479
491
 
480
492
  #### IMarkdownPlugin
481
493
 
@@ -515,90 +527,77 @@ markdownRef.current?.restart(); // ้‡ๆ–ฐๅผ€ๅง‹ๅŠจ็”ป
515
527
 
516
528
  ---
517
529
 
518
- ## ๐Ÿงฎ ๆ•ฐๅญฆๅ…ฌๅผไฝฟ็”จๆŒ‡ๅ—
519
-
520
- <!-- [DEMO1๏ผšๅ‹พ่‚กๅฎš็†](https://stackblitz.com/edit/vitejs-vite-z94syu8j?file=src%2FApp.tsx) -->
521
-
522
- <!-- [DEMO2๏ผš้ข˜็›ฎ่งฃ็ญ”](https://stackblitz.com/edit/vitejs-vite-xk9lxagc?file=README.md) -->
530
+ ## ๐Ÿ”ง ่‡ชๅฎšไน‰ Markdown ๅค„็†ๆŒ‡ๅ—
523
531
 
524
- ### ๅŸบๆœฌ่ฏญๆณ•
532
+ ### ๅŸบๆœฌ็”จๆณ•
525
533
 
526
534
  ```tsx
527
- import remarkMath from 'remark-math';
528
- import rehypeKatex from 'rehype-katex';
529
-
530
- // 1. ๅฏ็”จๆ•ฐๅญฆๅ…ฌๅผๆ”ฏๆŒ
531
- <MarkdownTyper reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex]}}>
532
- # ๆ•ฐๅญฆๅ…ฌๅผ็คบไพ‹
535
+ import MarkdownTyper from 'react-markdown-typer';
533
536
 
534
- // ่กŒๅ†…ๅ…ฌๅผ
535
- ่ฟ™ๆ˜ฏไธ€ไธช่กŒๅ†…ๅ…ฌๅผ๏ผš$E = mc^2$
537
+ function CustomMarkdownDemo() {
538
+ const customConvertMarkdownString = (markdownString) => {
539
+ // ๅœจ่ฟ™้‡ŒๆทปๅŠ ๆ‚จ็š„่‡ชๅฎšไน‰ๅค„็†้€ป่พ‘
540
+ return markdownString
541
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank">$1</a>')
542
+ .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>')
543
+ .replace(/\*([^*]+)\*/g, '<em>$1</em>');
544
+ };
536
545
 
537
- // ๅ—็บงๅ…ฌๅผ
538
- $$\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi}$$
539
- </MarkdownTyper>
546
+ return (
547
+ <MarkdownTyper interval={20} customConvertMarkdownString={customConvertMarkdownString}>
548
+ # ่‡ชๅฎšไน‰ Markdown ๅค„็† ่ฟ™ๆ˜ฏ**็ฒ—ไฝ“ๆ–‡ๅญ—**ๅ’Œ*ๆ–œไฝ“ๆ–‡ๅญ—*ใ€‚ๆŸฅ็œ‹[ๆˆ‘ไปฌ็š„็ฝ‘็ซ™](https://example.com)ไบ†่งฃๆ›ดๅคšไฟกๆฏ๏ผ
549
+ </MarkdownTyper>
550
+ );
551
+ }
540
552
  ```
541
553
 
542
- ### ๅˆ†้š”็ฌฆ้€‰ๆ‹ฉ
554
+ ### ้ซ˜็บงๅค„็†
543
555
 
544
- ```tsx
545
- // ไฝฟ็”จ็พŽๅ…ƒ็ฌฆๅทๅˆ†้š”็ฌฆ๏ผˆ้ป˜่ฎค๏ผ‰
546
- <MarkdownTyper
547
- reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex]}}
548
- math={{ splitSymbol: 'dollar' }}
549
- >
550
- ่กŒๅ†…๏ผš$a + b = c$
551
- ๅ—็บง๏ผš$$\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n$$
552
- </MarkdownTyper>
553
-
554
- // ไฝฟ็”จๆ‹ฌๅทๅˆ†้š”็ฌฆ
555
- <MarkdownTyper
556
- reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex]}}
557
- math={{ splitSymbol: 'bracket' }}
558
- >
559
- ่กŒๅ†…๏ผš\(a + b = c\)
560
- ๅ—็บง๏ผš\[\sum_{i=1}^{n} x_i = x_1 + x_2 + \cdots + x_n\]
561
- </MarkdownTyper>
562
- ```
556
+ ````tsx
557
+ // ๅคๆ‚็š„่‡ชๅฎšไน‰ๅค„็†็คบไพ‹
558
+ const customConvertMarkdownString = (markdownString) => {
559
+ return (
560
+ markdownString
561
+ // ่‡ชๅฎšไน‰่กจๆƒ…็ฌฆๅทๅค„็†
562
+ .replace(/:([a-zA-Z0-9_]+):/g, '<span class="emoji">:$1:</span>')
563
+ // ่‡ชๅฎšไน‰ๆๅŠๅค„็†
564
+ .replace(/@([a-zA-Z0-9_]+)/g, '<span class="mention">@$1</span>')
565
+ // ่‡ชๅฎšไน‰ไปฃ็ ๅ—ๅค„็†
566
+ .replace(/```(\w+)\n([\s\S]*?)```/g, '<pre class="code-block"><code class="language-$1">$2</code></pre>')
567
+ // ่‡ชๅฎšไน‰้“พๆŽฅๅค„็†๏ผˆๅธฆๅฎ‰ๅ…จๆ€ง๏ผ‰
568
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, (match, text, url) => {
569
+ if (url.startsWith('http')) {
570
+ return `<a href="${url}" target="_blank" rel="noopener noreferrer">${text}</a>`;
571
+ }
572
+ return match;
573
+ })
574
+ );
575
+ };
576
+ ````
563
577
 
564
- ### ๆตๅผๆ•ฐๅญฆๅ…ฌๅผ
578
+ ### ไธŽๅค–้ƒจๅค„็†ๅ™จ้›†ๆˆ
565
579
 
566
580
  ```tsx
567
- // ๅฎŒ็พŽๆ”ฏๆŒๆตๅผ่พ“ๅ‡บไธญ็š„ๆ•ฐๅญฆๅ…ฌๅผ
568
- const mathContent = [
569
- 'ๅ‹พ่‚กๅฎš็†๏ผš',
570
- '$a^2 + b^2 = c^2$',
571
- '\n\n',
572
- 'ๅ…ถไธญ๏ผš',
573
- '- $a$ ๅ’Œ $b$ ๆ˜ฏ็›ด่ง’่พน\n',
574
- '- $c$ ๆ˜ฏๆ–œ่พน\n\n',
575
- 'ๅฏนไบŽ็ปๅ…ธ็š„"ๅ‹พไธ‰่‚กๅ››ๅผฆไบ”"๏ผš\n',
576
- '$c = \\sqrt{3^2 + 4^2} = \\sqrt{25} = 5$\n\n',
577
- '่ฟ™ไธชๅฎš็†ๅœจๅ‡ ไฝ•ๅญฆไธญๆœ‰็€ๅนฟๆณ›็š„ๅบ”็”จ๏ผ',
578
- ];
579
-
580
- mathContent.forEach((chunk) => {
581
- markdownRef.current?.push(chunk, 'answer');
582
- });
581
+ import { marked } from 'marked';
582
+
583
+ const customConvertMarkdownString = (markdownString) => {
584
+ // ไฝฟ็”จ marked.js ่ฟ›่กŒๅค„็†
585
+ return marked(markdownString, {
586
+ breaks: true,
587
+ gfm: true,
588
+ });
589
+ };
583
590
  ```
584
591
 
585
- ### ๆ ทๅผๅฎšๅˆถ
586
-
587
- ```css
588
- /* ๆ•ฐๅญฆๅ…ฌๅผๆ ทๅผๅฎšๅˆถ */
589
- .katex {
590
- font-size: 1.1em;
591
- }
592
+ ### ๅ†…ๅฎน่ฟ‡ๆปค
592
593
 
593
- .katex-display {
594
- margin: 1em 0;
595
- text-align: center;
596
- }
594
+ ```tsx
595
+ const customConvertMarkdownString = (markdownString) => {
596
+ // ่ฟ‡ๆปคๆ•ๆ„Ÿๅ†…ๅฎน
597
+ const filteredContent = markdownString.replace(/password[:\s]*[^\s]+/gi, 'password: [ๅทฒ่ฟ‡ๆปค]').replace(/token[:\s]*[^\s]+/gi, 'token: [ๅทฒ่ฟ‡ๆปค]');
597
598
 
598
- /* ๆš—่‰ฒไธป้ข˜้€‚้… */
599
- [data-theme='dark'] .katex {
600
- color: #e1e1e1;
601
- }
599
+ return filteredContent;
600
+ };
602
601
  ```
603
602
 
604
603
  ---
@@ -664,10 +663,10 @@ mathContent.forEach((chunk) => {
664
663
 
665
664
  ````tsx
666
665
  import { useRef } from 'react';
667
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
666
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
668
667
 
669
668
  function StreamingChat() {
670
- const markdownRef = useRef<MarkdownCMDRef>(null);
669
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
671
670
 
672
671
  // ๆจกๆ‹Ÿ AI ๆตๅผๅ“ๅบ”
673
672
  const simulateAIResponse = async () => {
@@ -720,31 +719,35 @@ function StreamingChat() {
720
719
  const delay = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
721
720
  ````
722
721
 
723
- ### ๐Ÿงฎ ๆ•ฐๅญฆๅ…ฌๅผๆตๅผๆธฒๆŸ“
722
+ ### ๐Ÿ”ง ่‡ชๅฎšไน‰ Markdown ๅค„็†ๆผ”็คบ
724
723
 
725
724
  ```tsx
726
- import remarkMath from 'remark-math';
727
- import rehypeKatex from 'rehype-katex';
728
-
729
- function MathStreamingDemo() {
730
- const markdownRef = useRef<MarkdownCMDRef>(null);
725
+ function CustomMarkdownStreamingDemo() {
726
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
727
+
728
+ const customConvertMarkdownString = (markdownString) => {
729
+ return markdownString
730
+ .replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>')
731
+ .replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>')
732
+ .replace(/\*([^*]+)\*/g, '<em>$1</em>')
733
+ .replace(/`([^`]+)`/g, '<code>$1</code>');
734
+ };
731
735
 
732
- const simulateMathResponse = async () => {
736
+ const simulateCustomResponse = async () => {
733
737
  markdownRef.current?.clear();
734
738
 
735
- const mathChunks = [
736
- '# ๅ‹พ่‚กๅฎš็†่ฏฆ่งฃ\n\n',
737
- 'ๅœจ็›ด่ง’ไธ‰่ง’ๅฝขไธญ๏ผŒๆ–œ่พน็š„ๅนณๆ–น็ญ‰ไบŽไธคๆก็›ด่ง’่พน็š„ๅนณๆ–นๅ’Œ๏ผš\n\n',
738
- '$a^2 + b^2 = c^2$\n\n',
739
- 'ๅ…ถไธญ๏ผš\n',
740
- '- $a$ ๅ’Œ $b$ ๆ˜ฏ็›ด่ง’่พน\n',
741
- '- $c$ ๆ˜ฏๆ–œ่พน\n\n',
742
- 'ๅฏนไบŽ็ปๅ…ธ็š„"ๅ‹พไธ‰่‚กๅ››ๅผฆไบ”"๏ผš\n',
743
- '$c = \\sqrt{3^2 + 4^2} = \\sqrt{25} = 5$\n\n',
744
- '่ฟ™ไธชๅฎš็†ๅœจๅ‡ ไฝ•ๅญฆไธญๆœ‰็€ๅนฟๆณ›็š„ๅบ”็”จ๏ผ',
739
+ const customChunks = [
740
+ '# ่‡ชๅฎšไน‰ Markdown ๅค„็†\n\n',
741
+ '่ฟ™ไธชๆผ”็คบๅฑ•็คบไบ†ๅฆ‚ไฝ•ๅœจๆตๅผๅ†…ๅฎนไธญไฝฟ็”จ**่‡ชๅฎšไน‰ markdown ๅค„็†**๏ผš\n\n',
742
+ '## ๅŠŸ่ƒฝ็‰นๆ€ง\n',
743
+ '- *่‡ชๅฎšไน‰้“พๆŽฅๅค„็†*\n',
744
+ '- **็ฒ—ไฝ“ๅ’Œๆ–œไฝ“**ๆ–‡ๅญ—ๅค„็†\n',
745
+ '- `่กŒๅ†…ไปฃ็ `ๆ ผๅผๅŒ–\n',
746
+ '- [ๅค–้ƒจ้“พๆŽฅ](https://example.com) ๅธฆๅฎ‰ๅ…จๅฑžๆ€ง\n\n',
747
+ '`customConvertMarkdownString` ๅ‡ฝๆ•ฐๅ…่ฎธๆ‚จๅœจๆธฒๆŸ“ๅ‰้ข„ๅค„็†ๅ†…ๅฎน๏ผ',
745
748
  ];
746
749
 
747
- for (const chunk of mathChunks) {
750
+ for (const chunk of customChunks) {
748
751
  await delay(150);
749
752
  markdownRef.current?.push(chunk, 'answer');
750
753
  }
@@ -752,15 +755,9 @@ function MathStreamingDemo() {
752
755
 
753
756
  return (
754
757
  <div>
755
- <button onClick={simulateMathResponse}>๐Ÿ“ ่ฎฒ่งฃๅ‹พ่‚กๅฎš็†</button>
756
-
757
- <MarkdownCMD
758
- ref={markdownRef}
759
- interval={20}
760
- timerType="requestAnimationFrame"
761
- reactMarkdownProps={{ remarkPlugins: [remarkMath], rehypePlugins: [rehypeKatex] }}
762
- math={{ splitSymbol: 'dollar' }}
763
- />
758
+ <button onClick={simulateCustomResponse}>๐Ÿ”ง ่‡ชๅฎšไน‰ Markdown ๆผ”็คบ</button>
759
+
760
+ <MarkdownCMD ref={markdownRef} interval={20} timerType="requestAnimationFrame" customConvertMarkdownString={customConvertMarkdownString} />
764
761
  </div>
765
762
  );
766
763
  }
@@ -770,10 +767,10 @@ function MathStreamingDemo() {
770
767
 
771
768
  ```tsx
772
769
  import { useRef, useState } from 'react';
773
- import { MarkdownCMD, MarkdownCMDRef } from 'react-markdown-typer';
770
+ import { MarkdownCMD, MarkdownTyperCMDRef } from 'react-markdown-typer';
774
771
 
775
772
  function AdvancedCallbackDemo() {
776
- const markdownRef = useRef<MarkdownCMDRef>(null);
773
+ const markdownRef = useRef<MarkdownTyperCMDRef>(null);
777
774
  const [typingStats, setTypingStats] = useState({ progress: 0, currentChar: '', totalChars: 0 });
778
775
 
779
776
  const handleBeforeTypedChar = async (data) => {
@@ -1,4 +1,4 @@
1
- import { MarkdownCMDProps, MarkdownCMDRef } from '../defined';
2
- declare const MarkdownCMD: import("react").ForwardRefExoticComponent<MarkdownCMDProps & import("react").RefAttributes<MarkdownCMDRef>>;
3
- export default MarkdownCMD;
1
+ import { MarkdownTyperCMDProps, MarkdownTyperCMDRef } from '../defined';
2
+ declare const MarkdownTyperCMD: import("react").ForwardRefExoticComponent<MarkdownTyperCMDProps & import("react").RefAttributes<MarkdownTyperCMDRef>>;
3
+ export default MarkdownTyperCMD;
4
4
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MarkdownCMD/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAwB,cAAc,EAAE,MAAM,YAAY,CAAC;AAOpF,QAAA,MAAM,WAAW,6GA2KhB,CAAC;AAMF,eAAe,WAAW,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MarkdownCMD/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAwB,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAM9F,QAAA,MAAM,gBAAgB,uHAkLrB,CAAC;AAMF,eAAe,gBAAgB,CAAC"}
@@ -1,10 +1,10 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
2
+ import { forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react';
3
3
  import { __DEV__ } from '../constant.js';
4
4
  import { useTypingTask } from '../hooks/useTypingTask.js';
5
- import HighReactMarkdown from '../components/HighReactMarkdown/index.js';
5
+ import ReactMarkdown from 'react-markdown';
6
6
  import { splitGraphemes } from '../utils/grapheme.js';
7
- const MarkdownCMD = forwardRef(({ interval = 30, onEnd, onStart, onTypedChar, onBeforeTypedChar, timerType = 'setTimeout', math, reactMarkdownProps, disableTyping = false, autoStartTyping = true }, ref) => {
7
+ const MarkdownTyperCMD = forwardRef(({ interval = 30, onEnd, onStart, onTypedChar, onBeforeTypedChar, timerType = 'setTimeout', reactMarkdownProps, disableTyping = false, autoStartTyping = true, customConvertMarkdownString }, ref) => {
8
8
  /** ๆ˜ฏๅฆ่‡ชๅŠจๅผ€ๅฏๆ‰“ๅญ—ๅŠจ็”ป, ๅŽ้ขๅ‘็”Ÿๅ˜ๅŒ–ๅฐ†ไธไผš็”Ÿๆ•ˆ */
9
9
  const autoStartTypingRef = useRef(autoStartTyping);
10
10
  /** ๆ˜ฏๅฆๆ‰“่ฟ‡ๅญ— */
@@ -153,10 +153,13 @@ const MarkdownCMD = forwardRef(({ interval = 30, onEnd, onStart, onTypedChar, on
153
153
  typingTask.restart();
154
154
  },
155
155
  }));
156
- return _jsx(HighReactMarkdown, { reactMarkdownProps: reactMarkdownProps, children: wholeContentRef.current.content });
156
+ const markdownString = useMemo(() => {
157
+ return (customConvertMarkdownString === null || customConvertMarkdownString === void 0 ? void 0 : customConvertMarkdownString(wholeContentRef.current.content)) || wholeContentRef.current.content;
158
+ }, [wholeContentRef.current.content, customConvertMarkdownString]);
159
+ return _jsx(ReactMarkdown, { ...reactMarkdownProps, children: markdownString });
157
160
  });
158
161
  if (__DEV__) {
159
- MarkdownCMD.displayName = 'MarkdownCMD';
162
+ MarkdownTyperCMD.displayName = 'MarkdownTyperCMD';
160
163
  }
161
- export default MarkdownCMD;
164
+ export default MarkdownTyperCMD;
162
165
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/MarkdownCMD/index.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/MarkdownCMD/index.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ import { MarkdownTyperProps } from '../defined';
3
+ declare const _default: React.NamedExoticComponent<MarkdownTyperProps & React.RefAttributes<import("../defined").MarkdownBaseRef>>;
4
+ export default _default;
5
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/MarkdownTyper/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4E,MAAM,OAAO,CAAC;AAEjG,OAAO,EAAuB,kBAAkB,EAAoB,MAAM,YAAY,CAAC;;AAuEvF,wBAAmC"}
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
3
3
  import { __DEV__ } from '../constant.js';
4
4
  import MarkdownCMD from '../MarkdownCMD/index.js';
5
- const MarkdownInner = ({ children: _children = '', markdownRef, ...rest }) => {
5
+ const MarkdownTyperInner = ({ children: _children = '', markdownRef, ...rest }) => {
6
6
  const cmdRef = useRef(null);
7
7
  const prefixRef = useRef('');
8
8
  const content = useMemo(() => {
@@ -52,14 +52,14 @@ const MarkdownInner = ({ children: _children = '', markdownRef, ...rest }) => {
52
52
  }));
53
53
  return _jsx(MarkdownCMD, { ref: cmdRef, ...rest });
54
54
  };
55
- const Markdown = forwardRef((props, ref) => {
55
+ const MarkdownTyper = forwardRef((props, ref) => {
56
56
  const { children = '' } = props;
57
57
  if (__DEV__) {
58
58
  if (typeof children !== 'string') {
59
59
  throw new Error('Markdown component must have a string child');
60
60
  }
61
61
  }
62
- return _jsx(MarkdownInner, { ...props, markdownRef: ref });
62
+ return _jsx(MarkdownTyperInner, { ...props, markdownRef: ref });
63
63
  });
64
- export default memo(Markdown);
64
+ export default memo(MarkdownTyper);
65
65
  //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/MarkdownTyper/index.tsx"],"names":[],"mappings":"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"}
package/es/defined.d.ts CHANGED
@@ -45,7 +45,7 @@ export interface ITypedChar extends IOnTypedCharData {
45
45
  export interface IBeforeTypedChar extends IOnTypedCharData {
46
46
  percent: number;
47
47
  }
48
- export interface MarkdownBaseProps {
48
+ export interface MarkdownTyperBaseProps {
49
49
  reactMarkdownProps?: Options;
50
50
  /** ่ฎกๆ—ถ็ฑปๅž‹๏ผš ๆ”ฏๆŒsetTimeoutๅ’ŒrequestAnimationFrame */
51
51
  timerType?: 'setTimeout' | 'requestAnimationFrame';
@@ -67,13 +67,14 @@ export interface MarkdownBaseProps {
67
67
  onTypedChar?: (data?: ITypedChar) => void;
68
68
  /** ๆ˜ฏๅฆ่‡ชๅŠจๅผ€ๅฏๆ‰“ๅญ—ๅŠจ็”ป */
69
69
  autoStartTyping?: boolean;
70
- math?: IMarkdownMath;
70
+ /** ่‡ชๅฎšไน‰่ฝฌๆขmarkdown string ๅ‡ฝๆ•ฐ */
71
+ customConvertMarkdownString?: (markdownString: string) => string;
71
72
  }
72
- export interface MarkdownProps extends MarkdownBaseProps {
73
+ export interface MarkdownTyperProps extends MarkdownTyperBaseProps {
73
74
  children: string | undefined;
74
75
  }
75
76
  /** MarkdownCMD ็ป„ไปถไธ้œ€่ฆ children */
76
- export interface MarkdownCMDProps extends MarkdownBaseProps {
77
+ export interface MarkdownTyperCMDProps extends MarkdownTyperBaseProps {
77
78
  children?: undefined;
78
79
  }
79
80
  export interface IMarkdownPlugin {
@@ -82,10 +83,6 @@ export interface IMarkdownPlugin {
82
83
  type: 'buildIn' | 'custom';
83
84
  id?: any;
84
85
  }
85
- export interface IMarkdownMath {
86
- /** ๆ˜ฏๆ‹ฌๅท่ฟ˜ๆ˜ฏ$ไฝœไธบๅˆ†้š”็ฌฆ, ้ป˜่ฎคๆ˜ฏ$ */
87
- splitSymbol: 'bracket' | 'dollar';
88
- }
89
86
  export interface IWholeContent {
90
87
  content: string;
91
88
  length: number;
@@ -98,9 +95,9 @@ export interface MarkdownBaseRef {
98
95
  restart: () => void;
99
96
  }
100
97
  /** Markdown ็ป„ไปถ็š„ref ็ฑปๅž‹ */
101
- export type MarkdownRef = MarkdownBaseRef;
98
+ export type MarkdownTyperRef = MarkdownBaseRef;
102
99
  /** MarkdownCMD ็ป„ไปถ็š„ ref ็ฑปๅž‹ */
103
- export interface MarkdownCMDRef extends MarkdownBaseRef {
100
+ export interface MarkdownTyperCMDRef extends MarkdownBaseRef {
104
101
  push: (content: string) => void;
105
102
  clear: () => void;
106
103
  triggerWholeEnd: () => void;
@@ -1 +1 @@
1
- {"version":3,"file":"defined.d.ts","sourceRoot":"","sources":["../src/defined.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"defined.d.ts","sourceRoot":"","sources":["../src/defined.ts"],"names":[],"mappings":"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"}
@@ -1,6 +1,6 @@
1
- import { IChar, ITypedChar, IWholeContent, MarkdownProps, IEndData, IBeforeTypedChar, IntervalType } from '../defined';
1
+ import { IChar, ITypedChar, IWholeContent, MarkdownTyperProps, IEndData, IBeforeTypedChar, IntervalType } from '../defined';
2
2
  interface UseTypingTaskOptions {
3
- timerType: MarkdownProps['timerType'];
3
+ timerType: MarkdownTyperProps['timerType'];
4
4
  interval: IntervalType;
5
5
  charsRef: React.RefObject<IChar[]>;
6
6
  onEnd?: (data?: IEndData) => void;
@@ -1 +1 @@
1
- {"version":3,"file":"useTypingTask.d.ts","sourceRoot":"","sources":["../../src/hooks/useTypingTask.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAEvH,UAAU,oBAAoB;IAC5B,SAAS,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;IACtC,QAAQ,EAAE,YAAY,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,CAAC;IACnC,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAC;IAClC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE;QAAE,YAAY,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1F,iBAAiB,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,gBAAgB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/D,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC1C,kBAAkB,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;IAC1C,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;IAChD,aAAa,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,QAAQ,EAAE,MAAM,OAAO,CAAC;IACxB,qBAAqB;IACrB,oBAAoB,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,aAAa,GAAI,SAAS,oBAAoB,KAAG,oBAsa7D,CAAC"}
1
+ {"version":3,"file":"useTypingTask.d.ts","sourceRoot":"","sources":["../../src/hooks/useTypingTask.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,kBAAkB,EAAE,QAAQ,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE5H,UAAU,oBAAoB;IAC5B,SAAS,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC3C,QAAQ,EAAE,YAAY,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,CAAC;IACnC,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAC;IAClC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE;QAAE,YAAY,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAC1F,iBAAiB,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,gBAAgB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/D,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAC1C,kBAAkB,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;IAC1C,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,aAAa,CAAC,CAAC;IAChD,aAAa,EAAE,OAAO,CAAC;IACvB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,QAAQ,EAAE,MAAM,OAAO,CAAC;IACxB,qBAAqB;IACrB,oBAAoB,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,aAAa,GAAI,SAAS,oBAAoB,KAAG,oBAsa7D,CAAC"}
package/es/index.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import MarkdownCMD from './MarkdownCMD';
2
- import Markdown from './Markdown';
3
- import type { MarkdownCMDRef, MarkdownRef, IMarkdownMath, ITypedChar, MarkdownProps, MarkdownCMDProps } from './defined';
4
- export default Markdown;
5
- export type { MarkdownCMDRef, MarkdownRef, IMarkdownMath, ITypedChar, MarkdownProps, MarkdownCMDProps };
6
- export { Markdown, MarkdownCMD };
2
+ import MarkdownTyper from './MarkdownTyper';
3
+ import type { MarkdownTyperCMDRef, MarkdownTyperRef, ITypedChar, MarkdownTyperProps, MarkdownTyperCMDProps } from './defined';
4
+ export default MarkdownTyper;
5
+ export type { MarkdownTyperCMDRef, MarkdownTyperRef, ITypedChar, MarkdownTyperProps, MarkdownTyperCMDProps };
6
+ export { MarkdownTyper, MarkdownCMD };
7
7
  //# sourceMappingURL=index.d.ts.map
package/es/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,KAAK,EAAE,cAAc,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAEzH,eAAe,QAAQ,CAAC;AACxB,YAAY,EAAE,cAAc,EAAE,WAAW,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,gBAAgB,EAAE,CAAC;AACxG,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAC5C,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC;AAE9H,eAAe,aAAa,CAAC;AAC7B,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,UAAU,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,CAAC;AAC7G,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC"}
package/es/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import MarkdownCMD from './MarkdownCMD/index.js';
2
- import Markdown from './Markdown/index.js';
3
- export default Markdown;
4
- export { Markdown, MarkdownCMD };
2
+ import MarkdownTyper from './MarkdownTyper/index.js';
3
+ export default MarkdownTyper;
4
+ export { MarkdownTyper, MarkdownCMD };
5
5
  //# sourceMappingURL=index.js.map
package/es/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,QAAQ,MAAM,YAAY,CAAC;AAGlC,eAAe,QAAQ,CAAC;AAExB,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,OAAO,aAAa,MAAM,iBAAiB,CAAC;AAG5C,eAAe,aAAa,CAAC;AAE7B,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "react-markdown-typer",
3
3
  "private": false,
4
- "version": "1.0.0-beta.2",
4
+ "version": "1.0.0-beta.4",
5
5
  "main": "./es/index.js",
6
6
  "types": "./es/index.d.ts",
7
7
  "type": "module",
@@ -1,5 +0,0 @@
1
- import React from 'react';
2
- import { MarkdownProps } from '../defined';
3
- declare const _default: React.NamedExoticComponent<MarkdownProps & React.RefAttributes<import("../defined").MarkdownBaseRef>>;
4
- export default _default;
5
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Markdown/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4E,MAAM,OAAO,CAAC;AAEjG,OAAO,EAAkB,aAAa,EAAe,MAAM,YAAY,CAAC;;AAuExE,wBAA8B"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Markdown/index.tsx"],"names":[],"mappings":"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"}
@@ -1,9 +0,0 @@
1
- import React from 'react';
2
- import { Options } from 'react-markdown';
3
- interface HighReactMarkdownProps {
4
- reactMarkdownProps?: Options;
5
- children: string;
6
- }
7
- declare const HighReactMarkdown: React.FC<HighReactMarkdownProps>;
8
- export default HighReactMarkdown;
9
- //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/HighReactMarkdown/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAsB,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAExD,UAAU,sBAAsB;IAC9B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAEvD,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
@@ -1,7 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import ReactMarkdown from 'react-markdown';
3
- const HighReactMarkdown = ({ reactMarkdownProps, children }) => {
4
- return _jsx(ReactMarkdown, { ...reactMarkdownProps, children: children });
5
- };
6
- export default HighReactMarkdown;
7
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/HighReactMarkdown/index.tsx"],"names":[],"mappings":";AACA,OAAO,aAA0B,MAAM,gBAAgB,CAAC;AAOxD,MAAM,iBAAiB,GAAqC,CAAC,EAAE,kBAAkB,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC/F,OAAO,KAAC,aAAa,OAAK,kBAAkB,YAAG,QAAQ,GAAiB,CAAC;AAC3E,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}