fix: ensure static component methods are copied

marklawlor · marklawlor · commit 7f3eb1f6df46 · 2025-10-01T22:19:37.000+10:00
diff --git a/src/components/ActivityIndicator.tsx b/src/components/ActivityIndicator.tsx
@@ -9,6 +9,8 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNActivityIndicator> = {
   className: {
     target: "style",
@@ -18,10 +20,11 @@ const mapping: StyledConfiguration<typeof RNActivityIndicator> = {
   },
 };
 
-export function ActivityIndicator(
-  props: StyledProps<ActivityIndicatorProps, typeof mapping>,
-) {
-  return useCssElement(RNActivityIndicator, props, mapping);
-}
+export const ActivityIndicator = copyComponentProperties(
+  RNActivityIndicator,
+  (props: StyledProps<ActivityIndicatorProps, typeof mapping>) => {
+    return useCssElement(RNActivityIndicator, props, mapping);
+  },
+);
 
 export default ActivityIndicator;
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
@@ -6,6 +6,8 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNButton> = {
   className: {
     target: false,
@@ -15,8 +17,11 @@ const mapping: StyledConfiguration<typeof RNButton> = {
   },
 };
 
-export function Button(props: StyledProps<ButtonProps, typeof mapping>) {
-  return useCssElement(RNButton, props, mapping);
-}
+export const Button = copyComponentProperties(
+  RNButton,
+  (props: StyledProps<ButtonProps, typeof mapping>) => {
+    return useCssElement(RNButton, props, mapping);
+  },
+);
 
 export default Button;
diff --git a/src/components/FlatList.tsx b/src/components/FlatList.tsx
@@ -1,3 +1,4 @@
+import type { ReactNode } from "react";
 import { FlatList as RNFlatList, type FlatListProps } from "react-native";
 
 import {
@@ -6,17 +7,25 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNFlatList> = {
   ListFooterComponentClassName: "ListFooterComponentStyle",
   ListHeaderComponentClassName: "ListHeaderComponentStyle",
   columnWrapperClassName: "columnWrapperStyle",
   contentContainerClassName: "contentContainerStyle",
 };
 
-export function FlatList<ItemT>(
-  props: StyledProps<FlatListProps<ItemT>, typeof mapping>,
-) {
+export const FlatList = copyComponentProperties(RNFlatList, function <
+  ItemT,
+>(props: StyledProps<FlatListProps<ItemT>, typeof mapping>) {
   return useCssElement(RNFlatList, props, mapping);
-}
+}) as unknown as typeof RNFlatList &
+  (<ItemT>(
+    props: StyledProps<
+      FlatListProps<ItemT>,
+      StyledConfiguration<typeof RNFlatList>
+    >,
+  ) => ReactNode);
 
 export default FlatList;
diff --git a/src/components/Image.tsx b/src/components/Image.tsx
@@ -6,12 +6,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNImage> = {
   className: "style",
 };
 
-export function Image(props: StyledProps<ImageProps, typeof mapping>) {
-  return useCssElement(RNImage, props, mapping);
-}
+export const Image = copyComponentProperties(
+  RNImage,
+  (props: StyledProps<ImageProps, typeof mapping>) => {
+    return useCssElement(RNImage, props, mapping);
+  },
+);
 
 export default Image;
diff --git a/src/components/ImageBackground.tsx b/src/components/ImageBackground.tsx
@@ -9,6 +9,8 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNImageBackground> = {
   className: {
     target: "style",
@@ -18,10 +20,11 @@ const mapping: StyledConfiguration<typeof RNImageBackground> = {
   },
 };
 
-export function ImageBackground(
-  props: StyledProps<ImageBackgroundProps, typeof mapping>,
-) {
-  return useCssElement(RNImageBackground, props, mapping);
-}
+export const ImageBackground = copyComponentProperties(
+  RNImageBackground,
+  (props: StyledProps<ImageBackgroundProps, typeof mapping>) => {
+    return useCssElement(RNImageBackground, props, mapping);
+  },
+);
 
 export default ImageBackground;
diff --git a/src/components/KeyboardAvoidingView.tsx b/src/components/KeyboardAvoidingView.tsx
@@ -9,16 +9,19 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNKeyboardAvoidingView> = {
   className: {
     target: "style",
   },
 };
 
-export function KeyboardAvoidingView(
-  props: StyledProps<KeyboardAvoidingViewProps, typeof mapping>,
-) {
-  return useCssElement(RNKeyboardAvoidingView, props, mapping);
-}
+export const KeyboardAvoidingView = copyComponentProperties(
+  RNKeyboardAvoidingView,
+  (props: StyledProps<KeyboardAvoidingViewProps, typeof mapping>) => {
+    return useCssElement(RNKeyboardAvoidingView, props, mapping);
+  },
+);
 
 export default KeyboardAvoidingView;
diff --git a/src/components/Pressable.tsx b/src/components/Pressable.tsx
@@ -6,12 +6,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNPressable> = {
   className: "style",
 };
 
-export function Pressable(props: StyledProps<PressableProps, typeof mapping>) {
-  return useCssElement(RNPressable, props, mapping);
-}
+export const Pressable = copyComponentProperties(
+  RNPressable,
+  (props: StyledProps<PressableProps, typeof mapping>) => {
+    return useCssElement(RNPressable, props, mapping);
+  },
+);
 
 export default Pressable;
diff --git a/src/components/ScrollView.tsx b/src/components/ScrollView.tsx
@@ -6,15 +6,18 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNScrollView> = {
   className: "style",
   contentContainerClassName: "contentContainerStyle",
 };
 
-export function ScrollView(
-  props: StyledProps<ScrollViewProps, typeof mapping>,
-) {
-  return useCssElement(RNScrollView, props, mapping);
-}
+export const ScrollView = copyComponentProperties(
+  RNScrollView,
+  (props: StyledProps<ScrollViewProps, typeof mapping>) => {
+    return useCssElement(RNScrollView, props, mapping);
+  },
+);
 
 export default ScrollView;
diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
@@ -6,12 +6,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping = {
   className: "style",
 } satisfies StyledConfiguration<typeof RNSwitch>;
 
-export function Switch(props: StyledProps<SwitchProps, typeof mapping>) {
-  return useCssElement(RNSwitch, props, mapping);
-}
+export const Switch = copyComponentProperties(
+  RNSwitch,
+  (props: StyledProps<SwitchProps, typeof mapping>) => {
+    return useCssElement(RNSwitch, props, mapping);
+  },
+);
 
 export default Switch;
diff --git a/src/components/Text.tsx b/src/components/Text.tsx
@@ -6,12 +6,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping = {
   className: "style",
 } satisfies StyledConfiguration<typeof RNText>;
 
-export function Text(props: StyledProps<TextProps, typeof mapping>) {
-  return useCssElement(RNText, props, mapping);
-}
+export const Text = copyComponentProperties(
+  RNText,
+  (props: StyledProps<TextProps, typeof mapping>) => {
+    return useCssElement(RNText, props, mapping);
+  },
+);
 
 export default Text;
diff --git a/src/components/TextInput.tsx b/src/components/TextInput.tsx
@@ -6,6 +6,8 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNTextInput> = {
   className: {
     target: "style",
@@ -15,8 +17,11 @@ const mapping: StyledConfiguration<typeof RNTextInput> = {
   },
 };
 
-export function TextInput(props: StyledProps<TextInputProps, typeof mapping>) {
-  return useCssElement(RNTextInput, props, mapping);
-}
+export const TextInput = copyComponentProperties(
+  RNTextInput,
+  (props: StyledProps<TextInputProps, typeof mapping>) => {
+    return useCssElement(RNTextInput, props, mapping);
+  },
+);
 
 export default TextInput;
diff --git a/src/components/TouchableHighlight.tsx b/src/components/TouchableHighlight.tsx
@@ -9,14 +9,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNTouchableHighlight> = {
   className: "style",
 };
 
-export function TouchableHighlight(
-  props: StyledProps<TouchableHighlightProps, typeof mapping>,
-) {
-  return useCssElement(RNTouchableHighlight, props, mapping);
-}
+export const TouchableHighlight = copyComponentProperties(
+  RNTouchableHighlight,
+  (props: StyledProps<TouchableHighlightProps, typeof mapping>) => {
+    return useCssElement(RNTouchableHighlight, props, mapping);
+  },
+);
 
 export default TouchableHighlight;
diff --git a/src/components/TouchableOpacity.tsx b/src/components/TouchableOpacity.tsx
@@ -9,14 +9,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNTouchableOpacity> = {
   className: "style",
 };
 
-export function TouchableOpacity(
-  props: StyledProps<TouchableOpacityProps, typeof mapping>,
-) {
-  return useCssElement(RNTouchableOpacity, props, mapping);
-}
+export const TouchableOpacity = copyComponentProperties(
+  RNTouchableOpacity,
+  (props: StyledProps<TouchableOpacityProps, typeof mapping>) => {
+    return useCssElement(RNTouchableOpacity, props, mapping);
+  },
+);
 
 export default TouchableOpacity;
diff --git a/src/components/TouchableWithoutFeedback.tsx b/src/components/TouchableWithoutFeedback.tsx
@@ -9,14 +9,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNTouchableWithoutFeedback> = {
   className: "style",
 };
 
-export function TouchableWithoutFeedback(
-  props: StyledProps<TouchableWithoutFeedbackProps, typeof mapping>,
-) {
-  return useCssElement(RNTouchableWithoutFeedback, props, mapping);
-}
+export const TouchableWithoutFeedback = copyComponentProperties(
+  RNTouchableWithoutFeedback,
+  (props: StyledProps<TouchableWithoutFeedbackProps, typeof mapping>) => {
+    return useCssElement(RNTouchableWithoutFeedback, props, mapping);
+  },
+);
 
 export default TouchableWithoutFeedback;
diff --git a/src/components/View.tsx b/src/components/View.tsx
@@ -6,12 +6,17 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping = {
   className: "style",
 } satisfies StyledConfiguration<typeof RNView>;
 
-export function View(props: StyledProps<ViewProps, typeof mapping>) {
-  return useCssElement(RNView, props, mapping);
-}
+export const View = copyComponentProperties(
+  RNView,
+  (props: StyledProps<ViewProps, typeof mapping>) => {
+    return useCssElement(RNView, props, mapping);
+  },
+);
 
 export default View;
diff --git a/src/components/VirtualizedList.tsx b/src/components/VirtualizedList.tsx
@@ -1,3 +1,4 @@
+import type { ReactNode } from "react";
 import {
   VirtualizedList as RNVirtualizedList,
   type VirtualizedListProps,
@@ -9,17 +10,28 @@ import {
   type StyledProps,
 } from "react-native-css";
 
+import { copyComponentProperties } from "./copyComponentProperties";
+
 const mapping: StyledConfiguration<typeof RNVirtualizedList> = {
   className: "style",
   ListFooterComponentClassName: "ListFooterComponentStyle",
   ListHeaderComponentClassName: "ListHeaderComponentStyle",
   contentContainerClassName: "contentContainerStyle",
 };
 
-export function VirtualizedList<ItemT>(
-  props: StyledProps<VirtualizedListProps<ItemT>, typeof mapping>,
-) {
-  return useCssElement(RNVirtualizedList, props, mapping);
-}
+export const VirtualizedList = copyComponentProperties(
+  RNVirtualizedList,
+  function <ItemT>(
+    props: StyledProps<VirtualizedListProps<ItemT>, typeof mapping>,
+  ) {
+    return useCssElement(RNVirtualizedList, props, mapping);
+  },
+) as unknown as typeof RNVirtualizedList &
+  (<ItemT>(
+    props: StyledProps<
+      VirtualizedListProps<ItemT>,
+      StyledConfiguration<typeof RNVirtualizedList>
+    >,
+  ) => ReactNode);
 
 export default VirtualizedList;
diff --git a/src/components/copyComponentProperties.ts b/src/components/copyComponentProperties.ts
