Support custom rules

[olslash]

This gives the ability to add custom linkify-it handlers to individual react-linkify instances through the handlers prop. Additionally, i exposed the linkify-it singleton to enable global customization.

I also cherry-picked the test-suite updates from #19.

Fixes #10

[olslash]

One issue i'm noticing is that i can't easily merge custom global handlers with instance handlers, because linkify-it doesn't expose them. I could read its internal schemas map (https://github.com/markdown-it/linkify-it/blob/master/index.js#L396) but it's a private property.

[tasti]

@olslash What about instead of having a global instance of LinkifyIt, we expose a way to set global handlers, and when each custom LinkifyIt instance is being defined, it appends the global handlers?

[olslash]

That's a good idea.

My only concern is that as we try to support the rest of the LinkifyIt customizations (custom TLDs and the fuzzy* options), we end up duplicating more and more of that library's logic. For example, it would be nice to keep the same chained API that they use to avoid having two sets of docs, but then react-linkify has to mirror their code. It's simple code, but not entirely trivial.

That's why I had the thought of using their private __schemas__ (and __tlds__), but that brings its own problems.

Anyway for now I'll write the custom handler code from the direction you suggested, and we can see how it looks.

edit: i think i can get around duplicating anything, now that I think about it.

[olslash]

I took a stab at it -- let me know what you think and I'll write docs if it's ok

[tasti]

handlers defaults to [], so handlers.forEach(...); should be sufficient.

[tasti]

Looks good for the most part and great job mirroring the linkify-it api.

A concern that I thought of now is that this would make the Linkify component coupled with the linkify-it library. I'm wondering if this is the best way to go especially for cases where some other library has other benefits.

One idea to decouple the two is to have the Linkify component take a getMatches (type: function) prop, which would allow you to freely use any matching implementation you like. For example, if I'd like to use the linkify-it library, I would instantiate and set handlers on my own, and simply pass in this.linkify.match to the Linkify component. As a consequence, this would require you to put the pieces together yourself. What are your thoughts?

[olslash]

That definitely leads to a more generic component -- I just wonder if it's at the cost of ease-of-use, and if supporting multiple matching libraries is really an important goal, considering how much linkify-it can be customized.

With the prop approach, I have to manage a linkify-it instance in each place I want to use the component. Also, even if I wanted to use a custom matching library, linkify-it would still be a dependency of the react-linkify so I'm not saving much there.

Possibly a good middle ground is to combine the getMatches prop + the possibility of using a custom global matcher. For my project, I would use a linkify-it instance as my global matcher with my global handlers set. For someone else, it might be some other library.

[tasti]

As an effort to make this more generic, you'll have the flexibility to support this in v1.0.0. For example:

const matchDecorator = (text) => {
  // Implement your matching logic here to using your customized instance of LinkifyIt
};

<Linkify matchDecorator={matchDecorator}>
  ...
</Linkify>

matchDecorator lets you override the default linkify-it logic to match URLs however you'd like.

Any feedback is appreciated.