mdx-editor / editor

A rich text editor React component for markdown
https://mdxeditor.dev
MIT License
1.75k stars 139 forks source link

Add support for expression properties into JSX plugin #373

Closed StanlieK closed 6 months ago

StanlieK commented 6 months ago

This pull-request will introduce support for expression properties in JSX components. It will add support for handling fragments (<></>) as well.

Description:

There are two types of properties - "textual" and "expressions" in JSX. You can define type in JsxComponentDescriptor. jsxPlugin will treat the value based on this setting. For example, this code:

const jsxComponentDescriptors: JsxComponentDescriptor[] = [
  {
    name: 'MyLeaf',
    kind: 'text',
    props: [
      { name: 'foo', type: 'string' } // Textual property type
    ],
    hasChildren: true,
    Editor: GenericJsxEditor
  }
]

will produce component like the following:

<MyLeaf foo="bar">Some text...</MyLeaf>

While this descriptor:

const jsxComponentDescriptors: JsxComponentDescriptor[] = [
  {
    name: 'MyLeaf',
    kind: 'text',
    props: [
      { name: 'foo', type: 'expression' } // Expression property type
    ],
    hasChildren: true,
    Editor: GenericJsxEditor
  }
]

will produce:

<MyLeaf foo={bar}>Some text...</MyLeaf>
github-actions[bot] commented 6 months ago

:tada: This PR is included in version 2.12.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket: