sparkle-design-cli 2.0.7-beta.6 → 2.0.7-beta.7

package/lib/font-manager.js

@@ -98,11 +98,20 @@ function createCustomCssImportBlock(customCssPath, globalsPath) {
 function createSparkleImportBlock(sourcePackages = [], globalsPath = null, customCssPath = null) {
   const parts = [''];
 
-  if (sourcePackages !== null && sourcePackages !== undefined) {
-    const nodeModulesRel = globalsPath ? resolveNodeModulesRelPath(globalsPath) : '../node_modules';
-    parts.push(createSourceBlock(sourcePackages, nodeModulesRel));
-  }
-
+  // CSS 仕様上 `@import` は `@charset` / `@layer` 以外の at-rule より前に
+  // 書く必要がある。`@source` を `@import` より前に置くと、PostCSS 処理系に
+  // よっては後続の `@import "./sparkle-design.css"` が silent に drop され、
+  // sparkle tokens が最終 CSS に出ない回帰になる（beta.6 以前で再現）。
+  // そのため順序は:
+  //   1. @import "./sparkle-design.css"   （Sparkle 本体のトークン）
+  //   2. @import "./custom-tokens.css"    （ユーザーのカスタムトークン、任意）
+  //   3. @source "../node_modules/..."    （Tailwind スキャン対象、任意）
+  // の順で出力する。
+  // en: Per CSS spec, all `@import` rules must precede any other at-rule
+  // (except `@charset` / `@layer`). Placing `@source` between imports makes
+  // downstream `@import "./sparkle-design.css"` silently drop in some
+  // PostCSS toolchains, which removes Sparkle tokens from the output.
+  // We now emit @import blocks first, then any @source directives.
   parts.push(COMMENTS.SPARKLE_IMPORT, IMPORTS.SPARKLE_DESIGN);
 
   // カスタムCSS import を sparkle-design.css の後に配置
@@ -111,6 +120,11 @@ function createSparkleImportBlock(sourcePackages = [], globalsPath = null, custo
     parts.push(customBlock);
   }
 
+  if (sourcePackages !== null && sourcePackages !== undefined) {
+    const nodeModulesRel = globalsPath ? resolveNodeModulesRelPath(globalsPath) : '../node_modules';
+    parts.push(createSourceBlock(sourcePackages, nodeModulesRel));
+  }
+
   parts.push('');
   return parts.join('\n');
 }

package/lib/setup.js

@@ -437,19 +437,23 @@ function runAssistantGuard(cwd, packageJsonPath, options, assistantConfig) {
   const instructionBlock = buildInstructionBlock(target, options.assistant);
   const instructionResult = updateInstructionFile(instructionPath, instructionBlock);
 
-  // --assistant claude の場合は CLAUDE.md に加えて AGENTS.md にも Guard を書く。
-  // create-next-app 等が生成する AGENTS.md に Next.js 固有指示が残っていて、
-  // CLAUDE.md から `@AGENTS.md` で import しているプロジェクトでは、Sparkle
-  // Design Guard が AGENTS.md 側に無いと import 経由で読ませる動線が切れる。
-  // 他の assistant は本来の AGENTS.md / .cursor/rules だけに書く。
-  // en: When --assistant=claude, also upsert Guard into AGENTS.md so projects
-  // that reference `@AGENTS.md` from CLAUDE.md (common Next.js setup) still
-  // propagate the Guard via that import path.
+  // --assistant claude のときに、プロジェクトルートに既存の AGENTS.md が
+  // 「すでにある」場合だけ Guard を追記する。create-next-app などが先行生成
+  // した AGENTS.md や、ユーザーが Codex/Gemini 併用のために置いているファイル
+  // には courtesy として Guard を載せる一方、存在しない AGENTS.md を
+  // Sparkle 側が勝手に作ることはしない（「指定していない AI 指示書が
+  // あったら書く」という緩い方針）。
+  // en: When --assistant=claude, also upsert Guard into AGENTS.md **only if
+  // the file already exists**. This covers projects where create-next-app or
+  // another tool shipped an AGENTS.md (or where the user keeps one for
+  // Codex/Gemini), without the CLI unilaterally creating a file the user
+  // didn't opt into.
   let agentsInstructionResult = null;
   let agentsInstructionPath = null;
   if (options.assistant === 'claude' && !options.instructionsPath) {
-    agentsInstructionPath = path.resolve(cwd, 'AGENTS.md');
-    if (agentsInstructionPath !== instructionPath) {
+    const candidate = path.resolve(cwd, 'AGENTS.md');
+    if (candidate !== instructionPath && fs.existsSync(candidate)) {
+      agentsInstructionPath = candidate;
       agentsInstructionResult = updateInstructionFile(agentsInstructionPath, instructionBlock);
     }
   }
@@ -478,51 +482,56 @@ function runAssistantGuard(cwd, packageJsonPath, options, assistantConfig) {
 }
 
 /**
- * .claude/settings.json に lint:sparkle を強制実行する Stop hook を追加する。
+ * Agent 別の hook 設定ファイルに「lint:sparkle を強制実行する」hook を追加する。
  *
- * 設計:
- * - Stop hook: Claude が応答を終えようとする直前に実行される hook。exit 2 を返すと
- *   停止がブロックされ、Claude が lint findings を修正してから停止する動線になる。
- *   `sparkle-design-cli check ... --strict || exit 2` で findings があれば exit 2。
- * - 既存の .claude/settings.json を破壊しないよう、現行の hooks.Stop 配列を残しつつ
- *   同一 command が無いときだけ append する（冪等）。
- * - project-shared な settings.json に書くのでチームメンバーにも共有される。
- *   user-local な settings.local.json ではなく settings.json を選ぶのは、これが
- *   全員に共通のガードレールであることを意図しているため。
+ * 各 agent が持つ hook システムの schema は異なるため、agent ごとに以下の
+ * ヘルパーを持つ。共通ポイントは:
+ *   - 実行コマンドは `npx --yes sparkle-design-cli check <target> --strict || exit 2`
+ *   - exit 2 にエスカレーションすることで、ブロック対応する agent では
+ *     応答終了を止めて findings 修正に向かわせる
+ *   - 既存の hook 設定ファイルは非破壊マージし、同一 command が含まれていれば skip
+ *     （冪等）
+ *   - 壊れた JSON は silent 上書きせず、ユーザーに修正を促すエラーを出す
  *
- * en: Write a Stop hook to `.claude/settings.json` that runs `lint:sparkle` and
- * exits with code 2 on findings, which blocks Claude Code from finishing the
- * turn until the linter passes. The existing file (including user-authored
- * hooks) is preserved by merging; we only append our entry if an identical
- * command is not already present.
+ * en: Install an agent-specific hook that runs `lint:sparkle --strict || exit 2`.
+ * Each agent ships its own hook config format; these helpers emit the right
+ * shape while preserving existing user content and staying idempotent on rerun.
+ *
+ * References (2026-04 時点):
+ *   - Claude Code : https://docs.claude.com/en/docs/claude-code/hooks
+ *   - Cursor      : https://cursor.com/docs/hooks
+ *   - Codex       : https://developers.openai.com/codex/hooks
  */
-function runClaudeHook(cwd, target, dryRun) {
-  const settingsPath = path.resolve(cwd, '.claude/settings.json');
-  const managedCommand = `npx --yes sparkle-design-cli check ${target} --strict || exit 2`;
-
-  let settings = {};
-  let existed = false;
-  if (fs.existsSync(settingsPath)) {
-    existed = true;
-    try {
-      settings = readJson(settingsPath);
-    } catch (error) {
-      // 壊れた JSON を黙って上書きしないようユーザーに明示的に判断を求める。
-      // en: Refuse to overwrite a broken settings.json silently.
-      throw new Error(
-        `.claude/settings.json が不正な JSON です (${error.message})。修正してから再実行してください。`
-      );
-    }
+function buildManagedHookCommand(target) {
+  return `npx --yes sparkle-design-cli check ${target} --strict || exit 2`;
+}
+
+function loadHookJson(filePath, label) {
+  if (!fs.existsSync(filePath)) {
+    return { existed: false, config: null };
+  }
+  try {
+    return { existed: true, config: readJson(filePath) };
+  } catch (error) {
+    throw new Error(
+      `${label} が不正な JSON です (${error.message})。修正してから再実行してください。`
+    );
   }
+}
 
-  const nextSettings = typeof settings === 'object' && settings ? { ...settings } : {};
-  const hooks = typeof nextSettings.hooks === 'object' && nextSettings.hooks
-    ? { ...nextSettings.hooks }
-    : {};
+function runClaudeHook(cwd, target, dryRun) {
+  const settingsPath = path.resolve(cwd, '.claude/settings.json');
+  const managedCommand = buildManagedHookCommand(target);
+  const { existed, config } = loadHookJson(settingsPath, '.claude/settings.json');
+
+  const nextSettings =
+    typeof config === 'object' && config ? { ...config } : {};
+  const hooks =
+    typeof nextSettings.hooks === 'object' && nextSettings.hooks
+      ? { ...nextSettings.hooks }
+      : {};
   const stopGroups = Array.isArray(hooks.Stop) ? [...hooks.Stop] : [];
 
-  // 既存の Stop hook 配列に同一 command が含まれていれば冪等にスキップ。
-  // en: Skip if the managed command already appears in any Stop entry.
   const alreadyPresent = stopGroups.some(
     (group) =>
       Array.isArray(group?.hooks) &&
@@ -531,21 +540,17 @@ function runClaudeHook(cwd, target, dryRun) {
 
   if (alreadyPresent) {
     return {
+      assistant: 'claude',
       changed: false,
       existed,
-      settingsPath,
+      path: settingsPath,
       reason: 'already-present',
       command: managedCommand,
     };
   }
 
   stopGroups.push({
-    hooks: [
-      {
-        type: 'command',
-        command: managedCommand,
-      },
-    ],
+    hooks: [{ type: 'command', command: managedCommand }],
   });
   hooks.Stop = stopGroups;
   nextSettings.hooks = hooks;
@@ -556,14 +561,137 @@ function runClaudeHook(cwd, target, dryRun) {
   }
 
   return {
+    assistant: 'claude',
     changed: true,
     existed,
-    settingsPath,
+    path: settingsPath,
     reason: existed ? 'appended' : 'created',
     command: managedCommand,
   };
 }
 
+/**
+ * Cursor 1.7+ の hook 設定（`.cursor/hooks.json`）に stop hook を追加する。
+ * schema: `{ version: 1, hooks: { stop: [{ command: "..." }] } }`
+ */
+function runCursorHook(cwd, target, dryRun) {
+  const hooksPath = path.resolve(cwd, '.cursor/hooks.json');
+  const managedCommand = buildManagedHookCommand(target);
+  const { existed, config } = loadHookJson(hooksPath, '.cursor/hooks.json');
+
+  const nextConfig = typeof config === 'object' && config ? { ...config } : {};
+  if (!nextConfig.version) nextConfig.version = 1;
+  const hooks =
+    typeof nextConfig.hooks === 'object' && nextConfig.hooks ? { ...nextConfig.hooks } : {};
+  const stopEntries = Array.isArray(hooks.stop) ? [...hooks.stop] : [];
+
+  const alreadyPresent = stopEntries.some((entry) => entry?.command === managedCommand);
+  if (alreadyPresent) {
+    return {
+      assistant: 'cursor',
+      changed: false,
+      existed,
+      path: hooksPath,
+      reason: 'already-present',
+      command: managedCommand,
+    };
+  }
+
+  stopEntries.push({ command: managedCommand });
+  hooks.stop = stopEntries;
+  nextConfig.hooks = hooks;
+
+  if (!dryRun) {
+    ensureDir(hooksPath);
+    writeJson(hooksPath, nextConfig);
+  }
+
+  return {
+    assistant: 'cursor',
+    changed: true,
+    existed,
+    path: hooksPath,
+    reason: existed ? 'appended' : 'created',
+    command: managedCommand,
+  };
+}
+
+/**
+ * Codex の hook 設定（`.codex/hooks.json`）に Stop hook を追加する。
+ * schema は Claude とほぼ同じネスト構造。
+ * 有効化には `~/.codex/config.toml` に `[features] codex_hooks = true` が必要。
+ */
+function runCodexHook(cwd, target, dryRun) {
+  const hooksPath = path.resolve(cwd, '.codex/hooks.json');
+  const managedCommand = buildManagedHookCommand(target);
+  const { existed, config } = loadHookJson(hooksPath, '.codex/hooks.json');
+
+  const nextConfig = typeof config === 'object' && config ? { ...config } : {};
+  const hooks =
+    typeof nextConfig.hooks === 'object' && nextConfig.hooks ? { ...nextConfig.hooks } : {};
+  const stopGroups = Array.isArray(hooks.Stop) ? [...hooks.Stop] : [];
+
+  const alreadyPresent = stopGroups.some(
+    (group) =>
+      Array.isArray(group?.hooks) &&
+      group.hooks.some((entry) => entry?.type === 'command' && entry?.command === managedCommand)
+  );
+
+  if (alreadyPresent) {
+    return {
+      assistant: 'codex',
+      changed: false,
+      existed,
+      path: hooksPath,
+      reason: 'already-present',
+      command: managedCommand,
+      // 有効化にはユーザー側の opt-in が必要な旨を summary に載せる。
+      // en: Codex hooks are behind an opt-in feature flag; surface that in summary.
+      featureFlagNote:
+        'Codex で有効化するには `~/.codex/config.toml` に `[features]` セクションを作り `codex_hooks = true` を設定してください。',
+    };
+  }
+
+  stopGroups.push({
+    hooks: [{ type: 'command', command: managedCommand }],
+  });
+  hooks.Stop = stopGroups;
+  nextConfig.hooks = hooks;
+
+  if (!dryRun) {
+    ensureDir(hooksPath);
+    writeJson(hooksPath, nextConfig);
+  }
+
+  return {
+    assistant: 'codex',
+    changed: true,
+    existed,
+    path: hooksPath,
+    reason: existed ? 'appended' : 'created',
+    command: managedCommand,
+    featureFlagNote:
+      'Codex で有効化するには `~/.codex/config.toml` に `[features]` セクションを作り `codex_hooks = true` を設定してください。',
+  };
+}
+
+/**
+ * --assistant 値から該当 hook writer に dispatch する。generic は hook なし。
+ * en: Dispatch to the appropriate hook writer for the selected assistant.
+ */
+function runAssistantHook(assistant, cwd, target, dryRun) {
+  switch (assistant) {
+    case 'claude':
+      return runClaudeHook(cwd, target, dryRun);
+    case 'cursor':
+      return runCursorHook(cwd, target, dryRun);
+    case 'codex':
+      return runCodexHook(cwd, target, dryRun);
+    default:
+      return null;
+  }
+}
+
 function runGenerate({ skipGenerate, dryRun, strict }) {
   // --skip-generate / --dry-run と --strict が同時指定された場合、strict チェックを
   // 走らせる対象 (generate) そのものがスキップされるため strict は事実上無意味。
@@ -619,12 +747,13 @@ export function setupAssistant(options = {}) {
     { ...options, assistant, dryRun },
     assistantConfig
   );
-  // --assistant claude のみ .claude/settings.json に Stop hook を自動設定する。
-  // これで lint:sparkle の実行が instruction 頼りではなく hook で強制される。
-  // en: For --assistant=claude, install a Stop hook in .claude/settings.json
-  // so lint:sparkle becomes a hard gate instead of a soft instruction.
-  const claudeHook =
-    assistant === 'claude' ? runClaudeHook(cwd, guard.target, dryRun) : null;
+  // assistant 別に hook 設定ファイル（`.claude/settings.json` /
+  // `.cursor/hooks.json` / `.codex/hooks.json`）に `lint:sparkle --strict` を
+  // 走らせる stop / Stop hook を自動設定する。instruction 頼みではなく hook
+  // で強制することで lint:sparkle の実行漏れを防ぐ。generic は hook なし。
+  // en: For supported assistants, install a stop hook so `lint:sparkle --strict`
+  // becomes a hard gate. Generic assistant has no hook target.
+  const hook = runAssistantHook(assistant, cwd, guard.target, dryRun);
   const generate = runGenerate({
     skipGenerate: Boolean(options.skipGenerate),
     dryRun,
@@ -662,12 +791,14 @@ export function setupAssistant(options = {}) {
           existed: guard.agentsInstructionResult?.existed ?? false,
         }
       : null,
-    claudeHook: claudeHook
+    hook: hook
       ? {
-          path: path.relative(cwd, claudeHook.settingsPath),
-          changed: claudeHook.changed,
-          existed: claudeHook.existed,
-          reason: claudeHook.reason,
+          assistant: hook.assistant,
+          path: path.relative(cwd, hook.path),
+          changed: hook.changed,
+          existed: hook.existed,
+          reason: hook.reason,
+          featureFlagNote: hook.featureFlagNote ?? null,
         }
       : null,
   };
@@ -677,7 +808,7 @@ export function setupAssistant(options = {}) {
   // セットアップ後のリマインダー。AI の会話履歴にも残るよう stderr に出す。
   // en: Post-setup reminder. Written to stderr so it stays in the AI transcript
   // without polluting the JSON stdout payload that tooling parses.
-  printPostSetupReminder(guard.target, packageManager, { claudeHook });
+  printPostSetupReminder(guard.target, packageManager, { hook });
 
   return summary;
 }
@@ -699,7 +830,13 @@ function buildLintCommand(packageManager) {
   }
 }
 
-function printPostSetupReminder(target, packageManager, { claudeHook } = {}) {
+const HOOK_LABELS = {
+  claude: { name: 'Claude Code', file: '.claude/settings.json', event: 'Stop' },
+  cursor: { name: 'Cursor', file: '.cursor/hooks.json', event: 'stop' },
+  codex: { name: 'Codex', file: '.codex/hooks.json', event: 'Stop' },
+};
+
+function printPostSetupReminder(target, packageManager, { hook } = {}) {
   const lintTarget = target || 'src';
   const lintCmd = buildLintCommand(packageManager);
   const lines = [
@@ -712,17 +849,21 @@ function printPostSetupReminder(target, packageManager, { claudeHook } = {}) {
     '  3. AI でレビューする場合は `lint:sparkle:json` を使い、`findings` に加えて `manualReviewReminders` の各項目まで必ず確認してください。',
     '     For AI review, use `lint:sparkle:json` and inspect every entry of both `findings` and `manualReviewReminders`.',
   ];
-  if (claudeHook?.changed || claudeHook?.reason === 'already-present') {
+  if (hook && (hook.changed || hook.reason === 'already-present')) {
+    const meta = HOOK_LABELS[hook.assistant] ?? HOOK_LABELS.claude;
     const label =
-      claudeHook.reason === 'already-present'
+      hook.reason === 'already-present'
         ? '（既存のまま）'
-        : claudeHook.reason === 'created'
+        : hook.reason === 'created'
           ? '（新規作成）'
           : '（既存設定に追記）';
     lines.push(
-      `  4. Claude Code の Stop hook を .claude/settings.json に設定しました ${label}。Claude が応答を終える直前に \`lint:sparkle --strict\` が走り、findings があれば exit 2 で停止がブロックされます。`,
-      '     Installed a Claude Code Stop hook in .claude/settings.json: `lint:sparkle --strict` runs before each turn ends and exit 2 blocks the stop until findings are resolved.'
+      `  4. ${meta.name} の ${meta.event} hook を ${meta.file} に設定しました ${label}。応答を終える直前に \`lint:sparkle --strict\` が走り、findings があれば exit 2 で停止がブロックされます。`,
+      `     Installed a ${meta.name} ${meta.event} hook in ${meta.file}: it runs \`lint:sparkle --strict\` before the turn ends and exits with code 2 when findings exist.`
     );
+    if (hook.featureFlagNote) {
+      lines.push(`     ⚠️  ${hook.featureFlagNote}`);
+    }
   }
   lines.push('');
   for (const line of lines) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sparkle-design-cli",
-  "version": "2.0.7-beta.6",
+  "version": "2.0.7-beta.7",
   "description": "Sparkle Design CSS Generator - デザインシステムCSSを設定ファイルから生成するツール",
   "publishConfig": {
     "registry": "https://registry.npmjs.org",