@clack/prompts - npm Package Compare versions

Comparing version 1.5.1 to 1.6.0

CHANGELOG.md

 # @clack/prompts
 
+## 1.6.0
+
+### Minor Changes
+
+- [#568](https://github.com/bombshell-dev/clack/pull/568) [`f87933f`](https://github.com/bombshell-dev/clack/commit/f87933fb7b3f4c401b9e51a152b95cb8e7200fe5) Thanks [@florian-lefebvre](https://github.com/florian-lefebvre)! - Updates default formatter of `note()` to note dim lines anymore
+
+  If you want the old behavior, provide a `format()` function:
+
+  ```diff
+  import { note } from '@clack/prompts';
+  +import { styleText } from 'node:util';
+
+  note(
+    'You can edit the file src/index.jsx',
+    'Next steps.'
+  +  { format: (text) => styleText('dim', text) }
+  );
+  ```
+
+- [#567](https://github.com/bombshell-dev/clack/pull/567) [`cc6aab5`](https://github.com/bombshell-dev/clack/commit/cc6aab50186cff8a02dc98e9cfd3897c29a33b15) Thanks [@dreyfus92](https://github.com/dreyfus92)! - Add keyboard instruction footers to `select`, `multiselect`, and `groupMultiselect` in the active state, matching autocomplete. No option — always shown.
+
+### Patch Changes
+
+- Updated dependencies [[`2f2b52f`](https://github.com/bombshell-dev/clack/commit/2f2b52f77cbfa9af618c6d929249ab8395fc37a1), [`e1b6ee7`](https://github.com/bombshell-dev/clack/commit/e1b6ee71a76e17a3c33ba7ee6e5fb34e886233bb)]:
+  - @clack/core@1.4.2
+
 ## 1.5.1
@@ -4,0 +30,0 @@

dist/index.d.mts

@@ -42,3 +42,5 @@ import { State, AutocompletePrompt, Validate, DateFormat } from '@clack/core';
 }
+declare function formatInstructionFooter(instructions: string[], hasGuide: boolean): string[];
 
+declare const SELECT_INSTRUCTIONS: string[];
 type Primitive = Readonly<string | boolean | number>;
@@ -724,2 +726,3 @@ type Option<Value> = Value extends Primitive ? {
 
+declare const MULTISELECT_INSTRUCTIONS: string[];
 interface MultiSelectOptions<Value> extends CommonOptions {
@@ -926,3 +929,3 @@ message: string;
 
-export { S_BAR, S_BAR_END, S_BAR_END_RIGHT, S_BAR_H, S_BAR_START, S_BAR_START_RIGHT, S_CHECKBOX_ACTIVE, S_CHECKBOX_INACTIVE, S_CHECKBOX_SELECTED, S_CONNECT_LEFT, S_CORNER_BOTTOM_LEFT, S_CORNER_BOTTOM_RIGHT, S_CORNER_TOP_LEFT, S_CORNER_TOP_RIGHT, S_ERROR, S_INFO, S_PASSWORD_MASK, S_RADIO_ACTIVE, S_RADIO_INACTIVE, S_STEP_ACTIVE, S_STEP_CANCEL, S_STEP_ERROR, S_STEP_SUBMIT, S_SUCCESS, S_WARN, autocomplete, autocompleteMultiselect, box, cancel, confirm, date, group, groupMultiselect, intro, isCI, isTTY, limitOptions, log, multiline, multiselect, note, outro, password, path, progress, select, selectKey, spinner, stream, symbol, symbolBar, taskLog, tasks, text, unicode, unicodeOr };
+export { MULTISELECT_INSTRUCTIONS, SELECT_INSTRUCTIONS, S_BAR, S_BAR_END, S_BAR_END_RIGHT, S_BAR_H, S_BAR_START, S_BAR_START_RIGHT, S_CHECKBOX_ACTIVE, S_CHECKBOX_INACTIVE, S_CHECKBOX_SELECTED, S_CONNECT_LEFT, S_CORNER_BOTTOM_LEFT, S_CORNER_BOTTOM_RIGHT, S_CORNER_TOP_LEFT, S_CORNER_TOP_RIGHT, S_ERROR, S_INFO, S_PASSWORD_MASK, S_RADIO_ACTIVE, S_RADIO_INACTIVE, S_STEP_ACTIVE, S_STEP_CANCEL, S_STEP_ERROR, S_STEP_SUBMIT, S_SUCCESS, S_WARN, autocomplete, autocompleteMultiselect, box, cancel, confirm, date, formatInstructionFooter, group, groupMultiselect, intro, isCI, isTTY, limitOptions, log, multiline, multiselect, note, outro, password, path, progress, select, selectKey, spinner, stream, symbol, symbolBar, taskLog, tasks, text, unicode, unicodeOr };
 export type { AutocompleteMultiSelectOptions, AutocompleteOptions, BoxAlignment, BoxOptions, CommonOptions, ConfirmOptions, DateOptions, GroupMultiSelectOptions, LimitOptionsParams, LogMessageOptions, MultiLineOptions, MultiSelectOptions, NoteOptions, Option, PasswordOptions, PathOptions, ProgressOptions, ProgressResult, PromptGroup, PromptGroupAwaitedReturn, PromptGroupOptions, SelectKeyOptions, SelectOptions, SpinnerOptions, SpinnerResult, Task, TaskLogCompletionOptions, TaskLogMessageOptions, TaskLogOptions, TextOptions };

dist/index.mjs

@@ -1,2 +0,2 @@
-import { getColumns, getRows, AutocompletePrompt, settings, ConfirmPrompt, wrapTextWithPrefix, DatePrompt, runValidation, isCancel, GroupMultiSelectPrompt, MultiLinePrompt, MultiSelectPrompt, PasswordPrompt, block, SelectPrompt, SelectKeyPrompt, TextPrompt } from '@clack/core';
+import { getColumns, getRows, AutocompletePrompt, settings, ConfirmPrompt, wrapTextWithPrefix, DatePrompt, runValidation, isCancel, MultiSelectPrompt, GroupMultiSelectPrompt, MultiLinePrompt, PasswordPrompt, block, SelectPrompt, SelectKeyPrompt, TextPrompt } from '@clack/core';
 export { isCancel, settings, updateSettings } from '@clack/core';
@@ -27,4 +27,4 @@ import { styleText, stripVTControlCharacters } from 'node:util';
 
-const unicode = isUnicodeSupported(), isCI = () => process.env.CI === "true", isTTY = (e) => e.isTTY === true, unicodeOr = (e, o) => unicode ? e : o, S_STEP_ACTIVE = unicodeOr("\u25C6", "*"), S_STEP_CANCEL = unicodeOr("\u25A0", "x"), S_STEP_ERROR = unicodeOr("\u25B2", "x"), S_STEP_SUBMIT = unicodeOr("\u25C7", "o"), S_BAR_START = unicodeOr("\u250C", "T"), S_BAR = unicodeOr("\u2502", "|"), S_BAR_END = unicodeOr("\u2514", "\u2014"), S_BAR_START_RIGHT = unicodeOr("\u2510", "T"), S_BAR_END_RIGHT = unicodeOr("\u2518", "\u2014"), S_RADIO_ACTIVE = unicodeOr("\u25CF", ">"), S_RADIO_INACTIVE = unicodeOr("\u25CB", " "), S_CHECKBOX_ACTIVE = unicodeOr("\u25FB", "[\u2022]"), S_CHECKBOX_SELECTED = unicodeOr("\u25FC", "[+]"), S_CHECKBOX_INACTIVE = unicodeOr("\u25FB", "[ ]"), S_PASSWORD_MASK = unicodeOr("\u25AA", "\u2022"), S_BAR_H = unicodeOr("\u2500", "-"), S_CORNER_TOP_RIGHT = unicodeOr("\u256E", "+"), S_CONNECT_LEFT = unicodeOr("\u251C", "+"), S_CORNER_BOTTOM_RIGHT = unicodeOr("\u256F", "+"), S_CORNER_BOTTOM_LEFT = unicodeOr("\u2570", "+"), S_CORNER_TOP_LEFT = unicodeOr("\u256D", "+"), S_INFO = unicodeOr("\u25CF", "\u2022"), S_SUCCESS = unicodeOr("\u25C6", "*"), S_WARN = unicodeOr("\u25B2", "!"), S_ERROR = unicodeOr("\u25A0", "x"), symbol = (e) => {
-  switch (e) {
+const unicode = isUnicodeSupported(), isCI = () => process.env.CI === "true", isTTY = (o) => o.isTTY === true, unicodeOr = (o, e) => unicode ? o : e, S_STEP_ACTIVE = unicodeOr("\u25C6", "*"), S_STEP_CANCEL = unicodeOr("\u25A0", "x"), S_STEP_ERROR = unicodeOr("\u25B2", "x"), S_STEP_SUBMIT = unicodeOr("\u25C7", "o"), S_BAR_START = unicodeOr("\u250C", "T"), S_BAR = unicodeOr("\u2502", "|"), S_BAR_END = unicodeOr("\u2514", "\u2014"), S_BAR_START_RIGHT = unicodeOr("\u2510", "T"), S_BAR_END_RIGHT = unicodeOr("\u2518", "\u2014"), S_RADIO_ACTIVE = unicodeOr("\u25CF", ">"), S_RADIO_INACTIVE = unicodeOr("\u25CB", " "), S_CHECKBOX_ACTIVE = unicodeOr("\u25FB", "[\u2022]"), S_CHECKBOX_SELECTED = unicodeOr("\u25FC", "[+]"), S_CHECKBOX_INACTIVE = unicodeOr("\u25FB", "[ ]"), S_PASSWORD_MASK = unicodeOr("\u25AA", "\u2022"), S_BAR_H = unicodeOr("\u2500", "-"), S_CORNER_TOP_RIGHT = unicodeOr("\u256E", "+"), S_CONNECT_LEFT = unicodeOr("\u251C", "+"), S_CORNER_BOTTOM_RIGHT = unicodeOr("\u256F", "+"), S_CORNER_BOTTOM_LEFT = unicodeOr("\u2570", "+"), S_CORNER_TOP_LEFT = unicodeOr("\u256D", "+"), S_INFO = unicodeOr("\u25CF", "\u2022"), S_SUCCESS = unicodeOr("\u25C6", "*"), S_WARN = unicodeOr("\u25B2", "!"), S_ERROR = unicodeOr("\u25A0", "x"), symbol = (o) => {
+  switch (o) {
     case "initial":
@@ -40,4 +40,4 @@ case "active":
   }
-}, symbolBar = (e) => {
-  switch (e) {
+}, symbolBar = (o) => {
+  switch (o) {
     case "initial":
@@ -54,2 +54,6 @@ case "active":
 };
+function formatInstructionFooter(o, e) {
+  const r = [`${e ? `${styleText("cyan", S_BAR)}  ` : ""}${o.join(" \u2022 ")}`];
+  return e && r.push(styleText("cyan", S_BAR_END)), r;
+}
 
@@ -459,24 +463,137 @@ const E$1 = (l, o, g, c, h, O = false) => {
 
-const groupMultiselect = (u) => {
-  const { selectableGroups: h = true, groupSpacing: x = 0 } = u, m = (i, l, g = []) => {
-    const c = i.label ?? String(i.value), t = typeof i.group == "string", s = t && (g[g.indexOf(i) + 1] ?? { group: true }), o = t && s && s.group === true;
-    let n = "", a = "";
-    t && (h ? (n = o ? `${S_BAR_END} ` : `${S_BAR} `, a = o ? "  " : `${S_BAR} `) : n = "  ");
-    let r = "";
-    if (x > 0 && !t && (r = `
-`.repeat(x)), l === "active")
+const MULTISELECT_INSTRUCTIONS = [
+  `${styleText("dim", "\u2191/\u2193")} to navigate`,
+  `${styleText("dim", "Space:")} select`,
+  `${styleText("dim", "Enter:")} confirm`
+];
+const m = (n, o) => n.split(`
+`).map((d) => o(d)).join(`
+`);
+const multiselect = (n) => {
+  const o = (t, a) => {
+    const r = t.label ?? String(t.value);
+    return a === "disabled" ? `${styleText("gray", S_CHECKBOX_INACTIVE)} ${m(r, (l) => styleText(["strikethrough", "gray"], l))}${t.hint ? ` ${styleText("dim", `(${t.hint ?? "disabled"})`)}` : ""}` : a === "active" ? `${styleText("cyan", S_CHECKBOX_ACTIVE)} ${r}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}` : a === "selected" ? `${styleText("green", S_CHECKBOX_SELECTED)} ${m(r, (l) => styleText("dim", l))}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}` : a === "cancelled" ? `${m(r, (l) => styleText(["strikethrough", "dim"], l))}` : a === "active-selected" ? `${styleText("green", S_CHECKBOX_SELECTED)} ${r}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}` : a === "submitted" ? `${m(r, (l) => styleText("dim", l))}` : `${styleText("dim", S_CHECKBOX_INACTIVE)} ${m(r, (l) => styleText("dim", l))}`;
+  }, d = n.required ?? true;
+  return new MultiSelectPrompt({
+    options: n.options,
+    signal: n.signal,
+    input: n.input,
+    output: n.output,
+    initialValues: n.initialValues,
+    required: d,
+    cursorAt: n.cursorAt,
+    validate(t) {
+      if (d && (t === void 0 || t.length === 0))
+        return `Please select at least one option.
+${styleText(
+          "reset",
+          styleText(
+            "dim",
+            `Press ${styleText(["gray", "bgWhite", "inverse"], " space ")} to select, ${styleText(
+              "gray",
+              styleText("bgWhite", styleText("inverse", " enter "))
+            )} to submit`
+          )
+        )}`;
+    },
+    render() {
+      const t = n.withGuide ?? settings.withGuide, a = wrapTextWithPrefix(
+        n.output,
+        n.message,
+        t ? `${symbolBar(this.state)}  ` : "",
+        `${symbol(this.state)}  `
+      ), r = `${t ? `${styleText("gray", S_BAR)}
+` : ""}${a}
+`, l = this.value ?? [], p = (i, u) => {
+        if (i.disabled)
+          return o(i, "disabled");
+        const s = l.includes(i.value);
+        return u && s ? o(i, "active-selected") : s ? o(i, "selected") : o(i, u ? "active" : "inactive");
+      };
+      switch (this.state) {
+        case "submit": {
+          const i = this.options.filter(({ value: s }) => l.includes(s)).map((s) => o(s, "submitted")).join(styleText("dim", ", ")) || styleText("dim", "none"), u = wrapTextWithPrefix(
+            n.output,
+            i,
+            t ? `${styleText("gray", S_BAR)}  ` : ""
+          );
+          return `${r}${u}`;
+        }
+        case "cancel": {
+          const i = this.options.filter(({ value: s }) => l.includes(s)).map((s) => o(s, "cancelled")).join(styleText("dim", ", "));
+          if (i.trim() === "")
+            return `${r}${styleText("gray", S_BAR)}`;
+          const u = wrapTextWithPrefix(
+            n.output,
+            i,
+            t ? `${styleText("gray", S_BAR)}  ` : ""
+          );
+          return `${r}${u}${t ? `
+${styleText("gray", S_BAR)}` : ""}`;
+        }
+        case "error": {
+          const i = t ? `${styleText("yellow", S_BAR)}  ` : "", u = this.error.split(`
+`).map(
+            ($, x) => x === 0 ? `${t ? `${styleText("yellow", S_BAR_END)}  ` : ""}${styleText("yellow", $)}` : `   ${$}`
+          ).join(`
+`), s = r.split(`
+`).length, g = u.split(`
+`).length + 1;
+          return `${r}${i}${limitOptions({
+            output: n.output,
+            options: this.options,
+            cursor: this.cursor,
+            maxItems: n.maxItems,
+            columnPadding: i.length,
+            rowPadding: s + g,
+            style: p
+          }).join(`
+${i}`)}
+${u}
+`;
+        }
+        default: {
+          const i = t ? `${styleText("cyan", S_BAR)}  ` : "", u = r.split(`
+`).length, s = formatInstructionFooter(MULTISELECT_INSTRUCTIONS, t), g = s.join(`
+`), $ = s.length + 1;
+          return `${r}${i}${limitOptions({
+            output: n.output,
+            options: this.options,
+            cursor: this.cursor,
+            maxItems: n.maxItems,
+            columnPadding: i.length,
+            rowPadding: u + $,
+            style: p
+          }).join(`
+${i}`)}
+${g}
+`;
+        }
+      }
+    }
+  }).prompt();
+};
+
+const groupMultiselect = (o) => {
+  const { selectableGroups: f = true, groupSpacing: b = 0 } = o, m = (n, l, g = []) => {
+    const a = n.label ?? String(n.value), t = typeof n.group == "string", u = t && (g[g.indexOf(n) + 1] ?? { group: true }), s = t && u && u.group === true;
+    let r = "", c = "";
+    t && (f ? (r = s ? `${S_BAR_END} ` : `${S_BAR} `, c = s ? "  " : `${S_BAR} `) : r = "  ");
+    let i = "";
+    if (b > 0 && !t && (i = `
+`.repeat(b)), l === "active")
       return wrapTextWithPrefix(
-        u.output,
-        `${c}${i.hint ? ` ${styleText("dim", `(${i.hint})`)}` : ""}`,
-        `${r}${styleText("dim", n)} `,
-        `${r}${styleText("dim", n)}${styleText("cyan", S_CHECKBOX_ACTIVE)} `,
-        `${r}${styleText("dim", a)} `
+        o.output,
+        `${a}${n.hint ? ` ${styleText("dim", `(${n.hint})`)}` : ""}`,
+        `${i}${styleText("dim", r)} `,
+        `${i}${styleText("dim", r)}${styleText("cyan", S_CHECKBOX_ACTIVE)} `,
+        `${i}${styleText("dim", c)} `
       );
     if (l === "group-active")
       return wrapTextWithPrefix(
-        u.output,
-        c,
-        `${r}${n} `,
-        `${r}${n}${styleText("cyan", S_CHECKBOX_ACTIVE)} `,
-        `${r}${a} `,
+        o.output,
+        a,
+        `${i}${r} `,
+        `${i}${r}${styleText("cyan", S_CHECKBOX_ACTIVE)} `,
+        `${i}${c} `,
         (d) => styleText("dim", d)
@@ -486,53 +603,53 @@ );
       return wrapTextWithPrefix(
-        u.output,
-        c,
-        `${r}${n} `,
-        `${r}${n}${styleText("green", S_CHECKBOX_SELECTED)} `,
-        `${r}${a} `,
+        o.output,
+        a,
+        `${i}${r} `,
+        `${i}${r}${styleText("green", S_CHECKBOX_SELECTED)} `,
+        `${i}${c} `,
         (d) => styleText("dim", d)
       );
     if (l === "selected") {
-      const d = t || h ? styleText("green", S_CHECKBOX_SELECTED) : "";
+      const d = t || f ? styleText("green", S_CHECKBOX_SELECTED) : "";
       return wrapTextWithPrefix(
-        u.output,
-        `${c}${i.hint ? ` (${i.hint})` : ""}`,
-        `${r}${styleText("dim", n)} `,
-        `${r}${styleText("dim", n)}${d} `,
-        `${r}${styleText("dim", a)} `,
-        (V) => styleText("dim", V)
+        o.output,
+        `${a}${n.hint ? ` (${n.hint})` : ""}`,
+        `${i}${styleText("dim", r)} `,
+        `${i}${styleText("dim", r)}${d} `,
+        `${i}${styleText("dim", c)} `,
+        (S) => styleText("dim", S)
       );
     }
     if (l === "cancelled")
-      return `${styleText(["strikethrough", "dim"], c)}`;
+      return `${styleText(["strikethrough", "dim"], a)}`;
     if (l === "active-selected")
       return wrapTextWithPrefix(
-        u.output,
-        `${c}${i.hint ? ` ${styleText("dim", `(${i.hint})`)}` : ""}`,
-        `${r}${styleText("dim", n)} `,
-        `${r}${styleText("dim", n)}${styleText("green", S_CHECKBOX_SELECTED)} `,
-        `${r}${styleText("dim", a)} `
+        o.output,
+        `${a}${n.hint ? ` ${styleText("dim", `(${n.hint})`)}` : ""}`,
+        `${i}${styleText("dim", r)} `,
+        `${i}${styleText("dim", r)}${styleText("green", S_CHECKBOX_SELECTED)} `,
+        `${i}${styleText("dim", c)} `
       );
     if (l === "submitted")
-      return `${styleText("dim", c)}`;
-    const f = t || h ? styleText("dim", S_CHECKBOX_INACTIVE) : "";
+      return `${styleText("dim", a)}`;
+    const h = t || f ? styleText("dim", S_CHECKBOX_INACTIVE) : "";
     return wrapTextWithPrefix(
-      u.output,
-      c,
-      `${r}${styleText("dim", n)} `,
-      `${r}${styleText("dim", n)}${f} `,
-      `${r}${styleText("dim", a)} `,
+      o.output,
+      a,
+      `${i}${styleText("dim", r)} `,
+      `${i}${styleText("dim", r)}${h} `,
+      `${i}${styleText("dim", c)} `,
       (d) => styleText("dim", d)
     );
-  }, y = u.required ?? true;
+  }, x = o.required ?? true;
   return new GroupMultiSelectPrompt({
-    options: u.options,
-    signal: u.signal,
-    input: u.input,
-    output: u.output,
-    initialValues: u.initialValues,
-    required: y,
-    cursorAt: u.cursorAt,
-    selectableGroups: h,
-    validate(i) {
-      if (y && (i === void 0 || i.length === 0))
+    options: o.options,
+    signal: o.signal,
+    input: o.input,
+    output: o.output,
+    initialValues: o.initialValues,
+    required: x,
+    cursorAt: o.cursorAt,
+    selectableGroups: f,
+    validate(n) {
+      if (x && (n === void 0 || n.length === 0))
         return `Please select at least one option.
@@ -551,53 +668,54 @@ ${styleText(
     render() {
-      const i = u.withGuide ?? settings.withGuide, l = `${i ? `${styleText("gray", S_BAR)}
-` : ""}${symbol(this.state)}  ${u.message}
-`, g = this.value ?? [], c = (t, s) => {
-        const o = this.options, n = g.includes(t.value) || t.group === true && this.isGroupSelected(`${t.value}`);
-        return !s && typeof t.group == "string" && this.options[this.cursor].value === t.group ? m(t, n ? "group-active-selected" : "group-active", o) : s && n ? m(t, "active-selected", o) : n ? m(t, "selected", o) : m(t, s ? "active" : "inactive", o);
+      const n = o.withGuide ?? settings.withGuide, l = `${n ? `${styleText("gray", S_BAR)}
+` : ""}${symbol(this.state)}  ${o.message}
+`, g = this.value ?? [], a = (t, u) => {
+        const s = this.options, r = g.includes(t.value) || t.group === true && this.isGroupSelected(`${t.value}`);
+        return !u && typeof t.group == "string" && this.options[this.cursor].value === t.group ? m(t, r ? "group-active-selected" : "group-active", s) : u && r ? m(t, "active-selected", s) : r ? m(t, "selected", s) : m(t, u ? "active" : "inactive", s);
       };
       switch (this.state) {
         case "submit": {
-          const t = this.options.filter(({ value: o }) => g.includes(o)).map((o) => m(o, "submitted")), s = t.length === 0 ? "" : `  ${t.join(styleText("dim", ", "))}`;
-          return `${l}${i ? styleText("gray", S_BAR) : ""}${s}`;
+          const t = this.options.filter(({ value: s }) => g.includes(s)).map((s) => m(s, "submitted")), u = t.length === 0 ? "" : `  ${t.join(styleText("dim", ", "))}`;
+          return `${l}${n ? styleText("gray", S_BAR) : ""}${u}`;
         }
         case "cancel": {
-          const t = this.options.filter(({ value: s }) => g.includes(s)).map((s) => m(s, "cancelled")).join(styleText("dim", ", "));
-          return `${l}${i ? `${styleText("gray", S_BAR)}  ` : ""}${t.trim() ? `${t}${i ? `
+          const t = this.options.filter(({ value: u }) => g.includes(u)).map((u) => m(u, "cancelled")).join(styleText("dim", ", "));
+          return `${l}${n ? `${styleText("gray", S_BAR)}  ` : ""}${t.trim() ? `${t}${n ? `
 ${styleText("gray", S_BAR)}` : ""}` : ""}`;
         }
         case "error": {
-          const t = i ? `${styleText("yellow", S_BAR)}  ` : "", s = this.error.split(`
+          const t = n ? `${styleText("yellow", S_BAR)}  ` : "", u = this.error.split(`
 `).map(
-            (r, f) => f === 0 ? `${i ? `${styleText("yellow", S_BAR_END)}  ` : ""}${styleText("yellow", r)}` : `   ${r}`
+            (i, h) => h === 0 ? `${n ? `${styleText("yellow", S_BAR_END)}  ` : ""}${styleText("yellow", i)}` : `   ${i}`
           ).join(`
-`), o = l.split(`
-`).length, n = s.split(`
-`).length + 1, a = limitOptions({
-            output: u.output,
+`), s = l.split(`
+`).length, r = u.split(`
+`).length + 1, c = limitOptions({
+            output: o.output,
             options: this.options,
             cursor: this.cursor,
-            maxItems: u.maxItems,
+            maxItems: o.maxItems,
             columnPadding: t.length,
-            rowPadding: o + n,
-            style: c
+            rowPadding: s + r,
+            style: a
           }).join(`
 ${t}`);
-          return `${l}${t}${a}
-${s}
+          return `${l}${t}${c}
+${u}
 `;
         }
         default: {
-          const t = i ? `${styleText("cyan", S_BAR)}  ` : "", s = l.split(`
-`).length, o = (i ? 1 : 0) + 1, n = limitOptions({
-            output: u.output,
+          const t = n ? `${styleText("cyan", S_BAR)}  ` : "", u = l.split(`
+`).length, s = formatInstructionFooter(MULTISELECT_INSTRUCTIONS, n), r = s.join(`
+`), c = s.length + 1, i = limitOptions({
+            output: o.output,
             options: this.options,
             cursor: this.cursor,
-            maxItems: u.maxItems,
+            maxItems: o.maxItems,
             columnPadding: t.length,
-            rowPadding: s + o,
-            style: c
+            rowPadding: u + c,
+            style: a
           }).join(`
 ${t}`);
-          return `${l}${t}${n}
-${i ? styleText("cyan", S_BAR_END) : ""}
+          return `${l}${t}${i}
+${r}
 `;
@@ -724,110 +842,3 @@ }
 
-const d = (n, a) => n.split(`
-`).map((m) => a(m)).join(`
-`);
-const multiselect = (n) => {
-  const a = (t, o) => {
-    const r = t.label ?? String(t.value);
-    return o === "disabled" ? `${styleText("gray", S_CHECKBOX_INACTIVE)} ${d(r, (l) => styleText(["strikethrough", "gray"], l))}${t.hint ? ` ${styleText("dim", `(${t.hint ?? "disabled"})`)}` : ""}` : o === "active" ? `${styleText("cyan", S_CHECKBOX_ACTIVE)} ${r}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}` : o === "selected" ? `${styleText("green", S_CHECKBOX_SELECTED)} ${d(r, (l) => styleText("dim", l))}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}` : o === "cancelled" ? `${d(r, (l) => styleText(["strikethrough", "dim"], l))}` : o === "active-selected" ? `${styleText("green", S_CHECKBOX_SELECTED)} ${r}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}` : o === "submitted" ? `${d(r, (l) => styleText("dim", l))}` : `${styleText("dim", S_CHECKBOX_INACTIVE)} ${d(r, (l) => styleText("dim", l))}`;
-  }, m = n.required ?? true;
-  return new MultiSelectPrompt({
-    options: n.options,
-    signal: n.signal,
-    input: n.input,
-    output: n.output,
-    initialValues: n.initialValues,
-    required: m,
-    cursorAt: n.cursorAt,
-    validate(t) {
-      if (m && (t === void 0 || t.length === 0))
-        return `Please select at least one option.
-${styleText(
-          "reset",
-          styleText(
-            "dim",
-            `Press ${styleText(["gray", "bgWhite", "inverse"], " space ")} to select, ${styleText(
-              "gray",
-              styleText("bgWhite", styleText("inverse", " enter "))
-            )} to submit`
-          )
-        )}`;
-    },
-    render() {
-      const t = n.withGuide ?? settings.withGuide, o = wrapTextWithPrefix(
-        n.output,
-        n.message,
-        t ? `${symbolBar(this.state)}  ` : "",
-        `${symbol(this.state)}  `
-      ), r = `${t ? `${styleText("gray", S_BAR)}
-` : ""}${o}
-`, l = this.value ?? [], g = (i, u) => {
-        if (i.disabled)
-          return a(i, "disabled");
-        const s = l.includes(i.value);
-        return u && s ? a(i, "active-selected") : s ? a(i, "selected") : a(i, u ? "active" : "inactive");
-      };
-      switch (this.state) {
-        case "submit": {
-          const i = this.options.filter(({ value: s }) => l.includes(s)).map((s) => a(s, "submitted")).join(styleText("dim", ", ")) || styleText("dim", "none"), u = wrapTextWithPrefix(
-            n.output,
-            i,
-            t ? `${styleText("gray", S_BAR)}  ` : ""
-          );
-          return `${r}${u}`;
-        }
-        case "cancel": {
-          const i = this.options.filter(({ value: s }) => l.includes(s)).map((s) => a(s, "cancelled")).join(styleText("dim", ", "));
-          if (i.trim() === "")
-            return `${r}${styleText("gray", S_BAR)}`;
-          const u = wrapTextWithPrefix(
-            n.output,
-            i,
-            t ? `${styleText("gray", S_BAR)}  ` : ""
-          );
-          return `${r}${u}${t ? `
-${styleText("gray", S_BAR)}` : ""}`;
-        }
-        case "error": {
-          const i = t ? `${styleText("yellow", S_BAR)}  ` : "", u = this.error.split(`
-`).map(
-            (h, x) => x === 0 ? `${t ? `${styleText("yellow", S_BAR_END)}  ` : ""}${styleText("yellow", h)}` : `   ${h}`
-          ).join(`
-`), s = r.split(`
-`).length, v = u.split(`
-`).length + 1;
-          return `${r}${i}${limitOptions({
-            output: n.output,
-            options: this.options,
-            cursor: this.cursor,
-            maxItems: n.maxItems,
-            columnPadding: i.length,
-            rowPadding: s + v,
-            style: g
-          }).join(`
-${i}`)}
-${u}
-`;
-        }
-        default: {
-          const i = t ? `${styleText("cyan", S_BAR)}  ` : "", u = r.split(`
-`).length, s = t ? 2 : 1;
-          return `${r}${i}${limitOptions({
-            output: n.output,
-            options: this.options,
-            cursor: this.cursor,
-            maxItems: n.maxItems,
-            columnPadding: i.length,
-            rowPadding: u + s,
-            style: g
-          }).join(`
-${i}`)}
-${t ? styleText("cyan", S_BAR_END) : ""}
-`;
-        }
-      }
-    }
-  }).prompt();
-};
-
-const W$1 = (o) => styleText("dim", o), C = (o, e, s) => {
+const W$1 = (o) => o, C = (o, e, s) => {
   const a = {
@@ -837,3 +848,3 @@ hard: true,
   }, i = wrapAnsi(o, e, a).split(`
-`), c = i.reduce((n, r) => Math.max(l(r), n), 0), u = i.map(s).reduce((n, r) => Math.max(l(r), n), 0), g = e - (u - c);
+`), c = i.reduce((n, t) => Math.max(l(t), n), 0), u = i.map(s).reduce((n, t) => Math.max(l(t), n), 0), g = e - (u - c);
   return wrapAnsi(o, g, a);
@@ -843,3 +854,3 @@ };
   const a = s?.output ?? process$1.stdout, i = s?.withGuide ?? settings.withGuide, c = s?.format ?? W$1, g = ["", ...C(o, getColumns(a) - 6, c).split(`
-`).map(c), ""], n = l(e), r = Math.max(
+`).map(c), ""], n = l(e), t = Math.max(
     g.reduce((m, F) => {
@@ -851,3 +862,3 @@ const O = l(F);
   ) + 2, h = g.map(
-    (m) => `${styleText("gray", S_BAR)}  ${m}${" ".repeat(r - l(m))}${styleText("gray", S_BAR)}`
+    (m) => `${styleText("gray", S_BAR)}  ${m}${" ".repeat(t - l(m))}${styleText("gray", S_BAR)}`
   ).join(`
@@ -859,6 +870,6 @@ `), T = i ? `${styleText("gray", S_BAR)}
       "gray",
-      S_BAR_H.repeat(Math.max(r - n - 1, 1)) + S_CORNER_TOP_RIGHT
+      S_BAR_H.repeat(Math.max(t - n - 1, 1)) + S_CORNER_TOP_RIGHT
     )}
 ${h}
-${styleText("gray", l$1 + S_BAR_H.repeat(r + 2) + S_CORNER_BOTTOM_RIGHT)}
+${styleText("gray", l$1 + S_BAR_H.repeat(t + 2) + S_CORNER_BOTTOM_RIGHT)}
 `
@@ -1073,16 +1084,20 @@ );
 
-const c = (e, a) => e.includes(`
-`) ? e.split(`
-`).map((t) => a(t)).join(`
-`) : a(e);
-const select = (e) => {
-  const a = (t, d) => {
-    const s = t.label ?? String(t.value);
-    switch (d) {
+const SELECT_INSTRUCTIONS = [
+  `${styleText("dim", "\u2191/\u2193")} to navigate`,
+  `${styleText("dim", "Enter:")} confirm`
+];
+const c = (t, a) => t.includes(`
+`) ? t.split(`
+`).map((i) => a(i)).join(`
+`) : a(t);
+const select = (t) => {
+  const a = (i, m) => {
+    const s = i.label ?? String(i.value);
+    switch (m) {
       case "disabled":
-        return `${styleText("gray", S_RADIO_INACTIVE)} ${c(s, (n) => styleText("gray", n))}${t.hint ? ` ${styleText("dim", `(${t.hint ?? "disabled"})`)}` : ""}`;
+        return `${styleText("gray", S_RADIO_INACTIVE)} ${c(s, (n) => styleText("gray", n))}${i.hint ? ` ${styleText("dim", `(${i.hint ?? "disabled"})`)}` : ""}`;
       case "selected":
         return `${c(s, (n) => styleText("dim", n))}`;
       case "active":
-        return `${styleText("green", S_RADIO_ACTIVE)} ${s}${t.hint ? ` ${styleText("dim", `(${t.hint})`)}` : ""}`;
+        return `${styleText("green", S_RADIO_ACTIVE)} ${s}${i.hint ? ` ${styleText("dim", `(${i.hint})`)}` : ""}`;
       case "cancelled":
@@ -1095,14 +1110,14 @@ return `${c(s, (n) => styleText(["strikethrough", "dim"], n))}`;
   return new SelectPrompt({
-    options: e.options,
-    signal: e.signal,
-    input: e.input,
-    output: e.output,
-    initialValue: e.initialValue,
+    options: t.options,
+    signal: t.signal,
+    input: t.input,
+    output: t.output,
+    initialValue: t.initialValue,
     render() {
-      const t = e.withGuide ?? settings.withGuide, d = `${symbol(this.state)}  `, s = `${symbolBar(this.state)}  `, n = wrapTextWithPrefix(
-        e.output,
-        e.message,
+      const i = t.withGuide ?? settings.withGuide, m = `${symbol(this.state)}  `, s = `${symbolBar(this.state)}  `, n = wrapTextWithPrefix(
+        t.output,
+        t.message,
         s,
-        d
-      ), u = `${t ? `${styleText("gray", S_BAR)}
+        m
+      ), u = `${i ? `${styleText("gray", S_BAR)}
 ` : ""}${n}
@@ -1112,32 +1127,33 @@ `;
         case "submit": {
-          const r = t ? `${styleText("gray", S_BAR)}  ` : "", l = wrapTextWithPrefix(
-            e.output,
+          const r = i ? `${styleText("gray", S_BAR)}  ` : "", o = wrapTextWithPrefix(
+            t.output,
             a(this.options[this.cursor], "selected"),
             r
           );
-          return `${u}${l}`;
+          return `${u}${o}`;
         }
         case "cancel": {
-          const r = t ? `${styleText("gray", S_BAR)}  ` : "", l = wrapTextWithPrefix(
-            e.output,
+          const r = i ? `${styleText("gray", S_BAR)}  ` : "", o = wrapTextWithPrefix(
+            t.output,
             a(this.options[this.cursor], "cancelled"),
             r
           );
-          return `${u}${l}${t ? `
+          return `${u}${o}${i ? `
 ${styleText("gray", S_BAR)}` : ""}`;
         }
         default: {
-          const r = t ? `${styleText("cyan", S_BAR)}  ` : "", l = t ? styleText("cyan", S_BAR_END) : "", g = u.split(`
-`).length, h = t ? 2 : 1;
+          const r = i ? `${styleText("cyan", S_BAR)}  ` : "", o = u.split(`
+`).length, $ = formatInstructionFooter(SELECT_INSTRUCTIONS, i), h = $.join(`
+`), b = $.length + 1;
           return `${u}${r}${limitOptions({
-            output: e.output,
+            output: t.output,
             cursor: this.cursor,
             options: this.options,
-            maxItems: e.maxItems,
+            maxItems: t.maxItems,
             columnPadding: r.length,
-            rowPadding: g + h,
-            style: (p, b) => a(p, p.disabled ? "disabled" : b ? "active" : "inactive")
+            rowPadding: o + b,
+            style: (p, x) => a(p, p.disabled ? "disabled" : x ? "active" : "inactive")
           }).join(`
 ${r}`)}
-${l}
+${h}
 `;
@@ -1396,2 +1412,2 @@ }
 
-export { S_BAR, S_BAR_END, S_BAR_END_RIGHT, S_BAR_H, S_BAR_START, S_BAR_START_RIGHT, S_CHECKBOX_ACTIVE, S_CHECKBOX_INACTIVE, S_CHECKBOX_SELECTED, S_CONNECT_LEFT, S_CORNER_BOTTOM_LEFT, S_CORNER_BOTTOM_RIGHT, S_CORNER_TOP_LEFT, S_CORNER_TOP_RIGHT, S_ERROR, S_INFO, S_PASSWORD_MASK, S_RADIO_ACTIVE, S_RADIO_INACTIVE, S_STEP_ACTIVE, S_STEP_CANCEL, S_STEP_ERROR, S_STEP_SUBMIT, S_SUCCESS, S_WARN, autocomplete, autocompleteMultiselect, box, cancel, confirm, date, group, groupMultiselect, intro, isCI, isTTY, limitOptions, log, multiline, multiselect, note, outro, password, path, progress, select, selectKey, spinner, stream, symbol, symbolBar, taskLog, tasks, text, unicode, unicodeOr };
+export { MULTISELECT_INSTRUCTIONS, SELECT_INSTRUCTIONS, S_BAR, S_BAR_END, S_BAR_END_RIGHT, S_BAR_H, S_BAR_START, S_BAR_START_RIGHT, S_CHECKBOX_ACTIVE, S_CHECKBOX_INACTIVE, S_CHECKBOX_SELECTED, S_CONNECT_LEFT, S_CORNER_BOTTOM_LEFT, S_CORNER_BOTTOM_RIGHT, S_CORNER_TOP_LEFT, S_CORNER_TOP_RIGHT, S_ERROR, S_INFO, S_PASSWORD_MASK, S_RADIO_ACTIVE, S_RADIO_INACTIVE, S_STEP_ACTIVE, S_STEP_CANCEL, S_STEP_ERROR, S_STEP_SUBMIT, S_SUCCESS, S_WARN, autocomplete, autocompleteMultiselect, box, cancel, confirm, date, formatInstructionFooter, group, groupMultiselect, intro, isCI, isTTY, limitOptions, log, multiline, multiselect, note, outro, password, path, progress, select, selectKey, spinner, stream, symbol, symbolBar, taskLog, tasks, text, unicode, unicodeOr };

package.json

 {
   "name": "@clack/prompts",
-  "version": "1.5.1",
+  "version": "1.6.0",
   "type": "module",
@@ -56,3 +56,3 @@ "main": "./dist/index.mjs",
     "sisteransi": "^1.0.5",
-    "@clack/core": "1.4.1"
+    "@clack/core": "1.4.2"
   },
@@ -59,0 +59,0 @@ "devDependencies": {

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Improved metrics

Total package byte prevSize

114331

1.92%

Lines of code

1381

1.17%

Number of medium supply chain risk alerts

0

-100%

Dependency changes

• + Added

  @clack/core@1.4.2
  (transitive)

• - Removed

  @clack/core@1.4.1
  (transitive)

• Updated

  @clack/core@1.4.2