How can I invert the screen transition in react-navigation?

Question

I'm trying to make my ios and android screen transitions go from right to left rather than the default left to right. I can accomplish the latter by using forHorizontalIOS:

<Stack.Screen
  name="Profile"
  component={Profile}
  options={{
    title: 'Profile',
    cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS,
  }}
/>;

but not sure how to flip that animation.

In the docs there's an example on how the animation is actually setup for the left to right transition:

const forSlide = ({ current, next, inverted, layouts: { screen } }) => {
  const progress = Animated.add(
    current.progress.interpolate({
      inputRange: [0, 1],
      outputRange: [0, 1],
      extrapolate: 'clamp',
    }),
    next
      ? next.progress.interpolate({
          inputRange: [0, 1],
          outputRange: [0, 1],
          extrapolate: 'clamp',
        })
      : 0
  );

  return {
    cardStyle: {
      transform: [
        {
          translateX: Animated.multiply(
            progress.interpolate({
              inputRange: [0, 1, 2],
              outputRange: [
                screen.width, // Focused, but offscreen in the beginning
                0, // Fully focused
                screen.width * -0.3, // Fully unfocused
              ],
              extrapolate: 'clamp',
            }),
            inverted
          ),
        },
      ],
    },
  };
};

And I tried playing around with the output ranges but I don't really get the desired result. If I set the output ranges there to be [1,0] instead of [0,1] I can get the desired transition effect but the actual next screen is blank and I can't return to the previous screen.

Any help is appreciated, thanks.