@ecohouse/ui 0.1.17 → 0.1.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecohouse/ui",
-  "version": "0.1.17",
+  "version": "0.1.18",
   "type": "module",
   "private": false,
   "description": "Cross-platform presentation-only UI components for EcoHouse (React Native + React Native Web)",

package/src/components/StatCard/StatCard.tsx

@@ -7,7 +7,7 @@ import {
   type ViewProps,
   type ViewStyle,
 } from "react-native";
-import type { IconComponent } from "../../icons";
+import type { IconComponent, IconProps } from "../../icons";
 import { colors, statCardTypography } from "../../theme";
 import { mergeRefs } from "../../utils/mergeRefs";
 import { useApplyWebClassName } from "../../utils/useApplyWebClassName";
@@ -15,6 +15,8 @@ import { useApplyWebClassName } from "../../utils/useApplyWebClassName";
 export interface StatCardProps extends Omit<ViewProps, "style" | "children"> {
   label: string;
   icon: IconComponent;
+  iconProps?: Omit<IconProps, "size">;
+  iconSize?: number;
   style?: StyleProp<ViewStyle>;
   className?: string;
 }
@@ -22,7 +24,16 @@ export interface StatCardProps extends Omit<ViewProps, "style" | "children"> {
 const ICON_SIZE = 28;
 
 export const StatCard = forwardRef<ComponentRef<typeof View>, StatCardProps>(function StatCard(
-  { label, icon: Icon, style, className, accessibilityLabel, ...rest },
+  {
+    label,
+    icon: Icon,
+    iconProps,
+    iconSize = ICON_SIZE,
+    style,
+    className,
+    accessibilityLabel,
+    ...rest
+  },
   forwardedRef,
 ) {
   const containerRef = useRef<ComponentRef<typeof View>>(null);
@@ -39,7 +50,7 @@ export const StatCard = forwardRef<ComponentRef<typeof View>, StatCardProps>(fun
       accessibilityRole="text"
       accessibilityLabel={accessibilityLabel ?? label}
     >
-      <Icon size={ICON_SIZE} color={colors.white} />
+      <Icon {...iconProps} size={iconSize} color={iconProps?.color ?? colors.white} />
       <Text style={styles.label}>{label}</Text>
     </View>
   );