Class Menu

core/src/components/menu/menu.tsx:38–868

  shadow: true,
})
export class Menu implements ComponentInterface, MenuI {
  private animation?: Animation;
  private lastOnEnd = 0;
  private gesture?: Gesture;
  private blocker = GESTURE_CONTROLLER.createBlocker({ disableScroll: true });
  private didLoad = false;

  /**
   * Flag used to determine if an open/close
   * operation was cancelled. For example, if
   * an app calls "menu.open" then disables the menu
   * part way through the animation, then this would
   * be considered a cancelled operation.
   */
  private operationCancelled = false;

  isAnimating = false;
  width!: number;
  _isOpen = false;

  backdropEl?: HTMLIonBackdropElement;
  menuInnerEl?: HTMLElement;
  contentEl?: HTMLElement;
  lastFocus?: HTMLElement;

  private inheritedAttributes: Attributes = {};

  private handleFocus = (ev: FocusEvent) => {
    /**
     * Overlays have their own focus trapping listener
     * so we do not want the two listeners to conflict
     * with each other. If the top-most overlay that is
     * open does not contain this ion-menu, then ion-menu's
     * focus trapping should not run.
     */
    const lastOverlay = getPresentedOverlay(document);
    if (lastOverlay && !lastOverlay.contains(this.el)) {
      return;
    }

    this.trapKeyboardFocus(ev, document);
  };

  @Element() el!: HTMLIonMenuElement;

  /**
   * If true, then the menu should be
   * visible within a split pane.
   * If false, then the menu is hidden.
   * However, the menu-button/menu-toggle
   * components can be used to open the
   * menu.
   */
  @State() isPaneVisible = false;
  @State() isEndSide = false;

  /**
   * The `id` of the main content. When using