Position cursor on center while dragging with mwlDraggable

In this StackBlitz I have a div with a mwlDraggable directive (see angular-draggable-droppable library).

The drag moves fine, but while dragging I need the mouse pointer to be exactly at the center of the "ghost" template, regardless of where the user started dragging the div.

For example, if I start dragging from the top/left:

While dragging I need the mouse pointer to be positioned in the center:

Any ideas how to achieve this?

<div 
    mwlDraggable 
    [ghostDragEnabled]="true"
    [ghostElementTemplate]="ghostTemplate">
    Drag me!
</div>


<ng-template #ghostTemplate>
    <div style="width:50px;height:50px;border:2px dashed black"></div>
</ng-template>

from Position cursor on center while dragging with mwlDraggable