function useColorChange() {
    const [data, setData] = useState(undefined);
    const colorRef = useRef();

    useEffect(() => {
        const ref = colorRef.current;

        const colorListener = ($event) => {
            setData($event.detail.hex);
        };

        ref.addEventListener('colorChange', colorListener, false);

        return () => {
            ref.removeEventListener('colorChange', 
                                     colorListener, true);
        };
    }, [colorRef]);

    return [colorRef, data];
}