Merge pull request #34 from adaptui/development

Development

Author: Karthik-B-06

.eslintignore

@@ -0,0 +1,24 @@
+# don't ever lint node_modules
+node_modules
+# don't lint build output (make sure it's set to your correct build folder name)
+lib
+# don't lint nyc coverage output
+coverage
+
+# dont have lint ios and android folders
+ios
+android
+
+# basic js files of react native
+
+.eslintrc.js
+babel.config.js
+jest.config.js
+metro.config.js
+tailwind.config.js
+
+example
+
+scripts
+
+__tests__

.eslintrc.js

@@ -0,0 +1,38 @@
+module.exports = {
+  root: true,
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    project: './tsconfig.json',
+  },
+  env: {
+    es6: true,
+    node: true,
+    jest: true,
+    browser: true,
+    'react-native/react-native': true,
+  },
+  extends: [
+    '@react-native-community',
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:@typescript-eslint/eslint-recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:@typescript-eslint/recommended-requiring-type-checking',
+    'prettier/@typescript-eslint',
+  ],
+  plugins: ['react', 'react-hooks', '@typescript-eslint', 'prettier', '@react-native-community'],
+  rules: {
+    'react/prop-types': 'off',
+    quotes: ['error', 'single'],
+    'prettier/prettier': 'error',
+    // React Native Rules
+    'react-native/no-unused-styles': "error",
+    'react-native/split-platform-components': "off",
+    'react-native/no-raw-text': "off"
+  },
+  settings: {
+    react: {
+      version: 'detect',
+    },
+  },
+};

.expo-shared/README.md

@@ -0,0 +1,11 @@
+> Why do I have a folder named ".expo-shared" in my project?
+
+The ".expo-shared" folder is created when running commands that produce state that is intended to be shared with all developers on the project. For example, "npx expo-optimize".
+
+> What does the "assets.json" file contain?
+
+The "assets.json" file describes the assets that have been optimized through "expo-optimize" and do not need to be processed again.
+
+> Should I commit the ".expo-shared" folder?
+
+Yes, you should share the ".expo-shared" folder with your collaborators.

.expo-shared/assets.json

@@ -0,0 +1,6 @@
+{
+  "24272cdaeff82cc5facdaccd982a6f05b60c4504704bbf94c19a6388659880bb": true,
+  "5f4c0a732b6325bf4071d9124d2ae67e037cb24fcc9c482ef82bea742109a3b8": true,
+  "74c64047eb557b1341bba7a2831eedde9ddb705e6451a9ad9f5552bf558f13de": true,
+  "bc25a616b4e31cf7300cd97b9cbf8894e855e6373aa797d0badd7e211111c5e5": true
+}

.ondevice/AppRoot.tsx

@@ -0,0 +1,24 @@
+import { createDrawerNavigator } from '@react-navigation/drawer';
+import React from 'react';
+import { Box, Text, useTheme } from '../src';
+
+function HomeScreen() {
+  const tailwind = useTheme();
+  return (
+    <Box style={tailwind.style('flex-1 justify-center items-center')}>
+      <Text>Hello,World from Home Screen</Text>
+    </Box>
+  );
+}
+
+const Drawer = createDrawerNavigator();
+
+const AppRoot = () => {
+  return (
+    <Drawer.Navigator initialRouteName="Home">
+      <Drawer.Screen name="Home" component={HomeScreen} />
+    </Drawer.Navigator>
+  );
+};
+
+export default AppRoot;

.prettierrc.js

@@ -0,0 +1,10 @@
+module.exports = {
+  useTabs: false,
+  printWidth: 120,
+  tabWidth: 2,
+  singleQuote: true,
+  jsxBracketSameLine: false,
+  parser: 'typescript',
+  semi: true,
+  arrowParens: 'always',
+};

App.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import { LogBox, SafeAreaView, StatusBar } from 'react-native';
+import 'react-native-gesture-handler';
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
+import tailwind from 'twrnc';
+import AppRoot from './.ondevice/AppRoot';
+import { TailwindThemeProvider } from './src';
+import { NavigationContainer } from '@react-navigation/native';
+
+LogBox.ignoreAllLogs();
+
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+const App = () => {
+  return (
+    <GestureHandlerRootView style={tailwind.style('flex-1')}>
+      <NavigationContainer>
+        <SafeAreaView
+          style={tailwind.style(
+            `flex-1 android:mt-[${StatusBar.currentHeight || 0}px]`
+          )}
+        >
+          <TailwindThemeProvider>
+            <AppRoot />
+          </TailwindThemeProvider>
+        </SafeAreaView>
+      </NavigationContainer>
+    </GestureHandlerRootView>
+  );
+};
+
+export default App;

README.md

@@ -1,21 +1,19 @@
-# react-native-system
+# react-native-tailwind
 
 Collection of components that are accessible, composable, customizable from low level to build your own UI & Design System
 
 ## Installation
 
 ```sh
-npm install react-native-system
+npm install react-native-tailwind
 ```
 
 ## Usage
 
 ```js
-import System from "react-native-system";
+import { Button } from 'react-native-tailwind';
 
-// ...
-
-const result = await System.multiply(3, 7);
+<Button size="sm">Continue</Button>;
 ```
 
 ## Contributing

app.json

@@ -0,0 +1,33 @@
+{
+  "expo": {
+    "name": "React Native System Storybook",
+    "slug": "react-native-system-storybook",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "updates": {
+      "fallbackToCacheTimeout": 0
+    },
+    "assetBundlePatterns": [
+      "**/*"
+    ],
+    "ios": {
+      "supportsTablet": true
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#FFFFFF"
+      }
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    },
+    "description": "Collection of components that are accessible, composable, customizable from low level to build your own UI & Design System"
+  }
+}