How to use the @material/mwc-base/base-element.query function in @material/mwc-base

interface ClassInfo {
  [key: string]: boolean;
}

export abstract class TopAppBarBaseBase extends BaseElement {
  protected abstract mdcFoundation: MDCTopAppBarBaseFoundation;

  protected abstract mdcFoundationClass = MDCTopAppBarBaseFoundation;

  @query('.mdc-top-app-bar') protected mdcRoot!: HTMLElement;

  // _actionItemsSlot should have type HTMLSlotElement, but when TypeScript's
  // emitDecoratorMetadata is enabled, the HTMLSlotElement constructor will
  // be emitted into the runtime, which will cause an "HTMLSlotElement is
  // undefined" error in browsers that don't define it (e.g. Edge and IE11).
  @query('slot[name="actionItems"]') private _actionItemsSlot!: HTMLElement;

  private _scrollTarget!: HTMLElement|Window;

  @property()
  get scrollTarget() {
    return this._scrollTarget || window;
  }

  set scrollTarget(value) {
    const old = this.scrollTarget;
    this._scrollTarget = value;
    this.updateRootPosition();
    this.requestUpdate('scrollTarget', old);
  }

  private updateRootPosition() {

import {strings} from '@material/top-app-bar/constants';
import MDCTopAppBarBaseFoundation from '@material/top-app-bar/foundation';

export const passiveEventOptionsIfSupported =
    supportsPassiveEventListener ? {passive: true} : undefined;

interface ClassInfo {
  [key: string]: boolean;
}

export abstract class TopAppBarBaseBase extends BaseElement {
  protected abstract mdcFoundation: MDCTopAppBarBaseFoundation;

  protected abstract mdcFoundationClass = MDCTopAppBarBaseFoundation;

  @query('.mdc-top-app-bar') protected mdcRoot!: HTMLElement;

  // _actionItemsSlot should have type HTMLSlotElement, but when TypeScript's
  // emitDecoratorMetadata is enabled, the HTMLSlotElement constructor will
  // be emitted into the runtime, which will cause an "HTMLSlotElement is
  // undefined" error in browsers that don't define it (e.g. Edge and IE11).
  @query('slot[name="actionItems"]') private _actionItemsSlot!: HTMLElement;

  private _scrollTarget!: HTMLElement|Window;

  @property()
  get scrollTarget() {
    return this._scrollTarget || window;
  }

  set scrollTarget(value) {
    const old = this.scrollTarget;