فهرست مستندات پروژه
صفحهکلید و دسترسپذیری
ورودی را نامگذاری کنید و رفتار صفحهکلید و نکات دسترسپذیری در سفارشیسازی را بشناسید.
برچسب انتخابگر
ماژول اصلی را وارد کنید و یک برچسب دیدنی بدهید:
<label for="birth-date">تاریخ تولد</label>
<intl-datepicker id="birth-date" name="birthDate" locale="en-GB"
allow-input caption-layout="dropdown"
min="1900-01-01" max="2026-03-15" value="1990-06-17"
required></intl-datepicker>
این برچسب به combobox داخلی نام دسترسپذیر میدهد. aria-label روی میزبان هم میتواند نام را تعیین کند و بر متن برچسب متصل اولویت دارد. placeholder راهنماست و جای برچسب را نمیگیرد. ورودی سفارشی به نام و وضعیت مستقل نیاز دارد.
پنجره تقویم نقش dialog دارد و پنل درونصفحهای نقش group. جدول روزها با عنوان ماه نامگذاری میشود و نام کامل روزهای هفته را در اختیار ابزارهای کمکی میگذارد. سلولهای انتخابشده وضعیت انتخاب دارند و امروز با aria-current="date" مشخص میشود. یک ناحیه زنده پایدار با اولویت ملایم، انتخابها، جابهجایی ماه و برخی انتخابهای ردشده را اعلام میکند. اینها رفتارهای پیادهسازیشدهاند و به معنی تاییدیه برای همه ترکیبهای مرورگر و صفحهخوان نیستند.
کار با صفحهکلید
| کلید | محل | رفتار |
|---|---|---|
| Down یا Alt+Down | ورودی داخلی | باز کردن و فوکوس روی سلول جاری |
| Enter | ورودی دارای allow-input | تجزیه و انتخاب تاریخ تایپشده |
| Left و Right | جدول روزها | روز قبل و بعد؛ در راستبهچپ معکوس است |
| Up و Down | جدول روزها | هفت روز عقب و جلو |
| Home و End | جدول روزها | ابتدا و انتهای هفته تنظیمشده |
| PageUp و PageDown | جدول روزها | ماه قبل و بعد |
| Shift+PageUp و Shift+PageDown | جدول روزها | سال قبل و بعد |
| Enter یا Space | سلول روز، ماه یا سال | انتخاب در صورت مجاز بودن |
| کلیدهای جهت | نمای ماه و سال | حرکت بین سلولها؛ ۳ ستون برای ماه و ۴ ستون برای سال |
| Escape | پنجره | بستن، از جمله در نمای ماه و سال |
| Tab و Shift+Tab | پنجره | گردش فوکوس بین کنترلهای پنجره |
حرکت در جدول روزها، فوکوس را به min و max محدود میکند. روزهای غیرفعال میتوانند فوکوس بگیرند تا Enter دلیل غیرمجاز بودن را اعلام کند. اشاره ماوس بازه را ثبت نمیکند و وضعیت انتخاب اعلامشده را تغییر نمیدهد. پنل درونصفحهای Tab را محصور نمیکند و با Escape بسته نمیشود. در انتخابگر روز درونصفحهای، Escape از سلول ماه یا سال به نمای روز برمیگردد. در پنجره، پردازشگر Escape سند، پنل را هم میبندد.
هنگام بسته شدن پنجره، اگر فوکوس هنوز داخل انتخابگر باشد، به محرک بازکننده برمیگردد. اگر کاربر به جای دیگری رفته باشد، کامپوننت فوکوس را پس نمیگیرد. برنامهای که intl-close را لغو میکند باید راه قابل استفاده دیگری برای بستن داشته باشد.
تایپ تاریخ
allow-input تایپ را در ورودی داخلی یا slot فعال میکند. متن با Enter یا خروج فوکوس از کامپوننت ثبت میشود. راهنمای قالب نمایش داده میشود؛ متن نامعتبر همراه با خطا باقی میماند تا اصلاح یا پاک شود و در اعتبارسنجی badInput ایجاد میکند.
بخشهای تاریخ در تقویم فعال تفسیر میشوند. در انتخابگر شمسی، ۱۴۰۳/۰۱/۰۱ روز اول سال ۱۴۰۳ است و مقدار ISO برابر 2024-03-20 میدهد. این رفتار با value برنامهنویسی متفاوت است که روز میلادی ISO میپذیرد.
date-format یکی از auto، YMD، DMY یا MDY است. حالت خودکار از ترتیب محلی استفاده میکند؛ بخش دارای دستکم ۳ رقم هم به تشخیص سال کمک میکند. جداکنندهها شامل ممیز، نقطه، خط تیره و فاصلهاند. ورودی فشرده ۸ رقمی و چند مجموعه رقم بومی پذیرفته میشود؛ تاریخی که همه بخشهایش حداکثر ۲ رقم دارند، به دلیل ابهام رد میشود.
تایپ، یک روز را تجزیه و سپس همان انتخاب را به حالت جاری اعمال میکند. بازه کامل start/end، فهرست با ویرگول یا شناسه هفته ISO را تجزیه نمیکند. در حالت بازه، دو سر را جداگانه وارد کنید. برای ماه و سال، از پنل استفاده کنید یا یک روز کامل در دوره مورد نظر بدهید. تجزیه عددی است و زبان طبیعی یا همه قالبهای دوره ژاپنی را پشتیبانی نمیکند.
بررسی پس از سفارشیسازی
کادر فوکوس، تمایز خوانای حالت انتخاب و غیرفعال و برچسبهای کاربردی را حفظ کنید. سبکها قواعد رنگ اجباری و کاهش حرکت دارند. حتی اگر --idp-day-size کوچکتر باشد، هدف روز از ۲۴ پیکسل کوچکتر نمیشود؛ اندازه مناسب کاربران خود را انتخاب کنید.
پس از تغییر mapDays، پنهان کردن روزهای بیرونی، جایگزینی ورودی یا استفاده در پنجره modal، مسیر صفحهکلید را بررسی کنید. محتوای سفارشی باید مکمل نام دسترسپذیر روز باشد. اطلاعات ضروری رزرو را فقط در tooltip نگذارید. مسیرهای عمومی تغییر ظاهر در راهنمای ظاهر آمدهاند.