react-string-replace
react-string-replace copied to clipboard
Add ReactStringReplace Component
Here is an example how it could works
import * as React from "react";
import { ReactStringReplace, ReactStringReplaceRules } from "react-string-replace";
function App() {
const rules: ReactStringReplaceRules = [
{
search: /(https?:\/\/\S+)/g,
onMatch(match, index) {
return (
<a key={match + index} href={match}>
{match}
</a>
);
},
},
{
search: /@(\w+)/g,
onMatch(match, index) {
return (
<a key={match + index} href={`https://twitter.com/${match}`}>
@{match}
</a>
);
},
},
{
search: /#(\w+)/g,
onMatch(match, index) {
return (
<a key={match + index} href={`https://twitter.com/hashtag/${match}`}>
#{match}
</a>
);
},
},
];
return (
<div>
<ReactStringReplace rules={rules}>
Hey @ian_sinn, check out this link https://github.com/iansinnott/ Hope
to see you at #reactconf
</ReactStringReplace>
</div>
);
}
export default App;
hey thanks for this @DerGoogler. Changing the default export is bound to cause breakage, but could release this as v2.
If you add some testing for the new component to test.js I'd be happy to incorporate this. Also that will make sure the existing tests still run, since they use the default export.
(not to self, should add an action to run the tests for PRs)
@iansinnott,
I know this is a bad idea, this would break many libraries and app when update their dependencies..
Is there any chance to get v2 with this change?