refactor: use index.tsx for native, index.web.tsx for web entry

Author: pkaramon

apps/example-web/src/App.tsx

@@ -5,7 +5,7 @@ function App() {
   return (
     <div className="container">
       <div>Text input</div>
-      <EnrichedTextInput />
+      <EnrichedTextInput defaultValue="Type something" />
     </div>
   );
 }

apps/example-web/tsconfig.app.json

@@ -5,7 +5,7 @@
     "types": ["vite/client"],
     "baseUrl": ".",
     "paths": {
-      "react-native-enriched": ["../../src/index.tsx"]
+      "react-native-enriched": ["../../src/index.web"]
     }
   },
   "include": ["src"]

apps/example-web/vite.config.ts

@@ -7,7 +7,10 @@ export default defineConfig({
   plugins: [react()],
   resolve: {
     alias: {
-      'react-native-enriched': path.resolve(__dirname, '../../src/index.tsx'),
+      'react-native-enriched': path.resolve(
+        __dirname,
+        '../../src/index.web.tsx'
+      ),
     },
   },
 });

package.json

@@ -2,12 +2,14 @@
   "name": "react-native-enriched",
   "version": "0.5.2",
   "description": "Rich Text Editor component for React Native",
-  "source": "./src/index.native.tsx",
+  "source": "./src/index.tsx",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",
   "exports": {
     ".": {
       "types": "./lib/typescript/src/index.d.ts",
+      "source": "./src/index.tsx",
+      "react-native": "./lib/module/index.js",
       "default": "./lib/module/index.js"
     },
     "./package.json": "./package.json"
@@ -27,7 +29,9 @@
     "!android/gradlew.bat",
     "!android/local.properties",
     "!src/web",
-    "!src/index.tsx",
+    "!src/index.web.tsx",
+    "!lib/module/web",
+    "!lib/typescript/src/web",
     "!**/__tests__",
     "!**/__fixtures__",
     "!**/__mocks__",

src/index.tsx

@@ -1,5 +1,10 @@
-export { EnrichedTextInput } from './web/EnrichedTextInput';
-export type { EnrichedTextInputWebProps as EnrichedTextInputProps } from './web/EnrichedTextInput';
+export { EnrichedTextInput } from './native/EnrichedTextInput';
+export type {
+  FocusEvent,
+  BlurEvent,
+  EnrichedTextInputInstance,
+  EnrichedTextInputProps,
+} from './componentTypes';
 export type {
   OnChangeTextEvent,
   OnChangeHtmlEvent,

src/index.native.tsx src/index.web.tsxsrc/index.native.tsx renamed to src/index.web.tsx

@@ -1,10 +1,5 @@
-export { EnrichedTextInput } from './native/EnrichedTextInput';
-export type {
-  FocusEvent,
-  BlurEvent,
-  EnrichedTextInputInstance,
-  EnrichedTextInputProps,
-} from './componentTypes';
+export { EnrichedTextInput } from './web/EnrichedTextInput';
+export type { EnrichedTextInputWebProps as EnrichedTextInputProps } from './web/EnrichedTextInput';
 export type {
   OnChangeTextEvent,
   OnChangeHtmlEvent,

src/web/EnrichedTextInput.tsx

@@ -42,7 +42,10 @@ export interface EnrichedTextInputWebProps {
 const noop = () => {};
 const noopPromise = () => Promise.resolve('');
 
-export const EnrichedTextInput = ({ ref }: EnrichedTextInputWebProps) => {
+export const EnrichedTextInput = ({
+  ref,
+  defaultValue,
+}: EnrichedTextInputWebProps) => {
   useImperativeHandle(ref, () => ({
     focus: noop,
     blur: noop,
@@ -72,5 +75,5 @@ export const EnrichedTextInput = ({ ref }: EnrichedTextInputWebProps) => {
     setMention: noop,
   }));
 
-  return <div data-testid="enriched-text-input-web" />;
+  return <textarea defaultValue={defaultValue} />;
 };

tsconfig.build.json

@@ -1,4 +1,4 @@
 {
   "extends": "./tsconfig",
-  "exclude": ["apps", "lib", "cpp/build", "src/web"]
+  "exclude": ["apps", "lib", "cpp/build", "src/web", "src/index.web.tsx"]
 }

tsconfig.json

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "rootDir": ".",
     "paths": {
-      "react-native-enriched": ["./src/index.native"]
+      "react-native-enriched": ["./src/index"]
     }
   }
 }