import { h } from '@stencil/core';
import initI18n from '../../utils/i18n';
export class EzPagination {
  constructor() {
    this.handlePreviousPage = () => {
      if (this.currentPage > 1) {
        this.currentPage--;
        this.ezPageChange.emit(this.currentPage);
      }
    };
    this.handleNextPage = () => {
      if (this.currentPage < this.getTotalPages()) {
        this.currentPage++;
        this.ezPageChange.emit(this.currentPage);
      }
    };
    this.handlePageClick = (page) => {
      this.currentPage = page;
      this.ezPageChange.emit(this.currentPage);
    };
    this.type = 'default';
    this.currentPage = 1;
    this.totalItems = 0;
    this.pageSize = 10;
    this.hideInfoLabel = false;
    this.pageLimit = 10;
  }
  async componentWillLoad() {
    this.i18n = await initI18n();
  }
  getTotalPages() {
    return Math.ceil(this.totalItems / this.pageSize);
  }
  renderNextBtn() {
    return h("ez-button", { "aria-label": this.i18n('ez-pagination.nextPage'), label: this.i18n('ez-pagination.nextPage'), "data-element-id": "pagination-next-button", size: "small", iconName: "arrow-right", class: "ez-button--primary", mode: "icon", enabled: this.currentPage < this.getTotalPages(), onClick: () => this.handleNextPage() });
  }
  renderPreviousBtn() {
    return h("ez-button", { label: this.i18n('ez-pagination.previousPage'), "aria-label": this.i18n('ez-pagination.previousPage'), "data-element-id": "pagination-previous-button", size: "small", iconName: "arrow-left", mode: "icon", enabled: this.currentPage > 1, onClick: () => this.handlePreviousPage() });
  }
  renderPageButton(page) {
    return (h("button", { "aria-label": `page-${page}`, class: { 'page-button': true, 'current-page': this.currentPage === page }, onClick: () => this.handlePageClick(page) }, page));
  }
  renderEllipsis() {
    return h("span", { "aria-label": 'page-ellipsis', class: "ellipsis" }, "...");
  }
  renderPageButtons(pages) {
    return pages.map(page => (page === '...' ? this.renderEllipsis() : this.renderPageButton(page)));
  }
  renderInfoLabel(firstItem, lastItem) {
    return !this.hideInfoLabel && (h("div", { class: "info" }, h("span", { class: 'info-range' }, firstItem, " at\u00E9 ", lastItem), " de ", this.totalItems));
  }
  renderDefault() {
    const firstItem = (this.currentPage - 1) * this.pageSize + 1;
    const lastItem = Math.min(this.currentPage * this.pageSize, this.totalItems);
    return (h("div", { class: "pagination-container" }, this.renderInfoLabel(firstItem, lastItem), h("div", { class: "controls controls-compact" }, this.renderPreviousBtn(), this.renderNextBtn())));
  }
  renderNumber() {
    const totalPages = this.getTotalPages();
    const { currentPage, pageLimit } = this;
    const pages = [];
    if (totalPages <= pageLimit) {
      for (let i = 1; i <= totalPages; i++) {
        pages.push(i);
      }
    }
    else {
      const range = (start, end) => Array.from({ length: end - start + 1 }, (_, i) => start + i);
      const mainPagesCount = pageLimit - 2;
      const showLeftEllipsis = currentPage > mainPagesCount;
      const showRightEllipsis = currentPage < totalPages - mainPagesCount + 1;
      if (!showLeftEllipsis) {
        // Exibe o início da paginação sem elipse à esquerda
        // Ex: 1 2 3 4 5 6 ... 10 (pageLimit = 8)
        pages.push(...range(1, pageLimit - 2));
        pages.push('...');
        pages.push(totalPages);
      }
      else if (!showRightEllipsis) {
        // Exibe o final da paginação sem elipse à direita
        // Ex: 1 ... 5 6 7 8 9 10 (pageLimit = 8)
        pages.push(1);
        pages.push('...');
        pages.push(...range(totalPages - (pageLimit - 3), totalPages));
      }
      else {
        // Exibe elipses em ambos os lados
        // Ex: 1 ... 4 5 6 7 ... 10 (pageLimit = 8)
        const innerPagesCount = pageLimit - 4; // Contabiliza 1, ..., ..., totalPages
        const aroundCount = Math.floor((innerPagesCount - 1) / 2);
        const startPage = currentPage - aroundCount;
        const endPage = currentPage + (innerPagesCount - 1 - aroundCount);
        pages.push(1);
        pages.push('...');
        pages.push(...range(startPage, endPage));
        pages.push('...');
        pages.push(totalPages);
      }
    }
    return (h("div", { class: "pagination-container" }, h("div", { class: "controls" }, this.renderPreviousBtn(), h("div", { class: "pages-options" }, this.renderPageButtons(pages)), this.renderNextBtn())));
  }
  render() {
    return this.type === 'number' ? this.renderNumber() : this.renderDefault();
  }
  static get is() { return "ez-pagination"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() {
    return {
      "$": ["ez-pagination.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["ez-pagination.css"]
    };
  }
  static get properties() {
    return {
      "type": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "'default' | 'number'",
          "resolved": "\"default\" | \"number\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "O tipo de pagina\u00E7\u00E3o a ser renderizada.\nPode ser 'default' ou 'number'."
        },
        "attribute": "type",
        "reflect": false,
        "defaultValue": "'default'"
      },
      "currentPage": {
        "type": "number",
        "mutable": true,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "O n\u00FAmero da p\u00E1gina atual."
        },
        "attribute": "current-page",
        "reflect": false,
        "defaultValue": "1"
      },
      "totalItems": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "O n\u00FAmero total de itens."
        },
        "attribute": "total-items",
        "reflect": false,
        "defaultValue": "0"
      },
      "pageSize": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "O n\u00FAmero de itens por p\u00E1gina."
        },
        "attribute": "page-size",
        "reflect": false,
        "defaultValue": "10"
      },
      "hideInfoLabel": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Esconde as o texto de informa\u00E7\u00E3o da pagina\u00E7\u00E3o no tipo default."
        },
        "attribute": "hide-info-label",
        "reflect": false,
        "defaultValue": "false"
      },
      "pageLimit": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "O n\u00FAmero de p\u00E1ginas a serem exibidas na pagina\u00E7\u00E3o."
        },
        "attribute": "page-limit",
        "reflect": false,
        "defaultValue": "10"
      }
    };
  }
  static get events() {
    return [{
        "method": "ezPageChange",
        "name": "ezPageChange",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Evento emitido quando a p\u00E1gina \u00E9 alterada."
        },
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        }
      }];
  }
}
