@theoplayer/react-native-ui/lib/module/ui/components/focus/AutoFocusGuide.js

A React Native UI for @theoplayer/react-native

import React from 'react';
import * as ReactNative from 'react-native';
import { Platform } from 'react-native';
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
const FOCUS_GUIDE_STYLE = {
  width: '100%',
  justifyContent: 'center',
  alignItems: 'center'
};

// Make sure we just warn once for all component instances, in case the TVFocusGuideView is missing.
let hasWarnedAboutTVFocusGuideView = false;

/**
 * A TV platform FocusGuide with autofocus capabilities
 */
export const AutoFocusGuide = props => {
  const {
    style,
    children
  } = props;
  if (Platform.OS === 'ios' && Platform.isTV) {
    if (ReactNative.TVFocusGuideView) {
      return /*#__PURE__*/_jsx(ReactNative.TVFocusGuideView, {
        style: [FOCUS_GUIDE_STYLE, style],
        autoFocus: true,
        children: children
      });
    }
    if (!hasWarnedAboutTVFocusGuideView) {
      console.warn('TVFocusGuideView not supported, a dependency on react-native-tvos is required.');
      hasWarnedAboutTVFocusGuideView = true;
    }
  }
  return /*#__PURE__*/_jsx(_Fragment, {
    children: children
  });
};
//# sourceMappingURL=AutoFocusGuide.js.map