Function ColorPicker

docs/src/components/DynamicColorTheme.tsx:59–95

({ color, setColor, additional }: ColorPickerProps)

];

const ColorPicker = ({ color, setColor, additional }: ColorPickerProps) => {
  const [open, setOpen] = useState(false);
  const labelColor = Color(color).isDark() ? '#fff' : '#000';

  return (
    <div className="color-picker-anchor">
      <button
        className={
          additional ? 'color-picker-button-additional' : 'color-picker-button'
        }
        style={{
          background: color,
          color: labelColor,
        }}
        onClick={() => setOpen(true)}
      >
        {color}
      </button>
      {open ? (
        <div>
          <div
            className="color-picker-cover"
            onClick={() => setOpen(false)}
          ></div>
          <div className="color-picker-popup">
            <BlockPicker
              color={color}
              //@ts-ignore
              onChangeComplete={(change) => setColor(change.hex)}
              colors={colorPalette}
            />
          </div>
        </div>
      ) : null}
    </div>
  );
};

const BaseColor = ({ color, setColor }: ColorProps) => {
  return (