/*!
 * (C) Gasco https://gasco-web-component.herokuapp.com/ - MIT License
 */
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
import { j as ellipsisVertical } from './index2.js';
import { d as defineCustomElement$3 } from './gasco-item2.js';
import { d as defineCustomElement$2 } from './gasco-list2.js';
import { d as defineCustomElement$1 } from './icon.js';

const gascoTableColCss = ".sc-gasco-table-col-h{display:block;padding:16px}.table-col.sc-gasco-table-col{position:relative;display:inline-block;font-weight:400;font-size:14px;line-height:20px;color:#072531}.table-col-header.sc-gasco-table-col{font-weight:600;font-size:16px;line-height:inherit}button.sc-gasco-table-col{background-color:transparent;max-width:60px;width:100%;border:none;cursor:pointer}ion-icon.sc-gasco-table-col{font-size:26px;text-align:center;color:#4D4D4D}gasco-checkbox.sc-gasco-table-col{border:1px solid #999999}gasco-list.sc-gasco-table-col{position:absolute;z-index:10;right:1rem;width:max-content}gasco-list.sc-gasco-table-col gasco-item.sc-gasco-table-col{text-align:center}@media only screen and (max-width: 768px){.sc-gasco-table-col-h:not([action]){padding:8px 21px}.table-col-small.sc-gasco-table-col-h .table-col.sc-gasco-table-col{display:flex;align-items:center;justify-content:space-between}[action].sc-gasco-table-col-h{padding:0}button.sc-gasco-table-col{max-width:20px}gasco-list.sc-gasco-table-col{top:0;right:0.5rem}}";

const GascoTableCol = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.gascoTableTypeAction = createEvent(this, "gascoTableTypeAction", 7);
    this.showList = false;
  }
  componentWillLoad() {
    this.getRowHeader();
  }
  getRowHeader() {
    const parent = this.el.parentElement.className;
    this.isColHeader = parent.includes('table-row-header');
  }
  render() {
    const { action, typeAction } = this;
    return (h("span", { part: "native", class: {
        'table-col': true,
        [`table-col-header`]: this.isColHeader
      } }, h("slot", null), action && (h("button", { onFocus: () => this.showList = true, onBlur: () => setTimeout(() => this.showList = false, 200) }, h("ion-icon", { icon: ellipsisVertical, lazy: false }))), this.showList && (h("gasco-list", null, h("gasco-item", { class: "table-action", onClick: () => this.gascoTableTypeAction.emit({ action: 'edit', data: typeAction }) }, "Editar"), h("gasco-item", { class: "table-action", onClick: () => this.gascoTableTypeAction.emit({ action: 'delete', data: typeAction }) }, "Eliminar")))));
  }
  get el() { return this; }
  static get style() { return gascoTableColCss; }
}, [6, "gasco-table-col", {
    "action": [516],
    "typeAction": [513, "type-action"],
    "isColHeader": [32],
    "showList": [32]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["gasco-table-col", "gasco-item", "gasco-list", "ion-icon"];
  components.forEach(tagName => { switch (tagName) {
    case "gasco-table-col":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, GascoTableCol);
      }
      break;
    case "gasco-item":
      if (!customElements.get(tagName)) {
        defineCustomElement$3();
      }
      break;
    case "gasco-list":
      if (!customElements.get(tagName)) {
        defineCustomElement$2();
      }
      break;
    case "ion-icon":
      if (!customElements.get(tagName)) {
        defineCustomElement$1();
      }
      break;
  } });
}

export { GascoTableCol as G, defineCustomElement as d };
