fix(web): fix HOC components variants + psuedo/media merge

Sabin-Subedi · Apr 18, 2023 · c6c1a43 · c6c1a43
1 parent ca91256
commit c6c1a43
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 1 deletion.
diff --git a/apps/kitchen-sink/src/features/home/screen.tsx b/apps/kitchen-sink/src/features/home/screen.tsx
@@ -1,4 +1,4 @@
-import { variableToString } from '@tamagui/core'
+import { styled, variableToString } from '@tamagui/core'
 import { ChevronRight, Moon, Sun } from '@tamagui/lucide-icons'
 import { ScrollView } from 'react-native'
 import { UseLinkProps, useLink } from 'solito/link'
@@ -18,6 +18,20 @@ import {
 
 import { useThemeControl } from '../../useKitchenSinkTheme'
 
+const BetaButton = styled(Button, {
+  debug: 'verbose',
+
+  variants: {
+    primary: {
+      true: {
+        pressStyle: {
+          backgroundColor: 'red',
+        },
+      },
+    },
+  },
+})
+
 export function HomeScreen() {
   return (
     <ScrollView>
@@ -26,6 +40,8 @@ export function HomeScreen() {
           Demos
         </H1>
 
+        <BetaButton primary>test</BetaButton>
+
         <YStack theme="yellow" bc="$background" p="$3" br="$4" bw={1} boc="$borderColor">
           <Paragraph>Welcome to the Tamagui Kitchen Sink!</Paragraph>
         </YStack>

diff --git a/packages/web/src/helpers/getSplitStyles.tsx b/packages/web/src/helpers/getSplitStyles.tsx
@@ -622,6 +622,14 @@ export const getSplitStyles: StyleSplitter = (
         viewProps[key] = props[key] ?? val
       }
 
+      // have to run this logic again here
+      const isHOCShouldPassThrough = staticConfig.isHOC && isMediaOrPseudo
+      if (isHOCShouldPassThrough && !(key in usedKeys)) {
+        usedKeys[key] = 1
+        viewProps[key] = val
+        continue
+      }
+
       // pseudo
       if (isPseudo) {
         if (!val) continue