How to use the @material/tab.MDCTabFoundation function in @material/tab

getDefaultFoundation() {
      return new MDCTabFoundation(
        /** @type {!MDCTabAdapter} */ {
          setAttr: (attr: string, value: any) =>
            this.root.setProp(attr as any, value),
          addClass: (className: string) => this.root.addClass(className),
          removeClass: (className: string) => this.root.removeClass(className),
          hasClass: (className: string) => this.root.hasClass(className),
          activateIndicator: (previousIndicatorClientRect: ClientRect) =>
            this.tabIndicator &&
            this.tabIndicator.activate(previousIndicatorClientRect),
          deactivateIndicator: () =>
            this.tabIndicator && this.tabIndicator.deactivate(),
          notifyInteracted: () => {
            const evt = this.emit(
              'onInteraction',
              { tabId: this.id },
              true /* bubble */

const adapter: MDCTabAdapter = {
      setAttr: (attr: string, value: string) => this._getHostElement().setAttribute(attr, value),
      addClass: (className: string) => this._getHostElement().classList.add(className),
      removeClass: (className: string) => this._getHostElement().classList.remove(className),
      hasClass: (className: string) => this._getHostElement().classList.contains(className),
      activateIndicator: (previousIndicatorClientRect: ClientRect) =>
        this.tabIndicator.activate(previousIndicatorClientRect),
      deactivateIndicator: () => this.tabIndicator.deactivate(),
      notifyInteracted: () => this.interacted.emit({detail: {tabId: this.id, tab: this}}),
      getOffsetLeft: () => this._getHostElement().offsetLeft,
      getOffsetWidth: () => this._getHostElement().offsetWidth,
      getContentOffsetLeft: () => this.content.nativeElement.offsetLeft,
      getContentOffsetWidth: () => this.content.nativeElement.offsetWidth,
      focus: () => this._getHostElement().focus()
    };
    return new MDCTabFoundation(adapter);
  }