diff --git a/code/lib/codemod/src/transforms/__tests__/mdx-to-csf.test.ts b/code/lib/codemod/src/transforms/__tests__/mdx-to-csf.test.ts
index dc3325cd8951..2cd487bb892c 100644
--- a/code/lib/codemod/src/transforms/__tests__/mdx-to-csf.test.ts
+++ b/code/lib/codemod/src/transforms/__tests__/mdx-to-csf.test.ts
@@ -149,7 +149,6 @@ test('convert correct story nodes', () => {
export const Primary = {
render: () => 'Story',
- name: 'Primary',
};
`);
@@ -208,7 +207,6 @@ test('convert story nodes with spaces', () => {
export const PrimarySpace = {
render: () => 'Story',
- name: 'Primary Space',
};
`);
@@ -281,7 +279,6 @@ test('extract esm into csf head code', () => {
export const Unchecked = {
render: Template.bind({}),
- name: 'Unchecked',
args: {
...args,
@@ -376,7 +373,6 @@ test('extract all story attributes', () => {
export const Unchecked = {
render: Template.bind({}),
- name: 'Unchecked',
args: {
...args,
@@ -386,7 +382,6 @@ test('extract all story attributes', () => {
export const Second = {
render: Template.bind({}),
- name: 'Second',
};
`);
@@ -437,12 +432,10 @@ test('duplicate story name', () => {
export const Default_ = {
render: Default.bind({}),
- name: 'Default',
};
export const Second = {
render: Default.bind({}),
- name: 'Second',
};
`);
@@ -480,7 +473,6 @@ test('story name equals component name', () => {
export const Button_ = {
render: () => ,
- name: 'Button',
};
`);
@@ -570,8 +562,6 @@ test('story child is jsx', () => {
Hello!
),
-
- name: 'Primary',
};
`);
@@ -594,7 +584,6 @@ test('story child is CSF3', () => {
export default {};
export const Primary = {
- name: 'Primary',
render: (args) => ,
args: {
@@ -625,7 +614,6 @@ test('story child is arrow function', () => {
export const Primary = {
render: (args) => ,
- name: 'Primary',
};
`);
@@ -651,7 +639,6 @@ test('story child is identifier', () => {
export const Primary = {
render: Button,
- name: 'Primary',
};
`);
diff --git a/code/lib/codemod/src/transforms/mdx-to-csf.ts b/code/lib/codemod/src/transforms/mdx-to-csf.ts
index 2d309181857b..f05874dfb69a 100644
--- a/code/lib/codemod/src/transforms/mdx-to-csf.ts
+++ b/code/lib/codemod/src/transforms/mdx-to-csf.ts
@@ -21,6 +21,7 @@ import * as path from 'node:path';
import prettier from 'prettier';
import * as fs from 'node:fs';
import camelCase from 'lodash/camelCase';
+import startCase from 'lodash/startCase';
import type { MdxFlowExpression } from 'mdast-util-mdx-expression';
const mdxProcessor = remark().use(remarkMdx) as ReturnType;
@@ -58,6 +59,7 @@ export function transform(source: string, baseName: string): [mdx: string, csf:
string,
| {
type: 'value';
+ name: string;
attributes: Array;
children: (MdxJsxFlowElement | MdxJsxTextElement)['children'];
}
@@ -111,6 +113,7 @@ export function transform(source: string, baseName: string): [mdx: string, csf:
storiesMap.set(name, {
type: 'value',
+ name,
attributes: node.attributes,
children: node.children,
});
@@ -273,6 +276,9 @@ export function transform(source: string, baseName: string): [mdx: string, csf:
...value.attributes.flatMap((attribute) => {
if (attribute.type === 'mdxJsxAttribute') {
if (typeof attribute.value === 'string') {
+ if (attribute.name === 'name' && attribute.value === startCase(value.name)) {
+ return [];
+ }
return [
t.objectProperty(t.identifier(attribute.name), t.stringLiteral(attribute.value)),
];