thkt/use-workflow-plan-preview
skills/use-workflow-plan-preview/SKILL.md
Internal helper for /think Step 11. Renders SOW.md + Spec.md as an integrated Astro view and returns a dev server URL.
$ install --global
skillsauthnpx skillsauth add thkt/claude-config use-workflow-plan-previewInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Jul 3, 2026, 2:43 AM20.7s2 files scanned
SKILL.md
- name:
- use-workflow-plan-preview
- description:
- Internal helper for /think Step 11. Renders SOW.md + Spec.md as an integrated Astro view and returns a dev server URL.
- when_to_use:
- Called only from /think Step 11. Not user-invokable.
- allowed-tools:
- Read Write Edit Bash
- user-invocable:
- false
use-workflow-plan-preview
Workflow helper invoked by /think Step 11. Renders SOW.md + Spec.md as an integrated, browser-friendly view via the Astro project at ~/.claude/workspace/views/.
Not for direct user invocation. /think is the only caller.
Args (passed by caller /think)
$1 is the planning slug (e.g. 2026-05-08-issue-53-annotation-foundation).
Steps
- Read
~/.claude/workspace/planning/$1/sow.mdandspec.md - Decide a short-slug from the trailing keywords of
$1(e.g.2026-05-08-issue-53-annotation-foundation→issue-53orannotation-foundation) - Copy ${CLAUDE_SKILL_DIR}/templates/spec.mdx to
~/.claude/workspace/views/src/content/<short-slug>.mdx - Fill the frontmatter from sow.md
title. H1 linesubtitle. First sentence of Why → Outcome (a)status. Below## Status(draft / approved / done)updatedAt. Today's date YYYY-MM-DDsessionId. FromSession:lineissueUrl. GitHub URL in Reference
- Fill each tab placeholder (mapping below)
- Start or verify the dev server with
cd ~/.claude/workspace/views && bun run dev- Skip if port 4321 is already running
- Share
http://localhost:4321/spec/<short-slug>with the user
Tab → source mapping
| Tab | sow.md / spec.md section | | ------------ | --------------------------------------------------------------------------- | | overview | sow.md Why / Approach / Background | | scope | sow.md Scope (In/Out) / Three-Tier Boundaries | | ac | sow.md Acceptance Criteria | | phases | sow.md Implementation Plan (Phase 1/2/3) | | spec | spec.md Functional Requirements / Validation / Non-Functional / Assumptions | | domain | spec.md Domain Model (Entities / Business Rules) | | tests | spec.md Test Scenarios | | risks | sow.md Risks + spec.md Reassessment Triggers | | traceability | spec.md Traceability Matrix + Implementation Phase × FR |
Components
| Component | Usage |
| --------- | --------------------------------------------------------------------------------------- |
| TabPanel | <TabPanel id="overview" initial>...</TabPanel> |
| Pill | <span class="pill-ac">AC-1</span> (or <Pill variant="ac">) |
| Tier | <span class="tier-always">必須</span> (or <Tier variant="always" />) |
| Term | <span class="term" data-tip="...">用語</span> |
| Card | <div class="card"><div class="label">X</div><p>...</p></div> |
| Card grid | <div class="card-grid">...8 cards...</div> |
| SearchBox | <SearchBox id="fr-filter" placeholder="..." /> |
| ChipGroup | <ChipGroup id="test-chips" chips={[{type, label}, ...]} initial="all" /> |
| PhaseFlow | <PhaseFlow phases={[{num, title, subtitle, bullets, outcome, tone}]} caption="..." /> |
| DataFlow | <DataFlow boxes={[...]} edges={[...]} /> |
tone values differ per component. Undefined values cause a runtime error.
| Component | Allowed tone |
| --------- | -------------------------------------------- |
| PhaseFlow | accent / warn / pass |
| DataFlow | info / warn / accent / pass / fail |
MDX escaping
| Pattern | Fix |
| -------------------------------------- | -------------------------------------- |
| {0..9} (range in braces) | \{0..9\} |
| [*] (bracket + asterisk) | [*] |
| {key: value} JSON-like | {"{key: value}"} |
| ${var} template literal | wrap inside string: {"...${var}..."} |
| <code>foo*</code> (asterisk in code) | <code>foo*</code> |
| <code>__name</code> (dunder in code) | <code>\_\_name</code> |
Reference implementation
Use ${CLAUDE_SKILL_DIR}/templates/spec.mdx as the canonical example (all 9 tabs filled).
Done
~/.claude/workspace/views/src/content/<short-slug>.mdxexistshttp://localhost:4321/spec/<short-slug>renders without error- Each tab reflects content from sow.md / spec.md
- No
{/* PLACEHOLDER */}markers remain (grep returns zero hits)
Constraints
- sow.md / spec.md are read-only (do not modify)
- Do not modify anything under the planning directory
- Write only under
~/.claude/workspace/views/
Related Skills
thkt/use-cli-herdr
tools
VerifiedTrustedCommunity
Delegate implementation to codex (coder) via the herdr-agentchat plugin and drive a two-pane conversation to completion.
11SKILL.mdUpdated Jul 27, 2026
thkt/scribe
development
VerifiedTrustedCommunity
Extract recurring patterns from past closed PRs/issues and the research findings in workspace/research/, verify them against the latest code, and propose them to docs/wiki/ via PR.
11SKILL.mdUpdated Jul 20, 2026
thkt/dr
development
VerifiedTrustedCommunity
Create Decision Records (DR) in MADR v4 format with auto-numbering.
11SKILL.mdUpdated Jul 15, 2026
thkt/polish
development
VerifiedTrustedCommunity
Codex review + cleanup. Findings are challenged by critic-audit, not aggregated as facts, and fixes are applied directly. Do NOT use for internal multi-reviewer deep audits or findings reports (use /audit).
11SKILL.mdUpdated Jul 14, 2026