native-base init

package.json

@@ -14,9 +14,11 @@
   "dependencies": {
     "babel-preset-esnext": "^1.1.3",
     "babel-preset-react": "^6.24.1",
+    "native-base": "^3.4.23",
     "react": "^18.1.0",
     "react-dom": "18.1.0",
     "react-native": "0.70.6",
+    "react-native-safe-area-context": "^4.4.1",
     "react-native-web": "^0.18.10"
   },
   "devDependencies": {

src/App.tsx

@@ -1,6 +1,9 @@
 import React, {useState} from 'react';
-import {Image, Text, StyleSheet} from 'react-native';
-import {testt} from '@caj/configs/test';
+
+import {NativeBaseProvider, Box, Input, Text} from 'native-base';
+import {extendTheme} from 'native-base';
+
+import {theme} from '@caj/configs/colors';
 
 import imgSrc from '@caj/img/maimg.png';
 
@@ -15,27 +18,18 @@ const user: User = {
 };
 
 const App = () => {
-  const [titleText, setTitleText] = useState("Bird's Nest");
-  const bodyText =
-    'This is not really a bird nest. ' + user.name + ' - ' + testt.data;
-
-  const onPressTitle = () => {
-    setTitleText("Bird's Nest [pressed]");
-  };
-
   return (
-    <Text style={styles.baseText}>
-      <Text style={styles.titleText} onPress={onPressTitle}>
-        {titleText}
-        {'\n'}
-        {'\n'}
-      </Text>
-      <Text numberOfLines={5}>{bodyText}</Text>
-      <Image source={imgSrc} style={styles.image} />
-    </Text>
+    <NativeBaseProvider theme={theme}>
+      <Box>
+        <Text> ma boyy :--)</Text>
+      </Box>
+      <Box alignItems="center">
+        <Input shadow={2} placeholder="Enter your name" />
+      </Box>
+    </NativeBaseProvider>
   );
 };
-
+/*
 const styles = StyleSheet.create({
   baseText: {
     fontFamily: 'Cochin',
@@ -49,6 +43,6 @@ const styles = StyleSheet.create({
     height: 500,
     borderWidth: 1,
   },
-});
+});*/
 
 export default App;

src/caj/configs/test.ts

@@ -1,3 +1,3 @@
 
 
-export const testt = { data: "hellow :33 liebe diese"};
+export const testt = { data: "hellow :33 liebe diese ios"};