Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support Directional View Transitions #1375

Draft
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

jbarrieault
Copy link

@jbarrieault jbarrieault commented Mar 4, 2025

Addresses #1374

This adds support for setting the direction of visit's view transition, and applies the logical direction when navigating stack history.

Example

Annotate an anchor tag with its logical direction, which will be applied to the view transition.

<!-- /cars/1/offers.html -->

<!-- equivalent to: Turbo.visit("/cars/1", { direction: "back" }) -->
<a href="/cars/1" `data-turbo-visit-direction="back"` />

After visiting the above link, subsequently using the browser's back button will apply a forward view transition. The end result is that the original as well as subsequent back/forward button visits will perform a view transition using the intuitive direction of the navigation.

TODO

  • more testing
  • write tests?

@jbarrieault jbarrieault force-pushed the jb/view-transition-direction branch from a07557c to 2d26172 Compare March 5, 2025 14:51
…rection and apply it appropriately according to whether traveling forward or backward in history stack.

This de-couples a visit's history direction from its view transition direction. Multi-page applications may now implement coherent view transitions using any combination of turbo links and the browser's back & forward buttons.
@jbarrieault jbarrieault force-pushed the jb/view-transition-direction branch from 2d26172 to f3979cd Compare March 5, 2025 15:01
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

1 participant