55 lines
1.5 KiB
TypeScript
55 lines
1.5 KiB
TypeScript
"use client"
|
||
|
||
import * as React from "react"
|
||
|
||
import {
|
||
useTranslation,
|
||
type Translations,
|
||
} from "@/components/language-selector"
|
||
import { Separator } from "@/styles/radix-nova/ui-rtl/separator"
|
||
|
||
const translations: Translations = {
|
||
en: {
|
||
dir: "ltr",
|
||
values: {
|
||
title: "shadcn/ui",
|
||
subtitle: "The Foundation for your Design System",
|
||
description:
|
||
"A set of beautifully designed components that you can customize, extend, and build on.",
|
||
},
|
||
},
|
||
ar: {
|
||
dir: "rtl",
|
||
values: {
|
||
title: "shadcn/ui",
|
||
subtitle: "الأساس لنظام التصميم الخاص بك",
|
||
description:
|
||
"مجموعة من المكونات المصممة بشكل جميل يمكنك تخصيصها وتوسيعها والبناء عليها.",
|
||
},
|
||
},
|
||
he: {
|
||
dir: "rtl",
|
||
values: {
|
||
title: "shadcn/ui",
|
||
subtitle: "הבסיס למערכת העיצוב שלך",
|
||
description:
|
||
"סט של רכיבים מעוצבים בצורה יפה שאתה יכול להתאים אישית, להרחיב ולבנות עליהם.",
|
||
},
|
||
},
|
||
}
|
||
|
||
export function SeparatorRtl() {
|
||
const { dir, t } = useTranslation(translations, "ar")
|
||
|
||
return (
|
||
<div className="flex max-w-sm flex-col gap-4 text-sm" dir={dir}>
|
||
<div className="flex flex-col gap-1.5">
|
||
<div className="leading-none font-medium">{t.title}</div>
|
||
<div className="text-muted-foreground">{t.subtitle}</div>
|
||
</div>
|
||
<Separator />
|
||
<div>{t.description}</div>
|
||
</div>
|
||
)
|
||
}
|