@topcli/prompts 0.0.1 → 0.0.3

package/README.md

@@ -24,45 +24,67 @@ $ yarn add @topcli/prompts
 
 ## Usage exemple
 
+You can locally run `node ./demo.js`
+
 ```js
-import { prompt, select, confirm } from '@topcli/prompts'
-
-const name = await prompt('What\'s your name ?')
-const gender = await select('What\'s your gender ?', {
-  choices: [
-    {
-      value: 'M',
-      label: 'Male'
-    },
-    {
-      value: 'F',
-      label: 'Female'
-    },
-  ]
-})
-const isAdult = await confirm('Are you over 18 ?', { initial: true })
+import { prompt, confirm, select } from '@topcli/prompts'
+
+const kTestRunner = ['node', 'tap', 'tape', 'vitest', 'mocha', 'ava']
+
+const name = await prompt('Project name ?')
+const runner = await select('Choose a test runner', { choices: kTestRunner, maxVisible: 5 })
+const isCLI = await confirm('Your project is a CLI ?', { initial: true })
+
+console.log(name, runner, isCLI)
 ```
 
 ## API
 
-### `prompt(message: string): Promise<string>`
+### `prompt()`
+
+```ts
+prompt(message: string): Promise<string>
+```
 
 Simple prompt, similar to `rl.question()` with an improved UI.
 
-### `select(message: string, options: { choices: (Choice | string)[], maxVisible?: number }): Promise<string>`
+### `select()`
+
+```ts
+select(message: string, options: SelectOptions): Promise<string>
+```
 
 Scrollable select depending `maxVisible` (default `8`).
+Use `ignoreValues` to skip result render & clear lines after a selected one.
 
-### `confirm(message: string, options?: { initial: boolean }): Promise<string>`
+### `confirm()`
 
-Boolean prompt.
+```ts
+confirm(message: string, options?: ConfirmOptions): Promise<string>
+```
+
+Boolean prompt, return `options.initial` if user input is different from "y"/"yes"/"n"/"no", (default `false`).
 
 ## Interfaces
 
 ```ts
 export interface Choice {
-  value: any,
-  label: string,
-  description?: string,
+  value: any;
+  label: string;
+  description?: string;
+}
+```
+
+```ts
+export interface SelectOptions {
+  choices: (Choice | string)[];
+  maxVisible?: number = 8;
+  ignoreValues?: (string | number | boolean)[];
+}
+```
+
+```ts
+export interface ConfirmOptions {
+  initial?: boolean = false;
 }
 ```

package/index.d.ts

@@ -1,8 +1,19 @@
 export interface Choice {
-  value: any,
-  label: string,
-  description?: string,
+  value: any;
+  label: string;
+  description?: string;
 }
+
+export interface SelectOptions {
+  choices: (Choice | string)[];
+  maxVisible?: number;
+  ignoreValues?: (string | number | boolean)[];
+}
+
+export interface ConfirmOptions {
+  initial?: boolean;
+}
+
 export function prompt(message: string): Promise<string>;
-export function select(message: string, options: { choices: (Choice | string)[], maxVisble?: number }): Promise<string>;
-export function confirm(message: string, options?: { initial: boolean }): Promise<string>;
+export function select(message: string, options: SelectOptions): Promise<string>;
+export function confirm(message: string, options?: ConfirmOptions): Promise<string>;

package/index.js

@@ -1,167 +1,22 @@
-import { createInterface } from 'node:readline/promises'
+// Import Internal Dependencies
+import { ConfirmPrompt } from "./src/confirm-prompt.js";
+import { SelectPrompt } from "./src/select-prompt.js";
+import { TextPrompt } from "./src/text-prompt.js";
 
-import ansi from 'ansi-styles'
+export async function prompt(message) {
+  const textPrompt = new TextPrompt(message);
 
-const kQuestionMark = `${ansi.blue.open}?${ansi.blue.close}`
-const kTick = `${ansi.green.open}✔${ansi.green.close}`
-const kCross = `${ansi.red.open}✖${ansi.red.close}`
-const kPointer = `${ansi.gray.open}›${ansi.gray.close}`
-const kActive = `${ansi.reset.open}${kPointer} `
-const kInactive = `${ansi.gray.open}  `
-const kPrevious = '⭡'
-const kNext = '⭣'
-const kShowCursor = '\x1B[?25h'
-const kHideCursor = '\x1B[?25l'
-
-function clearLastLine () {
-  process.stdout.moveCursor(0, -1)
-  process.stdout.clearLine()
-}
-
-export async function prompt (message) {
-  if (typeof message !== 'string') {
-    throw new TypeError('message must be a string')
-  }
-
-  const { stdin: input, stdout: output } = process
-  const rl = createInterface({ input, output })
-
-  const answer = await rl.question(`${ansi.bold.open} ${kPointer} ${message} ${ansi.bold.close}`)
-
-  clearLastLine()
-  console.log(`${ansi.bold.open}${answer ? kTick : kCross} ${message} ${kPointer} ${ansi.yellow.open}${answer}${ansi.yellow.close}${ansi.bold.close}`)
-
-  rl.close()
-
-  return answer
+  return textPrompt.question();
 }
 
-export async function select (message, options) {
-  if (typeof message !== 'string') {
-    throw new TypeError('message must be a string')
-  }
-
-  if (!options) {
-    throw new TypeError('Missing required options')
-  }
-
-  const { choices } = options
-
-  if (!choices?.length) {
-    throw new TypeError('Missing required param: choices')
-  }
-
-  const longestChoice = Math.max(...choices.map(choice => {
-    if (typeof choice === 'string') {
-      return choice.length
-    }
-
-    const kRequiredChoiceProperties = ['label', 'value']
-
-    for (const prop of kRequiredChoiceProperties) {
-      if (!choice[prop]) {
-        throw new TypeError(`Missing ${prop} for choice ${JSON.stringify(choice)}`)
-      }
-    }
-
-    return choice.label.length
-  }))
-
-  process.stdout.write(kHideCursor)
-  const { stdin: input, stdout: output } = process
-  const rl = createInterface({ input, output })
-
-  let activeIndex = 0
-
-  console.log(`${ansi.bold.open}${kQuestionMark} ${message}${ansi.bold.close}`)
-
-  let lastRender = null
-  const render = (initialRender = false, { reset } = {}) => {
-    const getVisibleChoices = (currentIndex, total, maxVisible) => {
-      maxVisible = maxVisible || total
+export async function select(message, options) {
+  const selectPrompt = new SelectPrompt(message, options);
 
-      let startIndex = Math.min(total - maxVisible, currentIndex - Math.floor(maxVisible / 2))
-      if (startIndex < 0) {
-        startIndex = 0
-      }
-
-      const endIndex = Math.min(startIndex + maxVisible, total)
-
-      return { startIndex, endIndex }
-    }
-
-    const { startIndex, endIndex } = getVisibleChoices(activeIndex, choices.length, options.maxVisible || 8)
-
-    if (!initialRender) {
-      const linesToClear = lastRender.endIndex - lastRender.startIndex
-      process.stdout.clearLine(1)
-      process.stdout.moveCursor(0, -linesToClear)
-      process.stdout.clearLine(1)
-    }
-
-    if (reset) {
-      clearLastLine()
-      clearLastLine()
-      return
-    }
-
-    lastRender = { startIndex, endIndex }
-
-    for (let i = startIndex; i < endIndex; i++) {
-      const choice = typeof choices[i] === 'string' ? { value: choices[i], label: choices[i] } : choices[i]
-      const prefix = `${startIndex > 0 && i === startIndex ? kPrevious : endIndex < choices.length && i === endIndex - 1 ? kNext : ' '}${i === activeIndex ? kActive : kInactive}`
-      const str = `${prefix}${choice.label.padEnd(longestChoice < 10 ? longestChoice : 0)}${choice.description ? ` - ${choice.description}` : ''}${ansi.reset.open}`
-      console.log(str)
-    }
-  }
-
-  render(true)
-
-  return new Promise((resolve) => {
-    const onKeypress = (value, key) => {
-      if (key.name === 'up') {
-        activeIndex = activeIndex === 0 ? choices.length - 1 : activeIndex - 1
-        render()
-      } else if (key.name === 'down') {
-        activeIndex = activeIndex === choices.length - 1 ? 0 : activeIndex + 1
-        render()
-      } else if (key.name === 'return') {
-        process.stdin.off('keypress', onKeypress)
-        render(false, { reset: true })
-
-        console.log(`${ansi.bold.open}${kTick} ${message} ${kPointer} ${ansi.yellow.open}${choices[activeIndex].value}${ansi.reset.open}`)
-
-        process.stderr.write(kShowCursor)
-        rl.close()
-
-        resolve(choices[activeIndex].value)
-      }
-    }
-
-    process.stdin.on('keypress', onKeypress)
-  })
+  return selectPrompt.select();
 }
 
-const kDefaultConfirmOptions = { initial: false }
-
-export async function confirm (message, options = kDefaultConfirmOptions) {
-  if (typeof message !== 'string') {
-    throw new TypeError('message must be a string')
-  }
-
-  const { initial } = { kDefaultConfirmOptions, ...options }
-
-  const { stdin: input, stdout: output } = process
-  const rl = createInterface({ input, output })
-
-  const tip = initial ? `${ansi.bold.open}Yes${ansi.bold.close}/no` : `yes/${ansi.bold.open}No${ansi.bold.close}`
-  const answer = await rl.question(`${kQuestionMark} ${message} ${ansi.grey.open}(${tip})${ansi.grey.close} ${kPointer} `)
-  const result = (!answer && initial) || ['y', 'yes'].includes(answer.toLocaleLowerCase())
-
-  clearLastLine()
-  console.log(`${result ? kTick : kCross} ${message}`)
-
-  rl.close()
+export async function confirm(message, options) {
+  const confirmPrompt = new ConfirmPrompt(message, options);
 
-  return result
+  return confirmPrompt.confirm();
 }

package/package.json

@@ -1,10 +1,12 @@
 {
   "name": "@topcli/prompts",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "Node.js user input library for command-line interfaces.",
   "scripts": {
-    "test": "node --test ./test/**.test.js",
-    "lint": "standard --fix | snazzy"
+    "test": "node --loader=esmock --test ./test/**.test.js",
+    "coverage": "c8 -r html npm run test",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix"
   },
   "main": "./index.js",
   "keywords": [
@@ -14,14 +16,19 @@
   ],
   "files": [
     "index.js",
-    "index.d.ts"
+    "index.d.ts",
+    "src"
   ],
   "author": "PierreDemailly <pierredemailly.pro@gmail.com>",
   "license": "ISC",
   "type": "module",
   "devDependencies": {
+    "@nodesecure/eslint-config": "^1.7.0",
+    "c8": "^7.13.0",
+    "eslint": "^8.38.0",
+    "esmock": "^2.1.0",
     "snazzy": "^9.0.0",
-    "standard": "^17.0.0"
+    "strip-ansi": "^7.0.1"
   },
   "dependencies": {
     "ansi-styles": "^6.2.1"
@@ -32,8 +39,5 @@
   "bugs": {
     "url": "https://github.com/TopCli/prompts/issues"
   },
-  "homepage": "https://github.com/TopCli/prompts#readme",
-  "publishConfig": {
-    "access": "public"
-  }
+  "homepage": "https://github.com/TopCli/prompts#readme"
 }

package/src/abstract-prompt.js

@@ -0,0 +1,32 @@
+// Import Node.js Dependencies
+import { createInterface } from "node:readline";
+
+export class AbstractPrompt {
+  constructor(message, input = process.stdin, output = process.stdout) {
+    if (this.constructor === AbstractPrompt) {
+      throw new Error("AbstractPrompt can't be instantiated.");
+    }
+
+    if (typeof message !== "string") {
+      throw new TypeError(`message must be string, ${typeof message} given.`);
+    }
+
+    this.stdin = input;
+    this.stdout = output;
+    this.message = message;
+
+    if (this.stdout.isTTY) {
+      this.stdin.setRawMode(true);
+    }
+    this.rl = createInterface({ input, output });
+  }
+
+  clearLastLine() {
+    this.stdout.moveCursor(0, -1);
+    this.stdout.clearLine();
+  }
+
+  destroy() {
+    this.rl.close();
+  }
+}

package/src/confirm-prompt.js

@@ -0,0 +1,62 @@
+// Import Node.js Dependencies
+import { EOL } from "node:os";
+
+// Import Third-party Dependencies
+import ansi from "ansi-styles";
+
+// Import Internal Dependencies
+import { AbstractPrompt } from "./abstract-prompt.js";
+import { SYMBOLS } from "./constants.js";
+
+const kDefaultConfirmOptions = { initial: false };
+
+export class ConfirmPrompt extends AbstractPrompt {
+  #question;
+
+  // eslint-disable-next-line max-params
+  constructor(message, options = {}, stdin = process.stdin, stdout = process.stdout) {
+    super(message, stdin, stdout);
+
+    const { initial } = { ...kDefaultConfirmOptions, ...options };
+    const Yes = `${ansi.bold.open}Yes${ansi.bold.close}`;
+    const No = `${ansi.bold.open}No${ansi.bold.close}`;
+    const tip = initial ? `${Yes}/no` : `yes/${No}`;
+
+    this.initial = initial;
+    this.#question = new Promise((resolve) => {
+      const question = `\
+      ${ansi.bold.open}${SYMBOLS.QuestionMark} ${message}${ansi.bold.close}  ${ansi.grey.open}(${tip})${ansi.grey.close} `;
+      this.rl.question.bind(this.rl)(question,
+        (answer) => {
+          resolve(answer);
+        }
+      );
+    });
+  }
+
+  #onQuestionAnswer() {
+    this.clearLastLine();
+    this.stdout.write(`${this.answer ? SYMBOLS.Tick : SYMBOLS.Cross} ${this.message}${EOL}`);
+  }
+
+  #validateResult(result) {
+    if (typeof result !== "string") {
+      return false;
+    }
+
+    return ["y", "yes", "no", "n"].includes(result.toLowerCase());
+  }
+
+  async confirm() {
+    try {
+      const result = await this.#question;
+      this.answer = this.#validateResult(result) ? ["y", "yes"].includes(result.toLocaleLowerCase()) : this.initial;
+      this.#onQuestionAnswer();
+
+      return this.answer;
+    }
+    finally {
+      this.destroy();
+    }
+  }
+}

package/src/constants.js

@@ -0,0 +1,17 @@
+// Import Third-party Dependencies
+import ansi from "ansi-styles";
+
+const kPointer = `${ansi.gray.open}›${ansi.gray.close}`;
+
+export const SYMBOLS = {
+  QuestionMark: `${ansi.blue.open}?${ansi.blue.close}`,
+  Tick: `${ansi.green.open}✔${ansi.green.close}`,
+  Cross: `${ansi.red.open}✖${ansi.red.close}`,
+  Pointer: kPointer,
+  Active: `${ansi.reset.open}${kPointer}`,
+  Inactive: `${ansi.gray.open}`,
+  Previous: "⭡",
+  Next: "⭣",
+  ShowCursor: "\x1B[?25h",
+  HideCursor: "\x1B[?25l"
+};

package/src/select-prompt.js

@@ -0,0 +1,136 @@
+// Import Node.js Dependencies
+import { EOL } from "node:os";
+
+// Import Third-party Dependencies
+import ansi from "ansi-styles";
+
+// Import Internal Dependencies
+import { AbstractPrompt } from "./abstract-prompt.js";
+import { SYMBOLS } from "./constants.js";
+
+export class SelectPrompt extends AbstractPrompt {
+  activeIndex = 0;
+
+  // eslint-disable-next-line max-params
+  constructor(message, options, stdin = process.stdin, stdout = process.stdout) {
+    super(message, stdin, stdout);
+
+    if (!options) {
+      this.destroy();
+      throw new TypeError("Missing required options");
+    }
+
+    this.options = options;
+    const { choices } = options;
+
+    if (!choices?.length) {
+      this.destroy();
+      throw new TypeError("Missing required param: choices");
+    }
+
+    this.choices = choices;
+    this.longestChoice = Math.max(...choices.map((choice) => {
+      if (typeof choice === "string") {
+        return choice.length;
+      }
+
+      const kRequiredChoiceProperties = ["label", "value"];
+
+      for (const prop of kRequiredChoiceProperties) {
+        if (!choice[prop]) {
+          this.destroy();
+          throw new TypeError(`Missing ${prop} for choice ${JSON.stringify(choice)}`);
+        }
+      }
+
+      return choice.label.length;
+    }));
+  }
+
+  async select() {
+    this.stdout.write(SYMBOLS.HideCursor);
+    this.stdout.write(`${ansi.bold.open}${SYMBOLS.QuestionMark} ${this.message}${ansi.bold.close}${EOL}`);
+
+    let lastRender = null;
+    const render = (initialRender = false, { reset } = {}) => {
+      function getVisibleChoices(currentIndex, total, maxVisible) {
+        let startIndex = Math.min(total - maxVisible, currentIndex - Math.floor(maxVisible / 2));
+        if (startIndex < 0) {
+          startIndex = 0;
+        }
+
+        const endIndex = Math.min(startIndex + maxVisible, total);
+
+        return { startIndex, endIndex };
+      }
+
+      const { startIndex, endIndex } = getVisibleChoices(this.activeIndex, this.choices.length, this.options.maxVisible || 8);
+
+      if (!initialRender) {
+        const linesToClear = lastRender.endIndex - lastRender.startIndex;
+        this.stdout.moveCursor(0, -linesToClear);
+        this.stdout.clearScreenDown();
+      }
+
+      if (reset) {
+        this.clearLastLine(this.stdout);
+        this.clearLastLine(this.stdout);
+
+        return;
+      }
+
+      lastRender = { startIndex, endIndex };
+
+      for (let i = startIndex; i < endIndex; i++) {
+        const choice = typeof this.choices[i] === "string" ? { value: this.choices[i], label: this.choices[i] } : this.choices[i];
+        const showPreviousChoicesArrow = startIndex > 0 && i === startIndex;
+        const showNextChoicesArrow = endIndex < this.choices.length && i === endIndex - 1;
+        let prefixArrow = " ";
+        if (showPreviousChoicesArrow) {
+          prefixArrow = SYMBOLS.Previous;
+        }
+        else if (showNextChoicesArrow) {
+          prefixArrow = SYMBOLS.Next;
+        }
+        const prefix = `${prefixArrow}${i === this.activeIndex ? `${SYMBOLS.Active} ` : `${SYMBOLS.Inactive}  `}`;
+        const str = `${prefix}${choice.label.padEnd(
+          this.longestChoice < 10 ? this.longestChoice : 0
+        )}${choice.description ? ` - ${choice.description}` : ""}${ansi.reset.open}${EOL}`;
+        this.stdout.write(str);
+      }
+    };
+
+    render(true);
+
+    return new Promise((resolve) => {
+      const onKeypress = (value, key) => {
+        if (key.name === "up") {
+          this.activeIndex = this.activeIndex === 0 ? this.choices.length - 1 : this.activeIndex - 1;
+          render();
+        }
+        else if (key.name === "down") {
+          this.activeIndex = this.activeIndex === this.choices.length - 1 ? 0 : this.activeIndex + 1;
+          render();
+        }
+        else if (key.name === "return") {
+          this.stdin.off("keypress", onKeypress);
+
+          render(false, { reset: true });
+          const currentChoice = this.choices[this.activeIndex];
+          const value = currentChoice.value ?? currentChoice;
+          if (!this.options.ignoreValues?.includes(value)) {
+            const prefix = `${ansi.bold.open}${SYMBOLS.Tick} ${this.message} ${SYMBOLS.Pointer}`;
+            const choice = `${ansi.yellow.open}${currentChoice.label ?? currentChoice}${ansi.reset.open}`;
+            this.stdout.write(`${prefix} ${choice}${EOL}`);
+          }
+
+          this.stdout.write(SYMBOLS.ShowCursor);
+          this.destroy();
+          resolve(value);
+        }
+      };
+
+      this.stdin.on("keypress", onKeypress);
+    });
+  }
+}

package/src/text-prompt.js

@@ -0,0 +1,43 @@
+// Import Node.js Dependencies
+import { EOL } from "node:os";
+
+// Import Third-party Dependencies
+import ansi from "ansi-styles";
+
+// Import Internal Dependencies
+import { AbstractPrompt } from "./abstract-prompt.js";
+import { SYMBOLS } from "./constants.js";
+
+export class TextPrompt extends AbstractPrompt {
+  #question;
+
+  constructor(message, stdin = process.stdin, stdout = process.stdout) {
+    super(message, stdin, stdout);
+
+    this.#question = new Promise((resolve) => {
+      this.rl.question(`${ansi.bold.open}${SYMBOLS.QuestionMark} ${message}${ansi.bold.close} `, (answer) => {
+        resolve(answer);
+      });
+    });
+  }
+
+  #onQuestionAnswer() {
+    this.clearLastLine();
+    const prefix = `${ansi.bold.open}${this.answer ? SYMBOLS.Tick : SYMBOLS.Cross}`;
+    const suffix = `${ansi.yellow.close}${ansi.bold.close}${EOL}`;
+    this.stdout.write(`${prefix} ${this.message} ${SYMBOLS.Pointer} ${ansi.yellow.open}${this.answer ?? ""}${suffix}`);
+  }
+
+  async question() {
+    try {
+      this.answer = await this.#question;
+
+      this.#onQuestionAnswer();
+
+      return this.answer;
+    }
+    finally {
+      this.destroy();
+    }
+  }
+}