jorgebucaran/colorette

Style stack isn't remembered on multiple uses

Ovyerus opened this issue · 3 comments

If you store a style stack in a variable, e.g. const colour = tc.red.bgCyan.bold, the first call will be styled as expected, but any further calls to it will only have the first base style. I dunno if this is by design or whatever, but thought I'd report it just in case.

Reproduction

const tc = require('turbocolor');

const func = tc.red.bgCyan.bold;
const first = func('foobar');
const second  = func('foobar');

console.log(first, second);

Result

result img

@Ovyerus Yup, this behavior is expected. Calling func will reset the stack, so the second call fails.

I would do this:

const func = s => tc.red.bgCyan.bold(s)
const first = func('foobar')
const second  = func('foobar')

console.log(first, second)

or this:

const first = tc.red.bgCyan.bold('foobar')
const second  = tc.red.bgCyan.bold('foobar')

console.log(first, second)

This behavior was introduced in 9b1b3c2.

Ah I see. Yeah I ended up using the first style with the wrapping function, but I wasn't sure if it was intended behaviour or not.

Thanks for the fast reply!

@Ovyerus Just to be clear, you don't need to do:

const func = s => tc.red(s)

...since red (as well as every other style/color) is a named export. Every style keeps an internal stack/array which is reset to its original value every time you use it as a function.

const  { red } = require("turbocolor")

console.log(red("foo"), red("bar")) // Okay!

Now, if you want to create a chain like in your original post, you have two options I can think of:

const redBgCyanBold = s => tc.red.bgCyan.bold(s)

console.log(redBgCyanBold("foo"), redBgCyanBold("bar"))

// or

console.log(tc.red.bgCyan.bold("foo"), tc.red.bgCyan.bold("bar"))