🔧 Update linter and format project

.eslintignore

@@ -0,0 +1 @@
+node_modules/

.eslintrc.json

@@ -0,0 +1,48 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true
+  },
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended",
+    "plugin:@typescript-eslint/eslint-recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:@typescript-eslint/recommended-requiring-type-checking"
+  ],
+  "parser": "@typescript-eslint/parser",
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "overrides": [],
+  "parserOptions": {
+    "ecmaVersion": "latest",
+    "sourceType": "module",
+    "project": ["./tsconfig.json"],
+    "ecmaFeatures": {
+        "jsx": true
+    }
+  },
+  "plugins": [
+    "react",
+    "@typescript-eslint",
+    "react-hooks"
+  ],
+  "rules": {
+    "@typescript-eslint/semi": ["error", "always"],
+    "@typescript-eslint/space-before-function-paren": 0,
+    "prefer-arrow-callback": "error",
+    "react/function-component-definition": [
+        "error",
+        { 
+            "namedComponents": "arrow-function",
+            "unnamedComponents": "arrow-function"
+        }
+    ]
+  },
+  "ignorePatterns": ["*/*.config.js", "*.config.js"],
+  "root": true
+}

.prettierrc.json

@@ -0,0 +1,15 @@
+{
+  "singleQuote": true,
+  "semi": true,
+  "printWidth": 100,
+  "tabWidth": 4,
+  "trailingComma": "all",
+  "overrides": [
+    {
+      "files": "*.json",
+      "options": {
+        "tabWidth": 2
+      }
+    }
+  ]
+}

.watchmanconfig

@@ -1 +1 @@
-{}
+{}

babel.config.js

@@ -1,3 +1,3 @@
 module.exports = {
-  presets: ['module:metro-react-native-babel-preset'],
+    presets: ['module:metro-react-native-babel-preset'],
 };

example/.watchmanconfig

@@ -1 +1 @@
-{}
+{}

example/app.json

@@ -1,4 +1,4 @@
 {
   "name": "SmartwayReactNativeUiExample",
   "displayName": "SmartwayReactNativeUiExample"
-}
+}

example/babel.config.js

@@ -2,21 +2,21 @@ const path = require('path');
 const pak = require('../package.json');
 
 module.exports = {
-  presets: ['module:metro-react-native-babel-preset'],
-  plugins: [
-    [
-      'module-resolver',
-      {
-        extensions: ['.tsx', '.ts', '.js', '.json'],
-        alias: {
-          ['smartway-react-native-ui']: path.join(__dirname, '..', pak.source),
-        },
-      },
+    presets: ['module:metro-react-native-babel-preset'],
+    plugins: [
+        [
+            'module-resolver',
+            {
+                extensions: ['.tsx', '.ts', '.js', '.json'],
+                alias: {
+                    ['smartway-react-native-ui']: path.join(__dirname, '..', pak.source),
+                },
+            },
+        ],
     ],
-  ],
-  env: {
-    production: {
-      plugins: ['react-native-paper/babel'],
+    env: {
+        production: {
+            plugins: ['react-native-paper/babel'],
+        },
     },
-  },
 };

example/ios/SmartwayReactNativeUiExample/Images.xcassets/AppIcon.appiconset/Contents.json

@@ -1,53 +1,53 @@
 {
-  "images" : [
+  "images": [
     {
-      "idiom" : "iphone",
-      "scale" : "2x",
-      "size" : "20x20"
+      "idiom": "iphone",
+      "scale": "2x",
+      "size": "20x20"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "3x",
-      "size" : "20x20"
+      "idiom": "iphone",
+      "scale": "3x",
+      "size": "20x20"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "2x",
-      "size" : "29x29"
+      "idiom": "iphone",
+      "scale": "2x",
+      "size": "29x29"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "3x",
-      "size" : "29x29"
+      "idiom": "iphone",
+      "scale": "3x",
+      "size": "29x29"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "2x",
-      "size" : "40x40"
+      "idiom": "iphone",
+      "scale": "2x",
+      "size": "40x40"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "3x",
-      "size" : "40x40"
+      "idiom": "iphone",
+      "scale": "3x",
+      "size": "40x40"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "2x",
-      "size" : "60x60"
+      "idiom": "iphone",
+      "scale": "2x",
+      "size": "60x60"
     },
     {
-      "idiom" : "iphone",
-      "scale" : "3x",
-      "size" : "60x60"
+      "idiom": "iphone",
+      "scale": "3x",
+      "size": "60x60"
     },
     {
-      "idiom" : "ios-marketing",
-      "scale" : "1x",
-      "size" : "1024x1024"
+      "idiom": "ios-marketing",
+      "scale": "1x",
+      "size": "1024x1024"
     }
   ],
-  "info" : {
-    "author" : "xcode",
-    "version" : 1
+  "info": {
+    "author": "xcode",
+    "version": 1
   }
 }

example/ios/SmartwayReactNativeUiExample/Images.xcassets/Contents.json

@@ -1,6 +1,6 @@
 {
-  "info" : {
-    "version" : 1,
-    "author" : "xcode"
+  "info": {
+    "version": 1,
+    "author": "xcode"
   }
 }

example/metro.config.js

@@ -6,35 +6,32 @@ const pak = require('../package.json');
 const root = path.resolve(__dirname, '..');
 
 const modules = Object.keys({
-  ...pak.peerDependencies,
+    ...pak.peerDependencies,
 });
 
 module.exports = {
-  projectRoot: __dirname,
-  watchFolders: [root],
+    projectRoot: __dirname,
+    watchFolders: [root],
 
-  // We need to make sure that only one version is loaded for peerDependencies
-  // So we block them at the root, and alias them to the versions in example's node_modules
-  resolver: {
-    blacklistRE: exclusionList(
-      modules.map(
-        (m) =>
-          new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`)
-      )
-    ),
+    // We need to make sure that only one version is loaded for peerDependencies
+    // So we block them at the root, and alias them to the versions in example's node_modules
+    resolver: {
+        blacklistRE: exclusionList(
+            modules.map((m) => new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`)),
+        ),
 
-    extraNodeModules: modules.reduce((acc, name) => {
-      acc[name] = path.join(__dirname, 'node_modules', name);
-      return acc;
-    }, {}),
-  },
+        extraNodeModules: modules.reduce((acc, name) => {
+            acc[name] = path.join(__dirname, 'node_modules', name);
+            return acc;
+        }, {}),
+    },
 
-  transformer: {
-    getTransformOptions: async () => ({
-      transform: {
-        experimentalImportSupport: false,
-        inlineRequires: true,
-      },
-    }),
-  },
+    transformer: {
+        getTransformOptions: async () => ({
+            transform: {
+                experimentalImportSupport: false,
+                inlineRequires: true,
+            },
+        }),
+    },
 };

example/react-native.config.js

@@ -2,9 +2,9 @@ const path = require('path');
 const pak = require('../package.json');
 
 module.exports = {
-  dependencies: {
-    ['smartway-react-native-ui']: {
-      root: path.join(__dirname, '..'),
+    dependencies: {
+        ['smartway-react-native-ui']: {
+            root: path.join(__dirname, '..'),
+        },
     },
-  },
 };

example/src/App.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { ThemeProvider } from 'smartway-react-native-ui';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { NavigationContainer } from '@react-navigation/native';
@@ -7,24 +7,25 @@ import { ButtonsPage } from './Buttons/ButtonsPage';
 import { DialogPage } from './Dialog/DialogPage';
 
 export type RootStackParamList = {
-  Home: undefined,
-  Buttons: undefined,
-  Dialog: undefined,
+    Home: undefined;
+    Buttons: undefined;
+    Dialog: undefined;
 };
 
-const Stack = createNativeStackNavigator<RootStackParamList>()
+const Stack = createNativeStackNavigator<RootStackParamList>();
 
-export default function App() {
+const App = () => {
+    return (
+        <ThemeProvider>
+            <NavigationContainer>
+                <Stack.Navigator initialRouteName="Home">
+                    <Stack.Screen name="Home" component={HomeScreen} />
+                    <Stack.Screen name="Buttons" component={ButtonsPage} />
+                    <Stack.Screen name="Dialog" component={DialogPage} />
+                </Stack.Navigator>
+            </NavigationContainer>
+        </ThemeProvider>
+    );
+};
 
-  return (
-    <ThemeProvider>
-      <NavigationContainer>
-        <Stack.Navigator initialRouteName="Home">
-          <Stack.Screen name="Home" component={HomeScreen} />
-          <Stack.Screen name="Buttons" component={ButtonsPage} />
-          <Stack.Screen name="Dialog" component={DialogPage} />
-        </Stack.Navigator>
-      </NavigationContainer>
-    </ThemeProvider>
-  );
-}
+export default App; 

example/src/Buttons/ButtonsPage.tsx

@@ -1,18 +1,18 @@
-import React from "react";
-import { StyleSheet } from "react-native";
-import { Button, Screen } from "smartway-react-native-ui";
+import React from 'react';
+import { StyleSheet } from 'react-native';
+import { Button, Screen } from 'smartway-react-native-ui';
 
-export function ButtonsPage() {
+export const ButtonsPage = () => {
     return (
         <Screen style={styles.container}>
-          <Button mode="text">Text button</Button>
-          <Button mode="filled">Filled button</Button>
+            <Button mode="text">Text button</Button>
+            <Button mode="filled">Filled button</Button>
         </Screen>
-    )
-}
+    );
+};
 
 const styles = StyleSheet.create({
-  container: {
-    alignItems: 'center',
-  },
+    container: {
+        alignItems: 'center',
+    },
 });