@onairos/react-native 3.1.18 → 3.2.1

package/src/components/SignInStep.tsx

@@ -1,217 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import {
-  View,
-  Text,
-  StyleSheet,
-  KeyboardAvoidingView,
-  Platform,
-  Keyboard,
-  Animated,
-} from 'react-native';
-import { COLORS, SPACING, TEXT_STYLES } from '../theme';
-import EmailInput from './EmailInput';
-import GoogleButton from './GoogleButton';
-import PrimaryButton from './PrimaryButton';
-
-interface SignInStepProps {
-  onEmailSubmit: (email: string) => void;
-  onGoogleSignIn: () => void;
-  onContinue: () => void;
-  loading?: boolean;
-  error?: string;
-}
-
-const SignInStep: React.FC<SignInStepProps> = ({
-  onEmailSubmit,
-  onGoogleSignIn,
-  onContinue,
-  loading = false,
-  error = '',
-}) => {
-  const [email, setEmail] = useState('');
-  const [keyboardVisible, setKeyboardVisible] = useState(false);
-
-  const handleEmailSubmit = () => {
-    // Check for reviewer bypass first
-    if (email.toLowerCase().trim() === 'reviewer') {
-      console.log('🔍 Reviewer bypass detected in new UI');
-      // Call onEmailSubmit with a special reviewer email that the parent can recognize
-      onEmailSubmit('reviewer@bypass.com');
-      return;
-    }
-    
-    if (email.trim()) {
-      onEmailSubmit(email.trim());
-    }
-  };
-
-  useEffect(() => {
-    const keyboardDidShowListener = Keyboard.addListener(
-      'keyboardDidShow',
-      () => setKeyboardVisible(true)
-    );
-    const keyboardDidHideListener = Keyboard.addListener(
-      'keyboardDidHide',
-      () => setKeyboardVisible(false)
-    );
-
-    return () => {
-      keyboardDidHideListener?.remove();
-      keyboardDidShowListener?.remove();
-    };
-  }, []);
-
-  return (
-    <KeyboardAvoidingView 
-      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-      style={styles.container}
-    >
-      <View style={styles.content}>
-        {/* Heading */}
-        <View style={styles.headingContainer}>
-          <Text style={styles.title}>Build your Onairos persona to own your digital identity</Text>
-          <Text style={styles.subtitle}>Sign in or create an account</Text>
-        </View>
-
-        {/* Email Input */}
-        <View style={styles.inputContainer}>
-          <EmailInput
-            value={email}
-            onChangeText={setEmail}
-            onSubmitEditing={handleEmailSubmit}
-            returnKeyType="done"
-            blurOnSubmit={true}
-          />
-          {error ? (
-            <Text style={styles.errorText}>{error}</Text>
-          ) : null}
-        </View>
-
-        {/* Divider */}
-        <View style={styles.dividerContainer}>
-          <View style={styles.dividerLine} />
-          <Text style={styles.dividerText}>Or</Text>
-          <View style={styles.dividerLine} />
-        </View>
-
-        {/* Google Button */}
-        <View style={styles.googleContainer}>
-          <GoogleButton
-            onPress={onGoogleSignIn}
-            disabled={loading}
-          />
-        </View>
-
-        {/* Spacer */}
-        <View style={styles.spacer} />
-
-        {/* Continue Button */}
-        <View style={styles.continueContainer}>
-          <PrimaryButton
-            label="Continue"
-            onPress={() => {
-              if (email.trim()) {
-                onEmailSubmit(email.trim());
-              }
-            }}
-            disabled={loading || !email.trim()}
-            loading={loading}
-          />
-        </View>
-      </View>
-    </KeyboardAvoidingView>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-  
-  content: {
-    flex: 1,
-    paddingTop: 8, // Much smaller top padding to move headline higher
-    paddingHorizontal: 0, // No horizontal padding - let children control their own spacing
-  },
-  
-  headingContainer: {
-    width: '100%', // Fill sheet width
-    marginBottom: 22, // Further reduced spacing to bring subtitle closer to email input
-    paddingHorizontal: 0, // No padding at all - text goes to absolute edges
-    // Removed alignItems: 'center' - no centering
-  },
-  
-  title: {
-    fontFamily: 'IBM Plex Sans',
-    fontWeight: '700',
-    fontSize: 24,
-    lineHeight: 32,
-    color: COLORS.grey800,
-    textAlign: 'left', // Left-aligned as specified
-    marginBottom: SPACING.sm,
-    // No fixed width - let parent's 24px insets define available width (327px on 375pt device)
-    // Removed height constraint to allow natural wrapping
-  },
-  
-  subtitle: {
-    fontFamily: 'Inter',
-    fontWeight: '400',
-    fontSize: 16,
-    lineHeight: 24,
-    color: COLORS.grey600,
-    textAlign: 'left', // Also left-align subtitle for consistency
-  },
-  
-  inputContainer: {
-    marginBottom: 32, // Consistent spacing
-    paddingHorizontal: 0, // Match headline - no padding, full width
-  },
-  
-  dividerContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    marginBottom: 32, // Consistent spacing
-    paddingHorizontal: 0, // Match headline - no padding, full width
-  },
-  
-  dividerLine: {
-    flex: 1,
-    height: 1,
-    backgroundColor: '#E5E5E5',
-  },
-  
-  dividerText: {
-    paddingHorizontal: SPACING.md,
-    fontSize: 14,
-    fontFamily: 'Inter',
-    fontWeight: '400',
-    color: COLORS.grey500,
-  },
-  
-  googleContainer: {
-    marginBottom: SPACING.xl,
-    paddingHorizontal: 0, // Match headline - no padding, full width
-  },
-
-  spacer: {
-    flex: 1,
-    minHeight: 20,
-  },
-
-  continueContainer: {
-    paddingBottom: SPACING.xl,
-    paddingHorizontal: 0, // Match headline - no padding, full width
-  },
-  
-  errorText: {
-    fontSize: 14,
-    fontFamily: 'Inter',
-    fontWeight: '400',
-    color: '#DC3545', // Red color for errors
-    marginTop: 8,
-    textAlign: 'left',
-  },
-});
-
-export { SignInStep };
-export default SignInStep;

package/src/components/VerificationStep.tsx

@@ -1,198 +0,0 @@
-import React, { useState } from 'react';
-import {
-  View,
-  Text,
-  StyleSheet,
-  TouchableOpacity,
-  KeyboardAvoidingView,
-  Platform,
-} from 'react-native';
-import { COLORS, SPACING } from '../theme';
-import CodeInput from './CodeInput';
-import PrimaryButton from './PrimaryButton';
-
-interface VerificationStepProps {
-  email: string;
-  onCodeSubmit: (code: string) => void;
-  onBack: () => void;
-  loading?: boolean;
-  error?: string;
-  onResendCode?: () => void;
-}
-
-const VerificationStep: React.FC<VerificationStepProps> = ({
-  email,
-  onCodeSubmit,
-  onBack,
-  loading = false,
-  error = '',
-  onResendCode,
-}) => {
-  const [code, setCode] = useState('');
-
-  const handleCodeChange = (newCode: string) => {
-    setCode(newCode);
-  };
-
-  const handleContinue = () => {
-    if (code.length === 6) {
-      onCodeSubmit(code);
-    }
-  };
-
-  return (
-    <KeyboardAvoidingView 
-      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-      style={styles.container}
-    >
-      <View style={styles.content}>
-        {/* Heading */}
-        <View style={styles.headingContainer}>
-          <Text style={styles.title}>Enter verification code</Text>
-          <Text style={styles.subtitle}>
-            We've sent a 6-digit code to {email}
-          </Text>
-        </View>
-
-        {/* Code Input */}
-        <View style={styles.codeContainer}>
-          <CodeInput
-            length={6}
-            onCodeChange={handleCodeChange}
-          />
-          {error ? (
-            <Text style={styles.errorText}>{error}</Text>
-          ) : null}
-        </View>
-
-        {/* Continue Button - positioned right below code inputs */}
-        <View style={styles.continueContainer}>
-          <PrimaryButton
-            label="Continue"
-            onPress={handleContinue}
-            disabled={loading || code.length !== 6}
-            loading={loading}
-          />
-        </View>
-
-        {/* Resend Code Link */}
-        {onResendCode && (
-          <View style={styles.resendContainer}>
-            <Text style={styles.resendText}>Didn't receive the code? </Text>
-            <TouchableOpacity 
-              onPress={onResendCode}
-              disabled={loading}
-              style={styles.resendButton}
-            >
-              <Text style={[styles.resendLink, loading && styles.resendLinkDisabled]}>
-                Resend Code
-              </Text>
-            </TouchableOpacity>
-          </View>
-        )}
-
-        {/* Spacer */}
-        <View style={styles.spacer} />
-      </View>
-    </KeyboardAvoidingView>
-  );
-};
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-  },
-  
-  content: {
-    flex: 1,
-    paddingTop: 8,
-    paddingHorizontal: 0,
-  },
-  
-
-  
-  headingContainer: {
-    width: '100%',
-    marginBottom: 40,
-    paddingHorizontal: 0,
-  },
-  
-  title: {
-    fontFamily: 'IBM Plex Sans',
-    fontWeight: '700',
-    fontSize: 24,
-    lineHeight: 32,
-    color: COLORS.grey800,
-    textAlign: 'left',
-    marginBottom: 2,
-  },
-  
-  subtitle: {
-    fontFamily: 'Inter',
-    fontWeight: '400',
-    fontSize: 16,
-    lineHeight: 24,
-    color: COLORS.grey600,
-    textAlign: 'left',
-    marginBottom: 8,
-  },
-  
-  codeContainer: {
-    paddingHorizontal: 16,
-    marginBottom: 24, // Reduced spacing to bring Continue button closer
-  },
-  
-  spacer: {
-    flex: 1,
-    minHeight: 20,
-  },
-  
-  continueContainer: {
-    paddingHorizontal: 0,
-    marginBottom: 24, // Add spacing below Continue button
-  },
-  
-  errorText: {
-    fontSize: 14,
-    fontFamily: 'Inter',
-    fontWeight: '400',
-    color: '#DC3545', // Red color for errors
-    marginTop: 12,
-    textAlign: 'center',
-  },
-  
-  resendContainer: {
-    flexDirection: 'row',
-    justifyContent: 'center',
-    alignItems: 'center',
-    marginTop: 16,
-    paddingHorizontal: 0,
-  },
-  
-  resendText: {
-    fontSize: 14,
-    fontFamily: 'Inter',
-    fontWeight: '400',
-    color: COLORS.grey600,
-  },
-  
-  resendButton: {
-    // No additional padding - let the text handle touch target
-  },
-  
-  resendLink: {
-    fontSize: 14,
-    fontFamily: 'Inter',
-    fontWeight: '500',
-    color: '#D4A536', // Brand color
-    textDecorationLine: 'underline',
-  },
-  
-  resendLinkDisabled: {
-    color: COLORS.grey400,
-    textDecorationLine: 'none',
-  },
-});
-
-export { VerificationStep };
-export default VerificationStep;