@heroku/heroku-cli-util 10.2.0 → 10.3.0

package/README.md

@@ -2,14 +2,14 @@
 
 A set of helpful CLI utilities for Heroku and oclif-based Node.js CLIs. This
 package provides convenient wrappers and helpers for user interaction, output
-formatting, and test utilities.
+formatting, and color styling.
 
 ## Features
 
 - **User prompts and confirmations** (yes/no, input)
 - **Styled output** (headers, JSON, objects, tables)
 - **Wait indicators** for async operations
-- **Test helpers** for CLI output and environment setup
+- **Colors** for consistent, semantic CLI styling
 
 ## Installation
 
@@ -59,25 +59,35 @@ const name = await hux.prompt('What is your name?');
 const proceed = await hux.confirm('Continue?');
 ```
 
-### Test Helpers
+### Colors
 
 ```js
-import { testHelpers } from '@heroku/heroku-cli-util';
-
-testHelpers.initCliTest();
-
-testHelpers.setupStdoutStderr();
-// ...run your CLI code...
-const output = testHelpers.stdout();
-const errorOutput = testHelpers.stderr();
-testHelpers.restoreStdoutStderr();
-
-testHelpers.expectOutput(output, 'expected output');
-
-// Run a command (see docs for details)
-// await testHelpers.runCommand(MyCommand, ['arg1', 'arg2']);
+import { color } from '@heroku/heroku-cli-util';
+
+// App-related colors
+console.log(color.app('my-awesome-app'));        // Purple, bold with app icon
+console.log(color.pipeline('staging'));          // Purple
+console.log(color.space('production'));         // Blue, bold with space icon
+console.log(color.addon('heroku-postgresql'));   // Yellow, bold
+console.log(color.datastore('postgresql-123'));  // Yellow, bold with datastore icon
+
+// Status colors
+console.log(color.success('Deploy complete'));   // Green
+console.log(color.failure('Build failed'));      // Red
+console.log(color.warning('Deprecated feature')); // Orange
+
+// User/Team colors
+console.log(color.team('my-team'));              // Cyan, bold
+console.log(color.user('user@example.com'));     // Cyan
+
+// General purpose
+console.log(color.label('Name'));                // Bold
+console.log(color.info('Help text'));            // Teal
+console.log(color.command('heroku apps:list'));  // Command with prompt styling
 ```
 
+See the [COLORS.md](docs/COLORS.md) documentation for the complete color palette and usage guide.
+
 ### Types
 
 #### Error Classes

package/dist/index.d.ts

@@ -55,3 +55,4 @@ export declare const hux: {
     table: typeof table;
     wait: typeof wait;
 };
+export * as color from './ux/colors.js';

package/dist/index.js

@@ -47,3 +47,4 @@ export const hux = {
     table,
     wait,
 };
+export * as color from './ux/colors.js';

package/dist/utils/addons/addon-resolver.js

@@ -10,8 +10,6 @@ export default class AddonResolver {
     }
     async resolve(addon, app, addonService) {
         const [appPart, addonPart] = addon.match(/^(.+)::(.+)$/)?.slice(1) ?? [app, addon];
-        console.log('appPart', appPart);
-        console.log('addonPart', addonPart);
         const { body: addons } = await this.heroku.post('/actions/addons/resolve', {
             body: {
                 addon: addonPart,

package/dist/utils/pg/config-vars.js

@@ -1,4 +1,4 @@
-import { color } from '@heroku-cli/color';
+import * as color from '../../ux/colors.js';
 /**
  * Cache of app config vars.
  */
@@ -49,8 +49,8 @@ export function getConfigVarNameFromAttachment(attachment, config = {}) {
         .filter(cvn => config[cvn]?.startsWith('postgres://'));
     if (connStringConfigVarNames.length === 0) {
         throw new Error(`No config vars found for ${attachment.name}; perhaps they were removed as a side effect of`
-            + ` ${color.cmd('heroku rollback')}? Use ${color.cmd('heroku addons:attach')} to create a new attachment and `
-            + `then ${color.cmd('heroku addons:detach')} to remove the current attachment.`);
+            + ` ${color.command('heroku rollback')}? Use ${color.command('heroku addons:attach')} to create a new attachment and `
+            + `then ${color.command('heroku addons:detach')} to remove the current attachment.`);
     }
     // Generate the default config var name and return it if it contains a database URL connection string.
     const configVarName = `${attachment.name}_URL`;

package/dist/utils/pg/databases.js

@@ -1,7 +1,7 @@
-import { color } from '@heroku-cli/color';
 import { HerokuAPIError } from '@heroku-cli/command/lib/api-client.js';
 import debug from 'debug';
 import { AmbiguousError } from '../../errors/ambiguous.js';
+import * as color from '../../ux/colors.js';
 import AddonAttachmentResolver from '../addons/attachment-resolver.js';
 import { getAddonService, isLegacyDatabase } from '../addons/helpers.js';
 import { bastionKeyPlan, fetchBastionConfig, getBastionConfig } from './bastion.js';

package/dist/ux/colors.d.ts

@@ -0,0 +1,134 @@
+/**
+ * Color constants for Heroku CLI output
+ * Each hex value corresponds to a specific color in the design system
+ */
+declare const COLORS: {
+    readonly BLUE: "#62CBF4";
+    readonly CODE_BG: "#3A3A3A";
+    readonly CODE_FG: "#FFFFFF";
+    readonly CYAN: "#50D3D5";
+    readonly GRAY: "#B6B6B6";
+    readonly GREEN: "#00D300";
+    readonly MAGENTA: "#FF8DD3";
+    readonly ORANGE: "#F29D00";
+    readonly PURPLE: "#ACADFF";
+    readonly RED: "#FF8787";
+    readonly TEAL: "#00D4AA";
+    readonly YELLOW: "#BFBD25";
+};
+/**
+ * Color definitions for Heroku CLI output
+ * Each color has a specific purpose and hex value as defined in the design system
+ */
+export declare const app: (text: string) => string;
+export declare const pipeline: (text: string) => string;
+export declare const space: (text: string) => string;
+export declare const datastore: (text: string) => string;
+export declare const addon: (text: string) => string;
+export declare const attachment: (text: string) => string;
+export declare const name: (text: string) => string;
+export declare const success: (text: string) => string;
+export declare const failure: (text: string) => string;
+export declare const warning: (text: string) => string;
+export declare const team: (text: string) => string;
+export declare const user: (text: string) => string;
+export declare const label: (text: string) => string;
+export declare const info: (text: string) => string;
+export declare const inactive: (text: string) => string;
+export declare const command: (text: string) => string;
+export declare const code: (text: string) => string;
+/**
+ * Color palette for reference
+ */
+export declare const colorPalette: {
+    readonly addon: {
+        readonly hex: "#BFBD25";
+        readonly name: "yellow";
+        readonly style: "bold";
+    };
+    readonly app: {
+        readonly hex: "#ACADFF";
+        readonly name: "purple";
+        readonly style: "bold";
+    };
+    readonly attachment: {
+        readonly hex: "#BFBD25";
+        readonly name: "yellow";
+        readonly style: "normal";
+    };
+    readonly command: {
+        readonly hex: "#FFFFFF";
+        readonly name: "white on dark gray";
+        readonly style: "bold";
+    };
+    readonly datastore: {
+        readonly hex: "#BFBD25";
+        readonly name: "yellow";
+        readonly style: "bold";
+    };
+    readonly failure: {
+        readonly hex: "#FF8787";
+        readonly name: "red";
+        readonly style: "normal";
+    };
+    readonly inactive: {
+        readonly hex: "#B6B6B6";
+        readonly name: "gray";
+        readonly style: "normal";
+    };
+    readonly info: {
+        readonly hex: "#00D4AA";
+        readonly name: "teal";
+        readonly style: "normal";
+    };
+    readonly label: {
+        readonly hex: "default";
+        readonly name: "bright white/black";
+        readonly style: "bold";
+    };
+    readonly name: {
+        readonly hex: "#FF8DD3";
+        readonly name: "magenta";
+        readonly style: "normal";
+    };
+    readonly pipeline: {
+        readonly hex: "#ACADFF";
+        readonly name: "purple";
+        readonly style: "normal";
+    };
+    readonly space: {
+        readonly hex: "#62CBF4";
+        readonly name: "blue";
+        readonly style: "bold";
+    };
+    readonly success: {
+        readonly hex: "#00D300";
+        readonly name: "green";
+        readonly style: "normal";
+    };
+    readonly team: {
+        readonly hex: "#50D3D5";
+        readonly name: "cyan";
+        readonly style: "bold";
+    };
+    readonly user: {
+        readonly hex: "#50D3D5";
+        readonly name: "cyan";
+        readonly style: "normal";
+    };
+    readonly warning: {
+        readonly hex: "#F29D00";
+        readonly name: "orange";
+        readonly style: "normal";
+    };
+};
+/**
+ * Export color constants for external use
+ */
+export { COLORS };
+/**
+ * Re-export everything from ansis as a passthrough
+ * This gives access to all ansis functionality while adding our custom colors
+ */
+export * from 'ansis';
+export { default as ansi } from 'ansis';

package/dist/ux/colors.js

@@ -0,0 +1,87 @@
+/* eslint-disable import/no-named-as-default-member */
+import ansi from 'ansis';
+/**
+ * Color constants for Heroku CLI output
+ * Each hex value corresponds to a specific color in the design system
+ */
+const COLORS = {
+    // Blue tones
+    BLUE: '#62CBF4',
+    // Command tones (dark gray background, white foreground)
+    CODE_BG: '#3A3A3A',
+    CODE_FG: '#FFFFFF',
+    // Cyan tones
+    CYAN: '#50D3D5',
+    // Gray tones
+    GRAY: '#B6B6B6',
+    // Green tones
+    GREEN: '#00D300',
+    // Magenta tones
+    MAGENTA: '#FF8DD3',
+    // Orange tones
+    ORANGE: '#F29D00',
+    // Purple tones
+    PURPLE: '#ACADFF',
+    // Red tones
+    RED: '#FF8787',
+    // Teal tones
+    TEAL: '#00D4AA',
+    // Yellow tones
+    YELLOW: '#BFBD25',
+};
+/**
+ * Color definitions for Heroku CLI output
+ * Each color has a specific purpose and hex value as defined in the design system
+ */
+// Colors for entities on the Heroku platform
+export const app = (text) => ansi.hex(COLORS.PURPLE).bold(`⬢ ${text}`);
+export const pipeline = (text) => ansi.hex(COLORS.PURPLE)(text);
+export const space = (text) => ansi.hex(COLORS.BLUE).bold(`⬡ ${text}`);
+export const datastore = (text) => ansi.hex(COLORS.YELLOW).bold(`☷ ${text}`);
+export const addon = (text) => ansi.hex(COLORS.YELLOW).bold(text);
+export const attachment = (text) => ansi.hex(COLORS.YELLOW)(text);
+export const name = (text) => ansi.hex(COLORS.MAGENTA)(text);
+// Status colors
+export const success = (text) => ansi.hex(COLORS.GREEN)(text);
+export const failure = (text) => ansi.hex(COLORS.RED)(text);
+export const warning = (text) => ansi.hex(COLORS.ORANGE)(text);
+// User/Team colors
+export const team = (text) => ansi.hex(COLORS.CYAN).bold(text);
+export const user = (text) => ansi.hex(COLORS.CYAN)(text);
+// General purpose colors
+export const label = (text) => ansi.bold(text);
+export const info = (text) => ansi.hex(COLORS.TEAL)(text);
+export const inactive = (text) => ansi.hex(COLORS.GRAY)(text);
+export const command = (text) => ansi.bgHex(COLORS.CODE_BG).hex(COLORS.CODE_FG).bold(` $ ${text} `);
+export const code = (text) => ansi.bgHex(COLORS.CODE_BG).hex(COLORS.CODE_FG).bold(`${text} `);
+/**
+ * Color palette for reference
+ */
+export const colorPalette = {
+    addon: { hex: COLORS.YELLOW, name: 'yellow', style: 'bold' },
+    app: { hex: COLORS.PURPLE, name: 'purple', style: 'bold' },
+    attachment: { hex: COLORS.YELLOW, name: 'yellow', style: 'normal' },
+    command: { hex: COLORS.CODE_FG, name: 'white on dark gray', style: 'bold' },
+    datastore: { hex: COLORS.YELLOW, name: 'yellow', style: 'bold' },
+    failure: { hex: COLORS.RED, name: 'red', style: 'normal' },
+    inactive: { hex: COLORS.GRAY, name: 'gray', style: 'normal' },
+    info: { hex: COLORS.TEAL, name: 'teal', style: 'normal' },
+    label: { hex: 'default', name: 'bright white/black', style: 'bold' },
+    name: { hex: COLORS.MAGENTA, name: 'magenta', style: 'normal' },
+    pipeline: { hex: COLORS.PURPLE, name: 'purple', style: 'normal' },
+    space: { hex: COLORS.BLUE, name: 'blue', style: 'bold' },
+    success: { hex: COLORS.GREEN, name: 'green', style: 'normal' },
+    team: { hex: COLORS.CYAN, name: 'cyan', style: 'bold' },
+    user: { hex: COLORS.CYAN, name: 'cyan', style: 'normal' },
+    warning: { hex: COLORS.ORANGE, name: 'orange', style: 'normal' },
+};
+/**
+ * Export color constants for external use
+ */
+export { COLORS };
+/**
+ * Re-export everything from ansis as a passthrough
+ * This gives access to all ansis functionality while adding our custom colors
+ */
+export * from 'ansis';
+export { default as ansi } from 'ansis';

package/dist/ux/styled-header.js

@@ -1,5 +1,5 @@
-import { color } from '@heroku-cli/color';
 import { ux } from '@oclif/core';
+import * as color from './colors.js';
 export function styledHeader(header) {
-    return ux.stdout(color.dim('=== ') + color.bold(header) + '\n');
+    return ux.stdout(color.label('=== ') + color.label(header) + '\n');
 }

package/dist/ux/styled-object.js

@@ -1,6 +1,6 @@
-import { color } from '@heroku-cli/color';
 import { ux } from '@oclif/core';
 import { inspect } from 'node:util';
+import * as color from './colors.js';
 function prettyPrint(obj) {
     if (!obj)
         return inspect(obj);
@@ -29,7 +29,7 @@ export function styledObject(obj, keys) {
     const output = [];
     const keyLengths = Object.keys(obj).map(key => key.toString().length);
     const maxKeyLength = Math.max(...keyLengths) + 2;
-    const logKeyValue = (key, value) => `${color.rgb(147, 112, 219)(key)}:` + ' '.repeat(maxKeyLength - key.length - 1) + prettyPrint(value);
+    const logKeyValue = (key, value) => `${color.label(key)}:` + ' '.repeat(maxKeyLength - key.length - 1) + prettyPrint(value);
     for (const [key, value] of Object.entries(obj)) {
         if (keys && !keys.includes(key))
             continue;

package/dist/ux/table.js

@@ -13,7 +13,8 @@ export function table(data, columns, options) {
             borderColor: 'whiteBright',
             borderStyle: 'headers-only-with-underline',
             headerOptions: {
-                color: 'rgb(147, 112, 219)',
+                bold: true,
+                color: 'white', // or 'reset' to use default terminal color
             },
         }),
         ...tableOptions,

package/package.json

@@ -1,10 +1,14 @@
 {
   "type": "module",
   "name": "@heroku/heroku-cli-util",
-  "version": "10.2.0",
+  "version": "10.3.0",
   "description": "Set of helpful CLI utilities",
   "author": "Heroku",
   "license": "ISC",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/heroku/heroku-cli-util.git"
+  },
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -36,7 +40,6 @@
     "nock": "^13.2.9",
     "sinon": "^18.0.1",
     "sinon-chai": "^3.7.0",
-    "strip-ansi": "^6",
     "tmp": "^0.2.5",
     "ts-node": "^10.9.2",
     "tsconfig-paths": "^4.2.0",
@@ -44,11 +47,11 @@
     "typescript": "^5.4.0"
   },
   "dependencies": {
-    "@heroku-cli/color": "^2.0.4",
     "@heroku-cli/command": "^12.0.0",
     "@heroku/http-call": "^5.5.0",
     "@oclif/core": "^4.3.0",
     "@oclif/table": "0.4.14",
+    "ansis": "^4.1.0",
     "debug": "^4.4.0",
     "inquirer": "^12.6.1",
     "tunnel-ssh": "5.2.0"
@@ -61,8 +64,7 @@
     "clean": "rm -rf dist",
     "example": "sh examples/run.sh",
     "lint": "eslint . --ext .ts --config .eslintrc.cjs",
-    "prepare": "npm run build",
     "test": "c8 mocha --forbid-only \"test/**/*.test.ts\"",
     "test:local": "c8 mocha \"${npm_config_file:-test/**/*.test.+(ts|tsx)}\""
   }
-}
+}