interface EditIconType {
  className?: string;
  onClick?: () => void;
}

const EditIcon = ({ className, onClick }: EditIconType) => {
  return (
    <svg
      width="16"
      height="17"
      viewBox="0 0 16 17"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      className={className}
      onClick={onClick}
    >
      <path
        d="M5.33323 10.3008C5.33323 9.97468 5.33323 9.81162 5.37007 9.65817C5.40274 9.52212 5.45661 9.39206 5.52971 9.27276C5.61217 9.13821 5.72747 9.02291 5.95808 8.7923L12.3333 2.41714C12.8855 1.86486 13.781 1.86486 14.3333 2.41714C14.8855 2.96943 14.8855 3.86486 14.3333 4.41714L7.95809 10.7923C7.72749 11.0229 7.61219 11.1382 7.47763 11.2207C7.35834 11.2938 7.22828 11.3476 7.09223 11.3803C6.93878 11.4171 6.77572 11.4171 6.4496 11.4171H5.33323V10.3008Z"
        fill="var(--primary)"
      />
      <path
        d="M7.33325 3.41714H4.53325C3.41315 3.41714 2.85309 3.41714 2.42527 3.63513C2.04895 3.82688 1.74299 4.13284 1.55124 4.50916C1.33325 4.93699 1.33325 5.49704 1.33325 6.61714V12.2171C1.33325 13.3372 1.33325 13.8973 1.55124 14.3251C1.74299 14.7014 2.04895 15.0074 2.42527 15.1992C2.85309 15.4171 3.41315 15.4171 4.53325 15.4171H10.1333C11.2534 15.4171 11.8134 15.4171 12.2412 15.1992C12.6176 15.0074 12.9235 14.7014 13.1153 14.3251C13.3333 13.8973 13.3333 13.3372 13.3333 12.2171V9.41714M5.33323 11.4171H6.4496C6.77572 11.4171 6.93878 11.4171 7.09223 11.3803C7.22828 11.3476 7.35834 11.2938 7.47763 11.2207C7.61219 11.1382 7.72749 11.0229 7.95809 10.7923L14.3333 4.41714C14.8855 3.86486 14.8855 2.96943 14.3333 2.41714C13.781 1.86486 12.8855 1.86486 12.3333 2.41714L5.95808 8.79231C5.72747 9.02291 5.61217 9.13821 5.52971 9.27276C5.45661 9.39206 5.40274 9.52212 5.37007 9.65817C5.33323 9.81162 5.33323 9.97468 5.33323 10.3008V11.4171Z"
        stroke="#333333"
        strokeLinecap="round"
        strokeLinejoin="round"
      />
    </svg>
  );
};

export default EditIcon;