Storybook react-docgen-typescript not extracting MUI inherited props from component in a workspace package (React)

[Dinu-Alin]

Summary

Environment:

• Storybook 10.2.8 (@storybook/react-vite)
• React 19.2.0
• TypeScript 5.9.3
• @mui/material 7.3.8
• Node with npm workspaces

Monorepo structure:
storybook-test/
├── package.json ← "workspaces": ["packages/*"]
├── tsconfig.json ← project references
├── packages/
│ ├── ui/ ← @storybook-test/ui (component library)
│ │ ├── package.json
│ │ ├── tsconfig.json
│ │ └── src/
│ │ ├── index.ts
│ │ └── components/Button.tsx
│ └── storybook/ ← @storybook-test/storybook
│ ├── package.json
│ ├── tsconfig.json
│ ├── .storybook/
│ │ ├── main.ts
│ │ └── preview.tsx
│ └── src/
│ ├── components/Button.tsx ← local Button (works)
│ └── stories/Button.stories.ts

Issue:
When I import the Button from the local file, Storybook's autodocs correctly displays all inherited MUI ButtonProps (variant, size, disabled, color, etc.) in the 'prop/controls panel'. But when I import the same component from the workspace package @storybook-test/ui, only my custom props show up and all MUI props are missing.

Both Button components are identical:

import React from "react";
import {
  Button as MuiButton,
  type ButtonProps as MuiButtonProps,
} from "@mui/material";

export interface ButtonProps extends MuiButtonProps {
  label: string;
}

export const Button = ({ label, ...rest }: ButtonProps) => (
  <MuiButton {...rest}>{label}</MuiButton>
);

Story file:

import { Button } from "@storybook-test/ui";       // ❌ MUI props missing
// import { Button } from "../components/Button"; // ✅ MUI props show up
import type { Meta, StoryObj } from "@storybook/react-vite";

const meta = {
  title: "Example/Button",
  component: Button,
  parameters: { layout: "centered" },
  tags: ["autodocs"],
} satisfies Meta<typeof Button>;

export default meta;
type Story = StoryObj<typeof meta>;

export const Primary: Story = {
  args: { label: "Button" },
};

Storybook config:

import type { StorybookConfig } from "@storybook/react-vite";

const config: StorybookConfig = {
  stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
  addons: [
    "@chromatic-com/storybook",
    "@storybook/addon-vitest",
    "@storybook/addon-a11y",
    "@storybook/addon-docs",
    "@storybook/addon-themes",
  ],
  framework: "@storybook/react-vite",
  typescript: {
    reactDocgen: "react-docgen-typescript",
    reactDocgenTypescriptOptions: {
      compilerOptions: {
        allowSyntheticDefaultImports: false,
        esModuleInterop: false,
      },
      shouldExtractLiteralValuesFromEnum: true,
      shouldRemoveUndefinedFromOptional: true,
      propFilter: (prop) => true,
    },
  },
};
export default config;

UI tsconfig:

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "jsx": "react-jsx",
    "strict": true,
    "noEmit": true,
    "verbatimModuleSyntax": true
  },
  "include": ["src"]
}

What I've tried:

• Pointing tsconfigPath to the UI tsconfig - no effect
• Overriding moduleResolution to Node10 in compilerOptions to work around "bundler" mode not resolving specifiers in standalone TS compiler - no effect

What am I missing?
Thank you!

Additional information

No response

Create a reproduction

No response

[dosubot[bot]]

Hi @Dinu-Alin! I'm Dosu and I’m helping the storybook team.

This is a limitation in Storybook's prop extraction when using react-docgen-typescript with workspace packages and complex type inheritance like MUI. Recent Storybook releases (after 2026-01-20) include fixes for react-docgen-typescript that improve prop extraction from workspace packages and external types. Please upgrade Storybook to the latest version and retest—these changes specifically address issues with missing inherited props from libraries like MUI when importing from workspace packages PR #33586, PR #33589, PR #33598.

Also, try customizing your propFilter to explicitly include MUI props:

propFilter: (prop) =>
  prop.parent ? !/node_modules\/(?!@mui)/.test(prop.parent.fileName) : true,

This ensures inherited props from @mui/material are not filtered out docs.

If you still see issues, check that your stories import the component source directly (not just the package root), as Storybook autodocs in monorepos sometimes require direct source imports for full prop extraction docs.

If none of these resolve it, you can manually document inherited props or re-declare key MUI props in your interface as a workaround. Let me know if you need more help or if you can share how your workspace package is referenced (source vs. built output).

To reply, just mention @dosu.

---

Share context across your team and agents. Try Dosu.

[kasperpeulen]

This is a limitation in how the @joshwooding/vite-plugin-react-docgen-typescript Vite plugin creates its TypeScript program.

Root cause: The plugin creates a TS program from files matching its include glob (default: **/**.tsx), resolved from the Storybook project's working directory. In a monorepo, workspace package files (like packages/ui/src/**) are outside that directory and aren't included as root files in the program. When react-docgen-typescript tries to parse a workspace component, the TS program doesn't have its type information, so inherited props (like MUI's ButtonProps) aren't resolved.

Note that tsconfigPath only affects compilerOptions — it does not change which files are included in the TS program. That's why pointing it to your UI tsconfig didn't help.

Fix: Add your workspace package source files to the include option:

typescript: {
  reactDocgen: "react-docgen-typescript",
  reactDocgenTypescriptOptions: {
    // ...your existing options
    include: ["**/**.tsx", "../../packages/ui/src/**/*.tsx"],
  },
},

The include array controls both which files the plugin's Vite transform processes AND which files become root files in the TS program. By adding your workspace package's source files, react-docgen-typescript can resolve the full type chain including inherited MUI props.

I reproduced this and confirmed the fix — the workspace Button goes from 0 MUI props to all 45 (variant, size, color, disabled, fullWidth, href, etc.): https://github.com/kasperpeulen/storybook-rdt-workspace-repro