Needless UI

Open source · Angular 22 · MIT

Mga UI component na pinag-isipan nang higit sa kailangan.

Sini-style ng Needless UI ang mga native element gamit ang iisang stylesheet na hindi nakatali sa framework at mga W3C design token. Nagdadagdag ang mga Angular directive nito ng behavior mula sa Angular Aria, kaya accessible ang bawat component mula pa sa unang render.

Magsimula Tingnan ang mga component

Bakit ito ginawa

  • Native element muna

    Totoong button ang <button nuiButton>. Gumagana ang mga form, keyboard at screen reader dahil walang nakabalot dito.

  • Iisang stylesheet, kahit anong framework

    Plain CSS sa cascade layers ang mga component: Angular ngayon, React sa susunod, plain HTML palagi.

  • Laging panalo ang CSS mo

    Nasa loob ng @layer nui ang lahat, kaya nao-override ito ng sarili mong mga style nang walang !important o labanan sa specificity.

  • Accessible mula sa pundasyon

    Sinusuri ang bawat pares ng kulay laban sa WCAG 2.2 AA kapag binubuo ang palette. Asikaso na ang focus, forced colors at reduced motion.

  • Sobrang customizable

    Mga spring, press effect, paglitaw, hugis ng sulok, radius at density: isang attribute para sa buong app, o isang input bawat component, nakabatay sa mga standard na W3C design token.

  • Modernong Angular

    Signal inputs, zoneless, server rendering at isang entry point bawat component, kaya ang ini-import lang ang dala ng mga app.

Dalawang import, tapos ka na

Idagdag ang package, i-import nang isang beses ang stylesheet, at gamitin ang mga component sa kahit anong standalone component.

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