widgetbook_mcp_server

The Widgetbook MCP Server provides a set of MCP endpoints that integrate with your AI assistant to manage Flutter Widgetbook projects. Core capabilities include discovering widgets in your project, inspecting detailed widget information (properties and use cases), retrieving existing use cases, generating new use case code snippets, modifying use cases, running tests for use cases, and capturing visual screenshots. You can interact with these tools through your MCP client by invoking the respective endpoints (for example widgetbook.list_widgets, widgetbook.get_widget_details, widgetbook.generate_use_case_code, widgetbook.run_use_case_test, and widgetbook.generate_screenshot). The server is designed for fast responses and secure access to your project files, enabling conversational UI prototyping, automated UI documentation, and automated UI testing workflows. To begin, configure your MCP client to point at the running Dart server, then start issuing commands to explore your Widgetbook project and iteratively generate and refine UI components through use cases.

Prerequisites:

• Dart SDK 3.0.0 or higher
• Flutter project with Widgetbook dependency
• Git (for cloning the repository)

Install from source:

1. Clone the repository: git clone https://github.com/mastersam07/widgetbook_mcp_server.git
2. Change into the project directory: cd widgetbook_mcp_server
3. Get dependencies: dart pub get
4. Compile the MCP server to an executable (example): dart compile exe bin/widgetbook_mcp_server.dart -o widgetbook-mcp-server
5. Run the server (example path usage): ./widgetbook-mcp-server --project-path /path/to/your/flutter/project

Install from pub.dev (if published as a Dart package):

1. Add the package to your pubspec.yaml and run dart pub get.
2. Run the server using the published entry point as described in the package documentation.

Tips and considerations:

• Ensure your Flutter project includes the Widgetbook dependency so the MCP server can discover and manipulate widgets.
• The MCP server aims for sub-500ms response times; if you experience latency, ensure your project files are accessible and not on a slow network drive.
• Use the provided MCP endpoints to list widgets first, then drill down into details for precise use case generation.
• For production-like environments, consider securing access and configuring appropriate environment variables if the MCP server supports them in your setup.
• When using code generation, review and adapt generated WidgetbookUseCase snippets to fit your project's naming conventions and architecture.