React Native Link Preview

Fully customizable preview of the URL extracted from the provided text.

Getting Started

yarn add @flyerhq/react-native-link-preview

Usage

import { LinkPreview } from '@flyerhq/react-native-link-preview'
// ...
return (
  <LinkPreview text='This link https://github.com/flyerhq can be extracted from the text' />
)

Props

Required

| Name | Type | Description | | ---- | ------ | ----------------------------- | | text | string | Text to extract the link from |

Optional

| Name | Type | Description | | ----------------------------- | ------------------------------------------------------------------------------------------ | ------------------------------------------------------------ | | containerStyle | ViewStyle | Top level container style | | enableAnimation | boolean | Enables LayoutAnimation | | header | string | Text above the link | | metadataContainerStyle | ViewStyle | Title, description and minimized image container style | | metadataTextContainerStyle | ViewStyle | Title and description container style | | onPreviewDataFetched | (PreviewData) => void | Callback to get the fetched preview data | | previewData | PreviewData | Data to render instead of parsing the provided text | | renderDescription | (string) => ReactNode | Custom description render prop | | renderHeader | (string) => ReactNode | Custom header render prop | | renderImage | (PreviewDataImage) => ReactNode | Custom image render prop | | renderLinkPreview | ({ aspectRatio?: number, containerWidth: number, previewData?: PreviewData }) => ReactNode | Custom render prop | | renderMinimizedImage | (PreviewDataImage) => ReactNode | Custom minimised image render prop | | renderText | (string) => ReactNode | Custom provided text render prop | | renderTitle | (string) => ReactNode | Custom title render prop | | requestTimeout | number | Timeout after which request to get preview data should abort | | textContainerStyle | ViewStyle | Text, title, description and minimized image container style | | touchableWithoutFeedbackProps | TouchableWithoutFeedbackProps | Top level touchable props |

License

MIT