diff --git a/.changeset/hip-wombats-exercise.md b/.changeset/hip-wombats-exercise.md new file mode 100644 index 0000000000..d30d37cbb6 --- /dev/null +++ b/.changeset/hip-wombats-exercise.md @@ -0,0 +1,11 @@ +--- +'astro': minor +--- + +ViewTransitions component renamed to ClientRouter + +The `` component has been renamed to ``. There are no other changes than the name. The old name will continue to work in Astro 5.x, but will be removed in 6.0. + +This change was done to clarify the role of the component within Astro's View Transitions support. Astro supports View Transitions APIs in a few different ways, and renaming the component makes it more clear that the features you get from the ClientRouter component are slightly different from what you get using the native CSS-based MPA router. + +We still intend to maintain the ClientRouter as before, and it's still important for use-cases that the native support doesn't cover, such as persisting state between pages. diff --git a/examples/starlog/src/components/BaseHead.astro b/examples/starlog/src/components/BaseHead.astro index bb2c64ee8b..34aff98fbf 100644 --- a/examples/starlog/src/components/BaseHead.astro +++ b/examples/starlog/src/components/BaseHead.astro @@ -1,5 +1,5 @@ --- -import { ViewTransitions } from 'astro:transitions'; +import { ClientRouter } from 'astro:transitions'; import SEO, { type Props as SEOProps } from './SEO.astro'; import { SiteTitle, SiteDescription } from '../consts'; @@ -17,4 +17,4 @@ const { title = SiteTitle, name = SiteTitle, description = SiteDescription, ...s rel="stylesheet" /> - + diff --git a/examples/view-transitions/src/layouts/Layout.astro b/examples/view-transitions/src/layouts/Layout.astro index 39a73bca09..fee2c9ef1e 100644 --- a/examples/view-transitions/src/layouts/Layout.astro +++ b/examples/view-transitions/src/layouts/Layout.astro @@ -1,6 +1,6 @@ --- import '../styles/styles.css'; -import { ViewTransitions } from 'astro:transitions'; +import { ClientRouter } from 'astro:transitions'; import Footer from '../components/Footer.astro'; import Nav from '../components/Nav.astro'; @@ -20,7 +20,7 @@ const { title } = Astro.props as Props; {title} - +
diff --git a/packages/astro/client.d.ts b/packages/astro/client.d.ts index ee91b09bb7..e828124a10 100644 --- a/packages/astro/client.d.ts +++ b/packages/astro/client.d.ts @@ -116,8 +116,12 @@ declare module 'astro:transitions' { export const fade: TransitionModule['fade']; export const createAnimationScope: TransitionModule['createAnimationScope']; - type ViewTransitionsModule = typeof import('./components/ViewTransitions.astro'); - export const ViewTransitions: ViewTransitionsModule['default']; + type ClientRouterModule = typeof import('./components/ClientRouter.astro'); + /** + * @deprecated The ViewTransitions component has been renamed to ClientRouter + */ + export const ViewTransitions: ClientRouterModule['default']; + export const ClientRouter: ClientRouterModule['default']; } declare module 'astro:transitions/client' { diff --git a/packages/astro/components/ViewTransitions.astro b/packages/astro/components/ClientRouter.astro similarity index 100% rename from packages/astro/components/ViewTransitions.astro rename to packages/astro/components/ClientRouter.astro diff --git a/packages/astro/e2e/fixtures/dev-toolbar/src/layout/Layout.astro b/packages/astro/e2e/fixtures/dev-toolbar/src/layout/Layout.astro index 35c96e3e02..780ada07b7 100644 --- a/packages/astro/e2e/fixtures/dev-toolbar/src/layout/Layout.astro +++ b/packages/astro/e2e/fixtures/dev-toolbar/src/layout/Layout.astro @@ -1,10 +1,10 @@ --- -import { ViewTransitions } from 'astro:transitions'; +import { ClientRouter } from 'astro:transitions'; --- View Transition Test - + - -