import { r as registerInstance, h } from './index-24b18689.js';
import { B as BackArrow, F as ForwardArrow } from './icons-212531e8.js';

const paginationCss = "sparkle-pagination{border-color:var(--line-rule-color);border-style:solid;border-width:0 0 1px;display:flex;flex-wrap:wrap-reverse;padding:var(--page-padding, 2rem 0rem) 0}sparkle-pagination .next,sparkle-pagination .previous{max-width:100%;overflow:hidden}sparkle-pagination .next{margin-left:auto}sparkle-pagination a{border-radius:4px;display:flex;align-items:flex-start;flex-direction:column;padding:1em 1.5em;color:rgb(var(--accent-color-rgb))}sparkle-pagination .previous a{padding-left:0}sparkle-pagination .next a{padding-right:0;align-items:flex-end}@media (max-width: 700px){sparkle-pagination .previous a{padding-right:.5rem}sparkle-pagination .next a{padding-left:.5rem}}@media (hover: hover){sparkle-pagination a:hover,sparkle-pagination a:active{filter:brightness(0.8)}}sparkle-pagination .pagination__title{color:var(--text-color--lighter);font-size:12px;display:block}sparkle-pagination .pagination__text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;color:var(--ion-color-sparkle)}sparkle-pagination span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}sparkle-pagination svg{fill:currentColor;flex:none;height:1em;margin-bottom:-0.125em;width:1em}sparkle-pagination .next svg{margin-left:0.5em}sparkle-pagination .previous svg{margin-right:0.5em}";

const SparklePagination = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.page = { title: null, path: null, body: null, pageInfo: null };
  }
  render() {
    const { previousText, previousUrl, nextText, nextUrl } = this.page;
    const shouldShowPrevious = previousText && previousUrl;
    const shouldShowNext = nextText && nextUrl;
    const links = [];
    if (shouldShowPrevious) {
      links.push(h("stencil-route-link", { url: previousUrl, key: "previous", class: "previous", anchorTitle: previousText }, h("div", { class: "pagination__title" }, "Previous"), h("div", { class: "pagination__text" }, h(BackArrow, null), h("span", null, previousText))));
    }
    if (shouldShowNext) {
      links.push(h("stencil-route-link", { url: nextUrl, key: "next", class: "next", anchorTitle: nextText }, h("div", { class: "pagination__title" }, "Next"), h("div", { class: "pagination__text" }, h("span", null, nextText), h(ForwardArrow, null))));
    }
    return links;
  }
};
SparklePagination.style = paginationCss;

export { SparklePagination as sparkle_pagination };
