JSFiddle - React, Tailwind, and code Playground

by dsuryd

JavaScript

const regex = /<if\s(.*)>((.|\n)*?)<\/if>/g;
const str = `
The element to render markdown text. It can be used with a view model, or be given the text directly.

[inset]

<if react>sdfsd,
</if>

<if react>

\`\`\`jsx
import React from 'react';
import { Markdown, VMContext } from 'dotnetify-elements';

const MyApp = _ => (
   <VMContext vm="MarkdownExample">
      <Markdown id="Content" css="padding: 1rem; background: #fff"\${props} />
   </VMContext>
);
\`\`\`

</if>

<if webComponent>

\`\`\`jsx
<d-vm-context vm="MarkdownExample">
   <d-markdown id="Content" css="padding: 1rem; background: #fff"\${props} />
</d-vm-context>
\`\`\`

</if>

Hello`;
let m;

while ((m = regex.exec(str)) !== null) {
    // This is necessary to avoid infinite loops with zero-width matches
    if (m.index === regex.lastIndex) {
        regex.lastIndex++;
    }
    
    // The result can be accessed through the `m`-variable.
    m.forEach((match, groupIndex) => {
        console.log(`Found match, group ${groupIndex}: ${match}`);
    });
}