regex101: PCRE (Legacy) Match Workspace

Regular Expression

<!-- @\[(?<component>[\w+]+)\(*(?<classes>[\w+]+)*\)*\] -->

Test String
New

<!-- @[Hero] -->

# Creating new contexts

<!-- @[UsageExample] -->

## Usage example

```javascript
  Import { ICON_NAME } from 'Icons'
```

<!-- @[/Hero] -->

<!-- @[ArticleSection] -->


## Section Title

### Section subtitle that contains additional information

Cillum ipsum ad veniam elit non. Sunt ea ut quis qui dolore id voluptate magna. Ex non commodo reprehenderit ipsum irure. Ad excepteur nulla ullamco et deserunt magna et sint reprehenderit sint esse commodo. Tempor duis anim nisi commodo incididunt ut ex et sunt laborum excepteur ea culpa laborum.

<!-- @[NoteBlock(warning)] -->

> #### Be Careful
> Eu laboris eiusmod ut exercitation minim laboris ipsum magna consectetur est [commodo](/nope).

<!-- @[/NoteBlock] -->

Officia esse Lorem ad duis dolore nostrud ex elit aliqua incididunt sint ad ex. Eiusmod do in ad aute nulla eiusmod tempor Lorem non. Qui sunt voluptate laborum mollit elit adipisicing minim dolore voluptate veniam incididunt proident ullamco. Ipsum est cupidatat occaecat pariatur ut aute.

<!-- @[CodeExample] -->

#### Code example

```javascript
  class ScrollingList extends React.Component {
      constructor(props) {
        super(props);
        this.listRef = React.createRef();
      }

      render() {
        return (
          &#60;div ref={this.listRef}&#62;{/* ...contents... */}&#60;/div&#62;
        );
      }
    }
```

<!-- @[PropsTable] -->

#### Props

Prop Name | Value | Required
--------- | ----- | --------
**label** | `{String}` | true
**state** | `default` `secondary` `info` `warning` `danger` | false
**size**  | `xs` `s` `m` `l` `xl` | false
**disabled** | `-` | false

<!-- @[/ArticleSection] -->

Regular Expression

Test StringNew

Test String
New