'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const core = require('./core-c57a47e8.js');

const Dropdown = class {
    constructor(hostRef) {
        core.registerInstance(this, hostRef);
    }
    componentDidLoad() {
        this.materialsMenuEl.setPosition(this.menuPosition);
        if (this.buttonType)
            this.buttonEl[this.buttonType] = true;
    }
    componentWillUpdate() {
        if (this.buttonType)
            this.buttonEl[this.buttonType] = true;
    }
    async openMenu() {
        this.materialsMenuEl.open();
    }
    async closeMenu() {
        this.materialsMenuEl.close();
    }
    async isOpen() {
        return this.materialsMenuEl.isOpen();
    }
    renderIconHelper() {
        return this.iconHelper ? core.h("materials-icon", { style: { 'margin-left': '8px', 'margin-right': '-8px' }, name: this.iconHelper }) : '';
    }
    render() {
        return (core.h("div", null, this.iconOnly &&
            core.h("materials-icon-button", { onClick: () => this.openMenu(), icon: this.icon }), !this.iconOnly &&
            core.h("materials-button", { color: this.color, onClick: () => this.openMenu(), icon: this.icon, ref: el => this.buttonEl = el }, this.menuTitle, this.renderIconHelper()), core.h("materials-menu", { ref: el => this.materialsMenuEl = el }, core.h("slot", null))));
    }
    static get style() { return "materials-list-item>a{color:inherit;text-decoration:none}materials-menu{white-space:nowrap}"; }
};

exports.materials_dropdown = Dropdown;
