import { Directive, Input, HostListener, Optional } from '@angular/core';
import { Button } from '../button/button';
import { MenuController } from './menu-controller';
import { Navbar } from '../navbar/navbar';
import { ViewController } from '../../navigation/view-controller';
/**
 * \@name MenuToggle
 * \@description
 * The `menuToggle` directive can be placed on any button to toggle a menu open or closed.
 * If it is added to the [NavBar](../../navbar/NavBar) of a page, the button will only appear
 * when the page it's in is currently a root page. See the [Menu Navigation Bar Behavior](../Menu#navigation-bar-behavior)
 * docs for more information.
 *
 *
 * \@usage
 *
 * A simple `menuToggle` button can be added using the following markup:
 *
 * ```html
 * <button ion-button menuToggle>Toggle Menu</button>
 * ```
 *
 * To toggle a specific menu by its id or side, give the `menuToggle`
 * directive a value.
 *
 * ```html
 * <button ion-button menuToggle="right">Toggle Right Menu</button>
 * ```
 *
 * If placing the `menuToggle` in a navbar or toolbar, it should be
 * placed as a child of the `<ion-navbar>` or `<ion-toolbar>`, and not in
 * the `<ion-buttons>` element:
 *
 * ```html
 * <ion-header>
 *
 *   <ion-navbar>
 *     <ion-buttons start>
 *       <button ion-button>
 *         <ion-icon name="contact"></ion-icon>
 *       </button>
 *     </ion-buttons>
 *     <button ion-button menuToggle>
 *       <ion-icon name="menu"></ion-icon>
 *     </button>
 *     <ion-title>
 *       Title
 *     </ion-title>
 *     <ion-buttons end>
 *       <button ion-button (click)="doClick()">
 *         <ion-icon name="more"></ion-icon>
 *       </button>
 *     </ion-buttons>
 *   </ion-navbar>
 *
 * </ion-header>
 * ```
 *
 * Similar to `<ion-buttons>`, the `menuToggle` can be positioned using
 * `start`, `end`, `left`, or `right`:
 *
 * ```html
 * <ion-toolbar>
 *   <button ion-button menuToggle right>
 *     <ion-icon name="menu"></ion-icon>
 *   </button>
 *   <ion-title>
 *     Title
 *   </ion-title>
 *   <ion-buttons end>
 *     <button ion-button (click)="doClick()">
 *       <ion-icon name="more"></ion-icon>
 *     </button>
 *   </ion-buttons>
 * </ion-toolbar>
 * ```
 *
 * See the [Toolbar API docs](../../toolbar/Toolbar) for more information
 * on the different positions.
 *
 * \@demo /docs/v2/demos/src/menu/
 * @see {\@link /docs/v2/components#menus Menu Component Docs}
 * @see {\@link ../../menu/Menu Menu API Docs}
 */
export class MenuToggle {
    /**
     * @param {?} _menu
     * @param {?} _viewCtrl
     * @param {?} _button
     * @param {?} _navbar
     */
    constructor(_menu, _viewCtrl, _button, _navbar) {
        this._menu = _menu;
        this._viewCtrl = _viewCtrl;
        this._button = _button;
        this._navbar = _navbar;
        this._isButton = !!_button;
        this._inNavbar = !!_navbar;
    }
    /**
     * @return {?}
     */
    ngAfterContentInit() {
        // Add the bar-button-menutoggle / button-menutoggle class
        if (this._isButton) {
            this._button._setClass('menutoggle', true);
        }
    }
    /**
     * @return {?}
     */
    toggle() {
        let /** @type {?} */ menu = this._menu.get(this.menuToggle);
        menu && menu.toggle();
    }
    /**
     * @return {?}
     */
    get isHidden() {
        if (this._inNavbar && this._viewCtrl) {
            if (this._viewCtrl.isFirst()) {
                // this is the first view, so it should always show
                return false;
            }
            let /** @type {?} */ menu = this._menu.get(this.menuToggle);
            if (menu) {
                // this is not the root view, so see if this menu
                // is configured to still be enabled if it's not the root view
                return !menu.persistent;
            }
        }
        return false;
    }
}
MenuToggle.decorators = [
    { type: Directive, args: [{
                selector: '[menuToggle]',
                host: {
                    '[hidden]': 'isHidden'
                }
            },] },
];
/** @nocollapse */
MenuToggle.ctorParameters = () => [
    { type: MenuController, },
    { type: ViewController, decorators: [{ type: Optional },] },
    { type: Button, decorators: [{ type: Optional },] },
    { type: Navbar, decorators: [{ type: Optional },] },
];
MenuToggle.propDecorators = {
    'menuToggle': [{ type: Input },],
    'toggle': [{ type: HostListener, args: ['click',] },],
};
function MenuToggle_tsickle_Closure_declarations() {
    /** @type {?} */
    MenuToggle.decorators;
    /**
     * @nocollapse
     * @type {?}
     */
    MenuToggle.ctorParameters;
    /** @type {?} */
    MenuToggle.propDecorators;
    /** @type {?} */
    MenuToggle.prototype.menuToggle;
    /** @type {?} */
    MenuToggle.prototype._isButton;
    /** @type {?} */
    MenuToggle.prototype._inNavbar;
    /** @type {?} */
    MenuToggle.prototype._menu;
    /** @type {?} */
    MenuToggle.prototype._viewCtrl;
    /** @type {?} */
    MenuToggle.prototype._button;
    /** @type {?} */
    MenuToggle.prototype._navbar;
}
//# sourceMappingURL=menu-toggle.js.map