コードリポジトリをアドプトする

Adopt a repo はコードベースを 1DesignTool に取り込みます。アプリはプロジェクトをアプリ所有の worktree(アプリデータ配下の 1design/<slug> ブランチ)に登録し、エージェントはあなたのチェックアウトに一切書き込まずに実際の UI の中でデザインします。「モノをデザインする」から「自分のモノの中でデザインする」への橋です。

アドプトする

ホーム画面から Open folder… でリポジトリを選び、アドプトシートを開きます。フォルダを読み取り、その中でデザインするか尋ね、Design inside this codebase でプロジェクトをコードベースプロジェクトとして登録します。アプリは worktree(アプリデータ配下にチェックアウトされた 1design/<slug> ブランチ)を作成し、プロジェクトはあなたのチェックアウトではなくその上で開きます。

アドプトシート — リポジトリを指し、worktree 分離を選ぶ

リポジトリは無傷のままです。書き込みはアプリの worktree に着地し、読み取りは worktree 越しにあなたの実ファイルから行われます。アドプトシートには分離の説明も表示されます。worktree とは何か、なぜあなたのチェックアウトが作業コピーでないのか。

worktree モデル

コードベースプロジェクトは 1design/<slug> 上に存在します。アプリが所有し、アプリデータ配下に worktree としてチェックアウトされたブランチです。

  • 読み取り — エージェントは worktree 越しにあなたの実際の UI を見る
  • 書き込み — ターンの diff はブランチに着地し、あなたのチェックアウトには絶対に書かれない
  • プレビュー — worktree のアプリプレビュー、または自分の dev サーバー
  • あなたのチェックアウト — 一切書き込まれない。ホスト管理パス(.1design/、スキルディレクトリ)はあなたの .gitignore ではなく .git/info/exclude で隠れる

プロジェクトのブランチバーにはレーンが表示されます。main からの 1design/<slug>、先行コミット数、ターンが変更したファイルです。

ブランチバー — worktree ブランチ、先行コミット、レビューとマージのアクション

コードベースの中でデザインする

アドプト後は、どのプロジェクトと同じようにステアリングしますが、ブリーフはあなたの UI についてのものです。「ヘッダーをスティッキーにして」「プロフィールの隣に設定画面を追加して」。エージェントは worktree 越しに実ファイルを編集し、プレビューは自分の dev サーバーかアプリのプレビューで動くアプリを表示します。

diff スコープのゲート

コードベースプロジェクトは完全な design kit ゲートを実行しません。あなたのリポジトリは生成物ではないので、それを生成物のようにチェックすると、そのターンが触れていないコードまでフラグを立ててしまいます。代わりにチェックは diff スコープ です。ターンの変更ファイルが検証され(diff 上で tells.mjs)、ブランチバーのレビューアクションがターンの作業内容を正確に表示します。

レビューとマージ

ターンの成果が正しそうなら、ブランチバーの Review changes がターンの生んだ diff を表示します。Copy merge command または Merge into main がブランチの作業をあなたのリポジトリに戻します。Discard は worktree 状態を捨てます。マージされるのはあなたのチェックアウトの main で、worktree はサンドボックスです。

Build mode と Sketch mode

コードベースプロジェクトは、ライブプレビューの上に 2 つの追加モードを持ちます。

  • Build mode — 動作中のアプリの UI を視覚的に編集し、変更がコードに書き戻される(Build modeを参照)
  • Sketch mode — コンポーネントにマップされる .1d スケッチ(Sketch modeを参照)

Direct mode

worktree モデルがデフォルトなのは、それが安全な選択だからです。アプリはアプリデータ配下の自分のブランチに書き込み、あなたのチェックアウトには書きません。Direct mode(アドプトシートのもう 1 つの選択肢)は、プロジェクトをあなたのチェックアウトそのものに向けます。エージェントが実ファイルをその場で編集します。速いですが、成果はあなたのワーキングコピーに着地します。だからこそ worktree がデフォルトなのです。

得意なこと

  • 実際のアプリの中でのデザイン — すでに存在する画面を、リスタイル
  • 機能追加 — 新しい画面やフローを、その場に
  • UI パス — アプリ全体のビジュアルパスを、diff つきで
  • コードベースへのオンボーディング — エージェントが、住むことになるリポジトリを読む

分離の説明

worktree が存在するのは、あなたがマージするまでエージェントの作業があなたのチェックアウトに触れられないようにするためです。登録されたプロジェクトルートはアプリのブランチであり、読み書きはそこを通り、プロジェクトに必要なホスト管理ファイルは .git/info/exclude で隠れるので、あなたの git status はきれいなままです。コストは 1 ステップだけ。成果が正しいときにブランチをマージします。

ヒント: マージがきれいになるまで worktree は残しておきましょう。成果が確認される前にブランチを消すと diff が失われます。マージボタンで 1 アクションになるので、クリックする前にレビューを。

関連ページ