عن المشروع

Material Web هي مكتبة من مكونات الويب يتم صيانتها تحت منظمة material-components. غرضها المعلن هو المساعدة في بناء تطبيقات ويب جميلة وسهلة الوصول، وهي تطبق Material 3، أحدث إصدار من نظام التصميم مفتوح المصدر من Google. ما توفره المكتبة: - مجموعة من العناصر المخصصة (تبدأ ببادئة -md) والتي يمكن استخدامها في HTML العادي، مثل md-checkbox و md-radio و md-outlined-text-field و md-outlined-button و md-icon-button. - نقطة دخول مشتركة "all.js" تستورد مجموعة المكونات الكاملة، بالإضافة إلى وحدات مكونات فردية لتحميل أكثر انتقائية. - دعم الطباعة من خلال وحدة أنماط مقياس الأنواع (md-typescale-styles.js)، والتي توفر ورقة أنماط قابلة للاعتماد يمكن دفعها إلى document.adoptedStyleSheets. ترتبط فئات المرافق مثل md-typescale-display-medium و md-typescale-body-medium بمقياس أنواع Material. يعرض ملف README مثالاً للبدء السريع بدون بناء يقوم بتحميل المكتبة من CDN عبر خريطة استيراد (import map) ونص برمجى لوحدة (module script)، إلى جانب خط Roboto من Google Fonts. ويغطي دليل بدء سريع منفصل في المستندات عملية التثبيت والبناء للإنتاج. التوثيق والموارد: - docs/intro.md - مقدمة - docs/roadmap.md - خارطة الطريق - docs/components/ - توثيق لكل مكون - docs/size.md - معلومات عن حجم الحزمة - docs/support.md - دعم المتصفحات والأسئلة الشائعة - docs/quick-start.md - إرشادات التثبيت وبناء الإنتاج حالة المشروع: - ينص ملف README صراحةً على أن MWC (Material Web Components) في وضع الصيانة بانتظار مشرفين جدد، ويربط بمناقشة على GitHub. يجب على أي شخص يقيم المكتبة لمشروع طويل الأمد أن يأخذ ذلك في الاعتبار. - لمستخدمي Angular، يوصي ملف README باستخدام مكونات Angular Material بدلاً من ذلك. سياق التوزيع والترخيص: - منشورة على npm باسم @material/web، مع عرض إحصائيات الإصدار والتنزيلات عبر شارات، ويمكن الوصول إليها أيضاً من خلال خدمات CDN مثل esm.run و jsDelivr. - يتم عرض حالة اختبار التكامل المستمر من خلال شارة سير عمل GitHub Actions، ويشير المستودع إلى دردشة Lit على Discord للدعم المجتمعي. الاستخدام النموذجي: بما أن هذه مكونات ويب قياسية، فهي مستقلة عن إطار العمل ويمكن وضعها في أي صفحة أو تطبيق يدعم العناصر المخصصة، بما في ذلك المواقع الثابتة، والصفحات التي يتم رندرتها على الخادم، وأطر عمل JavaScript. تتبع التنسيقات والمظاهر (theming) اتفاقيات Material 3، وتشارك عناصر التحكم المرتبطة بالنماذج في نماذج HTML الأصلية.