diff --git a/projects/ion/src/lib/input/input.component.spec.ts b/projects/ion/src/lib/input/input.component.spec.ts index cee13579f..7f8cc4000 100644 --- a/projects/ion/src/lib/input/input.component.spec.ts +++ b/projects/ion/src/lib/input/input.component.spec.ts @@ -1,11 +1,11 @@ -import { SafeAny } from './../utils/safe-any'; import { CommonModule } from '@angular/common'; -import { render, screen, fireEvent, within } from '@testing-library/angular'; -import userEvent from '@testing-library/user-event'; -import { IonInputComponent } from './input.component'; import { FormsModule } from '@angular/forms'; +import { fireEvent, render, screen, within } from '@testing-library/angular'; +import userEvent from '@testing-library/user-event'; +import { InputType, IonInputProps } from '../core/types/input'; import { IonSharedModule } from '../shared.module'; -import { IonInputProps, InputType } from '../core/types/input'; +import { SafeAny } from './../utils/safe-any'; +import { IonInputComponent } from './input.component'; const sut = async (customProps?: IonInputProps): Promise => { await render(IonInputComponent, { @@ -87,6 +87,21 @@ describe('IonInputComponent', () => { expect(button).toBeInTheDocument(); }); + it('should render button with md size when size is not setted', async () => { + await sut({ + inputButton: true, + inputButtonConfig: { + iconType: 'pencil', + type: 'primary', + id: 'Button', + }, + }); + const buttonContainer = screen.getByTestId('input-button'); + expect(within(buttonContainer).getByTestId('btn-Button')).toHaveClass( + 'ion-btn-md' + ); + }); + it('should emit an event when clicked input button', async () => { const clickEvent = jest.fn(); await sut({ diff --git a/projects/ion/src/lib/input/input.component.ts b/projects/ion/src/lib/input/input.component.ts index 8e0f369f2..e37a3e449 100644 --- a/projects/ion/src/lib/input/input.component.ts +++ b/projects/ion/src/lib/input/input.component.ts @@ -1,14 +1,14 @@ -import { Component, EventEmitter, Input, Output } from '@angular/core'; +import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { IonButtonProps } from '../core/types'; import { IconDirection, IconType } from '../core/types/icon'; import { InputType } from '../core/types/input'; -import { IonButtonProps } from '../core/types'; @Component({ selector: 'ion-input', templateUrl: './input.component.html', styleUrls: ['./input.component.scss'], }) -export class IonInputComponent { +export class IonInputComponent implements OnInit { @Input() placeholder?: string; @Input() button = 'Button'; @Input() iconInput: IconType; @@ -27,6 +27,10 @@ export class IonInputComponent { @Output() valueChange = new EventEmitter(); @Output() clickButton = new EventEmitter(); + ngOnInit(): void { + this.checkAndSetButtonSize(); + } + onChange(value: string): void { this.valueChange.emit(value); } @@ -43,4 +47,10 @@ export class IonInputComponent { public isClearButtonVisible(): boolean { return this.clearButton && this.value.length > 0; } + + private checkAndSetButtonSize(): void { + if (this.inputButtonConfig && !this.inputButtonConfig.size) { + this.inputButtonConfig.size = 'md'; + } + } }