D’Argumenter fir Lily

Lily iwwerhëlt déi schwéier Deeler — Semantik, Zougänglechkeet, Tastaturverhalen, Internationaliséierung — a léisst d’Ausgesinn ganz a gären Iech.

Fänkt bei Ärem Design un

Är Equipe weess schonn, wéi Äert Produkt solle ausgesinn. Lily fänkt genee dohier un: et liwwert déi Deeler, déi wierklech schwéier richteg ze maachen an deier nei ze maachen sinn — dat richtegt semantescht Element, d’ARIA-Zoustänn, den Tastaturkontrakt, d’Fokusverwaltung — a léisst all visuell Entscheedung ganz a mat Freed bei Iech. Äre CSS ass d’Ausgesinn vum Designsystem vum éischten Dag u.

Well all Komponent e stabilen Klassenhaken a pur Struktur mathëlt, bleift Är Stylung bei all Upgrade proppert Är eegen — an d’Zougänglechkeet drënner funktionéiert weider, Versioun fir Versioun.

Wozou Lily sech verflicht

  • Standardméisseg zougänglech. WCAG 2.2 AAA ass d’Zil fir all Komponent. D’Muster follegen d’WAI-ARIA Authoring Practices; all interaktiv Komponent ass mat der Tastatur bedienbar no engem dokumentéierten Kontrakt; d’Beispillapplikatioune halen eng propper axe-core-Basislinn.
  • Vun der Konstruktioun hier internationaliséierbar. All Zeechefolleg, déi de Benotzer gesäit — all Etikett, Feeler an Ukënnegung — ass eng Eegenschaft mat stabilen Nimm iwwer d’Frameworke ewech, sou datt d’Iwwersetzung natierlech fléisst. RTL an zweesäitegen Text erwe vun Ärem dir. Sproochbewosst Komponente kréien d’Sprooch als Eegenschaft, ëmmer explizit.
  • Ee Katalog, aacht Frameworken. Déiselwecht 571 Komponenten (536 als native Web Components) mat denselwechte Klassenhaken an Eegenschaftskonventiounen a HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks a Web Components. Äre CSS an d’Wëssen vun Ärer Equipe loossen sech tëscht Stacken iwwerdroen.
  • Onofhängeg vun der CSS-Strategie. Eng stabil Kebab-Case-Klass pro Komponentewuerzel. Semantescht CSS, Tailwind-Utilities, CSS-in-JS oder ee vun de 57 fäerdegen Themen — Lily begréisst se all a geet graziéis aus dem Wee.
  • Gratis, fir ëmmer, op Är Konditiounen. Open Source ënner Ärer Wiel vu BSD, MIT, Apache-2.0, GPL-2.0 oder GPL-3.0. Keng Pro-Stuf, keng Plazlizenzen, keng Telemetrie.

Déift, wou se zielt

Iwwer déi üblech Knäpp an Dialogen eraus geet de Katalog méi wäit wéi déi meescht:

  • Muster fir den ëffentleche Secteur recherchéiert aus den Designsystemer vun NHS UK, GOV.UK, USWDS an ONS — Feelerzesummefaassungen, Warnkëschten, Zesummefaassungslëschten, Phasebanneren, Sprangléngen.
  • 140 Komponente fir national perséinlech Identifikateuren déi Gesondheets-, nationalt ID-, Steier- a Passidentifikateuren a méi wéi 50 Länner ofdecken, jiddereen dokumentéiert säi Format a säin Validéierungsalgorithmus.
  • Redaktionell a Scrollytelling-Bausteng vu Reuters Graphics ugepasst — Artikellayouten, Scroller, Zäitlinnen, Kachelkaarten.
  • Wieler-Helfer — kleng Pakéiten, déi eng Interaktioun vun Ufank bis Enn besëtzen: Themewiessel (mat Stylesheet-Luede während der Lafzäit), Sprooch, Textgréisst, reduzéiert Bewegung, Sich, Säitelénken, Deelen an Datum- an Zäiteingab. All ass en Headless-Ikonknäppchen, dat e Popup opmécht — net e native <select> — mat agebauter Persistenz an SSR-Sécherheet.

Themen fir den ëffentleche Secteur, direkt prett

Lily liwwert 57 eegestänneg Referenzthemen, déi direkt op seng Klassenhaken zielen: NHS England, NHS Scotland an NHS Wales (all a Patienten- a Fachpersounevarianten), GOV.UK, USWDS, Palette vun Adobe Spectrum a Mozilla Protocol inspiréiert, an eng Rei allgemeng hell an donkel Themen. Verlénkt ee Stylesheet an e Regierungsniveau-Ausgesinn ass un; den Helfer theme-picker wiesselt se während der Lafzäit.

Wéi Lily sech vergläicht

Mir féieren e fräie Verglach mat anere Designsystemer , Komponent fir Komponent — gestylt an headless, kommerziell an ëffentleche Secteur. Wou eng aner Bibliothéik besser fir Iech passt, weist de Verglach et; Lily léiert vun hinnen allen an nennt seng Inspiratiounsquellen oppen.

Wien dohannert steet

Lily ass e jonke, onofhängege Open-Source-Projet, deen Zesummenaarbecht, Orientéierung a Feedback begréisst — kuckt Iwwer fir d’Geschicht an d’Inspiratiounsquellen. Alles — d’Spezifikatioun, d’Tester, d’Roadmap, souguer d’Audit-Geschirer — ass oppen op github.com/LilyDesignSystem.

Hëlleft Lily wuessen

Wann Lily Iech nëtzlech ass, sinn dat déi wäertvollst Saachen, déi Dir maache kënnt:

  • Gitt e Stären a deelt. Gitt dem Haaptrepository e Stären a weist engem Kolleeg de Katalog — Bekanntheet ass déi knappst Ressource, déi e jonke Projet huet.
  • Baut eppes a sot et eis. Berichter iwwer richtege Gebrauch — wat geklappt huet, wat méi glat kéint sinn — formen d’Roadmap méi wéi alles anert.
  • Auditéiert d’Zougänglechkeet. Duerchgäng mat Écran-Lieser (VoiceOver, NVDA, JAWS) op den Beispillapplikatiounen sinn Gold wäert; mellt, wat Dir fannt.
  • Droen e Thema oder eng Iwwersetzung bäi. Béid sinn eegestänneg, gutt ofgegrenzt éischt Bäiträg.
  • Deelt, wat Dir fannt, mat enger minimaler Reproduktioun, am GitHub-Repository, oder schéckt eng E-Mail un joel@joelparkerhenderson.com.