Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


    React Native AutoLink

    NPM Version Build Status Dependency Status Dev Dependency Status

    Auto-Linking component for React Native. Parses text and wraps URLs, phone numbers, emails, social handles, and hashtags with Text nodes and onPress handlers using the Autolinker.js.


    npm install react-native-autolink --save


    Simply import the library and pass desired props:

    import Autolink from 'react-native-autolink';
    class MyComponent extends Component {
      render() {
        return (
            text="This is the string to parse for urls (, phone numbers (415-555-5555), emails (, mentions/handles (@twitter), and hashtags (#exciting)"
            mention="twitter" />


    Prop Type Default Description
    text String Required. The string to parse for links.
    email Boolean true Enable email linking (mailto:{email}).
    hashtag Boolean/String false Enable hashtag linking to supplied service. Possible values: false, "instagram", "twitter".
    latlng Boolean false Experimental Enable latitude, longitude linking to maps.
    mention Boolean/String false Enable mention/handle linking to supplied service. Possible values: false, "instagram", "twitter".
    phone Boolean/String true Enable phone linking (tel:{number}, sms:{number}) for calling/texting. Possible values: false, "text"
    twitter Boolean false DEPRECATED. Use mention prop. Enable Twitter handle linking (twitter://user?screen_name={handle}).
    url Boolean/Object true Enable url linking (https://{url}). Possible values: true, false, { schemeMatches: true/false, wwwMatches: true/false, tldMatches: true/false }
    stripPrefix Boolean true Enable stripping of protocol from link text (https://url -> url).
    linkStyle TextStyle Custom styling to apply to Text nodes of links.
    onPress function Custom function handler for link press events. Arguments: url:String, match:Object.
    onLongPress function Function handler for long press events. Arguments: url:String, match:Object
    renderLink function Custom render function for rendering link nodes. Arguments: text:String, match:Object, index:Number.
    showAlert Boolean false Displays an alert before leaving the app to help with accidental clicks. Possible values: true, false
    truncate Number 32 Truncate long link text for display (e.g. Possible values: 0 to disable, 1+ to truncate to that maximum length.
    truncateChars String .. Characters to replace truncated url segments with, if enabled.
    webFallback Boolean Android: true iOS: false Link to web versions of Instagram/Twitter for hashtag and mention links when users don't have the respective app installed. Requires LSApplicationQueriesSchemes on iOS. See:

    Any other props will be passed through to the main Text node (e.g. style, numberOfLines).

    Live Example

    You can try autolinker.js options in Live Example


    npm i react-native-autolink

    Downloadslast 7 days







    last publish


    • avatar