0.1.3 • Published 5 years ago

url-formatter

Licence

—

Version

0.1.3

Deps

Size

9 kB

Vulns

Weekly

Url-Formatter

This is a simple ReactJs (with npx create-react-app) component to format the urls of a text
It uses a simple javascript code snippet to split the text
Then, a regural expression is used during render to filter the text parts, and with some HTML and CSS simple tricks, the urls are displayed as clickable hrefs
Most importantly, the initial text format (spaces, new lines, etc) remains the same

In a React app:

    import { UrlFormatter } from 'url-formatter';

    <UrlFormatter text={text} />

you can define the container styling giving the prop style which should be an object and follow the general rules of decalring styling in react (css)
example:

    <UrlFormatter text={text} style={{'border': '1px solid red'}}/>

you can define the urls styling giving the prop url which should be an object (again following the general styling syntax)
example:

    <UrlFormatter text={text} url={{'color': 'red'}}/>

you can define the simple words styling giving the prop word which should be an object (again following the general styling syntax)
example:

    <UrlFormatter text={text} word={{'color': 'red'}}/>

you can define the length of the space character giving the prop space as string
the default value is 4px
example:

    <UrlFormatter text={text} space={'4px'}/>