prjctimg / huetiful

JavaScript utility library for simple 🧮, fast ⏱️ and accessible ♿ color manipulation.
http://huetiful-js.com/
Apache License 2.0
28 stars 5 forks source link

feat: type safe colour token parser #209

Closed prjctimg closed 1 week ago

prjctimg commented 1 month ago

Inspiration

Previously (v2.x.x and below) the library exported different functions to convert colours from different types to a common format like hex.

However, v3 is focused on a more simplified API and therefore all the converter functions have been merged into one utility function token()

How does it work

The function will be broken down into several steps:

Parsing

Because we are expecting colors in different types we first have to parse our colour to a widely accepted format. This helps ensure that we don't branch off our logic for no reason.

When an array is passed as a colour token it is converted to a colour object so that it can be passed to functions like formatHex or formatHex8 in the specified srcMode. The same can be said to all the other types which will be converted to plain objects as well.

Conversion

If the targetMode option is specified and the kind is set to 'arr' or 'obj' the colour will be converted to the specified colour space. This is also where we perform normalizeRGB which will allow us to make [0,255] RGB channel ranges compatible with the [0,1] range supported by Culori.

Output modification

This is the stage where we modify the final result to match the options that may be specified for example

This is a core function because it allows the parsing of any recognisable colour tokens throughout the library.

github-actions[bot] commented 1 month ago

Thanks for the issue, our team will look into it as soon as possible! If you would like to work on this issue, please wait for a maintainer to decide if it is ready to be worked on.

To claim an issue, please leave a comment that says ".take". If you have any questions, feel free to ping a maintainer.

prjctimg commented 1 month ago

Default color spaces

When parsing our colors we may want to omit properties like colorspace for example, when working with arrays.

The srcMode is 'rgb' by default and the targetMode is undefined by default as well. In this scenario, the targetMode defaults to the srcMode when 'kind' is 'obj' | 'arr' to avoid errors by passing undefined values to the converter

prjctimg commented 1 month ago

211

Token parser now works as expected

prjctimg commented 2 weeks ago

The other bug I'm facing is that channel values are being normalized like rgb even when the mode is not RGB. Working on it right now