`<Svg>` component does not crop it's children on MacOS

[latekvo]

Description

On MacOS, <Svg> components do not crop their children properly.

Android	MacOS

Minimal repro

import React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import Svg, { Circle } from 'react-native-svg';

export default function SvgExample() {
  return (
    <View style={styles.container}>
      <Text style={styles.header}>SvgView with SvgView with ViewBox</Text>
      <View style={{ backgroundColor: 'tomato' }}>
        <Svg
          height="250"
          width="250"
          viewBox="-50 -50 150 150"
          onPress={() => console.log('SVG: clicked viewbox container')}>
          <Svg
            height="250"
            width="250"
            viewBox="-300 -300 600 600"
            onPress={() => console.log('SVG: clicked inner viewbox container')}>
            <Circle
              r="300"
              fill="green"
              onPress={() => console.log('SVG: clicked viewbox circle')}
            />
          </Svg>
        </Svg>
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    alignItems: 'center',
    justifyContent: 'center',
    marginBottom: 48,
  },
  header: {
    fontSize: 18,
    fontWeight: 'bold',
    margin: 10,
  },
});

Steps to reproduce

1. Open the repro on Android
2. Open the repro on MacOS
3. See how on MacOS, the yellow and green shapes overflow out of their parent

Snack or a link to a repository

Latest: https://github.com/software-mansion/react-native-gesture-handler/blob/main/apps/common-app/src/release_tests/svg/index.tsx

Permalink: https://github.com/software-mansion/react-native-gesture-handler/blob/3513778ddef1a01357163d85b12cc3db224abedb/apps/common-app/src/release_tests/svg/index.tsx

SVG version

15.11.2

React Native version

0.79.2

Platforms

macOS

JavaScript runtime

Hermes

Workflow

Expo Dev Client

Architecture

Fabric (New Architecture)

Build type

Debug app & dev bundle

Device

Real device

Device model

MacBook

Acknowledgements

Yes

[github-actions]

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?