diff --git a/next-env.d.ts b/next-env.d.ts index 3cd7048ed94..52e831b4342 100644 --- a/next-env.d.ts +++ b/next-env.d.ts @@ -1,6 +1,5 @@ /// /// -/// // NOTE: This file should not be edited -// see https://nextjs.org/docs/app/api-reference/config/typescript for more information. +// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information. diff --git a/src/components/Icon/IconExperimental.tsx b/src/components/Icon/IconExperimental.tsx index 0bba612ebca..c0f69e3f95f 100644 --- a/src/components/Icon/IconExperimental.tsx +++ b/src/components/Icon/IconExperimental.tsx @@ -6,7 +6,7 @@ import {memo} from 'react'; export const IconExperimental = memo< JSX.IntrinsicElements['svg'] & {title?: string; size?: 's' | 'md'} ->(function IconCanary( +>(function IconExperimental( {className, title, size} = { className: undefined, title: undefined, diff --git a/src/components/MDX/MDXComponents.tsx b/src/components/MDX/MDXComponents.tsx index 36774ad4b27..afcb9c265e6 100644 --- a/src/components/MDX/MDXComponents.tsx +++ b/src/components/MDX/MDXComponents.tsx @@ -37,6 +37,7 @@ import {finishedTranslations} from 'utils/finishedTranslations'; import ErrorDecoder from './ErrorDecoder'; import {IconCanary} from '../Icon/IconCanary'; +import {IconExperimental} from 'components/Icon/IconExperimental'; function CodeStep({children, step}: {children: any; step: number}) { return ( @@ -130,7 +131,7 @@ const ExperimentalBadge = ({title}: {title: string}) => ( className={ 'text-base font-display px-1 py-0.5 font-bold bg-gray-10 dark:bg-gray-60 text-gray-60 dark:text-gray-10 rounded' }> - diff --git a/src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md b/src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md index 33333407389..c7f74009165 100644 --- a/src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md +++ b/src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md @@ -11465,6 +11465,14 @@ _For more background on how we built View Transitions, see: [#31975](https://git ## Activity {/*activity*/} + + +**`` is now available in React’s Canary channel.** + +[Learn more about React’s release channels here.](/community/versioning-policy#all-release-channels) + + + In [past](/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022#offscreen) [updates](/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024#offscreen-renamed-to-activity), we shared that we were researching an API to allow components to be visually hidden and deprioritized, preserving UI state with reduced performance costs relative to unmounting or hiding with CSS. We're now ready to share the API and how it works, so you can start testing it in experimental React versions. diff --git a/src/content/reference/react/Activity.md b/src/content/reference/react/Activity.md index 09b79c79f0b..c7d513afc32 100644 --- a/src/content/reference/react/Activity.md +++ b/src/content/reference/react/Activity.md @@ -1,21 +1,15 @@ --- title: -version: experimental +version: canary --- - + -**This API is experimental and is not available in a stable version of React yet.** +**The `` API is currently only available in React’s Canary and Experimental channels.** -You can try it by upgrading React packages to the most recent experimental version: +[Learn more about React’s release channels here.](/community/versioning-policy#all-release-channels) -- `react@experimental` -- `react-dom@experimental` -- `eslint-plugin-react-hooks@experimental` - -Experimental versions of React may contain bugs. Don't use them in production. - - + diff --git a/src/sidebarReference.json b/src/sidebarReference.json index 59f472084e2..18fbd40979d 100644 --- a/src/sidebarReference.json +++ b/src/sidebarReference.json @@ -107,7 +107,7 @@ { "title": "", "path": "/reference/react/Activity", - "version": "experimental" + "version": "canary" }, { "title": "",