SSRProvider

When using SSR with React Aria, applications must be wrapped in an SSRProvider. This ensures that auto generated ids are consistent between the client and server.

Introduction#

SSRProvider should be used as a wrapper for the entire application during server side rendering. It works together with the useId hook to ensure that auto generated ids are consistent between the client and server by resetting the id internal counter on each request. See the server side rendering docs for more information.

Props#

Example#

import {SSRProvider} from '@react-aria/ssr';

<SSRProvider>
  <YourApp />
</SSRProvider>

import {SSRProvider} from '@react-aria/ssr';

<SSRProvider>
  <YourApp />
</SSRProvider>

import {SSRProvider} from '@react-aria/ssr';

<SSRProvider>
  <YourApp />
</SSRProvider>