Saltar al contenido principal
NeuralUIv1.14.3Nuevo
GitHub
Componente

Button

Botón semántico con 4 variantes, 3 tamaños, estado de carga animado y soporte completo de accesibilidad (aria-disabled, role="button").

TypeScript
import { NeuButtonComponent } from '@neural-ui/core/button';

Estados

Iconos

Variantes

Tamaños

TypeScript
import { NeuButtonComponent } from '@neural-ui/core/button';

@Component({
  imports: [NeuButtonComponent],
  template: `
    <!-- Solo texto / Text only -->
    <button neu-button>Default</button>
    <button neu-button variant="primary">Primary</button>

    <!-- Icono a la izquierda (por defecto) / Left icon (default) -->
    <button neu-button icon="lucidePlus">New</button>

    <!-- Icono a la derecha / Right icon -->
    <button neu-button icon="lucideArrowRight" iconPosition="right">Next</button>

    <!-- Solo icono (cuadrado) / Icon only (square) -->
    <button neu-button variant="ghost" icon="lucideTrash2" [iconOnly]="true" ariaLabel="Delete" />

    <!-- Loading / Loading -->
    <button neu-button [loading]="isLoading()" (click)="save()">Save</button>
  `
})
export class MyComponent {
  isLoading = signal(false);
  save() { /* ... */ }
}`