Black is missing from TrelloPowerUp.util.colors, hex lookup throws

It seems that “black” is not a valid color string in TrelloPowerUp.util.colors helper, at least TrelloPowerUp.util.colors.getHexString('black') fails with Unknown color name: black.

This is an issue because “black” is an existing color for labels, so when I show labels from a board in my Power-Up I cannot simply get hex values from the helper method, I need to manually check for “black” (and null) and hardcode the hex string for it, eg.:

function getColorHex(color) {
  let colors = window.TrelloPowerUp.util.colors
  if (color === 'black') {
    return '#344563'
  } else if (color === null) {
    return '#b3bac5'
  } else {
    return colors.getHexString(color)
  }
}

Also, TrelloPowerUp.util.colors.getHexString(null) should return the hex string of the grey that is used for colorless labels. I know it’s strange to lookup the hex value of “no color”, but otherwise the manual check and hardcoded grey hex value have to stay.

I guess the whole idea behind the color helper is to avoid makeshift solutions and keep colors consistent across the platform even if some of the color values change.

Could you please look into this and fix it if it makes sense?

That seems like a reasonable ask.

Let me dig into it a bit more.

I believe that for the null label color, you can do: colors.getHexString('shades', 60). That should return #B3BAC4 which is one off of the actual value (#B3BAC5) which I will see if we should get updated.

1 Like

Alright, I made the change in 1.21.1 (https://p.trellocdn.com/changelogs/power-up-js.html). There is now a black key accepted with the following values:

   black: {
      50: '#C1C7D0',
      100: '#7A869A',
      200: '#6B778C',
      300: '#5E6C84',
      400: '#505F79',
      500: '#42526E',
      600: '#344563',
      700: '#253858',
      800: '#172B4D',
      900: '#091E42'
    },

Additionally, colors.getHexString('shades', 60) now gives you the corrected value of #B3BAC5.

1 Like