Needless UI

Open source · Angular 22 · MIT

Komponen UI, direkayasa apik ngluwihi perlu.

Needless UI menehi gaya marang elemen native nganggo siji stylesheet tanpa framework lan design token W3C. Directive Angular-e nambahake prilaku saka Angular Aria, dadi saben komponen wis aksesibel wiwit render kapisan.

Miwiti Pirsani komponen

Kenapa digawe

  • Elemen native dhisik

    <button nuiButton> iku tombol sing asli. Formulir, keyboard lan screen reader bisa mlaku amarga ora ana apa-apa sing mbungkus.

  • Siji stylesheet, framework apa wae

    Komponen iku CSS biasa ing cascade layer: Angular saiki, React sabanjure, HTML biasa salawase.

  • CSS panjenengan tansah menang

    Kabeh ana ing njero @layer nui, dadi gaya panjenengan dhewe bisa nimpa tanpa !important utawa rebutan spesifisitas.

  • Aksesibel wiwit dhasar

    Saben pasangan werna dicek miturut WCAG 2.2 AA nalika palet digawe. Fokus, forced colors lan reduced motion wis diurus kanggo panjenengan.

  • Bisa diatur ngluwihi perlu

    Pegas, efek pencetan, animasi mlebu, wangun pojok, jari-jari lan kapadhetan: siji attribute kanggo kabeh aplikasi, utawa siji input saben komponen, adhedhasar design token standar W3C.

  • Angular modern

    Signal input, zoneless, server rendering lan siji entry point saben komponen, dadi aplikasi mung nggawa apa sing di-import.

Loro import, rampung

Tambahna paket, impor stylesheet sepisan, banjur agem komponen ing komponen standalone apa wae.

install.sh
pnpm add @needless-ui/angular @angular/aria @angular/cdk
usage.ts
import { Component } from '@angular/core';
import { NuiButton } from '@needless-ui/angular/button';

@Component({
  selector: 'app-root',
  imports: [NuiButton],
  template: `<button nuiButton (click)="save()">Save changes</button>`,
})
export class App {
  save() {}
}