import { h, Host } from '@stencil/core';
export class TaskbarActionsButton {
  constructor() {
    this._showDropdown = false;
    this.title = undefined;
    this.enabled = undefined;
    this.actions = undefined;
  }
  async handleKeyDown(event) {
    if (event.key === 'Escape' || event.key === 'Esc') {
      await this.hideActions();
    }
  }
  async handleClose() {
    await this.hideActions();
  }
  /**
   * Exibe a lista de ações.
   */
  async showActions() {
    this._showDropdown = true;
    requestAnimationFrame(() => {
      this._element.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'nearest' });
    });
  }
  /**
   * Esaconde a lista de ações.
   */
  async hideActions() {
    this._showDropdown = false;
  }
  /**
   * Informa se a lista de ações está aberta.
   */
  async isOpened() {
    return this._showDropdown;
  }
  controlDropdown() {
    this._showDropdown = !this._showDropdown;
  }
  loadItems() {
    return this.actions.filter(action => action !== undefined).map(action => {
      var _a;
      return {
        id: action.value,
        label: action.label,
        value: action.value,
        type: (_a = action.type) !== null && _a !== void 0 ? _a : 'item',
        children: action.children,
        iconName: action.iconName,
        subAction: action.subAction,
        group: action.group,
        disableCloseOnSelect: action.disableCloseOnSelect,
      };
    });
  }
  canShowDropdown() {
    var _a;
    return this._showDropdown && ((_a = this.actions) === null || _a === void 0 ? void 0 : _a.length) > 0;
  }
  onSelectAction(iAction) {
    const actions = this.actions.map(action => (Object.assign(Object.assign({}, action), { id: action.value })));
    const selectedAction = this.getSelectedAction(iAction.id, actions);
    this.taskbarActionSelected.emit(selectedAction);
    if (!selectedAction.disableCloseOnSelect) {
      this._showDropdown = false;
    }
  }
  getSelectedAction(id, actions) {
    let selectedItem = null;
    for (const item of actions) {
      if (item.id === id) {
        selectedItem = item;
        break;
      }
      if (!(item === null || item === void 0 ? void 0 : item.children))
        continue;
      selectedItem = this.getSelectedAction(id, item.children);
      if (selectedItem)
        break;
    }
    return selectedItem;
  }
  dropdownItemBuilder(item, _level) {
    const itemAction = this.actions.find(action => action.value === item.id);
    if (!itemAction || !itemAction.itemBuilder) {
      return undefined;
    }
    const customContent = itemAction.itemBuilder(this._element, itemAction);
    if (typeof customContent === 'string') {
      return h("div", { innerHTML: customContent });
    }
    return customContent;
  }
  /**
   * Existem algumas actions que precisam ser inicializadas assim que o componente é carregado,
   * pois necessitam de algumas informações, como por exemplo a referência do elemento taskbar-actions-button na tela.
   * É o caso do searchColumn/searhField
   */
  initializeEagerItems() {
    var _a;
    (_a = this.actions) === null || _a === void 0 ? void 0 : _a.forEach(action => {
      var _a;
      if (action && action.eagerInitialize && action.itemBuilder) {
        (_a = action.itemBuilder) === null || _a === void 0 ? void 0 : _a.call(action, this._element, action);
      }
    });
  }
  componentDidLoad() {
    this.initializeEagerItems();
  }
  componentDidRender() {
    if (this._showDropdown) {
      this.taskbarActionsOpened.emit(this._element);
    }
  }
  disconnectedCallback() {
    this.taskbarActionsButtonDisconnected.emit();
  }
  render() {
    return (h(Host, null, h("div", { class: `${this.canShowDropdown() ? ' ez-elevation--16' : ''} ez-dropdown-container` }, h("ez-button", { title: this.title, mode: 'icon', iconName: 'dots-vertical', size: 'small', enabled: this.enabled, onClick: () => this.controlDropdown() }), this.canShowDropdown() && h("ez-dropdown", { class: `ez-dropdown--sticky`, items: this.loadItems(), onEzClick: (evt) => this.onSelectAction(evt.detail), onEzOutsideClick: () => this._showDropdown = false, itemBuilder: (item, level) => this.dropdownItemBuilder(item, level) }))));
  }
  static get is() { return "taskbar-actions-button"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() {
    return {
      "$": ["taskbar-actions-button.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["taskbar-actions-button.css"]
    };
  }
  static get properties() {
    return {
      "title": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Texto que ser\u00E1 exibido no bot\u00E3o"
        },
        "attribute": "title",
        "reflect": false
      },
      "enabled": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Se false o usu\u00E1rio n\u00E3o pode interagir com o componente."
        },
        "attribute": "enabled",
        "reflect": false
      },
      "actions": {
        "type": "unknown",
        "mutable": false,
        "complexType": {
          "original": "Array<Action>",
          "resolved": "Action[]",
          "references": {
            "Array": {
              "location": "global"
            },
            "Action": {
              "location": "import",
              "path": "../../snk-taskbar"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define a lista de a\u00E7\u00F5es."
        }
      }
    };
  }
  static get states() {
    return {
      "_showDropdown": {}
    };
  }
  static get events() {
    return [{
        "method": "taskbarActionSelected",
        "name": "taskbarActionSelected",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Emitido ao selecionar uma a\u00E7\u00E3o"
        },
        "complexType": {
          "original": "Action",
          "resolved": "Action",
          "references": {
            "Action": {
              "location": "import",
              "path": "../../snk-taskbar"
            }
          }
        }
      }, {
        "method": "taskbarActionsOpened",
        "name": "taskbarActionsOpened",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Emitido ao mostrar a lista de a\u00E7\u00F5es"
        },
        "complexType": {
          "original": "HTMLElement",
          "resolved": "HTMLElement",
          "references": {
            "HTMLElement": {
              "location": "global"
            }
          }
        }
      }, {
        "method": "taskbarActionsButtonDisconnected",
        "name": "taskbarActionsButtonDisconnected",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Emitido quando componente \u00E9 desconectado da DOM"
        },
        "complexType": {
          "original": "void",
          "resolved": "void",
          "references": {}
        }
      }];
  }
  static get methods() {
    return {
      "showActions": {
        "complexType": {
          "signature": "() => Promise<void>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Exibe a lista de a\u00E7\u00F5es.",
          "tags": []
        }
      },
      "hideActions": {
        "complexType": {
          "signature": "() => Promise<void>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Esaconde a lista de a\u00E7\u00F5es.",
          "tags": []
        }
      },
      "isOpened": {
        "complexType": {
          "signature": "() => Promise<boolean>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<boolean>"
        },
        "docs": {
          "text": "Informa se a lista de a\u00E7\u00F5es est\u00E1 aberta.",
          "tags": []
        }
      }
    };
  }
  static get elementRef() { return "_element"; }
  static get listeners() {
    return [{
        "name": "keydown",
        "method": "handleKeyDown",
        "target": "window",
        "capture": false,
        "passive": false
      }, {
        "name": "ezOpenModal",
        "method": "handleClose",
        "target": "window",
        "capture": false,
        "passive": false
      }];
  }
}
