Strings decorator (by regex) with: React components, HTML tags etc.
npm install regexify-string!npm bundle size !GitHub release (latest by date) !npm-donwloads-per-year
---
$ npm install --save regexify-string
`
or
`
$ yarn add regexify-string
`
API
$3
#### pattern
Type: RegExp
#### decorator
Type: (match: string, index: number, result?: RegExpExecArray) => string | JSX.Element
- match string you would like to replace/decorate with something
- index index number of the current match
- result? RegExpExecArray
NOTE: Try do not forget to use keys for React collections if needed
#### input
Type: string
Usage
#### with strings
`js
const result = regexifyString({
pattern: /\[.*?\]/gim,
decorator: (match, index) => {
return <${match}>;
},
input: 'some [text] with simple example',
});
console.log(result);
// ['some ', '<[text]>', ' with simple example']
`
#### with index keys
`js
const result = regexifyString({
pattern: /\[.*?\]/gim,
decorator: (match, index) => {
switch (index) {
case 0: return ;
case 1: return ;
case 2: return ;
default: return match;
}
},
input: 'Important text with [first link] and [second link] and much more [links]',
});
console.log(result);
/*
[
'Important text with ',
'',
' and ',
'',
' and much more ',
'',
]
*/
`
#### with html
`js
const result = regexifyString({
pattern: /\[.*?\]/gim,
decorator: (match, index) => {
return {match};
},
input: 'some [text] with simple example',
});
console.log(result);
// ['some ', [text], ' with simple example']
`
#### with React / React Native components
`js
regexifyString({
pattern: /\[.*?\]/gim,
decorator: (match, index) => {
return (
to={SOME_ROUTE}
onClick={onClick}
>
{match}
);
},
input: someVariablWithData,
});
`
`js
regexifyString({
pattern: /\[.*?\]/gim,
decorator: (match, index) => {
return {match} ;
},
input: 'some [text] with simple example',
});
`
#### with groups
`js
const result = regexifyString({
pattern: /\[(?.+)\]\{(?.+)\}/g,
decorator: (match, index, result) => {
return (
id={String(result?.[2])}
title={result?.[1]}
/>
);
},
input: 'a[b]{c}',
});
console.log(result);
// ['a', ]
``