Parent Component

To make a custom color picker, create a top-level component that will act as the bridge with the CustomPicker high order component. Wrap the export with the CustomPicker function:

import React from 'react';
import { CustomPicker } from 'react-color';

class MyColorPicker extends React.Component {
  render() {
    return <div>MyColorPicker</div>;
  }
}

export default CustomPicker(MyColorPicker);

This component will be passed hex, rgb and hsl values as props for the current color. It is also provided an onChange prop that should be called to propagate a new color. Pass it a hex string, or an rgb or hsl object.