Rename <Text> to <Color> and add <Bold> and <Underline> (#69)

Author: George Karagkiaouris

index.js

@@ -8,13 +8,17 @@ const renderToString = require('./lib/render-to-string');
 const diff = require('./lib/diff');
 const h = require('./lib/h');
 const Indent = require('./lib/components/indent');
-const Text = require('./lib/components/text');
+const Color = require('./lib/components/color');
+const Bold = require('./lib/components/bold');
+const Underline = require('./lib/components/underline');
 
 exports.StringComponent = StringComponent;
 exports.Component = Component;
 exports.h = h;
 exports.Indent = Indent;
-exports.Text = Text;
+exports.Color = Color;
+exports.Underline = Underline;
+exports.Bold = Bold;
 
 const noop = () => {};
 

lib/components/bold.js

@@ -0,0 +1,12 @@
+'use strict';
+
+const chalk = require('chalk');
+const StringComponent = require('../string-component');
+
+class Bold extends StringComponent {
+	renderString(children) {
+		return chalk.bold(children);
+	}
+}
+
+module.exports = Bold;

lib/components/text.js lib/components/color.jslib/components/text.js renamed to lib/components/color.js

@@ -19,7 +19,7 @@ const methods = [
 	'bgKeyword'
 ];
 
-class Text extends StringComponent {
+class Color extends StringComponent {
 	renderString(children) {
 		Object.keys(this.props).forEach(method => {
 			if (this.props[method]) {
@@ -35,4 +35,4 @@ class Text extends StringComponent {
 	}
 }
 
-module.exports = Text;
+module.exports = Color;

lib/components/underline.js

@@ -0,0 +1,12 @@
+'use strict';
+
+const chalk = require('chalk');
+const StringComponent = require('../string-component');
+
+class Underline extends StringComponent {
+	renderString(children) {
+		return chalk.underline(children);
+	}
+}
+
+module.exports = Underline;

test/components.js

@@ -3,7 +3,7 @@ import {spy, stub} from 'sinon';
 import ansiStyles from 'ansi-styles';
 import chalk from 'chalk';
 import test from 'ava';
-import {h, build, Indent, Text, Component} from '..';
+import {h, build, Indent, Color, Underline, Bold, Component} from '..';
 import renderToString from '../lib/render-to-string';
 import {rerender} from '../lib/render-queue';
 
@@ -656,10 +656,18 @@ test('render styled text', t => {
 			[style]: true
 		};
 
-		t.is(renderToString(build(<Text {...props}>Test</Text>)), chalk[style]('Test'));
+		t.is(renderToString(build(<Color {...props}>Test</Color>)), chalk[style]('Test'));
 	}
 
-	t.is(renderToString(build(<Text rgb={[40, 42, 54]}>Test</Text>)), chalk.rgb(40, 42, 54)('Test'));
+	t.is(renderToString(build(<Color rgb={[40, 42, 54]}>Test</Color>)), chalk.rgb(40, 42, 54)('Test'));
+});
+
+test('render bold text', t => {
+	t.is(renderToString(build(<Bold>Test</Bold>)), chalk.bold('Test'));
+});
+
+test('render underlined text', t => {
+	t.is(renderToString(build(<Underline>Test</Underline>)), chalk.underline('Test'));
 });
 
 test('indent text', t => {