Fix skills.json determinism (CI blocker) and upgrade the playground

The check-generated CI step was failing with "web/skills.json is stale"
because build-skills.mjs stamped a wall-clock generatedAt into the file, so
every rebuild differed and git diff --exit-code never matched.

- web/build-skills.mjs: drop the unused generatedAt timestamp -> deterministic
  output the CI staleness check can verify. Also tags each skill with its tier.
- skill-tiers.json: single machine-readable source for tier membership
  (Production-Ready / Experimental); TIERS.md points to it.

Playground upgrades (hosted on GitHub Pages):
- Tier filter (Production-Ready / Stable / Experimental) + per-tile tier badges.
- "Use this skill in another tool" panel: copy the instructions formatted for
  ChatGPT, Gemini, or raw — mirrors the generated exports/ files.
- web/README documents the new options and the deterministic build.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016JWn5jRD5tcEFKrubjQ6Px
This commit is contained in:
Claude
2026-06-17 08:16:46 +00:00
parent 46f5d939de
commit 69d4fab0b3
9 changed files with 158 additions and 5 deletions
+18
View File
@@ -39,6 +39,12 @@
<div class="controls" id="controls">
<input id="search" type="search" placeholder="Search skills…" />
<select id="pluginFilter"><option value="">All bundles</option></select>
<select id="tierFilter" title="Maturity tier">
<option value="">All tiers</option>
<option value="production">🟢 Production-Ready</option>
<option value="stable">🔵 Stable</option>
<option value="experimental">🟡 Experimental</option>
</select>
<span id="count" class="count"></span>
</div>
@@ -52,10 +58,22 @@
<div class="skill-head">
<span class="bundle-tag" id="skillBundle"></span>
<span class="tier-tag" id="skillTier"></span>
<h2 id="skillTitle"></h2>
<p id="skillDesc" class="skill-desc"></p>
</div>
<details class="elsewhere" id="elsewhere">
<summary>Use this skill in another tool ↗</summary>
<p class="elsewhere-note">These skills aren't locked to Claude. Copy the ready-made instructions into another assistant — you keep the full framework, you just paste it once.</p>
<div class="elsewhere-actions">
<button id="copyChatgpt" class="ghost" type="button">Copy for ChatGPT</button>
<button id="copyGemini" class="ghost" type="button">Copy for Gemini</button>
<button id="copyClaude" class="ghost" type="button">Copy raw instructions</button>
<span id="copyMsg" class="copy-msg"></span>
</div>
</details>
<form id="inputForm" class="input-form"></form>
<div class="actions">