Trouble formatting bold/italic/underline text with capture group regex

I'm having trouble using `reactStringReplace` to format text with bold/italic tags. I have it set up as follows:

```javascript
var text1 = "[b]Testing bold [i]and italic[/i] tags[/b]"
var text2 = "[b]Testing bold [i]and italic tags[/b][/i]"

let replaced = reactStringReplace(text1, /\[b\]([\s\S]+)\[\/b\]/g, (match, i) => {
return {match}
})
replaced = reactStringReplace(replaced, /\[i\]([\s\S]+)\[\/i\]/g, (match, i) => {
return {match}
})

// result (html)
Testing [i]bold and italic[/i] tags
Testing [i]bold and italic tags[/i]
```

I'm not sure if this is a problem with `reactStringReplace`, with the regex I'm using, or something else. If I apply the italic replace first, I get italic tags where I'd expect them to be, but the [b] tags remain unchanged. Is this use case possible using `reactStringReplace` or do I need to use `dangerouslySetInnerHtml`?

Bonus: is `reactStringReplace` capable of handling unbalanced tags, or improperly formatted tags as in `text2` or should I be doing some pre-processing to ensure the strings are properly balanced and formatted?

Start with the two supplied strings and replacement calls, then read the reactStringReplace API and implementation to determine how successive replacements handle nested React output. Reproduce both cases and document or test the expected behavior for balanced and unbalanced tags; the issue is done when supported behavior and limitations are covered.

Escrita pelo modelo de indexação a partir do texto da issue.