feat: add routing for componentes-test and create reusable button component

- Implemented lazy loading for the componentes-test feature module.
- Created a redirect route to componentes-test as the default path.
- Added a new ReutilizablesTestPageComponent to showcase reusable components.
- Developed a reusable ButtonComponent with various styles and states.
- Updated global styles to include Bootstrap.
- Added SCSS styles for the new components and pages.
This commit is contained in:
2026-06-24 09:31:37 -03:00
parent 1bff88e92a
commit d108cf1ee2
13 changed files with 147 additions and 350 deletions

View File

@@ -0,0 +1,34 @@
import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
import { NgClass } from '@angular/common';
export type ButtonVariant =
| 'primary'
| 'secondary'
| 'danger'
| 'danger-secondary'
| 'cancel';
@Component({
selector: 'app-button',
imports: [NgClass],
templateUrl: './button.component.html',
styleUrl: './button.component.scss',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class ButtonComponent {
readonly variant = input<ButtonVariant>('primary');
readonly type = input<'button' | 'submit' | 'reset'>('button');
readonly disabled = input(false);
protected readonly buttonClasses = computed(() => {
const variants: Record<ButtonVariant, string> = {
primary: 'btn-primary',
secondary: 'btn-outline-primary',
danger: 'btn-danger',
'danger-secondary': 'btn-outline-danger',
cancel: 'btn-secondary'
};
return ['btn', variants[this.variant()]];
});
}