Argumentet for Lily

Lily tager sig af de svære dele – semantik, tilgængelighed, tastaturadfærd, internationalisering – og overlader udseendet helt og gerne til dig.

Start med dit eget design

Dit team ved allerede, hvordan dit produkt skal se ud. Lily starter præcis dér: Det leverer de dele, der er virkelig svære at få rigtige og dyre at lave om – det korrekte semantiske element, ARIA-tilstandene, tastaturkontrakten, fokushåndteringen – og overlader enhver visuel beslutning helt og med glæde til dig. Din CSS er designsystemets udseende fra dag ét.

Fordi hver komponent har en stabil klassekrog og ren struktur, forbliver din stil ren din egen gennem hver opgradering – og tilgængeligheden nedenunder bliver ved med at virke, version efter version.

Hvad Lily forpligter sig til

  • Tilgængeligt som standard. WCAG 2.2 AAA er målet for hver komponent. Mønstrene følger WAI-ARIA Authoring Practices, hver interaktiv komponent kan betjenes med tastatur efter en dokumenteret kontrakt, og eksempelapps holder en ren axe-core-baseline.
  • Kan internationaliseres fra grunden. Hver brugervendt streng – hver etiket, fejl og meddelelse – er en prop med stabile navne på tværs af frameworks, så oversættelse flyder naturligt. RTL og tovejstekst arver fra din dir. Sprogbevidste komponenter tager sproget som en prop, altid udtrykkeligt.
  • Ét katalog, otte frameworks. De samme 571 komponenter (536 som native Web Components) med de samme klassekroge og prop-konventioner i HTML, Svelte, React, Vue, Angular, Blazor, Nunjucks og Web Components. Din CSS og dit teams viden kan overføres på tværs af stakke.
  • Uafhængig af CSS-strategi. Én stabil klasse i kebab-case pr. komponentrod. Semantisk CSS, Tailwind-utilities, CSS-in-JS eller et af de 57 færdige temaer – Lily byder dem alle velkommen og holder sig elegant i baggrunden.
  • Gratis, for evigt, på dine vilkår. Åben kildekode under en licens efter eget valg: BSD, MIT, Apache-2.0, GPL-2.0 eller GPL-3.0. Intet pro-niveau, ingen brugerlicenser, ingen telemetri.

Dybde, hvor det tæller

Ud over de sædvanlige knapper og dialoger rækker kataloget længere end de fleste:

  • Mønstre til den offentlige sektor undersøgt fra designsystemerne hos NHS UK, GOV.UK, USWDS og ONS – fejloversigter, advarselsbokse, oversigtslister, fasebannere og spring-over-links.
  • 140 komponenter til nationale personidentifikatorer der dækker identifikatorer inden for sundhed, nationale id-kort, skat og pas i over 50 lande, hver med dokumenteret format og valideringsalgoritme.
  • Byggeklodser til redaktionelt arbejde og scrollytelling tilpasset fra Reuters Graphics – artikellayouts, scrollere, tidslinjer, fliskort.
  • Vælgerhjælpere – små pakker, der ejer én interaktion fra ende til anden: temaskift (med indlæsning af typografiark under kørsel), sprog, tekststørrelse, reduceret bevægelse, søgning, sidelinks, deling og indtastning af dato og tid. Hver er en hovedløs ikonknap, der åbner en popup – ikke en indbygget <select> – med vedvarende lagring og SSR-sikkerhed indbygget.

Temaer til den offentlige sektor, klar til brug

Lily leverer 57 selvstændige referencetemaer, der retter sig direkte mod dets klassekroge: NHS England, NHS Scotland og NHS Wales (hver i varianter til patienter og til fagpersoner), GOV.UK, USWDS, paletter inspireret af Adobe Spectrum og Mozilla Protocol samt et sæt almene lyse og mørke temaer. Link ét typografiark, og et udseende på myndighedsniveau er slået til; hjælperen theme-picker skifter dem under kørsel.

Hvordan Lily klarer sig i sammenligning

Vi fører en ærlig sammenligning, komponent for komponent, med andre designsystemer – stilede og hovedløse, kommercielle og offentlige. Hvor et andet bibliotek passer bedre til dig, vil sammenligningen vise det; Lily lærer af dem alle og angiver åbent sine inspirationskilder.

Hvem der står bag

Lily er et ungt, uafhængigt projekt med åben kildekode, der byder samarbejde, vejledning og feedback velkommen – se Om for historien og inspirationskilderne. Alt – specifikationen, testene, køreplanen, selv revisionsværktøjerne – er åbent tilgængeligt på github.com/LilyDesignSystem.

Hjælp Lily med at vokse

Hvis Lily er nyttigt for dig, er det mest værdifulde, du kan gøre:

  • Giv en stjerne og del. Giv en stjerne til hovedrepositoriet og vis en kollega kataloget – synlighed er den knappeste ressource, et ungt projekt har.
  • Byg noget og fortæl os om det. Rapporter fra virkelig brug – hvad der virkede, hvad der kunne gå mere glat – former køreplanen mere end noget andet.
  • Gennemgå tilgængeligheden. Gennemgange med skærmlæsere (VoiceOver, NVDA, JAWS) på eksempelapps er guld værd; indrapportér det, du finder.
  • Bidrag med et tema eller en oversættelse. Begge dele er selvstændige, velafgrænsede første bidrag.
  • Del det, du finder, med en minimal gengivelse, i GitHub-repositoriet, eller skriv til joel@joelparkerhenderson.com.