storybook-stories

Storybook ストーリー

最も近い既存のストーリーを拡張し、そのレイヤーで使用されている Storybook インスタンスと命名規則に従います。プリミティブ用とアプリ／ドメイン用のストーリーを、それぞれ所有する Storybook 設定を特定します。プロバイダーを重複して追加せず、共通の QueryClient／ルーター／MSW デコレーターを再利用します。

• 例を組み立てる前に、共有プリミティブの一覧を確認します。公開エクスポートを使用し、ドメインコンポーネントはローカルに保ちます。リポジトリのトークンソース、デザインドキュメント、サーフェスの指示に従います。
• 型付きの CSF メタデータと StoryObj<typeof meta> を使用します。コンポーネントが実際に使われるサーフェスに合わせてレイアウト／デコレーターを選びます。中央揃えのレイアウトは一部のコントロールには便利ですが、ルート全体には適しません。
• 意味のある動作を説明できる、サポート対象の状態を最小限の数だけ示します。ストーリー数の下限・上限や、網羅的なプロパティの組み合わせ、各エクスポートへの JSDoc 記述は必須ではありません。
• 制御するプロパティには args を使い、複合的な構成には render を使います。render のみのストーリーに空の args は不要です。キャンバスでは確認できない動作、制約、使用方法を説明する場合は、説明を追加します。
• インタラクティブで、アクセシブルかつ現実的な例にします。テンプレートから推測したバリアントではなく、実際のコンポーネント API を使います。
• プロジェクト既存の autodocs 方針に従います。所有者の方針に合わせて tags: ["autodocs"] を一貫して有効化または省略し、ページの重複を避けます。
• 変更した動作を対象に、該当する Storybook／ビルドまたはビジュアルチェックを実行します。既存の検証結果を再利用します。ストーリーを追加しても、新しいユニットテストやエンドツーエンドテストが自動的に必須になるわけではありません。

使用するストーリー構成パターンについてのみ、references/patterns.md を読みます。例は応用可能なものであり、必須のひな形ではありません。