Learn-skills.dev clack
Comprehensive guidance for building and debugging JavaScript and TypeScript CLIs with @clack/core and @clack/prompts, backed by bundled upstream source and examples. Use when implementing clack prompt flows, deciding between core primitives and styled prompts, adapting clack examples, or validating clack API usage.
install
source · Clone the upstream repo
git clone https://github.com/NeverSight/learn-skills.dev
Claude Code · Install into ~/.claude/skills/
T=$(mktemp -d) && git clone --depth=1 https://github.com/NeverSight/learn-skills.dev "$T" && mkdir -p ~/.claude/skills && cp -r "$T/data/skills-md/ahmadawais/skills/clack" ~/.claude/skills/neversight-learn-skills-dev-clack && rm -rf "$T"
manifest:
data/skills-md/ahmadawais/skills/clack/SKILL.mdsource content
Clack CLI Skill
Use this skill to implement reliable interactive CLIs with
@clack/core and @clack/prompts.
Workflow
- Decide whether to use
or@clack/prompts
.@clack/core - Read only the minimum reference files needed for the task.
- Start from the closest example in
.references/examples/ - Implement cancellation handling after every prompt.
- Add UX polish (
,intro
,outro
,spinner
,progress
,tasks
,log
,taskLog
) when useful.stream - Verify imports against export maps in
andreferences/docs/prompts-exports.ts
.references/docs/core-exports.ts
Pick the Right Layer
Use
@clack/prompts by default.
- Choose it for production-ready styling and quick delivery.
- Use it when the request maps to standard prompt types: text, confirm, select, multiselect, grouped prompts, logs, spinners, progress, tasks, or streaming logs.
Use
@clack/core when lower-level control is required.
- Choose it for custom rendering, custom prompt behavior, or unstyled primitives.
- Use it when the request needs direct prompt classes (
,TextPrompt
,SelectPrompt
,ConfirmPrompt
) or deep customization.Prompt
Mandatory Safety Patterns
Handle cancellation on every prompt result.
import * as p from '@clack/prompts'; const value = await p.text({ message: 'Your name?' }); if (p.isCancel(value)) { p.cancel('Operation cancelled.'); process.exit(0); }
Start and close sessions cleanly for user-facing CLIs.
p.intro('create-app'); // prompts p.outro('Done');
Prompt Design Guidance
Use these defaults unless the user asks otherwise.
: providetext
for required or constrained input.validate
: use for binary decisions; avoid coercing free-form text.confirm
: use for mutually exclusive choices.select
ormultiselect
: use for multi-choice and hierarchical multi-choice flows.groupMultiselect
: gather structured answers while preserving dependencies between steps.group
andspinner
: wrap long-running tasks and update status clearly.progress
: execute sequential task blocks with spinner status.tasks
: stream subprocess output and finish with success/failure.taskLog
: render async or tokenized output (for LLM-style streaming).stream
Implementation Sequence
- Inspect user requirements and identify required prompt primitives.
- Read the nearest example under
.references/examples/ - Confirm function/class availability from:
references/docs/prompts-exports.tsreferences/docs/core-exports.ts
- If behavior is unclear, inspect source under:
references/source/prompts/references/source/core/
- Implement with cancellation guards and clear terminal messaging.
- Keep fallback behavior for non-interactive contexts when requested (see spinner and CI-oriented examples).
Reference Loading Strategy
Start with these files.
references/docs/prompts-readme.mdreferences/docs/core-readme.mdreferences/INDEX.md
Load specific source files only as needed.
- Prompts wrapper internals:
references/source/prompts/*.ts - Core prompt primitives:
references/source/core/prompts/*.ts - Core utility behavior:
references/source/core/utils/*.ts
Example-First Mapping
Use this quick mapping to avoid re-inventing flows.
- General prompt suite:
references/examples/basic/index.ts - Validation:
references/examples/basic/text-validation.ts - Autocomplete:
references/examples/basic/autocomplete.ts - Autocomplete multi-select:
references/examples/basic/autocomplete-multiselect.ts - Defaults:
references/examples/basic/default-value.ts - Filesystem path prompt:
references/examples/basic/path.ts - Spinner basics:
references/examples/basic/spinner.ts - Spinner cancellation:
references/examples/basic/spinner-cancel.ts - Advanced spinner cancellation:
references/examples/basic/spinner-cancel-advanced.ts - CI-oriented spinner behavior:
references/examples/basic/spinner-ci.ts - Timer-style spinner updates:
references/examples/basic/spinner-timer.ts - Progress bar:
references/examples/basic/progress.ts - Task log streaming:
references/examples/basic/task-log.ts - Stream utility:
references/examples/basic/stream.ts - Changesets integration flow:
references/examples/changesets/index.ts
Quality Bar
Before finalizing any clack implementation:
- Confirm every import exists in the current exports file.
- Ensure cancellation flow always exits safely.
- Ensure prompt wording is short and unambiguous.
- Ensure long-running operations provide visible status.
- Ensure selected layer (
vscore
) matches customization needs.prompts