Add .visible for emitting text only when enabled (fixes #192)

index.js

@@ -63,6 +63,13 @@ for (const key of Object.keys(ansiStyles)) {
 	};
 }
 
+styles.visible = {
+	get() {
+		this._emptyIfNotVisible = true;
+		return build.call(this, this._styles ? this._styles : [], 'visible');
+	}
+};
+
 ansiStyles.color.closeRe = new RegExp(escapeStringRegexp(ansiStyles.color.close), 'g');
 for (const model of Object.keys(ansiStyles.color.ansi)) {
 	if (skipModels.has(model)) {
@@ -116,6 +123,7 @@ function build(_styles, key) {
 	};
 
 	builder._styles = _styles;
+	builder._emptyIfNotVisible = this._emptyIfNotVisible;
 
 	const self = this;
 
@@ -167,7 +175,7 @@ function applyStyle() {
 	}
 
 	if (!this.enabled || this.level <= 0 || !str) {
-		return str;
+		return this._emptyIfNotVisible ? '' : str;
 	}
 
 	// Turns out that on Windows dimmed gray text becomes invisible in cmd.exe,

readme.md

@@ -170,6 +170,7 @@ Explicit 256/Truecolor mode can be enabled using the `--color=256` and `--color=
 - `inverse`
 - `hidden`
 - `strikethrough` *(Not widely supported)*
+- `visible` (Text is emitted only if enabled)
 
 ### Colors
 

test/visible.js

@@ -0,0 +1,24 @@
+import test from 'ava';
+
+// Spoof supports-color
+require('./_supports-color')(__dirname);
+
+const m = require('..');
+
+test('visible: normal output when enabled', t => {
+	const ctx = new m.constructor({level: 3, enabled: true});
+	t.is(ctx.visible.red('foo'), '\u001B[31mfoo\u001B[39m');
+	t.is(ctx.red.visible('foo'), '\u001B[31mfoo\u001B[39m');
+});
+
+test('visible: no output when disabled', t => {
+	const ctx = new m.constructor({level: 3, enabled: false});
+	t.is(ctx.red.visible('foo'), '');
+	t.is(ctx.visible.red('foo'), '');
+});
+
+test('visible: no output when level is too low', t => {
+	const ctx = new m.constructor({level: 0, enabled: true});
+	t.is(ctx.visible.red('foo'), '');
+	t.is(ctx.red.visible('foo'), '');
+});

types/index.d.ts

@@ -49,6 +49,8 @@ export interface Chalk {
 	hidden: Chalk;
 	strikethrough: Chalk;
 
+	visible: Chalk;
+
 	black: Chalk;
 	red: Chalk;
 	green: Chalk;

types/test.ts

@@ -45,3 +45,7 @@ chalk.rgb(1, 14, 9).bgBlue('foo');
 chalk.hsl(1, 14, 9).bgBlue('foo');
 chalk.hsv(1, 14, 9).bgBlue('foo');
 chalk.hwb(1, 14, 9).bgBlue('foo');
+
+chalk.visible('foo');
+chalk.red.visible('foo');
+chalk.visible.red('foo');