├── .gitignore ├── .travis.yml ├── .babelrc ├── src ├── patchConsoleLog.js ├── index.js ├── patchDebugLog.js ├── styles.js ├── StyledString.js └── compileTemplate.js ├── .eslintrc ├── dist ├── styles.js ├── index.js ├── patchConsoleLog.js ├── patchDebugLog.js ├── StyledString.js └── compileTemplate.js ├── package.json ├── README.md └── spec └── tests.spec.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .spec 3 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "10" 4 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | "es2015", 4 | "react", 5 | "stage-0" 6 | ], 7 | "plugins": [ 8 | "transform-decorators-legacy", 9 | "transform-decorators", 10 | "transform-runtime", 11 | "transform-class-properties", 12 | "add-module-exports" 13 | ] 14 | } -------------------------------------------------------------------------------- /src/patchConsoleLog.js: -------------------------------------------------------------------------------- 1 | import StyledString from './StyledString'; 2 | 3 | export default function patchConsoleLog () { 4 | let log = console.log; 5 | console.log = (...args) => { 6 | args = args.map(arg => arg && typeof arg === 'object' && arg.name === 'StyledString' ? arg.toString() : arg); 7 | return log(...args); 8 | }; 9 | } -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | import StyledString from './StyledString'; 2 | import patchDebugLog from './patchDebugLog'; 3 | import patchConsoleLog from './patchConsoleLog'; 4 | import compileTemplate from './compileTemplate'; 5 | 6 | // patch consoles 7 | patchConsoleLog(); 8 | patchDebugLog(); 9 | 10 | function style (...args) { 11 | return new StyledString(args); 12 | } 13 | style.define = compileTemplate.define; 14 | 15 | // export template 16 | export default style; -------------------------------------------------------------------------------- /src/patchDebugLog.js: -------------------------------------------------------------------------------- 1 | import StyledString from './StyledString'; 2 | 3 | export default function patchDebugLog () { 4 | try { 5 | let Debug = require('req-once')('debug'), 6 | coerce = Debug.coerce; 7 | 8 | Debug.coerce = function (...args) { 9 | args = args.map(arg => typeof arg === 'object' && arg.name == 'StyledString' ? arg.toString() : arg); 10 | return coerce(...args); 11 | }; 12 | } catch (error) { 13 | console.log(error); 14 | } 15 | } -------------------------------------------------------------------------------- /.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "parser": "babel-eslint", 3 | "env": { 4 | "node": true, 5 | "jasmine": true 6 | }, 7 | "plugins": [ 8 | "babel", 9 | "jasmine" 10 | ], 11 | "rules": { 12 | "prefer-arrow-callback": "error", 13 | "wrap-iife": ["error", "inside"], 14 | "babel/func-params-comma-dangle": 1, 15 | "no-var": 1, 16 | "no-redeclare": 1, 17 | "no-undef": 1, 18 | "strict": 1, 19 | "no-unused-vars": 1, 20 | "semi": [1, "always"], // require or disallow use of semicolons instead of ASI 21 | "semi-spacing": [1, {"before": false, "after": true}], // enforce spacing before and after semicolons 22 | "quotes": ["error", "single"] 23 | } 24 | } -------------------------------------------------------------------------------- /dist/styles.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | String.prototype.rgb = function (r, g, b) { 7 | return '\x1b[38;2;' + r + ';' + g + ';' + b + 'm' + this + '\x1b[0m'; 8 | }; 9 | String.prototype.rgbBG = function (r, g, b) { 10 | return '\x1b[48;2;' + r + ';' + g + ';' + b + 'm' + this + '\x1b[0m'; 11 | }; 12 | 13 | exports.default = ['reset', 'bold', 'dim', 'italic', 'underline', 'inverse', 'hidden', 'strikethrough', 'black', 'red', 'green', 'yellow', 'blue', 'magenta', 'cyan', 'white', 'gray', 'grey', 'bgBlack', 'bgRed', 'bgGreen', 'bgYellow', 'bgBlue', 'bgMagenta', 'bgCyan', 'bgWhite', 'blackBG', 'redBG', 'greenBG', 'yellowBG', 'blueBG', 'magentaBG', 'cyanBG', 'whiteBG']; 14 | module.exports = exports['default']; -------------------------------------------------------------------------------- /src/styles.js: -------------------------------------------------------------------------------- 1 | String.prototype.rgb = function (r, g, b) { 2 | return '\x1b[38;2;' + r + ';' + g + ';' + b + 'm' + this + '\x1b[0m'; 3 | }; 4 | String.prototype.rgbBG = function (r, g, b) { 5 | return '\x1b[48;2;' + r + ';' + g + ';' + b + 'm' + this + '\x1b[0m'; 6 | }; 7 | 8 | export default [ 9 | 'reset', 10 | 'bold', 11 | 'dim', 12 | 'italic', 13 | 'underline', 14 | 'inverse', 15 | 'hidden', 16 | 'strikethrough', 17 | 'black', 18 | 'red', 19 | 'green', 20 | 'yellow', 21 | 'blue', 22 | 'magenta', 23 | 'cyan', 24 | 'white', 25 | 'gray', 26 | 'grey', 27 | 'bgBlack', 28 | 'bgRed', 29 | 'bgGreen', 30 | 'bgYellow', 31 | 'bgBlue', 32 | 'bgMagenta', 33 | 'bgCyan', 34 | 'bgWhite', 35 | 'blackBG', 36 | 'redBG', 37 | 'greenBG', 38 | 'yellowBG', 39 | 'blueBG', 40 | 'magentaBG', 41 | 'cyanBG', 42 | 'whiteBG' 43 | ]; -------------------------------------------------------------------------------- /src/StyledString.js: -------------------------------------------------------------------------------- 1 | import compileTemplate from './compileTemplate'; 2 | import styles from './styles'; 3 | 4 | class StyledString { 5 | constructor (templateArgs) { 6 | this.styles = []; 7 | this.templateArgs = templateArgs; 8 | } 9 | 10 | name = 'StyledString'; 11 | 12 | toString () { 13 | return compileTemplate(this.styles, ...this.templateArgs); 14 | } 15 | 16 | rgb (r, g, b) { 17 | this.styles.push(`rgb(${r},${g},${b})`); 18 | return this; 19 | } 20 | 21 | rgbBG (r, g, b) { 22 | this.styles.push(`rgbBG(${r},${g},${b})`); 23 | return this; 24 | } 25 | } 26 | styles.forEach(property => { 27 | Object.defineProperty(StyledString.prototype, property, { 28 | get: function () { 29 | if (this.styles.indexOf(property) === -1) { 30 | this.styles.push(property); 31 | } 32 | return this; 33 | } 34 | }); 35 | }); 36 | 37 | export default StyledString; -------------------------------------------------------------------------------- /dist/index.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | 7 | var _StyledString = require('./StyledString'); 8 | 9 | var _StyledString2 = _interopRequireDefault(_StyledString); 10 | 11 | var _patchDebugLog = require('./patchDebugLog'); 12 | 13 | var _patchDebugLog2 = _interopRequireDefault(_patchDebugLog); 14 | 15 | var _patchConsoleLog = require('./patchConsoleLog'); 16 | 17 | var _patchConsoleLog2 = _interopRequireDefault(_patchConsoleLog); 18 | 19 | var _compileTemplate = require('./compileTemplate'); 20 | 21 | var _compileTemplate2 = _interopRequireDefault(_compileTemplate); 22 | 23 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 24 | 25 | // patch consoles 26 | (0, _patchConsoleLog2.default)(); 27 | (0, _patchDebugLog2.default)(); 28 | 29 | function style() { 30 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { 31 | args[_key] = arguments[_key]; 32 | } 33 | 34 | return new _StyledString2.default(args); 35 | } 36 | style.define = _compileTemplate2.default.define; 37 | 38 | // export template 39 | exports.default = style; 40 | module.exports = exports['default']; -------------------------------------------------------------------------------- /dist/patchConsoleLog.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | 7 | var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray'); 8 | 9 | var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2); 10 | 11 | var _typeof2 = require('babel-runtime/helpers/typeof'); 12 | 13 | var _typeof3 = _interopRequireDefault(_typeof2); 14 | 15 | exports.default = patchConsoleLog; 16 | 17 | var _StyledString = require('./StyledString'); 18 | 19 | var _StyledString2 = _interopRequireDefault(_StyledString); 20 | 21 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 22 | 23 | function patchConsoleLog() { 24 | var log = console.log; 25 | console.log = function () { 26 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { 27 | args[_key] = arguments[_key]; 28 | } 29 | 30 | args = args.map(function (arg) { 31 | return arg && (typeof arg === 'undefined' ? 'undefined' : (0, _typeof3.default)(arg)) === 'object' && arg.name === 'StyledString' ? arg.toString() : arg; 32 | }); 33 | return log.apply(undefined, (0, _toConsumableArray3.default)(args)); 34 | }; 35 | } 36 | module.exports = exports['default']; -------------------------------------------------------------------------------- /dist/patchDebugLog.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | 7 | var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray'); 8 | 9 | var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2); 10 | 11 | var _typeof2 = require('babel-runtime/helpers/typeof'); 12 | 13 | var _typeof3 = _interopRequireDefault(_typeof2); 14 | 15 | exports.default = patchDebugLog; 16 | 17 | var _StyledString = require('./StyledString'); 18 | 19 | var _StyledString2 = _interopRequireDefault(_StyledString); 20 | 21 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 22 | 23 | function patchDebugLog() { 24 | try { 25 | var Debug = require('req-once')('debug'), 26 | coerce = Debug.coerce; 27 | 28 | Debug.coerce = function () { 29 | for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { 30 | args[_key] = arguments[_key]; 31 | } 32 | 33 | args = args.map(function (arg) { 34 | return (typeof arg === 'undefined' ? 'undefined' : (0, _typeof3.default)(arg)) === 'object' && arg.name == 'StyledString' ? arg.toString() : arg; 35 | }); 36 | return coerce.apply(undefined, (0, _toConsumableArray3.default)(args)); 37 | }; 38 | } catch (error) { 39 | console.log(error); 40 | } 41 | } 42 | module.exports = exports['default']; -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "template-colors", 3 | "version": "0.0.9", 4 | "description": "beautiful color usage within template literals", 5 | "main": "dist/index.js", 6 | "scripts": { 7 | "test": "npm run build; ./node_modules/.bin/babel ./spec/ --out-dir ./.spec/; ./node_modules/.bin/jasmine-node ./.spec/*", 8 | "build": "./node_modules/.bin/babel ./src/ --out-dir ./dist/;" 9 | }, 10 | "repository": { 11 | "type": "git", 12 | "url": "git://github.com/icodeforlove/template-colors.git" 13 | }, 14 | "author": { 15 | "name": "Chad Scira", 16 | "email": "chadvscira@gmail.com" 17 | }, 18 | "license": "MIT", 19 | "dependencies": { 20 | "colors": "^1.1.2", 21 | "req-once": "0.0.1" 22 | }, 23 | "devDependencies": { 24 | "babel": "^6.5.2", 25 | "babel-cli": "^6.14.0", 26 | "babel-eslint": "^6.1.2", 27 | "babel-plugin-add-module-exports": "^0.2.1", 28 | "babel-plugin-transform-class-properties": "^6.11.5", 29 | "babel-plugin-transform-decorators": "^6.13.0", 30 | "babel-plugin-transform-decorators-legacy": "^1.3.4", 31 | "babel-plugin-transform-runtime": "^6.12.0", 32 | "babel-preset-es2015": "^6.14.0", 33 | "babel-preset-react": "^6.11.1", 34 | "babel-preset-stage-0": "^6.5.0", 35 | "babel-runtime": "^6.11.6", 36 | "eslint": "^3.4.0", 37 | "eslint-plugin-babel": "^3.3.0", 38 | "eslint-plugin-jasmine": "^1.8.1", 39 | "jasmine-node": "^1.14.5" 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # template-colors [![Build Status](https://travis-ci.org/icodeforlove/template-colors.png?branch=master)](https://travis-ci.org/icodeforlove/template-colors) 2 | 3 | ### next generation terminal colors! 4 | 5 | beautiful color usage within template literals (uses [colors](https://github.com/marak/colors.js) behind the scenes) 6 | 7 | ## install 8 | 9 | ``` 10 | npm install --save template-colors 11 | ``` 12 | 13 | ## usage 14 | 15 | you can compose colored template literals in many ways 16 | 17 | ```javascript 18 | import c from 'template-colors'; 19 | 20 | console.log(c`found ${17}.bold new users`); 21 | 22 | console.log(c`found ${17}.bold new users`.bold.underline.grey); 23 | 24 | console.log(c`could not delete ${6}.bold.green users`.underline.red); 25 | 26 | console.log(c`user ${'John Doe'}.white.bold ${'logged'}.yellow in at ${new Date()}.white.bold`.grey); 27 | 28 | console.log(c` 29 | This is ${'a'}.blue.italic 30 | ${'multiline'}.black.magentaBG 31 | ${'example'}.bold.underline. 32 | `.grey); 33 | ``` 34 | 35 | ![screenshot](https://img42.com/nwedl+) 36 | 37 | ## features 38 | 39 | rgb / rgbBG (may be unsupported by your terminal) 40 | 41 | ```javascript 42 | c`foo bar`.rgb(255,0,0) 43 | c`foo bar`.rgb(255,0,0).rgbBG(0,0,0) 44 | ``` 45 | 46 | inline style commands 47 | 48 | ```javascript 49 | c`${'foo bar'}.bold.red` 50 | ``` 51 | 52 | pre existing styles 53 | 54 | ```javascript 55 | c`${'foo bar'.bold}.red` 56 | ``` 57 | 58 | defalt styles to apply to whole string 59 | 60 | ```javascript 61 | c`${'foo'}.red bar`.grey.underline 62 | ``` 63 | 64 | custom defined styles 65 | ```javascript 66 | c.define('error', 'rgb(255,0,0)'); 67 | c.define('log', ['rgb(0,0,0)', 'rgbBG(255,255,255)', 'bold', 'underline', 'italic']); 68 | 69 | c`foo bar`.error 70 | c`foo bar`.log 71 | ``` -------------------------------------------------------------------------------- /dist/StyledString.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | 7 | var _defineProperty = require('babel-runtime/core-js/object/define-property'); 8 | 9 | var _defineProperty2 = _interopRequireDefault(_defineProperty); 10 | 11 | var _toConsumableArray2 = require('babel-runtime/helpers/toConsumableArray'); 12 | 13 | var _toConsumableArray3 = _interopRequireDefault(_toConsumableArray2); 14 | 15 | var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck'); 16 | 17 | var _classCallCheck3 = _interopRequireDefault(_classCallCheck2); 18 | 19 | var _createClass2 = require('babel-runtime/helpers/createClass'); 20 | 21 | var _createClass3 = _interopRequireDefault(_createClass2); 22 | 23 | var _compileTemplate = require('./compileTemplate'); 24 | 25 | var _compileTemplate2 = _interopRequireDefault(_compileTemplate); 26 | 27 | var _styles = require('./styles'); 28 | 29 | var _styles2 = _interopRequireDefault(_styles); 30 | 31 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 32 | 33 | var StyledString = function () { 34 | function StyledString(templateArgs) { 35 | (0, _classCallCheck3.default)(this, StyledString); 36 | this.name = 'StyledString'; 37 | 38 | this.styles = []; 39 | this.templateArgs = templateArgs; 40 | } 41 | 42 | (0, _createClass3.default)(StyledString, [{ 43 | key: 'toString', 44 | value: function toString() { 45 | return _compileTemplate2.default.apply(undefined, [this.styles].concat((0, _toConsumableArray3.default)(this.templateArgs))); 46 | } 47 | }, { 48 | key: 'rgb', 49 | value: function rgb(r, g, b) { 50 | this.styles.push('rgb(' + r + ',' + g + ',' + b + ')'); 51 | return this; 52 | } 53 | }, { 54 | key: 'rgbBG', 55 | value: function rgbBG(r, g, b) { 56 | this.styles.push('rgbBG(' + r + ',' + g + ',' + b + ')'); 57 | return this; 58 | } 59 | }]); 60 | return StyledString; 61 | }(); 62 | 63 | _styles2.default.forEach(function (property) { 64 | (0, _defineProperty2.default)(StyledString.prototype, property, { 65 | get: function get() { 66 | if (this.styles.indexOf(property) === -1) { 67 | this.styles.push(property); 68 | } 69 | return this; 70 | } 71 | }); 72 | }); 73 | 74 | exports.default = StyledString; 75 | module.exports = exports['default']; -------------------------------------------------------------------------------- /src/compileTemplate.js: -------------------------------------------------------------------------------- 1 | import 'colors'; 2 | import styles from './styles'; 3 | import StyledString from './StyledString'; 4 | 5 | let COLORS_REGEXP = compileColorsRegExp();//new RegExp(`^\\.((?:\\.?(?:${styles.join('|')}|rgb(?:BG)?\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)))+)`); 6 | const RGB_REGEXP = /(rgb(?:BG)?)\((\s*\d+\s*)\,(\s*\d+\s*)\,(\s*\d+\s*)\)/; 7 | let definedStyles = {}; 8 | 9 | function compileColorsRegExp () { 10 | return new RegExp(`^\\.((?:\\.?(?:${styles.join('|')}|rgb(?:BG)?\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)))+)`); 11 | } 12 | 13 | function runStyleOnString (string, style) { 14 | let rgbMatch = style.match(RGB_REGEXP); 15 | 16 | if (rgbMatch) { 17 | let type = rgbMatch[1], 18 | r = rgbMatch[2], 19 | g = rgbMatch[3], 20 | b = rgbMatch[4]; 21 | 22 | if (type === 'rgb') { 23 | return string.rgb(r,g,b); 24 | } else if (type === 'rgbBG') { 25 | return string.rgbBG(r,g,b); 26 | } 27 | } else if (definedStyles[style]) { 28 | definedStyles[style].forEach(style => { 29 | string = runStyleOnString(string, style); 30 | }); 31 | return string; 32 | } else { 33 | return string[style]; 34 | } 35 | } 36 | 37 | export default function compileTemplate (defaultStyles, strings, ...replacements) { 38 | let string = ''; 39 | 40 | strings.forEach((item, index, strings) => { 41 | let after = replacements.shift(), 42 | next = strings[index + 1]; 43 | 44 | after = typeof after === 'undefined' ? '' : String(after); 45 | 46 | // strip style commands 47 | item = String(item).replace(COLORS_REGEXP, ''); 48 | 49 | if (!typeof next != undefined) { 50 | let colorsMatch = String(next).match(COLORS_REGEXP); 51 | 52 | if (colorsMatch && after) { 53 | // apply styles 54 | colorsMatch[1].split('.').forEach(style => (after = runStyleOnString(after, style))); 55 | } 56 | 57 | // apply default styles to item 58 | defaultStyles.forEach(style => (item = runStyleOnString(item, style))); 59 | 60 | // apply default styles to after 61 | defaultStyles.forEach(style => (after = runStyleOnString(after, style))); 62 | 63 | // concatenate new segment 64 | string += item + after; 65 | } 66 | }); 67 | 68 | return string; 69 | } 70 | compileTemplate.define = (name, stylesToDefine) => { 71 | if (typeof stylesToDefine === 'string') { 72 | stylesToDefine = [stylesToDefine]; 73 | } 74 | styles.push(name); 75 | definedStyles[name] = stylesToDefine; 76 | COLORS_REGEXP = compileColorsRegExp(); 77 | Object.defineProperty(StyledString.prototype, name, { 78 | get: function () { 79 | this.styles = this.styles.concat(stylesToDefine); 80 | return this; 81 | } 82 | }); 83 | Object.defineProperty(String.prototype, name, { 84 | get: function () { 85 | //console.log(new StyledString([[this]])[name]) 86 | return new StyledString([[this]])[name]; 87 | } 88 | }); 89 | }; -------------------------------------------------------------------------------- /spec/tests.spec.js: -------------------------------------------------------------------------------- 1 | import c from '../dist/index'; 2 | 3 | c.define('error', 'rgb(255,0,0)'); 4 | c.define('log', ['rgb(0,0,0)', 'rgbBG(255,255,255)', 'bold', 'underline', 'italic']); 5 | 6 | describe('General', () => { 7 | it('can log false values', () => { 8 | let passed = false; 9 | try { 10 | console.log(null); 11 | console.log(0); 12 | console.log(undefined); 13 | passed = true; 14 | } catch (error) {console.log(error)} 15 | expect(passed).toBe(true); 16 | }); 17 | it('can use inline styles', () => { 18 | expect(c`${'foobar'}.red`.toString()).toBe('foobar'); 19 | expect(c`foo${'bar'}.red`.toString()).toBe('foobar'); 20 | expect(c`${'foo'.blue}${'bar'}.red`.toString()).toBe('foobar'); 21 | expect(c`${'foo'}.blue${'bar'}.red`.toString()).toBe('foobar'); 22 | expect(c`foobar ${1}.red foobar`.toString()).toBe('foobar 1 foobar'); 23 | }); 24 | 25 | it('can use default styles', () => { 26 | expect(c`foobar ${'foobar'}.red foobar`.blue.underline.toString()).toBe('foobar foobar foobar'); 27 | expect(c`foobar`.red.toString()).toBe('foobar'); 28 | expect(c`foobar ${'foobar'}.blue ${'foobar'.cyan}`.red.bold.underline.toString()).toBe('foobar foobar foobar'); 29 | expect(c`foobar ${123}.bold foobar`.red.toString()).toBe('foobar 123 foobar'); 30 | }); 31 | 32 | it('can use .rgb and .rgbBG', () => { 33 | expect(c`${'one'.rgb(77,77,77)} ${'two'}.rgb(144,144,144).bold.rgbBG(44,44,44) three`.rgb(0,0,0).rgbBG(255,255,255).underline.bold.toString()).toBe('one two three'); 34 | }); 35 | 36 | it('can use custom defined styles', () => { 37 | expect(c`foo bar ${'hello'}.error`.log.toString()).toBe('foo bar hello'); 38 | expect(c`${'hello'.error}.bold ${'test'}.log ${'test'.log} hello`.error.toString()).toBe('hello test test hello'); 39 | }); 40 | }); -------------------------------------------------------------------------------- /dist/compileTemplate.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | Object.defineProperty(exports, "__esModule", { 4 | value: true 5 | }); 6 | 7 | var _defineProperty = require('babel-runtime/core-js/object/define-property'); 8 | 9 | var _defineProperty2 = _interopRequireDefault(_defineProperty); 10 | 11 | var _typeof2 = require('babel-runtime/helpers/typeof'); 12 | 13 | var _typeof3 = _interopRequireDefault(_typeof2); 14 | 15 | exports.default = compileTemplate; 16 | 17 | require('colors'); 18 | 19 | var _styles = require('./styles'); 20 | 21 | var _styles2 = _interopRequireDefault(_styles); 22 | 23 | var _StyledString = require('./StyledString'); 24 | 25 | var _StyledString2 = _interopRequireDefault(_StyledString); 26 | 27 | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 28 | 29 | var COLORS_REGEXP = compileColorsRegExp(); //new RegExp(`^\\.((?:\\.?(?:${styles.join('|')}|rgb(?:BG)?\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)))+)`); 30 | var RGB_REGEXP = /(rgb(?:BG)?)\((\s*\d+\s*)\,(\s*\d+\s*)\,(\s*\d+\s*)\)/; 31 | var definedStyles = {}; 32 | 33 | function compileColorsRegExp() { 34 | return new RegExp('^\\.((?:\\.?(?:' + _styles2.default.join('|') + '|rgb(?:BG)?\\(\\s*\\d+\\s*,\\s*\\d+\\s*,\\s*\\d+\\s*\\)))+)'); 35 | } 36 | 37 | function runStyleOnString(string, style) { 38 | var rgbMatch = style.match(RGB_REGEXP); 39 | 40 | if (rgbMatch) { 41 | var type = rgbMatch[1], 42 | r = rgbMatch[2], 43 | g = rgbMatch[3], 44 | b = rgbMatch[4]; 45 | 46 | if (type === 'rgb') { 47 | return string.rgb(r, g, b); 48 | } else if (type === 'rgbBG') { 49 | return string.rgbBG(r, g, b); 50 | } 51 | } else if (definedStyles[style]) { 52 | definedStyles[style].forEach(function (style) { 53 | string = runStyleOnString(string, style); 54 | }); 55 | return string; 56 | } else { 57 | return string[style]; 58 | } 59 | } 60 | 61 | function compileTemplate(defaultStyles, strings) { 62 | for (var _len = arguments.length, replacements = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) { 63 | replacements[_key - 2] = arguments[_key]; 64 | } 65 | 66 | var string = ''; 67 | 68 | strings.forEach(function (item, index, strings) { 69 | var after = replacements.shift(), 70 | next = strings[index + 1]; 71 | 72 | after = typeof after === 'undefined' ? '' : String(after); 73 | 74 | // strip style commands 75 | item = String(item).replace(COLORS_REGEXP, ''); 76 | 77 | if (!(typeof next === 'undefined' ? 'undefined' : (0, _typeof3.default)(next)) != undefined) { 78 | var colorsMatch = String(next).match(COLORS_REGEXP); 79 | 80 | if (colorsMatch && after) { 81 | // apply styles 82 | colorsMatch[1].split('.').forEach(function (style) { 83 | return after = runStyleOnString(after, style); 84 | }); 85 | } 86 | 87 | // apply default styles to item 88 | defaultStyles.forEach(function (style) { 89 | return item = runStyleOnString(item, style); 90 | }); 91 | 92 | // apply default styles to after 93 | defaultStyles.forEach(function (style) { 94 | return after = runStyleOnString(after, style); 95 | }); 96 | 97 | // concatenate new segment 98 | string += item + after; 99 | } 100 | }); 101 | 102 | return string; 103 | } 104 | compileTemplate.define = function (name, stylesToDefine) { 105 | if (typeof stylesToDefine === 'string') { 106 | stylesToDefine = [stylesToDefine]; 107 | } 108 | _styles2.default.push(name); 109 | definedStyles[name] = stylesToDefine; 110 | COLORS_REGEXP = compileColorsRegExp(); 111 | (0, _defineProperty2.default)(_StyledString2.default.prototype, name, { 112 | get: function get() { 113 | this.styles = this.styles.concat(stylesToDefine); 114 | return this; 115 | } 116 | }); 117 | (0, _defineProperty2.default)(String.prototype, name, { 118 | get: function get() { 119 | //console.log(new StyledString([[this]])[name]) 120 | return new _StyledString2.default([[this]])[name]; 121 | } 122 | }); 123 | }; 124 | module.exports = exports['default']; --------------------------------------------------------------------------------