Skip to content

Commit c9e8ef4

Browse files
committed
update README.md
1 parent f6f2933 commit c9e8ef4

File tree

3 files changed

+94
-1
lines changed

3 files changed

+94
-1
lines changed

packages/prompts/CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# @clack/prompts
22

3+
## 0.0.5
4+
5+
### Patch Changes
6+
7+
- Update README
8+
39
## 0.0.4
410

511
### Patch Changes

packages/prompts/README.md

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,4 +13,91 @@ https://user-images.githubusercontent.com/7118177/218354495-aece6e96-cad2-403b-8
1313
- ✅ Simple API
1414
- 🧱 Comes with `text`, `confirm`, `select`, and `spinner` components
1515

16+
## Basics
1617

18+
### Setup
19+
20+
The `intro` and `outro` functions will print a message to begin or end a prompt session, respectively.
21+
22+
```js
23+
import { intro, outro } from "@clack/prompts";
24+
25+
intro(`create-my-app`);
26+
// Do stuff
27+
outro(`You're all set!`);
28+
```
29+
30+
### Cancellation
31+
32+
The `isCancel` function is a guard that detects when a user cancels a question with `CTRL + C`. You should handle this situation for each prompt, optionally providing a nice cancellation message with the `cancel` utility.
33+
34+
```js
35+
import { isCancel, cancel, text } from "@clack/prompts";
36+
37+
const value = await text(/* TODO */);
38+
39+
if (isCancel(value)) {
40+
cancel("Operation cancelled.");
41+
process.exit(0);
42+
}
43+
```
44+
45+
## Components
46+
47+
### Text
48+
49+
The text component accepts a single line of text.
50+
51+
```js
52+
import { text } from "@clack/prompts";
53+
54+
const meaning = await text({
55+
message: "What is the meaning of life?",
56+
placeholder: "Not sure",
57+
validate(value) {
58+
if (value.length === 0) return `Value is required!`;
59+
},
60+
});
61+
```
62+
63+
### Confirm
64+
65+
The confirm component accepts a yes or no answer. The result is a boolean value of `true` or `false`.
66+
67+
```js
68+
import { confirm } from "@clack/prompts";
69+
70+
const shouldContinue = await confirm({
71+
message: "Do you want to continue?",
72+
});
73+
```
74+
75+
### Select
76+
77+
The select component allows a user to choose one value from a list of options. The result is the `value` prop of a given option.
78+
79+
```js
80+
import { select } from "@clack/prompts";
81+
82+
const projectType = await select({
83+
message: "Pick a project type.",
84+
options: [
85+
{ value: "ts", label: "TypeScript" },
86+
{ value: "js", label: "JavaScript" },
87+
{ value: "coffee", label: "CoffeeScript", hint: "oh no" },
88+
],
89+
});
90+
```
91+
92+
### Spinner
93+
94+
The spinner component surfaces a pending action, such as a long-running download or dependency installation.
95+
96+
```js
97+
import { spinner } from "@clack/prompts";
98+
99+
const s = spinner();
100+
s.start("Installing via npm");
101+
// Do installation
102+
s.stop("Installed via npm");
103+
```

packages/prompts/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@clack/prompts",
3-
"version": "0.0.4",
3+
"version": "0.0.5",
44
"type": "module",
55
"main": "./dist/index.js",
66
"exports": {

0 commit comments

Comments
 (0)