Needless UI

Open source · Angular 22 · MIT

Komponen UI yang dirancang lebih matang dari yang perlu.

Needless UI memberi gaya pada elemen native dengan satu stylesheet yang tidak bergantung pada framework dan design token W3C. Direktif Angular-nya menambahkan perilaku dari Angular Aria, sehingga setiap komponen sudah aksesibel sejak render pertama.

Mulai Lihat komponen

Mengapa dibuat

  • Elemen native lebih dulu

    <button nuiButton> adalah tombol sungguhan. Formulir, keyboard, dan pembaca layar tetap berfungsi karena tidak ada yang membungkusnya.

  • Satu stylesheet, framework apa pun

    Komponennya berupa CSS biasa dalam cascade layer: Angular hari ini, React berikutnya, dan HTML biasa kapan saja.

  • CSS Anda selalu menang

    Semuanya berada di dalam @layer nui, sehingga gaya Anda sendiri bisa menimpanya tanpa !important atau perang spesifisitas.

  • Aksesibel sejak dirancang

    Setiap pasangan warna diperiksa terhadap WCAG 2.2 AA saat palet dibuat. Fokus, forced colors, dan pengurangan gerakan sudah ditangani untuk Anda.

  • Kustomisasi berlebihan

    Pegas, efek tekan, animasi masuk, bentuk sudut, radius, dan kepadatan: satu atribut untuk seluruh aplikasi, atau satu input per komponen, di atas design token W3C standar.

  • Angular modern

    Signal input, zoneless, rendering sisi server, dan satu entry point per komponen, sehingga aplikasi hanya menyertakan apa yang diimpornya.

Cukup dua baris impor

Tambahkan paketnya, impor stylesheet sekali, lalu gunakan komponen di dalam komponen standalone mana pun.

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() {}
}