From a880901571707ea298e18fed70aa8379f93f20a2 Mon Sep 17 00:00:00 2001
From: Shawn Jackson <shawn@resgrid.com>
Date: Sat, 22 Aug 2026 18:05:32 -0700
Subject: [PATCH] RU-T52 Style fix

---
 src/components/ui/icon/index.tsx    | 11 +++++++----
 src/components/ui/spinner/index.tsx |  4 +++-
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/ui/icon/index.tsx b/src/components/ui/icon/index.tsx
index 1e57167d..6e5e2b44 100644
--- a/src/components/ui/icon/index.tsx
+++ b/src/components/ui/icon/index.tsx
@@ -31,12 +31,15 @@ const iconStyle = tva({
 const StyledUIIcon = styled(UIIcon, {
   className: {
     target: 'style',
+    // Values must be prop paths, never `true`: react-native-css resolves each one with
+    // `path.split('.')`, so a boolean throws "undefined is not a function" the moment the class
+    // actually produces that style key — which for the size variants is every render.
     nativeStyleMapping: {
-      height: true,
-      width: true,
-      fill: true,
+      height: 'height',
+      width: 'width',
+      fill: 'fill',
       color: 'classNameColor',
-      stroke: true,
+      stroke: 'stroke',
     },
   },
 });
diff --git a/src/components/ui/spinner/index.tsx b/src/components/ui/spinner/index.tsx
index 8f6236f6..2d8e80b8 100644
--- a/src/components/ui/spinner/index.tsx
+++ b/src/components/ui/spinner/index.tsx
@@ -5,7 +5,9 @@ import React from 'react';
 import { ActivityIndicator } from 'react-native';
 
 const StyledActivityIndicator = styled(ActivityIndicator, {
-  className: { target: 'style', nativeStyleMapping: { color: true } },
+  // A prop path, not `true`: react-native-css calls `.split('.')` on the value, so a boolean
+  // crashes as soon as the className resolves to a colour.
+  className: { target: 'style', nativeStyleMapping: { color: 'color' } },
 });
 
 const spinnerStyle = tva({});