direction
Resolve and provide RTL/LTR direction using the shared primitives direction context.
Philosophy
Direction is cross-cutting state. Instead of passing dir through every component manually, set it once at the boundary and let components/hooks resolve it predictably.
Installation
npx @gentleduck/cli add direction
npx @gentleduck/cli add direction
Usage
import { DIRECTION_DICTIONARY, DirectionProvider, useDirection } from '@/components/ui/direction'import { DIRECTION_DICTIONARY, DirectionProvider, useDirection } from '@/components/ui/direction'<DirectionProvider dir={DIRECTION_DICTIONARY.rtl}>{children}</DirectionProvider><DirectionProvider dir={DIRECTION_DICTIONARY.rtl}>{children}</DirectionProvider>API Reference
Exports
| Export | Type | Description |
|---|---|---|
DIRECTION_DICTIONARY | { ltr: 'ltr'; rtl: 'rtl' } | Canonical direction values |
DirectionProvider | React.FC<{ dir: 'ltr' | 'rtl'; children?: ReactNode }> | Provides direction to descendants |
useDirection | (localDir?: 'ltr' | 'rtl') => 'ltr' | 'rtl' | Resolves localDir -> context -> 'ltr' |
DirectionContext | React.Context<'ltr' | 'rtl' | undefined> | Underlying context object |