مستندات
از نصب تا Admin Kit؛ هر صفحه نمونهٔ زنده و کد قابل‌کپی دارد.
- شروع سریعBana UI بدون وابستگی و بدون مرحله Build قابل استفاده است. سه فایل: یک CSS، یک JS اختیاری،
- روش‌های نصبBana UI را با npm، Yarn، pnpm، Bun، Composer، NuGet، CDN یا مستقیم از Git بگیرید. همهٔ روش
- بسته‌بندی ماژولارفایل پیش‌فرض bana.js همه چیز را دارد. اگر فقط به هسته نیاز دارید، هسته را جدا بگیرید و ماژ
- پالت رنگیرنگها در فضای OKLCH ساخته شدهاند، یعنی پلههای همشماره در همه خانوادهها روشنایی ادراکی
- تمها و حالت تیرهحالت (روشن/تیره)، پالت رنگی و تراکم سه محور مستقلاند؛ هر ترکیب پشتیبانی میشود. از نوار ب
- Design Tokenهاهمه فاصلهها، گوشهها، سایهها و حرکتها از Token میآیند؛ شبکه پایه ۴ پیکسل است.
- دکمهروی خود <button> و لینک <a> کار میکند؛ div قابلکلیک پشتیبانی نمیشود. اندازه تماس حداقل
- فرم و ورودیهاورودیها از کنترلهای Native مرورگر استفاده میکنند؛ فقط ظاهر عوض شده و رفتار صفحهکلید، A
- اجزای محتوایی
- ناوبری
- Dialog، Drawer و TabsDialog و Drawer روی عنصر native <dialog> ساخته شدهاند: تله فوکوس، Esc و بازگشت فوکوس را خ
- Popover و Menuروی Popover API بومی مرورگر ساخته شدهاند: لایه بالا (top layer)، بستن با کلیک بیرون و Esc
- Command Menuپنجره جستوجوی سریع با Ctrl + K (در مک ⌘ + K ). جستوجو مخصوص فارسی است: «ي/ی»، «ك/ک»، ارق
- آیکونهاآیکونها SVG هستند (نه Icon Font)، با DOM API ساخته میشوند (نه innerHTML)، رنگشان از curr
- Data Tableیک جدول معمولی را در <div ui="data-table"> بگذارید تا مرتبسازی، جستوجوی فارسیمحور و صفح
- Comboboxیک <select> معمولی با data-combobox جستوجوی هنگام تایپ میگیرد. خود select مخفی میماند و
- اعتبارسنجی فرمبا افزودن data-validate به <form> ، اعتبارسنجی Native مرورگر با پیامهای فارسی، اعتبارسنج
- Schemaفرم را یکبار با JSON توصیف کنید؛ هم فرم کامل ساخته میشود و هم یک تابع validate() دارید ک
- Safe Actionلایهای برای فرمها و دکمههایی که به سرور درخواست میزنند. بدون JavaScript، فرم همان فرم
- Uploadروی <input type="file"> معمولی ساخته شده است. نوع، حجم و تعداد فایل پیش از هر ارسالی بررسی
- Adapterهای Backendپوشهی server/ بدون هیچ وابستگی (فقط node:crypto )، سمت سرورِ درخواستهایی را که ماژولهای