<div class="fancyGroupMenuContainer">

    <ng-content></ng-content>
    <div class="fancyGroupMenu" [ngClass]="{'dropHover': draggingRow}">
        <!-- <li class="list-group-item active">Cras justo odio</li> (mouseenter)="onGroupListMouseEnter(group,$event)"
            (mouseleave)="onGroupListMouseLeave()"-->
        <div class="menu-item" *ngFor="let group of groups" (click)="clickGroup(group)"
            (mouseup)="onGroupListMouseUp(group,$event)"
            [ngClass]="{'active': filteringGroupKey==group.groupKey,'hasData':group.rows.length>0,'altColor':usingAltColor}"
            rbjFileDragDrop="{{settings.enableFileDrop}}" (onFileDropped)="fileDroppedInGroup(group,$event)">
            {{group.groupValue}}

            <div class="dx-tag-remove-button" (click)="removeGroup(group)"
                *ngIf="group.uiAllowDeleteWhenEmpty && (!group.rows|| group.rows.length==0)"></div>

        </div>
    </div>
</div>