صف سعر الصرف

تجريبي

احصل على Ritla UI

زوج عملات بسعره وتغيّره اليوم ومنحنى صغير، والصف كله رابط إلى تفاصيل السعر.

افتح في Figma

المعاينة

«معكوس» هو المحتوى الإنجليزي نفسه من اليمين إلى اليسار، ليفصل خطأ الاتجاه عن خطأ الترجمة.

التثبيت

أضف المكوّن
$ npx ritla add fx-rate-row
ويعمل أيضًا مع shadcn: npx shadcn@latest add @ritla/fx-rate-row
الاعتماديات التي يضيفها
@phosphor-icons/react
أو انسخه يدويًا
التثبيت اليدوي ينسخ مصدر المكوّن إلى مشروعك. المصدر يأتي مع ترخيص Ritla UI، وأداة سطر الأوامر هي الطريق الأقصر إلى الملفات نفسها.

الاستخدام

fx-rate-row.tsx

import { FxRateRow } from "@/components/ui/fx-rate-row";<FxRateRow  href="/rates/sar-usd"  base={{ code: "SAR", country: "SA" }}  quote={{ code: "USD", country: "US" }}  rate={0.2666}  change={0.12}  chart={recentRates}/>

مرجع الخصائص

FxRateRow

الخاصية	النوع	الافتراضي	الوصف
`base / quote`	`{ code, country }`	لا يوجد	رمز العملة والدولة التي يمثّلها علمها.
`rate`	`number`	لا يوجد	كم يشتري واحد من الأساس من المقابل؛ يُعرض بأربع خانات.
`change`	`number`	لا يوجد	تغيّر اليوم بالنسبة المئوية: الوسم ولون المنحنى.
`chart`	`number[]`	لا يوجد	الأسعار الأخيرة، الأقدم أولًا. زخرفي: التغيّر يقول الاتجاه.
`pair`	`ReactNode`	`"SAR to USD"`	سطر الزوج بلغة الصفحة.
`href`	`string`	لا يوجد	يفتح تفاصيل السعر.

إمكانية الوصول

لوحة المفاتيح

المفاتيح مكتوبة للاتجاه من اليسار إلى اليمين. في الاتجاه من اليمين يتبادل السهمان دورهما: السهم المتجه مع اتجاه القراءة ينقلك إلى الأمام.

المفتاح	ما يفعله
`Enter`	يفتح تفاصيل السعر.

ARIA

الصف رابط واحد يُقرأ بنصه: الزوج والسعر والتغيّر. الأعلام والمنحنى زخرفية؛ مرّر aria-label لاسم أطول.

ملاحظات العربية والاتجاه

ينعكس

الأعلام في بداية السطر من اليمين والوسم في نهايته يسارًا.
السهم يشير إلى اليسار، نحو التالي.

لا ينعكس

علم العملة المقابلة يبقى فوق علم الأساس في الزاوية نفسها، فيُقرأ الزوج بالترتيب نفسه في اللغتين.
سطر السعر «1 SAR = 0.2666 USD» والمنحنى يبقيان من اليسار إلى اليمين.

الأرقام: التغيّر يتبع إعداد الأرقام؛ سطر السعر يبقى بالأرقام اللاتينية مع رموز العملات اللاتينية.
الخط العربي: body-16 Semibold للزوج وbody-14 للسعر؛ السطر العربي أطول قليلًا فيرتفع الصف بضعة بكسلات.