aibdd-form-story-spec

To generate Storybook CSF3 stories alongside React TSX components, you provide a planner reasoning package containing component props, story export definitions, and render hints. The skill validates this payload and writes both paired TSX and CSF3 files into your specified target directory together.

A binding-anchor story is a Storybook CSF3 story that acts as the binding-anchor truth for accessible-name based locators. It enforces boundary invariant I4 by validating that accessible-name fields remain present and consistent with the component props.

Yes, you need a planner reasoning package to generate React component scaffolds. The skill requires this caller payload contract containing component props, story export definitions, and render hints to deterministically render the TSX and CSF3 files.

No, generating Storybook stories keeps business logic out of scope. The skill produces a pure visual scaffold for the React component, while treating play functions and assertions as presentation-focused rather than embedding business logic.

Your accessible-name story validation fails when generating CSF3 files because the boundary invariant I4 check detects inconsistencies. Each story's accessible-name fields and values must be present and match the defined component props exactly to pass validation.