import React from 'react';
import { primaryColorPresets } from './color';
import Style from './radioColor.module.less';
function getColorOptions(value) {
    return value && !primaryColorPresets.includes(value)
        ? [value, ...primaryColorPresets]
        : primaryColorPresets;
}
const RadioColor = (props) => {
    const colorOptions = getColorOptions(props.value);
    return (<div className={Style.panel}>
            {colorOptions.map((color, index) => (<div key={index} onClick={() => props?.onChange(color)} className={Style.box} style={{
                borderColor: props.value === color ? color : 'transparent',
            }}>
                    <div className={Style.item} style={{ backgroundColor: color }}/>
                </div>))}
        </div>);
};
export default React.memo(RadioColor);