openaire-library/utils/dropdown-filter/dropdown-filter.component.ts

37 lines
1.1 KiB
TypeScript

import {Component, ElementRef, Input, ViewChild} from "@angular/core";
declare var UIkit;
@Component({
selector: 'dropdown-filter',
template: `
<button class="uk-button uk-button-default uk-flex uk-flex-middle"
[class.uk-disabled]="disabled" [disabled]="disabled">
<span>{{name}}<span *ngIf="count > 0">({{count}})</span></span>
<icon [flex]="true" class="uk-margin-xsmall-left" [name]="'expand_' + (isOpen?'less':'more')"></icon>
</button>
<div #dropdownElement class="uk-dropdown" [ngClass]="dropdownClass" uk-dropdown="mode: click; delay-hide: 0;">
<ng-content></ng-content>
</div>
`
})
export class DropdownFilterComponent {
@Input()
public name;
@Input()
public count: number = 0;
@Input()
public dropdownClass: string;
@Input()
public disabled = false;
@ViewChild("dropdownElement") dropdownElement: ElementRef;
get isOpen() {
return this.dropdownElement && UIkit.dropdown(this.dropdownElement.nativeElement).isActive();
}
closeDropdown() {
UIkit.dropdown(this.dropdownElement.nativeElement).hide();
}
}