commerce-b2b-open-code-components-replace

OOTB B2B Commerce コンポーネントをオープンコードに置き換える

このスキルは、サイトメタデータの content.json ファイルにある OOTB（標準搭載）B2B Commerce コンポーネント定義を、対応するオープンソースの site: コンポーネントに置き換えます。または、変更を加えずに、指定された OOTB 定義に対応するオープンコードコンポーネントを検索します。assets/ootb-to-open-code-mapping.json から読み込んだ信頼できるマッピングを使用します。

対象範囲

モード： 一括置換では、スキャン（ステップ 1）、必要に応じたユーザーによる選択、続いて content.json の更新（ステップ 2～3）を実行します。検索のみ（ユーザーが対応するコンポーネントを求めているものの、ファイルは変更しない場合）では、マッピングの信頼性に関するルールを適用し、指定されたコンポーネント、または対象範囲内の content.json で見つかった定義について、OOTB → site: の対応を報告します。ユーザーが置換を確認するまで、Write は呼び出さないでください。ビューに限定した作業： ファイルの検索と読み取りは、すべてのビューではなく sfdc_cms__view/<ViewName>/（またはユーザーが指定したパス）に限定します。

---

前提条件

<package-dir> の解決

sfdx-project.json を読み取り、有効なパッケージディレクトリを選択します。packageDirectories[] を抽出し、"default": true のエントリを使用します。default が指定されたエントリがない場合は、最初のエントリを使用します。以下では、この値をすべて <package-dir> として使用します。sfdx-project.json が存在しない場合、または packageDirectories がない場合は、ユーザーに伝えて中止してください。

委任のセットアップ

コンポーネントを置き換える前に、commerce-b2b-open-code-components-integrate スキルに委任して、次の点を確認してください。

1. オープンソースリポジトリが .tmp/b2b-commerce-open-source-components にクローンされている
2. ストアが選択され、サイトメタデータがローカルに取得されている
3. オープンコードコンポーネントがストアのサイトメタデータにコピーされている

統合スキルは .tmp/ のクローンのライフサイクルを管理します（既存のチェックアウトを再利用するか、再クローンするかをユーザーに確認します）。このスキルでは、クローンがすでに存在することを前提とします。

ユーザーにプレーンテキストのチャット返信（ルール 1 に従う）を送信してください：「コンポーネントを置き換える前に、オープンコードコンポーネントがストアにセットアップされていることを確認する必要があります。確認します……」

前提条件が満たされていない場合は、統合スキルが対応します。すべての確認に合格したら、置換ワークフローに進みます。

前提条件を満たした後に必要な状態：

• パッケージディレクトリ — 上記で解決した値（例：force-app）
• ストア名 — 例：My_B2B_Store1
• サイトメタデータのパス — <package-dir>/main/default/digitalExperiences/site/<store-name>/

---

置換ワークフロー

ステップ 1：サイトをスキャンし、マッピングと照合する

このステップは必須です。 置換を試みる前に、必ず最初にサイトをスキャンしてください。

ユーザーにプレーンテキストのチャット返信（ルール 1 に従う）を送信してください：「ストアのサイトメタデータをスキャンして、現在使用されているすべての OOTB Commerce コンポーネントを見つけ、オープンコードの対応コンポーネントがあるものを確認しています。」

ステップ 1a — 該当ファイルを検索する（コマンド 1 つ、単純なリテラル一致）：

grep -rl '"commerce' \
  <package-dir>/main/default/digitalExperiences/site/<store-name>/sfdc_cms__view/ \
  <package-dir>/main/default/digitalExperiences/site/<store-name>/sfdc_cms__themeLayout/ \
  --include="content.json"

ステップ 1b — マッピングを読み取り、一致したファイルを解析する。 assets/ootb-to-open-code-mapping.json を一度メモリに読み込みます。次に、Read ツールを使用して一致した各ファイルを解析し、commerce で始まるすべての "definition" の値（例：commerce_builder:cartBadge）を抽出します。すべてのファイルから、重複を除いた OOTB コンポーネントの一覧を作成します。

ステップ 1c — リポジトリのコンポーネントを一覧表示する（コマンド 1 つ）：

ls .tmp/b2b-commerce-open-source-components/force-app/main/default/sfdc_cms__lwc/

解析した定義、ls の出力、マッピング表を使用して、見つかった OOTB コンポーネントを次の 3 つのグループに分類します。

内訳と選択可能なリストをユーザーに表示します。

最初に、スキップされたコンポーネントとマッピングされていないコンポーネントについてユーザーに知らせます。

Found X OOTB components in your site:

In mapping table but NOT in repo (skipping):
  - commerce_builder:quoteSummary → site:quoteSummary (not found in repo)

No mapping available (not in mapping table):
  - commerce_builder:actionButtons
  - commerce_builder:layoutHeaderOne
  - commerce_builder:searchInputContainer
  - commerce_builder:myAccountMegaMenu

次に、置換可能なコンポーネントを複数選択リストとして提示し、入力する代わりにチェックボックスで選べるようにします。「上記すべて」オプションを含めます。

Which components would you like to replace?

[ ] commerce_builder:heading → site:productHeading
[ ] commerce_builder:cartBadge → site:cartBadge
[ ] commerce_builder:searchInput → site:searchInput
[ ] All of the above

ユーザーが最初のリクエストで特定のコンポーネント名を指定している場合は、それらに絞り込み、選択を求めるプロンプトを省略してください。

ステップ 2：content.json 内の置き換え

ルール 1 に従い、ユーザーにプレーンテキストで次のメッセージを送信します：「サイトの content.json ファイル内で、選択された OOTB コンポーネント定義をオープンコード版に置き換えます。」

対象ファイルはステップ 1 ですでに特定されています。選択されたコンポーネントを含む各ファイルについて、次の手順を実行します。

1. Read ツールを使ってファイルを読み取ります。
2. 選択された各 OOTB コンポーネントについて、マッピング先の site: ターゲットがオープンコードリポジトリに存在することを改めて確認します。この確認に通った置き換えのみ実行します。
3. 一致するすべての "definition" の値を、対応するオープンコード版に置き換えます。マッピングテーブルにある正確な site:<name> 文字列を必ず使用します。
   • 例："definition": "commerce_builder:heading" → "definition": "site:productHeading"
4. Write ツールを使って更新したファイルを保存します。
5. ほかの JSON プロパティはすべて保持します。変更するのは "definition" の値のみです。

効率よくまとめて処理する： 1 つのファイルに複数の OOTB コンポーネントが含まれている場合、1 回の Read → 変更 → Write の処理で、すべての置き換えを適用します。同じファイルを複数回読み書きしてはいけません。

ステップ 3：報告

Replacement Complete!

Replaced X components across Y files:
- commerce_builder:heading → site:productHeading (3 files)
- commerce_builder:cartBadge → site:cartBadge (2 files)
- commerce_builder:searchInput → site:searchInput (4 files)

Skipped (not in repo):
- commerce_builder:quoteSummary

No mapping available (left unchanged):
- commerce_builder:actionButtons
- commerce_builder:layoutHeaderOne
- commerce_builder:searchInputContainer

Modified files:
- sfdc_cms__view/Home/content.json
- sfdc_cms__view/Product_Detail/content.json
- sfdc_cms__themeLayout/DefaultTheme/content.json

Next Steps:
1. Deploy: sf project deploy start -d <package-dir>/main/default/digitalExperiences/site/<store-name>
2. Test the store thoroughly in Experience Builder
3. Publish your site when ready

---

やり取りの例

ユーザー：「OOTB コンポーネントをオープンコード版に置き換えて」

エージェント：「コンポーネントを置き換える前に、オープンコードコンポーネントがストアに設定されていることを確認する必要があります。確認します……」

• [完了] オープンソースリポジトリをクローン済み
• [完了] My_B2B_Store1 のストアメタデータを取得済み
• [完了] オープンコードコンポーネントが統合済み

エージェント：「ストアのサイトメタデータをスキャンして、OOTB の commerce コンポーネントをすべて特定し、オープンコード版があるか確認します。」

(grep -rl を実行して commerce 定義を含むファイルを探し、各ファイルを Read してコンポーネント名を抽出し、ls を実行してリポジトリのコンポーネントを一覧表示してから、マッピングテーブルと照合します)

Found 8 OOTB components in your site:

No mapping available (not in mapping table):
  - commerce_builder:searchInputContainer
  - commerce_builder:layoutHeaderOne
  - commerce_builder:myAccountMegaMenu
  - commerce_builder:actionButtons

エージェント (複数選択プロンプトでユーザーに確認)：

Which components would you like to replace?

[ ] commerce_builder:heading → site:productHeading
[ ] commerce_builder:cartBadge → site:cartBadge
[ ] commerce_builder:searchInput → site:searchInput
[ ] commerce_builder:cartSummary → site:cartSummary
[ ] All of the above

ユーザー： (heading と cartBadge を選択)

エージェント：「サイトの content.json ファイル内で、選択された OOTB コンポーネント定義をオープンコード版に置き換えます。」

(スキャン時に対象ファイルはすでに特定済みです。対象ファイルごとに Read/Write を 1 回行い、すべての置き換えをまとめて適用します)

Replacement Complete!

Replaced 2 components across 5 files:
- commerce_builder:heading → site:productHeading (3 files)
- commerce_builder:cartBadge → site:cartBadge (2 files)

No mapping available (left unchanged):
- commerce_builder:searchInputContainer
- commerce_builder:layoutHeaderOne
- commerce_builder:myAccountMegaMenu
- commerce_builder:actionButtons

Modified files:
- sfdc_cms__view/Home/content.json
- sfdc_cms__view/Product_Detail/content.json
- sfdc_cms__themeLayout/DefaultTheme/content.json

Next Steps:
1. Deploy: sf project deploy start -d force-app/main/default/digitalExperiences/site/My_B2B_Store1
2. Test the store thoroughly in Experience Builder

---

ルール

1. 実行前に、必ずチャットで説明します。 Bash または Write ツールを呼び出す前に、そのコマンドで何を行い、なぜ行うのかを説明するプレーンテキストのメッセージを会話に送信します。説明は、ツール呼び出しの直前に通常のチャットメッセージとして表示する必要があります。コマンド自体に埋め込んだり（echo 行や # コメントなど）、コマンドの前に付けたりしてはいけません。また、ツールの description パラメーターだけに頼ってはいけません。このフィールドはユーザーに表示されるとは限らないためです。説明を送信した後、ツールを呼び出し、ユーザーの承認を待ってから続行します。
2. assets/ootb-to-open-code-mapping.json のみを信頼できる情報源とします。 OOTB からオープンコードへのマッピングはすべてこのファイルから取得します。コンポーネント名を推測したり、類推したり、でっち上げたりしてはいけません。置き換え後の各 "definition" は、ファイル内にある正確なマッピング値を使用する必要があります。この値は常に site: 名前空間を使用します（例：site:productHeading）。書き込みの前に、マッピング先のターゲットがクローン済みのオープンコードコンポーネントリポジトリ（.tmp/b2b-commerce-open-source-components/force-app/main/default/sfdc_cms__lwc/ 配下）に存在することを確認します。存在しない場合は置き換えをスキップし、「リポジトリに存在しない」項目として報告します。
3. JSON ファイルには Read と Write ツールを使います。 content.json ファイルの読み取りには Read ツールを使い、更新には Write ツールを使います。JSON の解析や編集に bash を使ってはいけません。JSON の内容に対する sed、awk、perl、正規表現の使用は禁止です。bash は単純なファイル検索（grep -rl、find、ls）に限って使用します。JSON 値の抽出や変更には使いません。
4. コマンドの数を最小限にします。 作業をできるだけ少ないコマンドにまとめます。すべてのファイルのスキャンには grep を 1 回だけ使い、リポジトリの確認には ls を 1 回だけ使い、各ファイルの Read/Write は 1 回ずつ行います。コンポーネントやディレクトリごとに別のコマンドを実行してはいけません。

エラー処理

エラー	メッセージ	対応
前提条件を満たしていない	"Open code components are not integrated yet."	まず統合スキルを実行する
マッピングが見つからない	"No mapping found for '{component}'."	利用可能なマッピングを表示し、未マッピングとして報告する
コンポーネントがリポジトリにない	"Open code component '{name}' not found in cloned repo."	スキップしてユーザーに伝える
サイトに OOTB コンポーネントがない	"No OOTB commerce components found in site metadata."	ユーザーに伝える。置換するものはない
置換可能なコンポーネントがない	"All OOTB components found are unmapped — none can be replaced."	未マッピングの一覧を表示し、更新されたマッピングがないか確認するよう提案する
content.json の解析エラー	"Failed to parse content.json: {file}"	エラーを表示し、ファイルをスキップして残りのファイルの処理を続ける

---

検証チェックリスト

• 統合スキルを使用して前提条件（リポジトリ、ストア、コンポーネント）を確認した
• 最小限のコマンドでサイトをスキャンし、リポジトリを確認し、マッピングを照合した（ステップ 1）
• 各置換で、マッピングされた正確な site: 定義を使用し、書き込み前にオープンコードリポジトリに存在することを確認した
• 次に進む前に、3 つのカテゴリに分けた内訳をユーザーに提示した
• ユーザーが置換するコンポーネントを選択した（または名前を指定した）
• 各 content.json ファイルを、単一の Read → 変更 → Write の処理で更新した
• JSON 構造を保持し、構文エラーを追加していない
• スキップしたコンポーネントと未マッピングのコンポーネントをユーザーに伝えた
• デプロイコマンドを提示した