> ## Documentation Index
> Fetch the complete documentation index at: https://docs.twenty.com/llms.txt
> Use this file to discover all available pages before exploring further.

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

> ضع تسميات لعناصر التحكم، وحافظ على سلوك لوحة المفاتيح، واختبر واجهات Twenty UI المتاحة.

## نظرة عامة

تستخدم المكونات التفاعلية المُرحّلة العناصر الأساسية لـ Base UI للدلالات وسلوك لوحة المفاتيح. لا يزال تطبيقك يوفّر تسميات ذات معنى وأوصافًا ورسائل أخطاء وترتيب التركيز.

## ضع تسمية لكل عنصر تحكم

استخدم `Field.Label` مع إدخال لربط تسمية مرئية بعنصر التحكم. يوفر `Field.Description` نصًا داعمًا:

```tsx theme={null}
import { Field, Input } from 'twenty-ui/primitives/input';

export const EmailField = () => (
  <Field.Root>
    <Field.Label>Email</Field.Label>
    <Input type="email" name="email" required />
    <Field.Description>
      We send account updates to this address.
    </Field.Description>
    <Field.Error>Enter a valid email address.</Field.Error>
  </Field.Root>
);
```

استخدم [VisuallyHidden](https://docs.twenty.com/ar/ui/primitives/accessibility/visually-hidden.md) عندما ينبغي أن يظل النص الداعم متاحًا للتقنية المساعدة دون عرضه.

تكمل العناصر النائبة التسميات؛ ولا تحل محلها. بالنسبة إلى عنصر تحكم دون نص مرئي، وفّر اسمًا يمكن الوصول إليه باستخدام `aria-label` أو `aria-labelledby`.

## حافظ على السلوك الأصلي

استخدم خصائص حالة المكوّن وتغييره، مثل `checked` و`onCheckedChange` في `Switch`. أبقِ مؤشرات التركيز مرئية. عند استخدام `render` لاستبدال عنصر، حافظ على المرجع ومعالجات الأحداث والسمات التي يمررها المكوّن إليه.

لا يمكن تغيير عنصر التحكم المعطّل، ويُستبعد عمومًا من التنقل باستخدام لوحة المفاتيح وإرسال النماذج. يحتفظ عنصر التحكم للقراءة فقط بقيمته وقد يظل قابلاً للتركيز؛ اختر الحالة التي تتوافق مع التفاعل الذي تنويه.

## اختبر الواجهة الكاملة

تحقق من التنقل باستخدام لوحة المفاتيح، والتسميات، وإعلانات الأخطاء، وحركة التركيز في التراكبات، والتكبير في السياق الذي يُستخدم فيه المكوّن. تحقق من التباين في لوحتي الألوان كلتيهما وبعد تطبيق تجاوزات الرموز المخصصة.

تحتوي قصص Twenty UI على فحوصات للتفاعل وإمكانية الوصول الآلية. لا تزال بعض القصص تؤجل فحوصات تباين الألوان، لذا لا تثبت تلك الفحوصات الامتثال الكامل لإمكانية الوصول لتطبيق ما.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.