react-native-nitro-text

A Text component that is much richer and performant for both iOS and Android.

NitroText.mp4

---

Features

• Works on both iOS and Android(currently fallback to RN Text on Android)
• Native iOS rendering with smooth selection.
• Nested fragments merge into a single native text view
• Rendering Markdown and HTML (coming soon).
• Supports only the New Architecture

Requirements

• React Native v0.78.0 or higher (Fabric/Nitro Views)
• Node 18+ (Node 20+ recommended)

Installation

yarn add react-native-nitro-text react-native-nitro-modules

iOS

cd ios && pod install && cd ..

That’s it. You can now use the NitroText component in your app.

Usage

import { NitroText as Text } from 'react-native-nitro-text'

export function Title() {
  return (
    <Text style={{ fontSize: 24, fontWeight: 'bold' }}>
      🚀 NitroText Showcase
    </Text>
  )
}

Selection

iOS uses native selection. On Android, NitroText currently falls back to React Native Text.

import { NitroText as Text } from 'react-native-nitro-text'

export function SelectionExample() {
  return (
    <Text selectable style={{ fontSize: 16, lineHeight: 22 }}>
      Long-press to select this text. NitroText supports smooth selection,
      even with <Text style={{ fontWeight: '600' }}>inline styles</Text> and
      longer paragraphs.
    </Text>
  )
}

Platform Support

• iOS
• Android - At the moment NitroText fallback to RN Text.

Why NitroText?

Custom native text view with minimal JS overhead and native iOS selection. Great for heavy/nested styled text and large lists. It's a drop-in replacement for RN Text component.

Development

• bun run build — typecheck and build the package
• bun run codegen — regenerate codegen outputs
• Example app in example/

Credits

Bootstrapped with create-nitro-module.

Contributing

PRs welcome! Please open an issue first for major changes.