Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Capture groups? #58

Open
sportshead opened this issue Apr 7, 2020 · 4 comments
Open

Capture groups? #58

sportshead opened this issue Apr 7, 2020 · 4 comments

Comments

@sportshead
Copy link

Can you add support for multiple regex capture groups?

@iansinnott
Copy link
Owner

Do you have an example regex?

This library depends on the functionality of String.prototype.split which will place matched characters in odd-numbered elements of a split array:

'hey you there'.split(/( )/); // => [ 'hey', ' ', 'you', ' ', 'there' ]

@hejrobin
Copy link

hejrobin commented Dec 1, 2020

Can you add support for multiple regex capture groups?

With a bit of a workaround you could the the matcher do the logic. The caveat being that the matcher regex, cannot be the same as the "parser" regex, reason being that str.split splits on capture group.

const md = `
[Test](https://google.com)
`;

// Pay attention to where the matcher and parser group diffs
reactStringReplace(md, /(\[.*?\]\(.*?\))/gi, (match, index) => {
  match.match(/\[(.*?)\]\((.*?)\)/gi);

  return <a href={RegExp.$2}>{RegExp.$1}</a>
});

@oneillsp96
Copy link

oneillsp96 commented Jan 8, 2021

Speaking of, is there any legitimate way to render html containing markdown? I'm using react-string-replace to highlight some text in a string, but now I've been asked to also render any markdown contained in the string. The way I reeive the data means that the highlight-replacement must operate on the string, so I have to do that part first. If the original string contained markup, I'm left with something like the following (in array form, of course)

This is <span className="yellow">highlighted</span> text but it has some ## markup as well

If it was a raw string, I could just use react-markdown or similar lib, but obviously that's not an option after the first transform.

Any ideas? Even if it means combining with a different package? Btw thanks so much, this library is awesome

@federicocappellotto97
Copy link

Do you have an example regex?

This library depends on the functionality of String.prototype.split which will place matched characters in odd-numbered elements of a split array:

'hey you there'.split(/( )/); // => [ 'hey', ' ', 'you', ' ', 'there' ]

Here the example:

"<h1>Lorem <strong>Ipsum</strong> <strong>Dolor</strong></h1>".replace( /(^|<\/?[^>]+>|\s+)([^\s<]+)/g, '$1<span>$2</span>' )

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants