Skip to main content
Glama
elsahafy
by elsahafy

generate_story

Auto-generate Storybook CSF3 story files for React, Vue, Svelte, or Angular components. Detects props to create default and variant stories, play functions, and accessibility addon config.

Instructions

Auto-generate a Storybook story file (CSF3 format) for a UI component. Detects props from code, includes default story, variant stories, play functions, and accessibility addon config.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
frameworkYesFramework the component is written in
story_titleNoStorybook story title/path (e.g., 'Components/ProductCard'). Defaults to 'Components/{component_name}'
component_codeYesFull source code of the component to generate stories for
component_nameYesPascalCase name of the component (e.g., 'ProductCard')

Schema Changelog

Changes observed during successful MCP inspections.

  1. First observedv2.0.1

TDQS

B3.3/5.0
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations, the description carries the full burden. It usefully discloses the generated output shape (CSF3, default + variant stories, play functions, a11y addon config), but says nothing about whether a file is written to disk, its path, overwrite behavior, or error conditions for unsupported frameworks.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

Two tight sentences, front-loaded with the action and artifact format, then the contents. No filler or redundancy.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness3/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a generation tool with no annotations and no output schema, the description explains what the artifact contains but omits where it is written, what the tool returns, and any failure modes. Adequate but with clear gaps for an agent invoking it.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters3/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

Schema description coverage is 100%, so all four parameters are already documented, including the framework enum and the story_title default. The phrase 'Detects props from code' hints that component_code is parsed, but no param-level detail is added beyond the schema, so the baseline 3 applies.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose4/5

Does the description clearly state what the tool does and how it differs from similar tools?

States a specific verb ('Auto-generate') and resource ('Storybook story file (CSF3 format) for a UI component'), and enumerates the artifact contents (default story, variant stories, play functions, a11y config). It is distinguishable from generate_component, but it never names that sibling explicitly, so the differentiation is left implicit.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines2/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

There is no when-to-use guidance, no prerequisites (e.g., must exist alongside generate_component), and no alternatives named among the many siblings. The only implied context is 'for a UI component', which is too thin to route an agent between this and generate_component.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.