How to use the @material/ripple/dist/mdc.ripple.MDCRippleFoundation function in @material/ripple

getNativeControl: () => {
      if (!this.refs.nativeCb) {
        throw new Error('Invalid state for operation');
      }
      return this.refs.nativeCb;
    },
    forceLayout: () => {
      if (this.refs.nativeCb) {
        this.refs.nativeCb.offsetWidth;
      }
    },
    isAttachedToDOM: () => Boolean(this.refs.nativeCb),
  });

  // For browser compatibility we extend the default adapter which checks for css variable support.
  rippleFoundation = new MDCRippleFoundation(Object.assign(MDCRipple.createAdapter(this), {
    isUnbounded: () => true,
    isSurfaceActive: () => this.refs.nativeCb[MATCHES](':active'),
    addClass: className => {
      this.setState(prevState => ({
        classes: prevState.classes.add(className)
      }));
    },
    removeClass: className => {
      this.setState(prevState => ({
        classes: prevState.classes.remove(className)
      }));
    },
    registerInteractionHandler: (evtType, handler) => {
      this.refs.nativeCb.addEventListener(evtType, handler);
    },
    deregisterInteractionHandler: (evtType, handler) => {

initializeFoundation_ = (surface, activator) => {
      const adapter = this.createAdapter_(surface, activator);
      this.foundation_ = new MDCRippleFoundation(adapter);
      this.foundation_.init();
    }

initRipple_() {
    const adapter = Ripple.createAdapter(this)
    return new MDCRippleFoundation(adapter)
  }

deregisterInteractionHandler: (type, handler) =>
        this.nativeCb_.removeEventListener(type, handler),
      computeBoundingRect: () => {
        const { left, top } = this.root_.getBoundingClientRect()
        const DIM = 40
        return {
          top,
          left,
          right: left + DIM,
          bottom: top + DIM,
          width: DIM,
          height: DIM,
        }
      },
    })
    return new MDCRippleFoundation(adapter)
  }

initRipple_() {
    const adapter = Ripple.createAdapter(this)
    return new MDCRippleFoundation(adapter)
  }

constructor(props) {
        super(props);
        this.adapter = new FoundationAdapter();
        this.foundation = new MDCRippleFoundation(this.adapter.toObject());
    }

isUnbounded: () => true,
      isSurfaceActive: () => this.foundation_.isKeyboardActivated(),
      computeBoundingRect: () => {
        const dim = 48
        const { left, top } = this.root_.getBoundingClientRect()
        return {
          left,
          top,
          width: dim,
          height: dim,
          right: left + dim,
          bottom: left + dim,
        }
      },
    })
    return new MDCRippleFoundation(adapter)
  }