@godxjp/ui 20.0.0 → 20.2.0

package/docs/navigation/tabs.tsx

@@ -46,6 +46,17 @@ const journalItems = [
 
 export default function Demo() {
   const [activeTab, setActiveTab] = useState("pending");
+  const [editableTabs, setEditableTabs] = useState([
+    { value: "je-0042", label: "JE-0042", content: <Text as="p">売上計上 ¥480,000</Text> },
+    { value: "je-0043", label: "JE-0043", content: <Text as="p">仕入計上 ¥120,000</Text> },
+    {
+      value: "je-0040",
+      label: "JE-0040 (固定)",
+      content: <Text as="p">給与支払 ¥2,800,000</Text>,
+      closable: false,
+    },
+  ]);
+  const [editableTab, setEditableTab] = useState("je-0042");
 
   return (
     <PageContainer
@@ -106,7 +117,7 @@ export default function Demo() {
             <CardTitle level={2}>320px stress · 長いローカライズラベル</CardTitle>
             <CardDescription>
               狭いコンテナでも長いラベルはクリップされず、水平タブリストが自身でスクロールする
-              。compact navigation への変換は Tabs API に存在しないため擬似実装しない —
+              。compact navigation への変換は Tabs API に存在しないため擬似実装しない ·
               スクロールが意図した縮退動作。
             </CardDescription>
           </CardHeader>
@@ -308,6 +319,91 @@ export default function Demo() {
             </Flex>
           </CardContent>
         </Card>
+
+        {/* Ant Design parity surface — editable-card + extra + centered + placement + size */}
+        <Card>
+          <CardHeader>
+            <CardTitle level={2}>Editable card · onEdit / extra / hideAdd</CardTitle>
+            <CardDescription>
+              variant=&quot;editable-card&quot; は Ant Design の editable-card。タブ内の ×
+              はポインタ用ショートカット(aria-hidden)で、キーボードでは Delete /
+              Backspace(aria-keyshortcuts)。追加ボタンは tablist の外にある本物の button。extra は
+              antd の tabBarExtraContent を論理軸(start / end)にしたもの。
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <Tabs
+              id="antd-editable-card"
+              variant="editable-card"
+              value={editableTab}
+              onValueChange={setEditableTab}
+              onEdit={(target, action) => {
+                if (action === "add") {
+                  const next = `tab-${editableTabs.length + 1}`;
+                  setEditableTabs([
+                    ...editableTabs,
+                    {
+                      value: next,
+                      label: `新規 ${editableTabs.length + 1}`,
+                      content: <Text as="p">新規タブ {next}</Text>,
+                    },
+                  ]);
+                  setEditableTab(next);
+                  return;
+                }
+                const rest = editableTabs.filter((item) => item.value !== target);
+                setEditableTabs(rest);
+                if (target === editableTab && rest[0]) setEditableTab(rest[0].value);
+              }}
+              extra={{
+                end: (
+                  <Button size="sm" variant="outline">
+                    一括操作
+                  </Button>
+                ),
+              }}
+              items={editableTabs}
+            />
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <CardTitle level={2}>tabPlacement · size · centered</CardTitle>
+            <CardDescription>
+              tabPlacement は antd 6.6.2 の名前で、値は論理軸(top / bottom / start / end)。start /
+              end は tablist を縦方向のロービングフォーカスに切り替える。size はライブラリの control
+              band(sm / md / lg)に対応。
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <Flex direction="col" gap="lg">
+              <Tabs
+                id="antd-centered"
+                defaultValue="pending"
+                variant="line"
+                centered
+                items={journalItems}
+              />
+              <Tabs
+                id="antd-bottom"
+                defaultValue="pending"
+                variant="card"
+                tabPlacement="bottom"
+                size="sm"
+                items={journalItems}
+              />
+              <Tabs
+                id="antd-start"
+                defaultValue="pending"
+                variant="line"
+                tabPlacement="start"
+                size="lg"
+                items={journalItems}
+              />
+            </Flex>
+          </CardContent>
+        </Card>
       </Flex>
     </PageContainer>
   );

package/docs/query/button-refetch.tsx

@@ -81,6 +81,7 @@ function VariantBlock() {
           <ButtonRefetch query={query} variant="ghost" label="ghost" />
           <ButtonRefetch query={query} variant="destructive" label="destructive" />
           <ButtonRefetch query={query} variant="link" label="link" />
+          <ButtonRefetch query={query} variant="bare" label="bare" />
         </Flex>
       </CardContent>
     </Card>

package/docs/showcase/settings-security-mfa.tsx

@@ -78,7 +78,7 @@ export default function SecurityMfaShowcase() {
           </CardHeader>
           <CardContent flush>
             <ListRow
-              leading={<Mail aria-hidden="true" className="size-4" />}
+              leading={<Mail aria-hidden="true" />}
               title="OTP qua email"
               description="Gửi mã tới t•••@famgia.com"
               trailing={
@@ -91,7 +91,7 @@ export default function SecurityMfaShowcase() {
               }
             />
             <ListRow
-              leading={<Smartphone aria-hidden="true" className="size-4" />}
+              leading={<Smartphone aria-hidden="true" />}
               title="Ứng dụng xác thực"
               description="Chưa thiết lập"
               trailing={
@@ -101,7 +101,7 @@ export default function SecurityMfaShowcase() {
               }
             />
             <ListRow
-              leading={<KeyRound aria-hidden="true" className="size-4" />}
+              leading={<KeyRound aria-hidden="true" />}
               title="Passkey"
               description="1 thiết bị · MacBook Pro"
               trailing={

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@godxjp/ui",
-  "version": "20.0.0",
-  "godxUiMcp": "20.0.0",
+  "version": "20.2.0",
+  "godxUiMcp": "20.2.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -85,6 +85,22 @@
       "types": "./dist/components/charts/compact-bar-trend.d.ts",
       "import": "./dist/components/charts/compact-bar-trend.js"
     },
+    "./charts/line-chart": {
+      "types": "./dist/components/charts/line-chart.d.ts",
+      "import": "./dist/components/charts/line-chart.js"
+    },
+    "./charts/bar-chart": {
+      "types": "./dist/components/charts/bar-chart.d.ts",
+      "import": "./dist/components/charts/bar-chart.js"
+    },
+    "./charts/area-chart": {
+      "types": "./dist/components/charts/area-chart.d.ts",
+      "import": "./dist/components/charts/area-chart.js"
+    },
+    "./charts/pie-chart": {
+      "types": "./dist/components/charts/pie-chart.d.ts",
+      "import": "./dist/components/charts/pie-chart.js"
+    },
     "./ui": {
       "types": "./dist/components/ui/index.d.ts",
       "import": "./dist/components/ui/index.js"
@@ -316,6 +332,7 @@
     "test:visual:auth-registration": "node scripts/auth-shell-registration-visual.mjs",
     "test:visual:topbar-collision": "node scripts/topbar-collision-visual.mjs",
     "test:visual:table-collection-cjk": "node scripts/table-collection-cjk-visual.mjs",
+    "test:visual:chart-cjk-axis": "node scripts/chart-cjk-axis-visual.mjs",
     "test:watch": "vitest",
     "test:coverage": "vitest run --coverage",
     "check:example-imports": "node scripts/check-example-imports.mjs",
@@ -340,8 +357,8 @@
     "verify": "pnpm typecheck && pnpm lint && pnpm format && pnpm build && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:frame-coverage && pnpm test",
     "verify:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:token-scale-bypass && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:mcp-prop-sync && pnpm check:contrast && pnpm check:visual-audit && pnpm test",
     "verify:ci": "pnpm verify:ci:static && pnpm check:frame-contracts && pnpm test",
-    "verify:ci:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:registry && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:no-antd-runtime && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:gate-coverage && pnpm check:mcp-prop-sync",
-    "verify:browser": "pnpm check:contrast && pnpm check:visual-audit",
+    "verify:ci:static": "pnpm build && pnpm check:packed-public-contract && pnpm typecheck && pnpm typecheck:docs && pnpm lint && pnpm preview:build && pnpm check:registry && pnpm check:example-imports && pnpm check:core-isolation && pnpm check:no-consumer-coupling && pnpm check:use-client && pnpm check:prop-vocabulary && pnpm check:token-tiers && pnpm check:no-external-assets && pnpm check:token-scale-bypass && pnpm check:no-antd-runtime && pnpm check:dist-tokens-resolve && pnpm check:no-hardcoded-geometry && pnpm check:no-hardcoded-css-values && pnpm check:no-inline-magic-numbers && pnpm check:no-tailwind-class-assertions && pnpm check:control-sizing && pnpm check:rtl && pnpm check:typography && pnpm check:mcp-lockstep && pnpm check:mcp-sync && pnpm check:doc-prop-existence && pnpm check:mcp-catalog-coverage && pnpm check:mcp-orphans && pnpm check:mcp-pattern-imports && pnpm check:audit-sync && pnpm check:gate-coverage && pnpm check:mcp-prop-sync && pnpm check:catalog-contradictions",
+    "verify:browser": "pnpm check:contrast && pnpm check:text-ink-clip && pnpm check:visual-audit",
     "verify:release": "pnpm verify:static && pnpm check:frame-contracts && pnpm check:frame-coverage && pnpm check:frame-axe",
     "verify:publish-tree": "pnpm build && pnpm check:packed-public-contract && pnpm check:use-client && pnpm check:dist-tokens-resolve",
     "check:release-plan": "node scripts/check-release-command-plan.mjs",
@@ -351,6 +368,7 @@
     "check:mcp-sync": "node scripts/check-mcp-sync.mjs",
     "check:mcp-catalog-coverage": "node scripts/check-mcp-catalog-coverage.mjs",
     "check:mcp-orphans": "node scripts/check-mcp-orphans.mjs",
+    "check:catalog-contradictions": "node scripts/check-catalog-contradictions.mjs",
     "check:mcp-prop-sync": "node scripts/check-mcp-prop-sync.mjs",
     "check:doc-prop-existence": "node scripts/check-doc-prop-existence.mjs",
     "gen:component-api-manifest": "node scripts/gen-component-api-manifest.mjs",
@@ -387,6 +405,7 @@
     "check:audit-sync": "node scripts/check-audit-sync.mjs",
     "check:gate-coverage": "node scripts/check-gate-coverage.mjs",
     "check:contrast": "node scripts/check-contrast.mjs",
+    "check:text-ink-clip": "node scripts/check-text-ink-clip.mjs",
     "visual-audit": "node scripts/visual-audit.mjs",
     "check:visual-audit": "node scripts/visual-audit-smoke.mjs",
     "check:frame-axe": "node scripts/check-frame-axe.mjs",
@@ -466,6 +485,7 @@
     "react-aria-components": "^1.21.1",
     "react-day-picker": "^10.0.1",
     "react-resizable-panels": "^4.12.3",
+    "react-stately": "3.50.0",
     "sonner": "^2.0.8",
     "tailwind-merge": "^3.5.0",
     "tailwindcss-animate": "^1.0.7",

package/scripts/_agent-setup.mjs

@@ -74,8 +74,21 @@ or change a component, page, or form — no exceptions.
   \`rounded border\` div. Text is \`<Text tone size weight truncate>\`, never utility classes.
 
 ## Before writing UI
-1. **MCP-first.** Consult the godx-ui MCP: \`get_component <Name>\`, \`search_components\`,
-   \`list_audit_rules\`, \`list_visual_checks\`. Never guess a prop; never hand-roll what a
+1. **DISCOVERY BEFORE LOOKUP — in this order, every time.**
+   1. \`search_components "<the area you are about to build>"\` FIRST. This is the only call that
+      answers "what already exists here". Ask it before the first line of JSX, not after.
+   2. \`get_component <Name>\` second, once you know the name.
+   \`get_component\` answers "how do I use X" and is USELESS for finding X — you can only look up a
+   name you already have. Skipping step 1 is how a consumer hand-rolled an organization switcher
+   the package ships (\`OrgSwitcher\`) and built three topbar cells out of Buttons instead of
+   \`TopbarItem\`: both were one \`search_components\` call away, and neither was ever searched for.
+   **Existing code in this repo is NOT the authority.** Reading a neighbouring file and copying it
+   is the most common way this rule gets skipped — measured: of four fresh agents given a vague UI
+   task, all four answered correctly but two never called the MCP at all, saying the answer was
+   already in the code. They were only right because that code had just been fixed; a week earlier
+   the same files hand-rolled a switcher and put Buttons in topbar slots, and both agents would
+   have copied it. Search the catalog even when a local file looks like it already answers you.
+   Also \`list_audit_rules\`, \`list_visual_checks\`. Never guess a prop; never hand-roll what a
    primitive already does.
 2. **Real primitives only.** No raw \`<input>/<select>/<button>/<textarea>/<table>\`, no
    styled-div fakes. A labelled control ALWAYS goes in \`<FormField label=…>\` (it owns the
@@ -105,8 +118,21 @@ This app uses @godxjp/ui. EVERY time you build or change UI:
    \`PageContainer\`; siblings go in \`<Flex direction="col" gap>\` / \`<ResponsiveGrid>\`; no
    \`flex\`/\`grid\`/\`gap-*\`/\`p-*\`/\`m-*\` on your own elements; boxes are \`Card\`/\`Badge\`/
    \`ListRow\`/\`Descriptions\`, never a \`rounded border\` div; text is \`<Text tone size weight>\`.
-1. **MCP-first.** Consult the \`godx-ui\` MCP — \`get_component\`, \`search_components\`,
-   \`list_audit_rules\`, \`list_visual_checks\`. Never guess a prop; never hand-roll what a
+1. **DISCOVERY BEFORE LOOKUP — in this order, every time.**
+   1. \`search_components "<the area you are about to build>"\` FIRST. This is the only call that
+      answers "what already exists here". Ask it before the first line of JSX, not after.
+   2. \`get_component <Name>\` second, once you know the name.
+   \`get_component\` answers "how do I use X" and is USELESS for finding X — you can only look up a
+   name you already have. Skipping step 1 is how a consumer hand-rolled an organization switcher
+   the package ships (\`OrgSwitcher\`) and built three topbar cells out of Buttons instead of
+   \`TopbarItem\`: both were one \`search_components\` call away, and neither was ever searched for.
+   **Existing code in this repo is NOT the authority.** Reading a neighbouring file and copying it
+   is the most common way this rule gets skipped — measured: of four fresh agents given a vague UI
+   task, all four answered correctly but two never called the MCP at all, saying the answer was
+   already in the code. They were only right because that code had just been fixed; a week earlier
+   the same files hand-rolled a switcher and put Buttons in topbar slots, and both agents would
+   have copied it. Search the catalog even when a local file looks like it already answers you.
+   Also \`list_audit_rules\`, \`list_visual_checks\`. Never guess a prop; never hand-roll what a
    primitive already does.
 2. **Real primitives only.** No raw \`<input>/<select>/<button>/<textarea>/<table>\`. A labelled
    control ALWAYS goes in \`<FormField label=…>\` — never a bare \`<Label>\`+\`<Input>\`. Semantic
@@ -192,10 +218,13 @@ export function writeWorkflowMd(root) {
   const path = join(root, ".claude", "godxjp-ui-workflow.md");
   mkdirSync(dirname(path), { recursive: true });
   // This file is owned entirely by the package — the CLAUDE.md block tells the consumer to edit
-  // it, but nothing else reads from it, so a stale copy is pure loss. Rewrite when the stamp moves.
+  // it, but nothing else reads from it, so a stale copy is pure loss. It is package-owned end to
+  // end, so the comparison is the BODY: a version check froze every consumer whose stamp already
+  // matched, which meant guidance edited between releases reached nobody while still reading as
+  // current. Same defect as ensureClaudeMd carried, same fix.
   if (existsSync(path)) {
     const cur = readFileSync(path, "utf8");
-    if (stampedVersion(cur) === KIT_VERSION) return false;
+    if (cur.trim() === WORKFLOW_MD.trim()) return false;
     writeFileSync(path, WORKFLOW_MD);
     return "refreshed";
   }
@@ -207,13 +236,34 @@ export function writeWorkflowMd(root) {
  * Append the godxjp-ui mandate to the consumer's CLAUDE.md (created if absent). Idempotent via the
  * markers.
  */
+
+/**
+ * Is the managed region in `existing` already byte-identical to what we would write?
+ *
+ * Digest first (cheap, and survives whitespace-only rewrites of the surrounding file). When the
+ * stamp predates digest stamping there is nothing to compare, so fall back to the region body
+ * itself rather than assuming current — assuming current is the bug this replaced.
+ */
+function blockIsCurrent(existing, block) {
+  const wanted = stampedDigest(block);
+  const have = stampedDigest(existing);
+  if (wanted && have) return wanted === have;
+  const region = (text) => text.slice(text.indexOf("<!-- godxjp-ui:start"), text.indexOf("<!-- godxjp-ui:end -->"));
+  return region(existing).trim() === region(block).trim();
+}
+
 export function ensureClaudeMd(root) {
   const path = join(root, "CLAUDE.md");
   const existing = existsSync(path) ? readFileSync(path, "utf8") : null;
   if (existing?.includes("godxjp-ui:start")) {
     // Present — but at WHICH version? Refresh only the delimited block; anything the consumer
     // wrote around it is untouched.
-    if (stampedVersion(existing) === KIT_VERSION) return "present";
+    // Compare the DIGEST, not the version — which is what the note above already promised and
+    // what this line did not do. Guidance is edited far more often than the package version moves,
+    // so a version check freezes every consumer whose stamp already matches: a rewritten mandate
+    // reached nobody, and the block still read as current. A file written before digest stamping
+    // has no digest at all, so fall back to comparing the rendered body.
+    if (blockIsCurrent(existing, CLAUDE_MD_BLOCK)) return "present";
     writeFileSync(
       path,
       refreshBlock(existing, CLAUDE_MD_BLOCK, "<!-- godxjp-ui:start", "<!-- godxjp-ui:end -->"),
@@ -255,17 +305,34 @@ export function refreshGuineaPigSkill(root) {
   const target = join(dir, "SKILL.md");
   const optin = join(dir, ".guinea-pig-optin");
   if (!existsSync(optin) || !existsSync(target)) return false;
-  if (readFileSync(optin, "utf8").trim() === KIT_VERSION) return false;
 
   const base = readFileSync(join(SELF_ROOT, "scripts", "guinea-pig-skill.md"), "utf8");
+  /*
+   * The marker tracks the BASE TEXT, not the release — the same correction the consumer rule file
+   * needed, for the same reason. A version marker means editing this skill without cutting a
+   * release reaches nobody, and the skill is edited far more often than the version moves. The
+   * digest covers only the base: everything from the `# 8.` marker down belongs to the repo and
+   * must not make the package's own content look changed.
+   *
+   * `<version>:<digest>` rather than a bare digest, so the file still says which release wrote it
+   * to anyone reading it. Only the digest half is compared.
+   */
+  const stamp = `${KIT_VERSION}:${digestOf(base)}`;
+  if (readFileSync(optin, "utf8").trim().split(":").pop() === digestOf(base)) return false;
+
   const current = readFileSync(target, "utf8");
   const marker = "\n---\n\n# 8. ";
   const i = current.indexOf(marker);
   writeFileSync(target, base.replace(/\s*$/, "") + "\n" + (i < 0 ? "" : current.slice(i)));
-  writeFileSync(optin, `${KIT_VERSION}\n`);
+  writeFileSync(optin, `${stamp}\n`);
   return true;
 }
 
+/** The stamp `init-guinea-pig` writes on a fresh install, so the first refresh is a no-op. */
+export function guineaPigStamp() {
+  return `${KIT_VERSION}:${digestOf(readFileSync(join(SELF_ROOT, "scripts", "guinea-pig-skill.md"), "utf8"))}`;
+}
+
 /**
  * Install the common consumer rules as a PATH-TRIGGERED file, and wire them into `.ai/rules`.
  *

package/scripts/init-guinea-pig.mjs

@@ -11,7 +11,7 @@ import { copyFileSync, existsSync, mkdirSync, writeFileSync } from "node:fs";
 import { dirname, join } from "node:path";
 import { fileURLToPath } from "node:url";
 
-import { KIT_VERSION, shouldSkip } from "./_agent-setup.mjs";
+import { KIT_VERSION, guineaPigStamp, shouldSkip } from "./_agent-setup.mjs";
 
 const root = process.env.INIT_CWD || process.cwd();
 const skip = shouldSkip(root);
@@ -28,10 +28,32 @@ if (skip === "no-package") {
 const source = join(dirname(fileURLToPath(import.meta.url)), "guinea-pig-skill.md");
 const target = join(root, ".claude", "skills", "godx-ui-guinea-pig", "SKILL.md");
 
+const optin = join(dirname(target), ".guinea-pig-optin");
+
 if (existsSync(target)) {
-  console.log(`  guinea-pig skill already present:\n    ${target}`);
+  /*
+   * PRESENT IS NOT THE SAME AS OPTED IN, and this used to exit here regardless — printing "its
+   * BASE sections now refresh on `npm update`" at a repo where they never would.
+   *
+   * `refreshGuineaPigSkill` keys entirely off the marker: no marker, no refresh, ever, and no
+   * report of it either. Measured across the three guinea pigs: one carried the marker and kept
+   * up; two had SKILL.md copied by an older path and had been reading whatever guidance was
+   * current the day it landed. Re-running is exactly how someone would try to fix that, so
+   * re-running has to actually fix it.
+   */
+  if (!existsSync(optin)) {
+    writeFileSync(optin, `${guineaPigStamp()}\n`);
+    console.log(`
+  guinea-pig skill was present but NOT opted in — its base sections would never have refreshed.
+  Marker written; it now tracks @godxjp/ui@${KIT_VERSION}:
+    • ${target}
+`);
+    process.exit(0);
+  }
+
+  console.log(`  guinea-pig skill already present and opted in:\n    ${target}`);
   console.log(
-    "\n  Its BASE sections now refresh on `npm update @godxjp/ui`; anything you appended below\n" +
+    "\n  Its BASE sections refresh on `npm update @godxjp/ui`; anything you appended below\n" +
       "  the `# 8.` marker is preserved. Re-running this command changes nothing.\n",
   );
   process.exit(0);
@@ -48,7 +70,7 @@ copyFileSync(source, target);
  * exact staleness this whole change exists to remove. The marker lives next to the skill rather
  * than in package.json so it travels with the thing it describes.
  */
-writeFileSync(join(dirname(target), ".guinea-pig-optin"), `${KIT_VERSION}\n`);
+writeFileSync(optin, `${guineaPigStamp()}\n`);
 
 console.log(`
   guinea-pig skill installed: