Using Stagger animation for mat-data table rows not columns

I have a mat-table and I would like to add stagger animations to its rows, the stagger works fine but instead of the effect being implemented on rows I end up with staggered columns. how do I make the rows only become staggered.

this is ts

  trigger('listAnimation', [
    
    transition('* => *', [

      query(':enter', style({ opacity: 0 }), {optional: true}),

      query(':enter', stagger('300ms', [
        animate('1s ease-in', keyframes([
          style({opacity: 0, transform: 'translateX(-75px)', offset: 0}),
          style({opacity: .5, transform: 'translateX(35px)',  offset: 0.3}),
          style({opacity: 1, transform: 'translateX(0)',     offset: 1.0}),
        ]))]), {optional: true})
    ])
  ])

]

and this is html

<mat-header-row class="headerRow" *matHeaderRowDef="displayedColumns; sticky: true"></mat-header-row>

<mat-row [@listAnimation]="check" *matRowDef="let row; columns: displayedColumns;" (click)="onEdit(row.taxId)" class="rowR" [class.active]="clickedRows.has(row)" ></mat-row>