React-color: Feature request: Ability to disable alpha

[ZephyrXero]

It would be very nice to be able to pass a prop to the color picker to remove the alpha sliders and text boxes, when I want to restrict the possible value selected to RGB, not RGBA. If the ability already exists, I have not managed to find it in the documentation.

I'm thinking it would work something like:
<ColorPicker disableAlpha='true' />

[casesandberg]

Which picker exactly?

[ZephyrXero]

I guess I was thinking all the pre-built ones, since they most all have alpha channel sliders/boxes.

I suppose I could make my own custom one to get around this, but that seems like it defeats the point in using a library for this in the first place.

[sayasajer]

Any solution for this? I am thinking the same thing. We should have ability to disable the alpha component.

[rnicholus]

This would apply to the ChromePicker and the SketchPicker. I was putting together a pull request to allow the alpha channel control to be omitted in these pickers, but gave up when it did not solve my underlying issue - use of data-uris. Something in these controls is generating a data-uri, and that is a Content Security Policy violation, which our project enforces. Any information as to where these data-uri are being created will help me to finish up this pull request.

[scottbarrow]

has there been any progress on this issue? @rnicholus would you be kind enough to push your branch up in it's current state?

[rnicholus]

@scottbarrow I'll see if I still have my progress available locally. I never committed anything to my fork at Widen/react-color.

[casesandberg]

This has been merged in and is available on Sketch and Chrome Pickers in [email protected] 🐬

[polyakoff]

Problem with disabling alpha channel

Trying to use the SketchPicker without alpha channel:

main.js

import ReactDOM from 'react-dom'
import React from 'react'
import { SketchPicker } from 'react-color'

    ReactDOM.render(
<SketchPicker disableAlpha='true' />
, document.getElementById('root'));

Results in following:

The same situation for the ChromePicker.

Package versions:

"react": "^15.0.0",
"react-color": "^2.13.4",
"react-dom": "^15.0.0"

Was also tested with [email protected] and react@^15.6.1, react-dom@^15.6.1

Any suggestions what's wrong here?
Any additional info needed?

[polyakoff]

Just in case someone runs into the same problem: the correct syntax for this is

<ChromePicker disableAlpha={true}/>

[rnicholus]

Since it's a boolean, this should work too <ChromePicker disableAlpha />