Feature request: create a Color from a hex string

[jamesarosen]

I'm trying to build an eyeglass module that defines colors in JavaScript and exports them to Sass.

If I return sass.types.String('#abcdef'), then I can use it fine in places like

background-color: my-color();

but this fails:

box-shadow: 0 0 0 1px rgba(my-color(), 1)

with

argument `$color` of `rgba($color, $alpha)` must be a color

But changing that to sass.types.Color('#abcdef') blows up with

error in C function my-color: Only argument should be an integer.

The tests for this library construct a sass.types.Color with four decimal arguments:

sass.types.Color(30, 127, 0, 1.0)

I don't see anything like sassUtils.hexToColor('#abcdef'), though it would certainly be useful.

Possibly related to #7

[jamesarosen]

This seems to work:

function hexToRGB(hex) {
  if (!/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) throw new Error(`Invalid hex: ${hex}`)

  let c = hex.substring(1).split('')
  if (c.length == 3) {
    c = [c[0], c[0], c[1], c[1], c[2], c[2]]
  }
  c = `0x${c.join('')}`
  return [(c >> 16) & 255, (c >> 8) & 255, c & 255]
}

return sass.types.Color(...hexToRGB('#abcdef'), 1)

[BuonOmo]

You could even simplify the last two lines of your function using:

function hexToRGBA(hex) {
  if (!/^#([A-Fa-f0-9]{3}){1,2}$/.test(hex)) throw new Error(`Invalid hex: ${hex}`)

  let c = hex.substring(1).split('')
  if (c.length == 3) {
    c = [c[0], c[0], c[1], c[1], c[2], c[2]]
  }
  c = `0xff${c.join('')}`
  return Number(c)
}

return sass.types.Color(hexToRGBA(hex))