fix: react native lib integration

Author: vip-git

demo/mobile/reactnative/App.tsx

@@ -16,6 +16,9 @@ import {
   useColorScheme,
 } from 'react-native';
 
+// Internal
+import ReactNativeForm from '../../../src/Form';
+
 const LeftContent = (props: any) => <Avatar.Icon {...props} icon="folder" />
 
 const App = () => {
@@ -51,6 +54,7 @@ const App = () => {
             <Button>Ok</Button>
           </Card.Actions>
         </Card>
+        <ReactNativeForm />
       </SafeAreaView>
     </PaperProvider>
   );

demo/mobile/reactnative/ios/Podfile.lock

@@ -333,6 +333,8 @@ PODS:
     - React-cxxreact (= 0.65.1)
     - React-jsi (= 0.65.1)
     - React-perflogger (= 0.65.1)
+  - RNVectorIcons (8.1.0):
+    - React-Core
   - Yoga (1.14.0)
   - YogaKit (1.18.1):
     - Yoga (~> 1.14)
@@ -388,6 +390,7 @@ DEPENDENCIES:
   - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
   - React-runtimeexecutor (from `../node_modules/react-native/ReactCommon/runtimeexecutor`)
   - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
+  - RNVectorIcons (from `../node_modules/react-native-vector-icons`)
   - Yoga (from `../node_modules/react-native/ReactCommon/yoga`)
 
 SPEC REPOS:
@@ -463,6 +466,8 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/runtimeexecutor"
   ReactCommon:
     :path: "../node_modules/react-native/ReactCommon"
+  RNVectorIcons:
+    :path: "../node_modules/react-native-vector-icons"
   Yoga:
     :path: "../node_modules/react-native/ReactCommon/yoga"
 
@@ -508,6 +513,7 @@ SPEC CHECKSUMS:
   React-RCTVibration: 92d41c2442e5328cc4d342cd7f78e5876b68bae5
   React-runtimeexecutor: 85187f19dd9c47a7c102f9994f9d14e4dc2110de
   ReactCommon: eafed38eec7b591c31751bfa7494801618460459
+  RNVectorIcons: 31cebfcf94e8cf8686eb5303ae0357da64d7a5a4
   Yoga: aa0cb45287ebe1004c02a13f279c55a95f1572f4
   YogaKit: f782866e155069a2cca2517aafea43200b01fd5a
 

demo/mobile/reactnative/ios/reactnative.xcodeproj/project.pbxproj

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

demo/mobile/reactnative/ios/reactnative.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

@@ -5,6 +5,16 @@
  * @format
  */
 
+ const path = require('path');
+
+ const extraNodeModules = {
+   '../../../src': path.resolve(__dirname + '/../../../src'),
+ };
+
+ const watchFolders = [
+   path.resolve(__dirname + '/../../../src')
+ ];
+ 
 module.exports = {
   transformer: {
     getTransformOptions: async () => ({
@@ -14,4 +24,12 @@ module.exports = {
       },
     }),
   },
+  resolver: {
+    extraNodeModules: new Proxy(extraNodeModules, {
+      get: (target, name) =>
+        //redirects dependencies referenced from common/ to local node_modules
+        name in target ? target[name] : path.join(process.cwd(), `node_modules/${name}`),
+    }),
+  },
+  watchFolders,
 };

demo/mobile/reactnative/metro.config.js

@@ -0,0 +1,26 @@
+// Library
+import React from 'react';
+import { View, Text } from 'react-native';
+import { RadioButton } from 'react-native-paper';
+
+const ReactNativeForm = () => {
+  const [checked, setChecked] = React.useState('first');
+
+  return (
+    <View>
+      <Text> I was here </Text>
+      <RadioButton
+        value="first"
+        status={ checked === 'first' ? 'checked' : 'unchecked' }
+        onPress={() => setChecked('first')}
+      />
+      <RadioButton
+        value="second"
+        status={ checked === 'second' ? 'checked' : 'unchecked' }
+        onPress={() => setChecked('second')}
+      />
+    </View>
+  );
+};
+
+export default ReactNativeForm;