3.0.0 Proposal

I would like to start a discussion on some features and proposals for the next major version of React Color. Here is what I have been thinking:

~React Native Support~

This would require a rewrite of all of the components to use react-primitives. Everything has already been written with inline styles so this will make our job much easier. Along with support for RN, I think we should introduce a few new color pickers that are prevalent in native (Snapchat, Facebook, etc…)

Base Draggable Component

I propose a base component that handles the dragging and calculating of pixel values and position and leaves the translation of color spaces to the components that use it. Right now each component does a bunch of math on their own to figure this out. There have been a couple of requests (#395, #313) to create more sliders or gradient components. This would make them easier to add as well as a great common component for people to use to make their own.

Using Children For Swatches

The API footprint has grown quite a bit to allow for extended functionality of the swatches (#305). I propose we instead move everything over into a new Palette component like the one that @SpencerDawson has been working on and allow people to change the swatches by passing them down as children:

<SketchPicker>
  <MyCustomPalette />
  // or
  { colors.map((color) => (
    <div style={{ background: color }} />
  )) }
</SketchPicker>

Support AMD, UMD & CDN’s

I also propose that the NPM package have a dist folder with both a bundled and a minified version of react-color for use as drop in JS files. This has been requested in #310 and #364.

Type Definition Files

There is a ts definition file in definitely typed, but it is always out of date. I think we should provide both TS and Flow definition files alongside the library for people using typed environments.

New Documentation Backing

Right now the documentation site uses a very janky setup that I created a long time ago. I think we should probably move it over to something that has better community support such as Gatsby. I am open to suggestions here.

Smaller Things

• Investigate if there is a better, smaller library than tinycolor2 for our color conversions. #184
• Look into adding more accessibility support. #359
• Collaborate to create a vision doc that explains where the project is going.
• Make all components that take user input uncontrolled when focused #404, #216, #371
• Extend color spectrums that pickers return on change #66, #215

[fanatic75]

Does this work in react native?

[LightningXCE]

Hello!

Great work with these, they’re super slick!

I was just curious if there had been an update as well to the 3.0 release, as I am hoping to use this within a react-native application. Is the 3.0 branch currently compatible?

Thanks again!