Storybook icon

Storybook

Provides AI assistants with access to Storybook components, stories, properties, and screenshots for enhanced interaction and analysis.

About

This TypeScript-based server empowers AI assistants, particularly those leveraging the Model Context Protocol (MCP), to seamlessly interact with any Storybook instance. It grants AI access to a Storybook's full spectrum of components, their individual stories, detailed property definitions, and the ability to capture high-fidelity screenshots. This enables AI to perform tasks like visual regression testing, component documentation, and design system audits, whether connected to local development Storybooks, deployed production versions, or public component libraries.

Key Features

  • Discover and list all available components within a Storybook instance.
  • Access and filter stories by component, retrieving detailed information including parameters and props.
  • Capture high-fidelity screenshots of individual stories across various viewports.
  • Perform responsive testing by capturing components at multiple viewport sizes.
  • Automatically detect Storybook versions and API endpoints for broad compatibility.
  • 0 GitHub stars

Use Cases

  • Analyze deployed production Storybooks to audit component libraries and design systems.
  • Automate visual regression testing by comparing component appearances across changes or states.
  • Connect to local Storybook instances for enhanced AI-driven development and debugging.
Advertisement

Advertisement