البوابات وحصر التركيز والإغلاق بمفتاح Escape

الهدف: بناء نوافذ منبثقة تعمل للجميع.

• استخدم Portal داخل body
• تحافظ مصيدة التركيز على بقاء التنقل بلوحة Tab داخل النافذة
• استخدم Escape/الخلفية للإغلاق

• استخدم role="dialog" + aria-modal="true"
• ركّز على أول عنصر تفاعلي عند الفتح
• أعد التركيز إلى العنصر الذي فتح النافذة عند الإغلاق

صيّر مربع الحوار عبر portal ليظهر فوق كل العناصر الأخرى.

ركّز تلقائيًا على الزر الأول واحصر التنقل بمفتاح Tab داخل مربع الحوار.

أغلق النافذة باستخدام Escape أو بالنقر على الخلفية، وأعد التركيز إلى زر الفتح.

• أضف role="dialog" وaria-modal="true"
• ركّز على أول عنصر تحكم عند الفتح، ثم أعد التركيز إلى العنصر الذي فتح النافذة عند الإغلاق
• عالج الضغط على Escape والنقر على الخلفية

الخلاصة: صيّر النوافذ المنبثقة عبر portal، وأبقِ التركيز داخلها، وأتح للمستخدمين إغلاقها باستخدام Escape أو الخلفية، مع إعادة التركيز إلى العنصر الذي فتحها.