Аргументите за Lily
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 държави, всеки с документиран формат и алгоритъм за валидиране.
- Основни елементи за редакционно съдържание и scrollytelling адаптирани от 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.