drag-drop: make the view scroll when trying to move a draggable outside the current view

Question

When trying to drag a cdkDragItem outside of the view, it does not scroll to show the rest of the cdkDrop div / the rest of the page.

 <div class="d-flex position-relative sticky-table-content gap-0 flex-nowrap justify-content-between">
              <div class="scrollable-columns" *ngFor="let object of laborList">
                  <div
                      cdkDropList
                      [cdkDropListData]="object.labours"
                      class="drag-list"
                      id="{{object.id}}"
                      (cdkDropListDropped)="drop($event, object)">
                      <div
                          class="drag-box"
                          *ngFor="let item of object.labours"
                          cdkDrag>
                          <p>{{ item.name }}</p>
                        <i class="icon icon-cancel" *ngIf="object.id !== 0" (click)="moveToBullpen(item.id, item.name, object.id, object.name)"></i>  
                      </div>
                  </div>
              </div>
            </div>

i am unable to scrollable a cdk drop list