https://github.com/maherzaidoune/react-native-url-preview

react native text parser and link previewer npm package, it makes a preview from an url, grabbing all the information such as title, relevant texts and images.
https://github.com/maherzaidoune/react-native-url-preview

android ios link-preview parser previewer react-native url-parser youtube

Last synced: 3 days ago
JSON representation

react native text parser and link previewer npm package, it makes a preview from an url, grabbing all the information such as title, relevant texts and images.

• Host: GitHub
• URL: https://github.com/maherzaidoune/react-native-url-preview
• Owner: maherzaidoune
• License: mit
• Created: 2019-01-12T14:20:32.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2022-02-10T10:06:21.000Z (almost 3 years ago)
• Last Synced: 2024-10-31T17:35:51.800Z (14 days ago)
• Topics: android, ios, link-preview, parser, previewer, react-native, url-parser, youtube
• Language: JavaScript
• Homepage:
• Size: 371 KB
• Stars: 93
• Watchers: 4
• Forks: 47
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        

# react-native-url-preview 🐜

[![NPM](https://nodei.co/npm/react-native-url-preview.png)](https://www.npmjs.com/package/react-native-url-preview)

Parses text and wraps URLs , transform the url to a beautiful link preview

## Getting started 🐜

`$ npm install react-native-url-preview --save`

## Usage 🐜

```javascript

import RNUrlPreview from 'react-native-url-preview';

```

## Examples🐜

Please refer to the [react-native-url-preview example](https://github.com/maherzaidoune/RNUrlPreviewExample) provided to see how `react-native-url-preview` can be used .

## Demo🐜



        

        



## Customization 🐜

| Parameter                | Required? | Default                    | Type      | Description                                            |

| :----------------------- | :-------: | :------------------------- | :-------- | :----------------------------------------------------- |

| text                     |    YES    | Null                       | `string`  | The text that is parsed and where the URL is retrieved |

| title                    |    NO     | True                       | `Boolean` | determine whether the URL title is displyed or not     |

| description              |    NO     | True                       | `Boolean` | determine whether the URL description is displyed or not     |

| titleStyle               |    NO     | defaultStyle               | `style`   | self explanatory i believe                             |

| containerStyle           |    NO     | defaultStyle               | `style`   | you can pass a custom container style                  |

| imageStyle               |    NO     | defaultStyle               | `style`   | you can pass a custom image style                      |

| faviconStyle             |    NO     | defaultStyle               | `style`   | you can pass a custom favicon style                    |

| textContainerStyle       |    NO     | defaultStyle               | `style`   | you can pass a custom style for the text container     |

| descriptionStyle         |    NO     | defaultStyle               | `style`   | self explanatory i believe                             |

| titleNumberOfLines       |    NO     | 2                          | `number`  | self explanatory i believe                             |

| descriptionNumberOfLines |    NO     | Ipad?4:3                   | `number`  | self explanatory i believe                             |

| imageProps               |    NO     | `{ resizeMode: "contain"}` | `object`  | you can pass a custom props to image                   |

| requestOptions           |    NO     | `{}`                       | `object`  | pass additional options to url preview request

| onLoad                   |    NO     | `() => {}`                 | `function`| callback called when url preview data is loaded          |

| onError                  |    NO     | `() => {}`                 | `function`| callback called if url preview fails to load           |

## Credits 🐜

- Thanks to [marouan frih](https://github.com/Madm0x) for the REGEX

- extract information from a URL with [link-preview-js](https://github.com/ospfranco/link-preview-js)