"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _reactNative = require("react-native");
var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
var _vectorIcons = require("@expo/vector-icons");
var _Avatar = _interopRequireDefault(require("../../components/Avatar"));
var _useI18n = require("../../hooks/useI18n");
var _GroupedPillButtons = _interopRequireDefault(require("../../components/internal/GroupedPillButtons"));
var _TextField = _interopRequireDefault(require("../../components/internal/TextField"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const SignInPasswordStep = ({
  styles,
  fadeAnim,
  slideAnim,
  scaleAnim,
  colors,
  userProfile,
  username,
  theme,
  logoAnim,
  errorMessage,
  isInputFocused,
  password,
  showPassword,
  handleInputFocus,
  handleInputBlur,
  handlePasswordChange,
  handleSignIn: parentHandleSignIn,
  isLoading,
  prevStep,
  navigate
}) => {
  const inputRef = (0, _react.useRef)(null);
  const {
    t
  } = (0, _useI18n.useI18n)();

  // Animated styles - properly memoized to prevent re-renders
  const containerAnimatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
    return {
      opacity: fadeAnim.value,
      transform: [{
        translateX: slideAnim.value
      }, {
        scale: scaleAnim.value
      }]
    };
  });
  const logoAnimatedStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => {
    return {
      transform: [{
        scale: logoAnim.value
      }]
    };
  });

  // Focus password input on error or when step becomes active
  (0, _react.useEffect)(() => {
    if (errorMessage) {
      setTimeout(() => {
        inputRef.current?.focus();
      }, 0);
    }
  }, [errorMessage]);
  const handleSignIn = (0, _react.useCallback)(() => {
    if (!password || errorMessage) {
      setTimeout(() => {
        inputRef.current?.focus();
      }, 0);
    }
    parentHandleSignIn();
  }, [password, errorMessage, parentHandleSignIn]);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
    style: [styles.stepContainer, containerAnimatedStyle],
    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: styles.modernUserProfileContainer,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNativeReanimated.default.View, {
        style: [styles.avatarContainer, logoAnimatedStyle],
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.default, {
          name: userProfile?.displayName || userProfile?.name || username,
          size: 100,
          theme: theme,
          style: styles.modernUserAvatar,
          backgroundColor: colors.primary + '20'
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
          style: [styles.statusIndicator, {
            backgroundColor: colors.primary
          }]
        })]
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        style: [styles.modernUserDisplayName, {
          color: colors.text
        }],
        children: userProfile?.displayName || userProfile?.name || username
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
        style: [styles.modernUsernameSubtext, {
          color: colors.secondaryText
        }],
        children: ["@", username]
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: styles.modernInputContainer,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
        ref: inputRef,
        label: t('common.labels.password'),
        leading: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
          name: "lock-closed-outline",
          size: 24,
          color: colors.secondaryText
        }),
        value: password,
        onChangeText: handlePasswordChange,
        onFocus: handleInputFocus,
        onBlur: handleInputBlur,
        secureTextEntry: !showPassword,
        autoCapitalize: "none",
        autoCorrect: false,
        testID: "password-input",
        variant: "filled",
        error: errorMessage || undefined,
        onSubmitEditing: handleSignIn,
        autoFocus: true
      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
        style: {
          flexDirection: 'row',
          alignItems: 'center',
          marginBottom: 16
        },
        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Text, {
          style: [styles.footerText, {
            color: colors.text
          }],
          children: [t('signin.forgotPrompt') || 'Forgot your password?', " "]
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
          onPress: () => navigate('RecoverAccount', {
            returnTo: 'SignIn',
            returnStep: 1,
            returnData: {
              username,
              userProfile
            }
          }),
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
            style: [styles.modernLinkText, {
              color: colors.primary
            }],
            children: t('common.links.recoverAccount')
          })
        })]
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_GroupedPillButtons.default, {
      buttons: [{
        text: t('common.actions.back'),
        onPress: prevStep,
        icon: 'arrow-back',
        variant: 'transparent'
      }, {
        text: t('common.actions.signIn'),
        onPress: handleSignIn,
        icon: 'log-in',
        variant: 'primary',
        loading: isLoading,
        testID: 'login-button'
      }],
      colors: colors
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: styles.securityNotice,
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
        name: "shield-checkmark",
        size: 14,
        color: colors.secondaryText
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
        style: [styles.securityText, {
          color: colors.secondaryText
        }],
        children: t('signin.security.dataSecure') || 'Your data is encrypted and secure'
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.StatusBar, {
      barStyle: theme === 'dark' ? 'light-content' : 'dark-content',
      backgroundColor: colors.background
    })]
  });
};
var _default = exports.default = SignInPasswordStep;
//# sourceMappingURL=SignInPasswordStep.js.map