@shopify/cli-kit 3.24.1 → 3.25.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @shopify/cli-kit
 
+## 3.25.0
+
+### Patch Changes
+
+- 78196a78: Improve text contrast of UI kit components and introduce several new text tokens
+
 ## 3.24.1
 
 ### Patch Changes

package/dist/api/graphql/functions/app_function_set.d.ts

@@ -25,5 +25,6 @@ export interface AppFunctionSetVariables {
         createPath?: string;
         detailsPath?: string;
     };
+    enableCreationUi: boolean;
     moduleUploadUrl: string;
 }

package/dist/api/graphql/functions/app_function_set.js

@@ -9,6 +9,7 @@ export const AppFunctionSetMutation = gql `
     $apiVersion: String!
     $inputQuery: String
     $appBridge: AppBridgeInput
+    $enableCreationUi: Boolean
     $moduleUploadUrl: String!
   ) {
     functionSet(
@@ -20,6 +21,7 @@ export const AppFunctionSetMutation = gql `
       apiVersion: $apiVersion
       inputQuery: $inputQuery
       appBridge: $appBridge
+      enableCreationUi: $enableCreationUi
       moduleUploadUrl: $moduleUploadUrl
     ) {
       userErrors {

package/dist/api/graphql/functions/app_function_set.js.map

@@ -1 +1 @@
-{"version":3,"file":"app_function_set.js","sourceRoot":"","sources":["../../../../src/api/graphql/functions/app_function_set.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,iBAAiB,CAAA;AAEnC,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCxC,CAAA","sourcesContent":["import {gql} from 'graphql-request'\n\nexport const AppFunctionSetMutation = gql`\n  mutation FunctionSet(\n    $id: FunctionId\n    $legacyUuid: String\n    $title: String!\n    $description: String\n    $apiType: String!\n    $apiVersion: String!\n    $inputQuery: String\n    $appBridge: AppBridgeInput\n    $moduleUploadUrl: String!\n  ) {\n    functionSet(\n      id: $id\n      legacyUuid: $legacyUuid\n      title: $title\n      description: $description\n      apiType: $apiType\n      apiVersion: $apiVersion\n      inputQuery: $inputQuery\n      appBridge: $appBridge\n      moduleUploadUrl: $moduleUploadUrl\n    ) {\n      userErrors {\n        field\n        message\n        tag\n      }\n      function {\n        id\n      }\n    }\n  }\n`\n\nexport interface AppFunctionSetMutationSchema {\n  data: {\n    functionSet: {\n      userErrors: {\n        field: string\n        message: string\n        tag: string\n      }[]\n      function?: {\n        id: string\n      }\n    }\n  }\n}\n\nexport interface AppFunctionSetVariables {\n  id?: string\n  legacyUuid?: string\n  title: string\n  description?: string\n  apiType: string\n  apiVersion?: string\n  inputQuery?: string\n  appBridge?: {\n    createPath?: string\n    detailsPath?: string\n  }\n  moduleUploadUrl: string\n}\n"]}
+{"version":3,"file":"app_function_set.js","sourceRoot":"","sources":["../../../../src/api/graphql/functions/app_function_set.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAC,MAAM,iBAAiB,CAAA;AAEnC,MAAM,CAAC,MAAM,sBAAsB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCxC,CAAA","sourcesContent":["import {gql} from 'graphql-request'\n\nexport const AppFunctionSetMutation = gql`\n  mutation FunctionSet(\n    $id: FunctionId\n    $legacyUuid: String\n    $title: String!\n    $description: String\n    $apiType: String!\n    $apiVersion: String!\n    $inputQuery: String\n    $appBridge: AppBridgeInput\n    $enableCreationUi: Boolean\n    $moduleUploadUrl: String!\n  ) {\n    functionSet(\n      id: $id\n      legacyUuid: $legacyUuid\n      title: $title\n      description: $description\n      apiType: $apiType\n      apiVersion: $apiVersion\n      inputQuery: $inputQuery\n      appBridge: $appBridge\n      enableCreationUi: $enableCreationUi\n      moduleUploadUrl: $moduleUploadUrl\n    ) {\n      userErrors {\n        field\n        message\n        tag\n      }\n      function {\n        id\n      }\n    }\n  }\n`\n\nexport interface AppFunctionSetMutationSchema {\n  data: {\n    functionSet: {\n      userErrors: {\n        field: string\n        message: string\n        tag: string\n      }[]\n      function?: {\n        id: string\n      }\n    }\n  }\n}\n\nexport interface AppFunctionSetVariables {\n  id?: string\n  legacyUuid?: string\n  title: string\n  description?: string\n  apiType: string\n  apiVersion?: string\n  inputQuery?: string\n  appBridge?: {\n    createPath?: string\n    detailsPath?: string\n  }\n  enableCreationUi: boolean\n  moduleUploadUrl: string\n}\n"]}

package/dist/index.d.ts

@@ -7,7 +7,6 @@ export * as environment from './environment.js';
 export * as error from './error.js';
 export * as file from './file.js';
 export * as git from './git.js';
-export * as github from './github.js';
 export * as http from './http.js';
 export * as id from './id.js';
 export * as log from './log.js';

package/dist/index.js

@@ -7,7 +7,6 @@ export * as environment from './environment.js';
 export * as error from './error.js';
 export * as file from './file.js';
 export * as git from './git.js';
-export * as github from './github.js';
 export * as http from './http.js';
 export * as id from './id.js';
 export * as log from './log.js';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,gBAAgB,CAAA;AACnD,OAAO,KAAK,KAAK,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAA;AAC3C,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,EAAE,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,EAAE,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,OAAO,MAAM,cAAc,CAAA;AACvC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,OAAO,MAAM,cAAc,CAAA;AACvC,OAAO,KAAK,KAAK,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAA;AACzC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,EAAE,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,OAAO,MAAM,cAAc,CAAA;AACvC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,YAAY,MAAM,qBAAqB,CAAA;AACnD,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAA;AACzC,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAA","sourcesContent":["export {default as constants} from './constants.js'\nexport * as abort from './abort.js'\nexport * as analytics from './analytics.js'\nexport * as api from './api.js'\nexport * as cli from './cli.js'\nexport * as environment from './environment.js'\nexport * as error from './error.js'\nexport * as file from './file.js'\nexport * as git from './git.js'\nexport * as github from './github.js'\nexport * as http from './http.js'\nexport * as id from './id.js'\nexport * as log from './log.js'\nexport * as npm from './npm.js'\nexport * as os from './os.js'\nexport * as output from './output.js'\nexport * as path from './path.js'\nexport * as plugins from './plugins.js'\nexport * as schema from './schema.js'\nexport * as session from './session.js'\nexport * as store from './store.js'\nexport * as string from './string.js'\nexport * as system from './system.js'\nexport * as template from './template.js'\nexport * as toml from './toml.js'\nexport * as ui from './ui.js'\nexport * as version from './version.js'\nexport * as vscode from './vscode.js'\nexport * as outputMocker from './testing/output.js'\nexport * as metadata from './metadata.js'\nexport * as monorail from './monorail.js'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,MAAM,gBAAgB,CAAA;AACnD,OAAO,KAAK,KAAK,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,SAAS,MAAM,gBAAgB,CAAA;AAC3C,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,WAAW,MAAM,kBAAkB,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,EAAE,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,GAAG,MAAM,UAAU,CAAA;AAC/B,OAAO,KAAK,EAAE,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,OAAO,MAAM,cAAc,CAAA;AACvC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,OAAO,MAAM,cAAc,CAAA;AACvC,OAAO,KAAK,KAAK,MAAM,YAAY,CAAA;AACnC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAA;AACzC,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AACjC,OAAO,KAAK,EAAE,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,OAAO,MAAM,cAAc,CAAA;AACvC,OAAO,KAAK,MAAM,MAAM,aAAa,CAAA;AACrC,OAAO,KAAK,YAAY,MAAM,qBAAqB,CAAA;AACnD,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAA;AACzC,OAAO,KAAK,QAAQ,MAAM,eAAe,CAAA","sourcesContent":["export {default as constants} from './constants.js'\nexport * as abort from './abort.js'\nexport * as analytics from './analytics.js'\nexport * as api from './api.js'\nexport * as cli from './cli.js'\nexport * as environment from './environment.js'\nexport * as error from './error.js'\nexport * as file from './file.js'\nexport * as git from './git.js'\nexport * as http from './http.js'\nexport * as id from './id.js'\nexport * as log from './log.js'\nexport * as npm from './npm.js'\nexport * as os from './os.js'\nexport * as output from './output.js'\nexport * as path from './path.js'\nexport * as plugins from './plugins.js'\nexport * as schema from './schema.js'\nexport * as session from './session.js'\nexport * as store from './store.js'\nexport * as string from './string.js'\nexport * as system from './system.js'\nexport * as template from './template.js'\nexport * as toml from './toml.js'\nexport * as ui from './ui.js'\nexport * as version from './version.js'\nexport * as vscode from './vscode.js'\nexport * as outputMocker from './testing/output.js'\nexport * as metadata from './metadata.js'\nexport * as monorail from './monorail.js'\n"]}

package/dist/plugins.d.ts

@@ -2,7 +2,7 @@ import { JsonMap } from './json.js';
 import { PickByPrefix } from './typing/pick-by-prefix.js';
 import { MonorailEventPublic, MonorailEventSensitive } from './monorail.js';
 import { HookReturnPerTunnelPlugin } from './public/node/plugins/tunnel.js';
-import { Result } from './public/common/result.js';
+import { Result } from './public/node/result.js';
 import { Config, Interfaces } from '@oclif/core';
 /**
  * Convenience function to trigger a hook, and gather any successful responses. Failures are ignored.

package/dist/plugins.js

@@ -1,5 +1,5 @@
 import { getArrayContainsDuplicates, getArrayRejectingUndefined } from './public/common/array.js';
-import { err } from './public/common/result.js';
+import { err } from './public/node/result.js';
 /**
  * Convenience function to trigger a hook, and gather any successful responses. Failures are ignored.
  *

package/dist/plugins.js.map

@@ -1 +1 @@
-{"version":3,"file":"plugins.js","sourceRoot":"","sources":["../src/plugins.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,0BAA0B,EAAE,0BAA0B,EAAC,MAAM,0BAA0B,CAAA;AAC/F,OAAO,EAAC,GAAG,EAAS,MAAM,2BAA2B,CAAA;AAGrD;;;;GAIG;AACH,MAAM,CAAC,KAAK,UAAU,WAAW,CAC/B,MAAyB,EACzB,KAAa,EACb,OAA4C,EAC5C,OAAgB;IAEhB,MAAM,GAAG,GAAG,MAAM,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAA;IACzD,8DAA8D;IAC9D,OAAO,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,EAAC,MAAM,EAAE,MAAM,EAAC,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAQ,CAAA;AAClG,CAAC;AA4CD;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,sBAAsB,CAAC,MAAc;IACzD,MAAM,KAAK,GAAG,MAAM,WAAW,CAAC,MAAM,EAAE,iBAAiB,EAAE,EAAE,CAAC,CAAA;IAC9D,MAAM,KAAK,GAAG,0BAA0B,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAA;IACtF,IAAI,0BAA0B,CAAC,KAAK,CAAC;QAAE,OAAO,EAAC,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,+BAA+B,EAAC,CAAA;IACtG,OAAO,EAAC,OAAO,EAAE,KAAK,EAAC,CAAA;AACzB,CAAC;AAQD;;;;;;;;GAQG;AACH,MAAM,CAAC,KAAK,UAAU,eAAe,CACnC,MAAc,EACd,IAAY,EACZ,QAAgB;IAEhB,MAAM,KAAK,GAAG,MAAM,WAAW,CAAC,MAAM,EAAE,cAAc,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAC,CAAC,CAAA;IACzE,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,CAC5C,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,cAAc,EAAE,KAAK,EAAE,IAAI,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,kBAAkB,CACjG,CAAA;IACD,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC;QAAE,OAAO,GAAG,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,eAAe,EAAC,CAAC,CAAA;IACxE,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;QAAE,OAAO,GAAG,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,aAAa,EAAC,CAAC,CAAA;IAE1F,OAAO,UAAU,CAAC,CAAC,CAAC;SACjB,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC;SACvB,QAAQ,CAAC,CAAC,KAAK,EAAE,EAAE,CAClB,KAAK,CAAC,IAAI,KAAK,SAAS;QACtB,CAAC,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAC;QACrD,CAAC,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,eAAe,EAAC,CACtC,CAAA;AACL,CAAC","sourcesContent":["import {JsonMap} from './json.js'\nimport {PickByPrefix} from './typing/pick-by-prefix.js'\nimport {MonorailEventPublic, MonorailEventSensitive} from './monorail.js'\nimport {HookReturnPerTunnelPlugin} from './public/node/plugins/tunnel.js'\nimport {getArrayContainsDuplicates, getArrayRejectingUndefined} from './public/common/array.js'\nimport {err, Result} from './public/common/result.js'\nimport {Config, Interfaces} from '@oclif/core'\n\n/**\n * Convenience function to trigger a hook, and gather any successful responses. Failures are ignored.\n *\n * Responses are organised into a dictionary, keyed by plug-in name. Only plug-ins that have hooks registered for the given event, and the hooks were run successfully, are included.\n */\nexport async function fanoutHooks<TPluginMap extends HookReturnsPerPlugin, TEvent extends string & keyof TPluginMap>(\n  config: Interfaces.Config,\n  event: TEvent,\n  options: TPluginMap[typeof event]['options'],\n  timeout?: number,\n): Promise<Partial<TPluginMap[typeof event]['pluginReturns']>> {\n  const res = await config.runHook(event, options, timeout)\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  return Object.fromEntries(res.successes.map(({result, plugin}) => [plugin.name, result])) as any\n}\n\ntype AppSpecificMonorailFields = PickByPrefix<MonorailEventPublic, 'app_', 'project_type' | 'api_key' | 'partner_id'> &\n  PickByPrefix<MonorailEventPublic, 'cmd_extensions_'> &\n  PickByPrefix<MonorailEventPublic, 'cmd_scaffold_'>\n\ntype AppSpecificSensitiveMonorailFields = PickByPrefix<MonorailEventSensitive, 'app_'>\n\nexport interface HookReturnsPerPlugin extends HookReturnPerTunnelPlugin {\n  public_command_metadata: {\n    options: {[key: string]: never}\n    pluginReturns: {\n      '@shopify/app': Partial<AppSpecificMonorailFields>\n      [pluginName: string]: JsonMap\n    }\n  }\n  sensitive_command_metadata: {\n    options: {[key: string]: never}\n    pluginReturns: {\n      '@shopify/app': Partial<AppSpecificSensitiveMonorailFields>\n      [pluginName: string]: JsonMap\n    }\n  }\n  [hookName: string]: {\n    options: {[key: string]: unknown}\n    pluginReturns: {[key: string]: unknown}\n  }\n}\n\nexport type PluginReturnsForHook<\n  TEvent extends keyof TPluginMap,\n  TPluginName extends keyof TPluginMap[TEvent]['pluginReturns'],\n  TPluginMap extends HookReturnsPerPlugin = HookReturnsPerPlugin,\n> = TPluginMap[TEvent]['pluginReturns'][TPluginName]\n\nexport type FanoutHookFunction<\n  TEvent extends keyof TPluginMap = string,\n  TPluginName extends keyof TPluginMap[TEvent]['pluginReturns'] = string,\n  TPluginMap extends HookReturnsPerPlugin = HookReturnsPerPlugin,\n> = (\n  this: Interfaces.Hook.Context,\n  options: TPluginMap[TEvent]['options'] & {config: Interfaces.Config},\n) => Promise<PluginReturnsForHook<TEvent, TPluginName, TPluginMap>>\n\n/**\n * Execute the 'tunnel_provider' hook, and return the list of available tunnel providers.\n * Fail if there are multiple plugins for the same provider\n *\n * @param config - oclif config used to execute hooks\n * @returns list of available tunnel plugins\n */\nexport async function getListOfTunnelPlugins(config: Config): Promise<{plugins: string[]; error?: string}> {\n  const hooks = await fanoutHooks(config, 'tunnel_provider', {})\n  const names = getArrayRejectingUndefined(Object.values(hooks).map((key) => key?.name))\n  if (getArrayContainsDuplicates(names)) return {plugins: names, error: 'multiple-plugins-for-provider'}\n  return {plugins: names}\n}\n\nexport interface TunnelPluginError {\n  provider: string\n  type: 'multiple-urls' | 'handled-error' | 'unknown' | 'no-provider'\n  message?: string\n}\n\n/**\n * Execute the 'tunnel_start' hook for the given provider.\n * Fails if there aren't plugins for that provider or if there are more than one.\n *\n * @param config - oclif config used to execute hooks\n * @param port - port where the tunnel will be started\n * @param provider - selected provider, must be unique\n * @returns tunnel URL from the selected provider\n */\nexport async function runTunnelPlugin(\n  config: Config,\n  port: number,\n  provider: string,\n): Promise<Result<string, TunnelPluginError>> {\n  const hooks = await fanoutHooks(config, 'tunnel_start', {port, provider})\n  const urlResults = Object.values(hooks).filter(\n    (tunnelResponse) => !tunnelResponse?.isErr() || tunnelResponse.error.type !== 'invalid-provider',\n  )\n  if (urlResults.length > 1) return err({provider, type: 'multiple-urls'})\n  if (urlResults.length === 0 || !urlResults[0]) return err({provider, type: 'no-provider'})\n\n  return urlResults[0]\n    .map((data) => data.url)\n    .mapError((error) =>\n      error.type === 'unknown'\n        ? {provider, type: 'unknown', message: error.message}\n        : {provider, type: 'handled-error'},\n    )\n}\n"]}
+{"version":3,"file":"plugins.js","sourceRoot":"","sources":["../src/plugins.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,0BAA0B,EAAE,0BAA0B,EAAC,MAAM,0BAA0B,CAAA;AAC/F,OAAO,EAAC,GAAG,EAAS,MAAM,yBAAyB,CAAA;AAGnD;;;;GAIG;AACH,MAAM,CAAC,KAAK,UAAU,WAAW,CAC/B,MAAyB,EACzB,KAAa,EACb,OAA4C,EAC5C,OAAgB;IAEhB,MAAM,GAAG,GAAG,MAAM,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,CAAC,CAAA;IACzD,8DAA8D;IAC9D,OAAO,MAAM,CAAC,WAAW,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,EAAC,MAAM,EAAE,MAAM,EAAC,EAAE,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC,CAAQ,CAAA;AAClG,CAAC;AA4CD;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,sBAAsB,CAAC,MAAc;IACzD,MAAM,KAAK,GAAG,MAAM,WAAW,CAAC,MAAM,EAAE,iBAAiB,EAAE,EAAE,CAAC,CAAA;IAC9D,MAAM,KAAK,GAAG,0BAA0B,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC,CAAA;IACtF,IAAI,0BAA0B,CAAC,KAAK,CAAC;QAAE,OAAO,EAAC,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,+BAA+B,EAAC,CAAA;IACtG,OAAO,EAAC,OAAO,EAAE,KAAK,EAAC,CAAA;AACzB,CAAC;AAQD;;;;;;;;GAQG;AACH,MAAM,CAAC,KAAK,UAAU,eAAe,CACnC,MAAc,EACd,IAAY,EACZ,QAAgB;IAEhB,MAAM,KAAK,GAAG,MAAM,WAAW,CAAC,MAAM,EAAE,cAAc,EAAE,EAAC,IAAI,EAAE,QAAQ,EAAC,CAAC,CAAA;IACzE,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,CAC5C,CAAC,cAAc,EAAE,EAAE,CAAC,CAAC,cAAc,EAAE,KAAK,EAAE,IAAI,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,kBAAkB,CACjG,CAAA;IACD,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC;QAAE,OAAO,GAAG,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,eAAe,EAAC,CAAC,CAAA;IACxE,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;QAAE,OAAO,GAAG,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,aAAa,EAAC,CAAC,CAAA;IAE1F,OAAO,UAAU,CAAC,CAAC,CAAC;SACjB,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC;SACvB,QAAQ,CAAC,CAAC,KAAK,EAAE,EAAE,CAClB,KAAK,CAAC,IAAI,KAAK,SAAS;QACtB,CAAC,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,EAAC;QACrD,CAAC,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,eAAe,EAAC,CACtC,CAAA;AACL,CAAC","sourcesContent":["import {JsonMap} from './json.js'\nimport {PickByPrefix} from './typing/pick-by-prefix.js'\nimport {MonorailEventPublic, MonorailEventSensitive} from './monorail.js'\nimport {HookReturnPerTunnelPlugin} from './public/node/plugins/tunnel.js'\nimport {getArrayContainsDuplicates, getArrayRejectingUndefined} from './public/common/array.js'\nimport {err, Result} from './public/node/result.js'\nimport {Config, Interfaces} from '@oclif/core'\n\n/**\n * Convenience function to trigger a hook, and gather any successful responses. Failures are ignored.\n *\n * Responses are organised into a dictionary, keyed by plug-in name. Only plug-ins that have hooks registered for the given event, and the hooks were run successfully, are included.\n */\nexport async function fanoutHooks<TPluginMap extends HookReturnsPerPlugin, TEvent extends string & keyof TPluginMap>(\n  config: Interfaces.Config,\n  event: TEvent,\n  options: TPluginMap[typeof event]['options'],\n  timeout?: number,\n): Promise<Partial<TPluginMap[typeof event]['pluginReturns']>> {\n  const res = await config.runHook(event, options, timeout)\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  return Object.fromEntries(res.successes.map(({result, plugin}) => [plugin.name, result])) as any\n}\n\ntype AppSpecificMonorailFields = PickByPrefix<MonorailEventPublic, 'app_', 'project_type' | 'api_key' | 'partner_id'> &\n  PickByPrefix<MonorailEventPublic, 'cmd_extensions_'> &\n  PickByPrefix<MonorailEventPublic, 'cmd_scaffold_'>\n\ntype AppSpecificSensitiveMonorailFields = PickByPrefix<MonorailEventSensitive, 'app_'>\n\nexport interface HookReturnsPerPlugin extends HookReturnPerTunnelPlugin {\n  public_command_metadata: {\n    options: {[key: string]: never}\n    pluginReturns: {\n      '@shopify/app': Partial<AppSpecificMonorailFields>\n      [pluginName: string]: JsonMap\n    }\n  }\n  sensitive_command_metadata: {\n    options: {[key: string]: never}\n    pluginReturns: {\n      '@shopify/app': Partial<AppSpecificSensitiveMonorailFields>\n      [pluginName: string]: JsonMap\n    }\n  }\n  [hookName: string]: {\n    options: {[key: string]: unknown}\n    pluginReturns: {[key: string]: unknown}\n  }\n}\n\nexport type PluginReturnsForHook<\n  TEvent extends keyof TPluginMap,\n  TPluginName extends keyof TPluginMap[TEvent]['pluginReturns'],\n  TPluginMap extends HookReturnsPerPlugin = HookReturnsPerPlugin,\n> = TPluginMap[TEvent]['pluginReturns'][TPluginName]\n\nexport type FanoutHookFunction<\n  TEvent extends keyof TPluginMap = string,\n  TPluginName extends keyof TPluginMap[TEvent]['pluginReturns'] = string,\n  TPluginMap extends HookReturnsPerPlugin = HookReturnsPerPlugin,\n> = (\n  this: Interfaces.Hook.Context,\n  options: TPluginMap[TEvent]['options'] & {config: Interfaces.Config},\n) => Promise<PluginReturnsForHook<TEvent, TPluginName, TPluginMap>>\n\n/**\n * Execute the 'tunnel_provider' hook, and return the list of available tunnel providers.\n * Fail if there are multiple plugins for the same provider\n *\n * @param config - oclif config used to execute hooks\n * @returns list of available tunnel plugins\n */\nexport async function getListOfTunnelPlugins(config: Config): Promise<{plugins: string[]; error?: string}> {\n  const hooks = await fanoutHooks(config, 'tunnel_provider', {})\n  const names = getArrayRejectingUndefined(Object.values(hooks).map((key) => key?.name))\n  if (getArrayContainsDuplicates(names)) return {plugins: names, error: 'multiple-plugins-for-provider'}\n  return {plugins: names}\n}\n\nexport interface TunnelPluginError {\n  provider: string\n  type: 'multiple-urls' | 'handled-error' | 'unknown' | 'no-provider'\n  message?: string\n}\n\n/**\n * Execute the 'tunnel_start' hook for the given provider.\n * Fails if there aren't plugins for that provider or if there are more than one.\n *\n * @param config - oclif config used to execute hooks\n * @param port - port where the tunnel will be started\n * @param provider - selected provider, must be unique\n * @returns tunnel URL from the selected provider\n */\nexport async function runTunnelPlugin(\n  config: Config,\n  port: number,\n  provider: string,\n): Promise<Result<string, TunnelPluginError>> {\n  const hooks = await fanoutHooks(config, 'tunnel_start', {port, provider})\n  const urlResults = Object.values(hooks).filter(\n    (tunnelResponse) => !tunnelResponse?.isErr() || tunnelResponse.error.type !== 'invalid-provider',\n  )\n  if (urlResults.length > 1) return err({provider, type: 'multiple-urls'})\n  if (urlResults.length === 0 || !urlResults[0]) return err({provider, type: 'no-provider'})\n\n  return urlResults[0]\n    .map((data) => data.url)\n    .mapError((error) =>\n      error.type === 'unknown'\n        ? {provider, type: 'unknown', message: error.message}\n        : {provider, type: 'handled-error'},\n    )\n}\n"]}

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

@@ -3,7 +3,7 @@ import { TokenItem } from './TokenizedText.js';
 import React from 'react';
 export interface AlertProps {
     type: Exclude<BannerType, 'error' | 'external_error'>;
-    headline: string;
+    headline: TokenItem;
     body?: TokenItem;
     nextSteps?: TokenItem[];
     reference?: TokenItem[];

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

@@ -2,12 +2,12 @@ import { Banner } from './Banner.js';
 import { Link } from './Link.js';
 import { List } from './List.js';
 import { TokenizedText } from './TokenizedText.js';
-import { Box, Text } from 'ink';
+import { Box } from 'ink';
 import React from 'react';
 const Alert = ({ type, headline, body, nextSteps, reference, link, orderedNextSteps = false }) => {
     return (React.createElement(Banner, { type: type, marginY: 1 },
         React.createElement(Box, null,
-            React.createElement(Text, null, headline)),
+            React.createElement(TokenizedText, { item: headline })),
         body && (React.createElement(Box, { marginTop: 1 },
             React.createElement(TokenizedText, { item: body }))),
         nextSteps && (React.createElement(Box, { marginTop: 1 },

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

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAa,MAAM,aAAa,CAAA;AAC9C,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAA;AAC9B,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAA;AAC9B,OAAO,EAAY,aAAa,EAAC,MAAM,oBAAoB,CAAA;AAC3D,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,KAAK,MAAM,OAAO,CAAA;AAezB,MAAM,KAAK,GAAyB,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,gBAAgB,GAAG,KAAK,EAAC,EAAE,EAAE;IACnH,OAAO,CACL,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;QAC5B,oBAAC,GAAG;YACF,oBAAC,IAAI,QAAE,QAAQ,CAAQ,CACnB;QAEL,IAAI,IAAI,CACP,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,aAAa,IAAC,IAAI,EAAE,IAAI,GAAI,CACzB,CACP;QAEA,SAAS,IAAI,CACZ,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,gBAAgB,GAAI,CACpE,CACP;QAEA,SAAS,IAAI,CACZ,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,SAAS,GAAI,CACxC,CACP;QAEA,IAAI,IAAI,CACP,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CACtC,CACP,CACM,CACV,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAC,KAAK,EAAC,CAAA","sourcesContent":["import {Banner, BannerType} from './Banner.js'\nimport {Link} from './Link.js'\nimport {List} from './List.js'\nimport {TokenItem, TokenizedText} from './TokenizedText.js'\nimport {Box, Text} from 'ink'\nimport React from 'react'\n\nexport interface AlertProps {\n  type: Exclude<BannerType, 'error' | 'external_error'>\n  headline: string\n  body?: TokenItem\n  nextSteps?: TokenItem[]\n  reference?: TokenItem[]\n  link?: {\n    label: string\n    url: string\n  }\n  orderedNextSteps?: boolean\n}\n\nconst Alert: React.FC<AlertProps> = ({type, headline, body, nextSteps, reference, link, orderedNextSteps = false}) => {\n  return (\n    <Banner type={type} marginY={1}>\n      <Box>\n        <Text>{headline}</Text>\n      </Box>\n\n      {body && (\n        <Box marginTop={1}>\n          <TokenizedText item={body} />\n        </Box>\n      )}\n\n      {nextSteps && (\n        <Box marginTop={1}>\n          <List title=\"Next steps\" items={nextSteps} ordered={orderedNextSteps} />\n        </Box>\n      )}\n\n      {reference && (\n        <Box marginTop={1}>\n          <List title=\"Reference\" items={reference} />\n        </Box>\n      )}\n\n      {link && (\n        <Box marginTop={1}>\n          <Link url={link.url} label={link.label} />\n        </Box>\n      )}\n    </Banner>\n  )\n}\n\nexport {Alert}\n"]}
+{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,EAAa,MAAM,aAAa,CAAA;AAC9C,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAA;AAC9B,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAA;AAC9B,OAAO,EAAY,aAAa,EAAC,MAAM,oBAAoB,CAAA;AAC3D,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAA;AACvB,OAAO,KAAK,MAAM,OAAO,CAAA;AAezB,MAAM,KAAK,GAAyB,CAAC,EAAC,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,gBAAgB,GAAG,KAAK,EAAC,EAAE,EAAE;IACnH,OAAO,CACL,oBAAC,MAAM,IAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;QAC5B,oBAAC,GAAG;YACF,oBAAC,aAAa,IAAC,IAAI,EAAE,QAAQ,GAAI,CAC7B;QAEL,IAAI,IAAI,CACP,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,aAAa,IAAC,IAAI,EAAE,IAAI,GAAI,CACzB,CACP;QAEA,SAAS,IAAI,CACZ,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,KAAK,EAAC,YAAY,EAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,gBAAgB,GAAI,CACpE,CACP;QAEA,SAAS,IAAI,CACZ,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,KAAK,EAAC,WAAW,EAAC,KAAK,EAAE,SAAS,GAAI,CACxC,CACP;QAEA,IAAI,IAAI,CACP,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,GAAI,CACtC,CACP,CACM,CACV,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAC,KAAK,EAAC,CAAA","sourcesContent":["import {Banner, BannerType} from './Banner.js'\nimport {Link} from './Link.js'\nimport {List} from './List.js'\nimport {TokenItem, TokenizedText} from './TokenizedText.js'\nimport {Box} from 'ink'\nimport React from 'react'\n\nexport interface AlertProps {\n  type: Exclude<BannerType, 'error' | 'external_error'>\n  headline: TokenItem\n  body?: TokenItem\n  nextSteps?: TokenItem[]\n  reference?: TokenItem[]\n  link?: {\n    label: string\n    url: string\n  }\n  orderedNextSteps?: boolean\n}\n\nconst Alert: React.FC<AlertProps> = ({type, headline, body, nextSteps, reference, link, orderedNextSteps = false}) => {\n  return (\n    <Banner type={type} marginY={1}>\n      <Box>\n        <TokenizedText item={headline} />\n      </Box>\n\n      {body && (\n        <Box marginTop={1}>\n          <TokenizedText item={body} />\n        </Box>\n      )}\n\n      {nextSteps && (\n        <Box marginTop={1}>\n          <List title=\"Next steps\" items={nextSteps} ordered={orderedNextSteps} />\n        </Box>\n      )}\n\n      {reference && (\n        <Box marginTop={1}>\n          <List title=\"Reference\" items={reference} />\n        </Box>\n      )}\n\n      {link && (\n        <Box marginTop={1}>\n          <Link url={link.url} label={link.label} />\n        </Box>\n      )}\n    </Banner>\n  )\n}\n\nexport {Alert}\n"]}

package/dist/private/node/ui/components/Alert.test.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,95 @@
+import { Alert } from './Alert.js';
+import { renderString } from '../../ui.js';
+import { unstyled } from '../../../../output.js';
+import { describe, expect, test } from 'vitest';
+import React from 'react';
+describe('Alert', async () => {
+    test('renders correctly with all the options', async () => {
+        const options = {
+            headline: [{ userInput: 'my-app' }, 'initialized and ready to build.'],
+            body: ['You can find the build files in the ', { filePath: 'dist' }, 'folder.'],
+            nextSteps: [
+                [
+                    'Run',
+                    {
+                        command: 'cd santorini-goods',
+                    },
+                ],
+                [
+                    'To preview your project, run',
+                    {
+                        command: 'npm app dev',
+                    },
+                ],
+                [
+                    'To add extensions, run',
+                    {
+                        command: 'npm generate extension',
+                    },
+                ],
+            ],
+            reference: [
+                [
+                    'Run',
+                    {
+                        command: 'npm shopify help',
+                    },
+                ],
+                [
+                    // testing link wrapping behavior
+                    "Press 'return' to open the really amazing and clean",
+                    {
+                        link: {
+                            label: 'dev docs',
+                            url: 'https://shopify.dev',
+                        },
+                    },
+                ],
+            ],
+            link: {
+                label: 'Link',
+                url: 'https://shopify.com',
+            },
+        };
+        const { output } = renderString(React.createElement(Alert, { type: "info", ...options }));
+        expect(unstyled(output)).toMatchInlineSnapshot(`
+      "
+      ╭─ info ───────────────────────────────────────────────────────────────────────╮
+      │                                                                              │
+      │  my-app initialized and ready to build.                                      │
+      │                                                                              │
+      │  You can find the build files in the  \\"dist\\" folder.                         │
+      │                                                                              │
+      │  Next steps                                                                  │
+      │    • Run \`cd santorini-goods\`                                                │
+      │    • To preview your project, run \`npm app dev\`                              │
+      │    • To add extensions, run \`npm generate extension\`                         │
+      │                                                                              │
+      │  Reference                                                                   │
+      │    • Run \`npm shopify help\`                                                  │
+      │    • Press 'return' to open the really amazing and clean dev docs            │
+      │      (https://shopify.dev)                                                   │
+      │                                                                              │
+      │  Link (https://shopify.com)                                                  │
+      │                                                                              │
+      ╰──────────────────────────────────────────────────────────────────────────────╯
+      "
+    `);
+    });
+    test('renders correctly with only required options', async () => {
+        const options = {
+            headline: 'Title',
+        };
+        const { output } = renderString(React.createElement(Alert, { type: "info", ...options }));
+        expect(unstyled(output)).toMatchInlineSnapshot(`
+      "
+      ╭─ info ───────────────────────────────────────────────────────────────────────╮
+      │                                                                              │
+      │  Title                                                                       │
+      │                                                                              │
+      ╰──────────────────────────────────────────────────────────────────────────────╯
+      "
+    `);
+    });
+});
+//# sourceMappingURL=Alert.test.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Alert.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Alert.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,EAAC,MAAM,YAAY,CAAA;AAChC,OAAO,EAAC,YAAY,EAAC,MAAM,aAAa,CAAA;AACxC,OAAO,EAAC,QAAQ,EAAC,MAAM,uBAAuB,CAAA;AAC9C,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,QAAQ,CAAC,OAAO,EAAE,KAAK,IAAI,EAAE;IAC3B,IAAI,CAAC,wCAAwC,EAAE,KAAK,IAAI,EAAE;QACxD,MAAM,OAAO,GAAG;YACd,QAAQ,EAAE,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAC,EAAE,iCAAiC,CAAC;YACpE,IAAI,EAAE,CAAC,sCAAsC,EAAE,EAAC,QAAQ,EAAE,MAAM,EAAC,EAAE,SAAS,CAAC;YAC7E,SAAS,EAAE;gBACT;oBACE,KAAK;oBACL;wBACE,OAAO,EAAE,oBAAoB;qBAC9B;iBACF;gBACD;oBACE,8BAA8B;oBAC9B;wBACE,OAAO,EAAE,aAAa;qBACvB;iBACF;gBACD;oBACE,wBAAwB;oBACxB;wBACE,OAAO,EAAE,wBAAwB;qBAClC;iBACF;aACF;YACD,SAAS,EAAE;gBACT;oBACE,KAAK;oBACL;wBACE,OAAO,EAAE,kBAAkB;qBAC5B;iBACF;gBACD;oBACE,iCAAiC;oBACjC,qDAAqD;oBACrD;wBACE,IAAI,EAAE;4BACJ,KAAK,EAAE,UAAU;4BACjB,GAAG,EAAE,qBAAqB;yBAC3B;qBACF;iBACF;aACF;YACD,IAAI,EAAE;gBACJ,KAAK,EAAE,MAAM;gBACb,GAAG,EAAE,qBAAqB;aAC3B;SACF,CAAA;QAED,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,KAAK,IAAC,IAAI,EAAC,MAAM,KAAK,OAAO,GAAI,CAAC,CAAA;QAEjE,MAAM,CAAC,QAAQ,CAAC,MAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;;;;;;;;;;;;;;;KAsB/C,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;QAC9D,MAAM,OAAO,GAAG;YACd,QAAQ,EAAE,OAAO;SAClB,CAAA;QAED,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,KAAK,IAAC,IAAI,EAAC,MAAM,KAAK,OAAO,GAAI,CAAC,CAAA;QAEjE,MAAM,CAAC,QAAQ,CAAC,MAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC;;;;;;;;KAQ/C,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {Alert} from './Alert.js'\nimport {renderString} from '../../ui.js'\nimport {unstyled} from '../../../../output.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\n\ndescribe('Alert', async () => {\n  test('renders correctly with all the options', async () => {\n    const options = {\n      headline: [{userInput: 'my-app'}, 'initialized and ready to build.'],\n      body: ['You can find the build files in the ', {filePath: 'dist'}, 'folder.'],\n      nextSteps: [\n        [\n          'Run',\n          {\n            command: 'cd santorini-goods',\n          },\n        ],\n        [\n          'To preview your project, run',\n          {\n            command: 'npm app dev',\n          },\n        ],\n        [\n          'To add extensions, run',\n          {\n            command: 'npm generate extension',\n          },\n        ],\n      ],\n      reference: [\n        [\n          'Run',\n          {\n            command: 'npm shopify help',\n          },\n        ],\n        [\n          // testing link wrapping behavior\n          \"Press 'return' to open the really amazing and clean\",\n          {\n            link: {\n              label: 'dev docs',\n              url: 'https://shopify.dev',\n            },\n          },\n        ],\n      ],\n      link: {\n        label: 'Link',\n        url: 'https://shopify.com',\n      },\n    }\n\n    const {output} = renderString(<Alert type=\"info\" {...options} />)\n\n    expect(unstyled(output!)).toMatchInlineSnapshot(`\n      \"\n      ╭─ info ───────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  my-app initialized and ready to build.                                      │\n      │                                                                              │\n      │  You can find the build files in the  \\\\\"dist\\\\\" folder.                         │\n      │                                                                              │\n      │  Next steps                                                                  │\n      │    • Run \\`cd santorini-goods\\`                                                │\n      │    • To preview your project, run \\`npm app dev\\`                              │\n      │    • To add extensions, run \\`npm generate extension\\`                         │\n      │                                                                              │\n      │  Reference                                                                   │\n      │    • Run \\`npm shopify help\\`                                                  │\n      │    • Press 'return' to open the really amazing and clean dev docs            │\n      │      (https://shopify.dev)                                                   │\n      │                                                                              │\n      │  Link (https://shopify.com)                                                  │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n\n  test('renders correctly with only required options', async () => {\n    const options = {\n      headline: 'Title',\n    }\n\n    const {output} = renderString(<Alert type=\"info\" {...options} />)\n\n    expect(unstyled(output!)).toMatchInlineSnapshot(`\n      \"\n      ╭─ info ───────────────────────────────────────────────────────────────────────╮\n      │                                                                              │\n      │  Title                                                                       │\n      │                                                                              │\n      ╰──────────────────────────────────────────────────────────────────────────────╯\n      \"\n    `)\n  })\n})\n"]}

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

@@ -29,30 +29,29 @@ const BoxWithBorder = ({ type, marginY, children }) => {
     const { stdout } = useStdout();
     return (React.createElement(Box, { width: calculateWidth(stdout), paddingY: 1, paddingX: 2, marginY: marginY, borderStyle: "round", flexDirection: "column", borderColor: typeToColor(type) },
         React.createElement(Box, { marginTop: -2, marginBottom: 1, marginLeft: -1 },
-            React.createElement(Text, { dimColor: true, bold: true }, ` ${type.replace(/_/g, ' ')} `)),
+            React.createElement(Text, null, ` ${type.replace(/_/g, ' ')} `)),
         children));
 };
-const BoxWithTopLine = ({ type, marginY, children }) => {
+const BoxWithTopBottomLines = ({ type, marginY, children }) => {
     const { stdout } = useStdout();
     const width = calculateWidth(stdout);
     return (React.createElement(Box, { marginY: marginY, flexDirection: "column" },
         React.createElement(Box, { marginBottom: 1 },
             React.createElement(Text, null,
                 React.createElement(Text, { color: typeToColor(type) }, '─'.repeat(2)),
-                React.createElement(Text, { dimColor: true, bold: true }, ` ${type.replace(/_/g, ' ')} `),
+                React.createElement(Text, null, ` ${type.replace(/_/g, ' ')} `),
                 React.createElement(Text, { color: typeToColor(type) }, '─'.repeat(width - 2 - type.length - 2)))),
         children,
         React.createElement(Box, { marginTop: 1 },
             React.createElement(Text, { color: typeToColor(type) }, '─'.repeat(width)))));
 };
-const BannerBox = ({ children, ...props }) => {
+const Banner = ({ children, ...props }) => {
     if (props.type === 'external_error') {
-        return React.createElement(BoxWithTopLine, { ...props }, children);
+        return React.createElement(BoxWithTopBottomLines, props, children);
+    }
+    else {
+        return React.createElement(BoxWithBorder, props, children);
     }
-    return React.createElement(BoxWithBorder, { ...props }, children);
-};
-const Banner = ({ children, ...props }) => {
-    return React.createElement(BannerBox, { ...props }, children);
 };
 export { Banner };
 //# sourceMappingURL=Banner.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAE,SAAS,EAAC,MAAM,KAAK,CAAA;AACxC,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,SAAS,WAAW,CAAC,IAAmB;IACtC,OAAO;QACL,OAAO,EAAE,OAAO;QAChB,KAAK,EAAE,KAAK;QACZ,OAAO,EAAE,QAAQ;QACjB,IAAI,EAAE,KAAK;QACX,cAAc,EAAE,KAAK;KACtB,CAAC,IAAI,CAAC,CAAA;AACT,CAAC;AAED,MAAM,gBAAgB,GAAG,EAAE,CAAA;AAE3B,SAAS,cAAc,CAAC,MAAsC;IAC5D,MAAM,SAAS,GAAG,MAAM,EAAE,OAAO,IAAI,gBAAgB,CAAA;IACrD,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAA;IACxD,IAAI,KAAK,CAAA;IAET,IAAI,SAAS,IAAI,gBAAgB,EAAE;QACjC,KAAK,GAAG,SAAS,CAAA;KAClB;SAAM,IAAI,gBAAgB,GAAG,gBAAgB,EAAE;QAC9C,KAAK,GAAG,gBAAgB,CAAA;KACzB;SAAM;QACL,KAAK,GAAG,gBAAgB,CAAA;KACzB;IAED,OAAO,KAAK,CAAA;AACd,CAAC;AAED,MAAM,aAAa,GAAoB,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAC,EAAE,EAAE;IACnE,MAAM,EAAC,MAAM,EAAC,GAAG,SAAS,EAAE,CAAA;IAE5B,OAAO,CACL,oBAAC,GAAG,IACF,KAAK,EAAE,cAAc,CAAC,MAAM,CAAC,EAC7B,QAAQ,EAAE,CAAC,EACX,QAAQ,EAAE,CAAC,EACX,OAAO,EAAE,OAAO,EAChB,WAAW,EAAC,OAAO,EACnB,aAAa,EAAC,QAAQ,EACtB,WAAW,EAAE,WAAW,CAAC,IAAI,CAAC;QAE9B,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC,CAAC,EAAE,YAAY,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,CAAC;YACjD,oBAAC,IAAI,IAAC,QAAQ,QAAC,IAAI,UAAE,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,GAAG,CAAQ,CACvD;QACL,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,cAAc,GAAoB,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAC,EAAE,EAAE;IACpE,MAAM,EAAC,MAAM,EAAC,GAAG,SAAS,EAAE,CAAA;IAC5B,MAAM,KAAK,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;IAEpC,OAAO,CACL,oBAAC,GAAG,IAAC,OAAO,EAAE,OAAO,EAAE,aAAa,EAAC,QAAQ;QAC3C,oBAAC,GAAG,IAAC,YAAY,EAAE,CAAC;YAClB,oBAAC,IAAI;gBACH,oBAAC,IAAI,IAAC,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,IAAG,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAQ;gBACtD,oBAAC,IAAI,IAAC,QAAQ,QAAC,IAAI,UAAE,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,GAAG,CAAQ;gBAE3D,oBAAC,IAAI,IAAC,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,IAAG,GAAG,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC,CAAQ,CAC3E,CACH;QAEL,QAAQ;QAET,oBAAC,GAAG,IAAC,SAAS,EAAE,CAAC;YACf,oBAAC,IAAI,IAAC,KAAK,EAAE,WAAW,CAAC,IAAI,CAAC,IAAG,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,CAAQ,CACtD,CACF,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,SAAS,GAAoB,CAAC,EAAC,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,EAAE;IAC1D,IAAI,KAAK,CAAC,IAAI,KAAK,gBAAgB,EAAE;QACnC,OAAO,oBAAC,cAAc,OAAK,KAAK,IAAG,QAAQ,CAAkB,CAAA;KAC9D;IAED,OAAO,oBAAC,aAAa,OAAK,KAAK,IAAG,QAAQ,CAAiB,CAAA;AAC7D,CAAC,CAAA;AAED,MAAM,MAAM,GAAoB,CAAC,EAAC,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,EAAE;IACvD,OAAO,oBAAC,SAAS,OAAK,KAAK,IAAG,QAAQ,CAAa,CAAA;AACrD,CAAC,CAAA;AAED,OAAO,EAAC,MAAM,EAAC,CAAA","sourcesContent":["import {Box, Text, useStdout} from 'ink'\nimport React from 'react'\n\nexport type BannerType = 'success' | 'error' | 'warning' | 'info' | 'external_error'\n\ninterface Props {\n  type: BannerType\n  marginY?: number\n}\n\nfunction typeToColor(type: Props['type']) {\n  return {\n    success: 'green',\n    error: 'red',\n    warning: 'yellow',\n    info: 'dim',\n    external_error: 'red',\n  }[type]\n}\n\nconst BANNER_MIN_WIDTH = 80\n\nfunction calculateWidth(stdout: NodeJS.WriteStream | undefined) {\n  const fullWidth = stdout?.columns ?? BANNER_MIN_WIDTH\n  const twoThirdsOfWidth = Math.floor((fullWidth / 3) * 2)\n  let width\n\n  if (fullWidth <= BANNER_MIN_WIDTH) {\n    width = fullWidth\n  } else if (twoThirdsOfWidth < BANNER_MIN_WIDTH) {\n    width = BANNER_MIN_WIDTH\n  } else {\n    width = twoThirdsOfWidth\n  }\n\n  return width\n}\n\nconst BoxWithBorder: React.FC<Props> = ({type, marginY, children}) => {\n  const {stdout} = useStdout()\n\n  return (\n    <Box\n      width={calculateWidth(stdout)}\n      paddingY={1}\n      paddingX={2}\n      marginY={marginY}\n      borderStyle=\"round\"\n      flexDirection=\"column\"\n      borderColor={typeToColor(type)}\n    >\n      <Box marginTop={-2} marginBottom={1} marginLeft={-1}>\n        <Text dimColor bold>{` ${type.replace(/_/g, ' ')} `}</Text>\n      </Box>\n      {children}\n    </Box>\n  )\n}\n\nconst BoxWithTopLine: React.FC<Props> = ({type, marginY, children}) => {\n  const {stdout} = useStdout()\n  const width = calculateWidth(stdout)\n\n  return (\n    <Box marginY={marginY} flexDirection=\"column\">\n      <Box marginBottom={1}>\n        <Text>\n          <Text color={typeToColor(type)}>{'─'.repeat(2)}</Text>\n          <Text dimColor bold>{` ${type.replace(/_/g, ' ')} `}</Text>\n          {/* 2 initial dashes + 2 spaces surrounding the type */}\n          <Text color={typeToColor(type)}>{'─'.repeat(width - 2 - type.length - 2)}</Text>\n        </Text>\n      </Box>\n\n      {children}\n\n      <Box marginTop={1}>\n        <Text color={typeToColor(type)}>{'─'.repeat(width)}</Text>\n      </Box>\n    </Box>\n  )\n}\n\nconst BannerBox: React.FC<Props> = ({children, ...props}) => {\n  if (props.type === 'external_error') {\n    return <BoxWithTopLine {...props}>{children}</BoxWithTopLine>\n  }\n\n  return <BoxWithBorder {...props}>{children}</BoxWithBorder>\n}\n\nconst Banner: React.FC<Props> = ({children, ...props}) => {\n  return <BannerBox {...props}>{children}</BannerBox>\n}\n\nexport {Banner}\n"]}
+{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Box, Text, useStdout} from 'ink'\nimport React from 'react'\n\nexport type BannerType = 'success' | 'error' | 'warning' | 'info' | 'external_error'\n\ninterface Props {\n  type: BannerType\n  marginY?: number\n}\n\nfunction typeToColor(type: Props['type']) {\n  return {\n    success: 'green',\n    error: 'red',\n    warning: 'yellow',\n    info: 'dim',\n    external_error: 'red',\n  }[type]\n}\n\nconst BANNER_MIN_WIDTH = 80\n\nfunction calculateWidth(stdout: NodeJS.WriteStream | undefined) {\n  const fullWidth = stdout?.columns ?? BANNER_MIN_WIDTH\n  const twoThirdsOfWidth = Math.floor((fullWidth / 3) * 2)\n  let width\n\n  if (fullWidth <= BANNER_MIN_WIDTH) {\n    width = fullWidth\n  } else if (twoThirdsOfWidth < BANNER_MIN_WIDTH) {\n    width = BANNER_MIN_WIDTH\n  } else {\n    width = twoThirdsOfWidth\n  }\n\n  return width\n}\n\nconst BoxWithBorder: React.FC<Props> = ({type, marginY, children}) => {\n  const {stdout} = useStdout()\n\n  return (\n    <Box\n      width={calculateWidth(stdout)}\n      paddingY={1}\n      paddingX={2}\n      marginY={marginY}\n      borderStyle=\"round\"\n      flexDirection=\"column\"\n      borderColor={typeToColor(type)}\n    >\n      <Box marginTop={-2} marginBottom={1} marginLeft={-1}>\n        <Text>{` ${type.replace(/_/g, ' ')} `}</Text>\n      </Box>\n      {children}\n    </Box>\n  )\n}\n\nconst BoxWithTopBottomLines: React.FC<Props> = ({type, marginY, children}) => {\n  const {stdout} = useStdout()\n  const width = calculateWidth(stdout)\n\n  return (\n    <Box marginY={marginY} flexDirection=\"column\">\n      <Box marginBottom={1}>\n        <Text>\n          <Text color={typeToColor(type)}>{'─'.repeat(2)}</Text>\n          <Text>{` ${type.replace(/_/g, ' ')} `}</Text>\n          {/* 2 initial dashes + 2 spaces surrounding the type */}\n          <Text color={typeToColor(type)}>{'─'.repeat(width - 2 - type.length - 2)}</Text>\n        </Text>\n      </Box>\n\n      {children}\n\n      <Box marginTop={1}>\n        <Text color={typeToColor(type)}>{'─'.repeat(width)}</Text>\n      </Box>\n    </Box>\n  )\n}\n\nconst Banner: React.FC<Props> = ({children, ...props}) => {\n  if (props.type === 'external_error') {\n    return React.createElement(BoxWithTopBottomLines, props, children)\n  } else {\n    return React.createElement(BoxWithBorder, props, children)\n  }\n}\n\nexport {Banner}\n"]}

package/dist/private/node/ui/components/Banner.test.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,52 @@
+import { Banner } from './Banner.js';
+import { renderString } from '../../ui.js';
+import { describe, expect, test } from 'vitest';
+import React from 'react';
+describe('Banner', async () => {
+    test('renders with a border for success', async () => {
+        const { output } = renderString(React.createElement(Banner, { type: "success" }));
+        expect(output).toMatchInlineSnapshot(`
+      "╭─ success ────────────────────────────────────────────────────────────────────╮
+      │                                                                              │
+      │                                                                              │
+      ╰──────────────────────────────────────────────────────────────────────────────╯"
+    `);
+    });
+    test('renders with a border for info', async () => {
+        const { output } = renderString(React.createElement(Banner, { type: "info" }));
+        expect(output).toMatchInlineSnapshot(`
+      "╭─ info ───────────────────────────────────────────────────────────────────────╮
+      │                                                                              │
+      │                                                                              │
+      ╰──────────────────────────────────────────────────────────────────────────────╯"
+    `);
+    });
+    test('renders with a border for warning', async () => {
+        const { output } = renderString(React.createElement(Banner, { type: "warning" }));
+        expect(output).toMatchInlineSnapshot(`
+      "╭─ warning ────────────────────────────────────────────────────────────────────╮
+      │                                                                              │
+      │                                                                              │
+      ╰──────────────────────────────────────────────────────────────────────────────╯"
+    `);
+    });
+    test('renders with a border for error', async () => {
+        const { output } = renderString(React.createElement(Banner, { type: "error" }));
+        expect(output).toMatchInlineSnapshot(`
+      "╭─ error ──────────────────────────────────────────────────────────────────────╮
+      │                                                                              │
+      │                                                                              │
+      ╰──────────────────────────────────────────────────────────────────────────────╯"
+    `);
+    });
+    test('renders with a top and bottom lines only for external errors', async () => {
+        const { output } = renderString(React.createElement(Banner, { type: "external_error" }));
+        expect(output).toMatchInlineSnapshot(`
+      "── external error ──────────────────────────────────────────────────────────────
+
+
+      ────────────────────────────────────────────────────────────────────────────────"
+    `);
+    });
+});
+//# sourceMappingURL=Banner.test.js.map

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

@@ -0,0 +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,YAAY,EAAC,MAAM,aAAa,CAAA;AACxC,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,QAAQ,CAAC,QAAQ,EAAE,KAAK,IAAI,EAAE;IAC5B,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,SAAS,GAAG,CAAC,CAAA;QAExD,MAAM,CAAC,MAAM,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKpC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAChD,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,MAAM,GAAG,CAAC,CAAA;QACrD,MAAM,CAAC,MAAM,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKpC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,mCAAmC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,SAAS,GAAG,CAAC,CAAA;QACxD,MAAM,CAAC,MAAM,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKpC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QACjD,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,OAAO,GAAG,CAAC,CAAA;QACtD,MAAM,CAAC,MAAM,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKpC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;IAEF,IAAI,CAAC,8DAA8D,EAAE,KAAK,IAAI,EAAE;QAC9E,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,MAAM,IAAC,IAAI,EAAC,gBAAgB,GAAG,CAAC,CAAA;QAE/D,MAAM,CAAC,MAAM,CAAC,CAAC,qBAAqB,CAAC;;;;;KAKpC,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {Banner} from './Banner.js'\nimport {renderString} from '../../ui.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\n\ndescribe('Banner', async () => {\n  test('renders with a border for success', async () => {\n    const {output} = renderString(<Banner type=\"success\" />)\n\n    expect(output).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 {output} = renderString(<Banner type=\"info\" />)\n    expect(output).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 {output} = renderString(<Banner type=\"warning\" />)\n    expect(output).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 {output} = renderString(<Banner type=\"error\" />)\n    expect(output).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 {output} = renderString(<Banner type=\"external_error\" />)\n\n    expect(output).toMatchInlineSnapshot(`\n      \"\u001b[31m──\u001b[39m external error \u001b[31m──────────────────────────────────────────────────────────────\u001b[39m\n\n\n      \u001b[31m────────────────────────────────────────────────────────────────────────────────\u001b[39m\"\n    `)\n  })\n})\n"]}

package/dist/private/node/ui/components/Command.test.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,11 @@
+import { Command } from './Command.js';
+import { renderString } from '../../ui.js';
+import { describe, expect, test } from 'vitest';
+import React from 'react';
+describe('Command', async () => {
+    test('renders correctly', async () => {
+        const { output } = renderString(React.createElement(Command, { command: "npm install" }));
+        expect(output).toMatchInlineSnapshot('"`npm install`"');
+    });
+});
+//# sourceMappingURL=Command.test.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Command.test.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/Command.test.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAC,MAAM,cAAc,CAAA;AACpC,OAAO,EAAC,YAAY,EAAC,MAAM,aAAa,CAAA;AACxC,OAAO,EAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,QAAQ,CAAA;AAC7C,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,QAAQ,CAAC,SAAS,EAAE,KAAK,IAAI,EAAE;IAC7B,IAAI,CAAC,mBAAmB,EAAE,KAAK,IAAI,EAAE;QACnC,MAAM,EAAC,MAAM,EAAC,GAAG,YAAY,CAAC,oBAAC,OAAO,IAAC,OAAO,EAAC,aAAa,GAAG,CAAC,CAAA;QAEhE,MAAM,CAAC,MAAM,CAAC,CAAC,qBAAqB,CAAC,iBAAiB,CAAC,CAAA;IACzD,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA","sourcesContent":["import {Command} from './Command.js'\nimport {renderString} from '../../ui.js'\nimport {describe, expect, test} from 'vitest'\nimport React from 'react'\n\ndescribe('Command', async () => {\n  test('renders correctly', async () => {\n    const {output} = renderString(<Command command=\"npm install\" />)\n\n    expect(output).toMatchInlineSnapshot('\"`npm install`\"')\n  })\n})\n"]}

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

@@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react';
 import { Box, Static, Text, useApp } from 'ink';
 import stripAnsi from 'strip-ansi';
 import { Writable } from 'node:stream';
-const OUTPUT_MIN_WIDTH = 80;
 /**
  * Renders output from concurrent processes to the terminal.
  * Output will be divided in a three column layout

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

@@ -1 +1 @@
-{"version":3,"file":"ConcurrentOutput.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/ConcurrentOutput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {OutputProcess} from '../../../../output.js'\nimport React, {FunctionComponent, useEffect, useState} from 'react'\nimport {Box, Static, Text, useApp} from 'ink'\nimport stripAnsi from 'strip-ansi'\nimport AbortController from 'abort-controller'\nimport {Writable} from 'node:stream'\n\nexport type WritableStream = (process: OutputProcess, index: number) => Writable\nexport type RunProcesses = (\n  writableStream: WritableStream,\n  unmountInk: (error?: Error | undefined) => void,\n) => Promise<void>\n\ninterface Props {\n  processes: OutputProcess[]\n  abortController: AbortController\n  showTimestamps?: boolean\n}\ninterface Chunk {\n  color: string\n  prefix: string\n  lines: string[]\n}\n\nconst OUTPUT_MIN_WIDTH = 80\n\n/**\n * Renders output from concurrent processes to the terminal.\n * Output will be divided in a three column layout\n * with the left column containing the timestamp,\n * the right column containing the output,\n * and the middle column containing the process prefix.\n * Every process will be rendered with a different color, up to 4 colors.\n *\n * For example running `shopify app dev`:\n *\n * ```shell\n * 2022-10-10 13:11:03 | backend    | npm\n * 2022-10-10 13:11:03 | backend    |  WARN ignoring workspace config at ...\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    | > shopify-app-template-node@0.1.0 dev\n * 2022-10-10 13:11:03 | backend    | > cross-env NODE_ENV=development nodemon backend/index.js --watch ./backend\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | frontend   |\n * 2022-10-10 13:11:03 | frontend   | > starter-react-frontend-app@0.1.0 dev\n * 2022-10-10 13:11:03 | frontend   | > cross-env NODE_ENV=development node vite-server.js\n * 2022-10-10 13:11:03 | frontend   |\n * 2022-10-10 13:11:03 | frontend   |\n * 2022-10-10 13:11:03 | backend    | [nodemon] 2.0.19\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    | [nodemon] to restart at any time, enter `rs`\n * 2022-10-10 13:11:03 | backend    | [nodemon] watching path(s): backend/\n * 2022-10-10 13:11:03 | backend    | [nodemon] watching extensions: js,mjs,json\n * 2022-10-10 13:11:03 | backend    | [nodemon] starting `node backend/index.js`\n * 2022-10-10 13:11:03 | backend    |\n *\n * ```\n */\nconst ConcurrentOutput: FunctionComponent<Props> = ({processes, abortController, showTimestamps = true}) => {\n  const [processOutput, setProcessOutput] = useState<Chunk[]>([])\n  const concurrentColors = ['yellow', 'cyan', 'magenta', 'green', 'blue']\n  const prefixColumnSize = Math.max(...processes.map((process) => process.prefix.length))\n  const {exit: unmountInk} = useApp()\n\n  function lineColor(index: number) {\n    const colorIndex = index < concurrentColors.length ? index : index % concurrentColors.length\n    return concurrentColors[colorIndex]!\n  }\n\n  const writableStream = (process: OutputProcess, index: number) => {\n    return new Writable({\n      write(chunk, _encoding, next) {\n        const lines = stripAnsi(chunk.toString('ascii').replace(/(\\n)$/, '')).split(/\\n/)\n\n        setProcessOutput((previousProcessOutput) => [\n          ...previousProcessOutput,\n          {\n            color: lineColor(index),\n            prefix: process.prefix,\n            lines,\n          },\n        ])\n\n        next()\n      },\n    })\n  }\n\n  const runProcesses = async () => {\n    await Promise.all(\n      processes.map(async (process, index) => {\n        const stdout = writableStream(process, index)\n        const stderr = writableStream(process, index)\n\n        await process.action(stdout, stderr, abortController.signal)\n      }),\n    )\n\n    unmountInk()\n  }\n\n  useEffect(() => {\n    runProcesses().catch((error) => {\n      abortController.abort()\n      unmountInk(error)\n    })\n  }, [])\n\n  return (\n    <Static items={processOutput}>\n      {(chunk, index) => {\n        return (\n          <Box flexDirection=\"column\" key={index}>\n            {chunk.lines.map((line, index) => (\n              <Box key={index} flexDirection=\"row\">\n                {showTimestamps && (\n                  <Box>\n                    <Box marginRight={1}>\n                      <Text color={chunk.color}>{new Date().toISOString().replace(/T/, ' ').replace(/\\..+/, '')}</Text>\n                    </Box>\n\n                    <Text bold color={chunk.color}>\n                      |\n                    </Text>\n                  </Box>\n                )}\n\n                <Box width={prefixColumnSize} marginX={1}>\n                  <Text color={chunk.color}>{chunk.prefix}</Text>\n                </Box>\n\n                <Text bold color={chunk.color}>\n                  |\n                </Text>\n\n                <Box flexGrow={1} paddingLeft={1}>\n                  <Text color={chunk.color}>{line}</Text>\n                </Box>\n              </Box>\n            ))}\n          </Box>\n        )\n      }}\n    </Static>\n  )\n}\n\nexport default ConcurrentOutput\n"]}
+{"version":3,"file":"ConcurrentOutput.js","sourceRoot":"","sources":["../../../../../src/private/node/ui/components/ConcurrentOutput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {OutputProcess} from '../../../../output.js'\nimport React, {FunctionComponent, useEffect, useState} from 'react'\nimport {Box, Static, Text, useApp} from 'ink'\nimport stripAnsi from 'strip-ansi'\nimport AbortController from 'abort-controller'\nimport {Writable} from 'node:stream'\n\nexport type WritableStream = (process: OutputProcess, index: number) => Writable\nexport type RunProcesses = (\n  writableStream: WritableStream,\n  unmountInk: (error?: Error | undefined) => void,\n) => Promise<void>\n\ninterface Props {\n  processes: OutputProcess[]\n  abortController: AbortController\n  showTimestamps?: boolean\n}\ninterface Chunk {\n  color: string\n  prefix: string\n  lines: string[]\n}\n\n/**\n * Renders output from concurrent processes to the terminal.\n * Output will be divided in a three column layout\n * with the left column containing the timestamp,\n * the right column containing the output,\n * and the middle column containing the process prefix.\n * Every process will be rendered with a different color, up to 4 colors.\n *\n * For example running `shopify app dev`:\n *\n * ```shell\n * 2022-10-10 13:11:03 | backend    | npm\n * 2022-10-10 13:11:03 | backend    |  WARN ignoring workspace config at ...\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    | > shopify-app-template-node@0.1.0 dev\n * 2022-10-10 13:11:03 | backend    | > cross-env NODE_ENV=development nodemon backend/index.js --watch ./backend\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | frontend   |\n * 2022-10-10 13:11:03 | frontend   | > starter-react-frontend-app@0.1.0 dev\n * 2022-10-10 13:11:03 | frontend   | > cross-env NODE_ENV=development node vite-server.js\n * 2022-10-10 13:11:03 | frontend   |\n * 2022-10-10 13:11:03 | frontend   |\n * 2022-10-10 13:11:03 | backend    | [nodemon] 2.0.19\n * 2022-10-10 13:11:03 | backend    |\n * 2022-10-10 13:11:03 | backend    | [nodemon] to restart at any time, enter `rs`\n * 2022-10-10 13:11:03 | backend    | [nodemon] watching path(s): backend/\n * 2022-10-10 13:11:03 | backend    | [nodemon] watching extensions: js,mjs,json\n * 2022-10-10 13:11:03 | backend    | [nodemon] starting `node backend/index.js`\n * 2022-10-10 13:11:03 | backend    |\n *\n * ```\n */\nconst ConcurrentOutput: FunctionComponent<Props> = ({processes, abortController, showTimestamps = true}) => {\n  const [processOutput, setProcessOutput] = useState<Chunk[]>([])\n  const concurrentColors = ['yellow', 'cyan', 'magenta', 'green', 'blue']\n  const prefixColumnSize = Math.max(...processes.map((process) => process.prefix.length))\n  const {exit: unmountInk} = useApp()\n\n  function lineColor(index: number) {\n    const colorIndex = index < concurrentColors.length ? index : index % concurrentColors.length\n    return concurrentColors[colorIndex]!\n  }\n\n  const writableStream = (process: OutputProcess, index: number) => {\n    return new Writable({\n      write(chunk, _encoding, next) {\n        const lines = stripAnsi(chunk.toString('ascii').replace(/(\\n)$/, '')).split(/\\n/)\n\n        setProcessOutput((previousProcessOutput) => [\n          ...previousProcessOutput,\n          {\n            color: lineColor(index),\n            prefix: process.prefix,\n            lines,\n          },\n        ])\n\n        next()\n      },\n    })\n  }\n\n  const runProcesses = async () => {\n    await Promise.all(\n      processes.map(async (process, index) => {\n        const stdout = writableStream(process, index)\n        const stderr = writableStream(process, index)\n\n        await process.action(stdout, stderr, abortController.signal)\n      }),\n    )\n\n    unmountInk()\n  }\n\n  useEffect(() => {\n    runProcesses().catch((error) => {\n      abortController.abort()\n      unmountInk(error)\n    })\n  }, [])\n\n  return (\n    <Static items={processOutput}>\n      {(chunk, index) => {\n        return (\n          <Box flexDirection=\"column\" key={index}>\n            {chunk.lines.map((line, index) => (\n              <Box key={index} flexDirection=\"row\">\n                {showTimestamps && (\n                  <Box>\n                    <Box marginRight={1}>\n                      <Text color={chunk.color}>{new Date().toISOString().replace(/T/, ' ').replace(/\\..+/, '')}</Text>\n                    </Box>\n\n                    <Text bold color={chunk.color}>\n                      |\n                    </Text>\n                  </Box>\n                )}\n\n                <Box width={prefixColumnSize} marginX={1}>\n                  <Text color={chunk.color}>{chunk.prefix}</Text>\n                </Box>\n\n                <Text bold color={chunk.color}>\n                  |\n                </Text>\n\n                <Box flexGrow={1} paddingLeft={1}>\n                  <Text color={chunk.color}>{line}</Text>\n                </Box>\n              </Box>\n            ))}\n          </Box>\n        )\n      }}\n    </Static>\n  )\n}\n\nexport default ConcurrentOutput\n"]}

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

@@ -41,7 +41,7 @@ const FatalError = ({ error }) => {
         error.nextSteps && (React.createElement(Box, { marginTop: 1 },
             React.createElement(List, { title: "Next steps", items: error.nextSteps }))),
         stack && stack.items.length !== 0 && (React.createElement(Box, { marginTop: 1, flexDirection: "column" },
-            React.createElement(Text, { dimColor: true }, "To investigate the issue, examine this stack trace:"),
+            React.createElement(Text, null, "To investigate the issue, examine this stack trace:"),
             stack.items.map((item, index) => (React.createElement(Box, { flexDirection: "column", key: index },
                 React.createElement(Text, null,
                     "at",

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 dimColor>To investigate the issue, examine this stack trace:</Text>\n          {stack.items.map((item, index) => (\n            <Box flexDirection=\"column\" key={index}>\n              <Text>\n                at{item.calleeShort && <Text color=\"yellow\">{` ${item.calleeShort}`}</Text>}\n                {item.fileShort && ` (${item.fileShort}:${item.line})`}\n              </Text>\n              <Box paddingLeft={1}>\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'} 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}>\n              <Text>\n                at{item.calleeShort && <Text color=\"yellow\">{` ${item.calleeShort}`}</Text>}\n                {item.fileShort && ` (${item.fileShort}:${item.line})`}\n              </Text>\n              <Box paddingLeft={1}>\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.d.ts

@@ -0,0 +1 @@
+export {};