Аргументи на користь Lily

Починайте зі свого дизайну

Ваша команда вже знає, як має виглядати продукт. Lily починає саме звідти: вона забезпечує те, що справді важко зробити правильно й дорого переробляти, — правильний семантичний елемент, стани ARIA, контракт клавіатури, керування фокусом — і повністю, з радістю залишає кожне візуальне рішення вам. Ваш CSS — це вигляд дизайн-системи з першого дня.

Оскільки кожен компонент має стабільний клас-гачок і чисту структуру, ваші стилі залишаються чисто вашими після кожного оновлення — а доступність під ними продовжує працювати, версія за версією.

Що Lily гарантує

• Доступність за замовчуванням. WCAG 2.2 AAA — мета для кожного компонента. Шаблони відповідають WAI-ARIA Authoring Practices; кожен інтерактивний компонент керується з клавіатури за задокументованим контрактом; приклади застосунків підтримують чисту базову лінію axe-core.
• Інтернаціоналізація за конструкцією. Кожен рядок, який бачить користувач, — кожна мітка, помилка й оголошення — є властивістю зі стабільними назвами в усіх фреймворках, тож переклад відбувається природно. RTL і двоспрямований текст успадковуються від вашого dir. Компоненти, що враховують локаль, приймають її як властивість, завжди явно.
• Один каталог, вісім фреймворків. Ті самі 571 компонентів (536 як нативні Web Components) з тими самими клас-гачками й угодами про властивості в HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks та Web Components. Ваш CSS і знання вашої команди переносяться між стеками.
• Незалежність від CSS-стратегії. Один стабільний клас kebab-case на корінь кожного компонента. Семантичний CSS, утиліти Tailwind, CSS-in-JS або одна з 57 готових тем — Lily вітає їх усі й граціозно не заважає.
• Безкоштовно, назавжди, на ваших умовах. Відкритий код за вашим вибором: BSD, MIT, Apache-2.0, GPL-2.0 або GPL-3.0. Жодного платного рівня, жодних ліцензій на місця, жодної телеметрії.

Глибина там, де вона важлива

Крім звичних кнопок і діалогів, каталог сягає далі, ніж більшість:

• Шаблони для публічного сектору досліджені в дизайн-системах NHS UK, GOV.UK, USWDS і ONS — підсумки помилок, попереджувальні виноски, підсумкові списки, фазові банери, посилання пропуску.
• 140 компонентів національних особистих ідентифікаторів що охоплюють медичні, національні, податкові та паспортні ідентифікатори в понад 50 країнах, кожен з описом формату й алгоритму перевірки.
• Примітиви для редакційних матеріалів і скролітелінгу адаптовані з Reuters Graphics — макети статей, скролери, часові шкали, плиткові карти.
• Допоміжні засоби вибору — невеликі пакети, що повністю відповідають за одну взаємодію: перемикання теми (із завантаженням таблиць стилів під час виконання), мова, розмір тексту, зменшений рух, пошук, посилання на сторінки, поширення та введення дати й часу. Кожен — «безголова» кнопка-значок, що відкриває спливне вікно, а не нативний <select> — з убудованою стійкістю та безпекою SSR.

Теми для публічного сектору — з коробки

Lily постачається з 57 автономними еталонними темами, що напряму націлені на її клас-гачки: NHS England, NHS Scotland і NHS Wales (кожна у варіантах для пацієнтів і для практиків), GOV.UK, USWDS, палітри за мотивами Adobe Spectrum і Mozilla Protocol та набір універсальних світлих і темних тем. Підключіть одну таблицю стилів — і вигляд урядового рівня готовий; допоміжний засіб theme-picker перемикає їх під час виконання.

Як Lily порівнюється з іншими

Ми ведемо чесне, компонент за компонентом, порівняння з іншими дизайн-системами — стилізованими й «безголовими», комерційними та публічного сектору. Якщо інша бібліотека краще підходить вам, порівняння це покаже; Lily вчиться в усіх них і відкрито називає свої джерела натхнення.

Хто за цим стоїть

Lily — молодий незалежний проєкт з відкритим кодом, що вітає співпрацю, поради та відгуки — див. Про проєкт щодо історії та джерел натхнення. Усе — специфікація, тести, дорожня карта, навіть інструменти аудиту — у відкритому доступі на github.com/LilyDesignSystem.

Допоможіть Lily рости

Якщо Lily вам корисна, ось найцінніше, що ви можете зробити:

• Поставте зірку й поділіться. Поставте зірку основному репозиторію і покажіть колезі каталог — обізнаність є найдефіцитнішим ресурсом молодого проєкту.
• Створіть щось і розкажіть нам. Звіти про реальне використання — що спрацювало, що могло б бути зручнішим — формують дорожню карту більше, ніж будь-що інше.
• Перевіряйте доступність. Проходи зі зчитувачами екрана (VoiceOver, NVDA, JAWS) на прикладах застосунків — на вагу золота; повідомляйте про знахідки.
• Запропонуйте тему або переклад. І те, й інше — самодостатні, чітко окреслені перші внески.
• Діліться знахідками з мінімальним відтворенням у репозиторії на GitHub або пишіть на joel@joelparkerhenderson.com.