diff --git a/js/components/src/lib/theme/theme.tsx b/js/components/src/lib/theme/theme.tsx
index 46b2bbec..c8b9c9d5 100644
--- a/js/components/src/lib/theme/theme.tsx
+++ b/js/components/src/lib/theme/theme.tsx
@@ -475,13 +475,20 @@ export function ThemeProvider({
     ],
   );
 
+  const parentTheme = useContext(ThemeContext);
+  const isRoot = !parentTheme;
+
   return (
     <ThemeContext.Provider value={value}>
-      <GestureHandlerRootView>
-        {children}
-        <PortalHost />
-        <ToastProvider />
-      </GestureHandlerRootView>
+      {isRoot ? (
+        <GestureHandlerRootView>
+          {children}
+          <PortalHost />
+          <ToastProvider />
+        </GestureHandlerRootView>
+      ) : (
+        children
+      )}
     </ThemeContext.Provider>
   );
 }