RRule: Use of Frequency brakes code giving Uncaught TypeError: (0 , tslib__WEBPACK_IMPORTED_MODULE_1__.__extends) is not a function

Question

We are using RRule in angular-calendar for resolving recurring meetings. We have recently updated to angular 13 from angular 9.. The rrule was working fine with angular 9 but starts breaking in angular 13.. it compiles fine but gives error Uncaught TypeError: (0 , tslib__WEBPACK_IMPORTED_MODULE_1__.__extends) is not a function.

import { Frequency } from 'rrule';

 Frequency = Frequency;

 this.recurForm = this.fb.group({
      startTime: this.startTime,
      endTime: this.endTime,
      duration: this.duration,
      frequency: [Frequency.DAILY],
      onWeekday: this.fb.array(
        [false, false, false, false, false, false, false].map(val => this.fb.control(val))
      ),
      onMonthday: this.onMonthday,
      title: this.shortDesc,
      comments: this.comments
    })

this is my package.json

{
  "name": "vcrt-ui",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "build:single-spa:vcrt-ui": "ng build vcrt-ui --configuration production",
    "serve:single-spa:vcrt-ui": "ng s --project vcrt-ui --disable-host-check --port 4200 --live-reload false"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~13.0.0-next.0",
    "@angular/cdk": "^13.3.9",
    "@angular/common": "~13.0.0-next.0",
    "@angular/compiler": "~13.0.0-next.0",
    "@angular/core": "~13.0.0-next.0",
    "@angular/forms": "~13.0.0-next.0",
    "@angular/material": "^13.3.9",
    "@angular/platform-browser": "~13.0.0-next.0",
    "@angular/platform-browser-dynamic": "~13.0.0-next.0",
    "@angular/router": "~13.0.0-next.0",
    "angular-calendar": "^0.29.0",
    "core-js": "^3.27.0",
    "date-fns": "^2.29.3",
    "file-saver": "^2.0.5",
    "moment": "^2.29.4",
    "moment-timezone": "^0.5.40",
    "ng-multiselect-dropdown": "^0.3.9",
    "rrule": "^2.6.4",
    "rxjs": "^6.5.5",
    "single-spa": ">=4.0.0",
    "single-spa-angular": "^6.3.1",
    "sweetalert2": "^11.6.16",
    "tslib": "^2.3.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-builders/custom-webpack": "13.1.0",
    "@angular-devkit/build-angular": "~13.0.0",
    "@angular/cli": "~13.0.0",
    "@angular/compiler-cli": "~13.0.0-next.0",
    "@types/jasmine": "~3.10.0",
    "@types/node": "^12.11.1",
    "jasmine-core": "~3.10.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "~1.7.0",
    "style-loader": "^3.3.1",
    "typescript": "~4.4.3"
  }
}