Wraps your app to provide global reading direction.
Enables all primitives to inherit global reading direction.
Install the component from your command line.
npm install @radix-ui/react-direction
Import the component.
import { DirectionProvider } from '@radix-ui/react-direction';
export default () => <DirectionProvider />;
When creating localized apps that require right-to-left (RTL) reading direction, you need to wrap your application with the DirectionProvider component to ensure all of the primitives adjust their behavior based on the dir prop.
| Prop | Type | Default |
|---|---|---|
dir | enum |
Use the direction provider.
import { DirectionProvider } from '@radix-ui/react-direction';
export default () => (
<DirectionProvider dir="rtl">{/* your app */}</DirectionProvider>
);