TextLink

When you need to insert a link inside a text in React Native, you might notice that the links have a different positioning, they are usually around 5 pixels under the line. This happens because the link is actually inside a View (wrapped in a Pressable/TouchableOpacity), so the positioning of the elements is different between a Text and a View.

This package aims to easily solve this while still looking clean. Using this package you will be able to provide a different Style while the link is being pressed.

Usage

First install:

npm i react-native-text-link
Then import:

import TextLink from 'react-native-text-link';
Then use:
``js
{
text: 'Terms & Conditions',
onPress: () => console.log('link to terms'),
},
{
text: 'Privacy Policy',
onPress: () => console.log('link to privacy'),
},
]}>
Please read our Terms & Conditions and our Privacy Policy.

``

Features

|props|type|use|
|--|--| --|
| textStyle | StyleProp |default style for text
| textLinkStyle| StyleProp | style for the links
| pressingLinkStyle|StyleProp |style for the links while they are being pressed
| links | [{ text: string, onPress: () => void }] | strings that will act as links and the action they will trigger
|children| string |the whole text in which the links will be found

License and Constributions

MIT License and thanks to react-native-parsed-text