fandhe-ai Chakra UI v3 リファレンス
Chakra UI v3 公式ドキュメントを網羅したスキル。 タスクからカテゴリを引き、カテゴリの README.md で目的のページを特定すること。
ディレクトリ構成
skills/chakra-ui/
SKILL.md
references/
get-started/
README.md
ai-llms.md
ai-mcp-server.md
ai-skills.md
changelog.md
cli.md
contributing.md
env-iframe.md
env-shadow-dom.md
figma.md
framework-next-app.md
framework-next-pages.md
framework-remix.md
framework-storybook.md
framework-tanstack-router.md
framework-vite.md
installation.md
migration.md
playground.md
components/
README.md
concepts/
layout/
typography/
buttons/
date-time/
forms/
collections/
overlays/
disclosure/
feedback/
data-display/
i18n/
utilities/
charts/
README.md
installation.md
area-chart.md
bar-chart.md
bar-list.md
bar-segment.md
axes.md
cartesian-grid.md
donut-chart.md
legend.md
line-chart.md
pie-chart.md
radar-chart.md
scatter-chart.md
sparkline.md
tooltip.md
use-chart.md
styling/
README.md
concepts/
compositions/
style-props/
theming/
README.md
concepts/
design-tokens/
compositions/
customization/
blocks/
README.md
ai.md
app-headers.md
app-integrations.md
app-navbars.md
authentication.md
banners.md
blogs.md
cards.md
careers.md
charts.md
contacts.md
cta.md
dividers.md
docs-changelog.md
docs-code-block.md
docs-example-preview.md
docs-header.md
docs-navbar.md
docs-pagination.md
docs-parameter-field.md
docs-sidebar.md
docs-step.md
docs-toc.md
faqs.md
features.md
feeds.md
footers.md
help-center.md
heroes.md
layouts.md
logos.md
marketing-headers.md
marketing-navbars.md
notifications.md
onboarding.md
org-switcher.md
pricing.md
product-categories.md
product-grid.md
product-reviews.md
profiles.md
property-panels.md
settings.md
sharing.md
shopping-carts.md
sidebars.md
stats.md
store-signup-offers.md
teams.md
testimonials.md
webhooks.md
samples/
README.md
provider-setup.md
dark-mode.md
responsive-styles.md
theme-customization.md
component-recipes.md
chakra-factory.md
form-field-input.md
dialog.md
toast.md
table.md
scripts/
README.md
install.md
cli.md
generate.md
migration.md
test.md
mcp.md
探索手順
タスクからカテゴリを引き、カテゴリの README.md で目的のページを特定する:
- 下記マッピング表でタスクに対応するカテゴリを探す
- そのカテゴリの
references/{category}/README.mdを参照して目的のページを特定する - 該当ページの
.mdを Read して詳細を確認する
タスク → カテゴリ マッピング
| タスク | カテゴリ | 参照 README |
|---|---|---|
| インストール、フレームワーク統合（Next.js/Remix/Vite/TanStack Router）、AI 連携（LLMs.txt/MCP Server/AI Skills）、環境設定、CLI、移行 | get-started | references/get-started/README.md |
| コンポーネントの使い方、Props、バリアント、レイアウト、フォーム、オーバーレイ | components | references/components/README.md |
| チャートの表示、BarChart/LineChart/PieChart、useChart、データ可視化 | charts | references/charts/README.md |
| スタイルプロップ、レスポンシブデザイン、ダークモード、CSS 変数、Chakra Factory | styling | references/styling/README.md |
| デザイントークン、レシピ、スロットレシピ、カスタマイズ、defineConfig | theming | references/theming/README.md |
| UI ブロックテンプレート（ヒーロー、ナビバー、フッター等、要 CHAKRA_PRO_API_KEY） | blocks | references/blocks/README.md |
| 典型的な使い方（Provider 設定、ダークモード、フォーム、ダイアログ等） | samples | samples/README.md |
| インストール・CLI コマンド、コード生成、マイグレーション、テスト、MCP | scripts | scripts/README.md |