Bug: ViewTransition fails to animate shared elements inside RTL layouts

When using React's ViewTransition component in a Next.js application, shared element transitions do not work if the document or any ancestor element has dir="rtl".

The exact same code works correctly when dir="ltr" is used.

As a workaround, wrapping the transition element in an ancestor with dir="ltr" restores the expected behavior.

React version:

• react: 19.2.0
• react-dom: 19.2.0
• next: 16.2.9

Steps To Reproduce

1. Create a Next.js application using React 19 and enable View Transitions.
2. Set <html dir="rtl"> in the root layout.
3. Create two pages with a shared <ViewTransition name="box">.
4. Navigate between the pages.
5. Observe that no shared element transition occurs.
6. Change dir="rtl" to dir="ltr" and repeat the navigation.

Link to code example:

// app/layout.tsx
export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html dir="rtl">
      <body>{children}</body>
    </html>
  );
}

The current behavior

No shared element transition animation is performed when navigating between pages while dir="rtl" is applied. The navigation happens immediately without any transition.

The expected behavior

Shared element transitions should work regardless of the text direction (ltr or rtl) applied to the document or ancestor elements.