Bug: 'mirrored' property causes app crash on Android

[Luc2000]

Problem Description

When using the mirrored property on Phosphor React Native icons, the application crashes specifically on Android. The same code works normally on iOS.

Reproduction Steps

1. Add a Phosphor icon to your React Native component
2. Set the mirrored={true} property or simply mirrored
3. Run the application on Android
4. Observe that the app crashes when trying to render the component

Code Example

import { Lightning } from 'phosphor-react-native';

function MyComponent() {
  return (
    <Lightning size={14} color="#F54C40" weight="fill" mirrored />
  );
}

Environment

• Phosphor React Native: version 2.3.1 - but also in 2.2.1
• React Native: version "^0.75.0"
• Android: tested on multiple devices/versions
• iOS: works correctly

Workaround

As a temporary solution, you can use style transformation to mirror the icon:

import { View } from 'react-native';
import { Lightning } from 'phosphor-react-native';

function MyComponent() {
  return (
    <View style={{ transform: [{ scaleX: -1 }] }}>
      <Lightning size={14} color="#F54C40" weight="fill" />
    </View>
  );
}

Additional Information

This bug prevents the use of mirrored icons in applications that need to run on Android, creating inconsistencies between platforms and requiring platform-specific implementations.

[mrkpatchaa]

Hi @Luc2000 thanks for reporting this.
Do you have the same error when you import your icon like this?

import Lightning from 'phosphor-react-native/src/icons/Lightning';