Components
RTL Support
This guide helps you to enable the RTL(Right-to-Left) localized support for your app.
Setup
Install Radix Direction
Run the following command to add the Radix Direction provider to hande the direction support for your components:
npm install @radix-ui/react-direction
Add RTL Support
Wrap your application with the DirectionProvider
component.
This ensures that all components adapt their behavior according to the dir
prop.
import { DirectionProvider } from '@radix-ui/react-direction';
export default () => (
<html dir="rtl">
<body>
<DirectionProvider dir="rtl">{/* Your app */}</DirectionProvider>
</body>
</html>
);