@hps1978/react-native-web-tv 0.21.2-tv.0

package/dist/exports/Switch/index.js

@@ -0,0 +1,188 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * 
+ */
+
+'use client';
+
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["aria-label", "accessibilityLabel", "activeThumbColor", "activeTrackColor", "disabled", "onValueChange", "style", "thumbColor", "trackColor", "value"];
+import * as React from 'react';
+import createElement from '../createElement';
+import multiplyStyleLengthValue from '../../modules/multiplyStyleLengthValue';
+import StyleSheet from '../StyleSheet';
+import View from '../View';
+var emptyObject = {};
+var thumbDefaultBoxShadow = '0px 1px 3px rgba(0,0,0,0.5)';
+var thumbFocusedBoxShadow = thumbDefaultBoxShadow + ", 0 0 0 10px rgba(0,0,0,0.1)";
+var defaultActiveTrackColor = '#A3D3CF';
+var defaultTrackColor = '#939393';
+var defaultDisabledTrackColor = '#D5D5D5';
+var defaultActiveThumbColor = '#009688';
+var defaultThumbColor = '#FAFAFA';
+var defaultDisabledThumbColor = '#BDBDBD';
+var Switch = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
+  var ariaLabel = props['aria-label'],
+    accessibilityLabel = props.accessibilityLabel,
+    activeThumbColor = props.activeThumbColor,
+    activeTrackColor = props.activeTrackColor,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    onValueChange = props.onValueChange,
+    _props$style = props.style,
+    style = _props$style === void 0 ? emptyObject : _props$style,
+    thumbColor = props.thumbColor,
+    trackColor = props.trackColor,
+    _props$value = props.value,
+    value = _props$value === void 0 ? false : _props$value,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  var thumbRef = React.useRef(null);
+  function handleChange(event) {
+    if (onValueChange != null) {
+      onValueChange(event.nativeEvent.target.checked);
+    }
+  }
+  function handleFocusState(event) {
+    var isFocused = event.nativeEvent.type === 'focus';
+    var boxShadow = isFocused ? thumbFocusedBoxShadow : thumbDefaultBoxShadow;
+    if (thumbRef.current != null) {
+      thumbRef.current.style.boxShadow = boxShadow;
+    }
+  }
+  var _StyleSheet$flatten = StyleSheet.flatten(style),
+    styleHeight = _StyleSheet$flatten.height,
+    styleWidth = _StyleSheet$flatten.width;
+  var height = styleHeight || '20px';
+  var minWidth = multiplyStyleLengthValue(height, 2);
+  var width = styleWidth > minWidth ? styleWidth : minWidth;
+  var trackBorderRadius = multiplyStyleLengthValue(height, 0.5);
+  var trackCurrentColor = function () {
+    if (value === true) {
+      if (trackColor != null && typeof trackColor === 'object') {
+        return trackColor.true;
+      } else {
+        return activeTrackColor !== null && activeTrackColor !== void 0 ? activeTrackColor : defaultActiveTrackColor;
+      }
+    } else {
+      if (trackColor != null && typeof trackColor === 'object') {
+        return trackColor.false;
+      } else {
+        return trackColor !== null && trackColor !== void 0 ? trackColor : defaultTrackColor;
+      }
+    }
+  }();
+  var thumbCurrentColor = value ? activeThumbColor !== null && activeThumbColor !== void 0 ? activeThumbColor : defaultActiveThumbColor : thumbColor !== null && thumbColor !== void 0 ? thumbColor : defaultThumbColor;
+  var thumbHeight = height;
+  var thumbWidth = thumbHeight;
+  var rootStyle = [styles.root, style, disabled && styles.cursorDefault, {
+    height,
+    width
+  }];
+  var disabledTrackColor = function () {
+    if (value === true) {
+      if (typeof activeTrackColor === 'string' && activeTrackColor != null || typeof trackColor === 'object' && trackColor != null && trackColor.true) {
+        return trackCurrentColor;
+      } else {
+        return defaultDisabledTrackColor;
+      }
+    } else {
+      if (typeof trackColor === 'string' && trackColor != null || typeof trackColor === 'object' && trackColor != null && trackColor.false) {
+        return trackCurrentColor;
+      } else {
+        return defaultDisabledTrackColor;
+      }
+    }
+  }();
+  var disabledThumbColor = function () {
+    if (value === true) {
+      if (activeThumbColor == null) {
+        return defaultDisabledThumbColor;
+      } else {
+        return thumbCurrentColor;
+      }
+    } else {
+      if (thumbColor == null) {
+        return defaultDisabledThumbColor;
+      } else {
+        return thumbCurrentColor;
+      }
+    }
+  }();
+  var trackStyle = [styles.track, {
+    backgroundColor: disabled ? disabledTrackColor : trackCurrentColor,
+    borderRadius: trackBorderRadius
+  }];
+  var thumbStyle = [styles.thumb, value && styles.thumbActive, {
+    backgroundColor: disabled ? disabledThumbColor : thumbCurrentColor,
+    height: thumbHeight,
+    marginStart: value ? multiplyStyleLengthValue(thumbWidth, -1) : 0,
+    width: thumbWidth
+  }];
+  var nativeControl = createElement('input', {
+    'aria-label': ariaLabel || accessibilityLabel,
+    checked: value,
+    disabled: disabled,
+    onBlur: handleFocusState,
+    onChange: handleChange,
+    onFocus: handleFocusState,
+    ref: forwardedRef,
+    style: [styles.nativeControl, styles.cursorInherit],
+    type: 'checkbox',
+    role: 'switch'
+  });
+  return /*#__PURE__*/React.createElement(View, _extends({}, other, {
+    style: rootStyle
+  }), /*#__PURE__*/React.createElement(View, {
+    style: trackStyle
+  }), /*#__PURE__*/React.createElement(View, {
+    ref: thumbRef,
+    style: thumbStyle
+  }), nativeControl);
+});
+Switch.displayName = 'Switch';
+var styles = StyleSheet.create({
+  root: {
+    cursor: 'pointer',
+    userSelect: 'none'
+  },
+  cursorDefault: {
+    cursor: 'default'
+  },
+  cursorInherit: {
+    cursor: 'inherit'
+  },
+  track: _objectSpread(_objectSpread({
+    forcedColorAdjust: 'none'
+  }, StyleSheet.absoluteFillObject), {}, {
+    height: '70%',
+    margin: 'auto',
+    transitionDuration: '0.1s',
+    width: '100%'
+  }),
+  thumb: {
+    forcedColorAdjust: 'none',
+    alignSelf: 'flex-start',
+    borderRadius: '100%',
+    boxShadow: thumbDefaultBoxShadow,
+    start: '0%',
+    transform: 'translateZ(0)',
+    transitionDuration: '0.1s'
+  },
+  thumbActive: {
+    insetInlineStart: '100%'
+  },
+  nativeControl: _objectSpread(_objectSpread({}, StyleSheet.absoluteFillObject), {}, {
+    height: '100%',
+    margin: 0,
+    appearance: 'none',
+    padding: 0,
+    width: '100%'
+  })
+});
+export default Switch;

package/dist/exports/Switch/index.js.flow

@@ -0,0 +1,187 @@
+/**
+ * Copyright (c) Nicolas Gallagher.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ */
+
+'use client';
+
+import type { ColorValue } from '../../types';
+import type { ViewProps } from '../View';
+import * as React from 'react';
+import createElement from '../createElement';
+import multiplyStyleLengthValue from '../../modules/multiplyStyleLengthValue';
+import StyleSheet from '../StyleSheet';
+import View from '../View';
+type SwitchProps = {
+  ...ViewProps,
+  activeThumbColor?: ColorValue,
+  activeTrackColor?: ColorValue,
+  disabled?: boolean,
+  onValueChange?: (e: any) => void,
+  thumbColor?: ColorValue,
+  trackColor?: ColorValue | {|
+    false: ColorValue,
+    true: ColorValue,
+  |},
+  value?: boolean,
+};
+const emptyObject = {};
+const thumbDefaultBoxShadow = '0px 1px 3px rgba(0,0,0,0.5)';
+const thumbFocusedBoxShadow = `${thumbDefaultBoxShadow}, 0 0 0 10px rgba(0,0,0,0.1)`;
+const defaultActiveTrackColor = '#A3D3CF';
+const defaultTrackColor = '#939393';
+const defaultDisabledTrackColor = '#D5D5D5';
+const defaultActiveThumbColor = '#009688';
+const defaultThumbColor = '#FAFAFA';
+const defaultDisabledThumbColor = '#BDBDBD';
+const Switch: React.AbstractComponent<SwitchProps, React.ElementRef<typeof View>> = React.forwardRef((props, forwardedRef) => {
+  const {
+    'aria-label': ariaLabel,
+    accessibilityLabel,
+    activeThumbColor,
+    activeTrackColor,
+    disabled = false,
+    onValueChange,
+    style = emptyObject,
+    thumbColor,
+    trackColor,
+    value = false,
+    ...other
+  } = props;
+  const thumbRef = React.useRef(null);
+  declare function handleChange(event: Object): any;
+  declare function handleFocusState(event: Object): any;
+  const {
+    height: styleHeight,
+    width: styleWidth
+  } = StyleSheet.flatten(style);
+  const height = styleHeight || '20px';
+  const minWidth = multiplyStyleLengthValue(height, 2);
+  const width = styleWidth > minWidth ? styleWidth : minWidth;
+  const trackBorderRadius = multiplyStyleLengthValue(height, 0.5);
+  const trackCurrentColor = function () {
+    if (value === true) {
+      if (trackColor != null && typeof trackColor === 'object') {
+        return trackColor.true;
+      } else {
+        return activeTrackColor ?? defaultActiveTrackColor;
+      }
+    } else {
+      if (trackColor != null && typeof trackColor === 'object') {
+        return trackColor.false;
+      } else {
+        return trackColor ?? defaultTrackColor;
+      }
+    }
+  }();
+  const thumbCurrentColor = value ? activeThumbColor ?? defaultActiveThumbColor : thumbColor ?? defaultThumbColor;
+  const thumbHeight = height;
+  const thumbWidth = thumbHeight;
+  const rootStyle = [styles.root, style, disabled && styles.cursorDefault, {
+    height,
+    width
+  }];
+  const disabledTrackColor = function () {
+    if (value === true) {
+      if (typeof activeTrackColor === 'string' && activeTrackColor != null || typeof trackColor === 'object' && trackColor?.true) {
+        return trackCurrentColor;
+      } else {
+        return defaultDisabledTrackColor;
+      }
+    } else {
+      if (typeof trackColor === 'string' && trackColor != null || typeof trackColor === 'object' && trackColor?.false) {
+        return trackCurrentColor;
+      } else {
+        return defaultDisabledTrackColor;
+      }
+    }
+  }();
+  const disabledThumbColor = function () {
+    if (value === true) {
+      if (activeThumbColor == null) {
+        return defaultDisabledThumbColor;
+      } else {
+        return thumbCurrentColor;
+      }
+    } else {
+      if (thumbColor == null) {
+        return defaultDisabledThumbColor;
+      } else {
+        return thumbCurrentColor;
+      }
+    }
+  }();
+  const trackStyle = [styles.track, {
+    backgroundColor: disabled ? disabledTrackColor : trackCurrentColor,
+    borderRadius: trackBorderRadius
+  }];
+  const thumbStyle = [styles.thumb, value && styles.thumbActive, {
+    backgroundColor: disabled ? disabledThumbColor : thumbCurrentColor,
+    height: thumbHeight,
+    marginStart: value ? multiplyStyleLengthValue(thumbWidth, -1) : 0,
+    width: thumbWidth
+  }];
+  const nativeControl = createElement('input', {
+    'aria-label': ariaLabel || accessibilityLabel,
+    checked: value,
+    disabled: disabled,
+    onBlur: handleFocusState,
+    onChange: handleChange,
+    onFocus: handleFocusState,
+    ref: forwardedRef,
+    style: [styles.nativeControl, styles.cursorInherit],
+    type: 'checkbox',
+    role: 'switch'
+  });
+  return <View {...other} style={rootStyle}>
+      <View style={trackStyle} />
+      <View ref={thumbRef} style={thumbStyle} />
+      {nativeControl}
+    </View>;
+});
+Switch.displayName = 'Switch';
+const styles = StyleSheet.create({
+  root: {
+    cursor: 'pointer',
+    userSelect: 'none'
+  },
+  cursorDefault: {
+    cursor: 'default'
+  },
+  cursorInherit: {
+    cursor: 'inherit'
+  },
+  track: {
+    forcedColorAdjust: 'none',
+    ...StyleSheet.absoluteFillObject,
+    height: '70%',
+    margin: 'auto',
+    transitionDuration: '0.1s',
+    width: '100%'
+  },
+  thumb: {
+    forcedColorAdjust: 'none',
+    alignSelf: 'flex-start',
+    borderRadius: '100%',
+    boxShadow: thumbDefaultBoxShadow,
+    start: '0%',
+    transform: 'translateZ(0)',
+    transitionDuration: '0.1s'
+  },
+  thumbActive: {
+    insetInlineStart: '100%'
+  },
+  nativeControl: {
+    ...StyleSheet.absoluteFillObject,
+    height: '100%',
+    margin: 0,
+    appearance: 'none',
+    padding: 0,
+    width: '100%'
+  }
+});
+export default Switch;

package/dist/exports/TV/NativeTVNavigationEventEmitter.js

@@ -0,0 +1,103 @@
+import RCTDeviceEventEmitter from '../../vendor/react-native/EventEmitter/RCTDeviceEventEmitter';
+var EVENT_NAME = 'onHWKeyEvent';
+var mapToHWEvent = event => {
+  var _window;
+  var eventType;
+  switch (event.key) {
+    case 'ArrowUp':
+      eventType = 'up';
+      break;
+    case 'ArrowDown':
+      eventType = 'down';
+      break;
+    case 'ArrowLeft':
+      eventType = 'left';
+      break;
+    case 'ArrowRight':
+      eventType = 'right';
+      break;
+    case 'Enter':
+      eventType = 'select';
+      break;
+    default:
+      // Detect user configured Menu key for Web TV platforms through window.appConfig.keyMap.Menu
+      if (typeof window !== 'undefined' && ((_window = window) == null || (_window = _window.appConfig) == null || (_window = _window.keyMap) == null ? void 0 : _window['Menu']) === event.keyCode) {
+        eventType = 'menu';
+      } else {
+        eventType = event.key;
+      }
+  }
+  return {
+    eventType
+  };
+};
+var NativeTVNavigationEventEmitter = {
+  _listenerCount: 0,
+  _keydownHandler: null,
+  _onFocusHandler: null,
+  _onBlurHandler: null,
+  addListener(eventType) {
+    if (eventType !== EVENT_NAME) {
+      return;
+    }
+    if (this._listenerCount === 0) {
+      this._attachKeyboardListener();
+    }
+    this._listenerCount += 1;
+  },
+  removeListeners(count) {
+    if (this._listenerCount === 0) {
+      return;
+    }
+    this._listenerCount = Math.max(0, this._listenerCount - count);
+    if (this._listenerCount === 0) {
+      this._detachKeyboardListener();
+    }
+  },
+  _attachKeyboardListener() {
+    if (typeof window === 'undefined') {
+      return;
+    }
+    if (this._keydownHandler) {
+      return;
+    }
+    this._keydownHandler = e => {
+      var hwEvent = mapToHWEvent(e);
+      RCTDeviceEventEmitter.emit(EVENT_NAME, hwEvent);
+    };
+    window.addEventListener('keydown', this._keydownHandler);
+    if (typeof document !== 'undefined') {
+      // Use capture phase to catch per-element focus/blur once at the top.
+      this._onFocusHandler = e => {
+        RCTDeviceEventEmitter.emit(EVENT_NAME, {
+          eventType: 'focus',
+          tag: e.target
+        });
+      };
+      this._onBlurHandler = e => {
+        RCTDeviceEventEmitter.emit(EVENT_NAME, {
+          eventType: 'blur',
+          tag: e.target
+        });
+      };
+      document.addEventListener('focus', this._onFocusHandler, true);
+      document.addEventListener('blur', this._onBlurHandler, true);
+    }
+  },
+  _detachKeyboardListener() {
+    if (!this._keydownHandler) {
+      return;
+    }
+    window.removeEventListener('keydown', this._keydownHandler);
+    this._keydownHandler = null;
+    if (this._onBlurHandler && typeof document !== 'undefined') {
+      document.removeEventListener('blur', this._onBlurHandler, true);
+    }
+    if (this._onFocusHandler && typeof document !== 'undefined') {
+      document.removeEventListener('focus', this._onFocusHandler, true);
+    }
+    this._onBlurHandler = null;
+    this._onFocusHandler = null;
+  }
+};
+export default NativeTVNavigationEventEmitter;

package/dist/exports/TV/NativeTVNavigationEventEmitter.js.flow

@@ -0,0 +1,89 @@
+/**
+ * @flow
+ */
+
+import RCTDeviceEventEmitter from '../../vendor/react-native/EventEmitter/RCTDeviceEventEmitter';
+type HWEvent = {
+  eventType: 'up' | 'down' | 'right' | 'left' | 'longUp' | 'longDown' | 'longRight' | 'longLeft' | 'blur' | 'focus' | 'pan' | string,
+  eventKeyAction?: -1 | 1 | 0 | number,
+  tag?: number,
+  body?: {
+    state: 'Began' | 'Changed' | 'Ended',
+    x: number,
+    y: number,
+    velocityX: number,
+    velocityY: number,
+  },
+};
+const EVENT_NAME = 'onHWKeyEvent';
+declare var mapToHWEvent: (event: KeyboardEvent) => HWEvent;
+const NativeTVNavigationEventEmitter = {
+  _listenerCount: 0,
+  _keydownHandler: (null: null | ((e: KeyboardEvent) => void)),
+  _onFocusHandler: (null: null | ((e: FocusEvent) => void)),
+  _onBlurHandler: (null: null | ((e: FocusEvent) => void)),
+  addListener(eventType: string) {
+    if (eventType !== EVENT_NAME) {
+      return;
+    }
+    if (this._listenerCount === 0) {
+      this._attachKeyboardListener();
+    }
+    this._listenerCount += 1;
+  },
+  removeListeners(count: number) {
+    if (this._listenerCount === 0) {
+      return;
+    }
+    this._listenerCount = Math.max(0, this._listenerCount - count);
+    if (this._listenerCount === 0) {
+      this._detachKeyboardListener();
+    }
+  },
+  _attachKeyboardListener() {
+    if (typeof window === 'undefined') {
+      return;
+    }
+    if (this._keydownHandler) {
+      return;
+    }
+    this._keydownHandler = (e: KeyboardEvent) => {
+      const hwEvent = mapToHWEvent(e);
+      RCTDeviceEventEmitter.emit(EVENT_NAME, hwEvent);
+    };
+    window.addEventListener('keydown', this._keydownHandler);
+    if (typeof document !== 'undefined') {
+      // Use capture phase to catch per-element focus/blur once at the top.
+      this._onFocusHandler = (e: FocusEvent) => {
+        RCTDeviceEventEmitter.emit(EVENT_NAME, {
+          eventType: 'focus',
+          tag: e.target
+        });
+      };
+      this._onBlurHandler = (e: FocusEvent) => {
+        RCTDeviceEventEmitter.emit(EVENT_NAME, {
+          eventType: 'blur',
+          tag: e.target
+        });
+      };
+      document.addEventListener('focus', this._onFocusHandler, true);
+      document.addEventListener('blur', this._onBlurHandler, true);
+    }
+  },
+  _detachKeyboardListener() {
+    if (!this._keydownHandler) {
+      return;
+    }
+    window.removeEventListener('keydown', this._keydownHandler);
+    this._keydownHandler = null;
+    if (this._onBlurHandler && typeof document !== 'undefined') {
+      document.removeEventListener('blur', this._onBlurHandler, true);
+    }
+    if (this._onFocusHandler && typeof document !== 'undefined') {
+      document.removeEventListener('focus', this._onFocusHandler, true);
+    }
+    this._onBlurHandler = null;
+    this._onFocusHandler = null;
+  }
+};
+export default NativeTVNavigationEventEmitter;

package/dist/exports/TV/TVEventControl.js

@@ -0,0 +1,44 @@
+/**
+ * Methods to enable and disable listening for specific OS TV remote events (menu key, pan gesture)
+ *
+ * @format
+ * 
+ */
+
+'use strict';
+
+// import NativeTVNavigationEventEmitter from '../../../src/private/specs_DEPRECATED/modules/NativeTVNavigationEventEmitter';
+// import Platform from '../Platform';
+var TVEventControl = {
+  enableTVMenuKey: () => {
+    console.warn('TVEventControl.enableTVMenuKey() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.enableTVMenuKey();
+  },
+  disableTVMenuKey: () => {
+    console.warn('TVEventControl.disableTVMenuKey() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.disableTVMenuKey();
+  },
+  enableTVPanGesture: () => {
+    console.warn('TVEventControl.enableTVPanGesture() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.enableTVPanGesture();
+  },
+  disableTVPanGesture: () => {
+    console.warn('TVEventControl.disableTVPanGesture() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.disableTVPanGesture();
+  },
+  enableGestureHandlersCancelTouches: () => {
+    console.warn('TVEventControl.enableGestureHandlersCancelTouches() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.enableGestureHandlersCancelTouches();
+  },
+  disableGestureHandlersCancelTouches: () => {
+    console.warn('TVEventControl.disableGestureHandlersCancelTouches() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.disableGestureHandlersCancelTouches();
+  }
+};
+export default TVEventControl;

package/dist/exports/TV/TVEventControl.js.flow

@@ -0,0 +1,44 @@
+/**
+ * Methods to enable and disable listening for specific OS TV remote events (menu key, pan gesture)
+ *
+ * @format
+ * @flow
+ */
+
+'use strict';
+
+// import NativeTVNavigationEventEmitter from '../../../src/private/specs_DEPRECATED/modules/NativeTVNavigationEventEmitter';
+// import Platform from '../Platform';
+const TVEventControl = {
+  enableTVMenuKey: () => {
+    console.warn('TVEventControl.enableTVMenuKey() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.enableTVMenuKey();
+  },
+  disableTVMenuKey: () => {
+    console.warn('TVEventControl.disableTVMenuKey() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.disableTVMenuKey();
+  },
+  enableTVPanGesture: () => {
+    console.warn('TVEventControl.enableTVPanGesture() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.enableTVPanGesture();
+  },
+  disableTVPanGesture: () => {
+    console.warn('TVEventControl.disableTVPanGesture() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.disableTVPanGesture();
+  },
+  enableGestureHandlersCancelTouches: () => {
+    console.warn('TVEventControl.enableGestureHandlersCancelTouches() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.enableGestureHandlersCancelTouches();
+  },
+  disableGestureHandlersCancelTouches: () => {
+    console.warn('TVEventControl.disableGestureHandlersCancelTouches() is not implemented on web.');
+    // Platform.isTV && NativeTVNavigationEventEmitter &&
+    //   NativeTVNavigationEventEmitter.disableGestureHandlersCancelTouches();
+  }
+};
+export default TVEventControl;

package/dist/exports/TV/TVEventHandler.js

@@ -0,0 +1,37 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * 
+ */
+
+'use strict';
+
+import NativeTVNavigationEventEmitter from './NativeTVNavigationEventEmitter';
+import NativeEventEmitter from '../NativeEventEmitter';
+import Platform from '../Platform';
+var __nativeTVNavigationEventEmitter = null;
+var TVEventHandler = {
+  addListener: callback => {
+    if (Platform.OS === 'ios' && !NativeTVNavigationEventEmitter) {
+      return {
+        remove: () => {}
+      };
+    }
+    if (!__nativeTVNavigationEventEmitter) {
+      __nativeTVNavigationEventEmitter = new NativeEventEmitter(NativeTVNavigationEventEmitter);
+    }
+    var subscription = __nativeTVNavigationEventEmitter.addListener(
+    // $FlowFixMe[prop-missing]
+    'onHWKeyEvent', data => {
+      if (callback) {
+        callback(data);
+      }
+    });
+    return subscription;
+  }
+};
+export default TVEventHandler;