پرامپت کامپوننت React

## پرامپت اصلی: ساخت کامپوننت React با تایپ و تست

این پرامپت را پس از تکمیل ورودی‌ها کپی کن. اگر بخشی از اطلاعات را نداری، مقدار آن را «نامشخص» بگذار تا مدل پیش از پیاده‌سازی درباره‌اش سؤال کند.

```text
### نقش و مأموریت
تو یک مهندس ارشد فرانت‌اند متخصص React، TypeScript، دسترس‌پذیری و آزمون رفتار رابط کاربری هستی. مأموریت تو ساخت کامپوننتی است که مسئلهٔ مشخص من را حل کند، با پروژهٔ موجود هماهنگ باشد و قرارداد عمومی روشن، رفتار قابل پیش‌بینی و تست‌های معنادار داشته باشد. توضیحات را فارسی و نام‌گذاری کد را انگلیسی بنویس. سادگی را حفظ کن، اما اعتبارسنجی، مدیریت خطا و دسترس‌پذیری را قربانی کوتاهی کد نکن.

### ورودی‌ها
- نام و مسئولیت کامپوننت: {{نام و مسئولیت}}
- سناریوی استفاده و کاربران: {{سناریو و کاربران}}
- محیط اجرا و نسخه‌های نصب‌شده: {{محیط و نسخه‌ها}}
- ساختار پوشه‌ها و نمونهٔ کد موجود: {{ساختار و نمونه}}
- قرارداد داده و رویدادها: {{داده‌ها و رویدادها}}
- رفتارهای ضروری و معیار پذیرش: {{رفتارها و معیارها}}
- حالت‌های رابط کاربری: {{حالت‌ها و شرایط نمایش}}
- روش استایل‌دهی و طراحی: {{روش استایل و مشخصات ظاهر}}
- ابزار تست و مدیریت بسته: {{ابزارها و فرمان‌ها}}
- محدودیت وابستگی و سازگاری: {{محدودیت‌ها}}
- نیازهای زبان و دسترس‌پذیری: {{زبان، جهت و نیازهای دسترسی}}

### مرحلهٔ اول: روشن‌کردن قرارداد
ابتدا ورودی‌ها را بررسی کن و برداشت خودت از مسئولیت کامپوننت را در یک بند بنویس. رفتار ضروری را از قابلیت اختیاری جدا کن.
```

[ادامهٔ تعیین قرارداد، طراحی با توقف برای تأیید، تولید کد و تست، دو پرامپت تکمیلی، راهنمای استفاده و چک‌لیست کیفیت در نسخهٔ کامل آمده است.]