SuperAPI AI 工具集

f0-storybook-stories

前端与建站

查看项目

更新于 10-15 21:40

技能介绍

用途:为 F0 React 组件创建 .stories.tsx 故事文件,适用于新增或更新故事、快照故事、argTypes、装饰器与 play 函数。MDX 文档(Docs 标签页)属于另一个文件,应改用全局的 factorial-f0-component-documentation 技能。

主要能力与规则:导入使用 @storybook/react-vite 的 Meta、StoryObj 类型,storybook/test 的 fn、expect、within,以及 @/lib/storybook-utils/parameters 的 withSnapshot、withSkipA11y;图标来自 @/icons/app、@/icons/modules、@/icons/ai。Meta 通常用 satisfies Meta<typeof Component>,复杂泛型组件例外用普通 Meta。标签包括 stable、experimental、internal、deprecated,以及 !autodocs(存在手写 MDX 页时使用,防止重复生成 Docs 页)和 no-sidebar。Chromatic 快照默认全局关闭,需要捕获的故事必须用 withSnapshot({}) 显式开启,跳过 a11y 时用 withSkipA11y(withSnapshot({}))。联合类型属性的 argTypes 应引用组件导出的常量数组,不要硬编码选项。使用自定义 render 且未继承 meta args 的故事必须显式提供 args,否则在 meta 含必填属性时会触发 TypeScript 错误。

使用方式:按 references/story-patterns.md 查看 Meta 定义、标签、argTypes、Snapshot、装饰器与 play 函数写法;play 函数、portal 查询、step() 与 a11y 配置需加载 f0-storybook-testing 技能。

限制:资料未提供安装命令、版本要求、收费与平台信息。