Argument of type Event is not assignable to parameter of type PanGestureEventData

I'm building an NativeScript app using angular flavor. In the HTML side I've tried to bind to an TouchEvent but this is the error that I've got. Error message:

Argument of type 'Event' is not assignable to parameter of type 'PanGestureEventData'.
  Type 'Event' is missing the following properties from type 'PanGestureEventData': deltaX, deltaY, state, view, and 4 more.ngtsc(2345)

component.html

<Label
  class="content-drawer"
  (pan)="onPanMoveContainer($event)"
  alignSelf="center"
  textAlignment="center"
  [text]="'fa-window-minimize' | fonticon"
  class="fa"
  fontSize="20"
></Label>

component.ts

import { AfterViewInit, ChangeDetectorRef, Component, OnInit } from '@angular/core';

import { BottomSheetLayoutBaseComponent } from '@loyaltyversion2/xplat/features';
import { PanState } from '@loyaltyversion2/xplat/nativescript/utils';
import { PanGestureEventData, View } from '@nativescript/core';

@Component({
  moduleId: module.id,
  selector: 'app-bottom-sheet-layout',
  templateUrl: './bottom-sheet-layout.component.html',
  styleUrls: ['./bottom-sheet-layout.scss'],
})
export class BottomSheetLayoutComponent
  extends BottomSheetLayoutBaseComponent
{
  private currentContentTransitionY = 200;

  constructor() {
    super();
  }

  onPanMoveContainer(event: PanGestureEventData) {
    // TODO: why can't we use TouchGestureEventData

    this.moveContentToLocation(this.currentContentTransitionY + event.deltaY);

    if (event.state === PanState.UP) {
      this.currentContentTransitionY =
        this.currentContentTransitionY + event.deltaY;
    }
  }
}

My workspace is generated using nx/xplat@^12.0.0 and my guess is that there should be some misconfiguration regarding my tsconfig or some linters that are setup by xplat app generator but I didn't change anything in those files. Any guesses?

I had to disable 'strictTemplates' option in 'compilerOptions' located in your 'tsconfig.js'