Skip to content

Commit 9999adf

Browse files
hyperz111hyperz111
authored
fix: fix note component overflow bug (#376)
1 parent b5016e8 commit 9999adf

File tree

4 files changed

+187
-2
lines changed

4 files changed

+187
-2
lines changed

‎.changeset/floppy-laws-tan.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"@clack/prompts": patch
3+
---
4+
5+
fix note component overflow bug

‎packages/prompts/src/note.ts

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,18 +10,29 @@ import {
1010
S_CORNER_TOP_RIGHT,
1111
S_STEP_SUBMIT,
1212
} from './common.js';
13+
import { wrapAnsi } from "fast-wrap-ansi";
14+
import process from "node:process";
1315

1416
export interface NoteOptions extends CommonOptions {
1517
format?: (line: string) => string;
1618
}
1719

1820
const defaultNoteFormatter = (line: string): string => color.dim(line);
1921

22+
const wrapWithFormat = (message: string, width: number, format: NoteOptions["format"]): string => {
23+
const wrapMsg = wrapAnsi(message, width).split("\n");
24+
const maxWidthNormal = wrapMsg.reduce((sum, ln) => Math.max(strip(ln).length, sum), 0);
25+
const maxWidthFormat = wrapMsg.map(format).reduce((sum, ln) => Math.max(strip(ln).length, sum), 0);
26+
const wrapWidth = width - (maxWidthFormat - maxWidthNormal);
27+
return wrapAnsi(message, wrapWidth);
28+
}
29+
2030
export const note = (message = '', title = '', opts?: NoteOptions) => {
31+
const output: Writable = opts?.output ?? process.stdout;
2132
const format = opts?.format ?? defaultNoteFormatter;
22-
const lines = ['', ...message.split('\n').map(format), ''];
33+
const wrapMsg = wrapWithFormat(message, output.columns - 6, format);
34+
const lines = ['', ...wrapMsg.split('\n').map(format), ''];
2335
const titleLen = strip(title).length;
24-
const output: Writable = opts?.output ?? process.stdout;
2536
const len =
2637
Math.max(
2738
lines.reduce((sum, ln) => {

‎packages/prompts/test/__snapshots__/note.test.ts.snap

Lines changed: 148 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,79 @@
11
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
22

3+
exports[`note (isCI = false) > don't overflow 1`] = `
4+
[
5+
"│
6+
◇ title ──────────────────────────────────────────────────────────────╮
7+
│ │
8+
│ test string test string test string test string test string test │
9+
│ string test string test string test string test string test string │
10+
│ test string test string test string test string test string test │
11+
│ string test string test string test string test string test string │
12+
│ test string test string test string test string test string test │
13+
│ string test string test string test string test string │
14+
│ test string test string test string test string test string test │
15+
│ string test string test string test string test string test string │
16+
│ test string test string test string test string test string test │
17+
│ string test string test string test string test string test string │
18+
│ test string test string test string test string test string test │
19+
│ string test string test string test string test string │
20+
│ test string test string test string test string test string test │
21+
│ string test string test string test string test string test string │
22+
│ test string test string test string test string test string test │
23+
│ string test string test string test string test string test string │
24+
│ test string test string test string test string test string test │
25+
│ string test string test string test string test string │
26+
│ test string test string test string test string test string test │
27+
│ string test string test string test string test string test string │
28+
│ test string test string test string test string test string test │
29+
│ string test string test string test string test string test string │
30+
│ test string test string test string test string test string test │
31+
│ string test string test string test string test string │
32+
│ │
33+
├──────────────────────────────────────────────────────────────────────╯
34+
",
35+
]
36+
`;
37+
38+
exports[`note (isCI = false) > don't overflow with formatter 1`] = `
39+
[
40+
"│
41+
◇ title ────────────────────────────────────────────────────────────────╮
42+
│ │
43+
│ * test string test string test string test string test string test * │
44+
│ * string test string test string test string test string test * │
45+
│ * string test string test string test string test string test * │
46+
│ * string test string test string test string test string test * │
47+
│ * string test string test string test string test string test * │
48+
│ * string test string test string test string test string test * │
49+
│ * string test string * │
50+
│ * test string test string test string test string test string test * │
51+
│ * string test string test string test string test string test * │
52+
│ * string test string test string test string test string test * │
53+
│ * string test string test string test string test string test * │
54+
│ * string test string test string test string test string test * │
55+
│ * string test string test string test string test string test * │
56+
│ * string test string * │
57+
│ * test string test string test string test string test string test * │
58+
│ * string test string test string test string test string test * │
59+
│ * string test string test string test string test string test * │
60+
│ * string test string test string test string test string test * │
61+
│ * string test string test string test string test string test * │
62+
│ * string test string test string test string test string test * │
63+
│ * string test string * │
64+
│ * test string test string test string test string test string test * │
65+
│ * string test string test string test string test string test * │
66+
│ * string test string test string test string test string test * │
67+
│ * string test string test string test string test string test * │
68+
│ * string test string test string test string test string test * │
69+
│ * string test string test string test string test string test * │
70+
│ * string test string * │
71+
│ │
72+
├────────────────────────────────────────────────────────────────────────╯
73+
",
74+
]
75+
`;
76+
377
exports[`note (isCI = false) > formatter which adds colors works 1`] = `
478
[
579
"│
@@ -53,6 +127,80 @@ exports[`note (isCI = false) > renders message with title 1`] = `
53127
]
54128
`;
55129

130+
exports[`note (isCI = true) > don't overflow 1`] = `
131+
[
132+
"│
133+
◇ title ──────────────────────────────────────────────────────────────╮
134+
│ │
135+
│ test string test string test string test string test string test │
136+
│ string test string test string test string test string test string │
137+
│ test string test string test string test string test string test │
138+
│ string test string test string test string test string test string │
139+
│ test string test string test string test string test string test │
140+
│ string test string test string test string test string │
141+
│ test string test string test string test string test string test │
142+
│ string test string test string test string test string test string │
143+
│ test string test string test string test string test string test │
144+
│ string test string test string test string test string test string │
145+
│ test string test string test string test string test string test │
146+
│ string test string test string test string test string │
147+
│ test string test string test string test string test string test │
148+
│ string test string test string test string test string test string │
149+
│ test string test string test string test string test string test │
150+
│ string test string test string test string test string test string │
151+
│ test string test string test string test string test string test │
152+
│ string test string test string test string test string │
153+
│ test string test string test string test string test string test │
154+
│ string test string test string test string test string test string │
155+
│ test string test string test string test string test string test │
156+
│ string test string test string test string test string test string │
157+
│ test string test string test string test string test string test │
158+
│ string test string test string test string test string │
159+
│ │
160+
├──────────────────────────────────────────────────────────────────────╯
161+
",
162+
]
163+
`;
164+
165+
exports[`note (isCI = true) > don't overflow with formatter 1`] = `
166+
[
167+
"│
168+
◇ title ────────────────────────────────────────────────────────────────╮
169+
│ │
170+
│ * test string test string test string test string test string test * │
171+
│ * string test string test string test string test string test * │
172+
│ * string test string test string test string test string test * │
173+
│ * string test string test string test string test string test * │
174+
│ * string test string test string test string test string test * │
175+
│ * string test string test string test string test string test * │
176+
│ * string test string * │
177+
│ * test string test string test string test string test string test * │
178+
│ * string test string test string test string test string test * │
179+
│ * string test string test string test string test string test * │
180+
│ * string test string test string test string test string test * │
181+
│ * string test string test string test string test string test * │
182+
│ * string test string test string test string test string test * │
183+
│ * string test string * │
184+
│ * test string test string test string test string test string test * │
185+
│ * string test string test string test string test string test * │
186+
│ * string test string test string test string test string test * │
187+
│ * string test string test string test string test string test * │
188+
│ * string test string test string test string test string test * │
189+
│ * string test string test string test string test string test * │
190+
│ * string test string * │
191+
│ * test string test string test string test string test string test * │
192+
│ * string test string test string test string test string test * │
193+
│ * string test string test string test string test string test * │
194+
│ * string test string test string test string test string test * │
195+
│ * string test string test string test string test string test * │
196+
│ * string test string test string test string test string test * │
197+
│ * string test string * │
198+
│ │
199+
├────────────────────────────────────────────────────────────────────────╯
200+
",
201+
]
202+
`;
203+
56204
exports[`note (isCI = true) > formatter which adds colors works 1`] = `
57205
[
58206
"│

‎packages/prompts/test/note.test.ts

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,4 +63,25 @@ describe.each(['true', 'false'])('note (isCI = %s)', (isCI) => {
6363

6464
expect(output.buffer).toMatchSnapshot();
6565
});
66+
67+
test('don\'t overflow', () => {
68+
const input = `${'test string '.repeat(32)}\n`.repeat(4).trim();
69+
prompts.note(input, 'title', {
70+
input,
71+
output: Object.assign(output, { columns: 75 }),
72+
});
73+
74+
expect(output.buffer).toMatchSnapshot();
75+
});
76+
77+
test('don\'t overflow with formatter', () => {
78+
const input = `${'test string '.repeat(32)}\n`.repeat(4).trim();
79+
prompts.note(input, 'title', {
80+
format: (line) => colors.red(`* ${colors.cyan(line)} *`),
81+
input,
82+
output: Object.assign(output, { columns: 75 }),
83+
});
84+
85+
expect(output.buffer).toMatchSnapshot();
86+
});
6687
});

0 commit comments

Comments
 (0)