airRnot1106

Create new React/Next.js components for this project (Next.js 16 + React 19). Use when asked to create, add, or implement a new component. Enforces: component type selection (Server/Client/Cache), Suspense and Static Shell optimization, composition patterns,…

Prisma CLI commands reference covering all available commands, options, and usage patterns. Use when running Prisma CLI commands, setting up projects, generating client, running migrations, managing databases, or starting Prisma's MCP server. Triggers on…

Prisma Client API reference covering model queries, filters, operators, and client methods. Use when writing database queries, using CRUD operations, filtering data, or configuring Prisma Client. Triggers on "prisma query", "findMany", "create", "update",…

Guides for configuring Prisma with different database providers (PostgreSQL, MySQL, SQLite, MongoDB, etc.). Use when setting up a new project, changing databases, or troubleshooting connection issues. Triggers on "configure postgres", "connect to mysql",…

Automate browser interactions, test web pages and work with Playwright tests.

Next.js bundle analysis skill for identifying large modules and providing optimization suggestions. Use after implementing a feature to run `pnpm next experimental-analyze --output` and analyze the results. Triggers when the user asks to analyze bundles,…

Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate…

このプロジェクトにおける新規UIコンポーネント実装の規約（Panda CSS + Base UI、src/components/**）。インタラクティブなルート要素とレイアウト要素の分離、styled()の使い方、internal/publicカスタムプロパティパターン、プロパティの記述順序、oxlintでは検出できないa11y検証手順を扱う。src/components/配下でコンポーネントを新規作成・変更するとき、特にvariantや複数の内部パーツ、公開スタイルAPIを持つコンポーネントを扱うときに使用する。

レスポンシブCSSの判断基準と規約。ピクセルパーフェクトを目標にしない考え方、固定サイズ回避、Intrinsic → コンテナクエリ → メディアクエリのエスカレーション順序、vw/vh禁止とsvi/dvi/lvi等の使い分け、クエリのレンジ構文とcontainer-nameのdashed-ident必須化、calc()によるブレイクポイント根拠の明示（クエリ条件内でvar()禁止）、clamp()による流動サイジングの計算式、grid-auto-fill/fit・grid-switcher（sign()トリック）…

Analyze and quality-check this project's Next.js 16 (Turbopack) bundle sizes using `pnpm analyze:output` (i.e. `next experimental-analyze --output`). Use when the user wants to: inspect bundle sizes, find large dependencies, detect duplicate modules,…

明名の思想に基づくフロントエンドのディレクトリ構成設計と BCD Design によるコンポーネント命名のガイドライン。 ディレクトリ構成の設計・リファクタリング、コンポーネントの命名・配置、新規フロントエンドプロジェクトのセットアップ、 ファイルやコンポーネントの配置判断時にトリガー。package by feature、ドメイン駆動のディレクトリ設計、 BCD Design、明名、後方一致に関する質問や作業で使用する。

コード内のコメント、TODO コメント、テストケース名、コミットメッセージの文章規範。書く内容の取捨選択（ドメインの言葉による方針、過剰な why の抑制、経緯と指示の排除）と、文の型・語彙の制限（「〜すれば〜できる」構文、直訳調、擬人法、比喩、誇張、攻撃的な語、括弧による強調、接続詞の省略、並列でない箇条書きの禁止）を定める。コメントを書くとき、テスト名を付けるとき、コミットメッセージを作るとき、およびそれらを推敲するときに使用する。

Analyze and quality-check this project's Next.js 16 (Turbopack) bundle sizes using `vp run analyze:output` (i.e. `next experimental-analyze --output`). Use when the user wants to: inspect bundle sizes, find large dependencies, detect duplicate modules,…