fix: better output colors (#7377)

No more grey, no more setting background color.

Added the beginnings of guidance to the display layer comments.

lib/commands/audit.js

@@ -104,7 +104,7 @@ class VerifySignatures {
     }
 
     if (missing.length) {
-      const missingClr = this.npm.chalk.bold(this.npm.chalk.red('missing'))
+      const missingClr = this.npm.chalk.redBright('missing')
       if (missing.length === 1) {
         /* eslint-disable-next-line max-len */
         output.standard(`1 package has a ${missingClr} registry signature but the registry is providing signing keys:`)
@@ -122,7 +122,7 @@ class VerifySignatures {
       if (missing.length) {
         output.standard('')
       }
-      const invalidClr = this.npm.chalk.bold(this.npm.chalk.red('invalid'))
+      const invalidClr = this.npm.chalk.redBright('invalid')
       // We can have either invalid signatures or invalid provenance
       const invalidSignatures = this.invalid.filter(i => i.code === 'EINTEGRITYSIGNATURE')
       if (invalidSignatures.length) {

lib/commands/doctor.js

@@ -135,7 +135,7 @@ class Doctor extends BaseCommand {
         allOk = false
         item[0] = this.npm.chalk.red(item[0])
         item[1] = this.npm.chalk.red('not ok')
-        item[2] = this.npm.chalk.magenta(String(item[2]))
+        item[2] = this.npm.chalk.cyan(String(item[2]))
       } else {
         item[1] = this.npm.chalk.green('ok')
       }

lib/commands/fund.js

@@ -111,26 +111,25 @@ class Fund extends ArboristWorkspaceCmd {
         const [fundingSource] = [].concat(normalizeFunding(funding)).filter(isValidFunding)
         const { url } = fundingSource || {}
         const pkgRef = getPrintableName({ name, version })
-        let item = {
-          label: pkgRef,
-        }
 
-        if (url) {
-          item.label = tree({
-            label: this.npm.chalk.bgBlack.white(url),
+        if (!url) {
+          return { label: pkgRef }
+        }
+        let item
+        if (seenUrls.has(url)) {
+          item = seenUrls.get(url)
+          item.label += `${this.npm.chalk.dim(',')} ${pkgRef}`
+          return null
+        }
+        item = {
+          label: tree({
+            label: this.npm.chalk.blue(url),
             nodes: [pkgRef],
-          }).trim()
-
-          // stacks all packages together under the same item
-          if (seenUrls.has(url)) {
-            item = seenUrls.get(url)
-            item.label += `, ${pkgRef}`
-            return null
-          } else {
-            seenUrls.set(url, item)
-          }
+          }).trim(),
         }
 
+        // stacks all packages together under the same item
+        seenUrls.set(url, item)
         return item
       },
 
@@ -154,7 +153,7 @@ class Fund extends ArboristWorkspaceCmd {
     })
 
     const res = tree(result)
-    return this.npm.chalk.reset(res)
+    return res
   }
 
   async openFundingUrl ({ path, tree, spec, fundingSourceNumber }) {

lib/commands/help-search.js

@@ -170,8 +170,7 @@ class HelpSearch extends BaseCommand {
           for (const f of finder) {
             hilitLine.push(line.slice(p, p + f.length))
             const word = line.slice(p + f.length, p + f.length + arg.length)
-            const hilit = this.npm.chalk.bgBlack.red(word)
-            hilitLine.push(hilit)
+            hilitLine.push(this.npm.chalk.blue(word))
             p += f.length + arg.length
           }
         }

lib/commands/ls.js

@@ -280,7 +280,7 @@ const augmentItemWithIncludeMetadata = (node, item) => {
 
 const getHumanOutputItem = (node, { args, chalk, global, long }) => {
   const { pkgid, path } = node
-  const workspacePkgId = chalk.green(pkgid)
+  const workspacePkgId = chalk.blueBright(pkgid)
   let printable = node.isWorkspace ? workspacePkgId : pkgid
 
   // special formatting for top-level package name
@@ -293,10 +293,12 @@ const getHumanOutputItem = (node, { args, chalk, global, long }) => {
     }
   }
 
+  // TODO there is a LOT of overlap with lib/utils/explain-dep.js here
+
   const highlightDepName = args.length && node[_filteredBy]
   const missingColor = isOptional(node)
-    ? chalk.yellow.bgBlack
-    : chalk.red.bgBlack
+    ? chalk.yellow
+    : chalk.red
   const missingMsg = `UNMET ${isOptional(node) ? 'OPTIONAL ' : ''}DEPENDENCY`
   const targetLocation = node.root
     ? relative(node.root.realpath, node.realpath)
@@ -310,25 +312,25 @@ const getHumanOutputItem = (node, { args, chalk, global, long }) => {
         ? missingColor(missingMsg) + ' '
         : ''
     ) +
-    `${highlightDepName ? chalk.yellow.bgBlack(printable) : printable}` +
+    `${highlightDepName ? chalk.yellow(printable) : printable}` +
     (
       node[_dedupe]
-        ? ' ' + chalk.gray('deduped')
+        ? ' ' + chalk.dim('deduped')
         : ''
     ) +
     (
       invalid
-        ? ' ' + chalk.red.bgBlack(invalid)
+        ? ' ' + chalk.red(invalid)
         : ''
     ) +
     (
       isExtraneous(node, { global })
-        ? ' ' + chalk.green.bgBlack('extraneous')
+        ? ' ' + chalk.red('extraneous')
         : ''
     ) +
     (
       node.overridden
-        ? ' ' + chalk.gray('overridden')
+        ? ' ' + chalk.dim('overridden')
         : ''
     ) +
     (isGitNode(node) ? ` (${node.resolved})` : '') +

lib/commands/outdated.js

@@ -102,7 +102,7 @@ class Outdated extends ArboristWorkspaceCmd {
       }
       const outTable = [outHead].concat(outList)
 
-      outTable[0] = outTable[0].map(heading => this.npm.chalk.underline(heading))
+      outTable[0] = outTable[0].map(heading => this.npm.chalk.bold.underline(heading))
 
       const tableOpts = {
         align: ['l', 'r', 'r', 'r', 'l'],
@@ -278,7 +278,7 @@ class Outdated extends ArboristWorkspaceCmd {
         : node.name
 
     return humanOutput
-      ? this.npm.chalk.green(workspaceName)
+      ? this.npm.chalk.blue(workspaceName)
       : workspaceName
   }
 
@@ -295,17 +295,20 @@ class Outdated extends ArboristWorkspaceCmd {
       dependent,
     } = dep
 
-    const columns = [name, current, wanted, latest, location, dependent]
+    const columns = [
+      this.npm.chalk[current === wanted ? 'yellow' : 'red'](name),
+      current,
+      this.npm.chalk.cyan(wanted),
+      this.npm.chalk.blue(latest),
+      location,
+      dependent,
+    ]
 
     if (this.npm.config.get('long')) {
       columns[6] = type
-      columns[7] = homepage
+      columns[7] = this.npm.chalk.blue(homepage)
     }
 
-    columns[0] = this.npm.chalk[current === wanted ? 'yellow' : 'red'](columns[0]) // current
-    columns[2] = this.npm.chalk.green(columns[2]) // wanted
-    columns[3] = this.npm.chalk.magenta(columns[3]) // latest
-
     return columns
   }
 

lib/commands/publish.js

@@ -169,7 +169,7 @@ class Publish extends BaseCommand {
           log.warn(
             'publish',
             `Skipping workspace ${
-              this.npm.chalk.green(name)
+              this.npm.chalk.cyan(name)
             }, marked as ${
               this.npm.chalk.bold('private')
             }`

lib/commands/view.js

@@ -318,125 +318,89 @@ class View extends BaseCommand {
     // More modern, pretty printing of default view
     const unicode = this.npm.config.get('unicode')
     const chalk = this.npm.chalk
-    const tags = []
-
-    Object.keys(packu['dist-tags']).forEach((t) => {
-      const version = packu['dist-tags'][t]
-      tags.push(`${chalk.bold.green(t)}: ${version}`)
-    })
-    const unpackedSize = manifest.dist.unpackedSize &&
-      formatBytes(manifest.dist.unpackedSize, true)
+    const deps = Object.keys(manifest.dependencies || {}).map((dep) =>
+      `${chalk.blue(dep)}: ${manifest.dependencies[dep]}`
+    )
+    const site = manifest.homepage?.url || manifest.homepage
+    const bins = Object.keys(manifest.bin || {})
     const licenseField = manifest.license || 'Proprietary'
-    const info = {
-      name: chalk.green(manifest.name),
-      version: chalk.green(manifest.version),
-      bins: Object.keys(manifest.bin || {}),
-      versions: chalk.yellow(packu.versions.length + ''),
-      description: manifest.description,
-      deprecated: manifest.deprecated,
-      keywords: packu.keywords || [],
-      license: typeof licenseField === 'string'
-        ? licenseField
-        : (licenseField.type || 'Proprietary'),
-      deps: Object.keys(manifest.dependencies || {}).map((dep) => {
-        return `${chalk.yellow(dep)}: ${manifest.dependencies[dep]}`
-      }),
-      publisher: manifest._npmUser && unparsePerson({
-        name: chalk.yellow(manifest._npmUser.name),
-        email: chalk.cyan(manifest._npmUser.email),
-      }),
-      modified: !packu.time ? undefined
-      : chalk.yellow(relativeDate(packu.time[manifest.version])),
-      maintainers: (packu.maintainers || []).map((u) => unparsePerson({
-        name: chalk.yellow(u.name),
-        email: chalk.cyan(u.email),
-      })),
-      repo: (
-        manifest.bugs && (manifest.bugs.url || manifest.bugs)
-      ) || (
-        manifest.repository && (manifest.repository.url || manifest.repository)
-      ),
-      site: (
-        manifest.homepage && (manifest.homepage.url || manifest.homepage)
-      ),
-      tags,
-      tarball: chalk.cyan(manifest.dist.tarball),
-      shasum: chalk.yellow(manifest.dist.shasum),
-      integrity:
-        manifest.dist.integrity && chalk.yellow(manifest.dist.integrity),
-      fileCount:
-        manifest.dist.fileCount && chalk.yellow(manifest.dist.fileCount),
-      unpackedSize: unpackedSize && chalk.yellow(unpackedSize),
-    }
-    if (info.license.toLowerCase().trim() === 'proprietary') {
-      info.license = chalk.bold.red(info.license)
-    } else {
-      info.license = chalk.green(info.license)
-    }
+    const license = typeof licenseField === 'string'
+      ? licenseField
+      : (licenseField.type || 'Proprietary')
 
     output.standard('')
-    output.standard(
-      chalk.underline.bold(`${info.name}@${info.version}`) +
-      ' | ' + info.license +
-      ' | deps: ' + (info.deps.length ? chalk.cyan(info.deps.length) : chalk.green('none')) +
-      ' | versions: ' + info.versions
-    )
-    info.description && output.standard(info.description)
-    if (info.repo || info.site) {
-      info.site && output.standard(chalk.cyan(info.site))
+    output.standard([
+      chalk.underline.cyan(`${manifest.name}@${manifest.version}`),
+      license.toLowerCase().trim() === 'proprietary'
+        ? chalk.red(license)
+        : chalk.green(license),
+      `deps: ${deps.length ? chalk.cyan(deps.length) : chalk.cyan('none')}`,
+      `versions: ${chalk.cyan(packu.versions.length + '')}`,
+    ].join(' | '))
+
+    manifest.description && output.standard(manifest.description)
+    if (site) {
+      output.standard(chalk.blue(site))
     }
 
-    const warningSign = unicode ? ' ⚠️ ' : '!!'
-    info.deprecated && output.standard(
-      `\n${chalk.bold.red('DEPRECATED')}${
-      warningSign
-    } - ${info.deprecated}`
+    manifest.deprecated && output.standard(
+      `\n${chalk.redBright('DEPRECATED')}${unicode ? ' ⚠️ ' : '!!'} - ${manifest.deprecated}`
     )
 
-    if (info.keywords.length) {
-      output.standard('')
-      output.standard(`keywords: ${chalk.yellow(info.keywords.join(', '))}`)
+    if (packu.keywords?.length) {
+      output.standard(`\nkeywords: ${
+        packu.keywords.map(k => chalk.cyan(k)).join(', ')
+      }`)
     }
 
-    if (info.bins.length) {
-      output.standard('')
-      output.standard(`bin: ${chalk.yellow(info.bins.join(', '))}`)
+    if (bins.length) {
+      output.standard(`\nbin: ${chalk.cyan(bins.join(', '))}`)
     }
 
-    output.standard('')
-    output.standard('dist')
-    output.standard(`.tarball: ${info.tarball}`)
-    output.standard(`.shasum: ${info.shasum}`)
-    info.integrity && output.standard(`.integrity: ${info.integrity}`)
-    info.unpackedSize && output.standard(`.unpackedSize: ${info.unpackedSize}`)
-
-    const maxDeps = 24
-    if (info.deps.length) {
-      output.standard('')
-      output.standard('dependencies:')
-      output.standard(columns(info.deps.slice(0, maxDeps), { padding: 1 }))
-      if (info.deps.length > maxDeps) {
-        output.standard(`(...and ${info.deps.length - maxDeps} more.)`)
+    output.standard('\ndist')
+    output.standard(`.tarball: ${chalk.blue(manifest.dist.tarball)}`)
+    output.standard(`.shasum: ${chalk.green(manifest.dist.shasum)}`)
+    if (manifest.dist.integrity) {
+      output.standard(`.integrity: ${chalk.green(manifest.dist.integrity)}`)
+    }
+    if (manifest.dist.unpackedSize) {
+      output.standard(`.unpackedSize: ${chalk.blue(formatBytes(manifest.dist.unpackedSize, true))}`)
+    }
+
+    if (deps.length) {
+      const maxDeps = 24
+      output.standard('\ndependencies:')
+      output.standard(columns(deps.slice(0, maxDeps), { padding: 1 }))
+      if (deps.length > maxDeps) {
+        output.standard(chalk.dim(`(...and ${deps.length - maxDeps} more.)`))
       }
     }
 
-    if (info.maintainers && info.maintainers.length) {
-      output.standard('')
-      output.standard('maintainers:')
-      info.maintainers.forEach((u) => output.standard(`- ${u}`))
+    if (packu.maintainers?.length) {
+      output.standard('\nmaintainers:')
+      packu.maintainers.forEach(u =>
+        output.standard(`- ${unparsePerson({
+          name: chalk.blue(u.name),
+          email: chalk.dim(u.email) })}`)
+      )
     }
 
-    output.standard('')
-    output.standard('dist-tags:')
-    output.standard(columns(info.tags))
+    output.standard('\ndist-tags:')
+    output.standard(columns(Object.keys(packu['dist-tags']).map(t =>
+      `${chalk.blue(t)}: ${packu['dist-tags'][t]}`
+    )))
 
-    if (info.publisher || info.modified) {
+    const publisher = manifest._npmUser && unparsePerson({
+      name: chalk.blue(manifest._npmUser.name),
+      email: chalk.dim(manifest._npmUser.email),
+    })
+    if (publisher || packu.time) {
       let publishInfo = 'published'
-      if (info.modified) {
-        publishInfo += ` ${info.modified}`
+      if (packu.time) {
+        publishInfo += ` ${chalk.cyan(relativeDate(packu.time[manifest.version]))}`
       }
-      if (info.publisher) {
-        publishInfo += ` by ${info.publisher}`
+      if (publisher) {
+        publishInfo += ` by ${publisher}`
       }
       output.standard('')
       output.standard(publishInfo)