@shopify/cli-kit 3.34.0 → 3.36.0

package/dist/private/node/ui/components/SelectInput.test.js

@@ -1,5 +1,5 @@
 import SelectInput from './SelectInput.js';
-import { waitForInputsToBeReady, sendInput } from '../../../../testing/ui.js';
+import { sendInputAndWait, sendInputAndWaitForChange, waitForInputsToBeReady } from '../../../../testing/ui.js';
 import { describe, expect, test, vi } from 'vitest';
 import React from 'react';
 import { render } from 'ink-testing-library';
@@ -24,13 +24,13 @@ describe('SelectInput', async () => {
         ];
         const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, ARROW_UP);
+        await sendInputAndWaitForChange(renderInstance, ARROW_UP);
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
       "   (1) First
          (2) Second
       >  (3) Third
 
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[2]);
     });
@@ -52,13 +52,13 @@ describe('SelectInput', async () => {
         ];
         const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, ARROW_DOWN);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
       "   (1) First
       >  (2) Second
          (3) Third
 
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[1]);
     });
@@ -81,16 +81,45 @@ describe('SelectInput', async () => {
         ];
         const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, '1', '0');
+        await sendInputAndWaitForChange(renderInstance, '1', '0');
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
       "   (1) First
          (2) Second
       >  (10) Tenth
 
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[2]);
     });
+    test('handles pressing non existing keys', async () => {
+        const onChange = vi.fn();
+        const items = [
+            {
+                label: 'First',
+                value: 'first',
+            },
+            {
+                label: 'Second',
+                value: 'second',
+            },
+            {
+                label: 'Tenth',
+                value: 'tenth',
+            },
+        ];
+        const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
+        await waitForInputsToBeReady();
+        // nothing changes when pressing a key that doesn't exist
+        await sendInputAndWait(renderInstance, 100, '4');
+        expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
+      ">  (1) First
+         (2) Second
+         (3) Tenth
+
+         Press ↑↓ arrows to select, enter to confirm"
+    `);
+        expect(onChange).not.toHaveBeenCalled();
+    });
     test('handles custom keys', async () => {
         const onChange = vi.fn();
         const items = [
@@ -110,13 +139,13 @@ describe('SelectInput', async () => {
         ];
         const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, 't');
+        await sendInputAndWaitForChange(renderInstance, 't');
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
       "   (1) First
          (2) Second
       >  (t) Third
 
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[2]);
     });
@@ -138,93 +167,150 @@ describe('SelectInput', async () => {
         ];
         const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, ARROW_DOWN);
-        await sendInput(renderInstance, ARROW_DOWN);
-        await sendInput(renderInstance, ARROW_DOWN);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
       ">  (1) First
          (2) Second
          (3) Third
 
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[0]);
     });
     test('support groups', async () => {
         const onChange = vi.fn();
         const items = [
-            { label: 'first', value: 'first', key: 'f' },
-            { label: 'second', value: 'second', key: 's' },
-            { label: 'third', value: 'third' },
-            { label: 'fourth', value: 'fourth' },
-            { label: 'fifth', value: 'fifth', group: 'Automations', key: 'a' },
-            { label: 'sixth', value: 'sixth', group: 'Automations' },
+            { label: 'first', value: 'first', group: 'Automations', key: 'f' },
+            { label: 'second', value: 'second', group: 'Automations', key: 's' },
+            { label: 'third', value: 'third', group: 'Merchant Admin' },
+            { label: 'fourth', value: 'fourth', group: 'Merchant Admin' },
+            { label: 'fifth', value: 'fifth', key: 'a' },
+            { label: 'sixth', value: 'sixth' },
             { label: 'seventh', value: 'seventh' },
-            { label: 'eighth', value: 'eighth', group: 'Merchant Admin' },
-            { label: 'ninth', value: 'ninth', group: 'Merchant Admin' },
+            { label: 'eighth', value: 'eighth' },
+            { label: 'ninth', value: 'ninth' },
             { label: 'tenth', value: 'tenth' },
         ];
         const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange }));
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
-      ">  (f) first
+      "   Automations
+      >  (f) first
          (s) second
+
+         Merchant Admin
          (3) third
          (4) fourth
-         (5) seventh
-         (6) tenth
 
-         Automations
+         Other
          (a) fifth
-         (8) sixth
+         (6) sixth
+         (7) seventh
+         (8) eighth
+         (9) ninth
+         (10) tenth
 
-         Merchant Admin
-         (9) eighth
-         (10) ninth
-
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, 'a');
+        await sendInputAndWaitForChange(renderInstance, 'a');
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
-      "   (f) first
+      "   Automations
+         (f) first
          (s) second
+
+         Merchant Admin
          (3) third
          (4) fourth
-         (5) seventh
-         (6) tenth
 
-         Automations
+         Other
       >  (a) fifth
-         (8) sixth
+         (6) sixth
+         (7) seventh
+         (8) eighth
+         (9) ninth
+         (10) tenth
 
-         Merchant Admin
-         (9) eighth
-         (10) ninth
-
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[4]);
-        await sendInput(renderInstance, ARROW_UP);
-        await sendInput(renderInstance, ARROW_UP);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
         expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
-      "   (f) first
+      "   Automations
+         (f) first
          (s) second
+
+         Merchant Admin
          (3) third
          (4) fourth
-      >  (5) seventh
-         (6) tenth
 
-         Automations
+         Other
          (a) fifth
-         (8) sixth
-
-         Merchant Admin
-         (9) eighth
-         (10) ninth
+         (6) sixth
+      >  (7) seventh
+         (8) eighth
+         (9) ninth
+         (10) tenth
 
-         navigate with arrows, enter to select"
+         Press ↑↓ arrows to select, enter to confirm"
     `);
         expect(onChange).toHaveBeenCalledWith(items[6]);
     });
+    test('allows disabling shortcuts', async () => {
+        const onChange = vi.fn();
+        const items = [
+            {
+                label: 'First',
+                value: 'first',
+            },
+            {
+                label: 'Second',
+                value: 'second',
+            },
+            {
+                label: 'Third',
+                value: 'third',
+            },
+        ];
+        const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: onChange, enableShortcuts: false }));
+        await waitForInputsToBeReady();
+        // input doesn't change on shortcut pressed
+        await sendInputAndWait(renderInstance, 100, '2');
+        expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
+      ">  First
+         Second
+         Third
+
+         Press ↑↓ arrows to select, enter to confirm"
+    `);
+        expect(onChange).not.toHaveBeenCalled();
+    });
+    test('accepts a default value', async () => {
+        const items = [
+            {
+                label: 'First',
+                value: 'first',
+            },
+            {
+                label: 'Second',
+                value: 'second',
+            },
+            {
+                label: 'Third',
+                value: 'third',
+            },
+        ];
+        const renderInstance = render(React.createElement(SelectInput, { items: items, onChange: () => { }, defaultValue: { label: 'Second', value: 'second' } }));
+        await waitForInputsToBeReady();
+        expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
+      "   (1) First
+      >  (2) Second
+         (3) Third
+
+         Press ↑↓ arrows to select, enter to confirm"
+    `);
+    });
 });
 //# sourceMappingURL=SelectInput.test.js.map

package/dist/private/node/ui/components/SelectInput.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInput.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/SelectInput.test.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,kBAAkB,CAAA;AAC1C,OAAO,EAAC,sBAAsB,EAAE,SAAS,EAAC,MAAM,2BAA2B,CAAA;AAC3E,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAC,MAAM,QAAQ,CAAA;AACjD,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAC,MAAM,EAAC,MAAM,qBAAqB,CAAA;AAE1C,MAAM,QAAQ,GAAG,UAAU,CAAA;AAC3B,MAAM,UAAU,GAAG,UAAU,CAAA;AAE7B,QAAQ,CAAC,aAAa,EAAE,KAAK,IAAI,EAAE;IACjC,IAAI,CAAC,2BAA2B,EAAE,KAAK,IAAI,EAAE;QAC3C,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAA;QAExB,MAAM,KAAK,GAAG;YACZ;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;YACD;gBACE,KAAK,EAAE,QAAQ;gBACf,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;SACF,CAAA;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAA;QAEhF,MAAM,sBAAsB,EAAE,CAAA;QAC9B,MAAM,SAAS,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAA;QAEzC,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;IAClD,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAA;QAExB,MAAM,KAAK,GAAG;YACZ;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;YACD;gBACE,KAAK,EAAE,QAAQ;gBACf,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;SACF,CAAA;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAA;QAEhF,MAAM,sBAAsB,EAAE,CAAA;QAC9B,MAAM,SAAS,CAAC,cAAc,EAAE,UAAU,CAAC,CAAA;QAE3C,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;IAClD,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAA;QACxB,MAAM,KAAK,GAAG;YACZ;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;YACD;gBACE,KAAK,EAAE,QAAQ;gBACf,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;gBACd,GAAG,EAAE,IAAI;aACV;SACF,CAAA;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAA;QAEhF,MAAM,sBAAsB,EAAE,CAAA;QAC9B,MAAM,SAAS,CAAC,cAAc,EAAE,GAAG,EAAE,GAAG,CAAC,CAAA;QAEzC,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;IAClD,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,qBAAqB,EAAE,KAAK,IAAI,EAAE;QACrC,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAA;QACxB,MAAM,KAAK,GAAG;YACZ;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;YACD;gBACE,KAAK,EAAE,QAAQ;gBACf,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;gBACd,GAAG,EAAE,GAAG;aACT;SACF,CAAA;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAA;QAEhF,MAAM,sBAAsB,EAAE,CAAA;QAC9B,MAAM,SAAS,CAAC,cAAc,EAAE,GAAG,CAAC,CAAA;QAEpC,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;IAClD,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,2CAA2C,EAAE,KAAK,IAAI,EAAE;QAC3D,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAA;QACxB,MAAM,KAAK,GAAG;YACZ;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;YACD;gBACE,KAAK,EAAE,QAAQ;gBACf,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,KAAK,EAAE,OAAO;aACf;SACF,CAAA;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAA;QAEhF,MAAM,sBAAsB,EAAE,CAAA;QAC9B,MAAM,SAAS,CAAC,cAAc,EAAE,UAAU,CAAC,CAAA;QAC3C,MAAM,SAAS,CAAC,cAAc,EAAE,UAAU,CAAC,CAAA;QAC3C,MAAM,SAAS,CAAC,cAAc,EAAE,UAAU,CAAC,CAAA;QAE3C,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;IAClD,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,gBAAgB,EAAE,KAAK,IAAI,EAAE;QAChC,MAAM,QAAQ,GAAG,EAAE,CAAC,EAAE,EAAE,CAAA;QAExB,MAAM,KAAK,GAAG;YACZ,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,EAAC;YAC1C,EAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAC;YAC5C,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAC;YAChC,EAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAC;YAClC,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,EAAE,GAAG,EAAC;YAChE,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,aAAa,EAAC;YACtD,EAAC,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAC;YACpC,EAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,gBAAgB,EAAC;YAC3D,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAC;YACzD,EAAC,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAC;SACjC,CAAA;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAI,CAAC,CAAA;QAEhF,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;KAiBxD,CAAC,CAAA;QAEF,MAAM,sBAAsB,EAAE,CAAA;QAC9B,MAAM,SAAS,CAAC,cAAc,EAAE,GAAG,CAAC,CAAA;QAEpC,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;KAiBxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;QAEhD,MAAM,SAAS,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAA;QACzC,MAAM,SAAS,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAA;QAEzC,MAAM,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;KAiBxD,CAAC,CAAA;QACF,MAAM,CAAC,QAAQ,CAAC,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC,CAAE,CAAC,CAAA;IAClD,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import SelectInput from './SelectInput.js'\nimport {waitForInputsToBeReady, sendInput} from '../../../../testing/ui.js'\nimport {describe, expect, test, vi} from 'vitest'\nimport React from 'react'\nimport {render} from 'ink-testing-library'\n\nconst ARROW_UP = '\\u001B[A'\nconst ARROW_DOWN = '\\u001B[B'\n\ndescribe('SelectInput', async () => {\n  test('move up with up arrow key', async () => {\n    const onChange = vi.fn()\n\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInput(renderInstance, ARROW_UP)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n         (2) Second\n      \u001b[36m>\u001b[39m  \u001b[36m(3) Third\u001b[39m\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[2]!)\n  })\n\n  test('move down with down arrow key', async () => {\n    const onChange = vi.fn()\n\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInput(renderInstance, ARROW_DOWN)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n      \u001b[36m>\u001b[39m  \u001b[36m(2) Second\u001b[39m\n         (3) Third\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[1]!)\n  })\n\n  test('handles keys with multiple digits', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Tenth',\n        value: 'tenth',\n        key: '10',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInput(renderInstance, '1', '0')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n         (2) Second\n      \u001b[36m>\u001b[39m  \u001b[36m(10) Tenth\u001b[39m\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[2]!)\n  })\n\n  test('handles custom keys', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n        key: 't',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInput(renderInstance, 't')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n         (2) Second\n      \u001b[36m>\u001b[39m  \u001b[36m(t) Third\u001b[39m\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[2]!)\n  })\n\n  test('rotate after reaching the end of the list', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInput(renderInstance, ARROW_DOWN)\n    await sendInput(renderInstance, ARROW_DOWN)\n    await sendInput(renderInstance, ARROW_DOWN)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[36m>\u001b[39m  \u001b[36m(1) First\u001b[39m\n         (2) Second\n         (3) Third\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[0]!)\n  })\n\n  test('support groups', async () => {\n    const onChange = vi.fn()\n\n    const items = [\n      {label: 'first', value: 'first', key: 'f'},\n      {label: 'second', value: 'second', key: 's'},\n      {label: 'third', value: 'third'},\n      {label: 'fourth', value: 'fourth'},\n      {label: 'fifth', value: 'fifth', group: 'Automations', key: 'a'},\n      {label: 'sixth', value: 'sixth', group: 'Automations'},\n      {label: 'seventh', value: 'seventh'},\n      {label: 'eighth', value: 'eighth', group: 'Merchant Admin'},\n      {label: 'ninth', value: 'ninth', group: 'Merchant Admin'},\n      {label: 'tenth', value: 'tenth'},\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[36m>\u001b[39m  \u001b[36m(f) first\u001b[39m\n         (s) second\n         (3) third\n         (4) fourth\n         (5) seventh\n         (6) tenth\n\n         \u001b[1mAutomations\u001b[22m\n         (a) fifth\n         (8) sixth\n\n         \u001b[1mMerchant Admin\u001b[22m\n         (9) eighth\n         (10) ninth\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n\n    await waitForInputsToBeReady()\n    await sendInput(renderInstance, 'a')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (f) first\n         (s) second\n         (3) third\n         (4) fourth\n         (5) seventh\n         (6) tenth\n\n         \u001b[1mAutomations\u001b[22m\n      \u001b[36m>\u001b[39m  \u001b[36m(a) fifth\u001b[39m\n         (8) sixth\n\n         \u001b[1mMerchant Admin\u001b[22m\n         (9) eighth\n         (10) ninth\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[4]!)\n\n    await sendInput(renderInstance, ARROW_UP)\n    await sendInput(renderInstance, ARROW_UP)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (f) first\n         (s) second\n         (3) third\n         (4) fourth\n      \u001b[36m>\u001b[39m  \u001b[36m(5) seventh\u001b[39m\n         (6) tenth\n\n         \u001b[1mAutomations\u001b[22m\n         (a) fifth\n         (8) sixth\n\n         \u001b[1mMerchant Admin\u001b[22m\n         (9) eighth\n         (10) ninth\n\n         \u001b[2mnavigate with arrows, enter to select\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[6]!)\n  })\n})\n"]}
+{"version":3,"file":"SelectInput.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/SelectInput.test.tsx"],"names":[],"mappings":"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","sourcesContent":["import SelectInput from './SelectInput.js'\nimport {sendInputAndWait, sendInputAndWaitForChange, waitForInputsToBeReady} from '../../../../testing/ui.js'\nimport {describe, expect, test, vi} from 'vitest'\nimport React from 'react'\nimport {render} from 'ink-testing-library'\n\nconst ARROW_UP = '\\u001B[A'\nconst ARROW_DOWN = '\\u001B[B'\n\ndescribe('SelectInput', async () => {\n  test('move up with up arrow key', async () => {\n    const onChange = vi.fn()\n\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInputAndWaitForChange(renderInstance, ARROW_UP)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n         (2) Second\n      \u001b[36m>\u001b[39m  \u001b[36m(3) Third\u001b[39m\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[2]!)\n  })\n\n  test('move down with down arrow key', async () => {\n    const onChange = vi.fn()\n\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInputAndWaitForChange(renderInstance, ARROW_DOWN)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n      \u001b[36m>\u001b[39m  \u001b[36m(2) Second\u001b[39m\n         (3) Third\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[1]!)\n  })\n\n  test('handles keys with multiple digits', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Tenth',\n        value: 'tenth',\n        key: '10',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInputAndWaitForChange(renderInstance, '1', '0')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n         (2) Second\n      \u001b[36m>\u001b[39m  \u001b[36m(10) Tenth\u001b[39m\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[2]!)\n  })\n\n  test('handles pressing non existing keys', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Tenth',\n        value: 'tenth',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    // nothing changes when pressing a key that doesn't exist\n    await sendInputAndWait(renderInstance, 100, '4')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[36m>\u001b[39m  \u001b[36m(1) First\u001b[39m\n         (2) Second\n         (3) Tenth\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).not.toHaveBeenCalled()\n  })\n\n  test('handles custom keys', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n        key: 't',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInputAndWaitForChange(renderInstance, 't')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n         (2) Second\n      \u001b[36m>\u001b[39m  \u001b[36m(t) Third\u001b[39m\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[2]!)\n  })\n\n  test('rotate after reaching the end of the list', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    await waitForInputsToBeReady()\n    await sendInputAndWaitForChange(renderInstance, ARROW_DOWN)\n    await sendInputAndWaitForChange(renderInstance, ARROW_DOWN)\n    await sendInputAndWaitForChange(renderInstance, ARROW_DOWN)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[36m>\u001b[39m  \u001b[36m(1) First\u001b[39m\n         (2) Second\n         (3) Third\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[0]!)\n  })\n\n  test('support groups', async () => {\n    const onChange = vi.fn()\n\n    const items = [\n      {label: 'first', value: 'first', group: 'Automations', key: 'f'},\n      {label: 'second', value: 'second', group: 'Automations', key: 's'},\n      {label: 'third', value: 'third', group: 'Merchant Admin'},\n      {label: 'fourth', value: 'fourth', group: 'Merchant Admin'},\n      {label: 'fifth', value: 'fifth', key: 'a'},\n      {label: 'sixth', value: 'sixth'},\n      {label: 'seventh', value: 'seventh'},\n      {label: 'eighth', value: 'eighth'},\n      {label: 'ninth', value: 'ninth'},\n      {label: 'tenth', value: 'tenth'},\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} />)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   \u001b[1mAutomations\u001b[22m\n      \u001b[36m>\u001b[39m  \u001b[36m(f) first\u001b[39m\n         (s) second\n\n         \u001b[1mMerchant Admin\u001b[22m\n         (3) third\n         (4) fourth\n\n         \u001b[1mOther\u001b[22m\n         (a) fifth\n         (6) sixth\n         (7) seventh\n         (8) eighth\n         (9) ninth\n         (10) tenth\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n\n    await waitForInputsToBeReady()\n    await sendInputAndWaitForChange(renderInstance, 'a')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   \u001b[1mAutomations\u001b[22m\n         (f) first\n         (s) second\n\n         \u001b[1mMerchant Admin\u001b[22m\n         (3) third\n         (4) fourth\n\n         \u001b[1mOther\u001b[22m\n      \u001b[36m>\u001b[39m  \u001b[36m(a) fifth\u001b[39m\n         (6) sixth\n         (7) seventh\n         (8) eighth\n         (9) ninth\n         (10) tenth\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[4]!)\n\n    await sendInputAndWaitForChange(renderInstance, ARROW_DOWN)\n    await sendInputAndWaitForChange(renderInstance, ARROW_DOWN)\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   \u001b[1mAutomations\u001b[22m\n         (f) first\n         (s) second\n\n         \u001b[1mMerchant Admin\u001b[22m\n         (3) third\n         (4) fourth\n\n         \u001b[1mOther\u001b[22m\n         (a) fifth\n         (6) sixth\n      \u001b[36m>\u001b[39m  \u001b[36m(7) seventh\u001b[39m\n         (8) eighth\n         (9) ninth\n         (10) tenth\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).toHaveBeenCalledWith(items[6]!)\n  })\n\n  test('allows disabling shortcuts', async () => {\n    const onChange = vi.fn()\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(<SelectInput items={items} onChange={onChange} enableShortcuts={false} />)\n\n    await waitForInputsToBeReady()\n    // input doesn't change on shortcut pressed\n    await sendInputAndWait(renderInstance, 100, '2')\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[36m>\u001b[39m  \u001b[36mFirst\u001b[39m\n         Second\n         Third\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n    expect(onChange).not.toHaveBeenCalled()\n  })\n\n  test('accepts a default value', async () => {\n    const items = [\n      {\n        label: 'First',\n        value: 'first',\n      },\n      {\n        label: 'Second',\n        value: 'second',\n      },\n      {\n        label: 'Third',\n        value: 'third',\n      },\n    ]\n\n    const renderInstance = render(\n      <SelectInput items={items} onChange={() => {}} defaultValue={{label: 'Second', value: 'second'}} />,\n    )\n\n    await waitForInputsToBeReady()\n\n    expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`\n      \"   (1) First\n      \u001b[36m>\u001b[39m  \u001b[36m(2) Second\u001b[39m\n         (3) Third\n\n         \u001b[2mPress ↑↓ arrows to select, enter to confirm\u001b[22m\"\n    `)\n  })\n})\n"]}

package/dist/private/node/ui/components/SelectPrompt.d.ts

@@ -1,11 +1,13 @@
 import { Props as SelectProps } from './SelectInput.js';
-import { Props as TableProps } from './Table.js';
+import { Props as InfoTableProps } from './Prompts/InfoTable.js';
+import { TokenItem } from './TokenizedText.js';
 import React, { ReactElement } from 'react';
 export interface Props<T> {
-    message: string;
+    message: TokenItem;
     choices: SelectProps<T>['items'];
     onSubmit: (value: T) => void;
-    infoTable?: TableProps['table'];
+    infoTable?: InfoTableProps['table'];
+    defaultValue?: T;
 }
-declare function SelectPrompt<T>({ message, choices, infoTable, onSubmit, }: React.PropsWithChildren<Props<T>>): ReactElement | null;
+declare function SelectPrompt<T>({ message, choices, infoTable, onSubmit, defaultValue, }: React.PropsWithChildren<Props<T>>): ReactElement | null;
 export { SelectPrompt };

package/dist/private/node/ui/components/SelectPrompt.js

@@ -1,12 +1,18 @@
 import SelectInput from './SelectInput.js';
-import Table from './Table.js';
+import InfoTable from './Prompts/InfoTable.js';
+import { TokenizedText } from './TokenizedText.js';
 import { handleCtrlC } from '../../ui.js';
+import { messageWithPunctuation } from '../utilities.js';
 import React, { useCallback, useState } from 'react';
 import { Box, measureElement, Text, useApp, useInput, useStdout } from 'ink';
-import { figures } from 'listr2';
+import figures from 'figures';
 import ansiEscapes from 'ansi-escapes';
-function SelectPrompt({ message, choices, infoTable, onSubmit, }) {
-    const [answer, setAnswer] = useState(choices[0]);
+function SelectPrompt({ message, choices, infoTable, onSubmit, defaultValue, }) {
+    if (choices.length === 0) {
+        throw new Error('SelectPrompt requires at least one choice');
+    }
+    const initialValue = defaultValue ? choices.find((choice) => choice.value === defaultValue) ?? choices[0] : choices[0];
+    const [answer, setAnswer] = useState(initialValue);
     const { exit: unmountInk } = useApp();
     const [submitted, setSubmitted] = useState(false);
     const { stdout } = useStdout();
@@ -19,7 +25,7 @@ function SelectPrompt({ message, choices, infoTable, onSubmit, }) {
     }, []);
     useInput(useCallback((input, key) => {
         handleCtrlC(input, key);
-        if (key.return) {
+        if (key.return && answer) {
             if (stdout && height >= stdout.rows) {
                 stdout.write(ansiEscapes.clearTerminal);
             }
@@ -32,15 +38,16 @@ function SelectPrompt({ message, choices, infoTable, onSubmit, }) {
         React.createElement(Box, null,
             React.createElement(Box, { marginRight: 2 },
                 React.createElement(Text, null, "?")),
-            React.createElement(Text, null, message)),
-        infoTable && !submitted && (React.createElement(Box, { marginLeft: 7 },
-            React.createElement(Table, { table: infoTable }))),
+            React.createElement(TokenizedText, { item: messageWithPunctuation(message) })),
+        infoTable && !submitted && (React.createElement(Box, { marginLeft: 7, marginTop: 1 },
+            React.createElement(InfoTable, { table: infoTable }))),
         submitted ? (React.createElement(Box, null,
             React.createElement(Box, { marginRight: 2 },
                 React.createElement(Text, { color: "cyan" }, figures.tick)),
-            React.createElement(Text, { color: "cyan" }, answer.label))) : (React.createElement(SelectInput, { items: choices, onChange: (item) => {
-                setAnswer(item);
-            } }))));
+            React.createElement(Text, { color: "cyan" }, answer.label))) : (React.createElement(Box, { marginTop: 1 },
+            React.createElement(SelectInput, { defaultValue: initialValue, items: choices, onChange: (item) => {
+                    setAnswer(item);
+                } })))));
 }
 export { SelectPrompt };
 //# sourceMappingURL=SelectPrompt.js.map

package/dist/private/node/ui/components/SelectPrompt.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectPrompt.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/SelectPrompt.tsx"],"names":[],"mappings":"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","sourcesContent":["import SelectInput, {Props as SelectProps, Item as SelectItem, Item} from './SelectInput.js'\nimport Table, {Props as TableProps} from './Table.js'\nimport {handleCtrlC} from '../../ui.js'\nimport React, {ReactElement, useCallback, useState} from 'react'\nimport {Box, measureElement, Text, useApp, useInput, useStdout} from 'ink'\nimport {figures} from 'listr2'\nimport ansiEscapes from 'ansi-escapes'\n\nexport interface Props<T> {\n  message: string\n  choices: SelectProps<T>['items']\n  onSubmit: (value: T) => void\n  infoTable?: TableProps['table']\n}\n\nfunction SelectPrompt<T>({\n  message,\n  choices,\n  infoTable,\n  onSubmit,\n}: React.PropsWithChildren<Props<T>>): ReactElement | null {\n  const [answer, setAnswer] = useState<SelectItem<T>>(choices[0]!)\n  const {exit: unmountInk} = useApp()\n  const [submitted, setSubmitted] = useState(false)\n  const {stdout} = useStdout()\n  const [height, setHeight] = useState(0)\n\n  const measuredRef = useCallback((node) => {\n    if (node !== null) {\n      const {height} = measureElement(node)\n      setHeight(height)\n    }\n  }, [])\n\n  useInput(\n    useCallback(\n      (input, key) => {\n        handleCtrlC(input, key)\n\n        if (key.return) {\n          if (stdout && height >= stdout.rows) {\n            stdout.write(ansiEscapes.clearTerminal)\n          }\n          setSubmitted(true)\n          unmountInk()\n          onSubmit(answer.value)\n        }\n      },\n      [answer, onSubmit, height],\n    ),\n  )\n\n  return (\n    <Box flexDirection=\"column\" marginBottom={1} ref={measuredRef}>\n      <Box>\n        <Box marginRight={2}>\n          <Text>?</Text>\n        </Box>\n        <Text>{message}</Text>\n      </Box>\n      {infoTable && !submitted && (\n        <Box marginLeft={7}>\n          <Table table={infoTable} />\n        </Box>\n      )}\n      {submitted ? (\n        <Box>\n          <Box marginRight={2}>\n            <Text color=\"cyan\">{figures.tick}</Text>\n          </Box>\n\n          <Text color=\"cyan\">{answer.label}</Text>\n        </Box>\n      ) : (\n        <SelectInput\n          items={choices}\n          onChange={(item: Item<T>) => {\n            setAnswer(item)\n          }}\n        />\n      )}\n    </Box>\n  )\n}\n\nexport {SelectPrompt}\n"]}
+{"version":3,"file":"SelectPrompt.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/SelectPrompt.tsx"],"names":[],"mappings":"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","sourcesContent":["import SelectInput, {Props as SelectProps, Item as SelectItem, Item} from './SelectInput.js'\nimport InfoTable, {Props as InfoTableProps} from './Prompts/InfoTable.js'\nimport {TokenItem, TokenizedText} from './TokenizedText.js'\nimport {handleCtrlC} from '../../ui.js'\nimport {messageWithPunctuation} from '../utilities.js'\nimport React, {ReactElement, useCallback, useState} from 'react'\nimport {Box, measureElement, Text, useApp, useInput, useStdout} from 'ink'\nimport figures from 'figures'\nimport ansiEscapes from 'ansi-escapes'\n\nexport interface Props<T> {\n  message: TokenItem\n  choices: SelectProps<T>['items']\n  onSubmit: (value: T) => void\n  infoTable?: InfoTableProps['table']\n  defaultValue?: T\n}\n\nfunction SelectPrompt<T>({\n  message,\n  choices,\n  infoTable,\n  onSubmit,\n  defaultValue,\n}: React.PropsWithChildren<Props<T>>): ReactElement | null {\n  if (choices.length === 0) {\n    throw new Error('SelectPrompt requires at least one choice')\n  }\n  const initialValue = defaultValue ? choices.find((choice) => choice.value === defaultValue) ?? choices[0] : choices[0]\n  const [answer, setAnswer] = useState<SelectItem<T> | undefined>(initialValue)\n  const {exit: unmountInk} = useApp()\n  const [submitted, setSubmitted] = useState(false)\n  const {stdout} = useStdout()\n  const [height, setHeight] = useState(0)\n\n  const measuredRef = useCallback((node) => {\n    if (node !== null) {\n      const {height} = measureElement(node)\n      setHeight(height)\n    }\n  }, [])\n\n  useInput(\n    useCallback(\n      (input, key) => {\n        handleCtrlC(input, key)\n\n        if (key.return && answer) {\n          if (stdout && height >= stdout.rows) {\n            stdout.write(ansiEscapes.clearTerminal)\n          }\n          setSubmitted(true)\n          unmountInk()\n          onSubmit(answer.value)\n        }\n      },\n      [answer, onSubmit, height],\n    ),\n  )\n\n  return (\n    <Box flexDirection=\"column\" marginBottom={1} ref={measuredRef}>\n      <Box>\n        <Box marginRight={2}>\n          <Text>?</Text>\n        </Box>\n        <TokenizedText item={messageWithPunctuation(message)} />\n      </Box>\n      {infoTable && !submitted && (\n        <Box marginLeft={7} marginTop={1}>\n          <InfoTable table={infoTable} />\n        </Box>\n      )}\n      {submitted ? (\n        <Box>\n          <Box marginRight={2}>\n            <Text color=\"cyan\">{figures.tick}</Text>\n          </Box>\n\n          <Text color=\"cyan\">{answer!.label}</Text>\n        </Box>\n      ) : (\n        <Box marginTop={1}>\n          <SelectInput\n            defaultValue={initialValue}\n            items={choices}\n            onChange={(item: Item<T> | undefined) => {\n              setAnswer(item)\n            }}\n          />\n        </Box>\n      )}\n    </Box>\n  )\n}\n\nexport {SelectPrompt}\n"]}

package/dist/private/node/ui/components/SelectPrompt.test.js

@@ -1,11 +1,12 @@
 import { SelectPrompt } from './SelectPrompt.js';
-import { getLastFrameAfterUnmount, sendInput, waitForInputsToBeReady } from '../../../../testing/ui.js';
+import { getLastFrameAfterUnmount, sendInputAndWaitForChange, waitForInputsToBeReady } from '../../../../testing/ui.js';
+import { unstyled } from '../../../../output.js';
 import { describe, expect, test, vi } from 'vitest';
 import React from 'react';
 import { render } from 'ink-testing-library';
 const ARROW_DOWN = '\u001B[B';
 const ENTER = '\r';
-describe('Prompt', async () => {
+describe('SelectPrompt', async () => {
     test('choose an answer', async () => {
         const onEnter = vi.fn();
         const items = [
@@ -16,8 +17,8 @@ describe('Prompt', async () => {
         const infoTable = { Add: ['new-ext'], Remove: ['integrated-demand-ext', 'order-discount'] };
         const renderInstance = render(React.createElement(SelectPrompt, { message: "Associate your project with the org Castile Ventures?", choices: items, infoTable: infoTable, onSubmit: onEnter }));
         await waitForInputsToBeReady();
-        await sendInput(renderInstance, ARROW_DOWN);
-        await sendInput(renderInstance, ENTER);
+        await sendInputAndWaitForChange(renderInstance, ARROW_DOWN);
+        await sendInputAndWaitForChange(renderInstance, ENTER);
         expect(getLastFrameAfterUnmount(renderInstance)).toMatchInlineSnapshot(`
       "?  Associate your project with the org Castile Ventures?
       ✔  second
@@ -25,18 +26,49 @@ describe('Prompt', async () => {
     `);
         expect(onEnter).toHaveBeenCalledWith(items[1].value);
     });
+    test('renders groups', async () => {
+        const items = [
+            { label: 'first', value: 'first', group: 'Automations', key: 'f' },
+            { label: 'second', value: 'second', group: 'Automations', key: 's' },
+            { label: 'third', value: 'third', group: 'Merchant Admin' },
+            { label: 'fourth', value: 'fourth', group: 'Merchant Admin' },
+            { label: 'fifth', value: 'fifth', key: 'a' },
+            { label: 'sixth', value: 'sixth' },
+            { label: 'seventh', value: 'seventh' },
+            { label: 'eighth', value: 'eighth' },
+            { label: 'ninth', value: 'ninth' },
+            { label: 'tenth', value: 'tenth' },
+        ];
+        const renderInstance = render(React.createElement(SelectPrompt, { message: "Associate your project with the org Castile Ventures?", choices: items, onSubmit: () => { } }));
+        expect(renderInstance.lastFrame()).toMatchInlineSnapshot(`
+      "?  Associate your project with the org Castile Ventures?
+
+         Automations
+      >  (f) first
+         (s) second
+
+         Merchant Admin
+         (3) third
+         (4) fourth
+
+         Other
+         (a) fifth
+         (6) sixth
+         (7) seventh
+         (8) eighth
+         (9) ninth
+         (10) tenth
+
+         Press ↑↓ arrows to select, enter to confirm
+      "
+    `);
+    });
     test('supports an info table', async () => {
         const items = [
-            { label: 'first', value: 'first', key: 'f' },
-            { label: 'second', value: 'second', key: 's' },
+            { label: 'first', value: 'first' },
+            { label: 'second', value: 'second' },
             { label: 'third', value: 'third' },
             { label: 'fourth', value: 'fourth' },
-            { label: 'fifth', value: 'fifth', group: 'Automations' },
-            { label: 'sixth', value: 'sixth', group: 'Automations' },
-            { label: 'seventh', value: 'seventh' },
-            { label: 'eighth', value: 'eighth', group: 'Merchant Admin' },
-            { label: 'ninth', value: 'ninth', group: 'Merchant Admin' },
-            { label: 'tenth', value: 'tenth' },
         ];
         const infoTable = {
             Add: ['new-ext'],
@@ -51,24 +83,82 @@ describe('Prompt', async () => {
              Remove:  • integrated-demand-ext
                       • order-discount
 
-      >  (f) first
-         (s) second
+      >  (1) first
+         (2) second
          (3) third
          (4) fourth
-         (5) seventh
-         (6) tenth
 
-         Automations
-         (7) fifth
-         (8) sixth
+         Press ↑↓ arrows to select, enter to confirm
+      "
+    `);
+    });
+    test("it doesn't submit if there are no choices", async () => {
+        const onEnter = vi.fn();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const items = [];
+        const renderInstance = render(React.createElement(SelectPrompt, { message: "Associate your project with the org Castile Ventures?", choices: items, onSubmit: onEnter }));
+        expect(unstyled(getLastFrameAfterUnmount(renderInstance))).toContain('ERROR  SelectPrompt requires at least one choice');
+    });
+    test("doesn't append a colon to the message if it ends with a question mark", async () => {
+        const { lastFrame } = render(React.createElement(SelectPrompt, { choices: [{ label: 'a', value: 'a' }], onSubmit: () => { }, message: "Test question?" }));
+        expect(unstyled(lastFrame())).toMatchInlineSnapshot(`
+      "?  Test question?
 
-         Merchant Admin
-         (9) eighth
-         (10) ninth
+      >  (1) a
+
+         Press ↑↓ arrows to select, enter to confirm
+      "
+    `);
+    });
+    test('accepts a default value', async () => {
+        const onEnter = vi.fn();
+        const items = [
+            { label: 'a', value: 'a' },
+            { label: 'b', value: 'b' },
+        ];
+        const renderInstance = render(React.createElement(SelectPrompt, { choices: items, onSubmit: onEnter, message: "Test question?", defaultValue: "b" }));
+        expect(unstyled(renderInstance.lastFrame())).toMatchInlineSnapshot(`
+      "?  Test question?
+
+         (1) a
+      >  (2) b
+
+         Press ↑↓ arrows to select, enter to confirm
+      "
+    `);
+        await waitForInputsToBeReady();
+        await sendInputAndWaitForChange(renderInstance, ENTER);
+        expect(getLastFrameAfterUnmount(renderInstance)).toMatchInlineSnapshot(`
+      "?  Test question?
+      ✔  b
+      "
+    `);
+        expect(onEnter).toHaveBeenCalledWith(items[1].value);
+    });
+    test('can submit the initial value', async () => {
+        const onEnter = vi.fn();
+        const items = [
+            { label: 'a', value: 'a' },
+            { label: 'b', value: 'b' },
+        ];
+        const renderInstance = render(React.createElement(SelectPrompt, { choices: items, onSubmit: onEnter, message: "Test question?" }));
+        expect(unstyled(renderInstance.lastFrame())).toMatchInlineSnapshot(`
+      "?  Test question?
 
-         navigate with arrows, enter to select
+      >  (1) a
+         (2) b
+
+         Press ↑↓ arrows to select, enter to confirm
+      "
+    `);
+        await waitForInputsToBeReady();
+        await sendInputAndWaitForChange(renderInstance, ENTER);
+        expect(getLastFrameAfterUnmount(renderInstance)).toMatchInlineSnapshot(`
+      "?  Test question?
+      ✔  a
       "
     `);
+        expect(onEnter).toHaveBeenCalledWith(items[0].value);
     });
 });
 //# sourceMappingURL=SelectPrompt.test.js.map