Web-widget integration with Angular app help

[raybuckup]

Hi,

I am trying to use the web-widget-sdk with an angular app. Here is what I tried:

Angular component:

import { Component, ViewChild, AfterViewInit, ElementRef } from '@angular/core';
import * as widgetSdk from "@mxenabled/web-widget-sdk";

@Component({
  selector: 'app-mx',
  templateUrl: './mx.component.html',
  styleUrls: ['./mx.component.scss']
})
export class MxComponent implements AfterViewInit {
  @ViewChild("mxContainer") mxContainer!: Element;
  private mxWidget: any;
  constructor() {

  }

  ngAfterViewInit(): void {
    console.log(this.mxContainer);
      this.mxWidget = new widgetSdk.ConnectWidget({
        container: this.mxContainer,
        url: "https://int-api.mx.com/users/{{userid}}/widget_urls",
        clientId: "client_id",
        apiKey: "{{api_key}}",
        clientRedirectUrl: ""
      });

  }
}

HTML page:

<div #mxContainer></div>

Error I get when I run the app:

Do you have any documentation on how to integrate this in Angular app?