Alpha channel in HEX

[zumm]

Steps to reproduce

Hex input field have alpha channel even if alpha channel option is set to 'hide'.

Current result

Hex code with alpha channel.

Expected result

Hex code without alpha channel.

Environment

• vue-accessible-color-picker version: 4.0.0

[kleinfreund]

I’ve implemented a fix for this in https://github.com/kleinfreund/vue-accessible-color-picker/commit/b301c5bee128600fc2141906deaeeb7272cb5b2a. It was released in package version 4.0.1.

[zumm]

Alpha channel is still in hex property of color object of color-change event. Is it ok?

[kleinfreund]

Alpha channel is still in hex property of color object of color-change event. Is it ok?

@zumm That is intentional, yes. In the color-change event, the cssColor property will have a value without alpha channel while colors in the colors property will have a value with alpha channel.

[zumm]

cssColor isn't the way for me since it respects color input mode. I want to get hex without alpha channel regardless of color input mode.

Also it seems to be broken. See that example - https://codesandbox.io/s/ancient-water-u2uvtr?file=/src/App.vue Hex color is getting clipped.

[kleinfreund]

I’ve implemented another fix for the behavior that you’re describing in https://github.com/kleinfreund/vue-accessible-color-picker/commit/a8492073afe0f84f04f056ca1ea76bc27d94ec99. It was released in package version 4.0.2.

If you always want to get hex colors without alpha channel regardless of the alpha-channel prop, you will need to apply a transformation like the following:

function handleColorChangeEvent({ colors }) {
  const hexWithoutAlphaChannel = [5, 9].includes(colors.hex.length)
    ? colors.hex.substring(0, colors.hex.length - (colors.hex.length - 1) / 4)
    : colors.hex
  console.log(hexWithoutAlphaChannel)
}

[zumm]

Yes, currently i'm using code like that to get hex without alpha channel. It is not very convenient, but ok.

New patch brings new bugs. Try to update vue-accessible-color-picker version in my previous example and select color by color-space-thumb. Hue slider goes crazy if hue isn't red.

Also i found another bug - hex code is getting clipped while copying.

[kleinfreund]

@zumm Hey. Thank you for this follow-up report. I believe your issue has the same cause as what was reported in #18. After fixing that issue, opening your demo again and installing v4.0.3, I can no longer reproduce either the color jumping around in the hue slider or the copy button copying a clipped color. Would you mind trying it again? Thank you for your patience.

[zumm]

@kleinfreund Now everything works good. Great job. Thx!