MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix dropdown-filter bug with hide()

This commit is contained in:
Konstantinos Triantafyllou 2022-07-01 15:44:05 +03:00
parent ffd997dfcb
commit 995e73a1b5
2 changed files with 14 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
utils/dropdown-filter/dropdown-filter.component.ts
View File

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

20
utils/icons/icons.ts
View File

@ -210,26 +210,12 @@ export const orcid_bin = {
export const link = { export const link = {
name: 'link', name: 'link',
data: '<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="link"><path\n' + data: '<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="link"><path fill="none" stroke="#000" stroke-width="1.1" d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path fill="none" stroke="#000" stroke-width="1.1" d="M7.925,11.875 L11.925,7.975"></path></svg>'
' fill="none" stroke="#000" stroke-width="1.1"\n' +
' d="M10.625,12.375 L7.525,15.475 C6.825,16.175 5.925,16.175 5.225,15.475 L4.525,14.775 C3.825,14.074 3.825,13.175 4.525,12.475 L7.625,9.375"></path><path\n' +
' fill="none" stroke="#000" stroke-width="1.1"\n' +
' d="M9.325,7.375 L12.425,4.275 C13.125,3.575 14.025,3.575 14.724,4.275 L15.425,4.975 C16.125,5.675 16.125,6.575 15.425,7.275 L12.325,10.375"></path><path\n' +
' fill="none" stroke="#000" stroke-width="1.1"\n' +
' d="M7.925,11.875 L11.925,7.975"></path>\n' +
' </svg>'
} }
/** Add new icon under this line to be sure that it will be added on preview */ /** Add new icon under this line to be sure that it will be added on preview */
export const quotes = { export const quotes = {
name: 'quotes', name: 'quotes',
data: '<svg width="20"\n' + data: '<svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="quote-right"><path d="M17.27,7.79 C17.27,9.45 16.97,10.43 15.99,12.02 C14.98,13.64 13,15.23 11.56,15.97 L11.1,15.08 C12.34,14.2 13.14,13.51 14.02,11.82 C14.27,11.34 14.41,10.92 14.49,10.54 C14.3,10.58 14.09,10.6 13.88,10.6 C12.06,10.6 10.59,9.12 10.59,7.3 C10.59,5.48 12.06,4 13.88,4 C15.39,4 16.67,5.02 17.05,6.42 C17.19,6.82 17.27,7.27 17.27,7.79 L17.27,7.79 Z"></path><path d="M8.68,7.79 C8.68,9.45 8.38,10.43 7.4,12.02 C6.39,13.64 4.41,15.23 2.97,15.97 L2.51,15.08 C3.75,14.2 4.55,13.51 5.43,11.82 C5.68,11.34 5.82,10.92 5.9,10.54 C5.71,10.58 5.5,10.6 5.29,10.6 C3.47,10.6 2,9.12 2,7.3 C2,5.48 3.47,4 5.29,4 C6.8,4 8.08,5.02 8.46,6.42 C8.6,6.82 8.68,7.27 8.68,7.79 L8.68,7.79 Z"></path></svg>'
' height="20"\n' + }
' viewBox="0 0 20 20"\n' +
' xmlns="http://www.w3.org/2000/svg"\n' +
' data-svg="quote-right">\n' +
' <path d="M17.27,7.79 C17.27,9.45 16.97,10.43 15.99,12.02 C14.98,13.64 13,15.23 11.56,15.97 L11.1,15.08 C12.34,14.2 13.14,13.51 14.02,11.82 C14.27,11.34 14.41,10.92 14.49,10.54 C14.3,10.58 14.09,10.6 13.88,10.6 C12.06,10.6 10.59,9.12 10.59,7.3 C10.59,5.48 12.06,4 13.88,4 C15.39,4 16.67,5.02 17.05,6.42 C17.19,6.82 17.27,7.27 17.27,7.79 L17.27,7.79 Z"></path>\n' +
' <path d="M8.68,7.79 C8.68,9.45 8.38,10.43 7.4,12.02 C6.39,13.64 4.41,15.23 2.97,15.97 L2.51,15.08 C3.75,14.2 4.55,13.51 5.43,11.82 C5.68,11.34 5.82,10.92 5.9,10.54 C5.71,10.58 5.5,10.6 5.29,10.6 C3.47,10.6 2,9.12 2,7.3 C2,5.48 3.47,4 5.29,4 C6.8,4 8.08,5.02 8.46,6.42 C8.6,6.82 8.68,7.27 8.68,7.79 L8.68,7.79 Z"></path>\n' +
' </svg>'
}