Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →caizongyuan/tentap-editor
This skill should be used when users need to implement or work with the TenTap rich text editor for React Native. It provides comprehensive guidance on installation, basic setup, advanced customization, API reference, and real-world examples for building rich text editing experiences in mobile applications.
Passed 24 of 24 test cases with the skill, and 12 of 24 without it.
and 16 more in the full report
12 fixed12 passed either way0 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 12 test cases the skill fixed. Same model, same prompt, with and without the skill.
In full-screen editor mode on React Native, typing near the bottom of the screen causes the cursor to hide behind the keyboard on iOS and Android. Which configuration option in useEditorBridge automatically keeps the cursor visible?
| Checked | Without skill | With skill |
|---|---|---|
| Prevents cursor hiding under mobile keyboard by setting avoidIosKeyboard to true in useEditorBridge | Missed | Passed |
The instructions your model reads when the skill loads.
A typed, customizable, and extendable rich text editor for React Native built on Tiptap and Prosemirror. TenTap provides a bridge architecture that enables seamless communication between React Native and a web-based editor, offering powerful editing capabilities with native mobile performance.
TenTap Editor delivers comprehensive rich text editing capabilities through a WebView-based architecture that bridges React Native and Tiptap. It provides essential features including text formatting (bold, italic, underline, strikethrough), lists (bullet, ordered, task), headings, blockquotes, code blocks, images, links, colors, and highlights. The editor supports custom themes, dark mode, dynamic CSS injection, custom fonts, and full extensibility through custom bridge extensions.
Use TenTap when building mobile applications requiring rich text editing, including chat interfaces, email composers, content management systems, note-taking apps, social media platforms, document editors, or any application where users need to format text beyond plain input. It offers both simple plug-and-play usage for standard features and advanced customization for specialized requirements.
React Native:
yarn add @10play/tentap-editor react-native-webview
cd ios && pod install
Expo:
npx expo install @10play/tentap-editor react-native-webview
Note: Expo Go supports only basic usage. For advanced features, use Expo Dev Client.
The simplest implementation requires three components: useEditorBridge hook, RichText component, and Toolbar component.
import { KeyboardAvoidingView, StyleSheet } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { RichText, Toolbar, useEditorBridge } from '@10play/tentap-editor';
export const BasicEditor = () => {
const editor = useEditorBridge({
test cases passed, vs 12 / 24 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.