docs(menu): update some docs and styles

core/src/components.d.ts

@@ -3814,7 +3814,7 @@ declare global {
       '_setOpen': (menu: Menu, shouldOpen: boolean, animated: boolean) => Promise<boolean>;
       '_unregister': (menu: Menu) => void;
       /**
-       * Close the Menu. If no `menuId` is given as the first argument then it'll close any menu which is open. If a `menuId` is given then it'll close that exact menu.
+       * Close the menu. If no menu is specified, then it will close any menu that is open. If a menu is specified, it will close that menu.
        */
       'close': (menuId?: string | undefined) => Promise<boolean>;
       'createAnimation': (type: string, menuCmp: Menu) => Promise<Animation>;
@@ -3823,7 +3823,7 @@ declare global {
        */
       'enable': (shouldEnable: boolean, menuId?: string | undefined) => HTMLIonMenuElement | null;
       /**
-       * Used to get a menu instance. If a `menuId` is not provided then it'll return the first menu found. If a `menuId` is `left` or `right`, then it'll return the enabled menu on that side. Otherwise, if a `menuId` is provided, then it'll try to find the menu using the menu's `id` property. If a menu is not found then it'll return `null`.
+       * Used to get a menu instance. If a menu is not provided then it will return the first menu found. If the specified menu is `left` or `right`, then it will return the enabled menu on that side. Otherwise, it will try to find the menu using the menu's `id` property. If a menu is not found then it will return `null`.
        */
       'get': (menuId?: string | undefined) => HTMLIonMenuElement | null;
       /**
@@ -3835,19 +3835,19 @@ declare global {
        */
       'getOpen': () => HTMLIonMenuElement | null;
       /**
-       * If any menu is currently animating
+       * Returns true if any menu is currently animating.
        */
       'isAnimating': () => boolean;
       /**
-       * Returns true or false if the menuId is enabled or not
+       * Returns true if the specified menu is enabled.
        */
       'isEnabled': (menuId?: string | undefined) => boolean;
       /**
-       * If the menuId is not specified, it returns true if ANY menu is currenly open.
+       * Returns true if the specified menu is open. If the menu is not specified, it will return true if any menu is currently open.
        */
       'isOpen': (menuId?: string | undefined) => boolean;
       /**
-       * Open the Menu.
+       * Open the menu.
        */
       'open': (menuId?: string | undefined) => Promise<boolean>;
       'registerAnimation': (name: string, animation: AnimationBuilder) => void;

core/src/components/menu-controller/menu-controller.ts

@@ -12,8 +12,7 @@ export class MenuController {
   private menus: Menu[] = [];
   private menuAnimations = new Map<string, AnimationBuilder>();
 
-  @Prop({ connect: 'ion-animation-controller' })
+  @Prop({ connect: 'ion-animation-controller' }) animationCtrl!: HTMLIonAnimationControllerElement;
-  animationCtrl!: HTMLIonAnimationControllerElement;
 
   constructor() {
     this.registerAnimation('reveal', menuRevealAnimation);
@@ -22,7 +21,7 @@ export class MenuController {
   }
 
   /**
-   * Open the Menu.
+   * Open the menu.
    */
   @Method()
   open(menuId?: string): Promise<boolean> {
@@ -34,14 +33,12 @@ export class MenuController {
   }
 
   /**
-   * Close the Menu. If no `menuId` is given as the first
+   * Close the menu. If no menu is specified, then it will close any menu
-   * argument then it'll close any menu which is open. If a `menuId`
+   * that is open. If a menu is specified, it will close that menu.
-   * is given then it'll close that exact menu.
    */
   @Method()
   close(menuId?: string): Promise<boolean> {
     const menu = menuId ? this.get(menuId) : this.getOpen();
-
     if (menu) {
       return menu.close();
     }
@@ -80,10 +77,7 @@ export class MenuController {
    * Used to enable or disable the ability to swipe open the menu.
    */
   @Method()
-  swipeEnable(
+  swipeEnable(shouldEnable: boolean, menuId?: string): HTMLIonMenuElement | null {
-    shouldEnable: boolean,
-    menuId?: string
-  ): HTMLIonMenuElement | null {
     const menu = this.get(menuId);
     if (menu) {
       menu.swipeEnabled = shouldEnable;
@@ -92,7 +86,8 @@ export class MenuController {
   }
 
   /**
-   * If the menuId is not specified, it returns true if ANY menu is currenly open.
+   * Returns true if the specified menu is open. If the menu is not specified, it
+   * will return true if any menu is currently open.
    */
   @Method()
   isOpen(menuId?: string): boolean {
@@ -104,7 +99,7 @@ export class MenuController {
   }
 
   /**
-   * Returns true or false if the menuId is enabled or not
+   * Returns true if the specified menu is enabled.
    */
   @Method()
   isEnabled(menuId?: string): boolean {
@@ -116,11 +111,11 @@ export class MenuController {
   }
 
   /**
-   * Used to get a menu instance. If a `menuId` is not provided then it'll
+   * Used to get a menu instance. If a menu is not provided then it will
-   * return the first menu found. If a `menuId` is `left` or `right`, then
+   * return the first menu found. If the specified menu is `left` or `right`, then
-   * it'll return the enabled menu on that side. Otherwise, if a `menuId` is
+   * it will return the enabled menu on that side. Otherwise, it will try to find
-   * provided, then it'll try to find the menu using the menu's `id`
+   * the menu using the menu's `id` property. If a menu is not found then it will
-   * property. If a menu is not found then it'll return `null`.
+   * return `null`.
    */
   @Method()
   get(menuId?: string): HTMLIonMenuElement | null {
@@ -176,7 +171,7 @@ export class MenuController {
   }
 
   /**
-   * If any menu is currently animating
+   * Returns true if any menu is currently animating.
    */
   @Method()
   isAnimating(): boolean {
@@ -210,11 +205,7 @@ export class MenuController {
   }
 
   @Method()
-  _setOpen(
+  _setOpen(menu: Menu, shouldOpen: boolean, animated: boolean): Promise<boolean> {
-    menu: Menu,
-    shouldOpen: boolean,
-    animated: boolean
-  ): Promise<boolean> {
     if (this.isAnimating()) {
       return Promise.resolve(false);
     }

core/src/components/menu/menu.tsx

@@ -18,7 +18,7 @@ export class Menu {
   mode!: Mode;
 
   isAnimating = false;
-  width!: number; // TOOD
+  width!: number; // TODO
 
   backdropEl?: HTMLElement;
   menuInnerEl?: HTMLElement;
@@ -220,7 +220,7 @@ export class Menu {
   }
 
   async _setOpen(shouldOpen: boolean, animated = true): Promise<boolean> {
-    // If the menu is disabled or it is currenly being animated, let's do nothing
+    // If the menu is disabled or it is currently being animated, let's do nothing
     if (!this.isActive() || this.isAnimating || shouldOpen === this._isOpen) {
       return this._isOpen;
     }
@@ -256,10 +256,7 @@ export class Menu {
     this.animation = await this.menuCtrl!.createAnimation(this.type, this);
   }
 
-  private async startAnimation(
+  private async startAnimation(shouldOpen: boolean, animated: boolean): Promise<void> {
-    shouldOpen: boolean,
-    animated: boolean
-  ): Promise<void> {
     const ani = this.animation!.reverse(!shouldOpen);
     if (animated) {
       await ani.playAsync();