Auto-generating component API docs from source

WHAT THIS TESTS This probes whether you understand that documentation drifts unless it is generated from the single source of truth, the component's typed source code.

A GOOD ANSWER COVERS For TypeScript React, configure react-docgen-typescript inside the Storybook React-Vite or Webpack framework so the addon-docs autodocs feature reads prop types, default values, required flags, and JSDoc descriptions, then renders them as an ArgsTable. Write human descriptions as JSDoc comments directly above each prop in the interface, so the same comment serves IDE hover, type-checking, and docs. For deeper or non-Storybook output use TypeDoc to emit a JSON or HTML API reference. Events and slots map to typed callback props and children or render-prop signatures, which the same parser surfaces. Run generation in CI and fail the build if extraction errors, ensuring docs never silently break.

COMMON WRONG ANSWERS Writing a separate markdown table by hand, which guarantees drift. Relying on PropTypes runtime checks, which lack rich descriptions and are weaker than TypeScript. Generating docs only locally so they go stale in the published site.

LIKELY FOLLOW-UPS How do you document polymorphic or generic components whose props depend on an as prop. How do you handle forwarded refs and HTML attribute spreads. How do you keep examples alongside the generated table.

ONE CONCRETE EXAMPLE A Button interface declares a variant prop typed as a union with a JSDoc comment Visual style of the button. Storybook autodocs reads the union, lists primary, secondary, ghost as control options, shows the default, and renders the description, all without anyone editing a separate doc file when a new variant is added.