All packages
The Portable Text ecosystem: official packages from the portabletext organization and community-maintained libraries. Packages marked with Community are maintained outside the official organization.
Render Portable Text
Section titled “Render Portable Text”Serializers convert Portable Text JSON into your target output.
JavaScript
Section titled “JavaScript”| Package | Target | Install |
|---|---|---|
@portabletext/react | React | npm i @portabletext/react |
@portabletext/to-html | HTML string | npm i @portabletext/to-html |
@portabletext/vue | Vue | npm i @portabletext/vue |
@portabletext/svelte | Svelte 5+ | npm i @portabletext/svelte |
@portabletext/solid | SolidJS | npm i @portabletext/solid |
@portabletext/react-native | React Native | npm i @portabletext/react-native |
@portabletext/react-pdf | React PDF | npm i @portabletext/react-pdf |
astro-portabletext Community | Astro | npm i astro-portabletext |
portabletext-qwik Community | Qwik | npm i portabletext-qwik |
@limitless-angular/sanity Community | Angular | npm i @limitless-angular/sanity |
Other languages
Section titled “Other languages”| Package | Language |
|---|---|
dotnet-portable-text | C# / .NET |
portable-text-dotnet Community | C# / .NET |
sanity-linq Community | C# / .NET |
portabletext-html Community | Python |
sanity-php | PHP |
flutter_sanity_portable_text Community | Dart / Flutter |
flutter_portabletext Community | Dart / Flutter |
ruby_portable_text Community | Ruby |
portabletext Community | Go |
Platform integrations
Section titled “Platform integrations”| Integration | Platform |
|---|---|
transform.PortableText | Hugo (built-in) |
portable-text-to-liquid | Shopify / Liquid |
Build an editor
Section titled “Build an editor”| Package | Purpose | Install |
|---|---|---|
@portabletext/editor | Headless, schema-driven block content editor for React | npm i @portabletext/editor |
@portabletext/toolbar | Headless toolbar hooks for the editor | npm i @portabletext/toolbar |
@portabletext/schema | Define and compile Portable Text schemas with full type safety | npm i @portabletext/schema |
@portabletext/keyboard-shortcuts | Platform-aware keyboard shortcuts | npm i @portabletext/keyboard-shortcuts |
Editor plugins
Section titled “Editor plugins”| Plugin | What it does | Install |
|---|---|---|
@portabletext/plugin-typography | Smart quotes, em dashes, ellipses | npm i @portabletext/plugin-typography |
@portabletext/plugin-markdown-shortcuts | Markdown-style shortcuts in the editor | npm i @portabletext/plugin-markdown-shortcuts |
@portabletext/plugin-paste-link | Paste URLs as links | npm i @portabletext/plugin-paste-link |
@portabletext/plugin-emoji-picker | Emoji picker | npm i @portabletext/plugin-emoji-picker |
@portabletext/plugin-character-pair-decorator | Match character pairs and decorate text between them | npm i @portabletext/plugin-character-pair-decorator |
@portabletext/plugin-input-rule | Configure input rules | npm i @portabletext/plugin-input-rule |
@portabletext/plugin-one-line | Restrict editor to a single line | npm i @portabletext/plugin-one-line |
@portabletext/plugin-typeahead-picker | Typeahead/autocomplete picker infrastructure | npm i @portabletext/plugin-typeahead-picker |
@portabletext/plugin-sdk-value | Syncs editor value with the Sanity SDK | npm i @portabletext/plugin-sdk-value |
Convert content
Section titled “Convert content”| Package | Direction | Install |
|---|---|---|
@portabletext/html | HTML → Portable Text | npm i @portabletext/html |
@portabletext/block-tools | HTML → Portable Text (Sanity wrapper) | npm i @portabletext/block-tools |
@portabletext/markdown | Portable Text ↔ Markdown | npm i @portabletext/markdown |
@portabletext/contentful-rich-text-to-portable-text | Contentful → Portable Text | npm i @portabletext/contentful-rich-text-to-portable-text |
@emdash-cms/gutenberg-to-portable-text Community | WordPress / Gutenberg → Portable Text | npm i @emdash-cms/gutenberg-to-portable-text |
editorjs-to-portabletext Community | Editor.js → Portable Text | npm i editorjs-to-portabletext |
@aceccarello/portable-text-to-lexical Community | Portable Text → Payload Lexical JSON | npm i @aceccarello/portable-text-to-lexical |
Work with Portable Text data
Section titled “Work with Portable Text data”| Package | Purpose | Install |
|---|---|---|
@portabletext/toolkit | toPlainText(), buildMarksTree(), nestLists(), type guards | npm i @portabletext/toolkit |
@portabletext/types | TypeScript type definitions for Portable Text data | npm i @portabletext/types |
@portabletext/patches | Apply patches to Portable Text values | npm i @portabletext/patches |
@portabletext-typed/types Community | Typed generics for @portabletext/types | npm i @portabletext-typed/types |
Testing
Section titled “Testing”| Package | Purpose | Install |
|---|---|---|
@portabletext/test | Testing utilities for the Portable Text Editor | npm i @portabletext/test |
racejar | Framework-agnostic Gherkin test driver | npm i racejar |
Legacy packages
Section titled “Legacy packages”These packages are deprecated. Use the current equivalents listed above.
| Deprecated package | Replaced by |
|---|---|
@sanity/block-content-to-react | @portabletext/react |
@sanity/block-content-to-html | @portabletext/to-html |
@sanity/block-content-to-hyperscript | @portabletext/to-html |
@sanity/block-content-to-markdown | @portabletext/markdown |
@sanity/block-tools | @portabletext/block-tools |
@sanity/portable-text-editor | @portabletext/editor |
For more packages, see the Portable Text organization on GitHub.