@inquirer/select 2.4.7 → 3.0.0

package/README.md

@@ -118,20 +118,22 @@ Here's each property:
 - `short`: Once the prompt is done (press enter), we'll use `short` if defined to render next to the question. By default we'll use `name`.
 - `disabled`: Disallow the option from being selected. If `disabled` is a string, it'll be used as a help tip explaining why the choice isn't available.
 
+`choices` can also be an array of string, in which case the string will be used both as the `value` and the `name`.
+
 ## Theming
 
 You can theme a prompt by passing a `theme` object option. The theme object only need to includes the keys you wish to modify, we'll fallback on the defaults for the rest.
 
 ```ts
 type Theme = {
-  prefix: string;
+  prefix: string | { idle: string; done: string };
   spinner: {
     interval: number;
     frames: string[];
   };
   style: {
     answer: (text: string) => string;
-    message: (text: string) => string;
+    message: (text: string, status: 'idle' | 'done' | 'loading') => string;
     error: (text: string) => string;
     help: (text: string) => string;
     highlight: (text: string) => string;

package/dist/cjs/index.js

@@ -19,14 +19,37 @@ const selectTheme = {
 function isSelectable(item) {
     return !core_1.Separator.isSeparator(item) && !item.disabled;
 }
+function normalizeChoices(choices) {
+    return choices.map((choice) => {
+        var _a, _b, _c;
+        if (core_1.Separator.isSeparator(choice))
+            return choice;
+        if (typeof choice === 'string') {
+            return {
+                value: choice,
+                name: choice,
+                short: choice,
+                disabled: false,
+            };
+        }
+        const name = (_a = choice.name) !== null && _a !== void 0 ? _a : String(choice.value);
+        return {
+            value: choice.value,
+            name,
+            description: choice.description,
+            short: (_b = choice.short) !== null && _b !== void 0 ? _b : name,
+            disabled: (_c = choice.disabled) !== null && _c !== void 0 ? _c : false,
+        };
+    });
+}
 exports.default = (0, core_1.createPrompt)((config, done) => {
-    var _a, _b;
-    const { choices: items, loop = true, pageSize = 7 } = config;
+    const { loop = true, pageSize = 7 } = config;
     const firstRender = (0, core_1.useRef)(true);
     const theme = (0, core_1.makeTheme)(selectTheme, config.theme);
-    const prefix = (0, core_1.usePrefix)({ theme });
-    const [status, setStatus] = (0, core_1.useState)('pending');
+    const [status, setStatus] = (0, core_1.useState)('idle');
+    const prefix = (0, core_1.usePrefix)({ status, theme });
     const searchTimeoutRef = (0, core_1.useRef)();
+    const items = (0, core_1.useMemo)(() => normalizeChoices(config.choices), [config.choices]);
     const bounds = (0, core_1.useMemo)(() => {
         const first = items.findIndex(isSelectable);
         const last = items.findLastIndex(isSelectable);
@@ -79,9 +102,7 @@ exports.default = (0, core_1.createPrompt)((config, done) => {
             const matchIndex = items.findIndex((item) => {
                 if (core_1.Separator.isSeparator(item) || !isSelectable(item))
                     return false;
-                return String(item.name || item.value)
-                    .toLowerCase()
-                    .startsWith(searchTerm);
+                return item.name.toLowerCase().startsWith(searchTerm);
             });
             if (matchIndex >= 0) {
                 setActive(matchIndex);
@@ -94,7 +115,7 @@ exports.default = (0, core_1.createPrompt)((config, done) => {
     (0, core_1.useEffect)(() => () => {
         clearTimeout(searchTimeoutRef.current);
     }, []);
-    const message = theme.style.message(config.message);
+    const message = theme.style.message(config.message, status);
     let helpTipTop = '';
     let helpTipBottom = '';
     if (theme.helpMode === 'always' ||
@@ -114,23 +135,19 @@ exports.default = (0, core_1.createPrompt)((config, done) => {
             if (core_1.Separator.isSeparator(item)) {
                 return ` ${item.separator}`;
             }
-            const line = String(item.name || item.value);
             if (item.disabled) {
                 const disabledLabel = typeof item.disabled === 'string' ? item.disabled : '(disabled)';
-                return theme.style.disabled(`${line} ${disabledLabel}`);
+                return theme.style.disabled(`${item.name} ${disabledLabel}`);
             }
             const color = isActive ? theme.style.highlight : (x) => x;
             const cursor = isActive ? theme.icon.cursor : ` `;
-            return color(`${cursor} ${line}`);
+            return color(`${cursor} ${item.name}`);
         },
         pageSize,
         loop,
     });
     if (status === 'done') {
-        const answer = (_b = (_a = selectedChoice.short) !== null && _a !== void 0 ? _a : selectedChoice.name) !== null && _b !== void 0 ? _b : 
-        // TODO: Could we enforce that at the type level? Name should be defined for non-string values.
-        String(selectedChoice.value);
-        return `${prefix} ${message} ${theme.style.answer(answer)}`;
+        return `${prefix} ${message} ${theme.style.answer(selectedChoice.short)}`;
     }
     const choiceDescription = selectedChoice.description
         ? `\n${theme.style.description(selectedChoice.description)}`

package/dist/cjs/types/index.d.ts

@@ -20,11 +20,13 @@ type Choice<Value> = {
 };
 declare const _default: <Value>(config: {
     message: string;
-    choices: readonly (Separator | Choice<Value>)[];
+    choices: readonly (string | Separator)[] | readonly (Separator | Choice<Value>)[];
     pageSize?: number | undefined;
     loop?: boolean | undefined;
     default?: unknown;
     theme?: PartialDeep<Theme<SelectTheme>> | undefined;
-}, context?: import("@inquirer/type").Context) => import("@inquirer/type").CancelablePromise<Value>;
+}, context?: import("@inquirer/type").Context) => Promise<Value> & {
+    cancel: () => void;
+};
 export default _default;
 export { Separator } from '@inquirer/core';

package/dist/esm/index.mjs

@@ -13,13 +13,36 @@ const selectTheme = {
 function isSelectable(item) {
     return !Separator.isSeparator(item) && !item.disabled;
 }
+function normalizeChoices(choices) {
+    return choices.map((choice) => {
+        if (Separator.isSeparator(choice))
+            return choice;
+        if (typeof choice === 'string') {
+            return {
+                value: choice,
+                name: choice,
+                short: choice,
+                disabled: false,
+            };
+        }
+        const name = choice.name ?? String(choice.value);
+        return {
+            value: choice.value,
+            name,
+            description: choice.description,
+            short: choice.short ?? name,
+            disabled: choice.disabled ?? false,
+        };
+    });
+}
 export default createPrompt((config, done) => {
-    const { choices: items, loop = true, pageSize = 7 } = config;
+    const { loop = true, pageSize = 7 } = config;
     const firstRender = useRef(true);
     const theme = makeTheme(selectTheme, config.theme);
-    const prefix = usePrefix({ theme });
-    const [status, setStatus] = useState('pending');
+    const [status, setStatus] = useState('idle');
+    const prefix = usePrefix({ status, theme });
     const searchTimeoutRef = useRef();
+    const items = useMemo(() => normalizeChoices(config.choices), [config.choices]);
     const bounds = useMemo(() => {
         const first = items.findIndex(isSelectable);
         const last = items.findLastIndex(isSelectable);
@@ -72,9 +95,7 @@ export default createPrompt((config, done) => {
             const matchIndex = items.findIndex((item) => {
                 if (Separator.isSeparator(item) || !isSelectable(item))
                     return false;
-                return String(item.name || item.value)
-                    .toLowerCase()
-                    .startsWith(searchTerm);
+                return item.name.toLowerCase().startsWith(searchTerm);
             });
             if (matchIndex >= 0) {
                 setActive(matchIndex);
@@ -87,7 +108,7 @@ export default createPrompt((config, done) => {
     useEffect(() => () => {
         clearTimeout(searchTimeoutRef.current);
     }, []);
-    const message = theme.style.message(config.message);
+    const message = theme.style.message(config.message, status);
     let helpTipTop = '';
     let helpTipBottom = '';
     if (theme.helpMode === 'always' ||
@@ -107,24 +128,19 @@ export default createPrompt((config, done) => {
             if (Separator.isSeparator(item)) {
                 return ` ${item.separator}`;
             }
-            const line = String(item.name || item.value);
             if (item.disabled) {
                 const disabledLabel = typeof item.disabled === 'string' ? item.disabled : '(disabled)';
-                return theme.style.disabled(`${line} ${disabledLabel}`);
+                return theme.style.disabled(`${item.name} ${disabledLabel}`);
             }
             const color = isActive ? theme.style.highlight : (x) => x;
             const cursor = isActive ? theme.icon.cursor : ` `;
-            return color(`${cursor} ${line}`);
+            return color(`${cursor} ${item.name}`);
         },
         pageSize,
         loop,
     });
     if (status === 'done') {
-        const answer = selectedChoice.short ??
-            selectedChoice.name ??
-            // TODO: Could we enforce that at the type level? Name should be defined for non-string values.
-            String(selectedChoice.value);
-        return `${prefix} ${message} ${theme.style.answer(answer)}`;
+        return `${prefix} ${message} ${theme.style.answer(selectedChoice.short)}`;
     }
     const choiceDescription = selectedChoice.description
         ? `\n${theme.style.description(selectedChoice.description)}`

package/dist/esm/types/index.d.mts

@@ -20,11 +20,13 @@ type Choice<Value> = {
 };
 declare const _default: <Value>(config: {
     message: string;
-    choices: readonly (Separator | Choice<Value>)[];
+    choices: readonly (string | Separator)[] | readonly (Separator | Choice<Value>)[];
     pageSize?: number | undefined;
     loop?: boolean | undefined;
     default?: unknown;
     theme?: PartialDeep<Theme<SelectTheme>> | undefined;
-}, context?: import("@inquirer/type").Context) => import("@inquirer/type").CancelablePromise<Value>;
+}, context?: import("@inquirer/type").Context) => Promise<Value> & {
+    cancel: () => void;
+};
 export default _default;
 export { Separator } from '@inquirer/core';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inquirer/select",
-  "version": "2.4.7",
+  "version": "3.0.0",
   "description": "Inquirer select/list prompt",
   "main": "./dist/cjs/index.js",
   "typings": "./dist/cjs/types/index.d.ts",
@@ -54,14 +54,14 @@
   "license": "MIT",
   "homepage": "https://github.com/SBoudrias/Inquirer.js/blob/main/packages/select/README.md",
   "dependencies": {
-    "@inquirer/core": "^9.0.10",
+    "@inquirer/core": "^9.2.0",
     "@inquirer/figures": "^1.0.5",
-    "@inquirer/type": "^1.5.2",
+    "@inquirer/type": "^1.5.4",
     "ansi-escapes": "^4.3.2",
     "yoctocolors-cjs": "^2.1.2"
   },
   "devDependencies": {
-    "@inquirer/testing": "^2.1.31"
+    "@inquirer/testing": "^2.1.33"
   },
   "scripts": {
     "tsc": "yarn run tsc:esm && yarn run tsc:cjs",
@@ -88,5 +88,5 @@
     }
   },
   "sideEffects": false,
-  "gitHead": "273b16eeb96fab346854b9b92257c930d7ca7661"
+  "gitHead": "5fe03a4686d349d0d6cf281f86f12a4f7c992ad4"
 }