How to use the @rmwc/base.createFocusTrap function in @rmwc/base

componentDidMount() {
      super.componentDidMount();
      this.root.ref &&
        (this.focusTrap = createFocusTrap(this.root.ref, {
          clickOutsideDeactivates: true,
          initialFocus: undefined,
          escapeDeactivates: false,
          returnFocusOnDeactivate: false
        }));
    }

this.buttons =
      this.root.ref &&
      [].slice.call(
        this.root.ref.querySelectorAll(
          MDCDialogFoundation.strings.BUTTON_SELECTOR
        )
      );

    this.defaultButton =
      this.root.ref &&
      this.root.ref.querySelector(
        `[${MDCDialogFoundation.strings.BUTTON_DEFAULT_ATTRIBUTE}]`
      );

    this.container &&
      (this.focusTrap = createFocusTrap(this.container, {
        initialFocus: undefined,
        escapeDeactivates: false,
        clickOutsideDeactivates: true
      }));

    this.handleDocumentKeydown = this.foundation.handleDocumentKeydown.bind(
      this.foundation
    );

    document.addEventListener('keydown', this.handleDocumentKeydown);
  }

this.root.ref.querySelector(MDCDialogFoundation.strings.CONTENT_SELECTOR);
    this.buttons =
      this.root.ref &&
      [].slice.call(
        this.root.ref.querySelectorAll(
          MDCDialogFoundation.strings.BUTTON_SELECTOR
        )
      );
    this.defaultButton =
      this.root.ref &&
      this.root.ref.querySelector(
        MDCDialogFoundation.strings.DEFAULT_BUTTON_SELECTOR
      );

    this.container &&
      (this.focusTrap = createFocusTrap(this.container, {
        initialFocus: this.defaultButton || undefined,
        escapeDeactivates: false,
        clickOutsideDeactivates: true
      }));

    this.handleDocumentKeydown = this.foundation.handleDocumentKeydown.bind(
      this.foundation
    );

    document.addEventListener('keydown', this.handleDocumentKeydown);
  }