feat(tamagui): Auto setup core for React Native

tamagui · Oct 27, 2022 · b59e5e2 · b59e5e2
1 parent ad8b4e2
commit b59e5e2
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 36 deletions.
diff --git a/packages/tamagui/src/index.ts b/packages/tamagui/src/index.ts
@@ -1,5 +1,15 @@
 import './polyfills'
 
+import { setupReactNative } from '@tamagui/core'
+import { Image, Text, TextInput, View } from 'react-native'
+
+setupReactNative({
+  Image,
+  View,
+  Text,
+  TextInput,
+})
+
 export * from '@tamagui/animate-presence'
 export * from '@tamagui/alert-dialog'
 export * from '@tamagui/avatar'

diff --git a/packages/tamagui/src/views/Input.tsx b/packages/tamagui/src/views/Input.tsx
@@ -4,46 +4,39 @@ import { TextInput } from 'react-native'
 
 import { inputSizeVariant } from '../helpers/inputHelpers'
 
-export const InputFrame = styled(
-  TextInput,
-  {
-    name: 'Input',
-    fontFamily: '$body',
-    borderWidth: 1,
-    color: '$color',
-    focusable: true,
-    borderColor: '$borderColor',
-    backgroundColor: '$background',
-
-    // this fixes a flex bug where it overflows container
-    minWidth: 0,
-
-    hoverStyle: {
-      borderColor: '$borderColorHover',
-    },
-
-    focusStyle: {
-      borderColor: '$borderColorFocus',
-      borderWidth: 2,
-      marginHorizontal: -1,
-    },
+export const InputFrame = styled(TextInput, {
+  name: 'Input',
+  fontFamily: '$body',
+  borderWidth: 1,
+  color: '$color',
+  focusable: true,
+  borderColor: '$borderColor',
+  backgroundColor: '$background',
+
+  // this fixes a flex bug where it overflows container
+  minWidth: 0,
+
+  hoverStyle: {
+    borderColor: '$borderColorHover',
+  },
 
-    variants: {
-      size: {
-        '...size': inputSizeVariant,
-      },
-    } as const,
+  focusStyle: {
+    borderColor: '$borderColorFocus',
+    borderWidth: 2,
+    marginHorizontal: -1,
+  },
 
-    defaultVariants: {
-      size: '$4',
+  variants: {
+    size: {
+      '...size': inputSizeVariant,
     },
+  } as const,
+
+  defaultVariants: {
+    size: '$4',
   },
-  {
-    isText: true,
-    isReactNative: true,
-  }
-)
+})
 
 export type InputProps = GetProps<typeof InputFrame>
 
-export const Input = InputFrame.extractable(focusableInputHOC(InputFrame))
+export const Input = focusableInputHOC(InputFrame)