cdk Перетаскивание изображения из одного div в другой в angular

Я создал два div, один из которых содержит изображение, а другой — пустой. я хочу перетащить это изображение из одного div в другой. Здесь я использую cdk drag and drop и свойство cdkDragFreeDragPosition, но меня это не устраивает, так как я ищу что-то более похожее на это эффект

<div class="example-container">
  <h1>From</h1>

  <div class="example-list1"
  id = "pic1">
    <div cdkDrag class="example-box" [cdkDragFreeDragPosition]="dragPosition">
      <img width="350px" height="250px" src="https://material.angular.io/assets/img/examples/shiba2.jpg" alt="Photo of a Shiba Inu">
    </div>
  </div>
</div>


<div class="example-container">
  <h1>To</h1>
  <div class="example-list"
  id = "pic2">
    <div cdkDrag class="example-box">
     
    </div>
  </div>
</div>

ts:
dragPosition = {x: 0, y: 0};