Об этом проекте
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 и модуль-скрипт, а также веб-шрифт Roboto из Google Fonts. Отдельное руководство по быстрому старту в документации описывает установку и сборку для продакшена.
Документация и ресурсы
- docs/intro.md — введение
- docs/roadmap.md — дорожная карта
- docs/components/ — документация по каждому компоненту
- docs/size.md — информация о размере бандла
- docs/support.md — поддержка браузеров и FAQ
- 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-фреймворки. Стилизация и темизация следуют конвенциям Material 3, а элементы управления, связанные с формами, участвуют в нативных HTML-формах.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.