JarCasting
JarCasting JarCasting

react-linkify

WebJar for react-linkify

License

License

MIT
Categories

Categories

React User Interface Web Frameworks
GroupId

GroupId

org.webjars.npm
ArtifactId

ArtifactId

react-linkify
Last Version

Last Version

1.0.0-alpha
Release Date

Release Date
Type

Type

jar
Description

Description

react-linkify
WebJar for react-linkify
Project URL

Project URL

https://www.webjars.org
Source Code Management

Source Code Management

https://github.com/tasti/react-linkify

Download react-linkify

Filename Size
react-linkify-1.0.0-alpha.pom
react-linkify-1.0.0-alpha.jar 10 KB
react-linkify-1.0.0-alpha-sources.jar 22 bytes
react-linkify-1.0.0-alpha-javadoc.jar 22 bytes
Browse

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.npm/react-linkify/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>react-linkify</artifactId>
    <version>1.0.0-alpha</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.npm/react-linkify/
implementation 'org.webjars.npm:react-linkify:1.0.0-alpha'
// https://jarcasting.com/artifacts/org.webjars.npm/react-linkify/
implementation ("org.webjars.npm:react-linkify:1.0.0-alpha")
'org.webjars.npm:react-linkify:jar:1.0.0-alpha'
<dependency org="org.webjars.npm" name="react-linkify" rev="1.0.0-alpha">
  <artifact name="react-linkify" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.npm', module='react-linkify', version='1.0.0-alpha')
)
libraryDependencies += "org.webjars.npm" % "react-linkify" % "1.0.0-alpha"
[org.webjars.npm/react-linkify "1.0.0-alpha"]

Dependencies

compile (2)

Group / Artifact Type Version
org.webjars.npm : linkify-it jar [2.0.3,3)
org.webjars.npm : tlds jar [1.199.0,2)

Project Modules

There are no modules declared in this project.

react-linkify

React component to parse links (urls, emails, etc.) in text into clickable links

Examples

Live examples are available at http://tasti.github.io/react-linkify/.

Basic

Any link that appears inside the Linkify component will become clickable.

<Linkify>See examples at tasti.github.io/react-linkify/.</Linkify>

Renders to:

See examples at tasti.github.io/react-linkify/.

Advanced

If you're feeling lazy, you can wrap Linkify around anywhere that you want links to become clickable. Even with nested elements, it traverses the tree to find links.

<Linkify>
  <div>react-linkify <span>(tasti.github.io/react-linkify/)</span></div>
    <div>React component to parse links (urls, emails, etc.) in text into clickable links</div>
  See examples at tasti.github.io/react-linkify/.
    <footer>Contact: [email protected]</footer>
</Linkify>

Renders to:

react-linkify (tasti.github.io/react-linkify/) React component to parse links (urls, emails, etc.) in text into clickable links See examples at tasti.github.io/react-linkify/. Contact: [email protected]

Installation

yarn add react-linkify

or

npm install react-linkify --save

Usage

import Linkify from 'react-linkify';

React.render(
  <Linkify>Examples are available at tasti.github.io/react-linkify/.</Linkify>,
  document.body
);

Props

component The type of component to wrap links in. type: any default: 'a'

properties The props that will be added to every matched component. type: object default: {}

NOTE: Use Linkify.MATCH as a value to specify the matched link. The properties prop will always contain {href: Linkify.MATCH, key: 'LINKIFY_KEY_#'} unless overridden.

Customization

You can access to the global Linkify instance used to linkify contents by importing it (import { linkify } from 'react-linkify'). That way you can customize as needed (e.g. disabling existing schemas or adding new ones).

Note that any customization made to that instance will affect every Linkify component you use.

Examples

All kind of links detectable by linkify-it are supported. For examples, visit their website.

Versions

Version
1.0.0-alpha