"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.NumberPad = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _buttons = require("../buttons");
var _layout = require("../layout");
var _NumberButton = require("./NumberButton");
var _jsxRuntime = require("react/jsx-runtime");
const mapIconSpecByBiometric = {
  FACE_ID: {
    icon: "biomFaceID",
    size: 32
  },
  TOUCH_ID: {
    icon: "fingerprint",
    size: 24
  },
  BIOMETRICS: {
    icon: "fingerprint",
    size: 24
  }
};

/**
 * This component displays a custom numeric keyboard.
 *
 * It accepts an optional `biometricType` prop which enables an extra keyboard button that accepts a `onBiometricPress` prop used to handle the action to be executed when it's pressed.
 * @returns {JSX.Element} The rendered numeric keyboard component.
 */
const NumberPad = ({
  variant = "primary",
  biometricType,
  biometricAccessibilityLabel,
  deleteAccessibilityLabel,
  onNumberPress,
  onBiometricPress,
  onDeletePress
}) => {
  /**
   * Renders the buttons row from a given array.
   */
  // eslint-disable-next-line arrow-body-style
  const renderButtonsRow = (0, _react.useCallback)(row => row.map(item => {
    if (typeof item === "number") {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_NumberButton.NumberButton, {
        number: item,
        onPress: onNumberPress,
        variant: variant
      }, item);
    }
    if (item === "delete") {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ButtonWrapper, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttons.IconButton, {
          icon: "cancel",
          color: variant === "primary" ? "contrast" : "primary",
          onPress: onDeletePress,
          accessibilityLabel: deleteAccessibilityLabel
        })
      }, item);
    }
    if (biometricType && mapIconSpecByBiometric[biometricType]) {
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ButtonWrapper, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_buttons.IconButton, {
          icon: mapIconSpecByBiometric[biometricType].icon,
          iconSize: mapIconSpecByBiometric[biometricType].size,
          color: variant === "primary" ? "contrast" : "primary",
          onPress: onBiometricPress,
          accessibilityLabel: biometricAccessibilityLabel
        })
      }, item);
    }
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
      style: _NumberButton.numberButtonStyles.buttonSize
    }, "emptyElem");
  }), [biometricAccessibilityLabel, biometricType, deleteAccessibilityLabel, onBiometricPress, onDeletePress, onNumberPress, variant]);

  // eslint-disable-next-line arrow-body-style
  const numberPad = (0, _react.useMemo)(() => /*#__PURE__*/(0, _jsxRuntime.jsx)(_layout.VStack, {
    space: 16,
    children: [[1, 2, 3], [4, 5, 6], [7, 8, 9], [biometricType, 0, "delete"]].map((row, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
      style: styles.numberPad,
      children: renderButtonsRow(row)
    }, i))
  }), [biometricType, renderButtonsRow]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_layout.ContentWrapper, {
    children: numberPad
  });
};
exports.NumberPad = NumberPad;
const ButtonWrapper = ({
  children
}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
  style: [_NumberButton.numberButtonStyles.buttonSize, {
    alignItems: "center",
    justifyContent: "center"
  }],
  children: children
});
const styles = _reactNative.StyleSheet.create({
  numberPad: {
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    flexGrow: 1
  }
});
//# sourceMappingURL=NumberPad.js.map