Direction
Komponen provider yang menyetel arah teks (LTR/RTL) via konteks.
bun x bosia@latest add directionProvider konteks yang menyetel dir pada elemen wrapper dan memunculkan arah saat ini ke komponen turunan via useDirection(). Berguna untuk aplikasi yang mendukung bahasa kanan-ke-kiri seperti Arab, Ibrani, dan Persia.
Preview
Direction: LTR
This text follows the document direction.
مرحبًا بالعالم — Hello World
Props
| Prop | Type | Default |
|---|---|---|
direction |
"ltr" | "rtl" |
"ltr" |
Penggunaan
Provider
Bungkus konten Anda dengan DirectionProvider:
<script lang="ts">
import { DirectionProvider } from "$lib/components/ui/direction";
</script>
<DirectionProvider direction="rtl">
<p>This content flows right-to-left.</p>
</DirectionProvider>Membaca arah di komponen anak
Gunakan useDirection() untuk membaca arah saat ini dari konteks:
<script lang="ts">
import { useDirection } from "$lib/components/ui/direction";
const dir = useDirection(); // "ltr" | "rtl"
</script>
<p>Current direction: {dir}</p>