import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-625e18f4.js';
import { p as playBackOutline, b as chevronBack, d as chevronForward, f as playForwardOutline } from './index-48ae853a.js';

function paginate(totalItems, currentPage = 1, pageSize = 10) {
  // calculate total pages
  let totalPages = Math.ceil(totalItems / pageSize);
  const maxPages = totalPages;
  // ensure current page isn't out of range
  if (currentPage < 1) {
    currentPage = 1;
  }
  else if (currentPage > totalPages) {
    currentPage = totalPages;
  }
  let startPage, endPage;
  if (totalPages <= maxPages) {
    // total pages less than max so show all pages
    startPage = 1;
    endPage = totalPages;
  }
  else {
    // total pages more than max so calculate start and end pages
    let maxPagesBeforeCurrentPage = Math.floor(maxPages / 2);
    let maxPagesAfterCurrentPage = Math.ceil(maxPages / 2) - 1;
    if (currentPage <= maxPagesBeforeCurrentPage) {
      // current page near the start
      startPage = 1;
      endPage = maxPages;
    }
    else if (currentPage + maxPagesAfterCurrentPage >= totalPages) {
      // current page near the end
      startPage = totalPages - maxPages + 1;
      endPage = totalPages;
    }
    else {
      // current page somewhere in the middle
      startPage = currentPage - maxPagesBeforeCurrentPage;
      endPage = currentPage + maxPagesAfterCurrentPage;
    }
  }
  // calculate start and end item indexes
  let startIndex = (currentPage - 1) * pageSize;
  let endIndex = Math.min(startIndex + pageSize - 1, totalItems - 1);
  // create an array of pages to ng-repeat in the pager control
  let pages = Array.from(Array(endPage + 1 - startPage).keys()).map(i => startPage + i);
  // return object with all pager properties required by the view
  return {
    pages,
    endPage,
    endIndex,
    pageSize,
    startPage,
    totalPages,
    startIndex,
    totalItems,
    currentPage,
  };
}

const gascoPaginatorCss = ":host{display:block;padding:20px;background:#FFFFFF;box-shadow:0px 0px 4px rgba(0, 0, 0, 0.25)}:host(.gasco-paginator.paginator-with-select){display:flex;justify-content:space-between}:host(.gasco-paginator.paginator-with-select) .gasco-select{max-width:100px}:host(.gasco-paginator.paginator-with-select) .select-native :host(gasco-input){margin-bottom:0}:host(.gasco-paginator.paginator-with-select) .paginator-select{display:flex;align-items:center;gap:10px}:host(.gasco-paginator.paginator-with-select) .paginator-select .paginator-size{display:flex;align-items:center;gap:10px}:host button{cursor:pointer;border:none;background:transparent;display:inline-block}:host .paginator-pages{display:flex;justify-content:flex-end;align-items:center}:host .paginator-pages .wrap-buttons{display:flex}:host .paginator-pages .wrap-buttons button{display:flex;padding:6px 2px;align-items:center;transition:300ms;border-radius:4px}:host .paginator-pages .wrap-buttons button:hover{background:var(--gasco-color-light, #F1F1F1)}:host .paginator-pages .wrap-indicator{padding-left:8px;padding-right:8px;padding-top:0;padding-bottom:0;display:flex;gap:8px;direction:ltr}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host .paginator-pages .wrap-indicator{padding-left:unset;padding-right:unset;-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px}}:host .paginator-pages .wrap-indicator .paginator-indicator{position:relative;padding:2px 8px;user-select:none;z-index:1;transition:all 0.1s linear}:host .paginator-pages .wrap-indicator .paginator-indicator:hover::after{background:var(--gasco-color-light, #F1F1F1)}:host .paginator-pages .wrap-indicator .paginator-indicator.active-indicator{color:#ffffff !important}:host .paginator-pages .wrap-indicator .paginator-indicator.active-indicator::after{background:var(--gasco-color-primary, #00A3E0)}:host .paginator-pages .wrap-indicator .paginator-indicator.disabled{cursor:default;color:#bbb}:host .paginator-pages .wrap-indicator .paginator-indicator.disabled:hover{border-color:#fafafa}:host .paginator-pages .wrap-indicator .paginator-indicator::after{border-radius:32px;padding-left:4px;padding-right:4px;padding-top:4px;padding-bottom:4px;position:absolute;top:50%;left:50%;width:20px;height:20px;transform:translate(-50%, -50%);content:\" \";z-index:-1}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host .paginator-pages .wrap-indicator .paginator-indicator::after{padding-left:unset;padding-right:unset;-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px}}@media only screen and (max-width: 670px){:host(.gasco-paginator.paginator-with-select){flex-direction:column;align-items:center;gap:1rem}:host .paginator-pages .wrap-indicator .paginator-indicator{font-size:10px}}";

const GascoPaginator = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.sizeChanged = createEvent(this, "sizeChanged", 7);
    this.gascoChange = createEvent(this, "gascoChange", 7);
    this.gascoReady = createEvent(this, "gascoReady", 7);
    this.pages = [];
    this.start = 1;
    this.pageCount = 0;
    this.currentPage = 1;
    this.pageSize = 10;
    this.countPaginatorStart = 0;
    this.countPaginatorEnd = 3;
  }
  componentWillLoad() {
    if (this.totalItems) {
      this.getTotalItemCount(this.totalItems);
      const { currentPage, pageSize } = this.getTotalItemCount(this.totalItems);
      this.end = currentPage * pageSize;
    }
    this.gascoReady.emit(Object.assign(Object.assign({}, this), { start: this.start, end: this.end }));
  }
  handleItemCount(current) {
    this.getTotalItemCount(current);
  }
  getTotalItemCount(current) {
    const { totalPages, pages, currentPage, pageSize } = paginate(current, this.currentPage, this.pageSize);
    this.pages = pages;
    this.pageCount = totalPages;
    return {
      pageSize,
      currentPage
    };
  }
  getPageSelect() {
    const pageSelects = this.suggestionList
      ? this.suggestionList.map((s) => {
        return s;
      })
      : [];
    return pageSelects;
  }
  handleSelect(event, index) {
    event.preventDefault();
    this.currentPage = index;
    if (this.currentPage <= this.pageCount) {
      if (this.currentPage === 2) {
        this.start = this.currentPage * (this.pageSize / 2) + 1;
        this.end = this.currentPage * (this.pageSize / 2) + this.pageSize;
      }
      else {
        this.start = (this.currentPage - 1) * this.pageSize + 1;
        this.end = (this.currentPage - 1) * this.pageSize + this.pageSize;
      }
      this.end = this.currentPage === this.pageCount ? this.totalItems : this.end;
      if (this.end !== this.pageCount) {
        this.gascoChange.emit({ value: index + 1, start: this.start, end: this.end });
      }
    }
    event.stopPropagation();
  }
  handlePageSize(current) {
    this.pageSize = current;
    this.end = (this.currentPage - 1) * current + current;
    this.getTotalItemCount(this.totalItems);
    this.gascoChange.emit({ start: this.start, end: this.end });
  }
  handlePageSizeChange(event) {
    event.preventDefault();
    this.pageSize = event.target.value;
    event.stopPropagation();
  }
  displayedPages() {
    // if currentPage is currentPage 1
    if (this.currentPage === 1) {
      return this.pages.slice(this.currentPage - 1, this.currentPage + 2);
    }
    // if currentPage is the last currentPage
    else if (this.currentPage === this.pages.length) {
      return this.pages.slice(this.currentPage - 2, this.currentPage + 1);
    }
    // if currentPage is between 4-7
    else if (this.currentPage >= 4 && this.currentPage <= 7) {
      return this.pages.slice(this.currentPage - 2, this.currentPage + 1);
    }
    // if currentPage more than 7
    else if (this.currentPage > 7) {
      return this.pages.slice(this.currentPage - 2, this.currentPage + 1);
    }
    // if currentPage less than 4
    else {
      return this.pages.slice(this.currentPage - 1, this.currentPage + 2);
    }
  }
  renderPaginate() {
    return (h("div", { class: "paginator-pages" }, h("div", { class: "wrap-indicator" }, h("button", { disabled: this.currentPage <= 2, onClick: e => {
        const current = this.currentPage -= 2;
        this.handleSelect(e, current);
      } }, h("ion-icon", { icon: playBackOutline, lazy: false, flipRtl: true })), h("button", { disabled: this.currentPage === 1, onClick: e => {
        const current = this.currentPage -= 1;
        this.handleSelect(e, current);
      } }, h("ion-icon", { icon: chevronBack, lazy: false, flipRtl: true })), this.currentPage > 3 && (h("button", { class: "paginator-indicator", onClick: e => {
        const current = this.currentPage = 1;
        this.handleSelect(e, current);
      } }, this.pages[0])), this.currentPage > 3 && h("span", null, "..."), this.displayedPages().map(index => (h("button", { class: {
        ['paginator-indicator']: true,
        ['active-indicator']: this.currentPage === index
      }, onClick: e => {
        const current = this.currentPage = index;
        this.handleSelect(e, current);
      } }, index))), this.currentPage < this.pages.length - 2 && h("span", null, "..."), this.currentPage < this.pages.length - 2 && (h("button", { class: "paginator-indicator", onClick: e => {
        const current = this.currentPage = this.pages.length;
        this.handleSelect(e, current);
      } }, this.pages[this.pages.length - 1])), h("button", { disabled: this.currentPage === this.pages[this.pages.length - 1], onClick: e => {
        const current = this.currentPage += 1;
        this.handleSelect(e, current);
      } }, h("ion-icon", { icon: chevronForward, lazy: false, flipRtl: true })), h("button", { disabled: this.currentPage >= this.pages[this.pages.length - 2], onClick: e => {
        const current = this.currentPage += 2;
        this.handleSelect(e, current);
      } }, h("ion-icon", { icon: playForwardOutline, lazy: false, flipRtl: true })))));
  }
  renderChoice() {
    const choice = this.getPageSelect().map(n => h("option", { value: n }, n.toString()));
    return this.getPageSelect().length > 0 && (h("div", { class: "paginator-select" }, h("div", { class: "paginator-size" }, h("span", null, "Mostrar"), h("select", { onChange: event => this.handlePageSizeChange(event) }, choice)), h("div", { class: "paginator-counts" }, this.start, " - ", this.currentPage === this.pages[this.pageCount] ? this.totalItems : this.end, " de ", this.totalItems)));
  }
  render() {
    return (h(Host, Object.assign({}, this.htmlAttributes, { class: `
          gasco-paginator 
          ${this.getPageSelect().length > 0 ? 'paginator-with-select' : ''}
        ` }), this.renderChoice(), this.renderPaginate()));
  }
  get el() { return getElement(this); }
  static get watchers() { return {
    "totalItems": ["handleItemCount"],
    "pageSize": ["handlePageSize"]
  }; }
};
GascoPaginator.style = gascoPaginatorCss;

export { GascoPaginator as gasco_paginator };
