fix: Check cardStyleInterpolator name to allow for custom animation a…

…s well (#11209)

We got a custom `cardStyleInterpolator` in our app that actually calls
[forModalPresentationIOS](https://github.com/react-navigation/react-navigation/blob/main/packages/stack/src/TransitionConfigs/CardStyleInterpolators.tsx#L93)
but we add some own customizations to it. This worked fine in `v5` of
react-navigation, and started to act weird after the upgrade to `v6`,
the screen under the modal was displayed right until the animation was
finished, then the screen under disappeared, which is unintended.

This PR just checks for the name instead. Making it do the same as this
check:
https://github.com/react-navigation/react-navigation/blob/main/packages/stack/src/views/Stack/Card.tsx#L580
and will allow for custom cardStyleInterpolators.

This can be reproduced by creating your own cardStyleIntepolator and
then call `forModalPresentationIOS`:

```ts
import type {StackCardInterpolationProps} from "@react-navigation/stack";
import {CardStyleInterpolators} from "@react-navigation/stack";

export const forModalPresentationIOS = ({
    index,
    current,
    next,
    inverted,
    layouts,
    insets,
    ...rest
}: StackCardInterpolationProps) => {
    const defaultAnimations = CardStyleInterpolators.forModalPresentationIOS({
        index,
        current,
        next,
        inverted,
        layouts,
        insets,
        ...rest,
    });
    return defaultAnimations
};


const ModalStack = createStackNavigator<ModalStackParamList>();

export function ModalNavigator() {
    return (
        <ModalStack.Navigator>
            <ModalStack.Screen
                name='Modal'
                component={() => <View />}
                options={{
                    gestureEnabled: true,
                    gestureDirection: "vertical",
                    cardOverlayEnabled: true,
                    cardStyleInterpolator: forModalPresentationIOS
               }}
            />
        </ModalStack.Navigator>
}
```

packages/stack/src/views/Stack/CardStack.tsx

@@ -18,10 +18,7 @@ import {
 } from 'react-native';
 import type { EdgeInsets } from 'react-native-safe-area-context';
 
-import {
-  forModalPresentationIOS,
-  forNoAnimation as forNoAnimationCard,
-} from '../../TransitionConfigs/CardStyleInterpolators';
+import { forNoAnimation as forNoAnimationCard } from '../../TransitionConfigs/CardStyleInterpolators';
 import {
   DefaultTransition,
   ModalFadeTransition,
@@ -523,8 +520,10 @@ export default class CardStack extends React.Component<Props, State> {
           : getIsModalPresentation(options.cardStyleInterpolator)
           ? i !==
             scenes
-              .map((scene) => scene.descriptor.options.cardStyleInterpolator)
-              .lastIndexOf(forModalPresentationIOS)
+              .map(
+                (scene) => scene.descriptor.options.cardStyleInterpolator.name
+              )
+              .lastIndexOf('forModalPresentationIOS')
           : true,
       } = options;