fix: transform of prop to string componnet name

core/instrument/src/babel/transform-ast-tree.ts

@@ -0,0 +1,29 @@
+import babel from '@babel/core';
+
+export const transformTree = () => {
+  return {
+    JSXAttribute: (path: any) => {
+      const node = path.node;
+      switch (node.name?.name) {
+        case 'mdxType': {
+          path.remove();
+          break;
+        }
+        case 'of': {
+          if (node.value?.type === 'JSXExpressionContainer') {
+            const component = node.value;
+            const name = component.expression.name;
+            path.replaceWith({
+              ...node,
+              value: babel.types.stringLiteral(name),
+            });
+          }
+          break;
+        }
+      }
+    },
+    ExportDefaultDeclaration: (path: any) => {
+      path.replaceWith(path.node.declaration);
+    },
+  };
+};

core/instrument/src/index.ts

@@ -14,7 +14,7 @@ import {
 
 import { extractCSFStories } from './babel/esm-stories';
 import { extractMDXStories } from './babel/mdx-stories';
-import { removeMDXAttributes } from './babel/remove-mdx-attributes';
+import { transformTree } from './babel/transform-ast-tree';
 import { extractStoreComponent } from './babel/extract-component';
 import { packageInfo } from './misc/package-info';
 import { extractStoryExports } from './misc/mdx-exports';
@@ -162,7 +162,7 @@ export const parseStories = async (
       ...otherMDXOptions,
     });
     const ast = parser.parse(mdxParsed, mergedOptions.parser) as any;
-    traverse(ast, removeMDXAttributes());
+    traverse(ast, transformTree());
     ({ code } = generate(ast, {
       retainFunctionParens: true,
       retainLines: true,

examples/docz-migration/docs/props.mdx

@@ -4,9 +4,10 @@ menu: Components
 ---
 
 import { Props } from '@component-controls/blocks';
-import { Button } from '../src/components/Button'
+import { Button } from '../src/components/Button';
+import { Button as PropTypesButton } from '../src/components/PropTypesButton';
 
-## Button
+## Props / PropsTable
 
 ```js:title=props.mdx
 ---
@@ -22,4 +23,10 @@ import { Button } from '../src/components/Button'
 <Props of={Button} />
 ```
 
+## Typescript
+
 <Props of={Button} />
+
+## React PropTypes
+
+<Props of={PropTypesButton} />