Об этом проекте

Numl представляет собой атомарный UI-фреймворк на базе Web Components с генерацией CSS в рантайме, предназначенный для оперативной разработки интерфейсов, соответствующих дизайн-системе. В README содержится заметное уведомление о том, что проект устарел и больше не поддерживается; в качестве преемников предлагаются tasty (система стилизации CSS-in-JS и DSL для React) и glaze (генератор цветовых тем OKHSL с решением проблем контрастности WCAG). Что он предоставляет: язык дизайна UI, библиотеку готовых доступных веб-компонентов и runtime CSS-фреймворк. Согласно README, для работы достаточно добавить один JavaScript-модуль на страницу без использования сборщика и конфигурации, после чего такие элементы, как nu-btn, можно использовать непосредственно в разметке. Установка и использование: в README показана загрузка сборки ES-модуля из jsDelivr с последующим написанием элементов на обычном HTML. Другие методы установки описаны в руководстве (handbook). Заявленные возможности: комплексный подход, объединяющий разметку для адаптивных интерфейсов с настраиваемыми доступными элементами; система генерации цветов и привязки стилей к состоянию (styles-to-state), которые, по утверждению в README, позволяют сократить количество объявлений стилей по сравнению с обычным CSS; автоматическая темная тема и режим высокой контрастности; дизайн-токены, представленные в виде пользовательских свойств; возможность настройки глобально, в контексте или непосредственно в элементе; возможность добавления пользовательских элементов, атрибутов стиля, поведения, дизайн-токенов и пользовательских единиц измерения; а также совместимость с такими фреймворками, как Vue, Angular, React и Svelte, включая использование с SSG. Документация и примеры: README ссылается на Storybook, Handbook, Reference и REPL на сайте numl.design. В списке примеров значатся песочницы flex и grid, конвертер markdown, слайдер «до/после» и пример валидации формы входа. Среди проектов, созданных с помощью Numl, упоминаются Cube.js UI Kit, а также несколько веб-сайтов и storybooks самого Numl. Поддержка браузеров: две последние версии Edge, Chrome, Firefox, Safari, iOS Safari и Android. IE11 и Edge до версии Chromium явно исключены из области охвата проекта. Команды разработки: npm start запускает playground; npm run build собирает библиотеку в папку dist в виде модуля ES6 с поддержкой tree-shaking; npm run dev пересобирает проект при изменении исходного кода; npm run test запускает тесты. Проект распространяется под лицензией MIT и следует спецификации all-contributors; в README содержится приглашение к участию и ссылка на сообщество в Discord. В разделе дорожной карты упоминаются такие пункты, как предложение по синтаксису style2state v2, библиотека для React, генератор тем, расширение документации и тестов, а также UI-кит для Figma; поскольку репозиторий устарел, эти планы следует рассматривать как исторические.