@shopify/cli-kit 3.34.0 → 3.36.0

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

@@ -1 +1 @@
-{"version":3,"file":"Banner.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Banner.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAA;AAClC,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAC,MAAM,EAAC,MAAM,qBAAqB,CAAA;AAE1C,QAAQ,CAAC,QAAQ,EAAE,KAAK,IAAI,EAAE;IAC5B,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,SAAS,GAAG,CAAC,CAAA;QAErD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,MAAM,GAAG,CAAC,CAAA;QAClD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,SAAS,GAAG,CAAC,CAAA;QACrD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,OAAO,GAAG,CAAC,CAAA;QACnD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC9E,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,gBAAgB,GAAG,CAAC,CAAA;QAE5D,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {Banner} from './Banner.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\nimport {render} from 'ink-testing-library'\n\ndescribe('Banner', async () => {\n  test('renders with a border for success', async () => {\n    const {lastFrame} = render(<Banner type=\"success\" />)\n\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[32m╭─\u001b[39m success \u001b[32m────────────────────────────────────────────────────────────────────╮\u001b[39m\n      \u001b[32m│\u001b[39m                                                                              \u001b[32m│\u001b[39m\n      \u001b[32m│\u001b[39m                                                                              \u001b[32m│\u001b[39m\n      \u001b[32m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[39m\"\n    `)\n  })\n\n  test('renders with a border for info', async () => {\n    const {lastFrame} = render(<Banner type=\"info\" />)\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[2m╭─\u001b[22m info \u001b[2m───────────────────────────────────────────────────────────────────────╮\u001b[22m\n      \u001b[2m│\u001b[22m                                                                              \u001b[2m│\u001b[22m\n      \u001b[2m│\u001b[22m                                                                              \u001b[2m│\u001b[22m\n      \u001b[2m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[22m\"\n    `)\n  })\n\n  test('renders with a border for warning', async () => {\n    const {lastFrame} = render(<Banner type=\"warning\" />)\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[33m╭─\u001b[39m warning \u001b[33m────────────────────────────────────────────────────────────────────╮\u001b[39m\n      \u001b[33m│\u001b[39m                                                                              \u001b[33m│\u001b[39m\n      \u001b[33m│\u001b[39m                                                                              \u001b[33m│\u001b[39m\n      \u001b[33m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[39m\"\n    `)\n  })\n\n  test('renders with a border for error', async () => {\n    const {lastFrame} = render(<Banner type=\"error\" />)\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[31m╭─\u001b[39m error \u001b[31m──────────────────────────────────────────────────────────────────────╮\u001b[39m\n      \u001b[31m│\u001b[39m                                                                              \u001b[31m│\u001b[39m\n      \u001b[31m│\u001b[39m                                                                              \u001b[31m│\u001b[39m\n      \u001b[31m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[39m\"\n    `)\n  })\n\n  test('renders with a top and bottom lines only for external errors', async () => {\n    const {lastFrame} = render(<Banner type=\"external_error\" />)\n\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[31m──\u001b[39m external error \u001b[31m──────────────────────────────────────────────────────────────\u001b[39m\n\n\n      \u001b[31m────────────────────────────────────────────────────────────────────────────────\u001b[39m\"\n    `)\n  })\n})\n"]}
+{"version":3,"file":"Banner.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Banner.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAC,MAAM,aAAa,CAAA;AAClC,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAC,MAAM,EAAC,MAAM,qBAAqB,CAAA;AAE1C,QAAQ,CAAC,QAAQ,EAAE,KAAK,IAAI,EAAE;IAC5B,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,SAAS,GAAG,CAAC,CAAA;QAErD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,MAAM,GAAG,CAAC,CAAA;QAClD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,SAAS,GAAG,CAAC,CAAA;QACrD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,OAAO,GAAG,CAAC,CAAA;QACnD,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC9E,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,gBAAgB,GAAG,CAAC,CAAA;QAE5D,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,qBAAqB,CAAC;;;;;;KAMzC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {Banner} from './Banner.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\nimport {render} from 'ink-testing-library'\n\ndescribe('Banner', async () => {\n  test('renders with a border for success', async () => {\n    const {lastFrame} = render(<Banner type=\"success\" />)\n\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[32m╭─\u001b[39m success \u001b[32m────────────────────────────────────────────────────────────────────╮\u001b[39m\n      \u001b[32m│\u001b[39m                                                                              \u001b[32m│\u001b[39m\n      \u001b[32m│\u001b[39m                                                                              \u001b[32m│\u001b[39m\n      \u001b[32m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[39m\n      \"\n    `)\n  })\n\n  test('renders with a border for info', async () => {\n    const {lastFrame} = render(<Banner type=\"info\" />)\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[2m╭─\u001b[22m info \u001b[2m───────────────────────────────────────────────────────────────────────╮\u001b[22m\n      \u001b[2m│\u001b[22m                                                                              \u001b[2m│\u001b[22m\n      \u001b[2m│\u001b[22m                                                                              \u001b[2m│\u001b[22m\n      \u001b[2m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[22m\n      \"\n    `)\n  })\n\n  test('renders with a border for warning', async () => {\n    const {lastFrame} = render(<Banner type=\"warning\" />)\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[33m╭─\u001b[39m warning \u001b[33m────────────────────────────────────────────────────────────────────╮\u001b[39m\n      \u001b[33m│\u001b[39m                                                                              \u001b[33m│\u001b[39m\n      \u001b[33m│\u001b[39m                                                                              \u001b[33m│\u001b[39m\n      \u001b[33m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[39m\n      \"\n    `)\n  })\n\n  test('renders with a border for error', async () => {\n    const {lastFrame} = render(<Banner type=\"error\" />)\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[31m╭─\u001b[39m error \u001b[31m──────────────────────────────────────────────────────────────────────╮\u001b[39m\n      \u001b[31m│\u001b[39m                                                                              \u001b[31m│\u001b[39m\n      \u001b[31m│\u001b[39m                                                                              \u001b[31m│\u001b[39m\n      \u001b[31m╰──────────────────────────────────────────────────────────────────────────────╯\u001b[39m\n      \"\n    `)\n  })\n\n  test('renders with a top and bottom lines only for external errors', async () => {\n    const {lastFrame} = render(<Banner type=\"external_error\" />)\n\n    expect(lastFrame()).toMatchInlineSnapshot(`\n      \"\u001b[31m──\u001b[39m external error \u001b[31m──────────────────────────────────────────────────────────────\u001b[39m\n\n\n      \u001b[31m────────────────────────────────────────────────────────────────────────────────\u001b[39m\n      \"\n    `)\n  })\n})\n"]}

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

@@ -29,7 +29,7 @@ const FatalError = ({ error }) => {
     if (error instanceof ExternalError) {
         tool = `${error.command} ${error.args.join(' ')}`;
     }
-    return (React.createElement(Banner, { type: tool ? 'external_error' : 'error', marginY: 1 },
+    return (React.createElement(Banner, { type: tool ? 'external_error' : 'error' },
         tool && (React.createElement(Box, { marginBottom: 1 },
             React.createElement(Text, null,
                 "Error coming from ",

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

@@ -1 +1 @@
-{"version":3,"file":"FatalError.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/FatalError.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Banner} from './Banner.js'\nimport {TokenizedText} from './TokenizedText.js'\nimport {Command} from './Command.js'\nimport {List} from './List.js'\nimport {Bug, cleanSingleStackTracePath, ExternalError, Fatal} from '../../../../error.js'\nimport {Box, Text} from 'ink'\nimport React from 'react'\nimport StackTracey from 'stacktracey'\n\nexport interface FatalErrorProps {\n  error: Fatal\n}\n\nconst FatalError: React.FC<FatalErrorProps> = ({error}) => {\n  let stack\n  let tool\n\n  if (error instanceof Bug) {\n    stack = new StackTracey(error)\n    stack.items.forEach((item) => {\n      item.file = cleanSingleStackTracePath(item.file)\n    })\n\n    stack = stack.withSources()\n    stack = stack\n      .filter((entry) => {\n        return !entry.file.includes('@oclif/core')\n      })\n      .map((item) => {\n        /** We make the paths relative to the packages/ directory */\n        const fileShortComponents = item.fileShort.split('packages/')\n        item.fileShort = fileShortComponents.length === 2 ? fileShortComponents[1]! : fileShortComponents[0]!\n        return item\n      })\n  }\n\n  if (error instanceof ExternalError) {\n    tool = `${error.command} ${error.args.join(' ')}`\n  }\n\n  return (\n    <Banner type={tool ? 'external_error' : 'error'} marginY={1}>\n      {tool && (\n        <Box marginBottom={1}>\n          <Text>\n            Error coming from <Command command={tool} />\n          </Text>\n        </Box>\n      )}\n\n      <Box>\n        <Text>{error.message}</Text>\n      </Box>\n\n      {error.tryMessage && (\n        <Box marginTop={1}>\n          <TokenizedText item={error.tryMessage} />\n        </Box>\n      )}\n\n      {error.nextSteps && (\n        <Box marginTop={1}>\n          <List title=\"Next steps\" items={error.nextSteps} />\n        </Box>\n      )}\n\n      {stack && stack.items.length !== 0 && (\n        <Box marginTop={1} flexDirection=\"column\">\n          <Text>To investigate the issue, examine this stack trace:</Text>\n          {stack.items.map((item, index) => (\n            <Box flexDirection=\"column\" key={index} paddingLeft={2}>\n              <Text>\n                at{item.calleeShort && <Text color=\"yellow\">{` ${item.calleeShort}`}</Text>}\n                {item.fileShort && ` (${item.fileShort}:${item.line})`}\n              </Text>\n              <Box paddingLeft={2}>\n                <Text dimColor>{item.sourceLine?.trim()}</Text>\n              </Box>\n            </Box>\n          ))}\n        </Box>\n      )}\n    </Banner>\n  )\n}\n\nexport {FatalError}\n"]}
+{"version":3,"file":"FatalError.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/FatalError.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Banner} from './Banner.js'\nimport {TokenizedText} from './TokenizedText.js'\nimport {Command} from './Command.js'\nimport {List} from './List.js'\nimport {Bug, cleanSingleStackTracePath, ExternalError, Fatal} from '../../../../error.js'\nimport {Box, Text} from 'ink'\nimport React from 'react'\nimport StackTracey from 'stacktracey'\n\nexport interface FatalErrorProps {\n  error: Fatal\n}\n\nconst FatalError: React.FC<FatalErrorProps> = ({error}) => {\n  let stack\n  let tool\n\n  if (error instanceof Bug) {\n    stack = new StackTracey(error)\n    stack.items.forEach((item) => {\n      item.file = cleanSingleStackTracePath(item.file)\n    })\n\n    stack = stack.withSources()\n    stack = stack\n      .filter((entry) => {\n        return !entry.file.includes('@oclif/core')\n      })\n      .map((item) => {\n        /** We make the paths relative to the packages/ directory */\n        const fileShortComponents = item.fileShort.split('packages/')\n        item.fileShort = fileShortComponents.length === 2 ? fileShortComponents[1]! : fileShortComponents[0]!\n        return item\n      })\n  }\n\n  if (error instanceof ExternalError) {\n    tool = `${error.command} ${error.args.join(' ')}`\n  }\n\n  return (\n    <Banner type={tool ? 'external_error' : 'error'}>\n      {tool && (\n        <Box marginBottom={1}>\n          <Text>\n            Error coming from <Command command={tool} />\n          </Text>\n        </Box>\n      )}\n\n      <Box>\n        <Text>{error.message}</Text>\n      </Box>\n\n      {error.tryMessage && (\n        <Box marginTop={1}>\n          <TokenizedText item={error.tryMessage} />\n        </Box>\n      )}\n\n      {error.nextSteps && (\n        <Box marginTop={1}>\n          <List title=\"Next steps\" items={error.nextSteps} />\n        </Box>\n      )}\n\n      {stack && stack.items.length !== 0 && (\n        <Box marginTop={1} flexDirection=\"column\">\n          <Text>To investigate the issue, examine this stack trace:</Text>\n          {stack.items.map((item, index) => (\n            <Box flexDirection=\"column\" key={index} paddingLeft={2}>\n              <Text>\n                at{item.calleeShort && <Text color=\"yellow\">{` ${item.calleeShort}`}</Text>}\n                {item.fileShort && ` (${item.fileShort}:${item.line})`}\n              </Text>\n              <Box paddingLeft={2}>\n                <Text dimColor>{item.sourceLine?.trim()}</Text>\n              </Box>\n            </Box>\n          ))}\n        </Box>\n      )}\n    </Banner>\n  )\n}\n\nexport {FatalError}\n"]}

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

@@ -9,8 +9,7 @@ describe('FatalError', async () => {
         const error = new Abort('test', 'try this');
         const { lastFrame } = render(React.createElement(FatalError, { error: error }));
         expect(unstyled(lastFrame())).toMatchInlineSnapshot(`
-      "
-      ╭─ error ──────────────────────────────────────────────────────────────────────╮
+      "╭─ error ──────────────────────────────────────────────────────────────────────╮
       │                                                                              │
       │  test                                                                        │
       │                                                                              │
@@ -31,8 +30,7 @@ describe('FatalError', async () => {
     `;
         const { lastFrame } = render(React.createElement(FatalError, { error: error }));
         expect(unstyled(lastFrame())).toMatchInlineSnapshot(`
-      "
-      ╭─ error ──────────────────────────────────────────────────────────────────────╮
+      "╭─ error ──────────────────────────────────────────────────────────────────────╮
       │                                                                              │
       │  Unexpected error                                                            │
       │                                                                              │
@@ -78,8 +76,7 @@ describe('FatalError', async () => {
         ];
         const { lastFrame } = render(React.createElement(FatalError, { error: error }));
         expect(unstyled(lastFrame())).toMatchInlineSnapshot(`
-      "
-      ╭─ error ──────────────────────────────────────────────────────────────────────╮
+      "╭─ error ──────────────────────────────────────────────────────────────────────╮
       │                                                                              │
       │  Unexpected error                                                            │
       │                                                                              │
@@ -104,8 +101,7 @@ describe('FatalError', async () => {
         const error = new ExternalError('Unexpected error', 'yarn', ['install']);
         const { lastFrame } = render(React.createElement(FatalError, { error: error }));
         expect(unstyled(lastFrame())).toMatchInlineSnapshot(`
-      "
-      ── external error ──────────────────────────────────────────────────────────────
+      "── external error ──────────────────────────────────────────────────────────────
 
       Error coming from \`yarn install\`
 

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

@@ -1 +1 @@
-{"version":3,"file":"FatalError.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/FatalError.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAA;AAC1C,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAA;AAC9C,OAAO,EAAC,KAAK,EAAE,GAAG,EAAE,aAAa,EAAC,MAAM,sBAAsB,CAAA;AAC9D,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAC,MAAM,EAAC,MAAM,qBAAqB,CAAA;AAE1C,QAAQ,CAAC,YAAY,EAAE,KAAK,IAAI,EAAE;IAChC,IAAI,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACxE,MAAM,KAAK,GAAG,IAAI,KAAK,CAAC,MAAM,EAAE,UAAU,CAAC,CAAA;QAC3C,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;KAUpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;QAC9D,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,kBAAkB,CAAC,CAAA;QACzC,KAAK,CAAC,KAAK,GAAG;;;;;;KAMb,CAAA;QAED,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;KAcpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,2DAA2D,EAAE,KAAK,IAAI,EAAE;QAC3E,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,kBAAkB,CAAC,CAAA;QACzC,KAAK,CAAC,KAAK,GAAG;;;;;;KAMb,CAAA;QAED,KAAK,CAAC,SAAS,GAAG;YAChB;gBACE,UAAU;gBACV;oBACE,IAAI,EAAE;wBACJ,KAAK,EAAE,yCAAyC;wBAChD,GAAG,EAAE,qCAAqC;qBAC3C;iBACF;gBACD;oBACE,IAAI,EAAE,GAAG;iBACV;aACF;YACD,gEAAgE;YAChE;gBACE,gFAAgF;gBAChF;oBACE,OAAO,EAAE,SAAS;iBACnB;aACF;SACF,CAAA;QAED,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;;;;;KAqBpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,KAAK,GAAG,IAAI,aAAa,CAAC,kBAAkB,EAAE,MAAM,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;QAExE,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;KAUpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {FatalError} from './FatalError.js'\nimport {unstyled} from '../../../../output.js'\nimport {Abort, Bug, ExternalError} from '../../../../error.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\nimport {render} from 'ink-testing-library'\n\ndescribe('FatalError', async () => {\n  test('renders correctly with a just a message and tryMessage', async () => {\n    const error = new Abort('test', 'try this')\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"\n      ╭─ error ──────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  test                                                                        │\n      │                                                                              │\n      │  try this                                                                    │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly with a message and a stack', async () => {\n    const error = new Bug('Unexpected error')\n    error.stack = `\n      Error: Unexpected error\n          at Module._compile (internal/modules/cjs/loader.js:1137:30)\n          at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)\n          at Module.load (internal/modules/cjs/loader.js:985:32)\n          at Function.Module._load (internal/modules/cjs/loader.js:878:14)\n    `\n\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"\n      ╭─ error ──────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  Unexpected error                                                            │\n      │                                                                              │\n      │  To investigate the issue, examine this stack trace:                         │\n      │    at _compile (internal/modules/cjs/loader.js:1137)                         │\n      │    at js (internal/modules/cjs/loader.js:1157)                               │\n      │    at load (internal/modules/cjs/loader.js:985)                              │\n      │    at _load (internal/modules/cjs/loader.js:878)                             │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly with a message, a stack, and next steps', async () => {\n    const error = new Bug('Unexpected error')\n    error.stack = `\n      Error: Unexpected error\n          at Module._compile (internal/modules/cjs/loader.js:1137:30)\n          at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)\n          at Module.load (internal/modules/cjs/loader.js:985:32)\n          at Function.Module._load (internal/modules/cjs/loader.js:878:14)\n    `\n\n    error.nextSteps = [\n      [\n        'Have you',\n        {\n          link: {\n            label: 'created a Shopify Partners organization',\n            url: 'https://partners.shopify.com/signup',\n          },\n        },\n        {\n          char: '?',\n        },\n      ],\n      'Have you confirmed your accounts from the emails you received?',\n      [\n        'Need to connect to a different App or organization? Run the command again with',\n        {\n          command: '--reset',\n        },\n      ],\n    ]\n\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"\n      ╭─ error ──────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  Unexpected error                                                            │\n      │                                                                              │\n      │  Next steps                                                                  │\n      │    • Have you created a Shopify Partners organization (                      │\n      │      https://partners.shopify.com/signup )?                                  │\n      │    • Have you confirmed your accounts from the emails you received?          │\n      │    • Need to connect to a different App or organization? Run the command     │\n      │      again with \\`--reset\\`                                                    │\n      │                                                                              │\n      │  To investigate the issue, examine this stack trace:                         │\n      │    at _compile (internal/modules/cjs/loader.js:1137)                         │\n      │    at js (internal/modules/cjs/loader.js:1157)                               │\n      │    at load (internal/modules/cjs/loader.js:985)                              │\n      │    at _load (internal/modules/cjs/loader.js:878)                             │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly an external error', async () => {\n    const error = new ExternalError('Unexpected error', 'yarn', ['install'])\n\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"\n      ── external error ──────────────────────────────────────────────────────────────\n\n      Error coming from \\`yarn install\\`\n\n      Unexpected error\n\n      ────────────────────────────────────────────────────────────────────────────────\n      \"\n    `)\n  })\n})\n"]}
+{"version":3,"file":"FatalError.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/FatalError.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,iBAAiB,CAAA;AAC1C,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAA;AAC9C,OAAO,EAAC,KAAK,EAAE,GAAG,EAAE,aAAa,EAAC,MAAM,sBAAsB,CAAA;AAC9D,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAC,MAAM,EAAC,MAAM,qBAAqB,CAAA;AAE1C,QAAQ,CAAC,YAAY,EAAE,KAAK,IAAI,EAAE;IAChC,IAAI,CAAC,wDAAwD,EAAE,KAAK,IAAI,EAAE;QACxE,MAAM,KAAK,GAAG,IAAI,KAAK,CAAC,MAAM,EAAE,UAAU,CAAC,CAAA;QAC3C,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;KASpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;QAC9D,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,kBAAkB,CAAC,CAAA;QACzC,KAAK,CAAC,KAAK,GAAG;;;;;;KAMb,CAAA;QAED,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;KAapD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,2DAA2D,EAAE,KAAK,IAAI,EAAE;QAC3E,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,kBAAkB,CAAC,CAAA;QACzC,KAAK,CAAC,KAAK,GAAG;;;;;;KAMb,CAAA;QAED,KAAK,CAAC,SAAS,GAAG;YAChB;gBACE,UAAU;gBACV;oBACE,IAAI,EAAE;wBACJ,KAAK,EAAE,yCAAyC;wBAChD,GAAG,EAAE,qCAAqC;qBAC3C;iBACF;gBACD;oBACE,IAAI,EAAE,GAAG;iBACV;aACF;YACD,gEAAgE;YAChE;gBACE,gFAAgF;gBAChF;oBACE,OAAO,EAAE,SAAS;iBACnB;aACF;SACF,CAAA;QAED,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;;;;KAoBpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,KAAK,GAAG,IAAI,aAAa,CAAC,kBAAkB,EAAE,MAAM,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;QAExE,MAAM,EAAC,SAAS,EAAC,GAAG,MAAM,CAAC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAA;QAExD,MAAM,CAAC,QAAQ,CAAC,SAAS,EAAG,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;KASpD,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {FatalError} from './FatalError.js'\nimport {unstyled} from '../../../../output.js'\nimport {Abort, Bug, ExternalError} from '../../../../error.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\nimport {render} from 'ink-testing-library'\n\ndescribe('FatalError', async () => {\n  test('renders correctly with a just a message and tryMessage', async () => {\n    const error = new Abort('test', 'try this')\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"╭─ error ──────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  test                                                                        │\n      │                                                                              │\n      │  try this                                                                    │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly with a message and a stack', async () => {\n    const error = new Bug('Unexpected error')\n    error.stack = `\n      Error: Unexpected error\n          at Module._compile (internal/modules/cjs/loader.js:1137:30)\n          at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)\n          at Module.load (internal/modules/cjs/loader.js:985:32)\n          at Function.Module._load (internal/modules/cjs/loader.js:878:14)\n    `\n\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"╭─ error ──────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  Unexpected error                                                            │\n      │                                                                              │\n      │  To investigate the issue, examine this stack trace:                         │\n      │    at _compile (internal/modules/cjs/loader.js:1137)                         │\n      │    at js (internal/modules/cjs/loader.js:1157)                               │\n      │    at load (internal/modules/cjs/loader.js:985)                              │\n      │    at _load (internal/modules/cjs/loader.js:878)                             │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly with a message, a stack, and next steps', async () => {\n    const error = new Bug('Unexpected error')\n    error.stack = `\n      Error: Unexpected error\n          at Module._compile (internal/modules/cjs/loader.js:1137:30)\n          at Object.Module._extensions..js (internal/modules/cjs/loader.js:1157:10)\n          at Module.load (internal/modules/cjs/loader.js:985:32)\n          at Function.Module._load (internal/modules/cjs/loader.js:878:14)\n    `\n\n    error.nextSteps = [\n      [\n        'Have you',\n        {\n          link: {\n            label: 'created a Shopify Partners organization',\n            url: 'https://partners.shopify.com/signup',\n          },\n        },\n        {\n          char: '?',\n        },\n      ],\n      'Have you confirmed your accounts from the emails you received?',\n      [\n        'Need to connect to a different App or organization? Run the command again with',\n        {\n          command: '--reset',\n        },\n      ],\n    ]\n\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"╭─ error ──────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  Unexpected error                                                            │\n      │                                                                              │\n      │  Next steps                                                                  │\n      │    • Have you created a Shopify Partners organization (                      │\n      │      https://partners.shopify.com/signup )?                                  │\n      │    • Have you confirmed your accounts from the emails you received?          │\n      │    • Need to connect to a different App or organization? Run the command     │\n      │      again with \\`--reset\\`                                                    │\n      │                                                                              │\n      │  To investigate the issue, examine this stack trace:                         │\n      │    at _compile (internal/modules/cjs/loader.js:1137)                         │\n      │    at js (internal/modules/cjs/loader.js:1157)                               │\n      │    at load (internal/modules/cjs/loader.js:985)                              │\n      │    at _load (internal/modules/cjs/loader.js:878)                             │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly an external error', async () => {\n    const error = new ExternalError('Unexpected error', 'yarn', ['install'])\n\n    const {lastFrame} = render(<FatalError error={error} />)\n\n    expect(unstyled(lastFrame()!)).toMatchInlineSnapshot(`\n      \"── external error ──────────────────────────────────────────────────────────────\n\n      Error coming from \\`yarn install\\`\n\n      Unexpected error\n\n      ────────────────────────────────────────────────────────────────────────────────\n      \"\n    `)\n  })\n})\n"]}

package/dist/private/node/ui/components/{Table.d.ts → Prompts/InfoTable.d.ts}

@@ -4,5 +4,5 @@ export interface Props {
         [header: string]: string[];
     };
 }
-declare const Table: React.FC<Props>;
-export default Table;
+declare const InfoTable: React.FC<Props>;
+export default InfoTable;

package/dist/private/node/ui/components/{Table.js → Prompts/InfoTable.js}

@@ -1,11 +1,11 @@
-import { List } from './List.js';
-import { capitalize } from '../../../../public/common/string.js';
+import { List } from '../List.js';
+import { capitalize } from '../../../../../public/common/string.js';
 import { Box, Text } from 'ink';
 import React from 'react';
-const Table = ({ table }) => {
+const InfoTable = ({ table }) => {
     const headers = Object.keys(table);
     const headerColumnWidth = Math.max(...headers.map((header) => header.length));
-    return (React.createElement(Box, { flexDirection: "column", paddingY: 1 }, headers.map((header, index) => (React.createElement(Box, { key: index, marginBottom: index === headers.length - 1 ? 0 : 1 },
+    return (React.createElement(Box, { flexDirection: "column" }, headers.map((header, index) => (React.createElement(Box, { key: index, marginBottom: index === headers.length - 1 ? 0 : 1 },
         React.createElement(Box, { width: headerColumnWidth + 1 },
             React.createElement(Text, null,
                 capitalize(header),
@@ -13,5 +13,5 @@ const Table = ({ table }) => {
         React.createElement(Box, { flexGrow: 1 },
             React.createElement(List, { items: table[header] })))))));
 };
-export default Table;
-//# sourceMappingURL=Table.js.map
+export default InfoTable;
+//# sourceMappingURL=InfoTable.js.map

package/dist/private/node/ui/components/Prompts/InfoTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoTable.js","sourceRoot":"","sources":["../../../../../../src/private/node/ui/components/Prompts/InfoTable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,YAAY,CAAA;AAC/B,OAAO,EAAC,UAAU,EAAC,MAAM,wCAAwC,CAAA;AACjE,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,MAAM,SAAS,GAAoB,CAAC,EAAC,KAAK,EAAC,EAAE,EAAE;IAC7C,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IAClC,MAAM,iBAAiB,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAA;IAE7E,OAAO,CACL,oBAAC,GAAG,IAAC,aAAa,EAAC,QAAQ,IACxB,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,CAC9B,oBAAC,GAAG,IAAC,GAAG,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,KAAK,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACjE,oBAAC,GAAG,IAAC,KAAK,EAAE,iBAAiB,GAAG,CAAC;YAC/B,oBAAC,IAAI;gBAAE,UAAU,CAAC,MAAM,CAAC;oBAAS,CAC9B;QACN,oBAAC,GAAG,IAAC,QAAQ,EAAE,CAAC;YACd,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAE,GAAI,CAC3B,CACF,CACP,CAAC,CACE,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,SAAS,CAAA","sourcesContent":["import {List} from '../List.js'\nimport {capitalize} from '../../../../../public/common/string.js'\nimport {Box, Text} from 'ink'\nimport React from 'react'\n\nexport interface Props {\n  table: {\n    [header: string]: string[]\n  }\n}\n\nconst InfoTable: React.FC<Props> = ({table}) => {\n  const headers = Object.keys(table)\n  const headerColumnWidth = Math.max(...headers.map((header) => header.length))\n\n  return (\n    <Box flexDirection=\"column\">\n      {headers.map((header, index) => (\n        <Box key={index} marginBottom={index === headers.length - 1 ? 0 : 1}>\n          <Box width={headerColumnWidth + 1}>\n            <Text>{capitalize(header)}:</Text>\n          </Box>\n          <Box flexGrow={1}>\n            <List items={table[header]!} />\n          </Box>\n        </Box>\n      ))}\n    </Box>\n  )\n}\n\nexport default InfoTable\n"]}

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

@@ -1,7 +1,14 @@
 import React from 'react';
 export interface Props<T> {
     items: Item<T>[];
-    onChange: (item: Item<T>) => void;
+    onChange: (item: Item<T> | undefined) => void;
+    enableShortcuts?: boolean;
+    focus?: boolean;
+    emptyMessage?: string;
+    defaultValue?: Item<T>;
+    highlightedTerm?: string;
+    loading?: boolean;
+    errorMessage?: string;
 }
 export interface Item<T> {
     label: string;
@@ -9,4 +16,4 @@ export interface Item<T> {
     key?: string;
     group?: string;
 }
-export default function SelectInput<T>({ items, onChange }: React.PropsWithChildren<Props<T>>): JSX.Element | null;
+export default function SelectInput<T>({ items, onChange, enableShortcuts, focus, emptyMessage, defaultValue, highlightedTerm, loading, errorMessage, }: React.PropsWithChildren<Props<T>>): JSX.Element | null;

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

@@ -1,23 +1,55 @@
 import { isEqual } from '../../../../public/common/lang.js';
-import { groupBy } from '../../../../public/common/collection.js';
+import { groupBy, partition } from '../../../../public/common/collection.js';
 import { mapValues } from '../../../../public/common/object.js';
 import React, { useState, useEffect, useRef, useCallback } from 'react';
 import { Box, useInput, Text } from 'ink';
+import { debounce } from '@shopify/cli-kit/common/function';
+import chalk from 'chalk';
+import figures from 'figures';
+function highlightedLabel(label, term) {
+    if (!term) {
+        return label;
+    }
+    const regex = new RegExp(term, 'i');
+    return label.replace(regex, (match) => {
+        return chalk.bold(match);
+    });
+}
 function groupItems(items) {
     let index = 0;
-    return mapValues(groupBy(items, 'group'), (groupItems) => groupItems.map((groupItem) => {
+    const [withGroup, withoutGroup] = partition(items, 'group');
+    const withGroupMapped = mapValues(groupBy(withGroup, 'group'), (groupItems) => groupItems.map((groupItem) => {
         const item = { ...groupItem, key: groupItem.key ?? (index + 1).toString(), index };
         index += 1;
         return item;
     }));
+    const withoutGroupMapped = withoutGroup.map((item) => {
+        const newItem = { ...item, key: item.key ?? (index + 1).toString(), index };
+        index += 1;
+        return newItem;
+    });
+    return [withGroupMapped, withoutGroupMapped];
+}
+function SelectItemsGroup({ title, items, selectedIndex, hasMarginTop, enableShortcuts, highlightedTerm, }) {
+    return (React.createElement(Box, { key: title, flexDirection: "column", marginTop: hasMarginTop ? 1 : 0 },
+        title && (React.createElement(Box, { marginLeft: 3 },
+            React.createElement(Text, { bold: true }, title))),
+        items.map((item) => {
+            const isSelected = item.index === selectedIndex;
+            const label = highlightedLabel(item.label, highlightedTerm);
+            return (React.createElement(Box, { key: item.key },
+                React.createElement(Box, { marginRight: 2 }, isSelected ? React.createElement(Text, { color: "cyan" }, `>`) : React.createElement(Text, null, " ")),
+                React.createElement(Text, { color: isSelected ? 'cyan' : undefined }, enableShortcuts ? `(${item.key}) ${label}` : label)));
+        })));
 }
-export default function SelectInput({ items, onChange }) {
-    const [inputStack, setInputStack] = useState(null);
-    const [inputTimeout, setInputTimeout] = useState(null);
-    const [selectedIndex, setSelectedIndex] = useState(0);
-    const keys = useRef(new Set(items.map((item) => item.key)));
-    const groupedItems = groupItems(items);
-    const groupedItemsValues = Object.values(groupedItems).flat();
+export default function SelectInput({ items, onChange, enableShortcuts = true, focus = true, emptyMessage = 'No items to select.', defaultValue, highlightedTerm, loading = false, errorMessage, }) {
+    const defaultValueIndex = defaultValue ? items.findIndex((item) => item.value === defaultValue.value) : -1;
+    const initialIndex = defaultValueIndex === -1 ? 0 : defaultValueIndex;
+    const inputStack = useRef(null);
+    const [selectedIndex, setSelectedIndex] = useState(initialIndex);
+    const [groupedItems, ungroupedItems] = groupItems(items);
+    const groupedItemsValues = [...Object.values(groupedItems).flat(), ...ungroupedItems];
+    const keys = groupedItemsValues.map((item) => item.key);
     const groupTitles = Object.keys(groupedItems);
     const previousItems = useRef(items);
     const changeSelection = useCallback((index) => {
@@ -25,63 +57,75 @@ export default function SelectInput({ items, onChange }) {
         setSelectedIndex(index);
         onChange(items.find((item) => item.value === groupedItem.value));
     }, [items]);
-    // reset index when items change
     useEffect(() => {
-        if (!isEqual(previousItems.current.map((item) => item.value), items.map((item) => item.value))) {
+        if (items.length === 0) {
+            // reset selection when items are empty
+            onChange(undefined);
+        }
+        else if (
+        // reset index when items change
+        !isEqual(previousItems.current.map((item) => item.value), items.map((item) => item.value))) {
             changeSelection(0);
         }
         previousItems.current = items;
     }, [items]);
-    const handleInput = useCallback((input, key) => {
-        const parsedInput = parseInt(input, 10);
-        if (parsedInput !== 0 && parsedInput <= items.length + 1) {
-            changeSelection(parsedInput - 1);
-        }
-        else if (keys.current.has(input)) {
-            const groupedItem = groupedItemsValues.find((item) => item.key === input);
-            if (groupedItem !== undefined) {
-                changeSelection(groupedItem.index);
-            }
-        }
+    const handleArrows = useCallback((key) => {
+        const lastIndex = items.length - 1;
         if (key.upArrow) {
-            const lastIndex = items.length - 1;
             changeSelection(selectedIndex === 0 ? lastIndex : selectedIndex - 1);
         }
         else if (key.downArrow) {
-            changeSelection(selectedIndex === items.length - 1 ? 0 : selectedIndex + 1);
+            changeSelection(selectedIndex === lastIndex ? 0 : selectedIndex + 1);
         }
     }, [selectedIndex, items]);
-    useInput((input, key) => {
-        if (input.length > 0 && Object.values(key).every((value) => value === false)) {
-            const newInputStack = inputStack === null ? input : inputStack + input;
-            setInputStack(newInputStack);
-            if (inputTimeout !== null) {
-                clearTimeout(inputTimeout);
+    const handleShortcuts = useCallback((input) => {
+        if (keys.includes(input)) {
+            const groupedItem = groupedItemsValues.find((item) => item.key === input);
+            if (groupedItem !== undefined) {
+                changeSelection(groupedItem.index);
             }
-            setInputTimeout(setTimeout(() => {
-                handleInput(newInputStack, key);
-                setInputStack(null);
-                setInputTimeout(null);
-            }, 300));
+        }
+    }, [items]);
+    const debounceHandleShortcuts = useCallback(debounce((newInputStack) => {
+        handleShortcuts(newInputStack);
+        inputStack.current = null;
+    }, 300), []);
+    useInput((input, key) => {
+        // check that no special modifier (shift, control, etc.) is being pressed
+        if (enableShortcuts && input.length > 0 && Object.values(key).every((value) => value === false)) {
+            const newInputStack = inputStack.current === null ? input : inputStack.current + input;
+            inputStack.current = newInputStack;
+            debounceHandleShortcuts(newInputStack);
         }
         else {
-            handleInput(input, key);
+            debounceHandleShortcuts.cancel();
+            inputStack.current = null;
+            handleArrows(key);
         }
-    });
-    return (React.createElement(Box, { flexDirection: "column" },
-        groupTitles.map((title) => {
-            const hasTitle = title !== 'undefined';
-            return (React.createElement(Box, { key: title, flexDirection: "column", marginTop: hasTitle ? 1 : 0 },
-                hasTitle && (React.createElement(Box, { marginLeft: 3 },
-                    React.createElement(Text, { bold: true }, title))),
-                groupedItems[title].map((item) => {
-                    const isSelected = item.index === selectedIndex;
-                    return (React.createElement(Box, { key: item.key },
-                        React.createElement(Box, { marginRight: 2 }, isSelected ? React.createElement(Text, { color: "cyan" }, `>`) : React.createElement(Text, null, " ")),
-                        React.createElement(Text, { color: isSelected ? 'cyan' : undefined }, `(${item.key}) ${item.label}`)));
-                })));
-        }),
-        React.createElement(Box, { marginTop: 1, marginLeft: 3 },
-            React.createElement(Text, { dimColor: true }, "navigate with arrows, enter to select"))));
+    }, { isActive: focus });
+    const ungroupedItemsTitle = groupTitles.length > 0 ? 'Other' : undefined;
+    if (loading) {
+        return (React.createElement(Box, { marginLeft: 3 },
+            React.createElement(Text, { dimColor: true }, "Loading...")));
+    }
+    else if (errorMessage && errorMessage.length > 0) {
+        return (React.createElement(Box, { marginLeft: 3 },
+            React.createElement(Text, { color: "red" }, errorMessage)));
+    }
+    else if (items.length === 0) {
+        return (React.createElement(Box, { marginLeft: 3 },
+            React.createElement(Text, { dimColor: true }, emptyMessage)));
+    }
+    else {
+        return (React.createElement(Box, { flexDirection: "column" },
+            groupTitles.map((title, index) => (React.createElement(SelectItemsGroup, { title: title, selectedIndex: selectedIndex, items: groupedItems[title], key: title, hasMarginTop: index !== 0, enableShortcuts: enableShortcuts, highlightedTerm: highlightedTerm }))),
+            ungroupedItems.length > 0 && (React.createElement(SelectItemsGroup, { title: ungroupedItemsTitle, selectedIndex: selectedIndex, items: ungroupedItems, hasMarginTop: groupTitles.length > 0, enableShortcuts: enableShortcuts, highlightedTerm: highlightedTerm })),
+            React.createElement(Box, { marginTop: 1, marginLeft: 3 },
+                React.createElement(Text, { dimColor: true },
+                    "Press ",
+                    figures.arrowUp,
+                    figures.arrowDown,
+                    " arrows to select, enter to confirm"))));
+    }
 }
 //# sourceMappingURL=SelectInput.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"SelectInput.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/SelectInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {isEqual} from '../../../../public/common/lang.js'\nimport {groupBy} from '../../../../public/common/collection.js'\nimport {mapValues} from '../../../../public/common/object.js'\nimport React, {useState, useEffect, useRef, useCallback} from 'react'\nimport {Box, Key, useInput, Text} from 'ink'\n\nexport interface Props<T> {\n  items: Item<T>[]\n  onChange: (item: Item<T>) => void\n}\n\nexport interface Item<T> {\n  label: string\n  value: T\n  key?: string\n  group?: string\n}\n\nfunction groupItems<T>(items: Item<T>[]) {\n  let index = 0\n\n  return mapValues(groupBy(items, 'group'), (groupItems) =>\n    groupItems.map((groupItem) => {\n      const item = {...groupItem, key: groupItem.key ?? (index + 1).toString(), index}\n      index += 1\n      return item\n    }),\n  )\n}\n\nexport default function SelectInput<T>({items, onChange}: React.PropsWithChildren<Props<T>>): JSX.Element | null {\n  const [inputStack, setInputStack] = useState<string | null>(null)\n  const [inputTimeout, setInputTimeout] = useState<NodeJS.Timeout | null>(null)\n  const [selectedIndex, setSelectedIndex] = useState(0)\n  const keys = useRef(new Set(items.map((item) => item.key)))\n  const groupedItems = groupItems(items)\n  const groupedItemsValues = Object.values(groupedItems).flat()\n  const groupTitles = Object.keys(groupedItems)\n  const previousItems = useRef<Item<T>[]>(items)\n\n  const changeSelection = useCallback(\n    (index: number) => {\n      const groupedItem = groupedItemsValues.find((item) => item.index === index)!\n      setSelectedIndex(index)\n      onChange(items.find((item) => item.value === groupedItem.value)!)\n    },\n    [items],\n  )\n\n  // reset index when items change\n  useEffect(() => {\n    if (\n      !isEqual(\n        previousItems.current.map((item) => item.value),\n        items.map((item) => item.value),\n      )\n    ) {\n      changeSelection(0)\n    }\n\n    previousItems.current = items\n  }, [items])\n\n  const handleInput = useCallback(\n    (input: string, key: Key) => {\n      const parsedInput = parseInt(input, 10)\n\n      if (parsedInput !== 0 && parsedInput <= items.length + 1) {\n        changeSelection(parsedInput - 1)\n      } else if (keys.current.has(input)) {\n        const groupedItem = groupedItemsValues.find((item) => item.key === input)\n        if (groupedItem !== undefined) {\n          changeSelection(groupedItem.index)\n        }\n      }\n\n      if (key.upArrow) {\n        const lastIndex = items.length - 1\n\n        changeSelection(selectedIndex === 0 ? lastIndex : selectedIndex - 1)\n      } else if (key.downArrow) {\n        changeSelection(selectedIndex === items.length - 1 ? 0 : selectedIndex + 1)\n      }\n    },\n    [selectedIndex, items],\n  )\n\n  useInput((input, key) => {\n    if (input.length > 0 && Object.values(key).every((value) => value === false)) {\n      const newInputStack = inputStack === null ? input : inputStack + input\n\n      setInputStack(newInputStack)\n\n      if (inputTimeout !== null) {\n        clearTimeout(inputTimeout)\n      }\n\n      setInputTimeout(\n        setTimeout(() => {\n          handleInput(newInputStack, key)\n          setInputStack(null)\n          setInputTimeout(null)\n        }, 300),\n      )\n    } else {\n      handleInput(input, key)\n    }\n  })\n\n  return (\n    <Box flexDirection=\"column\">\n      {groupTitles.map((title) => {\n        const hasTitle = title !== 'undefined'\n\n        return (\n          <Box key={title} flexDirection=\"column\" marginTop={hasTitle ? 1 : 0}>\n            {hasTitle && (\n              <Box marginLeft={3}>\n                <Text bold>{title}</Text>\n              </Box>\n            )}\n            {groupedItems[title]!.map((item) => {\n              const isSelected = item.index === selectedIndex\n\n              return (\n                <Box key={item.key}>\n                  <Box marginRight={2}>{isSelected ? <Text color=\"cyan\">{`>`}</Text> : <Text> </Text>}</Box>\n\n                  <Text color={isSelected ? 'cyan' : undefined}>{`(${item.key}) ${item.label}`}</Text>\n                </Box>\n              )\n            })}\n          </Box>\n        )\n      })}\n\n      <Box marginTop={1} marginLeft={3}>\n        <Text dimColor>navigate with arrows, enter to select</Text>\n      </Box>\n    </Box>\n  )\n}\n"]}
+{"version":3,"file":"SelectInput.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/SelectInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {isEqual} from '../../../../public/common/lang.js'\nimport {groupBy, partition} from '../../../../public/common/collection.js'\nimport {mapValues} from '../../../../public/common/object.js'\nimport React, {useState, useEffect, useRef, useCallback} from 'react'\nimport {Box, Key, useInput, Text} from 'ink'\nimport {debounce} from '@shopify/cli-kit/common/function'\nimport chalk from 'chalk'\nimport figures from 'figures'\n\nexport interface Props<T> {\n  items: Item<T>[]\n  onChange: (item: Item<T> | undefined) => void\n  enableShortcuts?: boolean\n  focus?: boolean\n  emptyMessage?: string\n  defaultValue?: Item<T>\n  highlightedTerm?: string\n  loading?: boolean\n  errorMessage?: string\n}\n\nexport interface Item<T> {\n  label: string\n  value: T\n  key?: string\n  group?: string\n}\n\ninterface ItemWithIndex<T> extends Item<T> {\n  key: string\n  index: number\n}\n\nfunction highlightedLabel(label: string, term: string | undefined) {\n  if (!term) {\n    return label\n  }\n\n  const regex = new RegExp(term, 'i')\n  return label.replace(regex, (match) => {\n    return chalk.bold(match)\n  })\n}\n\nfunction groupItems<T>(items: Item<T>[]): [{[key: string]: ItemWithIndex<T>[]}, ItemWithIndex<T>[]] {\n  let index = 0\n\n  const [withGroup, withoutGroup] = partition(items, 'group')\n\n  const withGroupMapped = mapValues(groupBy(withGroup, 'group'), (groupItems) =>\n    groupItems.map((groupItem) => {\n      const item = {...groupItem, key: groupItem.key ?? (index + 1).toString(), index}\n      index += 1\n      return item\n    }),\n  )\n  const withoutGroupMapped = withoutGroup.map((item) => {\n    const newItem = {...item, key: item.key ?? (index + 1).toString(), index}\n    index += 1\n    return newItem\n  })\n\n  return [withGroupMapped, withoutGroupMapped]\n}\n\ninterface SelectItemsGroupProps<T> {\n  title: string | undefined\n  items: ItemWithIndex<T>[]\n  selectedIndex: number\n  hasMarginTop: boolean\n  enableShortcuts: boolean\n  highlightedTerm?: string\n}\n\nfunction SelectItemsGroup<T>({\n  title,\n  items,\n  selectedIndex,\n  hasMarginTop,\n  enableShortcuts,\n  highlightedTerm,\n}: SelectItemsGroupProps<T>): JSX.Element {\n  return (\n    <Box key={title} flexDirection=\"column\" marginTop={hasMarginTop ? 1 : 0}>\n      {title && (\n        <Box marginLeft={3}>\n          <Text bold>{title}</Text>\n        </Box>\n      )}\n\n      {items.map((item) => {\n        const isSelected = item.index === selectedIndex\n        const label = highlightedLabel(item.label, highlightedTerm)\n\n        return (\n          <Box key={item.key}>\n            <Box marginRight={2}>{isSelected ? <Text color=\"cyan\">{`>`}</Text> : <Text> </Text>}</Box>\n\n            <Text color={isSelected ? 'cyan' : undefined}>{enableShortcuts ? `(${item.key}) ${label}` : label}</Text>\n          </Box>\n        )\n      })}\n    </Box>\n  )\n}\n\nexport default function SelectInput<T>({\n  items,\n  onChange,\n  enableShortcuts = true,\n  focus = true,\n  emptyMessage = 'No items to select.',\n  defaultValue,\n  highlightedTerm,\n  loading = false,\n  errorMessage,\n}: React.PropsWithChildren<Props<T>>): JSX.Element | null {\n  const defaultValueIndex = defaultValue ? items.findIndex((item) => item.value === defaultValue.value) : -1\n  const initialIndex = defaultValueIndex === -1 ? 0 : defaultValueIndex\n  const inputStack = useRef<string | null>(null)\n  const [selectedIndex, setSelectedIndex] = useState(initialIndex)\n  const [groupedItems, ungroupedItems] = groupItems(items)\n  const groupedItemsValues = [...Object.values(groupedItems).flat(), ...ungroupedItems]\n  const keys = groupedItemsValues.map((item) => item.key)\n  const groupTitles = Object.keys(groupedItems)\n  const previousItems = useRef<Item<T>[]>(items)\n\n  const changeSelection = useCallback(\n    (index: number) => {\n      const groupedItem = groupedItemsValues.find((item) => item.index === index)!\n      setSelectedIndex(index)\n      onChange(items.find((item) => item.value === groupedItem.value))\n    },\n    [items],\n  )\n\n  useEffect(() => {\n    if (items.length === 0) {\n      // reset selection when items are empty\n      onChange(undefined)\n    } else if (\n      // reset index when items change\n      !isEqual(\n        previousItems.current.map((item) => item.value),\n        items.map((item) => item.value),\n      )\n    ) {\n      changeSelection(0)\n    }\n\n    previousItems.current = items\n  }, [items])\n\n  const handleArrows = useCallback(\n    (key: Key) => {\n      const lastIndex = items.length - 1\n\n      if (key.upArrow) {\n        changeSelection(selectedIndex === 0 ? lastIndex : selectedIndex - 1)\n      } else if (key.downArrow) {\n        changeSelection(selectedIndex === lastIndex ? 0 : selectedIndex + 1)\n      }\n    },\n    [selectedIndex, items],\n  )\n\n  const handleShortcuts = useCallback(\n    (input: string) => {\n      if (keys.includes(input)) {\n        const groupedItem = groupedItemsValues.find((item) => item.key === input)\n        if (groupedItem !== undefined) {\n          changeSelection(groupedItem.index)\n        }\n      }\n    },\n    [items],\n  )\n\n  const debounceHandleShortcuts = useCallback(\n    debounce((newInputStack) => {\n      handleShortcuts(newInputStack)\n      inputStack.current = null\n    }, 300),\n    [],\n  )\n\n  useInput(\n    (input, key) => {\n      // check that no special modifier (shift, control, etc.) is being pressed\n      if (enableShortcuts && input.length > 0 && Object.values(key).every((value) => value === false)) {\n        const newInputStack = inputStack.current === null ? input : inputStack.current + input\n\n        inputStack.current = newInputStack\n        debounceHandleShortcuts(newInputStack)\n      } else {\n        debounceHandleShortcuts.cancel()\n        inputStack.current = null\n        handleArrows(key)\n      }\n    },\n    {isActive: focus},\n  )\n\n  const ungroupedItemsTitle = groupTitles.length > 0 ? 'Other' : undefined\n\n  if (loading) {\n    return (\n      <Box marginLeft={3}>\n        <Text dimColor>Loading...</Text>\n      </Box>\n    )\n  } else if (errorMessage && errorMessage.length > 0) {\n    return (\n      <Box marginLeft={3}>\n        <Text color=\"red\">{errorMessage}</Text>\n      </Box>\n    )\n  } else if (items.length === 0) {\n    return (\n      <Box marginLeft={3}>\n        <Text dimColor>{emptyMessage}</Text>\n      </Box>\n    )\n  } else {\n    return (\n      <Box flexDirection=\"column\">\n        {groupTitles.map((title, index) => (\n          <SelectItemsGroup\n            title={title}\n            selectedIndex={selectedIndex}\n            items={groupedItems[title]!}\n            key={title}\n            hasMarginTop={index !== 0}\n            enableShortcuts={enableShortcuts}\n            highlightedTerm={highlightedTerm}\n          ></SelectItemsGroup>\n        ))}\n\n        {ungroupedItems.length > 0 && (\n          <SelectItemsGroup\n            title={ungroupedItemsTitle}\n            selectedIndex={selectedIndex}\n            items={ungroupedItems}\n            hasMarginTop={groupTitles.length > 0}\n            enableShortcuts={enableShortcuts}\n            highlightedTerm={highlightedTerm}\n          ></SelectItemsGroup>\n        )}\n\n        <Box marginTop={1} marginLeft={3}>\n          <Text dimColor>\n            Press {figures.arrowUp}\n            {figures.arrowDown} arrows to select, enter to confirm\n          </Text>\n        </Box>\n      </Box>\n    )\n  }\n}\n"]}