Needless UI

Open source · Angular 22 · MIT

Components na UI, an ƙera su da kyau fiye da kima.

Needless UI yana ba elements na asali salo da stylesheet ɗaya wanda bai dogara da framework ba, da kuma design tokens na W3C. Directives ɗinsa na Angular suna ƙara ɗabi’a daga Angular Aria, don haka kowane component yana da sauƙin amfani ga kowa tun daga nunawarsa ta farko.

Fara Duba components

Dalilin samuwarsa

  • Elements na asali da farko

    <button nuiButton> maɓalli ne na gaske. Fom, allon madannai da manhajojin karanta allo suna aiki saboda babu abin da ya lulluɓe shi.

  • Stylesheet ɗaya, kowane framework

    Components CSS ne zalla a cikin cascade layers: Angular a yau, React nan gaba, HTML zalla a koyaushe.

  • CSS ɗinku ne ke rinjaye koyaushe

    Komai yana cikin @layer nui, don haka salon da kuka rubuta da kanku yana rinjayar sa ba tare da !important ko faɗan specificity ba.

  • Sauƙin amfani ga kowa tun daga tushe

    Ana duba kowane haɗin launuka biyu da WCAG 2.2 AA a lokacin samar da palette. An riga an kula muku da focus, forced colors da rage motsi.

  • Keɓancewa fiye da kima

    Springs, tasirin dannawa, yanayin shigowa, siffa da girman kusurwoyi, da sarari: attribute ɗaya ga dukan manhaja, ko input ɗaya ga kowane component, duka a kan daidaitattun design tokens na W3C.

  • Angular na zamani

    Signal inputs, zoneless, server rendering da entry point ɗaya ga kowane component, don haka manhajoji suna ɗaukar abin da suka shigo da shi kawai.

Imports biyu, shi ke nan

Ku ƙara package ɗin, ku shigo da stylesheet sau ɗaya, sannan ku yi amfani da components a cikin kowane 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() {}
}