More Premium Hugo Themes Premium React Themes

React Native Autolink

Automatic linking of URLs, phone numbers, emails, handles, and even custom patterns in text for React Native

React Native Autolink

Automatic linking of URLs, phone numbers, emails, handles, and even custom patterns in text for React Native

Author Avatar Theme by joshswan
Github Stars Github Stars: 665
Last Commit Last Commit: Oct 7, 2023 -
First Commit Created: Feb 24, 2024 -
React Native Autolink screenshot

Overview

The React Native AutoLink is a versatile auto-linking component for React Native that parses text and wraps URLs, phone numbers, emails, social handles, hashtags, and more with Text nodes and onPress handlers. The latest version, v4, introduced the ability to autolink any pattern using custom regex matchers and click handlers.

Features

  • Automatic Linking: Parses and wraps various types of content like URLs, phone numbers, emails, social media handles, and hashtags.
  • Custom Regex Matchers: Ability to define custom regex matchers to auto-link specific patterns in the text.
  • OnPress Handlers: Provides onPress handlers for interacting with the auto-linked content.
  • Customizable Styling: Allows customization of link styling using linkProps and linkStyle.
  • Multiple Link Types: Supports various link types including emails, hashtags, mentions, phone numbers, and URLs.

Installation

To install the React Native AutoLink component, simply import the library and enable the desired link types in your project. Here’s a basic guide to get started:

  1. Install the package using npm or yarn:

    npm install react-native-autolink
    
  2. Import and utilize the component in your React Native code:

    import AutoLink from 'react-native-autolink';
    
    // In your component render method
    <AutoLink text="Check out my website: https://example.com" />
    

Summary

React Native AutoLink is a valuable tool for handling content parsing and auto-linking in React Native applications. With features like customizable link types, regex matchers, and onPress handlers, it offers flexibility and ease of use in dealing with different types of content. Whether it’s URLs, phone numbers, emails, or hashtags, AutoLink simplifies the process of identifying and interacting with various content elements within text.