react-native-external-keyboard/lib/module/components/BaseKeyboardView/BaseKeyboardView.js

Toolkit for improving physical keyboard support in React Native

function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React, { useEffect, useImperativeHandle, useMemo, useRef } from 'react';
import { Platform } from 'react-native';
import { ExternalKeyboardViewNative } from '../../nativeSpec';
import { Commands } from '../../nativeSpec/ExternalKeyboardViewNativeComponent';
import { LockFocusEnum } from '../../types/BaseKeyboardView';
import { KeyPressContext } from '../../context/BubbledKeyPressContext';
import { useBubbledInfo } from './BaseKeyboardView.hooks';
import { useGroupIdentifierContext } from '../../context/GroupIdentifierContext';
import { useOnFocusChange } from '../../utils/useOnFocusChange';
import { useOrderFocusGroup } from '../../context/OrderFocusContext';
const isIOS = Platform.OS === 'ios';
const DEFAULT_EXPOSE_METHODS = ['blur', 'measure', 'measureInWindow', 'measureLayout', 'setNativeProps'];
var BITS = /*#__PURE__*/function (BITS) {
  BITS[BITS["BIT_01"] = 1] = "BIT_01";
  BITS[BITS["BIT_02"] = 2] = "BIT_02";
  BITS[BITS["BIT_03"] = 4] = "BIT_03";
  BITS[BITS["BIT_04"] = 8] = "BIT_04";
  BITS[BITS["BIT_05"] = 16] = "BIT_05";
  BITS[BITS["BIT_06"] = 32] = "BIT_06";
  BITS[BITS["BIT_07"] = 64] = "BIT_07";
  BITS[BITS["BIT_08"] = 128] = "BIT_08";
  BITS[BITS["BIT_09"] = 256] = "BIT_09";
  BITS[BITS["BIT_10"] = 512] = "BIT_10";
  return BITS;
}(BITS || {});
const focusBinaryValue = {
  [LockFocusEnum.Up]: BITS.BIT_01,
  [LockFocusEnum.Down]: BITS.BIT_02,
  [LockFocusEnum.Left]: BITS.BIT_03,
  [LockFocusEnum.Right]: BITS.BIT_04,
  [LockFocusEnum.Forward]: BITS.BIT_05,
  [LockFocusEnum.Backward]: BITS.BIT_06,
  [LockFocusEnum.First]: BITS.BIT_09,
  [LockFocusEnum.Last]: BITS.BIT_10
};
const mapFocusValues = values => {
  if (!values || !values.length) return 0;

  // eslint-disable-next-line no-bitwise
  return values.reduce((acc, item) => acc | focusBinaryValue[item], 0);
};
export const BaseKeyboardView = /*#__PURE__*/React.memo(/*#__PURE__*/React.forwardRef(({
  onFocusChange,
  onKeyUpPress,
  onKeyDownPress,
  onBubbledContextMenuPress,
  haloEffect,
  autoFocus,
  canBeFocused = true,
  focusable = true,
  group = false,
  onFocus,
  onBlur,
  viewRef,
  groupIdentifier,
  tintColor,
  ignoreGroupFocusHint,
  exposeMethods = DEFAULT_EXPOSE_METHODS,
  enableA11yFocus = false,
  screenAutoA11yFocusDelay = 500,
  lockFocus,
  orderIndex,
  orderForward,
  orderBackward,
  orderFirst,
  orderLast,
  orderGroup,
  ...props
}, ref) => {
  const localRef = useRef();
  const targetRef = viewRef ?? localRef;
  const lockFocusValue = useMemo(() => mapFocusValues(lockFocus), [lockFocus]);
  const contextIdentifier = useGroupIdentifierContext();
  const contextGroupId = useOrderFocusGroup();
  const groupId = orderGroup ?? contextGroupId;
  useEffect(() => {
    if (orderIndex !== undefined && !groupId) console.warn('`orderIndex` must be declared alongside `orderGroup` for proper functionality. Ensure components are wrapped with `KeyboardOrderFocusGroup` or provide `orderGroup` directly.');
  }, [groupId, orderIndex]);
  useImperativeHandle(ref, () => {
    const actions = {};
    exposeMethods.forEach(method => {
      actions[method] = (...args) => {
        var _componentActions$met;
        const componentActions = targetRef === null || targetRef === void 0 ? void 0 : targetRef.current;
        return componentActions === null || componentActions === void 0 || (_componentActions$met = componentActions[method]) === null || _componentActions$met === void 0 ? void 0 : _componentActions$met.call(componentActions, ...args);
      };
    });
    actions.focus = () => {
      if (targetRef !== null && targetRef !== void 0 && targetRef.current) {
        Commands.focus(targetRef.current);
      }
    };
    return actions;
  }, [exposeMethods, targetRef]);
  const bubbled = useBubbledInfo(onBubbledContextMenuPress);
  const onFocusChangeHandler = useOnFocusChange({
    onFocusChange,
    onFocus,
    onBlur
  });
  const hasOnFocusChanged = onFocusChange || onFocus || onBlur;
  const ignoreFocusHint = Platform.OS !== 'ios' || !ignoreGroupFocusHint;
  const _orderFirst = orderFirst === null ? undefined : orderFirst ?? orderForward;
  const _orderLast = orderLast === null ? undefined : orderLast ?? orderBackward;
  return /*#__PURE__*/React.createElement(KeyPressContext.Provider, {
    value: bubbled.context
  }, /*#__PURE__*/React.createElement(ExternalKeyboardViewNative, _extends({}, props, {
    haloEffect: haloEffect ?? true,
    ref: targetRef,
    canBeFocused: ignoreFocusHint && focusable && canBeFocused,
    autoFocus: autoFocus,
    onKeyDownPress: onKeyDownPress //ToDo update types
    ,
    onKeyUpPress: onKeyUpPress //ToDo update types
    ,
    onBubbledContextMenuPress: bubbled.contextMenu,
    groupIdentifier: groupIdentifier ?? contextIdentifier,
    tintColor: isIOS ? tintColor : undefined,
    onFocusChange: hasOnFocusChanged && onFocusChangeHandler //ToDo update types
    ,
    hasKeyDownPress: Boolean(onKeyDownPress),
    hasKeyUpPress: Boolean(onKeyUpPress),
    hasOnFocusChanged: Boolean(hasOnFocusChanged),
    group: group,
    orderIndex: orderIndex ?? -1,
    enableA11yFocus: enableA11yFocus,
    screenAutoA11yFocusDelay: screenAutoA11yFocusDelay,
    lockFocus: lockFocusValue,
    orderForward: orderForward,
    orderBackward: orderBackward,
    orderFirst: _orderFirst,
    orderLast: _orderLast,
    orderGroup: groupId
  })));
}));
//# sourceMappingURL=BaseKeyboardView.js.map