我的问题-从MDX/JSX字符串获取组件和属性

我有一个MDX字符串，其中包含YAML格式的Front-matter meta data、一些常规文本、一些markdown和一些React组件。
我需要从中获取所有React（非HTML）组件及其参数的列表。
举个例子：

---
title: Title of documents
tags: one, two, three
---

# My heading H1

Some text in paragraph. Than the list:
 - First item
 - Second item

More text with [a link](https://example.com).

<Articles category="theatre" count={3} />

Further text with more information.

<Newsletter categories={['theatre', 'design']} />

<MultilineComponent 
  paramA="A"
  paramB="B"
/>

<ComponentWithChildren param="value">
  Some children
</ComponentWithChildren>

...我需要以下输出：

[
  {
    component: 'Articles',
    props: {
      category: 'theatre',
      count: 3,
    },
  },
  {
    component: 'Newsletter',
    props: {
      categories: ['theatre', 'design'],
    }
  },
  {
    component: 'MultilineComponent',
    props: {
      paramA: 'A',
      paramB: 'B',
    }
  },
  {
    component: 'ComponentWithChildren',
    props: {
      param: 'value',
    }

  }
]

我还需要在服务器上执行此操作，因此无法访问浏览器功能（窗口、文档等）。

我所尝试的

一些基本的正则表达式，但由于我远不是专业的正则表达式，now I have two problems。：）
是否有一些内置的方法来解析JSX字符串，以获得组件和 prop 的列表，就像我上面描述的那样？或者是否有一些其他的解析器可以用来解决这个问题？如果没有，是否有一些Regex模式可以用来获得这个问题？

快速总结“为什么”

在构建Next.js项目的过程中，我需要确定包中每个MDX页面实际需要哪些数据。因此，如果我在Mdx文件中看到以下内容：

...other text

<Articles category="theatre" count={3} />

...other text

......我可以解析成这样：

component: "Articles"
category: "theatre"
count: 3

这些信息足以让我知道我需要将这些数据发送到页面：

[
  {
    title: 'Romeo and Juliet',
    category: 'theatre',
  },
  {
    title: 'The Cherry Orchard',
    category: 'theatre',
  },
  {
    title: 'Death of a Salesman',
    category: 'theatre',
  }
]

你能帮我一下吗？先谢谢你！💪