refactor(nav, menu): swipeEnabled => swipeGesture

core/src/components.d.ts

@@ -1316,7 +1316,7 @@ declare global {
       /**
        * Used to enable or disable the ability to swipe open the menu.
        */
-      'swipeEnable': (shouldEnable: boolean, menuId?: string | undefined) => HTMLIonMenuElement | null;
+      'swipeGesture': (shouldEnable: boolean, menuId?: string | undefined) => HTMLIonMenuElement | null;
       /**
        * Toggle the menu. If it's closed, it will open, and if opened, it will close.
        */
@@ -1364,7 +1364,7 @@ declare global {
       /**
        * If true, swiping the menu is enabled. Default `true`.
        */
-      'swipeEnabled': boolean;
+      'swipeGesture': boolean;
       'toggle': (animated?: boolean) => Promise<boolean>;
       /**
        * The display type of the menu. Available options: `"overlay"`, `"reveal"`, `"push"`.
@@ -1543,7 +1543,7 @@ declare global {
       /**
        * If the nav component should allow for swipe-to-go-back
        */
-      'swipeBackEnabled': boolean;
+      'swipeGesture': boolean;
     }
 
     interface IonNote {
@@ -4839,7 +4839,7 @@ declare global {
       /**
        * If true, swiping the menu is enabled. Default `true`.
        */
-      'swipeEnabled'?: boolean;
+      'swipeGesture'?: boolean;
       /**
        * The display type of the menu. Available options: `"overlay"`, `"reveal"`, `"push"`.
        */
@@ -4967,7 +4967,7 @@ declare global {
       /**
        * If the nav component should allow for swipe-to-go-back
        */
-      'swipeBackEnabled'?: boolean;
+      'swipeGesture'?: boolean;
     }
 
     export interface IonNoteAttributes extends HTMLAttributes {

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

@@ -79,10 +79,10 @@ export class MenuController {
    * Used to enable or disable the ability to swipe open the menu.
    */
   @Method()
-  swipeEnable(shouldEnable: boolean, menuId?: string): HTMLIonMenuElement | null {
+  swipeGesture(shouldEnable: boolean, menuId?: string): HTMLIonMenuElement | null {
     const menu = this.get(menuId);
     if (menu) {
-      menu.swipeEnabled = shouldEnable;
+      menu.swipeGesture = shouldEnable;
     }
     return menu;
   }

core/src/components/menu-controller/readme.md

@@ -25,7 +25,7 @@ The MenuController makes it easy to control a Menu. Its methods can be used to d
 | `isOpen`            | Returns true if the specified menu is open. If the menu is not specified, it will return true if any menu is currently open.                                                                                                                                                                                               |
 | `open`              | Open the menu.                                                                                                                                                                                                                                                                                                             |
 | `registerAnimation` |                                                                                                                                                                                                                                                                                                                            |
-| `swipeEnable`       | Used to enable or disable the ability to swipe open the menu.                                                                                                                                                                                                                                                              |
+| `swipeGesture`      | Used to enable or disable the ability to swipe open the menu.                                                                                                                                                                                                                                                              |
 | `toggle`            | Toggle the menu. If it's closed, it will open, and if opened, it will close.                                                                                                                                                                                                                                               |
 
 

core/src/components/menu/menu.tsx

@@ -100,10 +100,10 @@ export class Menu {
   /**
    * If true, swiping the menu is enabled. Default `true`.
    */
-  @Prop() swipeEnabled = true;
+  @Prop() swipeGesture = true;
 
-  @Watch('swipeEnabled')
+  @Watch('swipeGesture')
-  protected swipeEnabledChanged() {
+  protected swipeGestureChanged() {
     this.updateState();
   }
   /**
@@ -304,7 +304,7 @@ export class Menu {
   }
 
   private canSwipe(): boolean {
-    return this.swipeEnabled && !this.isAnimating && this.isActive();
+    return this.swipeGesture && !this.isAnimating && this.isActive();
   }
 
   private canStart(detail: GestureDetail): boolean {
@@ -444,7 +444,7 @@ export class Menu {
   private updateState() {
     const isActive = this.isActive();
     if (this.gesture) {
-      this.gesture.setDisabled(!isActive || !this.swipeEnabled);
+      this.gesture.setDisabled(!isActive || !this.swipeGesture);
     }
 
     // Close menu inmediately

core/src/components/menu/readme.md

@@ -20,7 +20,7 @@ These can be controlled from the templates, or programmatically using the MenuCo
 | `maxEdgeStart` | `max-edge-start` | The edge threshold for dragging the menu open. If a drag/swipe happens over this value, the menu is not triggered. | `number`  |
 | `menuId`       | `menu-id`        | An id for the menu.                                                                                                | `string`  |
 | `side`         | `side`           | Which side of the view the menu should be placed. Default `"start"`.                                               | `Side`    |
-| `swipeEnabled` | `swipe-enabled`  | If true, swiping the menu is enabled. Default `true`.                                                              | `boolean` |
+| `swipeGesture` | `swipe-gesture`  | If true, swiping the menu is enabled. Default `true`.                                                              | `boolean` |
 | `type`         | `type`           | The display type of the menu. Available options: `"overlay"`, `"reveal"`, `"push"`.                                | `string`  |
 
 

core/src/components/menu/test/basic/index.html

@@ -124,7 +124,7 @@
       menu.get('end').type = 'reveal';
     }
     function setEnabled() {
-      menu.get('start').swipeEnabled = false;
+      menu.get('start').swipeGesture = false;
     }
   </script>
 </body>

core/src/components/menu/test/preview/index.html

@@ -124,7 +124,7 @@
       menu.get('end').type = 'reveal';
     }
     function setEnabled() {
-      menu.get('start').swipeEnabled = false;
+      menu.get('start').swipeGesture = false;
     }
   </script>
 </body>

core/src/components/nav/nav.tsx

@@ -37,11 +37,11 @@ export class Nav implements NavOutlet {
   /**
    * If the nav component should allow for swipe-to-go-back
    */
-  @Prop({ mutable: true }) swipeBackEnabled?: boolean;
+  @Prop({ mutable: true }) swipeGesture?: boolean;
-  @Watch('swipeBackEnabled')
+  @Watch('swipeGesture')
-  swipeBackEnabledChanged() {
+  swipeGestureChanged() {
     if (this.gesture) {
-      this.gesture.setDisabled(!this.swipeBackEnabled);
+      this.gesture.setDisabled(!this.swipeGesture);
     }
   }
 
@@ -95,8 +95,8 @@ export class Nav implements NavOutlet {
       !!this.win.document.querySelector('ion-router') &&
       !this.el.closest('[no-router]');
 
-    if (this.swipeBackEnabled === undefined) {
+    if (this.swipeGesture === undefined) {
-      this.swipeBackEnabled = this.config.getBoolean(
+      this.swipeGesture = this.config.getBoolean(
         'swipeBackEnabled',
         this.mode === 'ios'
       );
@@ -121,7 +121,7 @@ export class Nav implements NavOutlet {
       onMove: this.swipeBackProgress.bind(this),
       onEnd: this.swipeBackEnd.bind(this),
     });
-    this.swipeBackEnabledChanged();
+    this.swipeGestureChanged();
   }
 
   componentDidUnload() {
@@ -954,7 +954,7 @@ export class Nav implements NavOutlet {
   }
 
   private canSwipeBack(): boolean {
-    return !!this.swipeBackEnabled && !this.isTransitioning && this.canGoBack();
+    return !!this.swipeGesture && !this.isTransitioning && this.canGoBack();
   }
 
   render() {

core/src/components/nav/readme.md

@@ -10,12 +10,12 @@ Unlike RouterOutlet, Nav is not tied to a particular router. Meaning that if we
 ## Properties
 
 | Property       | Attribute       | Description                                            | Type                |
-| ------------------ | -------------------- | ------------------------------------------------------ | ------------------- |
+| -------------- | --------------- | ------------------------------------------------------ | ------------------- |
 | `animated`     | `animated`      | If the nav should animate the components or not        | `boolean`           |
 | `delegate`     | --              |                                                        | `FrameworkDelegate` |
 | `rootParams`   | --              | Any parameters for the root component                  | `ComponentProps`    |
 | `root`         | `root`          | Root NavComponent to load                              | `NavComponent`      |
-| `swipeBackEnabled` | `swipe-back-enabled` | If the nav component should allow for swipe-to-go-back | `boolean`           |
+| `swipeGesture` | `swipe-gesture` | If the nav component should allow for swipe-to-go-back | `boolean`           |
 
 
 ## Events

core/src/components/nav/test/nav-controller.spec.ts

@@ -838,7 +838,7 @@ describe('NavController', () => {
 
   describe('canSwipeBack', () => {
     it('should not swipe back when its not enabled', () => {
-      nav.swipeBackEnabled = false;
+      nav.swipeGesture = false;
 
       const view1 = mockView();
       const view2 = mockView();
@@ -849,7 +849,7 @@ describe('NavController', () => {
     });
 
     it('should swipe back when has a view to go back to', () => {
-      nav.swipeBackEnabled = true;
+      nav.swipeGesture = true;
       const view1 = mockView();
       const view2 = mockView();
       mockViews(nav, [view1, view2]);

core/src/components/tab/readme.md

@@ -13,7 +13,7 @@ See the [Tabs API Docs](../Tabs/) for more details on configuring Tabs.
 ## Properties
 
 | Property             | Attribute                | Description                                                               | Type                |
-| -------------------- | ------------------------ | ------------------------------------------------------------------------------------- | ------------------- |
+| -------------------- | ------------------------ | ------------------------------------------------------------------------- | ------------------- |
 | `active`             | `active`                 | If true, sets the tab as the active tab.                                  | `boolean`           |
 | `badgeColor`         | `badge-color`            | The badge color for the tab button.                                       | `Color`             |
 | `badge`              | `badge`                  | The badge for the tab.                                                    | `string`            |
@@ -21,7 +21,7 @@ See the [Tabs API Docs](../Tabs/) for more details on configuring Tabs.
 | `component`          | `component`              | The component to display inside of the tab.                               | `ComponentRef`      |
 | `delegate`           | --                       | hidden                                                                    | `FrameworkDelegate` |
 | `disabled`           | `disabled`               | If true, the user cannot interact with the tab. Defaults to `false`.      | `boolean`           |
-| `href`               | `href`                   | The URL which will be used as the `href` within this tab's `<ion-tab-button>` anchor. | `string`            |
+| `href`               | `href`                   | The URL which will be used as the `href` within this tab's button anchor. | `string`            |
 | `icon`               | `icon`                   | The icon for the tab.                                                     | `string`            |
 | `label`              | `label`                  | The label of the tab.                                                     | `string`            |
 | `name`               | `name`                   | The name of the tab.                                                      | `string`            |