Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 9 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ It processes raw, incomplete markdown (as it streams token-by-token from an LLM)

- Renders incomplete streaming markdown correctly — no visual glitches mid-stream
- Background thread processing via `react-native-worklets` Bundle Mode
- Inline LaTeX support (`$...$`) with streaming completion — applied automatically, no configuration needed
- CommonMark rendering (headers, bold, italic, inline code, fenced code blocks, links, images) powered by `react-native-enriched-markdown` with built-in `streamingAnimation`
- LaTeX support with streaming completion — applied automatically, no configuration needed
- CommonMark and GitHub Flavored Markdown rendering powered by `react-native-enriched-markdown` with built-in `streamingAnimation`
- Customizable via `remendConfig`

---
Expand All @@ -30,10 +30,13 @@ yarn add react-native-enriched-markdown react-native-worklets remend

| Package | Version |
| -------------------------------- | ------- |
| `react-native-enriched-markdown` | `0.4.0` |
| `react-native-enriched-markdown` | `>=0.4.0` |
| `react-native-worklets` | `0.8.3` |
| `remend` | `1.3.0` |

> [!NOTE]
> GFM table streaming requires `react-native-enriched-markdown >=0.6.0`.

---

## Required setup — Bundle Mode
Expand Down Expand Up @@ -171,12 +174,14 @@ import { StreamdownText } from 'react-native-streamdown';

### Props

`StreamdownText` accepts all props from `EnrichedMarkdownText` (except `flavor`, which is hardcoded to `commonmark`) plus one additional prop:
`StreamdownText` accepts all props from `EnrichedMarkdownText` plus one additional prop:

| Prop | Type | Description |
| -------------- | --------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
| `remendConfig` | `RemendOptions` | Optional. Override the default remend processing config. See [remend docs](https://www.npmjs.com/package/remend) for all available options. |

Pass `flavor="github"` to render GitHub Flavored Markdown. GFM table streaming requires `react-native-enriched-markdown >=0.6.0`.

---

## Example app
Expand All @@ -190,12 +195,6 @@ It is a practical reference for the full Bundle Mode setup (Babel, Metro, `packa

---

## Limitations

- **CommonMark only** — `StreamdownText` currently renders using the `commonmark` flavour of `react-native-enriched-markdown`. GitHub Flavored Markdown (GFM) support is planned for a future release.

---

Built by [Software Mansion](https://swmansion.com/).

[<img width="128" height="69" alt="Software Mansion Logo" src="https://github.com/user-attachments/assets/f0e18471-a7aa-4e80-86ac-87686a86fe56" />](https://swmansion.com/)
Expand Down
4 changes: 2 additions & 2 deletions example/ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1857,7 +1857,7 @@ PODS:
- React-utils (= 0.85.3)
- ReactNativeDependencies
- ReactNativeDependencies (0.85.3)
- ReactNativeEnrichedMarkdown (0.4.0):
- ReactNativeEnrichedMarkdown (0.6.0):
- hermes-engine
- iosMath (~> 0.9)
- RCTRequired
Expand Down Expand Up @@ -2270,7 +2270,7 @@ SPEC CHECKSUMS:
ReactCodegen: c8f81e6c6f762dcf442a6203a1fb58f7dafc8014
ReactCommon: 7dfc3250793bf36cf221096ff59e1179e13eef7f
ReactNativeDependencies: 9ce75df098e6192b99f48ac8b78f365f02e52fdc
ReactNativeEnrichedMarkdown: d96de50b3f1207d157fe7e43bf7cdb61db014fb0
ReactNativeEnrichedMarkdown: 861d6937d7f4a6481e8446538dc715c93b545143
RNWorklets: 4931990f73bc8f347586918b2e13f11dfadf3b75
Yoga: 77dfa8673de2874e1855002ae59c68b8be9b007b

Expand Down
2 changes: 1 addition & 1 deletion example/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
"dependencies": {
"react": "19.2.3",
"react-native": "0.85.3",
"react-native-enriched-markdown": "0.4.0",
"react-native-enriched-markdown": "0.6.0",
"react-native-safe-area-context": "^5.7.0",
"react-native-streamdown": "*",
"react-native-worklets": "0.8.3",
Expand Down
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@
"react": "19.2.3",
"react-native": "^0.85.3",
"react-native-builder-bob": "^0.40.18",
"react-native-enriched-markdown": "0.4.0",
"react-native-enriched-markdown": "0.6.0",
"react-native-sse": "1.2.1",
"react-native-worklets": "0.8.3",
"release-it": "^19.0.4",
Expand All @@ -91,7 +91,7 @@
"peerDependencies": {
"react": "*",
"react-native": "*",
"react-native-enriched-markdown": "0.4.0",
"react-native-enriched-markdown": ">=0.4.0",
"react-native-worklets": ">=0.8.3",
"remend": "1.3.0"
},
Expand Down
1 change: 0 additions & 1 deletion src/StreamdownText.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ export function StreamdownText({

return (
<EnrichedMarkdownText
flavor="commonmark"
markdown={processedMarkdown}
streamingAnimation
selectable={!isStreaming && selectable}
Expand Down
3 changes: 1 addition & 2 deletions src/types.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import type { EnrichedMarkdownTextProps } from 'react-native-enriched-markdown';
import type { RemendOptions } from 'remend';

export interface StreamdownTextProps
extends Omit<EnrichedMarkdownTextProps, 'flavor'> {
export interface StreamdownTextProps extends EnrichedMarkdownTextProps {
/**
* Optional custom remend configuration.
*/
Expand Down
21 changes: 14 additions & 7 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -10217,13 +10217,20 @@ __metadata:
languageName: node
linkType: hard

"react-native-enriched-markdown@npm:0.4.0":
version: 0.4.0
resolution: "react-native-enriched-markdown@npm:0.4.0"
"react-native-enriched-markdown@npm:0.6.0":
version: 0.6.0
resolution: "react-native-enriched-markdown@npm:0.6.0"
peerDependencies:
"@expo/config-plugins": ">=50.0.0"
katex: ">=0.16.0"
react: "*"
react-native: "*"
checksum: 10c0/4e4fb31146bbcac32e693d3a7408af1f61456c5b6dd4fed6df841f4b8148ca223610f4e7221f8f2c73f7d3a91af7398f3e8ad37c157862f680d52d7c22d614c2
peerDependenciesMeta:
"@expo/config-plugins":
optional: true
katex:
optional: true
checksum: 10c0/9d71d6c44bd317b3d575ac4a4d1501ee55f280da090a7660813b3d86d23f67fcce4e2f016fd9cc2ef0c567f47807d4a065af60dfd3278c05e5f81423480f521c
languageName: node
linkType: hard

Expand Down Expand Up @@ -10271,7 +10278,7 @@ __metadata:
react: "npm:19.2.3"
react-native: "npm:0.85.3"
react-native-builder-bob: "npm:^0.40.18"
react-native-enriched-markdown: "npm:0.4.0"
react-native-enriched-markdown: "npm:0.6.0"
react-native-monorepo-config: "npm:^0.3.3"
react-native-safe-area-context: "npm:^5.7.0"
react-native-streamdown: "npm:*"
Expand Down Expand Up @@ -10305,7 +10312,7 @@ __metadata:
react: "npm:19.2.3"
react-native: "npm:^0.85.3"
react-native-builder-bob: "npm:^0.40.18"
react-native-enriched-markdown: "npm:0.4.0"
react-native-enriched-markdown: "npm:0.6.0"
react-native-sse: "npm:1.2.1"
react-native-worklets: "npm:0.8.3"
release-it: "npm:^19.0.4"
Expand All @@ -10315,7 +10322,7 @@ __metadata:
peerDependencies:
react: "*"
react-native: "*"
react-native-enriched-markdown: 0.4.0
react-native-enriched-markdown: ">=0.4.0"
react-native-worklets: ">=0.8.3"
remend: 1.3.0
languageName: unknown
Expand Down
Loading