useRTL

Return a boolean indicating whether the page is in RTL (right-to-left) mode with the option to observe a specific element.

• @param options - Configurable options
• @returns - true if document or local directionality is RTL
• false if document or local directionality is LTR
• undefined on initial render / server-side

Example

const ref = useRef<HTMLUListElement>(null)
 
const isGlobalRTL = useRTL()
const isLocalRTL = useRTL({ ref })
 
return (
  <ul ref={ref} dir="rtl">
    <li>Global: {isGlobalRTL ? 'RTL' : 'LTR'}</li>
    <li>Local: {isLocalRTL ? 'RTL' : 'LTR'}</li>
  </ul>
)