import { ChangeDetectionStrategy, Component, Input } from '@angular/core';

export type IArrowIconColor = 'blue' | 'gray';

@Component({
    selector: 'arrow-down-icon',
    templateUrl: './arrow-down-icon.component.html',
    styleUrls: ['./arrow-down-icon.component.scss'],
    changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ArrowDownIconComponent {
    @Input() rotated = false;
    @Input() color: IArrowIconColor = 'blue';

    get arrowClasses() {
        return {
            'arrow-svg': true,
            [`arrow-svg--${this.color}`]: true,
            'arrow-svg--rotated': this.rotated,
        };
    }
}
