-- CODE language-jsx --
import React from 'react';
import Images from '../config/Images';
import { Button, ScreenContainer, withTheme } from '@draftbit/ui';
import {
 Image,
 KeyboardAvoidingView,
 StyleSheet,
 Text,
 TextInput,
 View,
} from 'react-native';
const REPLACE_SCREEN_NAME = props => {
 const [emailinput, setEmailinput] = React.useState(undefined);
 const [passwordinput, setPasswordinput] = React.useState(undefined);
 const { theme } = props;
 return (
   <ScreenContainer hasSafeArea={true} scrollable={true}>
     <KeyboardAvoidingView
       style={styles.keyboardAvoidingView97}
       behavior=""position""
       enabled={true}
       keyboardVerticalOffset={44}
     >
       <View style={styles.viewKt}>
         <Image
           style={styles.imageVH}
           resizeMode=""contain""
           source={Images.DraftbitIcon}
         />
         <Text
           style={StyleSheet.flatten([
             styles.textXf,
             theme.typography.headline2,
             { color: theme.colors.strong },
           ])}
         >
           Welcome to Draftbit
         </Text>
       </View>
       <View
         style={styles.viewRq}
         pointerEvents={[{ label: '', value: '' }]}
         clickable=""""
       >
         <TextInput
           style={StyleSheet.flatten([
             styles.textInputDq,
             {
               borderColor: theme.colors.divider,
               borderRadius: theme.borderRadius.global,
               color: theme.colors.strong,
               backgroundColor: theme.colors.background,
             },
           ])}
           value={emailinput}
           onChangeText={emailinput => setEmailinput(emailinput)}
           spellcheck={true}
           placeholder=""Email""
           clearTextOnFocus={false}
           enablesReturnKeyAutomatically={true}
           placeholderTextColor={theme.colors.medium}
           clearButtonMode=""while-editing""
           returnKeyType=""next""
           textContentType=""emailaddress""
         />
         <TextInput
           style={StyleSheet.flatten([
             styles.textInput3S,
             {
               color: theme.colors.strong,
               borderColor: theme.colors.divider,
               borderRadius: theme.borderRadius.global,
               backgroundColor: theme.colors.background,
             },
           ])}
           enablesReturnKeyAutomatically={true}
           clearTextOnFocus={false}
           placeholder=""Password""
           spellcheck={true}
           onChangeText={passwordinput => setPasswordinput(passwordinput)}
           value={passwordinput}
           placeholderTextColor={theme.colors.medium}
           clearButtonMode=""while-editing""
           secureTextEntry={true}
           returnKeyType=""done""
           textContentType=""password""
         />
         <Button
           style={StyleSheet.flatten([
             styles.buttonHY,
             { borderRadius: theme.borderRadius.global },
           ])}
           type=""solid""
         >
           Log In
         </Button>
       </View>
       <View style={styles.viewKz}>
         <Text
           style={StyleSheet.flatten([
             theme.typography.subtitle2,
             { color: theme.colors.medium },
           ])}
         >
           Don't have an account?
         </Text>
         <Button
           style={StyleSheet.flatten([
             styles.buttonXp,
             { borderColor: theme.colors.custom_rgba0_0_0_0 },
           ])}
           type=""outline""
           color={theme.colors.primary}
         >
           Sign Up
         </Button>
       </View>
     </KeyboardAvoidingView>
   </ScreenContainer>
 );
};
const styles = StyleSheet.create({
 keyboardAvoidingView97: {
   justifyContent: 'space-around',
   flexGrow: 1,
 },
 viewKt: {
   paddingLeft: 32,
   paddingRight: 32,
   paddingBottom: 34,
   paddingTop: 80,
   justifyContent: 'center',
   alignItems: 'center',
 },
 imageVH: {
   width: 80,
   height: 80,
   marginBottom: 46,
 },
 textInputDq: {
   paddingRight: 14,
   paddingLeft: 14,
   borderBottomWidth: 1,
   borderTopWidth: 1,
   borderLeftWidth: 1,
   borderRightWidth: 1,
   marginTop: 12,
   marginBottom: 12,
   height: 54,
 },
 viewRq: {
   paddingLeft: 32,
   paddingRight: 32,
   marginBottom: 24,
 },
 buttonXp: {
   borderTopWidth: 0,
   borderLeftWidth: 0,
   borderRightWidth: 0,
   alignSelf: 'center',
   alignContent: 'center',
   paddingLeft: 12,
   paddingRight: 12,
   borderBottomWidth: 0,
 },
 textXf: {
   textAlign: 'center',
 },
 textInput3S: {
   marginBottom: 12,
   marginTop: 12,
   borderRightWidth: 1,
   borderLeftWidth: 1,
   borderTopWidth: 1,
   borderBottomWidth: 1,
   paddingRight: 14,
   paddingLeft: 14,
   height: 54,
 },
 buttonHY: {
   justifyContent: 'center',
   height: 54,
   marginTop: 12,
   alignItems: 'center',
 },
 viewKz: {
   paddingLeft: 32,
   paddingRight: 32,
   paddingTop: 32,
   paddingBottom: 32,
   alignItems: 'center',
 },
});
export default withTheme(REPLACE_SCREEN_NAME);