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

التباين

يُقاس التباين من القيم الحقيقية لمتغيّرات التصميم في كل وضع، كجزء من البناء. وكل قيمة تقع ضمن 0.15 من الحد تُعدّ راسبة.

حجم الهدف

لا يقل أي عنصر تفاعلي عن 24 × 24 بكسل CSS، ويكبر إلى 44 مع مؤشر اللمس وغيره من المؤشرات غير الدقيقة.

import { TOUCH_TARGET } from 'topclassui/classes'

export function SaveButton() {
  return <button type="button" className={TOUCH_TARGET}>حفظ</button>
}

الصنف المشترك الذي يحمله كل عنصر تحكم، ويمكن أن تحمله عناصر التحكم الخاصة بك أيضًا. قيمته: min-h-[var(--tc-target-min,24px)] min-w-[var(--tc-target-min,24px)] pointer-coarse:min-h-[var(--tc-target-coarse,44px)] pointer-coarse:min-w-[var(--tc-target-coarse,44px)]

لكل سحب مسار عبر لوحة المفاتيح

WCAG 2.5.7. يستجيب Slider لمفاتيح الأسهم. ويعرض كلٌّ من Drawer وToast زر إغلاق دائمًا.

التركيز ظاهر دائمًا

حلقة تركيز واحدة على كل عنصر تحكم: إطار CSS خارجي (outline) مع إزاحة، فتُظهر الفجوة الخلفية الحقيقية على أي سطح. ويبلغ --tc-ring تباين 3:1 على كل سطح.

import { FOCUS_RING } from 'topclassui/classes'

export function HomeLink() {
  return <a href="/ar" className={FOCUS_RING}>الرئيسية</a>
}

قيمته: outline-none focus-visible:outline-solid focus-visible:outline-(length:--tc-ring-width) focus-visible:outline-offset-(length:--tc-ring-offset) focus-visible:outline-ring

الأنواع تفرض التسميات

يحتاج Input خارج Field إلى id أو aria-label أو aria-labelledby، ويرفض TypeScript أي حقل بدونها.

<Input placeholder="البريد الإلكتروني" />
// Type error: id, aria-label or aria-labelledby is required

import { Field } from 'topclassui/field'
import { Input } from 'topclassui/input'

export function Email() {
  return (
    <Field name="email" label="البريد الإلكتروني">
      {(control) => <Input {...control} type="email" />}
    </Field>
  )
}

الفحص الآلي والفحص اليدوي

الثغرات المعروفة

يُقاس التباين في كل بناء. وتُفحص axe وحجم الهدف وحلقة التركيز والنص الطويل داخل عنصر التحكم في متصفح حقيقي على كل مثال، في 3 أوضاع واتجاهين، وللمكوّنات التفاعلية اختبارات للوحة المفاتيح. أما قارئات الشاشة (NVDA وVoiceOver) والألوان القسرية فتُفحص يدويًا، ولم يُنجز ذلك بعد.