Make context menu from one row be above the next rows

I am using ngx-datatable@14.0.0 package for Angular and I try to make a context menu. Unfortunately, a context menu i displayed as it was in the layer blow the next row. Example here:

My goal is to have a context menu displayed above the rows below. Here is a link to stackbltz https://stackblitz.com/edit/angular-wohung?file=src%2Fstyles.css. You have to right click a row to trigger dropdown.

@edit

<div>
    <h3>
        Virtual Scrolling with 10k Rows
        <small>
      <a href="https://github.com/swimlane/ngx-datatable/blob/master/demo/basic/virtual.component.ts" target="_blank">
        Source
      </a>
    </small>
  </h3>
  <ngx-datatable
    class='material'
    [rows]='rows'
    [columnMode]="'force'"
    [headerHeight]="50"
    [footerHeight]="50"
    [rowHeight]="getRowHeight"
    [scrollbarV]="true"
    (tableContextmenu)="onTableContextMenu($event)">
    (page)="onPage($event)">
    <ngx-datatable-column name="Name" width="300">
      <ng-template let-value="value" let-row="row" ngx-datatable-cell-template>
        <strong>{{value}}</strong>
        <div class="wrapper">
          <div *ngIf="row.expanded" class="context">
            <div>Hello</div>
            <div>Hello</div>
            <div>Hello</div>
            <div>Hello</div>
            <div>Hello</div>
          </div>
        </div>
      </ng-template>
    </ngx-datatable-column>
  </ngx-datatable>
</div>

CSS

.datatable-row-group {
  will-change: transform;
}

.wrapper {
  position: relative;
}

.context {
  position: absolute;
  z-index: 32;
  transform: translateZ(0);
  background-color: #9cd2ff;
}

datatable-body-cell {
  overflow: visible !important;
}