AgnosticUI — библиотека пользовательских интерфейсных примитивов, реализованных на чистом HTML и CSS и адаптированных для использования в нескольких современных фреймворках. Проект позиционируется как набор семантически корректных и доступных компонентов, предназначенных для включения в экосистемы React, Vue 3, Svelte, Astro и в экспериментальной форме — Angular. В основу концепции положены принципы разделения структуры и стилей: компоненты предоставляют минимальную HTML-разметку и набор CSS-переменных для глобальной темы.
Разработка AgnosticUI ориентирована на сценарии, где важна совместимость с разными сборками и инструментами, предсказуемое поведение в разных средах и упрощённая интеграция в существующие проекты. Исторически проект возник как ответ на потребность в наборе компонентов, минимально зависящих от конкретного фреймворка и сохраняющих доступность пользовательского интерфейса при различных способах встраивания. Документация и примеры фокусируются на семантике, управлении состоянием через атрибуты и настраиваемости через CSS-переменные.
- Кросс-фреймворковая реализация: компоненты адаптированы для использования в React, Vue 3, Svelte, Astro и экспериментально в Angular, с минимальными отличиями в API и способах интеграции.
- Чистая разметка и стили: базовые элементы написаны на нативном HTML и CSS без привязки к сложным рантайм-зависимостям, что облегчает переносимость и отладку.
- Тематизация через CSS-переменные: поддержка глобальной сквозной темы и переопределяемых переменных для цветов, отступов и типографики.
- Доступность (a11y): фокус на семантической разметке, управлении фокусом и поддержке средств ассистивных технологий, включая ARIA-атрибуты там, где это необходимо.
- Минимализм API: лаконичные и прогнозируемые интерфейсы компонентов, ориентированные на простую интеграцию и композицию в приложениях.
- Семантическая структура: компоненты проектируются с учётом правильной HTML-структуры (например, кнопки, поля ввода, списки), что улучшает совместимость с инструментами разметки и SEO-аспекты.
- Лёгкая кастомизация: возможность изменения внешнего вида и поведения без форков путём переопределения переменных и минимального CSS-расширения.
- Документация и примеры: набор руководств и примеров интеграции для разных фреймворков, описывающих типичные шаблоны использования и рекомендации по доступности.
- Ограничения реализации: некоторые интеграции, особенно для специфичных фреймворков, могут носить экспериментальный характер и требовать адаптации под конкретные сборки и версий библиотек.
- Отсутствие привязки к рантайму: намерение минимизировать зависимость от внешних JavaScript-рантаймов, передавая часть логики управления состоянием на уровень фреймворка-потребителя.