ran
فارسی
متن‌باز · مجوز MIT

کتابخانهٔ رابط کاربری وب‌کامپوننت و ابزارهای تایپ‌شده

ranui چهل عنصر ‎r-‎ مستقل از فریم‌ورک دارد و ranuts بیش از ۹۰ ابزار تایپ‌شده با پشتیبانی از tree-shaking. در Vue، React یا HTML ساده و بدون هیچ مرحلهٔ ساخت به کار می‌روند.

npm i ranui ranuts
دیدن کامپوننت‌هاستاره دادن در گیت‌هاب
زندهhtml
<r-button type="primary">اصلی</r-button>
<r-button>پیش‌فرض</r-button>
<r-button type="warning">هشدار</r-button>

<r-progress percent="66"></r-progress>

<r-loading name="circle-line"></r-loading>
<r-checkbox checked>اشتراک</r-checkbox>
اصلیپیش‌فرضهشدار
اشتراک
کامپوننت‌های واقعی ranui، همین‌جا روی این صفحه در حال اجرا.
40کامپوننت
90+ابزار
8زبان
MITمجوز

ranui

کتابخانهٔ Web Components مستقل از فریم‌ورک. چهل عنصر ‎r-‎ آمادهٔ استفاده را در Vue، React یا HTML ساده بگذارید.

مرور کامپوننت‌ها

ranuts

بیش از ۹۰ ابزار تایپ‌شده برای رشته، شیء، رنگ، زمان، فایل و DOM. سازگار با tree-shaking و بدون وابستگی.

خواندن مستندات

مقاله‌ها

نوشته‌های بلند دربارهٔ موتورهای رندر، برنامه‌نویسی تابعی، الگوریتم‌های مرتب‌سازی و بستر وب.

شروع خواندن
توانمندی‌ها

آنچه بیشتر کتابخانه‌ها کنار می‌گذارند

پنج مورد در ranuts، پنج مورد در ranui.

ranutsابزارها
  • Bridge PostMessageBridgeفراخوانی از راه دور مبتنی بر Promise روی postMessage، میان iframe و Worker و تب‌ها، با انتقال structured clone و کانال‌های جدا.
  • Visual Applicationگراف صحنه به سبک PixiJS، با موتور رندر قابل تعویض: WebGPU، WebGL یا Canvas.
  • DOM مجازی h() · init()DOM مجازی به سبک snabbdom: هایپراسکریپت، patch، ماژول‌های قابل تعویض و قلاب‌های چرخهٔ عمر.
  • TOTP TOTPرمزهای یک‌بارمصرف بر پایهٔ RFC-6238، از SHA-1 تا SHA3-512، بدون هیچ وابستگی رمزنگاری.
  • فهرست MIME getMime()جست‌وجوی دوسویهٔ MIME ⇄ پسوند فایل با حدود ۱۰۰۰ مدخل.
ranuiکامپوننت‌ها
  • پخش‌کننده <r-player>پخش‌کنندهٔ ویدئوی HLS با نرخ بیت وفقی و هستهٔ کنترلی ماژولار.
  • انتخابگر رنگ <r-colorpicker>انتخابگر کامل HSV با لغزندهٔ فام و شفافیت، و خروجی زندهٔ HEX / RGBA.
  • نمودار راداری <r-radar>نمودار راداری ترسیم‌شده روی canvas، با برچسب و سبک برچسب برای هر محور.
  • فرمول ریاضی <r-math>با Temml که تنبل بارگذاری می‌شود، LaTeX را تنها با یک ویژگی به MathML بومی تبدیل می‌کند.
  • کارت اسکراچ <r-scratch>تعامل خراشیدن و آشکار شدن روی canvas، با آستانهٔ تکمیل.
شروع سریع

نصب و استفاده

هر دو بسته را نصب کنید، عناصر را یک بار ثبت کنید و هرجا خواستید به کار ببرید. نه مرحلهٔ ساخت لازم است نه فریم‌ورک.

نصب و ثبت
$ npm i ranui ranuts

// register the <r-*> elements once
import 'ranui'
import { debounce } from 'ranuts'
استفاده در هر جا
<!-- Vue, React, or plain HTML -->
<r-button type="primary">Save</r-button>
<r-progress percent="66"></r-progress>

همه‌جا کار می‌کند

عناصر سفارشی استاندارد در هر فریم‌ورکی — و بدون فریم‌ورک — اجرا می‌شوند.

کاملاً تایپ‌شده

با TypeScript نوشته شده و همراه با تعریف تایپ‌ها منتشر می‌شود.

قابل نصب و برون‌خط

خود مستندات یک PWA است و Service Worker اختصاصی دارد.

هشت زبان

مرجع ranui و ranuts در هشت زبان نگهداری می‌شود.