diff --git a/code/lib/csf-tools/src/CsfFile.ts b/code/lib/csf-tools/src/CsfFile.ts
index 075aa83588b5..53da26d6680f 100644
--- a/code/lib/csf-tools/src/CsfFile.ts
+++ b/code/lib/csf-tools/src/CsfFile.ts
@@ -169,6 +169,10 @@ export class CsfFile {
 
   _storyExports: Record<string, t.VariableDeclarator | t.FunctionDeclaration> = {};
 
+  _metaStatement: t.Statement | undefined;
+
+  _metaNode: t.Expression | undefined;
+
   _storyStatements: Record<string, t.ExportNamedDeclaration> = {};
 
   _storyAnnotations: Record<string, Record<string, t.Node>> = {};
@@ -259,10 +263,27 @@ export class CsfFile {
       ExportDefaultDeclaration: {
         enter({ node, parent }) {
           let metaNode: t.ObjectExpression;
-          const decl =
-            t.isIdentifier(node.declaration) && t.isProgram(parent)
-              ? findVarInitialization(node.declaration.name, parent)
-              : node.declaration;
+          const isVariableReference = t.isIdentifier(node.declaration) && t.isProgram(parent);
+          let decl;
+          if (isVariableReference) {
+            // const meta = { ... };
+            // export default meta;
+            const variableName = (node.declaration as t.Identifier).name;
+            const isVariableDeclarator = (declaration: t.VariableDeclarator) =>
+              t.isIdentifier(declaration.id) && declaration.id.name === variableName;
+
+            self._metaStatement = self._ast.program.body.find(
+              (topLevelNode) =>
+                t.isVariableDeclaration(topLevelNode) &&
+                topLevelNode.declarations.find(isVariableDeclarator)
+            );
+            decl = (self._metaStatement as t.VariableDeclaration).declarations.find(
+              isVariableDeclarator
+            ).init;
+          } else {
+            self._metaStatement = node;
+            decl = node.declaration;
+          }
 
           if (t.isObjectExpression(decl)) {
             // export default { ... };
@@ -276,6 +297,7 @@ export class CsfFile {
           }
 
           if (!self._meta && metaNode && t.isProgram(parent)) {
+            self._metaNode = metaNode;
             self._parseMeta(metaNode, parent);
           }
         },
diff --git a/code/lib/csf-tools/src/enrichCsf.test.ts b/code/lib/csf-tools/src/enrichCsf.test.ts
index a0bb3af2db25..f9db130ed6a2 100644
--- a/code/lib/csf-tools/src/enrichCsf.test.ts
+++ b/code/lib/csf-tools/src/enrichCsf.test.ts
@@ -132,7 +132,7 @@ describe('enrichCsf', () => {
     });
   });
 
-  describe('descriptions', () => {
+  describe('story descriptions', () => {
     it('skips inline comments', () => {
       expect(
         enrich(dedent`
@@ -296,6 +296,283 @@ describe('enrichCsf', () => {
     });
   });
 
+  describe('meta descriptions', () => {
+    it('skips inline comments', () => {
+      expect(
+        enrich(dedent`
+        // The most basic button
+        export default {
+           title: 'Button',
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        // The most basic button
+        export default {
+          title: 'Button'
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('skips blocks without jsdoc', () => {
+      expect(
+        enrich(dedent`
+          /* The most basic button */
+          export default {
+           title: 'Button',
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /* The most basic button */
+        export default {
+          title: 'Button'
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('JSDoc single-line', () => {
+      expect(
+        enrich(dedent`
+          /** The most basic button */
+          export default {
+           title: 'Button'
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /** The most basic button */
+        export default {
+          title: 'Button',
+          parameters: {
+            docs: {
+              description: {
+                component: "The most basic button"
+              }
+            }
+          }
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('JSDoc multi-line', () => {
+      expect(
+        enrich(dedent`
+          /**
+           * The most basic button
+           * 
+           * In a block!
+           */
+          export default {
+           title: 'Button',
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /**
+         * The most basic button
+         * 
+         * In a block!
+         */
+        export default {
+          title: 'Button',
+          parameters: {
+            docs: {
+              description: {
+                component: "The most basic button\\n\\nIn a block!"
+              }
+            }
+          }
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('preserves indentation', () => {
+      expect(
+        enrich(dedent`
+          /**
+           * - A bullet list
+           *   - A sub-bullet
+           * - A second bullet
+           */
+          export default {
+           title: 'Button',
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /**
+         * - A bullet list
+         *   - A sub-bullet
+         * - A second bullet
+         */
+        export default {
+          title: 'Button',
+          parameters: {
+            docs: {
+              description: {
+                component: "- A bullet list\\n  - A sub-bullet\\n- A second bullet"
+              }
+            }
+          }
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('correctly interleaves parameters', () => {
+      expect(
+        enrich(dedent`
+          /** The most basic button */
+          export default {
+            title: 'Button',
+            parameters: {
+              foo: 'bar',
+              docs: { inlineStories: true }
+            }
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /** The most basic button */
+        export default {
+          title: 'Button',
+          parameters: {
+            foo: 'bar',
+            docs: {
+              inlineStories: true,
+              description: {
+                component: "The most basic button"
+              }
+            }
+          }
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('respects user component description', () => {
+      expect(
+        enrich(dedent`
+          /** The most basic button */
+          export default {
+            title: 'Button',
+            parameters: {
+              docs: {
+                description: {
+                  component: 'hahaha'
+                }
+              }
+            }
+          }
+          export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /** The most basic button */
+        export default {
+          title: 'Button',
+          parameters: {
+            docs: {
+              description: {
+                component: 'hahaha'
+              }
+            }
+          }
+        };
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+
+    it('respects meta variables', () => {
+      expect(
+        enrich(dedent`
+        /** The most basic button */
+        const meta = {
+          title: 'Button'
+        }
+        /** This should be ignored */
+        export default meta;
+        export const Basic = () => <Button />
+        `)
+      ).toMatchInlineSnapshot(`
+        /** The most basic button */
+        const meta = {
+          title: 'Button',
+          parameters: {
+            docs: {
+              description: {
+                component: "The most basic button"
+              }
+            }
+          }
+        };
+        /** This should be ignored */
+        export default meta;
+        export const Basic = () => <Button />;
+        Basic.parameters = {
+          ...Basic.parameters,
+          storySource: {
+            source: "() => <Button />",
+            ...Basic.parameters?.storySource
+          }
+        };
+      `);
+    });
+  });
+
   describe('options', () => {
     it('disableSource', () => {
       expect(
diff --git a/code/lib/csf-tools/src/enrichCsf.ts b/code/lib/csf-tools/src/enrichCsf.ts
index ff83d66b167e..2d0865ca0ff8 100644
--- a/code/lib/csf-tools/src/enrichCsf.ts
+++ b/code/lib/csf-tools/src/enrichCsf.ts
@@ -9,74 +9,127 @@ export interface EnrichCsfOptions {
   disableDescription?: boolean;
 }
 
-export const enrichCsf = (csf: CsfFile, options?: EnrichCsfOptions) => {
-  Object.keys(csf._storyExports).forEach((key) => {
-    const storyExport = csf.getStoryExport(key);
-    const source = !options?.disableSource && extractSource(storyExport);
-    const description =
-      !options?.disableDescription && extractDescription(csf._storyStatements[key]);
-    const parameters = [];
-    const originalParameters = t.memberExpression(t.identifier(key), t.identifier('parameters'));
-    parameters.push(t.spreadElement(originalParameters));
+export const enrichCsfStory = (csf: CsfFile, key: string, options?: EnrichCsfOptions) => {
+  const storyExport = csf.getStoryExport(key);
+  const source = !options?.disableSource && extractSource(storyExport);
+  const description = !options?.disableDescription && extractDescription(csf._storyStatements[key]);
+  const parameters = [];
+  const originalParameters = t.memberExpression(t.identifier(key), t.identifier('parameters'));
+  parameters.push(t.spreadElement(originalParameters));
+
+  // storySource: { source: %%source%% },
+  if (source) {
+    const optionalStorySource = t.optionalMemberExpression(
+      originalParameters,
+      t.identifier('storySource'),
+      false,
+      true
+    );
 
-    // storySource: { source: %%source%% },
-    if (source) {
-      const optionalStorySource = t.optionalMemberExpression(
-        originalParameters,
+    parameters.push(
+      t.objectProperty(
         t.identifier('storySource'),
-        false,
-        true
-      );
+        t.objectExpression([
+          t.objectProperty(t.identifier('source'), t.stringLiteral(source)),
+          t.spreadElement(optionalStorySource),
+        ])
+      )
+    );
+  }
 
-      parameters.push(
-        t.objectProperty(
-          t.identifier('storySource'),
-          t.objectExpression([
-            t.objectProperty(t.identifier('source'), t.stringLiteral(source)),
-            t.spreadElement(optionalStorySource),
-          ])
-        )
-      );
-    }
+  // docs: { description: { story: %%description%% } },
+  if (description) {
+    const optionalDocs = t.optionalMemberExpression(
+      originalParameters,
+      t.identifier('docs'),
+      false,
+      true
+    );
 
-    // docs: { description: { story: %%description%% } },
-    if (description) {
-      const optionalDocs = t.optionalMemberExpression(
-        originalParameters,
-        t.identifier('docs'),
-        false,
-        true
-      );
+    const optionalDescription = t.optionalMemberExpression(
+      optionalDocs,
+      t.identifier('description'),
+      false,
+      true
+    );
 
-      const optionalDescription = t.optionalMemberExpression(
-        optionalDocs,
-        t.identifier('description'),
-        false,
-        true
-      );
+    parameters.push(
+      t.objectProperty(
+        t.identifier('docs'),
+        t.objectExpression([
+          t.spreadElement(optionalDocs),
+          t.objectProperty(
+            t.identifier('description'),
+            t.objectExpression([
+              t.objectProperty(t.identifier('story'), t.stringLiteral(description)),
+              t.spreadElement(optionalDescription),
+            ])
+          ),
+        ])
+      )
+    );
+  }
+  if (parameters.length > 1) {
+    const addParameter = t.expressionStatement(
+      t.assignmentExpression('=', originalParameters, t.objectExpression(parameters))
+    );
+    csf._ast.program.body.push(addParameter);
+  }
+};
 
-      parameters.push(
-        t.objectProperty(
-          t.identifier('docs'),
-          t.objectExpression([
-            t.spreadElement(optionalDocs),
-            t.objectProperty(
-              t.identifier('description'),
-              t.objectExpression([
-                t.objectProperty(t.identifier('story'), t.stringLiteral(description)),
-                t.spreadElement(optionalDescription),
-              ])
-            ),
-          ])
-        )
-      );
+const addComponentDescription = (
+  node: t.ObjectExpression,
+  path: string[],
+  value: t.ObjectProperty
+) => {
+  if (!path.length) {
+    const hasExistingComponent = node.properties.find(
+      (p) => t.isObjectProperty(p) && t.isIdentifier(p.key) && p.key.name === 'component'
+    );
+    if (!hasExistingComponent) {
+      // make this the lowest-priority so that if the user is object-spreading on top of it,
+      // the users' code will "win"
+      node.properties.unshift(value);
     }
-    if (parameters.length > 1) {
-      const addParameter = t.expressionStatement(
-        t.assignmentExpression('=', originalParameters, t.objectExpression(parameters))
+    return;
+  }
+  const [first, ...rest] = path;
+  const existing = node.properties.find(
+    (p) =>
+      t.isObjectProperty(p) &&
+      t.isIdentifier(p.key) &&
+      p.key.name === first &&
+      t.isObjectExpression(p.value)
+  );
+  let subNode: t.ObjectExpression;
+  if (existing) {
+    subNode = (existing as t.ObjectProperty).value as t.ObjectExpression;
+  } else {
+    subNode = t.objectExpression([]);
+    node.properties.push(t.objectProperty(t.identifier(first), subNode));
+  }
+  addComponentDescription(subNode, rest, value);
+};
+
+export const enrichCsfMeta = (csf: CsfFile, options?: EnrichCsfOptions) => {
+  const description = !options?.disableDescription && extractDescription(csf._metaStatement);
+  // docs: { description: { component: %%description%% } },
+  if (description) {
+    const metaNode = csf._metaNode;
+    if (metaNode && t.isObjectExpression(metaNode)) {
+      addComponentDescription(
+        metaNode,
+        ['parameters', 'docs', 'description'],
+        t.objectProperty(t.identifier('component'), t.stringLiteral(description))
       );
-      csf._ast.program.body.push(addParameter);
     }
+  }
+};
+
+export const enrichCsf = (csf: CsfFile, options?: EnrichCsfOptions) => {
+  enrichCsfMeta(csf, options);
+  Object.keys(csf._storyExports).forEach((key) => {
+    enrichCsfStory(csf, key, options);
   });
 };