How to use the @material/tab-indicator.MDCFadingTabIndicatorFoundation function in @material/tab-indicator

getDefaultFoundation() {
    const adapter: MDCTabIndicatorAdapter = {
      addClass: (className: string) => this._getHostElement().classList.add(className),
      removeClass: (className: string) => this._getHostElement().classList.remove(className),
      computeContentClientRect: () => {
        if (!this._platform.isBrowser) { return { height: 0, width: 0, bottom: 0, top: 0, left: 0, right: 0 }; }
        return this.content.nativeElement.getBoundingClientRect();
      },
      setContentStyleProperty: (propName: string, value: string) =>
        this.content.nativeElement.style.setProperty(propName, value)
    };
    return this._fade ? new MDCFadingTabIndicatorFoundation(adapter) : new MDCSlidingTabIndicatorFoundation(adapter);
  }

rootEl.addClass(className);
        },
        removeClass: (className: string) => {
          rootEl.removeClass(className);
        },
        computeContentClientRect: () =>
          contentEl.ref
            ? contentEl.ref.getBoundingClientRect()
            : emptyClientRect,
        setContentStyleProperty: (prop: string, value: string) => {
          contentEl.setStyle(prop, value);
        }
      };

      if (props.transition === 'fade') {
        return new MDCFadingTabIndicatorFoundation(adapter);
      }

      return new MDCSlidingTabIndicatorFoundation(adapter);
    },
    api: ({

this.root.addClass(className);
      },
      removeClass: (className: string) => {
        this.root.removeClass(className);
      },
      computeContentClientRect: () =>
        this.content.ref
          ? this.content.ref.getBoundingClientRect()
          : ({} as ClientRect),
      setContentStyleProperty: (prop: string, value: string) => {
        this.content.setStyle(prop, value);
      }
    };

    if (this.props.transition === 'fade') {
      return new MDCFadingTabIndicatorFoundation(adapter);
    }

    return new MDCSlidingTabIndicatorFoundation(adapter);
  }