The main server, and probably only repository in this org.
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
import React, {useLayoutEffect, useState} from "react"; import iro from '@jaames/iro'; import {randId} from "../../Helpers/random";
function ColorPicker({color, onChange}) { const [random] = useState(randId());
useLayoutEffect(() => { const colorPicker = new iro.ColorPicker("#color-picker-" + random, { color: `#${color}`, layout: [ { component: iro.ui.Wheel, options: {} } ], });
colorPicker.on("input:end", color => { onChange(color.hexString.substr(1)); });
return () => { const elem = document.getElementById(`color-picker-${random}`); if (elem === null) { return; }
elem.innerHTML = ""; }; }, [color]);
return ( <div id={`color-picker-${random}`}>
</div> ); }
export default ColorPicker;
|