From 006f6b23c64e82128c72dec795a0dfbe6e289d37 Mon Sep 17 00:00:00 2001
From: bohdanprog <bohdan.artiukhov@swmansion.com>
Date: Thu, 31 Jul 2025 16:44:54 +0200
Subject: [PATCH] fix: prevent undefined override props from overriding SVG
 element props

---
 apps/common/test/Test2693.tsx | 27 +++++++++++++++++++++++++++
 apps/common/test/index.tsx    |  1 +
 src/xml.tsx                   |  5 ++++-
 3 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 apps/common/test/Test2693.tsx

diff --git a/apps/common/test/Test2693.tsx b/apps/common/test/Test2693.tsx
new file mode 100644
index 000000000..dc848d0b9
--- /dev/null
+++ b/apps/common/test/Test2693.tsx
@@ -0,0 +1,27 @@
+import {View} from 'react-native';
+import {SvgCss} from 'react-native-svg/css';
+import {SvgXml} from 'react-native-svg';
+
+export default function Test2693() {
+  return (
+    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+      <View style={{flexDirection: 'row', gap: 10, alignItems: 'center'}}>
+        <SvgCss
+          fill={undefined}
+          xml={`
+          <svg viewBox="0 0 24 24" width="24" height="24" stroke="black" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" class="css-i6dzq1"><path d="M5 17H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-1"></path><polygon points="12 15 17 21 7 21 12 15"></polygon></svg>`}
+        />
+        <SvgXml
+          fill={undefined}
+          xml={`
+      <svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <rect x="0.5" y="0.5" width="41" height="41" rx="20.5" fill="white"/>
+      <path fill-rule="evenodd" clip-rule="evenodd" d="M13 24.3906H20.406C20.84 22.8776 22.234 21.7705 23.8865 21.7705C25.539 21.7705 26.9329 22.8776 27.367 24.3906H29C29.5523 24.3906 30 24.8383 30 25.3906C30 25.9429 29.5523 26.3906 29 26.3906H27.3673C26.9334 27.904 25.5393 29.0115 23.8865 29.0115C22.2337 29.0115 20.8395 27.904 20.4057 26.3906H13C12.4477 26.3906 12 25.9429 12 25.3906C12 24.8383 12.4477 24.3906 13 24.3906ZM23.8863 27.0105C22.9916 27.0105 22.2663 26.2852 22.2663 25.3905C22.2663 24.4958 22.9916 23.7705 23.8863 23.7705C24.781 23.7705 25.5063 24.4958 25.5063 25.3905C25.5063 26.2852 24.781 27.0105 23.8863 27.0105Z" fill="black"/>
+      <path fill-rule="evenodd" clip-rule="evenodd" d="M29 15.6084H21.594C21.16 14.0954 19.766 12.9883 18.1135 12.9883C16.461 12.9883 15.0671 14.0954 14.633 15.6084H13C12.4477 15.6084 12 16.0561 12 16.6084C12 17.1607 12.4477 17.6084 13 17.6084H14.6327C15.0666 19.1218 16.4607 20.2293 18.1135 20.2293C19.7663 20.2293 21.1605 19.1218 21.5943 17.6084H29C29.5523 17.6084 30 17.1607 30 16.6084C30 16.0561 29.5523 15.6084 29 15.6084ZM18.1137 18.2283C19.0084 18.2283 19.7337 17.503 19.7337 16.6083C19.7337 15.7136 19.0084 14.9883 18.1137 14.9883C17.219 14.9883 16.4937 15.7136 16.4937 16.6083C16.4937 17.503 17.219 18.2283 18.1137 18.2283Z" fill="black"/>
+      <rect x="0.5" y="0.5" width="41" height="41" rx="20.5" stroke="#BFBFBF"/>
+      </svg>`}
+        />
+      </View>
+    </View>
+  );
+}
diff --git a/apps/common/test/index.tsx b/apps/common/test/index.tsx
index 381f2aaca..e61b465f6 100644
--- a/apps/common/test/index.tsx
+++ b/apps/common/test/index.tsx
@@ -37,6 +37,7 @@ import Test2455 from './Test2455';
 import Test2471 from './Test2471';
 import Test2520 from './Test2520';
 import Test2670 from './Test2670';
+import Test2693 from './Test2693';
 
 export default function App() {
   return <ColorTest />;
diff --git a/src/xml.tsx b/src/xml.tsx
index 073888c13..44f1eca12 100644
--- a/src/xml.tsx
+++ b/src/xml.tsx
@@ -54,9 +54,12 @@ export function SvgAst({ ast, override }: AstProps) {
   const { props, children } = ast;
 
   const Svg = tags.svg;
+  const cleanedOverrideProps = Object.fromEntries(
+    Object.entries(override || {}).filter(([_, value]) => value !== undefined)
+  );
 
   return (
-    <Svg {...props} {...override}>
+    <Svg {...props} {...cleanedOverrideProps}>
       {children}
     </Svg>
   );