Needless UI

ಓಪನ್ ಸೋರ್ಸ್ · Angular 22 · React 19 · MIT

ಅಗತ್ಯವೇ ಇಲ್ಲದಷ್ಟು ಚೆನ್ನಾಗಿ ಎಂಜಿನಿಯರಿಂಗ್ ಮಾಡಿದ UI ಕಾಂಪೊನೆಂಟ್‌ಗಳು.

ನೇಟಿವ್ ಎಲಿಮೆಂಟ್‌ಗಳ ಮೇಲೆ ನಿರ್ಮಿಸಿದ ಆಕ್ಸೆಸಿಬಲ್ Angular ಕಾಂಪೊನೆಂಟ್‌ಗಳು; ಯಾವುದೇ ಫ್ರೇಮ್‌ವರ್ಕ್‌ಗೆ ಅವಲಂಬಿತವಲ್ಲದ ಒಂದೇ ಸ್ಟೈಲ್‌ಶೀಟ್ ಅವುಗಳಿಗೆ ಸ್ಟೈಲ್ ನೀಡುತ್ತದೆ. ಬೇರೆ ಲೈಬ್ರರಿಗಳು ಪ್ರತ್ಯೇಕವಾಗಿ ಮಾರುವುದೂ ಸೇರಿದಂತೆ ಎಲ್ಲವೂ MIT: ಸಂಪನ್ಮೂಲ ಟೈಮ್‌ಲೈನ್‌ಗಳಿರುವ ಶೆಡ್ಯೂಲರ್, ಮತ್ತು ಸಾಲುಗಳನ್ನು ಗುಂಪು ಮಾಡುವ ಹಾಗೂ Excel ಗೆ ಎಕ್ಸ್‌ಪೋರ್ಟ್ ಮಾಡುವ ಡೇಟಾ ಗ್ರಿಡ್.

ಪ್ರಾರಂಭಿಸಿ ಕಾಂಪೊನೆಂಟ್‌ಗಳನ್ನು ನೋಡಿ

ಇದು ಏಕೆ ಇದೆ

  • ಪ್ರೀಮಿಯಂ ಆವೃತ್ತಿ ಇಲ್ಲ

    ಶೆಡ್ಯೂಲರ್‌ನ ಸಂಪನ್ಮೂಲ ಟೈಮ್‌ಲೈನ್ ಮತ್ತು ಪುನರಾವರ್ತಿತ ಈವೆಂಟ್‌ಗಳು, ಹಾಗೂ ಡೇಟಾ ಗ್ರಿಡ್‌ನ ಗುಂಪುಗಳು, ಟ್ರೀ ಡೇಟಾ ಮತ್ತು Excel ಎಕ್ಸ್‌ಪೋರ್ಟ್ ಕೂಡ ಉಳಿದೆಲ್ಲದರಂತೆ MIT ಪರವಾನಗಿಯಲ್ಲೇ ಇವೆ: ಪರವಾನಗಿ ಕೀ ಇಲ್ಲ, ವಾಟರ್‌ಮಾರ್ಕ್ ಇಲ್ಲ. ಹಣ ಕೊಟ್ಟು ಬಳಸುವ ಲೈಬ್ರರಿಯಿಂದ ಬದಲಾಯಿಸುತ್ತಿದ್ದೀರಾ? FullCalendar ಮತ್ತು AG Grid ಮಾರ್ಗದರ್ಶಿಗಳನ್ನು ಓದಿ.

  • ನೇಟಿವ್ ಎಲಿಮೆಂಟ್‌ಗಳಿಗೇ ಆದ್ಯತೆ

    <button nuiButton> ನಿಜವಾದ ಬಟನ್. ಅದರ ಸುತ್ತ ಯಾವುದೇ ರ್ಯಾಪರ್ ಇಲ್ಲದ ಕಾರಣ ಫಾರ್ಮ್‌ಗಳು, ಕೀಬೋರ್ಡ್ ಮತ್ತು ಸ್ಕ್ರೀನ್ ರೀಡರ್‌ಗಳು ಸಹಜವಾಗಿಯೇ ಕೆಲಸ ಮಾಡುತ್ತವೆ.

  • ಒಂದೇ ಸ್ಟೈಲ್‌ಶೀಟ್, ಯಾವುದೇ ಫ್ರೇಮ್‌ವರ್ಕ್

    ಕಾಂಪೊನೆಂಟ್‌ಗಳು ಕ್ಯಾಸ್ಕೇಡ್ ಲೇಯರ್‌ಗಳಲ್ಲಿರುವ ಸಾಮಾನ್ಯ CSS: ಇಂದು Angular, ಸದ್ಯಕ್ಕೆ ಶೆಡ್ಯೂಲರ್ ಮತ್ತು ಡೇಟಾ ಗ್ರಿಡ್‌ಗೆ React, ಸಾದಾ HTML ಯಾವಾಗಲೂ.

  • ಯಾವಾಗಲೂ ಗೆಲ್ಲುವುದು ನಿಮ್ಮ CSS

    ಎಲ್ಲವೂ @layer nui ಒಳಗೆ ಇರುತ್ತದೆ, ಹಾಗಾಗಿ !important ಅಥವಾ ಸ್ಪೆಸಿಫಿಸಿಟಿ ಜಗಳಗಳಿಲ್ಲದೆ ನಿಮ್ಮ ಸ್ಟೈಲ್‌ಗಳು ಅದನ್ನು ಓವರ್‌ರೈಡ್ ಮಾಡುತ್ತವೆ.

  • ನಿರ್ಮಾಣದಲ್ಲೇ ಆಕ್ಸೆಸಿಬಿಲಿಟಿ

    ಪ್ಯಾಲೆಟ್ ಅನ್ನು ಜನರೇಟ್ ಮಾಡುವಾಗಲೇ ಪ್ರತಿ ಬಣ್ಣದ ಜೋಡಿಯನ್ನು WCAG 2.2 AA ಮಾನದಂಡಗಳ ಪ್ರಕಾರ ಪರಿಶೀಲಿಸಲಾಗುತ್ತದೆ. ಫೋಕಸ್, forced colors ಮತ್ತು ಚಲನೆ ಕಡಿತವನ್ನು ನಿಮಗಾಗಿ ಈಗಾಗಲೇ ನಿರ್ವಹಿಸಲಾಗಿದೆ.

  • ಅಗತ್ಯಕ್ಕಿಂತ ಹೆಚ್ಚು ಕಸ್ಟಮೈಸೇಶನ್

    ಸ್ಪ್ರಿಂಗ್‌ಗಳು, ಒತ್ತಿದಾಗಿನ ಪರಿಣಾಮಗಳು, ಪ್ರವೇಶ ಅನಿಮೇಷನ್‌ಗಳು, ಮೂಲೆಯ ಆಕಾರಗಳು, ತ್ರಿಜ್ಯ ಮತ್ತು ಸಾಂದ್ರತೆ: ಇಡೀ ಆ್ಯಪ್‌ಗೆ ಒಂದೇ ಆಟ್ರಿಬ್ಯೂಟ್, ಅಥವಾ ಪ್ರತಿ ಕಾಂಪೊನೆಂಟ್‌ಗೆ ಒಂದು ಇನ್‌ಪುಟ್, ಎಲ್ಲವೂ ಪ್ರಮಾಣಿತ W3C ಡಿಸೈನ್ ಟೋಕನ್‌ಗಳ ಆಧಾರದಲ್ಲಿ.

  • ಆಧುನಿಕ Angular

    ಸಿಗ್ನಲ್ ಇನ್‌ಪುಟ್‌ಗಳು, zoneless, ಸರ್ವರ್ ರೆಂಡರಿಂಗ್ ಮತ್ತು ಪ್ರತಿ ಕಾಂಪೊನೆಂಟ್‌ಗೆ ಒಂದು ಎಂಟ್ರಿ ಪಾಯಿಂಟ್. ಹಾಗಾಗಿ ನೀವು ಇಂಪೋರ್ಟ್ ಮಾಡಿದ್ದು ಮಾತ್ರ ನಿಮ್ಮ ಆ್ಯಪ್‌ನಲ್ಲಿ ಸೇರುತ್ತದೆ.

ಒಂದು ಕಮಾಂಡ್, ನಂತರ ಒಂದು ಇಂಪೋರ್ಟ್

ಪ್ಯಾಕೇಜ್ ಅನ್ನು ಇನ್‌ಸ್ಟಾಲ್ ಮಾಡಿ ಅದರ ಸ್ಟೈಲ್‌ಶೀಟ್ ಅನ್ನು ಇಂಪೋರ್ಟ್ ಮಾಡಲು ng add ರನ್ ಮಾಡಿ, ನಂತರ ಯಾವುದೇ standalone ಕಾಂಪೊನೆಂಟ್‌ನಲ್ಲಿ ಕಾಂಪೊನೆಂಟ್‌ಗಳನ್ನು ಬಳಸಿ.

ng-add.sh
ng add @needless-ui/angular
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() {}
}