// Metro module 14769 (f14770).
import { View } from "react-native";
import { SELECT_NAMES } from "../../MFAConstants";
import { createStyles } from "../../../../design/components/Styles/native/createStyles";
import { NAV_BAR_HEIGHT, STATUS_BAR_HEIGHT } from "../../../../design/components/Navigator/native/NavigatorConstants.native";
import { RowButton } from "../../../../design/components/TableRow/native/RowButton.native";
import useWideAuthView from "../../../auth/native/useWideAuthView";
import { useNavigation } from "../../../../design/components/Navigator/native/useNavigation.native";
import { SafeAreaPaddingView } from "../../../../components_native/common/SafeAreaView";
import { Text } from "../../../../design/components/Text/native/Text";
import { intl, t } from "../../../../intl/index.native";
const useStyles = createStyles((a0) => ({
  container: {
    marginLeft: 16,
    marginRight: 16
  },
  selectContainer: {
    marginTop: a0 ? NAV_BAR_HEIGHT : NAV_BAR_HEIGHT - STATUS_BAR_HEIGHT,
    marginLeft: 16,
    marginRight: 16,
    display: "flex",
    alignItems: "center"
  }
}));
export default function SelectScreen(props) {
  let c21328_0 = props;
  const wideAuthView = useWideAuthView();
  const styles = useStyles(wideAuthView);
  const navigation = useNavigation();
  return <SafeAreaPaddingView top={!wideAuthView} style={styles.container}>
    <View style={styles.selectContainer}>
      <Text variant="heading-xl/extrabold">
        {intl.string(t.S9b9bX)}
      </Text>
      <Text variant="text-sm/medium">
        {intl.string(t.Jz1lXO)}
      </Text>
    </View>
    <View style={{
      marginTop: 16,
      gap: 8
    }}>
      {props.mfaChallenge.methods.map((method) => {
        let c27797_0 = c21328_0;
        const navigation2 = navigation;
        return <RowButton key={method.type} label={SELECT_NAMES[method.type]} onPress={() => {
          navigation2.push(method.type, c27797_0);
        }} />;
      })}
    </View>
  </SafeAreaPaddingView>;
};