import * as React from "react";

type Props = {
  id: string;
  children: React.ReactNode;
  onPress?: (ref: FocusManager.TouchableRef) => void;
  onPressIn?: (ref: FocusManager.TouchableRef) => void;
  onPressOut?: (ref: FocusManager.TouchableRef) => void;
  onLongPress?: (ref: FocusManager.TouchableRef) => void;
  onFocus?: (
    ref: FocusManager.TouchableRef,
    options: FocusManager.Android.CallbackOptions,
    context: Option<FocusManager.FocusContext>
  ) => void;
  onBlur?: (
    ref: FocusManager.TouchableRef,
    options: FocusManager.Android.CallbackOptions
  ) => void;

  disableFocus?: boolean;
  blockFocus?: boolean;
} & Partial<ParentFocus>;

export class Touchable extends React.Component<Props> {
  onPress(focusableRef: FocusManager.TouchableRef): void {
    this.props?.onPress?.(focusableRef);
  }

  onPressIn(focusableRef: FocusManager.TouchableRef): void {
    this.props?.onPressIn?.(focusableRef);
  }

  onPressOut(focusableRef: FocusManager.TouchableRef): void {
    this.props?.onPressOut?.(focusableRef);
  }

  onLongPress(focusableRef: FocusManager.TouchableRef): void {
    this.props?.onLongPress?.(focusableRef);
  }

  onFocus(
    focusableRef: FocusManager.TouchableRef,
    options: FocusManager.Android.CallbackOptions,
    context: Option<FocusManager.FocusContext>
  ): void {
    this.props?.onFocus?.(focusableRef, options, context);
  }

  onBlur(
    focusableRef: FocusManager.TouchableRef,
    options: FocusManager.Android.CallbackOptions
  ): void {
    this.props?.onBlur?.(focusableRef, options);
  }

  render() {
    const { children } = this.props;

    return children;
  }
}