import React, { memo } from 'react';
import FontIcon from 'components/FontIcon';
import './LayerIcon.less';

function LayerIcon({ title, show, value, type, icon, onChange }) {
  const props = {
    style: { cursor: 'pointer', fontSize: 12, marginLeft: 5 },
    onClick: (e) => {
      e.stopPropagation();
      onChange(type, !value);
    },
    title,
    anime: true,
    size: 12
  };

  if (!show) return null;
  return <FontIcon {...props} icon={`icon-icon_${icon || type}`} />;
}

export default memo(LayerIcon);
