reactコンポーネントで出力したsvgタグでマウスイベントを拾う方法を教えてください。

初めて投稿します。よろしくお願いいたします。

reactのコンポーネントでsvgタグを出力する処理で、svgイメージ上のマウスoverまたはoutのイベントを拾うのに以下のようなコードを使用しています。

ところが最近reactのバージョンアップしてv16にしたところ、当該イベントを拾わなくなりました。

v15までは動作したので、原因や対策を調べたのですがわかりませんでした。

もし原因や対策をご存知でしたらご教授お願いいたします。

SvgIcon.tsx

import * as React from 'react';

interface Props {
  onMouseOver?: any,
  onMouseOut?: any,
}

export default class SvgIcon extends React.PureComponent<Props> {
  static defaultProps = {
    onMouseOver: ()=>{}, //popup表示処理を呼び出し元にて指定
    onMouseOut: ()=>{},  //popup非表示処理を呼び出し元にて指定
  };

  render() {
    const { onMouseOver, onMouseOut } = this.props;
    return (
      <svg ～いろいろ～ onMouseOver={onMouseOver} onMouseOut={onMouseOut} >
        <rect ～いろいろ～ />
      </svg>
    );
  }
}