ConfigurationInteractive playground
DirectionProvider
Shared reading direction for LTR and RTL interfaces.
Preparing the playground…
Text and Markdown example
DirectionProvider · Example
1<DirectionProvider dir="rtl"><div dir="rtl" style={{width:320}}><Button>مرحبا</Button><p style={{marginTop:12}}>واجهة من اليمين إلى اليسار</p></div></DirectionProvider>How to use it
Use dir="rtl" for right-to-left languages. Your application must translate the content.
Import
React / Next.js
1import { DirectionProvider } from "@kivora/nextjs";Interactive examples run inside a component with "use client". The playground's Copy button includes the imports needed for the current example.
API reference 0.2.0
Types from the installed published version, including component properties and common HTML attributes. “Optional” does not imply a default value; omitting a property lets the component decide.
| Property | Type | Description |
|---|---|---|
children | ReactNode | Content or child elements of the component. |
className | string | Additional CSS classes to customize the element. |
dir | "ltr" | "rtl" | Interface reading direction. |
TypeScript definition
Review each component's properties and published declaration. Native and accessibility attributes are inherited from the element specified by its type.
DirectionProvider3 properties
DirectionProvider · TypeScript
1declare function DirectionProvider({ children, className, dir }: DirectionProviderProps): React.JSX.Element;API generated from @kivora/nextjs 0.2.0View package