message: refactor: Move Tappable context to HOC
diff: @@ -95,9 +95,10 @@ function deactivateOtherInstances(exclude?: string) {
  });
  }
  -const TappableContext = React.createContext<{ insideTappable?: boolean; onEnter?: VoidFunction; onLeave?: VoidFunction }>({ insideTappable: false });
  +type TappableContextInterface = { onEnter?: VoidFunction; onLeave?: VoidFunction };
  +const TappableContext = React.createContext<TappableContextInterface>({});
  -class Tappable extends React.Component<TappableProps, TappableState> {
  +class Tappable extends React.Component<TappableProps & TappableContextInterface, TappableState> {
  constructor(props: TappableProps) {
  super(props);
  this.id = Math.round(Math.random() * 1e8).toString(16);
  @@ -335,6 +336,8 @@ class Tappable extends React.Component<TappableProps, TappableState> {
  Component = defaultComponent,
  onClick,
  onKeyDown,
  + onEnter,
  + onLeave,
  activeEffectDelay,
  stopPropagation,
  getRootRef,
  @@ -382,20 +385,17 @@ class Tappable extends React.Component<TappableProps, TappableState> {
  const role: string = restProps.href ? 'link' : 'button';
  - return (
  - <TappableContext.Consumer>
  - {({ insideTappable, onEnter, onLeave }) => {
  return (
  <TouchRootContext.Consumer>
  {(insideTouchRoot: boolean) => {
  this.insideTouchRoot = insideTouchRoot;
  const touchProps = restProps.disabled ? {} : {
  onEnter: () => {
  - insideTappable && onEnter();
  + onEnter && onEnter();
  !restProps.disabled && this.onEnter();
  },
  onLeave: () => {
  - insideTappable && onLeave();
  + onLeave && onLeave();
  !restProps.disabled && this.onLeave();
  },
  };
  @@ -412,7 +412,6 @@ class Tappable extends React.Component<TappableProps, TappableState> {
  {...props}>
  <TappableContext.Provider
  value={{
  - insideTappable: true,
  onEnter: () => this.setState({ childHover: true }),
  onLeave: () => this.setState({ childHover: false }),
  }}
  @@ -433,13 +432,15 @@ class Tappable extends React.Component<TappableProps, TappableState> {
  }}
  </TouchRootContext.Consumer>
  );
  - }}
  - </TappableContext.Consumer>
  - );
  }
  }
  -export default withAdaptivity(withPlatform(Tappable), { sizeX: true, hasMouse: true });
  +const TappableNest: React.FC<TappableProps> = (props) => {
  + const parent = React.useContext(TappableContext);
  + return <Tappable {...props} {...parent} />;
  +};
  +
  +export default withAdaptivity(withPlatform(TappableNest), { sizeX: true, hasMouse: true });
  function Wave({ x, y, onClear }: Wave & { onClear: VoidFunction }) {
  const timeout = useTimeout(onClear, 225);
  