diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
index 1596c16716..9d8b854a6d 100644
--- a/packages/core/src/components.d.ts
+++ b/packages/core/src/components.d.ts
@@ -1539,37 +1539,6 @@ declare global {
}
-import {
- MenuButton as IonMenuButton
-} from './components/menu-button/menu-button';
-
-declare global {
- interface HTMLIonMenuButtonElement extends IonMenuButton, HTMLElement {
- }
- var HTMLIonMenuButtonElement: {
- prototype: HTMLIonMenuButtonElement;
- new (): HTMLIonMenuButtonElement;
- };
- interface HTMLElementTagNameMap {
- "ion-menu-button": HTMLIonMenuButtonElement;
- }
- interface ElementTagNameMap {
- "ion-menu-button": HTMLIonMenuButtonElement;
- }
- namespace JSX {
- interface IntrinsicElements {
- "ion-menu-button": JSXElements.IonMenuButtonAttributes;
- }
- }
- namespace JSXElements {
- export interface IonMenuButtonAttributes extends HTMLAttributes {
- iconName?: string;
- menu?: string;
- }
- }
-}
-
-
import {
MenuController as IonMenuController
} from './components/menu-controller/menu-controller';
@@ -1600,6 +1569,36 @@ declare global {
}
+import {
+ MenuToggle as IonMenuToggle
+} from './components/menu-toggle/menu-toggle';
+
+declare global {
+ interface HTMLIonMenuToggleElement extends IonMenuToggle, HTMLElement {
+ }
+ var HTMLIonMenuToggleElement: {
+ prototype: HTMLIonMenuToggleElement;
+ new (): HTMLIonMenuToggleElement;
+ };
+ interface HTMLElementTagNameMap {
+ "ion-menu-toggle": HTMLIonMenuToggleElement;
+ }
+ interface ElementTagNameMap {
+ "ion-menu-toggle": HTMLIonMenuToggleElement;
+ }
+ namespace JSX {
+ interface IntrinsicElements {
+ "ion-menu-toggle": JSXElements.IonMenuToggleAttributes;
+ }
+ }
+ namespace JSXElements {
+ export interface IonMenuToggleAttributes extends HTMLAttributes {
+ menu?: string;
+ }
+ }
+}
+
+
import {
Menu as IonMenu
} from './components/menu/menu';
diff --git a/packages/core/src/components/menu-button/test/basic/e2e.js b/packages/core/src/components/menu-button/test/basic/e2e.js
deleted file mode 100644
index 4c571ff22d..0000000000
--- a/packages/core/src/components/menu-button/test/basic/e2e.js
+++ /dev/null
@@ -1,31 +0,0 @@
-'use strict';
-
-const { By, until } = require('selenium-webdriver');
-const { register, Page, platforms } = require('../../../../../scripts/e2e');
-
-class E2ETestPage extends Page {
- constructor(driver, platform) {
- super(driver, `http://localhost:3333/src/components/menu/test/basic?ionicplatform=${platform}`);
- }
-
- present(buttonId) {
- this.navigate();
- this.driver.findElement(By.id(buttonId)).click();
- this.driver.wait(until.elementLocated(By.css('.menu-inner')));
- return this.driver.wait(until.elementIsVisible(this.driver.findElement(By.css('.menu-inner'))));
- }
-}
-
-platforms.forEach(platform => {
- describe('menu/basic', () => {
- register('should init', driver => {
- const page = new E2ETestPage(driver, platform);
- return page.navigate();
- });
-
- register('should open left menu', driver => {
- const page = new E2ETestPage(driver, platform);
- return page.present('left');
- });
- });
-});
diff --git a/packages/core/src/components/menu-button/menu-button.ios.scss b/packages/core/src/components/menu-toggle/menu-toggle.ios.scss
similarity index 100%
rename from packages/core/src/components/menu-button/menu-button.ios.scss
rename to packages/core/src/components/menu-toggle/menu-toggle.ios.scss
diff --git a/packages/core/src/components/menu-button/menu-button.md.scss b/packages/core/src/components/menu-toggle/menu-toggle.md.scss
similarity index 100%
rename from packages/core/src/components/menu-button/menu-button.md.scss
rename to packages/core/src/components/menu-toggle/menu-toggle.md.scss
diff --git a/packages/core/src/components/menu-button/menu-button.tsx b/packages/core/src/components/menu-toggle/menu-toggle.tsx
similarity index 58%
rename from packages/core/src/components/menu-button/menu-button.tsx
rename to packages/core/src/components/menu-toggle/menu-toggle.tsx
index d1affe1337..76082a8812 100644
--- a/packages/core/src/components/menu-button/menu-button.tsx
+++ b/packages/core/src/components/menu-toggle/menu-toggle.tsx
@@ -1,30 +1,26 @@
-import { Component, Prop } from '@stencil/core';
+import { Component, Listen, Prop } from '@stencil/core';
import { getOrAppendElement } from '../../utils/helpers';
import { StencilElement } from '../..';
@Component({
- tag: 'ion-menu-button',
+ tag: 'ion-menu-toggle',
styleUrls: {
- ios: 'menu-button.ios.scss',
- md: 'menu-button.md.scss'
+ ios: 'menu-toggle.ios.scss',
+ md: 'menu-toggle.md.scss'
},
host: {
- theme: 'back-button'
+ theme: 'menu-toggle'
}
})
-export class MenuButton {
-
- /**
- * The name of the icon to use for the button. It defaults to menu.
- */
- @Prop() iconName = 'menu';
+export class MenuToggle {
/**
* Optional property that maps to a Menu's `menuId` prop. Can also be `left` or `right` for the menu side. This is used to find the correct menu to toggle
*/
@Prop() menu: string = null;
- toggleMenu() {
+ @Listen('child:click')
+ toggle() {
const menuControllerElement = getOrAppendElement('ion-menu-controller') as HTMLIonMenuControllerElement;
return (menuControllerElement as any as StencilElement).componentOnReady().then(() => {
const menu = menuControllerElement.get(this.menu);
@@ -35,13 +31,7 @@ export class MenuButton {
}
render() {
- return [
- {
- this.toggleMenu();
- }}>
-
-
- ];
+ return ;
}
}
diff --git a/packages/core/src/components/menu-button/readme.md b/packages/core/src/components/menu-toggle/readme.md
similarity index 74%
rename from packages/core/src/components/menu-button/readme.md
rename to packages/core/src/components/menu-toggle/readme.md
index de3979e9ea..6cd5b9b881 100644
--- a/packages/core/src/components/menu-button/readme.md
+++ b/packages/core/src/components/menu-toggle/readme.md
@@ -7,13 +7,6 @@
## Properties
-#### iconName
-
-string
-
-The name of the icon to use for the button. It defaults to menu.
-
-
#### menu
string
@@ -23,13 +16,6 @@ Optional property that maps to a Menu's `menuId` prop. Can also be `left` or `ri
## Attributes
-#### iconName
-
-string
-
-The name of the icon to use for the button. It defaults to menu.
-
-
#### menu
string
diff --git a/packages/core/src/components/menu-button/test/basic/index.html b/packages/core/src/components/menu-toggle/test/basic/index.html
similarity index 84%
rename from packages/core/src/components/menu-button/test/basic/index.html
rename to packages/core/src/components/menu-toggle/test/basic/index.html
index b6390695dc..3e2b93dd09 100644
--- a/packages/core/src/components/menu-button/test/basic/index.html
+++ b/packages/core/src/components/menu-toggle/test/basic/index.html
@@ -59,11 +59,15 @@
- Menu Button - Basic
+
+
+
+
+
+
+
+ Menu Toggle - Basic
-
-
-
@@ -85,29 +89,24 @@