import { h, Host } from "@stencil/core";
import { _t } from "../i18n/i18n";
export class TableColumnVisibility {
  constructor() {
    this.closeClick = () => this.closePopover();
    this.label = _t("webmapgl.table-column-visibility.label");
    this.tableId = undefined;
  }
  closePopover() {
    this.el.closest("ion-modal").dismiss();
  }
  createToggles() {
    let id = this.tableId != undefined ? `#${this.tableId}` : "";
    let selector = `gl-table${id} gl-table-column`;
    return Array.from(document.querySelectorAll(selector)).map((column) => (h("gl-table-column-visibility-toggle", { column: column, enabled: column.visible })));
  }
  render() {
    return (h(Host, null, h("ion-header", null, h("ion-toolbar", null, h("ion-title", null, this.label), h("ion-buttons", { slot: "end" }, h("ion-button", { title: _t("webmapgl.table-column-visibility.close"), onClick: this.closeClick }, h("ion-icon", { slot: "icon-only", name: "close" }))))), h("ion-content", null, h("ion-list", null, this.createToggles()))));
  }
  static get is() { return "gl-table-column-visibility"; }
  static get properties() {
    return {
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "The title of the column."
        },
        "attribute": "label",
        "reflect": false,
        "defaultValue": "_t(\"webmapgl.table-column-visibility.label\")"
      },
      "tableId": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "The id of the table this column is a part of."
        },
        "attribute": "table-id",
        "reflect": false
      }
    };
  }
  static get elementRef() { return "el"; }
}
//# sourceMappingURL=table-column-visibility.js.map
